/*
 * ЗаймЛайт — витрина базы «КИ + Личный кабинет» в тёмно-оранжевой палитре.
 * Подключается раскладкой zaimlite поверх cabinet.html базы: вёрстка и логика
 * остаются базовыми (обновятся вместе с базой), здесь только цвета и картинки.
 * Пути к картинкам — относительно этого файла (assets/zl/).
 */
:root{
  --bg:#0A0A0B; --bg-deep:#141416; --card:#151517;
  --ink:#FFFFFF; --ink-soft:#DCDCE0; --muted:#A9A9B0; --faint:#77777F;
  --line:rgba(255,255,255,.11); --line-soft:rgba(255,255,255,.06);
  --brand:#FF8A1F; --brand-600:#F26A10; --brand-700:#FFB23A;
  --brand-50:rgba(255,138,31,.08); --brand-100:rgba(255,138,31,.14); --brand-200:rgba(255,138,31,.26);
  --navy:#0A0A0B; --navy2:#121214;
  --green:#3DDC84; --green-600:#2FC26F; --green-50:rgba(61,220,132,.12);
  --amber:#FFB23A; --amber-50:rgba(255,178,58,.12);
  --red:#FF6B5E; --red-50:rgba(255,107,94,.12);
  --sh-1:0 1px 2px rgba(0,0,0,.4);
  --sh-2:0 10px 30px -12px rgba(0,0,0,.7);
  --sh-3:0 24px 60px -18px rgba(0,0,0,.85);
  --sh-brand:0 10px 26px -6px rgba(255,138,31,.45);
  --zl-grad:linear-gradient(90deg,#FFC23D,#FF8A1F 55%,#F26A10);
  --zl-head:Montserrat,Manrope,system-ui,sans-serif;
  color-scheme:dark;
}
body{background:var(--bg)}

/* ---- шапка ---- */
header.site{background:rgba(10,10,11,.86);border-bottom-color:var(--line-soft)}
.hd-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.zl-logo-mark{width:28px;height:auto}
.zl-logo-text{font:800 19px/1 var(--zl-head);letter-spacing:-.02em;color:#fff}
.hd-back{background:var(--card);border-color:var(--line)}
.hd-avatar-init,.avatar-init{background:var(--zl-grad);color:#141414}
.lk-link{color:var(--brand-700)}
.welcome-toast{background:#18181A;border:1px solid var(--line)}

/* ---- бегущая строка выдач ---- */
.live-marquee{background:#111113;border-bottom-color:var(--line-soft)}
.live-marquee-item{color:var(--muted);border-right-color:var(--line-soft)}
.live-marquee-item b{color:var(--brand-700)}

/* ---- блок рейтинга: фон из макета ЗаймЛайт ---- */
.rate-hero{background:#0A0A0B url(vitrina-hero.webp) center/cover no-repeat}
.rate-hero::before{display:none}
.rate-hero h1{font-family:var(--zl-head);font-weight:900;letter-spacing:-.03em;text-shadow:0 2px 20px rgba(0,0,0,.6)}
.rate-hero-desc,.perk-hint{color:#E2E2E6}
.gauge-card{background:rgba(12,12,14,.55);border-color:rgba(255,138,31,.45);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  box-shadow:0 0 30px -10px rgba(255,138,31,.5)}
.gauge-trk{stroke:rgba(255,255,255,.14)}
.gauge-val{stroke:#FF8A1F;filter:drop-shadow(0 0 6px rgba(255,138,31,.6))}
.gauge-sub{color:#FFB86B}
.gauge-badge.pending{background:rgba(255,255,255,.1);color:#D9D9DE}
.refine-link{color:#FFB86B}
.perk-btn{background:var(--zl-grad);color:#141414;box-shadow:0 8px 22px -8px rgba(255,138,31,.6)}
.perk-ico{background:rgba(255,138,31,.18);color:#FFB23A}
#perkCard{background:rgba(12,12,14,.55);border-color:rgba(255,138,31,.35)}

/* ---- «Готов одобрить»: карточка-картинка из макета ---- */
.ready-title{font-family:var(--zl-head);color:#fff}
.ready-card{display:block;padding:0;border:0;background:none;box-shadow:none;border-radius:24px;overflow:visible;
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.5));transition:transform .2s}
.ready-card:hover{transform:translateY(-2px)}
.zl-ready-img{display:block;width:calc(100% + 8%);height:auto;max-width:none;margin:-3.2% -4% -3.6%}

/* ---- витрина офферов ---- */
.offers-head h2{font-family:var(--zl-head);font-weight:900;letter-spacing:-.03em;font-size:clamp(16px,4.5vw,26px);line-height:1.15}
.off-arrow-svg path{stroke:#FF8A1F;filter:drop-shadow(0 0 3px rgba(255,138,31,.6))}
.offers-head h2 .hl-blue{color:var(--brand)}
.off-besthead span{background:linear-gradient(110deg,#F26A10,#FF8A1F 25%,#FFC23D 50%,#FF8A1F 75%,#F26A10);background-size:300% 100%;
  color:#141414;box-shadow:0 4px 18px rgba(255,138,31,.35)}
.off-card{background:var(--card);border-color:var(--line-soft);box-shadow:none}
.off-card.best{background-image:linear-gradient(var(--card),var(--card)),linear-gradient(110deg,#F26A10,#FFC23D 40%,#FF8A1F 75%,#F26A10);
  box-shadow:0 0 24px -8px rgba(255,138,31,.55)}
.off-best-badge{background:var(--zl-grad);color:#141414}
.off-best-badge img{filter:hue-rotate(170deg) saturate(1.4) brightness(1.1)}
.off-logo{background:#fff;border-color:transparent}
.off-sum .sum{color:#fff}
.off-free .free{background:rgba(255,138,31,.14);color:#FFB23A}
.get{background:var(--zl-grad);color:#141414;box-shadow:0 6px 18px -6px rgba(255,138,31,.6)}
.get:hover{background:var(--zl-grad);filter:brightness(1.06)}
.off-card.hl{box-shadow:inset 0 0 0 2px var(--green),0 4px 16px rgba(61,220,132,.18)}
.spin{border-color:var(--line);border-top-color:var(--brand)}

/* ---- условия, подвал ---- */
.terms-card{background:var(--card);border-color:var(--line-soft)}
footer.site{border-top-color:var(--line-soft)}
footer.site a{color:var(--brand-700)}

/* ---- модалки ---- */
.modal{background:#151517;border:1px solid var(--line)}
.modal-x{background:rgba(255,255,255,.06)}
.field input{background:#1B1B1E;border-color:var(--line);color:#fff}
.field input:focus{background:#1F1F22;border-color:var(--brand)}
.submit-btn{background:var(--zl-grad);color:#141414}
.submit-btn:hover{background:var(--zl-grad);filter:brightness(1.06)}
.lk-empty{background:rgba(255,138,31,.06);border-color:rgba(255,138,31,.25)}
#perkStep .perk-ico{background:rgba(255,138,31,.14);color:#FFB23A}

/* ---- чат ---- */
.chat-fab{background:var(--zl-grad);color:#141414;box-shadow:0 8px 26px rgba(255,138,31,.45)}
.chat-fab:hover{background:var(--zl-grad);filter:brightness(1.06)}
.chat-panel{background:#151517;border:1px solid var(--line)}
.chat-panel-head{background:#1B1B1E;border-bottom-color:var(--line)}
.chat-panel-body{background:#0F0F11}
.chat-msg-bubble{background:#1E1E21;color:#fff}
.chat-msg.me .chat-msg-bubble{background:var(--zl-grad);color:#141414}
.chat-input-row{background:#151517;border-top-color:var(--line)}
.chat-input{background:#1B1B1E;border-color:var(--line);color:#fff}
.chat-input:focus{background:#1F1F22;border-color:var(--brand)}

@media (min-width:900px){
  .ready-card{max-width:760px;margin:0 auto}
}
