/* ================================================================
   LILCHAN LIGHT — фирменная светлая тема («тёплая бумага»).
   Принцип: ИЕРАРХИЯ поверхностей вместо «всё белое» — тёплый off-white фон
   страницы → светлые карточки/посты → ОП на чистом белом, с видимыми мягкими
   тёплыми границами и лёгкими тёплыми тенями. Малиновый (crimson) акцент,
   синий — для ников. Глазу есть за что зацепиться, без стерильной белизны.

   ВАЖНО (специфичность): селектор токенов — `html[data-theme="lilchan-light"]`
   (специфичность 0,1,1), чтобы ВСЕГДА перебивать тёмную базу `:root` (0,1,0) из
   dark.css независимо от порядка подключения/ре-импорта (напр. main.css @import
   dark.css на страницах входа). Раньше был `[data-theme="lilchan-light"]` (0,1,0)
   — при равной специфичности достаточно было одного позднего :root-импорта,
   чтобы тема «слиплась» с тёмной.

   Не определённые здесь токены наследуются из :root (тёмная база): тема-
   независимые (--yt-red, --mk-…, --knob, --hl-…, --btn-…, видео-хром --pip-…) и
   деривативы галереи (--gallery-… от светлых --bg-…, --text-…). Sage — общий.
   ВНИМАНИЕ: НЕ писать в комментариях последовательность «звёздочка-слэш» (напр.
   глобы вида --bg-* со слешем) — она ДОСРОЧНО закрывает CSS-комментарий, остаток
   текста съедает селектор ниже и весь блок токенов отбрасывается (тема «слипается»
   с тёмной). Globs обозначаем «…» (--bg-…), без слешей.
   Активируется data-theme="lilchan-light". См. docs/THEME_ARCHITECTURE.md.
   ================================================================ */
html[data-theme="lilchan-light"] {

    /* ── Бренд (единый акцент) ── */
    --brand:            #d3324f;
    --brand-700:        #b22842;
    --brand-300:        #e07189;
    --radius-sm:        5px;
    --radius-pill:      999px;

    /* ── Фоны: НЕЙТРАЛЬНО-серый светлый (без жёлто-коричневого подтона) ──
       Иерархия мягкая: фон страницы → светлее карточки → ОП самый светлый, но
       НЕ чисто-белый (off-white) — без резкой белизны. */
    --bg-page:          #e6e8eb;   /* нейтральный светло-серый фон страницы */
    --bg-header:        #eef0f3;   /* шапка — светлее фона */
    --bg-form:          #f2f4f6;   /* формы — мягкие, не белые */
    --bg-post-op:       #f7f8fa;   /* ОП — самый светлый off-white (НЕ #fff) */
    --bg-post-reply:    #edeff2;   /* ответы — в тон фона, чуть темнее ОП */
    --bg-input:         #f9fafb;   /* поля ввода — почти белые, но мягкие */
    --bg-btn:           var(--brand);
    --bg-btn-hover:     var(--brand-700);
    --bg-admin-side:    #eef0f3;
    --bg-admin-head:    #e8ebef;
    --bg-tag:           #e1e4e8;
    --bg-code:          #edeff2;
    --bg-sidebar:       #eef0f3;

    --bg-notify:        color-mix(in srgb, var(--brand) 9%, transparent);
    --bg-notify-border: color-mix(in srgb, var(--brand) 26%, transparent);

    /* ── Границы (видимые, мягкие, нейтрально-серые) ── */
    --border-post:      #d4d8dd;
    --border-op:        var(--brand);
    --border-form:      #ccd1d7;
    --border-input:     #c4cbd2;
    --border-sep:       #dce0e5;

    /* ── Текст (нейтральный тёмно-серый, не чёрный — высокий контраст) ── */
    --text-main:        #23262a;
    --text-dim:         #565b62;
    --text-muted:       #878d95;
    --text-header:      #23262a;
    --text-link:        #c0264a;   /* малиновый (фирменный) */
    --text-link-hover:  #99203a;
    --text-subject:     #b22842;
    --text-name:        #36648f;   /* холодный синий — баланс и различение авторов */
    --text-btn:         #ffffff;
    --text-green:       #5a8429;
    --text-num:         #9aa1a9;
    --text-relnum:      #b3b9c0;

    /* ── Акценты ── */
    --crimson:          var(--brand);
    --crimson-dark:     var(--brand-700);
    --crimson-light:    var(--brand-300);
    --accent:           #5a8429;
    --accent-dark:      #496b20;

    /* ── Метрики ── */
    --site-width:       1200px;
    --radius:           8px;
    --radius-lg:        12px;
    --content-pad:      clamp(16px, 2.5vw, 32px);
    --max-width:        720px;
    --form-width:       720px;
    --font-size:        14px;
    --font-family:      'Segoe UI', system-ui, -apple-system, sans-serif;
    --mono:             ui-monospace, 'Consolas', 'SF Mono', Menlo, monospace;
    /* мягкие нейтрально-серые тени (без коричневого подмеса) */
    --shadow-sm:        0 1px 2px rgba(28, 33, 40, 0.10);
    --shadow-md:        0 4px 16px rgba(28, 33, 40, 0.12);
    --shadow-lg:        0 10px 30px rgba(28, 33, 40, 0.15);
    --shadow-xl:        0 16px 44px rgba(28, 33, 40, 0.18);
    --shadow-color:     rgba(28, 33, 40, 0.13);
    --ring-hairline:    rgba(28, 33, 40, 0.10);

    /* ── Спейсинг ── */
    --gap-thread:       20px;
    --pad-post-y:       22px;
    --pad-post-x:       26px;
    --pad-form-y:       24px;
    --pad-form-x:       26px;
    --line-height:      1.65;

    /* ── Модалки / скримы ── */
    --modal-overlay:    rgba(26, 30, 36, 0.46);
    --scrim:            rgba(0, 0, 0, 0.5);
    --scrim-strong:     rgba(0, 0, 0, 0.6);
    --on-media:         #ffffff;

    /* ── Алерты (семантика, читаемая на тёплом светлом) ── */
    --alert-error-bg:       rgba(192, 57, 43, 0.08);
    --alert-error-border:   rgba(192, 57, 43, 0.28);
    --alert-error-color:    #c0392b;
    --alert-success-bg:     rgba(90, 132, 41, 0.10);
    --alert-success-border: rgba(90, 132, 41, 0.30);
    --alert-success-color:  #5a8429;
    --alert-info-bg:        rgba(54, 100, 143, 0.08);
    --alert-info-border:    rgba(54, 100, 143, 0.28);
    --alert-info-color:     #36648f;
    --alert-warning-bg:     rgba(196, 122, 30, 0.10);
    --alert-warning-border: rgba(196, 122, 30, 0.30);
    --alert-warning-color:  #b06a18;

    /* ── Форма ── */
    --form-drop-hover:  color-mix(in srgb, var(--brand) 8%, transparent);

    /* ── Кнопки модерации (семантика) ── */
    --mod-del-color:        #c0392b;
    --mod-del-border:       rgba(192, 57, 43, 0.32);
    --mod-del-hover-bg:     rgba(192, 57, 43, 0.08);
    --mod-ban-color:        #8a4baf;
    --mod-ban-border:       rgba(138, 75, 175, 0.32);
    --mod-ban-hover-bg:     rgba(138, 75, 175, 0.08);
    --mod-bansoft-color:    #6157b0;
    --mod-bansoft-border:   rgba(97, 87, 176, 0.30);
    --mod-bansoft-hover-bg: rgba(97, 87, 176, 0.08);
    --mod-ip-color:         #36648f;
    --mod-ip-border:        rgba(54, 100, 143, 0.32);
    --mod-ip-hover-bg:      rgba(54, 100, 143, 0.08);
    --mod-pin-color:        #5a8429;
    --mod-pin-border:       rgba(90, 132, 41, 0.34);
    --mod-pin-hover-bg:     rgba(90, 132, 41, 0.10);
    --mod-lock-color:       #b06a18;
    --mod-lock-border:      rgba(196, 122, 30, 0.34);
    --mod-lock-hover-bg:    rgba(196, 122, 30, 0.10);
    --mod-cycle-color:      #1f8a8a;
    --mod-cycle-border:     rgba(31, 138, 138, 0.28);
    --mod-cycle-hover-bg:   rgba(31, 138, 138, 0.08);
    --mod-more-color:       var(--text-muted);
    --mod-more-border:      var(--border-sep);
    --mod-more-hover-bg:    var(--bg-tag);

    /* ── Мета-строка ── */
    --meta-chip-border:         #d6dade;
    --meta-chip-color:          var(--text-muted);
    --meta-chip-hover-color:    var(--text-dim);
    --meta-chip-hover-border:   var(--border-post);
    --meta-report-color:        #b06a18;
    --meta-report-border:       rgba(196, 122, 30, 0.32);
    --meta-report-hover-color:  #8a5212;
    --meta-report-hover-bg:     rgba(196, 122, 30, 0.10);

    /* ── Теги постов ── */
    --tag-pinned-bg:    rgba(90, 132, 41, 0.12);
    --tag-pinned-color: #5a8429;
    --tag-pinned-border:rgba(90, 132, 41, 0.32);
    --tag-locked-bg:    rgba(196, 122, 30, 0.10);
    --tag-locked-color: #b06a18;
    --tag-locked-border:rgba(196, 122, 30, 0.30);
    --tag-cyclic-bg:    rgba(31, 138, 138, 0.08);
    --tag-cyclic-color: #1f8a8a;
    --tag-cyclic-border:rgba(31, 138, 138, 0.26);
    --tag-nsfw-bg:      color-mix(in srgb, var(--brand) 10%, transparent);
    --tag-nsfw-color:   var(--brand-700);
    --tag-nsfw-border:  color-mix(in srgb, var(--brand) 28%, transparent);
    --tag-default-bg:   var(--bg-tag);
    --tag-default-color: var(--brand-700);
    --tag-default-border: color-mix(in srgb, var(--brand) 26%, transparent);

    /* ── OP-бейдж ── */
    --op-badge-bg:      rgba(90, 132, 41, 0.12);
    --op-badge-color:   #5a8429;
    --op-badge-border:  rgba(90, 132, 41, 0.32);

    /* ── Шапка (нейтральная светлая → тёмные ссылки/кнопки) ── */
    --hdr-badge-radius: 10px;
    --hdr-badge-font:   11px;
    --bg-meta:          rgba(32, 36, 42, 0.05);
    --hdr-link:         rgba(32, 36, 42, 0.78);
    --hdr-link-hover:   #23262a;
    --hdr-btn-color:    rgba(32, 36, 42, 0.70);
    --hdr-btn-hover:    #23262a;
    --hdr-btn-hover-bg: rgba(32, 36, 42, 0.07);
    --hdr-border:       #d4d8dd;

    /* ── Донат: малиновый акцент ── */
    --donate-accent:        var(--brand);
    --donate-accent-strong: var(--brand-700);
    --donate-accent-bg:     color-mix(in srgb, var(--brand) 10%, transparent);
    --donate-accent-border: color-mix(in srgb, var(--brand) 30%, transparent);

    /* ── Бейджи/акценты компонентов ── */
    --crimson-soft:     #b22842;
    --fav-star:         #d99a00;
    --fav-star-dim:     #b07d00;
    --opmod-color:      #1f8a8a;
    --opmod-bg:         rgba(31, 138, 138, 0.12);
    --opmod-border:     rgba(31, 138, 138, 0.30);
    --pc-badge-color:   #36648f;
    --pc-badge-bg:      rgba(54, 100, 143, 0.10);
    --pc-badge-bg-hover:rgba(54, 100, 143, 0.18);
    --pc-badge-border:  rgba(54, 100, 143, 0.28);
    --link:             var(--text-link);
    --via-color:        #7a5cb0;
    --via-bg:           rgba(122, 92, 176, 0.10);
    --via-border:       rgba(122, 92, 176, 0.30);
    --mod-edit-color:   #5a8429;
    --mod-edit-border:  rgba(90, 132, 41, 0.34);
    --mod-edit-hover-bg:rgba(90, 132, 41, 0.10);
    --fb-accent:        #b8860b;
    --fb-accent-strong: #936c08;
    --fb-accent-bg:     rgba(184, 134, 11, 0.12);
}

html[data-theme="lilchan-light"] { color-scheme: light; }