/* Радио Мозаика: единый источник цветов, шрифтов, радиусов и золотых акцентов — тёмная и светлая темы.
   Подключается первым на всех страницах: кабинет (app.css), страницы входа (nocturne-login.css)
   и админка Django (admin-theme.css). В компонентах цвета только через эти переменные.
   Тему выставляет скрипт в <head> (cabinet/_theme_head.html): <html data-theme="dark|light" data-theme-mode="auto|light|dark">.
   Без JS действует тёмная тема. */

/* Шрифты лежат у нас (OFL, fonts/OFL-*.txt): без запросов к Google и без передачи ему IP клиентов. */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fonts/cormorant-garamond-cyrillic-500-normal.5d2fd9430f7f.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fonts/cormorant-garamond-latin-500-normal.efeea72c7a42.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500; font-display: swap;
  src: url("fonts/cormorant-garamond-cyrillic-500-italic.63bbd0294549.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500; font-display: swap;
  src: url("fonts/cormorant-garamond-latin-500-italic.9b8a16c9964e.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url("fonts/manrope-cyrillic-wght-normal.e58febde317b.woff2") format("woff2-variations"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url("fonts/manrope-latin-wght-normal.938c6e8019b6.woff2") format("woff2-variations"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }


/* ── Общее для обеих тем ───────────────────────────────────────────────────────────────────── */
:root {
  --f-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --f-sans: "Manrope", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --f-mono: ui-monospace, SFMono-Regular, "Cascadia Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --r-xs: 6px;
  --r-sm: 9px;
  --r-md: 13px;
  --r-lg: 18px;
  --r-pill: 999px;

  --c-on-gold: #1f2434;                     /* текст на золотой кнопке (контраст ≥ 6:1 в обеих темах) */
  --c-on-danger: #ffffff;                   /* текст на красной заливке */
  --c-danger: #b93a30; --c-danger-hover: #c9473c;   /* заливка опасной кнопки (белый текст ≥ 5:1) */
  --g-gold: linear-gradient(110deg, #f1d6a5, #c99d61);
  --disabled-opacity: .5;
}

/* ── Тёмная тема «Радио Мозаика» (по умолчанию) ──────────────────────────────────────────────────── */
:root, :root[data-theme="dark"] {
  color-scheme: dark;
  --c-theme-meta: #101a30;                  /* цвет панели браузера на телефоне */

  /* Фон */
  --c-bg-rgb: 13, 22, 40;
  --c-bg: rgb(var(--c-bg-rgb));             /* #0d1628 */
  --c-auth-bg-rgb: 16, 26, 48;              /* фон страниц входа (#101a30) */
  --c-auth-bg: rgb(var(--c-auth-bg-rgb));
  --c-navy: #101a30;
  --g-page: radial-gradient(1200px 600px at 85% -10%, rgba(217, 183, 127, .07), transparent 60%),
            radial-gradient(900px 500px at -10% 110%, rgba(217, 183, 127, .05), transparent 60%),
            var(--c-bg);
  --c-header-bg: rgba(16, 26, 48, .92);
  --c-header-solid: #101a30;
  --c-surface: rgba(21, 33, 58, .78);       /* таблица поверх фона */
  --g-card: linear-gradient(145deg, rgba(15, 27, 48, .84), rgba(17, 25, 42, .77));
  --c-surface-solid: #17233d;               /* шапка таблиц, выпадающие списки */
  --c-surface-raised: #1d2b4a;              /* активный пункт, заголовки модулей админки */
  --c-row-hover: rgba(217, 183, 127, .04);
  --c-field: rgba(8, 17, 32, .46);
  --c-field-focus: rgba(8, 17, 32, .68);
  --c-code-bg: rgba(8, 17, 32, .7);
  --c-toggle-bg: rgba(16, 26, 48, .55);
  --c-art-veil: transparent;                /* подложка поверх иллюстрации входа */

  /* Текст */
  --c-text: #f3ece2;
  --c-text-strong: #ffffff;
  --c-muted: #b8b0a6;
  --c-label: #ead4b4;
  --c-placeholder: rgba(243, 236, 226, .55);
  --c-footnote: rgba(243, 236, 226, .8);

  /* Золото: роли — акцентный текст и заголовки (gold-light), ссылки (gold-pale), рамки и иконки (gold) */
  --c-gold: #d9b77f;
  --c-gold-light: #f2d9ad;
  --c-gold-pale: #f0d7aa;
  --c-gold-deep: #c99d61;
  --c-gold-muted: rgba(240, 215, 170, .75);
  --c-link: var(--c-gold-pale);
  --c-link-hover: var(--c-text-strong);
  --c-line: rgba(217, 183, 127, .26);
  --c-line-strong: rgba(217, 183, 127, .64);
  --c-line-field: rgba(217, 183, 127, .8);
  --c-line-neutral: rgba(243, 236, 226, .22);
  --c-tint: rgba(217, 183, 127, .12);
  --c-btn-gold: #d9b77f;                    /* сплошное золото кнопок админки */
  --c-btn-gold-hover: #f2d9ad;
  --c-btn-gold-strong: #c99d61;

  /* Состояния */
  --c-ok: #8fe3b4;   --c-ok-bg: rgba(46, 150, 98, .2);    --c-ok-line: rgba(120, 215, 165, .42);  --c-ok-soft: #c5f3d9;
  --c-warn: #f5c977; --c-warn-bg: rgba(205, 145, 35, .18); --c-warn-line: rgba(245, 201, 119, .42);
  --c-bad: #ffa597;  --c-bad-bg: rgba(190, 52, 42, .22);  --c-bad-line: rgba(255, 145, 125, .45); --c-bad-soft: #ffd1c8;

  /* Тени и фокус */
  --shadow-card: 0 18px 58px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .08);
  --shadow-soft: 0 8px 28px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 255, 255, .05);
  --shadow-button: 0 5px 18px rgba(0, 0, 0, .23), inset 0 1px rgba(255, 255, 255, .65);
  --shadow-text: 0 2px 15px rgba(0, 0, 0, .8);
  --shadow-footnote: 0 1px 8px #101a30;
  --focus-ring: 0 0 0 3px rgba(217, 183, 127, .16);
  --focus-outline: 2px solid #fff0cf;
}

/* ── Светлая тема: молочно-кремовый фон, белые карточки, бронза вместо светлого золота ─────────── */
:root[data-theme="light"] {
  color-scheme: light;
  --c-theme-meta: #f8f1ea;

  --c-bg-rgb: 248, 241, 234;
  --c-bg: rgb(var(--c-bg-rgb));             /* #f8f1ea */
  --c-auth-bg-rgb: 248, 241, 234;
  --c-auth-bg: rgb(var(--c-auth-bg-rgb));
  --c-navy: #101a30;
  --g-page: radial-gradient(1200px 600px at 85% -10%, rgba(233, 196, 190, .35), transparent 60%),
            radial-gradient(900px 500px at -10% 110%, rgba(226, 196, 143, .28), transparent 60%),
            var(--c-bg);
  --c-header-bg: rgba(255, 251, 246, .92);
  --c-header-solid: #fffaf3;
  --c-surface: #ffffff;
  --g-card: linear-gradient(145deg, #ffffff, #fffaf4);
  --c-surface-solid: #f6ece0;
  --c-surface-raised: #f1e4d4;
  --c-row-hover: rgba(154, 110, 45, .05);
  --c-field: #fffdfa;
  --c-field-focus: #ffffff;
  --c-code-bg: #fbf6ef;
  --c-toggle-bg: rgba(255, 251, 246, .85);
  --c-art-veil: linear-gradient(180deg, rgba(255, 246, 236, .16), rgba(255, 246, 236, .26));

  --c-text: #2a2230;
  --c-text-strong: #17121c;
  --c-muted: #6b5f57;
  --c-label: #6a4a24;
  --c-placeholder: #7d7066;
  --c-footnote: #5e5048;

  --c-gold: #9a6e2d;                        /* рамки, иконки (≥ 3:1 к фону) */
  --c-gold-light: #7a5220;                  /* заголовки и акцентный текст (≥ 6:1) */
  --c-gold-pale: #85591f;                   /* ссылки (≥ 5:1) */
  --c-gold-deep: #b8894a;
  --c-gold-muted: #75582c;
  --c-link: var(--c-gold-pale);
  --c-link-hover: #4f3410;
  --c-line: rgba(154, 110, 45, .28);
  --c-line-strong: rgba(154, 110, 45, .55);
  --c-line-field: #a3804e;                  /* рамка поля: ≥ 3:1 к фону */
  --c-line-neutral: rgba(42, 34, 48, .25);
  --c-tint: rgba(154, 110, 45, .1);
  --c-btn-gold: #e3c590;
  --c-btn-gold-hover: #edd5a8;
  --c-btn-gold-strong: #d4ae72;

  --c-ok: #1e6b45;   --c-ok-bg: rgba(46, 150, 98, .12);   --c-ok-line: rgba(30, 107, 69, .35);   --c-ok-soft: #1a5c3b;
  --c-warn: #8a5a00; --c-warn-bg: rgba(220, 160, 40, .16); --c-warn-line: rgba(138, 90, 0, .35);
  --c-bad: #a8291e;  --c-bad-bg: rgba(200, 60, 45, .1);   --c-bad-line: rgba(168, 41, 30, .4);  --c-bad-soft: #8f2219;

  --shadow-card: 0 16px 44px rgba(110, 80, 40, .14), inset 0 1px rgba(255, 255, 255, .9);
  --shadow-soft: 0 6px 22px rgba(110, 80, 40, .1), inset 0 1px rgba(255, 255, 255, .9);
  --shadow-button: 0 4px 14px rgba(120, 85, 30, .22), inset 0 1px rgba(255, 255, 255, .65);
  --shadow-text: 0 1px 12px rgba(255, 250, 244, .9);
  --shadow-footnote: none;
  --focus-ring: 0 0 0 3px rgba(154, 110, 45, .25);
  --focus-outline: 2px solid #7a5220;
}

/* ── Переключатель темы (кабинет, страницы входа, админка) ────────────────────────────────────── */
.rg-theme-toggle {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  min-height: 0;
  padding: 0;
  border: 1px solid var(--c-line-strong);
  border-radius: var(--r-pill);
  background: var(--c-toggle-bg);
  color: var(--c-gold-light);
  box-shadow: none;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.rg-theme-toggle:hover { background: var(--c-tint); color: var(--c-text-strong); border-color: var(--c-gold); filter: none; }
.rg-theme-toggle:focus-visible { outline: var(--focus-outline); outline-offset: 2px; }
.rg-theme-toggle svg { display: none; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.rg-theme-toggle .i-auto path.fill { fill: currentColor; stroke: none; }
html:not([data-theme-mode]) .rg-theme-toggle .i-auto,
html[data-theme-mode="auto"] .rg-theme-toggle .i-auto,
html[data-theme-mode="light"] .rg-theme-toggle .i-light,
html[data-theme-mode="dark"] .rg-theme-toggle .i-dark { display: block; }
.rg-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
