/*
Theme Name: Дружба ТЦ
Theme URI: https://drugba-loyalty.local
Author: Drugba
Description: Чистая кастомная тема для второго сайта (магазин). Шапка — по макету Figma (тёмная, акцент #6bb022).
Version: 1.0.0
Text Domain: druzhba
Tags: custom, e-commerce, dark-header
*/

/* ==========================================================================
   Базовый сброс и переменные темы
   Значения цветов/шрифтов взяты из узла Figma «Шапка» (32:1317)
   ========================================================================== */
:root {
    /* Палитра из макета */
    --bg-dark:        #090909;  /* фон шапки (Rectangle 1) */
    --accent:         #6bb022;  /* зелёный акцент (скидки, CTA, таймер) */
    --text-primary:   #f4f6ef;  /* основной текст на тёмном */
    --text-muted:     #676767;  /* плейсхолдеры, вторичный текст */
    --border-dark:    #373737;  /* обводки кнопок и разделители */
    --divider:        #242424;  /* тонкая линия под верхней навигацией */

    /* Типографика: Myriad Pro из макета */
    --font: "Myriad Pro", "MyriadPro", "Helvetica Neue", Arial, sans-serif;

    /* Геометрия */
    --header-h: 160px;
    --content-max: 1450px;   /* 1410px контента + внутренние поля 20px, как в макете 1920px */
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    font-family: var(--font);
    color: var(--text-primary);
    background: #181818;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
ul { margin: 0; padding: 0; list-style: none; }

/* Шрифты Myriad Pro, лежат в assets */
@font-face {
    font-family: "Myriad Pro";
    src: url("assets/MYRIADPRO-REGULAR.OTF") format("opentype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Myriad Pro";
    src: url("assets/MYRIADPRO-BOLD.OTF") format("opentype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Myriad Pro";
    src: url("assets/MYRIADPRO-SEMIBOLD.OTF") format("opentype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Myriad Pro";
    src: url("assets/MyriadPro-Light.otf") format("opentype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

/* Обёртка контента */
.dru-container {
    width: 100%;
    max-width: var(--content-max);
    margin: 0 auto;
    padding: 0 20px;
}

@media (max-width: 600px) {
    .dru-container { padding-left: 16px; padding-right: 16px; }
    button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
}
/* Visa Acceptance добавляет `.woocommerce { display:grid }` на экранах до 481px.
   Класс WooCommerce также находится на body, поэтому возвращаем документу нормальный поток. */
@media screen and (max-width: 481px) {
    body.woocommerce,
    body.woocommerce-page {
        display: block !important;
    }
}
/* Счётчик количества на карточке товара, в окне вариаций и в корзине. */
.dru-quantity {
    display: inline-flex;
    align-items: center;
    height: 40px;
    border: 1px solid #4b5147;
    border-radius: 10px;
    overflow: hidden;
    color: #fff;
}
.dru-quantity__button {
    width: 40px;
    height: 100%;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 22px;
    cursor: pointer;
}
.dru-quantity__button:hover:not(:disabled) { background: rgba(107, 176, 34, .18); }
.dru-quantity__button:disabled { opacity: .35; cursor: default; }
.dru-quantity__input {
    width: 46px;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 16px;
    text-align: center;
    appearance: textfield;
    -moz-appearance: textfield;
}
.dru-quantity__input::-webkit-outer-spin-button,
.dru-quantity__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.dru-quantity__input:focus-visible,
.dru-quantity__button:focus-visible { outline: 2px solid #6bb022; outline-offset: -2px; }
