/* ========================================
   СОТА-БЕЙДЖ С ЛОГОТИПОМ В ШАПКАХ МОДУЛЕЙ
   + единый размер шапок, тихий сотовый фон модулей.
   Концепт владельца: белая сота-«линза» в гекс-контуре («стенке»),
   вдавленная у краёв и выпуклая к центру, с редким бликом как у
   центральной соты главной; выделяется тенью на белой шапке.
   ======================================== */

/* Нормализация ссылки-обёртки поверх модульных стилей:
   у каждой страницы свой класс (.ifta-logo-link, .mkt-logo-link, ...)
   с разными размерами — :has() выравнивает все к одной геометрии.
   ВАЖНО: clip-path и filter:drop-shadow на ОДНОМ элементе несовместимы
   (Filter Effects §5 — тень клипается гексом), поэтому тень несёт
   ссылка, а гекс-форма — бейдж внутри. */
a:has(> .kawn-hex-badge) {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    filter: drop-shadow(0 5px 12px rgba(0, 0, 0, 0.16))
            drop-shadow(0 1px 3px rgba(0, 0, 0, 0.10));
    transition: filter 0.25s ease;
}

/* Свечение-ореол вокруг соты УБРАНО (решение владельца — «некачественно
   выглядит»); осталась только тень на ссылке. Пин против модульных
   «.x-logo-link:hover { opacity:.85 }» обязателен. */
a:has(> .kawn-hex-badge):hover {
    opacity: 1;
}

/* Внешний гекс = «стенка» в цвете активной палитры (--accent меняется
   темой ЛК): светлее сверху, глубже снизу. Сота выше шапки (76px):
   верх почти вровень, низ выступает. Клики по выступу работают. */
.kawn-hex-badge {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) translateY(9px);
    width: 82px;
    height: 95px;
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--accent) 80%, white) 0%,
        var(--accent) 55%,
        color-mix(in srgb, var(--accent) 92%, black) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.25s ease;
}

/* Внутренний гекс-«линза»: вдавлен у стенки (тёмная кромка по краю),
   к центру выпуклый (светлое пятно ловит свет выше центра) */
.kawn-hex-badge::before {
    content: '';
    position: absolute;
    inset: 4px 3.5px;
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
    background:
        radial-gradient(ellipse 90% 75% at 50% 38%,
            color-mix(in srgb, var(--accent) 82%, white) 0%,
            color-mix(in srgb, var(--accent) 92%, white) 38%,
            var(--accent) 68%,
            color-mix(in srgb, var(--accent) 95%, black) 92%,
            color-mix(in srgb, var(--accent) 90%, black) 100%);
}

/* Редкий диагональный блик ↘ — тот же, что у центральной соты главной */
@media (prefers-reduced-motion: no-preference) {
    .kawn-hex-badge::after {
        content: '';
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(115deg,
            transparent 42%,
            rgba(255, 255, 255, 0.55) 50%,
            transparent 58%) no-repeat;
        background-size: 300% 300%;
        animation: kawnBadgeSheen 9s ease-in-out infinite;
    }
    @keyframes kawnBadgeSheen {
        0%   { background-position: 100% 100%; }
        16%  { background-position: 0% 0%; }
        100% { background-position: 0% 0%; }
    }
}

/* Знак внутри соты, поверх линзы (концепт 3 БЕЗ арки, viewBox 366×462,
   центрован по каллиграфии); приподнят.
   ПОЛНАЯ ИЗОЛЯЦИЯ от легаси-ховеров модулей: у каждого модуля свои
   «.x-logo-link:hover img» — где-то filter (тень букв «переливалась»),
   у Календаря opacity:.85 (буквы бледнели), у Мактабы transform на ссылке.
   Селектор с img (0,2,2) бьёт их все (0,2,1) в ОБОИХ состояниях. */
a:has(> .kawn-hex-badge) img,
a:has(> .kawn-hex-badge):hover img {
    display: block;
    position: relative;
    z-index: 1;
    width: 66%;
    height: auto;
    opacity: 1;
    transform: translateY(-2px);
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.22));
    transition: none;
}
/* Сама ссылка тоже прибита от модульных ховеров (transform Мактабы) */
a:has(> .kawn-hex-badge),
a:has(> .kawn-hex-badge):hover {
    transform: none;
}

/* Ночная тема: цвет соты дают те же токены палитры (ночные --accent
   темнее сами по себе) — отдельных переопределений не нужно */

/* ---------- Единый размер шапок (стандарт — Ифта: 13px+50px+13px=76px).
   Большинство модулей уже так; выбившиеся приводим. ---------- */
.quran-header { height: 76px; flex-basis: 76px; }
.cal-header   { height: 76px; }
.cabinet-header { height: 76px; }

/* ---------- Тихий сотовый фон модулей ----------
   Тот же слой, что на главной (fixed, z:-1, соторешётка маской),
   но заметно слабее — не отвлекать от контента. На главной центр
   20% акцента, здесь 11% и туманнее к краям.
   ГРАБЛЯ (та же, что была на главной): слой body::before с z:-1 лежит
   ПОД непрозрачным фоном body (layout.css красит body градиентом) и
   не виден. Поэтому фон страницы переезжает с body на html, body
   развязывается. */
/* Токены --page-bg/--white ставятся темой инлайном на html — градиент
   сам адаптируется и к светлым, и к тёмным палитрам (midnight/ink).
   !important ОБЯЗАТЕЛЕН: dark-mode.css содержит «.night-mode
   { background: #111827 !important }» — он матчит и html, и body
   (класс дублируется на оба) и иначе глушит градиент и прозрачность
   (та же война была у главной: body.home-hex.night-mode !important). */
html:has(.kawn-hex-badge) {
    background: linear-gradient(135deg, var(--page-bg, #f9fafb) 0%, var(--white, #ffffff) 100%) !important;
}
body:has(.kawn-hex-badge) {
    background: transparent !important;
}
/* Полноэкранные обёртки модулей тоже красились непрозрачно (var(--page-bg)
   днём, #111827 ночью) и перекрывали слой — развязываем: фон страницы
   теперь единый на html. Селектор специфичнее модульных и dark-mode
   правил, файл грузится последним. */
body:has(.kawn-hex-badge) .cal-page,
body:has(.kawn-hex-badge) .quran-page,
body:has(.kawn-hex-badge) .hadith-page,
body:has(.kawn-hex-badge) .mujam-page,
body:has(.kawn-hex-badge) .atlas-page,
body:has(.kawn-hex-badge) .halal-page,
body:has(.kawn-hex-badge) .maliya-page,
body:has(.kawn-hex-badge) .ifta-page,
body:has(.kawn-hex-badge) .pt-page {
    background: transparent;
}
body:has(.kawn-hex-badge)::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(ellipse 66% 60% at 50% 42%,
        color-mix(in srgb, var(--accent) 10%, transparent) 0%,
        color-mix(in srgb, var(--accent) 6%, transparent) 55%,
        color-mix(in srgb, var(--accent) 2%, transparent) 100%);
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29.44' height='51'%3E%3Cpath d='M14.72 0L29.44 8.5V25.5L14.72 34 0 25.5V8.5ZM14.72 34v17' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29.44' height='51'%3E%3Cpath d='M14.72 0L29.44 8.5V25.5L14.72 34 0 25.5V8.5ZM14.72 34v17' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E");
    -webkit-mask-repeat: repeat;
    mask-repeat: repeat;
    -webkit-mask-position: 50% 50%;
    mask-position: 50% 50%;
}
/* Тёмные палитры: тёмный акцент на тёмном фоне тонет — решётку рисуем
   СВЕТЛЫМ тоном акцента (--emerald-light = primaryLight темы) и заметно
   ярче: тонкие светлые линии на тёмном требуют большей плотности */
.night-mode body:has(.kawn-hex-badge)::before {
    background: radial-gradient(ellipse 66% 60% at 50% 42%,
        color-mix(in srgb, var(--emerald-light) 13%, transparent) 0%,
        color-mix(in srgb, var(--emerald-light) 8%, transparent) 55%,
        color-mix(in srgb, var(--emerald-light) 3%, transparent) 100%);
}

/* «Фонарик»: соты фона проявляются вокруг курсора (как на главной,
   но тише — 20% против 32%, радиус 170px против 200px: богатство без
   отвлечения от чтения). Координаты --mx/--my ставит js/module-fx.js.
   Слой z:-1 ПОЗЖЕ базового ::before — рисуется поверх него, под контентом. */
@media (hover: hover) and (pointer: fine) {
    body:has(.kawn-hex-badge)::after {
        content: '';
        position: fixed;
        inset: 0;
        z-index: -1;
        pointer-events: none;
        background: radial-gradient(circle 170px at var(--mx, -999px) var(--my, -999px),
            color-mix(in srgb, var(--accent) 15%, transparent),
            transparent 72%);
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29.44' height='51'%3E%3Cpath d='M14.72 0L29.44 8.5V25.5L14.72 34 0 25.5V8.5ZM14.72 34v17' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29.44' height='51'%3E%3Cpath d='M14.72 0L29.44 8.5V25.5L14.72 34 0 25.5V8.5ZM14.72 34v17' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E");
        -webkit-mask-repeat: repeat;
        mask-repeat: repeat;
        -webkit-mask-position: 50% 50%;
        mask-position: 50% 50%;
    }
    .night-mode body:has(.kawn-hex-badge)::after {
        background: radial-gradient(circle 170px at var(--mx, -999px) var(--my, -999px),
            color-mix(in srgb, var(--emerald-light) 17%, transparent),
            transparent 72%);
    }
}

/* Компактные шапки на мобильных — сота меньше */
@media (max-width: 700px) {
    .kawn-hex-badge {
        width: 64px;
        height: 74px;
        transform: translate(-50%, -50%) translateY(7px);
    }
}