/* ============================================================
   Casinoay — Шапка сайта (Clear / Soft-tech). Глобально.
   Namespace .cay-* — чтобы не наследовать инлайн-CSS GeneratePress
   (.site-header / .main-navigation). Только токены из tokens.css.
   ============================================================ */

.cay-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: var(--glass-bg);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--border);
}

/* фолбэк без backdrop-filter — сплошная поверхность */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .cay-header { background: var(--surface); }
}

.cay-header__inner {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding-block: var(--space-3);
}

/* ---------- Лого-марка ---------- */
.cay-brand {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    text-decoration: none;
}

/* Inline-SVG логотип: viewBox 132×19 сохранён, размер по ширине (не тянем).
   Текст = --logo-ink (navy/светлый по теме), акцент = --logo-accent (индиго). */
.cay-logo {
    display: block;
    inline-size: 130px;
    block-size: auto;
}
.cay-logo__ink { fill: var(--logo-ink); }
.cay-logo__accent { fill: var(--logo-accent); }
.cay-brand:hover .cay-logo { opacity: 0.85; }
.cay-logo--footer { inline-size: 100px; }

@media (max-width: 520px) { .cay-logo { inline-size: 112px; } }

.cay-brand__mark {
    inline-size: 28px;
    block-size: 28px;
    border-radius: 8px;
    background: var(--grad);
    display: grid;
    place-items: center;
    color: #fff;
    box-shadow: var(--shadow-cta);
}
.cay-brand__mark svg { inline-size: 16px; block-size: 16px; display: block; }

.cay-brand__word {
    font-family: var(--font-display);
    font-weight: var(--fw-black);
    font-size: 18px;
    line-height: 1;
    color: var(--ink);
    letter-spacing: -0.3px;
}

/* ---------- Бургер (мобильный) ---------- */
.cay-burger {
    display: none;
    inline-size: 40px;
    block-size: 40px;
    place-items: center;
    border: 0;
    border-radius: var(--radius);
    background: var(--cta);          /* акцентная заливка — кнопка меню заметна */
    color: #fff;
    cursor: pointer;
    box-shadow: var(--shadow-cta);
}
.cay-burger:hover { background: var(--cta-hover); }
.cay-burger.is-active,
.cay-header.cay-nav-open .cay-burger { background: var(--cta-hover); }
.cay-burger svg { inline-size: 22px; block-size: 22px; display: block; }

/* ---------- Навигация (центр, занимает свободное место) ---------- */
.cay-nav {
    flex: 1 1 auto;
    min-inline-size: 0;
    display: flex;
    justify-content: center;
}

.cay-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: nowrap;
    gap: var(--space-1);
    align-items: center;
}

.cay-nav__list li { margin: 0; position: relative; }

/* Каждый пункт — единый flex-ряд: лейбл + каретка на ОДНОЙ линии, по центру.
   Без этого JS-каретка (inline-grid) переносилась под блочный <a> → пункты
   с дропдауном становились выше, а «Блог» (без каретки) проваливался ниже. */
.cay-nav__list > li { display: flex; align-items: center; }
.cay-nav .sub-menu > li { display: flex; flex-wrap: wrap; align-items: center; }
.cay-nav .sub-menu > li > a { flex: 1 1 auto; }

.cay-nav__list a {
    display: block;
    color: var(--text);
    text-decoration: none;
    font-family: var(--font-display);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-sm);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius);
    transition: color 0.15s ease, background-color 0.15s ease;
}
.cay-nav__list a:hover { color: var(--accent); background: var(--accent-tint); }
.cay-nav__list .current-menu-item > a,
.cay-nav__list .current-menu-ancestor > a { color: var(--accent); }

/* ВАЖНО: GeneratePress инлайном (wp_head) красит ВСЕ нативные button —
   button{background-color:#55555e} (тёмно-серый). Это и давало «тёмные боксы»
   у каждой каретки. Кнопки внутри .cay-nav (только тогглы подменю) жёстко
   сбрасываем: селектор .cay-nav button (0,1,1) перебивает button (0,0,1).
   Кнопки в .cay-actions (тема/поиск/язык) — вне .cay-nav, со своими фонами,
   не затрагиваются. */
.cay-nav button {
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    color: inherit;
    font: inherit;
}

/* Каретка-тоггл подменю (рендерится сервером — inc/nav-walker.php) */
.cay-subtoggle {
    display: inline-grid;
    place-items: center;
    inline-size: 1.5rem;
    block-size: 1.5rem;
    margin-inline-start: calc(-1 * var(--space-1));
    color: var(--muted);
    cursor: pointer;
}
.cay-subtoggle__icon { inline-size: 14px; block-size: 14px; transition: transform 0.15s ease; }

/* цвет каретки наследует акцент пункта при hover/раскрытии */
.menu-item-has-children:hover > .cay-subtoggle,
.menu-item-has-children:focus-within > .cay-subtoggle { color: var(--accent); }

/* поворот шеврона на 180° при раскрытии (hover на десктопе или .is-open) */
.menu-item-has-children:hover > .cay-subtoggle .cay-subtoggle__icon,
.menu-item-has-children.is-open > .cay-subtoggle .cay-subtoggle__icon { transform: rotate(180deg); }

/* Выпадающее подменю */
.cay-nav .sub-menu {
    position: absolute;
    inset-inline-start: 0;
    top: calc(100% + 6px);
    min-inline-size: 220px;
    list-style: none;
    margin: 0;
    padding: var(--space-2);
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-float);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity 0.14s ease, transform 0.14s ease, visibility 0.14s;
    z-index: 1001;
}
.cay-nav__list > li:hover > .sub-menu,
.cay-nav__list > li:focus-within > .sub-menu,
.cay-nav__list > li.is-open > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.cay-nav .sub-menu a { font-weight: var(--fw-medium); white-space: nowrap; }

/* Третий уровень (Криптовалюта → Bitcoin/Ethereum/USDT): флайаут вправо */
.cay-nav .sub-menu .sub-menu {
    inset-inline-start: 100%;
    top: calc(0px - var(--space-2));
}
.cay-nav .sub-menu > li:hover > .sub-menu,
.cay-nav .sub-menu > li:focus-within > .sub-menu,
.cay-nav .sub-menu > li.is-open > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* ---------- Действия (поиск + тема + CTA) ---------- */
.cay-actions { flex: none; display: flex; align-items: center; gap: var(--space-2); }

/* ---------- Поиск ---------- */
.cay-search { position: relative; display: flex; align-items: center; }

.cay-search__toggle {
    inline-size: 34px;
    block-size: 34px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--text);
    cursor: pointer;
    transition: color 0.15s ease, background-color 0.15s ease;
}
.cay-search__toggle:hover { color: var(--accent); background: var(--accent-tint); }
.cay-search__toggle svg { inline-size: 17px; block-size: 17px; display: block; }

.cay-search__form {
    position: absolute;
    inset-inline-end: 0;
    top: calc(100% + 8px);
    display: flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2);
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    box-shadow: var(--shadow-float);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity 0.14s ease, transform 0.14s ease, visibility 0.14s;
    z-index: 1001;
}
.cay-search.is-open .cay-search__form { opacity: 1; visibility: visible; transform: translateY(0); }

.cay-search__input {
    inline-size: min(60vw, 240px);
    border: 0;
    background: transparent;
    color: var(--ink);
    padding: var(--space-2) var(--space-3);
    font-size: var(--fs-sm);
}
.cay-search__input:focus { outline: none; }

.cay-search__submit {
    inline-size: 36px;
    block-size: 36px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: var(--radius-pill);
    background: var(--accent);
    color: #fff;
    cursor: pointer;
}
.cay-search__submit svg { inline-size: 16px; block-size: 16px; }

.theme-toggle {
    block-size: 32px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding-inline: var(--space-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    background: transparent;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}
.theme-toggle:hover { border-color: var(--accent); background: var(--accent-tint); }
.theme-toggle svg { inline-size: 16px; block-size: 16px; display: block; transition: opacity 0.15s ease, color 0.15s ease; }

/* ОБЕ иконки видны; подсвечиваем иконку ТЕКУЩЕЙ темы (солнце=светлая, луна=тёмная) */
.theme-toggle__sun,
.theme-toggle__moon { display: block; }
.theme-toggle__sun { color: #E8A91D; opacity: 1; }
.theme-toggle__moon { color: var(--muted); opacity: 0.4; }
[data-theme="dark"] .theme-toggle__sun { color: var(--muted); opacity: 0.4; }
[data-theme="dark"] .theme-toggle__moon { color: #AEB9FF; opacity: 1; }

/* ---------- Переключатель языков ---------- */
.cay-lang { position: relative; display: flex; align-items: center; }

.cay-lang__toggle {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    block-size: 34px;
    padding-inline: var(--space-2);
    border: 0;
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font-family: var(--font-display);
    font-weight: var(--fw-bold);
    font-size: var(--fs-sm);
    transition: color 0.15s ease, background-color 0.15s ease;
}
.cay-lang__toggle:hover { color: var(--accent); background: var(--accent-tint); }
.cay-lang__toggle svg { inline-size: 17px; block-size: 17px; }

.cay-lang__list {
    position: absolute;
    inset-inline-end: 0;
    top: calc(100% + 8px);
    min-inline-size: 140px;
    list-style: none;
    margin: 0;
    padding: var(--space-2);
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-float);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity 0.14s ease, transform 0.14s ease, visibility 0.14s;
    z-index: 1001;
}
.cay-lang.is-open .cay-lang__list { opacity: 1; visibility: visible; transform: translateY(0); }

.cay-lang__link {
    display: block;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius);
    color: var(--text);
    text-decoration: none;
    font-size: var(--fs-sm);
}
.cay-lang__link:hover { background: var(--accent-tint); color: var(--accent); }
.cay-lang__link.is-current { color: var(--accent); font-weight: var(--fw-semibold); }

.cay-header__cta { padding: var(--space-2) var(--space-4); font-size: var(--fs-sm); }

/* ---------- Мобильная навигация (бургер + дерево) ---------- */
@media (max-width: 900px) {
    .cay-burger { display: inline-grid; }
    .cay-brand { margin-inline-end: auto; }      /* бренд слева, бургер перед ним */

    .cay-nav {
        position: absolute;
        inset-inline: 0;
        top: 100%;
        margin: 0;
        background: var(--surface);
        border-bottom: 1px solid var(--border);
        box-shadow: var(--shadow-float);
        max-block-size: calc(100vh - 100%);
        overflow-y: auto;
        display: none;
    }
    .cay-header.cay-nav-open .cay-nav { display: block; }

    .cay-nav__list { flex-direction: column; align-items: stretch; gap: 0; padding: var(--space-3); }
    .cay-nav__list > li { display: flex; flex-wrap: wrap; align-items: center; border-bottom: 1px solid var(--border-soft); }
    .cay-nav__list > li:last-child { border-bottom: 0; }
    .cay-nav__list a { flex: 1; padding-block: var(--space-3); }

    .cay-subtoggle { inline-size: 2.75rem; block-size: 2.75rem; }

    /* подменю — статичный вложенный список, раскрывается кареткой */
    .cay-nav .sub-menu {
        position: static;
        flex-basis: 100%;
        min-inline-size: 0;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: 0;
        border-radius: 0;
        padding: 0 0 var(--space-2) var(--space-4);
        display: none;
    }
    .cay-nav__list > li.is-open > .sub-menu { display: flex; }

    /* 3-й уровень на мобиле: статичный, раскрывается кареткой, глубже отступ */
    .cay-nav .sub-menu .sub-menu { inset-inline-start: auto; top: auto; padding-inline-start: var(--space-5); }
    .cay-nav .sub-menu > li.is-open > .sub-menu { display: flex; }

    .cay-search__input { inline-size: min(70vw, 220px); }
}

@media (min-width: 901px) {
    .cay-burger { display: none !important; }
}

/* На совсем узких — прячем CTA-пилюлю (бургер открывает разделы) */
@media (max-width: 520px) {
    .cay-header__cta { display: none; }
}