/* =========================================================
   SHOP.CSS — магазин (тёмный матовый)
   ========================================================= */

/* Хром страницы под плавающий хедер */
body.body-shop{
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;

    background:var(--bg-page);
    color:var(--text-primary);
}
body.body-shop main{
    background:var(--bg-page);
}

/* База страницы */
.body-shop,
.shop-page{
    background:var(--bg-page) !important;
    color:var(--text-primary) !important;
}

/* Заголовок и фильтры */
.shop-page h1{
    letter-spacing:.2px;
    line-height:1.15;
    text-shadow:0 2px 16px rgba(0,0,0,.35);
}

/* Поиск */
.shop-search .form-control{
    background:var(--bg-input);
    color:var(--text-primary);
    border:1px solid var(--border-light);
}
.shop-search .form-control::placeholder{
    color:#9ea4aa;
}
.shop-search .form-control:focus{
    background:var(--bg-input-focus);
    color:#fff;
    border-color:var(--accent);
    box-shadow:0 0 0 3px var(--accent-ring);
}

/* Фильтры */
.shop-page .filter-bar .nav-link{
    background:var(--bg-input);
    color:var(--text-primary);
    border:1px solid var(--border-subtle);
    border-radius:999px;
    padding:.45rem 1rem;
    font-weight:600;
    transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.shop-page .filter-bar .nav-link:hover{ background:#3b4045; }
.shop-page .filter-bar .nav-link.active{
    background:#e5e7eb; color:#111; border-color:#e5e7eb;
}

/* =========================================================
   КАРТОЧКИ ТОВАРОВ
   ========================================================= */

.product-card{
    background:var(--bg-card);
    color:var(--text-primary);
    border:1px solid var(--border-light);
    border-radius:20px;
    overflow:hidden;
    box-shadow:
            0 8px 20px rgba(0,0,0,.35),
            0 0 0 0 rgba(234,223,204,0);
    transform:translateZ(0);
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
}
.product-card:hover{
    transform:translateY(-3px);
    box-shadow:
            0 14px 32px rgba(0,0,0,.45),
            0 0 0 2px rgba(234,223,204,.95);
    border-color:rgba(255,255,255,.55);
    filter:saturate(1.03);
}

/* Верхняя часть карточки (картинка / заглушка) */
.product-thumb{
    background:#111827;
    position:relative;
}
.product-card .product-thumb img{
    object-fit:cover;
    width:100%;
    height:100%;
    filter:saturate(.96) contrast(1.02);
}

/* Контент карточки */
.product-card .card-body{
    display:flex;
    flex-direction:column;
    gap:.45rem;
    padding:1.1rem 1.1rem 1rem;
}
.product-title,
.product-card h2.h6{
    font-weight:700;
    color:var(--text-bright);
}
.product-short,
.product-card .text-white-50.small{
    color:#d0d7e0 !important;
}
.product-card .price{
    font-size:1rem;
}

/* Кнопка деталей */
.product-more-toggle{
    color:#aeb5bc !important;
    text-decoration:none;
}
.product-more-toggle:hover{
    color:#dfe4ea !important;
}

/* CTA-кнопки (Add to cart / Buy now) */
.product-cta{
    flex-shrink:0;
}
.product-cta .btn{
    font-size:.8rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.3px;
    border-radius:13px;
    padding:.35rem .8rem;
    white-space:nowrap;
}

/* Stack buttons vertically when card is narrow */
@media (min-width:576px) and (max-width:767.98px){
    .product-cta{
        flex-direction:column;
        gap:.4rem;
    }
    .product-cta .btn{
        width:100%;
    }
}

/* Prevent price + buttons row from overflowing */
.product-card .mt-auto.d-flex{
    flex-wrap:wrap;
    gap:.5rem;
}

/* Светлая кнопка */
.shop-page .product-card .btn-light{
    background:var(--btn-bg);
    color:var(--btn-text);
    border:1px solid var(--btn-border);
    box-shadow:0 6px 14px rgba(0,0,0,.35);
}
/* Обводочная */
.shop-page .product-card .btn-outline-light{
    background:transparent;
    color:var(--text-primary);
    border:1px solid rgba(229,231,235,.6);
    box-shadow:0 6px 14px rgba(0,0,0,.35);
}

.shop-page .product-card .btn-light:hover,
.shop-page .product-card .btn-outline-light:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 20px rgba(0,0,0,.45);
}
.shop-page .product-card .btn-light:active,
.shop-page .product-card .btn-outline-light:active{
    transform:translateY(0);
    box-shadow:0 5px 12px rgba(0,0,0,.35);
}

/* Product thumbnail — always keep aspect ratio, never stretch */
.product-thumb img{
    object-fit:cover;
    width:100%;
    height:100%;
}

/* Cap product cards on ultra-wide screens */
@media (min-width:1400px){
    .shop-page .row{
        max-width:1200px;
        margin-left:auto;
        margin-right:auto;
    }
}

/* Немного адаптива */
@media (max-width:575.98px){
    .product-card .card-body{
        padding:0.9rem 0.9rem 0.8rem;
    }
}

/* Form-contrast & modal styles now in components.css */

/* =========================================================
   ADD-TO-CART ANIMATION
   ========================================================= */

/* Button pulse on add */
.atc-pulse{
    animation: atcPulse .45s ease;
}
@keyframes atcPulse{
    0%  { transform:scale(1); }
    35% { transform:scale(1.12); }
    100%{ transform:scale(1); }
}

/* Checkmark icon inside button */
.atc-check{
    display:inline-block;
    font-weight:700;
    animation: atcCheckPop .35s ease;
}
@keyframes atcCheckPop{
    0%  { opacity:0; transform:scale(0) rotate(-45deg); }
    60% { opacity:1; transform:scale(1.3) rotate(0deg); }
    100%{ opacity:1; transform:scale(1) rotate(0deg); }
}

/* Flying dot from button to cart badge */
.atc-dot{
    position:fixed;
    width:12px; height:12px;
    border-radius:50%;
    background:var(--accent, #e5e7eb);
    box-shadow:0 0 8px rgba(234,223,204,.7);
    pointer-events:none;
    z-index:9999;
    animation: atcFly .55s cubic-bezier(.22,.68,.35,1) forwards;
}
@keyframes atcFly{
    0%  { transform:translate(0,0) scale(1); opacity:1; }
    100%{ transform:translate(var(--dx), var(--dy)) scale(.4); opacity:.3; }
}

/* Badge pop when dot arrives */
.atc-badge-pop{
    animation: atcBadgePop .35s ease;
}
@keyframes atcBadgePop{
    0%  { transform:scale(1); }
    50% { transform:scale(1.5); }
    100%{ transform:scale(1); }
}

/* Success state for add-to-cart button */
.product-cta .btn.btn-success{
    background:#22c55e !important;
    border-color:#22c55e !important;
    color:#fff !important;
    transition: background .2s ease, border-color .2s ease;
}

/* Инпут количества в модалке — убираем стрелки (Chrome/Firefox) */
#qoQty::-webkit-outer-spin-button,
#qoQty::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}
#qoQty[type="number"]{
    -moz-appearance:textfield;
}