/* Страницы каталогов в цветах своего каталога — те же схемы, что в карточках на главной.
   Каждая тема задаёт переменные, общие правила ниже их применяют. */

/* полоска «Цветовая схема» под названием */
.kat-scheme{ display:flex; align-items:center; gap:12px; margin-top:14px; }
.kat-scheme-label{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--text-ink-muted); flex:none; }
.kat-swatches{ display:flex; gap:4px; height:26px; flex:0 1 220px; min-width:0; }
.kat-swatches i{ flex:1 1 0; border-radius:7px; box-shadow:inset 0 0 0 1px var(--k-swatch-line, rgba(58,31,42,.14)); }

/* ---------- темы ---------- */
.kat--barbie{                       /* фуксия, розовый, тиффани, голубой */
  --rose:#E0568A; --rose-deep:#C23C73; --gold:#4DBBD6; --sage:#4DBBD6;
  --paper:#FFF5F8; --paper-2:#FBE0E8; --paper-3:#F9D3DE; --line-ink:#F3CAD6;
  --text-ink:#3A1F2A; --text-ink-muted:#7A5C68; --ink:#3A1F2A;
  --k-hero:linear-gradient(180deg,#F9C9D6 0%,#FBDDE6 70%,#FFF5F8 100%);
  --k-accent:#E0568A; --k-accent-ink:#fff; --k-surface:#fff; --k-nav:rgba(255,245,248,.94);
  --k-folder-bg:#DDF5F8; --k-folder-ink:#1F5F70; --k-icon:#4DBBD6; --k-glow:rgba(224,86,138,.45); --k-cta:#3A1F2A;
}
.kat--oblako{                       /* белый, небесный, голубой */
  --rose:#4F7EAD; --rose-deep:#3F6A96; --gold:#6F93B5; --sage:#6F93B5;
  --paper:#F5F8FB; --paper-2:#E3ECF4; --paper-3:#DCE6EE; --line-ink:#D3DFEA;
  --text-ink:#22303D; --text-ink-muted:#5A6876; --ink:#22303D;
  --k-hero:linear-gradient(180deg,#DCE6EE 0%,#E9F0F6 70%,#F5F8FB 100%);
  --k-accent:#4F7EAD; --k-accent-ink:#fff; --k-surface:#fff; --k-nav:rgba(245,248,251,.94);
  --k-folder-bg:#E3ECF4; --k-folder-ink:#2F4E6E; --k-icon:#6F93B5; --k-glow:rgba(79,126,173,.4); --k-cta:#22303D;
}
.kat--temnaya{                      /* полночь + золото */
  --rose:#C9A66B; --rose-deep:#D9BC8A; --gold:#C9A66B; --sage:#C9A66B;
  --paper:#0F1E33; --paper-2:#1C3350; --paper-3:#16283F; --line-ink:#2A4262;
  --text-ink:#F3F1EE; --text-ink-muted:#AFBBC9; --ink:#C9A66B;
  --k-hero:linear-gradient(180deg,#0A1626 0%,#0F1E33 100%);
  --k-accent:#C9A66B; --k-accent-ink:#0F1E33; --k-surface:#15283F; --k-nav:rgba(15,30,51,.94);
  --k-folder-bg:#1C3350; --k-folder-ink:#F1E6D2; --k-icon:#C9A66B; --k-glow:rgba(0,0,0,.55); --k-cta:#0A1626;
  --k-swatch-line:rgba(255,255,255,.22);
}
.kat--shokolad{                     /* горький шоколад + карамель */
  --rose:#C98B4F; --rose-deep:#DDA56E; --gold:#C98B4F; --sage:#C98B4F;
  --paper:#2E1A10; --paper-2:#4A2C1D; --paper-3:#3A2316; --line-ink:#5A3A27;
  --text-ink:#F6ECE1; --text-ink-muted:#D8C3B1; --ink:#C98B4F;
  --k-hero:linear-gradient(180deg,#1A0E08 0%,#2E1A10 100%);
  --k-accent:#C98B4F; --k-accent-ink:#2E1A10; --k-surface:#3A2316; --k-nav:rgba(46,26,16,.94);
  --k-folder-bg:#4A2C1D; --k-folder-ink:#F2D9B8; --k-icon:#C98B4F; --k-glow:rgba(0,0,0,.55); --k-cta:#1A0E08;
  --k-swatch-line:rgba(255,255,255,.22);
}

/* ---------- общие правила для всех тем ---------- */
.kat[class*="kat--"]{ background:var(--paper); color:var(--text-ink); }
.kat[class*="kat--"] .kat-hero{ background:var(--k-hero); color:var(--text-ink); }
.kat[class*="kat--"] .kat-shoots{ color:var(--text-ink); }
.kat[class*="kat--"] .kat-tagline{ color:var(--rose-deep); }
.kat[class*="kat--"] .eyebrow{ color:var(--k-accent); }
.kat[class*="kat--"] .btn-primary{ background:var(--k-accent); color:var(--k-accent-ink); }
.kat[class*="kat--"] .btn-ghost-paper{ border-color:var(--text-ink); color:var(--text-ink); background:color-mix(in srgb, var(--k-surface) 55%, transparent); }
.kat[class*="kat--"] .kat-switch a{ background:var(--k-surface); border-color:var(--line-ink); color:var(--text-ink); }
.kat[class*="kat--"] .kat-switch a.is-on{ background:var(--k-accent); border-color:var(--k-accent); color:var(--k-accent-ink); }
.kat[class*="kat--"] .kat-disk{ background:var(--k-surface); border-color:var(--line-ink); box-shadow:0 18px 40px -22px var(--k-glow); }
.kat[class*="kat--"] .ic-folder{ color:var(--k-icon); }
.kat[class*="kat--"] .kat-nav{ background:var(--k-nav); }
.kat[class*="kat--"] .kat-chip{ background:var(--k-surface); }
.kat[class*="kat--"] .kat-chip.is-on{ background:var(--k-accent); border-color:var(--k-accent); color:var(--k-accent-ink); }
.kat[class*="kat--"] .kat-chip.is-on small{ color:var(--k-accent-ink); opacity:.75; }
.kat[class*="kat--"] .kat-nav-all:hover{ background:var(--text-ink); color:var(--paper); }
.kat[class*="kat--"] .kat-folder{ background:var(--k-folder-bg); color:var(--k-folder-ink); }
.kat[class*="kat--"] .kat-card{ background:var(--k-surface); border-color:var(--line-ink); box-shadow:0 10px 24px -18px var(--k-glow); }
.kat[class*="kat--"] .kat-all{ color:var(--k-accent); }
.kat[class*="kat--"] .kat-play-inline{ background:var(--k-surface); }
/* призыв внизу — самый тёмный цвет схемы */
.kat[class*="kat--"] .kat-cta{ background:var(--k-cta); }
.kat[class*="kat--"] .kat-cta .eyebrow{ color:var(--k-accent); }
/* всплывающий «Состав» остаётся светлым на любой теме */
.kat[class*="kat--"] .kat-pop{ --text-ink:#241E33; --text-ink-muted:#6E6578; --line-ink:#DED2C2; --paper:#FBF7F1; color:#241E33; }

/* «Тёмная тема»: больше золота — обводки, линии, заголовок, цифры */
.kat.kat--temnaya{ --line-ink:rgba(201,166,107,.38); }
.kat.kat--temnaya .kat-card{ border:1.5px solid #C9A66B; box-shadow:0 14px 30px -20px rgba(201,166,107,.45); }
.kat.kat--temnaya .kat-hero h1{ color:#D9BC8A; background:linear-gradient(180deg,#F1E1BF 0%,#C9A66B 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.kat.kat--temnaya .kat-stats dt{ color:#D9BC8A; }
.kat.kat--temnaya .kat-disk{ border:1.5px solid #C9A66B; }
.kat.kat--temnaya .btn-ghost-paper,
.kat.kat--temnaya .kat-nav-all{ border-color:#C9A66B; color:#E6CFA4; }
.kat.kat--temnaya .kat-switch a,
.kat.kat--temnaya .kat-chip{ border-color:rgba(201,166,107,.55); }
.kat.kat--temnaya .kat-folder{ background:rgba(201,166,107,.16); color:#E6CFA4; box-shadow:inset 0 0 0 1px rgba(201,166,107,.45); }
.kat.kat--temnaya .kat-shoot-head h2{ color:#F1E6D2; }
.kat.kat--temnaya .kat-no{ color:#C9A66B; }
.kat.kat--temnaya .kat-spec-btn{ color:#0F1E33; }
