/* ===============================================================
   ОБОЛОЧКА САЙТА — шапка, меню, раскладка, док
   Раньше всё это жило инлайном в header.php. Теперь здесь.
   =============================================================== */

/* ------------------------------------------------------------- шапка */
.tb{
  position:sticky; top:0; z-index:70;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  border-bottom:1px solid var(--t-line);
}
.tb-in{
  max-width:1360px; margin:0 auto; padding:0 clamp(16px,4vw,54px);
  display:flex; align-items:center; gap:20px; height:70px;
}

.tb-logo{
  font-family:'Manrope',sans-serif; font-weight:800; font-size:19px;
  letter-spacing:-.04em; color:var(--t-ink); text-decoration:none;
  display:flex; align-items:center; gap:9px; white-space:nowrap;
}
.tb-logo em{ font-style:normal; color:var(--t-accent); }
.tb-logo i{
  width:27px; height:27px; border-radius:9px; background:var(--t-ink);
  color:#fff; display:grid; place-items:center; font-style:normal;
  font-size:13px; font-weight:600;
  transition:transform .5s var(--t-ease);
}
.tb-logo:hover i{ transform:rotate(-12deg) scale(1.08); }

.tb-nav{ display:flex; gap:2px; margin-left:14px; }
.tb-nav a{
  font-size:14.5px; color:var(--t-ink-2); padding:8px 13px;
  border-radius:9px; text-decoration:none; transition:.16s;
}
.tb-nav a:hover{ color:var(--t-ink); background:var(--t-soft); }
.tb-nav a.on{ color:var(--t-accent); background:var(--t-accent-soft); font-weight:600; }

.tb-r{ margin-left:auto; display:flex; align-items:center; gap:9px; }

.tb-lang{ display:flex; gap:2px; }
.tb-lang a{
  font-size:12.5px; font-weight:600; color:var(--t-ink-3);
  padding:6px 9px; border-radius:8px; text-decoration:none; transition:.16s;
}
.tb-lang a:hover{ background:var(--t-soft); color:var(--t-ink); }
.tb-lang a.on{ color:var(--t-ink); background:var(--t-soft); }

/* значок входа */
.tb-icon{
  width:42px; height:42px; border-radius:50%; flex-shrink:0;
  display:grid; place-items:center; cursor:pointer;
  border:1px solid var(--t-line-2); background:var(--t-bg); color:var(--t-ink);
  transition:transform .25s var(--t-ease), background .2s, border-color .2s, color .2s;
}
.tb-icon:hover{ background:var(--t-ink); color:#fff; border-color:var(--t-ink); transform:translateY(-2px); }
.tb-icon:active{ transform:scale(.94); }

/* аватар авторизованного */
.tb-ava{
  width:42px; height:42px; border-radius:50%; flex-shrink:0;
  display:grid; place-items:center; cursor:pointer; text-decoration:none;
  background:var(--t-accent); color:#fff; font-weight:700; font-size:16px;
  border:0; transition:transform .25s var(--t-ease), box-shadow .3s;
}
.tb-ava:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(79,70,229,.35); }

.tb-burger{
  display:none; width:42px; height:42px; border-radius:50%;
  border:1px solid var(--t-line-2); background:var(--t-bg);
  place-items:center; cursor:pointer; color:var(--t-ink);
}

/* ---------------------------------------------------------- раскладка */
.shell{
  max-width:1360px; margin:0 auto;
  padding:0 clamp(16px,4vw,54px) 40px;
}

/* --------------------------------------------------------- нижняя шторка */
.dr-scrim{
  position:fixed; inset:0; z-index:88;
  background:rgba(13,15,20,.42); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  opacity:0; pointer-events:none; transition:opacity .3s var(--t-ease);
}
.dr-scrim.on{ opacity:1; pointer-events:auto; }

.dr{
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  background:var(--t-card); border-radius:24px 24px 0 0;
  padding:10px 20px calc(20px + var(--t-safe-b));
  transform:translateY(102%); transition:transform .42s var(--t-ease);
  max-height:86vh; overflow:auto;
}
.dr.on{ transform:none; }
.dr-grab{ width:40px; height:4px; border-radius:99px; background:var(--t-line-2); margin:6px auto 16px; }
.dr a{
  display:flex; align-items:center; justify-content:space-between;
  padding:15px 4px; font-size:18px; font-weight:700; letter-spacing:-.02em;
  color:var(--t-ink); text-decoration:none; border-bottom:1px solid var(--t-line);
}
.dr a span{ color:var(--t-ink-3); font-size:14px; font-weight:400; }
.dr-acts{ display:grid; gap:9px; margin-top:18px; }
.dr-acts .btn-primary,.dr-acts .btn-secondary{ justify-content:center; padding:15px; font-size:16px; }

/* ---------------------------------------------------------------- док */
.dock{
  position:fixed; left:12px; right:12px; bottom:calc(12px + var(--t-safe-b));
  z-index:60; display:none; gap:9px;
  background:rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
  border:1px solid var(--t-line); border-radius:17px; padding:9px;
  box-shadow:0 10px 34px rgba(13,15,20,.14);
  transform:translateY(140%); transition:transform .45s var(--t-ease);
}
.dock.on{ transform:none; }
.dock .btn-primary,.dock .btn-secondary{ flex:1; justify-content:center; padding:14px; }

/* --------------------------------------------------------------- подвал */
.ft{ border-top:1px solid var(--t-line); margin-top:20px; }
.ft-in{
  max-width:1360px; margin:0 auto; padding:24px clamp(16px,4vw,54px);
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  font-size:13px; color:var(--t-ink-3);
}
.ft-in a{ color:var(--t-ink-2); text-decoration:none; }
.ft-in a:hover{ color:var(--t-accent); }

/* =============================================================== мобайл */


@media(prefers-reduced-motion:reduce){
  .dr,.dock,.dr-scrim{ transition:none; }
}


/* ---- раскладка после переезда навигации в шапку ---- */
.layout{
    display:block !important;
    max-width:1360px;
    margin:0 auto;
    padding:0 clamp(16px,4vw,54px) 40px;
    gap:0 !important;
}
.content{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
}
.sidebar{ display:none !important; }
.profile-panel{
    position:fixed !important;
    top:70px; right:0; bottom:0; width:300px;
    z-index:50; overflow:auto;
    background:var(--t-card) !important;
    border-left:1px solid var(--t-line) !important;
    border-radius:0 !important;
    backdrop-filter:none !important;
}
body:has(.profile-panel) .layout{ padding-right:calc(300px + clamp(16px,4vw,54px)); }
.glass-card,.agency-home{
    background:transparent !important;
    border:0 !important;
    backdrop-filter:none !important;
    padding:0 !important;
}
.profile-top-glow,.agency-glow,.heartbeat-line,.topbar-border{ display:none !important; }

@media(max-width:1100px){
    .profile-panel{ display:none !important; }
    body:has(.profile-panel) .layout{ padding-right:clamp(16px,4vw,54px); }
}

/* ---- бейдж модуля: был абсолютным поверх заголовка, ставим в поток ---- */
.module-badge{
  position:static !important;
  display:inline-block !important;
  top:auto !important; left:auto !important;
  margin:0 0 16px !important;
  padding:6px 14px !important;
  border-radius:100px !important;
  background:var(--t-accent-soft) !important;
  border:0 !important;
  color:var(--t-accent) !important;
  font-size:11.5px !important;
  font-weight:700 !important;
  letter-spacing:.09em !important;
  text-transform:uppercase !important;
  width:fit-content !important;
  z-index:1 !important;
}

/* карточки-обёртки страниц: убираем стеклянный фон, но НЕ ломаем внутренние отступы */
.glass-card{ background:transparent !important; border:0 !important; }
.layout > .content > .glass-card,
.agency-home{ padding:0 !important; }

/* ===============================================================
   ПОДВАЛ САЙТА
   =============================================================== */
.ft-site{
  border-top:1px solid var(--t-line);
  background:var(--t-soft);
  margin-top:clamp(36px,6vw,80px);
}
.ft-wrap{
  max-width:1360px; margin:0 auto;
  padding:clamp(30px,4.5vw,56px) clamp(16px,4vw,54px) clamp(22px,3vw,36px);
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1.35fr; gap:clamp(22px,3vw,44px);
}
.ft-brand p{ color:var(--t-ink-2); font-size:14px; line-height:1.55; margin:14px 0 0; max-width:34ch; }
.ft-logo{
  display:inline-flex; align-items:center; gap:9px; text-decoration:none;
  font-weight:800; font-size:18px; letter-spacing:-.04em; color:var(--t-ink);
}
.ft-logo em{ font-style:normal; color:var(--t-accent); }
.ft-logo i{
  width:26px; height:26px; border-radius:9px; background:var(--t-ink); color:#fff;
  display:grid; place-items:center; font-style:normal; font-size:12.5px; font-weight:600;
}

.ft-col{ display:flex; flex-direction:column; gap:9px; }
.ft-col h4{
  font-size:11.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--t-ink-3); margin:0 0 5px;
}
.ft-col a{ color:var(--t-ink-2); text-decoration:none; font-size:14px; transition:color .16s; width:fit-content; }
.ft-col a:hover{ color:var(--t-accent); }

.ft-contact{ display:flex; align-items:flex-start; gap:11px; }
.ft-contact--static{ cursor:default; }
.ft-ic{
  width:31px; height:31px; border-radius:10px; flex-shrink:0;
  background:var(--t-bg); border:1px solid var(--t-line);
  display:grid; place-items:center; color:var(--t-accent);
}
.ft-contact span:last-child{ display:flex; flex-direction:column; line-height:1.4; font-size:14px; color:var(--t-ink); }
.ft-contact b{ font-size:11px; font-weight:600; color:var(--t-ink-3); letter-spacing:.03em; }
.ft-contact--static span:last-child{ color:var(--t-ink-2); }
.ft-cta{ margin-top:6px; justify-content:center; width:fit-content; }

.ft-bottom{
  border-top:1px solid var(--t-line-2);
  max-width:1360px; margin:0 auto;
  padding:18px clamp(16px,4vw,54px);
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  font-size:12.5px; color:var(--t-ink-3);
}

@media(max-width:1000px){ .ft-wrap{ grid-template-columns:1fr 1fr; } }


/* ===============================================================
   МОБИЛЬНАЯ ВЕРСИЯ ОБОЛОЧКИ
   =============================================================== */




/* ===============================================================
   ИСПРАВЛЕНИЯ ПО СКРИНШОТАМ
   =============================================================== */

/* --- отступ контента от липкой шапки --- */
.layout,
.shell,
main.content{ padding-top:clamp(18px,2.4vw,32px); }

/* --- модалки правил: текст был почти невидим --- */
.rules-modal, .modal, .custom-modal{ color:var(--t-ink); }
.rules-content, .rules-content *,
.rules-box, .rules-box *,
.rules-item, .rules-item *{
  color:var(--t-ink-2) !important;
  opacity:1 !important;
}
.rules-content h1,.rules-content h2,.rules-content h3,.rules-content h4,
.rules-content b,.rules-content strong,
.rules-box h1,.rules-box h2,.rules-box h3,.rules-box h4,
.rules-item h3,.rules-item h4,.rules-item b,.rules-item strong{
  color:var(--t-accent) !important;
  font-weight:700 !important;
}
.rules-content li,.rules-box li,.rules-item li{ color:var(--t-ink-2) !important; }
.rules-num,.rules-item .num{ color:var(--t-accent) !important; opacity:1 !important; }

/* показ модалок — на случай, если старые правила потерялись */
.modal.show{ display:flex !important; }
.rules-modal.active{ opacity:1 !important; visibility:visible !important; pointer-events:auto !important; }
.custom-modal[style*="flex"]{ display:flex !important; }

/* --- мобильная шапка: кнопки в фирменных цветах, а не бирюзовые --- */


/* ===============================================================
   v6 — ПРЕМИУМ-ОБОЛОЧКА
   =============================================================== */

/* --- фон страницы: перестаём быть монотонно-белыми --- */
body{
  background:
    radial-gradient(900px 460px at 12% -8%,  rgba(79,70,229,.055), transparent 62%),
    radial-gradient(760px 420px at 92% 2%,   rgba(14,155,168,.045), transparent 60%),
    linear-gradient(180deg, #FBFBFD 0%, #FFFFFF 320px) !important;
  background-attachment:fixed, fixed, scroll !important;
}

/* --- шапка: стеклянная, с тонкой линией и подсветкой --- */
.tb{
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
          backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid transparent;
  transition:box-shadow .3s var(--t-ease), background .3s;
}
.tb::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg,
    transparent, var(--t-line) 12%, var(--t-line-2) 50%, var(--t-line) 88%, transparent);
}
.tb.scrolled{
  background:rgba(255,255,255,.9);
  box-shadow:0 6px 28px rgba(13,15,20,.07);
}

/* логотип-плашка с мягким свечением */
.tb-logo i{
  background:linear-gradient(145deg,#1B1E27,#0D0F14);
  box-shadow:0 4px 12px rgba(13,15,20,.22), inset 0 1px 0 rgba(255,255,255,.14);
}

/* пункты меню: подчёркивание выезжает */
.tb-nav a{ position:relative; }
.tb-nav a::after{
  content:""; position:absolute; left:13px; right:13px; bottom:3px; height:2px;
  border-radius:2px; background:var(--t-accent);
  transform:scaleX(0); transform-origin:left; opacity:0;
  transition:transform .32s var(--t-ease), opacity .25s;
}
.tb-nav a:hover::after{ transform:scaleX(1); opacity:1; }
.tb-nav a.on{ background:transparent; color:var(--t-ink); font-weight:600; }
.tb-nav a.on::after{ transform:scaleX(1); opacity:1; }

/* переключатель языка — сегмент-контрол */
.tb-lang{
  background:var(--t-soft); border-radius:100px; padding:3px;
  border:1px solid var(--t-line);
}
.tb-lang a{ border-radius:100px; padding:5px 11px; transition:.22s var(--t-ease); }
.tb-lang a.on{ background:var(--t-bg); color:var(--t-ink); box-shadow:0 1px 3px rgba(13,15,20,.10); }

/* кнопка входа */
.tb-icon{
  background:linear-gradient(145deg,#5A51EA,#4338CA);
  color:#fff !important; border:0 !important;
  box-shadow:0 4px 14px rgba(79,70,229,.32);
}
.tb-icon:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(79,70,229,.44);
  background:linear-gradient(145deg,#6A60F0,#4F46E5);
}
.tb-ava{
  background:linear-gradient(145deg,#5A51EA,#4338CA);
  box-shadow:0 4px 14px rgba(79,70,229,.32);
}

/* ===============================================================
   SEO-БЛОК — уезжал в левый край на всех страницах
   =============================================================== */
/* v18: блок теперь выводится внутри <main>, отступы берёт от колонки */
.seo-block{
  max-width:none;
  padding-left:0; padding-right:0;
  box-sizing:border-box;
}
.seo-faq details{ background:var(--t-card); }

/* ===============================================================
   НОВЫЕ СВЕТЛЫЕ БЕЙДЖИ — тёмная подложка больше не нужна
   =============================================================== */
:root{ --t-well:#F7F9FC; }
.hf-well, .well, .media, .agency-card img{
  background:#F7F9FC !important;
}
.hf-well{ box-shadow:inset 0 0 0 1px rgba(13,15,20,.05); }

/* картинка в широкой карточке больше не обрезается */
.hf-wide .hf-field{ display:flex; align-items:center; }
.hf-wide .hf-well{ width:100%; }
.hf-wide .hf-well img{
  aspect-ratio:1/1 !important;
  height:auto !important;
  min-height:0 !important;
  object-fit:contain !important;
}

/* --- гарантированный отступ от липкой шапки на всех страницах --- */
body > .layout,
body > .shell,
body > .wrap,
.layout.rules-page,
.layout > .content,
main.content{
  padding-top:clamp(26px,3.2vw,44px) !important;
}
/* но не удваиваем, если .content лежит внутри .layout */
.layout > .content{ padding-top:0 !important; }

/* бейдж-кикер не должен липнуть к шапке */
.module-badge{ margin-top:0 !important; }

/* ===============================================================
   v7 — ЧИТАЕМОСТЬ СТАТУСОВ И ЗАЩИТА ОТ ЛИШНИХ МОДАЛОК
   =============================================================== */

/* статус внутри модалок и карточек был серым на сером */
.request-modal-content .status,
.request-modal-content .req-status,
.custom-modal .status,
.modal-box .status,
.status-box, .req-state{
  display:block;
  background:var(--t-soft) !important;
  border:1px solid var(--t-line) !important;
  border-radius:12px;
  padding:13px 16px;
  color:var(--t-ink) !important;
  font-weight:600;
  font-size:14.5px;
  opacity:1 !important;
}
/* строки «ID / Название / Создано / Статус» */
.request-modal-content b,
.request-modal-content strong{ color:var(--t-ink-2) !important; font-weight:600; }
.request-modal-content{ color:var(--t-ink) !important; }
.request-modal-content *{ opacity:1 !important; }

/* модалки скрыты, пока их явно не открыли */
.request-modal:not(.active),
.rules-modal:not(.active){ display:none !important; }
.modal:not(.show):not(.active),
.custom-modal:not(.active):not([style*="display: flex"]):not([style*="display:flex"]){ display:none !important; }
/* ↑ исключение для style.display='flex': так открывают окна пополнения,
   транзакций и пароля (includes/profile-panel.php). Без него !important
   перебивал инлайн-стиль, и «Пополнить» не открывалось никогда. */

/* ===============================================================
   v8 — МОБИЛЬНАЯ ШАПКА И ОСТАТКИ СТАРОЙ ТЕМЫ
   =============================================================== */

/* Кнопка входа на мобильном была белой иконкой на белом фоне.
   Единое правило вместо двух конфликтующих. */


/* тёмный блок героя на мобильном — остаток старой тёмной темы */


/* бирюзовые градиентные кнопки, оставшиеся в модулях */
.btn-primary, .agency-btn, .ip-main-btn, .dev-btn,
button[class*="-btn"]{
  background-image:none !important;
}
.agency-btn, .ip-main-btn, .dev-btn{
  background:var(--t-ink) !important;
  color:#fff !important;
}

/* v18. Правило выше убирает градиенты, но у части кнопок градиент был
   единственным фоном — оставался белый текст на прозрачном.
   Возвращаем им сплошной фон из темы: основная — чёрная, вторичная — с рамкой.
   Список — по факту проверки в браузере, а не по догадке. */
.btn-primary, .lead-buy-btn, .order-details-btn, .warning-btn, .rules-btn,
.filter-btn.active{
  background-color:var(--t-ink) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.filter-btn:not(.active), .modal-close-btn{
  background-color:transparent !important;
  color:var(--t-ink) !important;
  border:1px solid var(--t-line-2) !important;
}
.filter-btn.active .filter-desc{ color:rgba(255,255,255,.7) !important; }
.filter-btn:not(.active) .filter-desc{ color:var(--t-ink-3) !important; }

/* статусы-плашки без текста в реквизитах админки */
.crm-badge:empty, .status:empty, .badge:empty{ display:none !important; }
.crm-badge, .status-pill{
  color:var(--t-ink-2) !important;
  background:var(--t-soft) !important;
  border:1px solid var(--t-line) !important;
  padding:5px 12px !important;
  border-radius:100px !important;
  font-size:12px !important;
  font-weight:600 !important;
}

/* меню пользователя — только для телефона (см. mobile.css) */
.um,.um-scrim{ display:none; }