/* xmltv.live — design tokens: own palette (cool graphite / warm paper, teal-and-lilac
   accents, SMPTE colour bars as the brand), IBM Plex. Themes: studio, editm3u,
   daylight, paper, fog, night — light/dark pairs are independent, not copies of
   another UI; editm3u is the one palette taken from our own desktop editor. */
:root{
  --bar-1:#c9d62b; --bar-2:#2fc6d6; --bar-3:#3fbf6b;
  --bar-4:#d64bb0; --bar-5:#e0393e; --bar-6:#3a6be0;

  --font-ui:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-data:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;

  --r-sm:4px; --r-md:7px; --r-lg:11px;
  --head-h:52px; --status-h:30px;
  --row-h:54px;
  --tap:0.14s cubic-bezier(.2,.6,.3,1);
}
html[data-theme="studio"]{
  /* Cool graphite, teal accent (bar-2). Default theme. */
  --bg:#0b0e14; --panel:#121823; --raised:#1a2231; --hover:#22303f;
  --line:#26313f; --line-soft:#1b2431;
  --text:#e6edf6; --muted:#8d9bb0; --faint:#66748a;
  --accent:#35c8d6; --accent-ink:#04222a; --accent-soft:rgba(53,200,214,.14);
  --ok:#3fbf6b; --warn:#e8b33a; --bad:#e0393e;
  --shadow:0 18px 40px -20px rgba(0,0,0,.85);
  --scrim:rgba(5,8,12,.74);
}
html[data-theme="editm3u"]{
  /* The original EditM3U palette, exactly as the editor and player use it:
     near-black graphite with the amber accent (#ff9f1c). */
  --bg:#0e1113; --panel:#15191c; --raised:#1b2125; --hover:#222a2f;
  --line:#262d33; --line-soft:#1e2429;
  --text:#e6eaec; --muted:#909aa1; --faint:#69737a;
  --accent:#ff9f1c; --accent-ink:#1a1206; --accent-soft:rgba(255,159,28,.13);
  --ok:#3fbf6b; --warn:#e8b33a; --bad:#e0393e;
  --shadow:0 18px 40px -20px rgba(0,0,0,.85);
  --scrim:rgba(6,8,9,.72);
}
html[data-theme="daylight"]{
  /* Cool daylight. Grey carries elevation (page < panel < raised). */
  --bg:#e9eef2; --panel:#f4f7f9; --raised:#dde5ea; --hover:#d2dbe2;
  --line:#bcc8d1; --line-soft:#d0dae1;
  --text:#101820; --muted:#46545f; --faint:#64727d;
  --accent:#0e6f7d; --accent-ink:#fff; --accent-soft:rgba(14,111,125,.13);
  --ok:#1c7d45; --warn:#8a5f08; --bad:#b62229;
  --shadow:0 16px 34px -24px rgba(10,20,28,.4);
  --scrim:rgba(206,215,222,.84);
}
html[data-theme="paper"]{
  /* Warm paper with an olive accent (bar-1). Closer to print than to a screen. */
  --bg:#f4f0e4; --panel:#fbf8ef; --raised:#e8e1cc; --hover:#ddd4b9;
  --line:#cfc5a9; --line-soft:#e2dac3;
  --text:#282216; --muted:#665c46; --faint:#7a6f56;
  --accent:#4a6b16; --accent-ink:#fff; --accent-soft:rgba(74,107,22,.14);
  --ok:#2d7a4a; --warn:#7d6412; --bad:#a33b32;
  --shadow:0 16px 34px -24px rgba(60,50,20,.36);
  --scrim:rgba(233,226,206,.86);
}
html[data-theme="fog"]{
  /* Dim cool grey, indigo accent — for long sessions in a bright room. */
  --bg:#dde2e7; --panel:#e7ebef; --raised:#cfd6dd; --hover:#c4ccd4;
  --line:#b0bac4; --line-soft:#c9d1d8;
  --text:#171f27; --muted:#48555f; --faint:#5b6873;
  --accent:#3f4fae; --accent-ink:#fff; --accent-soft:rgba(63,79,174,.13);
  --ok:#1d7a46; --warn:#7f5708; --bad:#b3262c;
  --shadow:0 16px 34px -24px rgba(18,26,34,.34);
  --scrim:rgba(196,203,210,.84);
}
html[data-theme="night"]{
  /* Dim plum night with cream type and a lilac accent (bar-4 family). */
  --bg:#191622; --panel:#211d2c; --raised:#2a2537; --hover:#342e44;
  --line:#3a344b; --line-soft:#26212f;
  --text:#e9e4f2; --muted:#a79fba; --faint:#8e86a3;
  --accent:#b9a2ff; --accent-ink:#171029; --accent-soft:rgba(185,162,255,.16);
  --ok:#7dba8a; --warn:#d4b06a; --bad:#e07a72;
  --shadow:0 18px 40px -20px rgba(0,0,0,.72);
  --scrim:rgba(12,10,18,.74);
}

/* guide-specific additions (same in every theme unless overridden) */
:root{
  --live:#ef4444; --live-soft:rgba(239,68,68,.14); --live-line:rgba(239,68,68,.45);
  --topbar:57px;     /* header height (sidebar + grid read it) */
  --chcol:210px;     /* timeline channel column */
  --pph:240px;       /* timeline pixels per hour (JS reads this) */
  --rowh:62px;
}
html[data-theme="studio"],html[data-theme="night"],html[data-theme="editm3u"]{color-scheme:dark}
html[data-theme="daylight"],html[data-theme="paper"],html[data-theme="fog"]{color-scheme:light;--live:#d92d2d}
