/* ==========================================================================
   OmniDesk 1.5 — дизайн-токены «Apple Liquid Glass»
   (WWDC 2025: полупрозрачный слой навигации над контентом, преломление
   света, спекулярные блики на кромках, концентрические радиусы,
   регулярное стекло — для слоя управления, тинт — только для акцентов)

   Один цвет = одно значение. Синий — только интерактивное.
   ========================================================================== */

:root {
  /* --- подложка-сцена (то, что «преломляет» стекло) --- */
  --scene-1: #E8F0FE;    /* холодный голубой  */
  --scene-2: #F3E8FF;    /* лаванда           */
  --scene-3: #FFEDE3;    /* персиковый        */
  --scene-4: #E3F6EE;    /* мятный            */
  --bg:      #F4F6FB;    /* база сцены        */
  --bg-sunken: rgba(16, 22, 44, .05);

  /* --- стекло (регулярное) --- */
  --glass-tint-a: rgb(255 255 255 / .74);   /* верхний край — плотнее */
  --glass-tint-b: rgb(255 255 255 / .44);   /* нижний — прозрачнее    */
  --glass-tint-solid: rgb(255 255 255 / .86);
  --glass-stroke: rgb(255 255 255 / .55);   /* светящаяся кромка      */
  --glass-spec:   rgb(255 255 255 / .85);   /* спекулярный блик сверху*/
  --glass-spec-2: rgb(255 255 255 / .22);   /* нижний отражённый свет */
  --glass-blur: 28px;
  --glass-sat: 180%;
  --glass-drop: 0 12px 40px rgb(23 32 84 / .11), 0 2px 10px rgb(23 32 84 / .05);
  --glass-drop-lg: 0 24px 70px rgb(23 32 84 / .16), 0 4px 16px rgb(23 32 84 / .07);

  /* v1.7.1: плотная поверхность БЕЗ backdrop-filter — для массовых
     элементов (карточки, кнопки, ячейки расписания). Вид тот же,
     но браузер не пересчитывает блюр для каждого элемента при скролле
     (главная причина «лагов» на слабом железе). */
  --surface-tint-a: rgb(255 255 255 / .84);
  --surface-tint-b: rgb(255 255 255 / .66);
  --surface: linear-gradient(118deg, var(--surface-tint-a), var(--surface-tint-b));

  /* --- плотные поверхности (чтение данных: таблицы, поля) --- */
  --card:          rgb(255 255 255 / .66);
  --card-fill:     rgb(255 255 255 / .82);   /* без блюра, для плотных сеток */
  --card-elevated: rgb(255 255 255 / .92);

  --hover:  rgba(15, 23, 52, .055);
  --active: rgba(15, 23, 52, .095);
  --text:   #17181C;
  --text-2: #63666F;
  --text-3: #9B9EA8;
  --separator:        rgba(20, 26, 60, .09);
  --separator-strong: rgba(20, 26, 60, .16);

  --accent:       #0069D9;
  --accent-hi:    #2E90FF;                 /* верх тинта — светлее */
  --accent-press: #0057B8;
  --accent-soft:  rgba(0, 105, 217, .11);
  --green:        #1FA84D;
  --green-soft:   rgba(31, 168, 77, .14);
  --yellow:       #E6A400;
  --yellow-soft:  rgba(230, 164, 0, .17);
  --orange:       #E87A12;
  --orange-soft:  rgba(232, 122, 18, .14);
  --red:          #E5342B;
  --red-soft:     rgba(229, 52, 43, .12);
  --purple:       #6558E6;
  --purple-soft:  rgba(101, 88, 230, .13);
  --teal:         #0E9CB8;

  /* --- форма: концентрические радиусы (внутренний = внешний - паддинг) --- */
  --radius-s: 9px;
  --radius-m: 14px;
  --radius-l: 20px;
  --radius-xl: 26px;
  --radius-pill: 999px;

  /* тени обычных элементов (кроме стекла) */
  --shadow-1: 0 1px 2px rgb(20 26 60 / .05), 0 4px 14px rgb(20 26 60 / .05);
  --shadow-2: 0 6px 28px rgb(20 26 60 / .1), 0 2px 6px rgb(20 26 60 / .05);
  --shadow-3: 0 24px 64px rgb(20 26 60 / .2);

  /* --- сетка 8pt --- */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px;

  --sidebar-w: 256px;
  --sidebar-gap: 14px;          /* «плавающий» сайдбар — воздух вокруг */
  --topbar-h: 64px;
  --content-max: 1240px;

  /* --- движение: жидкость и пружина --- */
  --ease: cubic-bezier(.32, .72, .24, 1);
  --spring: cubic-bezier(.36, 1.42, .44, 1);
  --t-fast: 170ms;
  --t-med: 260ms;
  --t-slow: 420ms;
}

/* --- ночь: сцена темнее, стекло тоньше, блики деликатнее --- */
html[data-resolved-theme="dark"] {
  --scene-1: #16233F;
  --scene-2: #241A45;
  --scene-3: #3A2438;
  --scene-4: #12332E;
  --bg:      #0B0C12;
  --bg-sunken: rgba(255, 255, 255, .06);

  --glass-tint-a: rgb(44 47 68 / .72);
  --glass-tint-b: rgb(28 30 48 / .52);
  --glass-tint-solid: rgb(36 39 58 / .94);
  --glass-stroke: rgb(255 255 255 / .14);
  --glass-spec:   rgb(255 255 255 / .17);
  --glass-spec-2: rgb(255 255 255 / .05);
  --glass-blur: 28px;
  --glass-sat: 160%;
  --glass-drop: 0 12px 40px rgb(0 0 0 / .5), 0 2px 10px rgb(0 0 0 / .35);
  --glass-drop-lg: 0 24px 70px rgb(0 0 0 / .6), 0 4px 16px rgb(0 0 0 / .4);

  --surface-tint-a: rgb(42 45 64 / .9);
  --surface-tint-b: rgb(32 35 52 / .78);
  --surface: linear-gradient(118deg, var(--surface-tint-a), var(--surface-tint-b));

  --card:          rgb(34 36 52 / .62);
  --card-fill:     rgb(38 41 60 / .9);
  --card-elevated: rgb(42 45 64 / .96);

  --hover:  rgba(255, 255, 255, .07);
  --active: rgba(255, 255, 255, .12);
  --text:   #F2F3F7;
  --text-2: #A2A5B2;
  --text-3: #6C6F7E;
  --separator:        rgba(255, 255, 255, .1);
  --separator-strong: rgba(255, 255, 255, .17);

  --accent:       #2E90FF;
  --accent-hi:    #6BB2FF;
  --accent-press: #5AA5FF;
  --accent-soft:  rgba(46, 144, 255, .18);
  --green:        #32D06F;
  --green-soft:   rgba(50, 208, 111, .17);
  --yellow:       #FFD64A;
  --yellow-soft:  rgba(255, 214, 74, .17);
  --orange:       #FFA244;
  --orange-soft:  rgba(255, 162, 68, .17);
  --red:          #FF5A50;
  --red-soft:     rgba(255, 90, 80, .16);
  --purple:       #948BFF;
  --purple-soft:  rgba(148, 139, 255, .18);
  --teal:         #3FC4DC;

  --shadow-1: 0 1px 2px rgb(0 0 0 / .45);
  --shadow-2: 0 6px 28px rgb(0 0 0 / .5);
  --shadow-3: 0 24px 64px rgb(0 0 0 / .65);
}

/* ==========================================================================
   Каноничное «регулярное стекло» — как класс утилита (.glass у батч-панели)
   Правило Apple: стекло — только у ПЛАВАЮЩЕГО слоя управления.
   ========================================================================== */
.glass {
  background: linear-gradient(118deg, var(--glass-tint-a), var(--glass-tint-b));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  border: 1px solid var(--glass-stroke);
  box-shadow:
    inset 0 1px 0 var(--glass-spec),                 /* спекуляр сверху  */
    inset 0 -1px 0 var(--glass-spec-2),              /* отражение снизу  */
    var(--glass-drop);
}

/* запасной вариант без backdrop-filter: стекло становится плотнее */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .glass {
    background: var(--glass-tint-solid);
  }
}

/* уважение к системной прозрачности (как в iOS 26: слайдер Liquid Glass) */
@media (prefers-reduced-transparency: reduce) {
  .glass, .card, .modal, .toast, .sidebar, .topbar.is-stuck {
    background: var(--card-elevated) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}
