/* PodiumEDI - Light Theme (GENESIS)
   Goal: daylight/laptop-friendly, Unifi-like light UI.
   - Medium-grey app background
   - White / very-light panels
   - High-contrast borders + black text
   - Overrides for modules that previously hard-coded dark surfaces (Help Center, DashComms, EDN, GP Stats skin, Tyres/Power, etc.)
*/

:root[data-theme="light"]{
  color-scheme: light;

  /* Core palette */
  --bg:#dfe3e7;          /* app background */
  --panel:#f4f6f8;       /* panel gradient start */
  --panel2:#ffffff;      /* panel gradient end */
  --panel3:#eef2f6;      /* subtle inset surfaces */
  --border:#0f172a;      /* strong borders (near-black) */
  --stroke: rgba(15,23,42,0.35); /* softer strokes for inner lines */
  --text:#0b0c0e;        /* primary text */
  --muted:#374151;       /* secondary text */

  /* Semantic */
  --good:#0b7a33;
  --bad:#b00020;
  --accent:#2563eb;
  --pill:#e5e7eb;

  /* Effects */
  --shadow: rgba(0,0,0,0.16);
  --shadow2: rgba(0,0,0,0.10);
  --focus: rgba(37,99,235,0.30);

  /* Tooltips (uses tooltips.css vars) */
  --tip-bg: rgba(255,255,255,0.98);
  --tip-border: rgba(0,0,0,0.25);
  --tip-text: rgba(0,0,0,0.92);

  /* DashComms modal tokens (dashcomms.css vars) */
  --dc-backdrop: rgba(0,0,0,0.25);
  --dc-panel: rgba(255,255,255,0.98);
  --dc-border: rgba(0,0,0,0.18);
  --dc-border-strong: rgba(0,0,0,0.28);
  --dc-good: var(--good);
  --dc-bad: var(--bad);
}

/* --- Global surfaces/text --- */
:root[data-theme="light"] body{
  background: radial-gradient(1200px 800px at 30% 10%, #ffffff 0%, var(--bg) 55%) fixed;
  color:var(--text);
}

:root[data-theme="light"] .muted{color:var(--muted)}
:root[data-theme="light"] .good{color:var(--good)}
:root[data-theme="light"] .bad{color:var(--bad)}

:root[data-theme="light"] .sep{color:#000; opacity:.30}

/* Top bar + nav */
:root[data-theme="light"] .topbar{
  background: linear-gradient(180deg, #ffffff 0%, #e7ebef 100%);
  border-bottom:1px solid var(--stroke);
}

:root[data-theme="light"] .brand-logo{
  border-color: var(--stroke);
  background: linear-gradient(180deg, rgba(0,0,0,0.02), rgba(0,0,0,0.06));
  box-shadow: 0 0 0 1px rgba(0,0,0,0.08) inset, 0 10px 24px rgba(0,0,0,0.12);
}

:root[data-theme="light"] .nav-btn{
  background: linear-gradient(180deg, #ffffff 0%, #e9edf2 100%);
  border-color: var(--stroke);
  color: var(--text);
  box-shadow: 0 1px 0 rgba(0,0,0,0.04) inset;
}
:root[data-theme="light"] .nav-btn:hover{
  border-color: var(--border);
}

/* --- Panels/cards/tiles --- */
:root[data-theme="light"] .panel{
  box-shadow: 0 10px 30px var(--shadow);
}
:root[data-theme="light"] .panel,
:root[data-theme="light"] .card,
:root[data-theme="light"] .module-tile{
  border-color: var(--stroke);
  background: linear-gradient(180deg, var(--panel) 0%, var(--panel2) 100%);
}

:root[data-theme="light"] .module-tile:hover{
  border-color: var(--border);
}

:root[data-theme="light"] .card-title{color:var(--text)}
:root[data-theme="light"] .kv span:first-child{color:var(--muted)}

/* Pills in theme.css force a light text color; override for light mode */
:root[data-theme="light"] .pill{
  color: var(--text);
  border-color: var(--stroke);
  background: var(--pill);
}

/* Placeholder canvas */
:root[data-theme="light"] .placeholder-canvas{
  border:1px dashed rgba(0,0,0,0.25);
  background: radial-gradient(900px 500px at 20% 30%, rgba(37,99,235,0.10) 0%, rgba(0,0,0,0) 60%);
}

/* Swirl/topo panel */
:root[data-theme="light"] .swirl-box{
  border-color: var(--stroke);
  background:
    url("../img/topo.svg"),
    radial-gradient(900px 400px at 20% 30%, rgba(0,0,0,0.04) 0%, rgba(0,0,0,0) 70%);
  opacity: 1.0;
}

/* Embedded tooling container */
:root[data-theme="light"] .embed-frame,
:root[data-theme="light"] .embed-iframe{
  background:#ffffff;
  border-color: var(--stroke);
}

/* --- Forms / inputs / buttons --- */
:root[data-theme="light"] input,
:root[data-theme="light"] select,
:root[data-theme="light"] textarea{
  background:#ffffff;
  color:var(--text);
  border:1px solid var(--stroke);
}
:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder{
  color: rgba(0,0,0,0.40);
}
:root[data-theme="light"] input:focus,
:root[data-theme="light"] select:focus,
:root[data-theme="light"] textarea:focus{
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--focus);
}

/* Buttons */
:root[data-theme="light"] .btn{
  background: #ffffff;
  color: var(--text);
  border:1px solid var(--stroke);
}
:root[data-theme="light"] .btn:hover{ border-color: var(--border); }
:root[data-theme="light"] .btn:active{ transform: translateY(1px); }

:root[data-theme="light"] .btn.primary{
  background: linear-gradient(180deg, #3b82f6 0%, #1d4ed8 100%);
  border-color: rgba(0,0,0,0.20);
  color: #ffffff;
}
:root[data-theme="light"] .btn.primary:hover{
  filter: brightness(1.05);
}

:root[data-theme="light"] .btn.danger{
  background: linear-gradient(180deg, #ffeded 0%, #ffd6d6 100%);
  border-color: rgba(176,0,32,0.35);
  color: #5a0a16;
}
:root[data-theme="light"] .btn.danger:hover{
  border-color: rgba(176,0,32,0.55);
}

/* Flash messages */
:root[data-theme="light"] .flash{
  background: var(--panel2);
  border-color: var(--stroke);
}
:root[data-theme="light"] .flash-error{border-color: rgba(176,0,32,0.45); color:#5a0a16}
:root[data-theme="light"] .flash-success{border-color: rgba(11,122,51,0.45); color:#064e1f}
:root[data-theme="light"] .flash-info{border-color: rgba(37,99,235,0.40); color:#0b2b5a}

/* --- Tables (generic) --- */
:root[data-theme="light"] table{
  color: var(--text);
}
:root[data-theme="light"] th,
:root[data-theme="light"] td{
  border-color: rgba(0,0,0,0.12) !important;
}
:root[data-theme="light"] thead th{
  background: #eef2f6 !important;
  color: var(--text) !important;
}
:root[data-theme="light"] tbody tr:hover td{
  background: rgba(37,99,235,0.06) !important;
}

/* --- Tooltips (uses vars in tooltips.css) --- */
:root[data-theme="light"] .pa-tooltip{
  box-shadow: 0 18px 44px rgba(0,0,0,0.18);
}

/* --- DashComms modal (dashcomms.css) --- */
:root[data-theme="light"] .dc-panel{
  box-shadow: 0 14px 40px rgba(0,0,0,0.18);
}
:root[data-theme="light"] .dc-title{ color: var(--text); }
:root[data-theme="light"] .dc-sub{ color: var(--muted); }
:root[data-theme="light"] .dc-badge{
  background: rgba(37,99,235,0.10);
  border-color: rgba(0,0,0,0.18);
  color: var(--text);
}

/* --- Help Center modal (help_center.css) --- */
:root[data-theme="light"] .pa-help-dimmer{ background: rgba(0,0,0,0.22); }

:root[data-theme="light"] .pa-help-window{
  background: rgba(255,255,255,0.98);
  border: 1px solid rgba(0,0,0,0.18);
  box-shadow: 0 12px 30px rgba(0,0,0,0.18);
}

:root[data-theme="light"] .pa-help-header{
  background: rgba(0,0,0,0.03);
  border-bottom: 1px solid rgba(0,0,0,0.10);
}

:root[data-theme="light"] .pa-help-search{
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(0,0,0,0.18);
  color: var(--text);
}
:root[data-theme="light"] .pa-help-search::placeholder{ color: rgba(0,0,0,0.40); }

:root[data-theme="light"] .pa-help-role,
:root[data-theme="light"] .pa-help-topic-filter{
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(0,0,0,0.18);
  color: var(--text);
}

:root[data-theme="light"] .pa-help-btn{
  background: rgba(0,0,0,0.03);
  border: 1px solid rgba(0,0,0,0.18);
  color: var(--text);
}
:root[data-theme="light"] .pa-help-btn:hover{ background: rgba(37,99,235,0.08); border-color: rgba(0,0,0,0.28); }

:root[data-theme="light"] .pa-help-left,
:root[data-theme="light"] .pa-help-mid,
:root[data-theme="light"] .pa-help-right{
  background: rgba(255,255,255,0.60);
}

:root[data-theme="light"] .pa-help-topic{
  border-color: rgba(0,0,0,0.12);
  background: rgba(255,255,255,0.80);
}
:root[data-theme="light"] .pa-help-topic:hover{
  border-color: rgba(0,0,0,0.28);
  background: rgba(37,99,235,0.06);
}

:root[data-theme="light"] .pa-help-topic.active{
  border-color: rgba(37,99,235,0.45);
  background: rgba(37,99,235,0.10);
}

:root[data-theme="light"] .pa-help-h1,
:root[data-theme="light"] .pa-help-h2,
:root[data-theme="light"] .pa-help-h3{
  color: var(--text);
}

:root[data-theme="light"] .pa-help-md{
  color: var(--text);
}
:root[data-theme="light"] .pa-help-md code{
  background: rgba(0,0,0,0.06);
  border: 1px solid rgba(0,0,0,0.12);
  color: var(--text);
}

:root[data-theme="light"] .pa-help-note{
  background: rgba(0,0,0,0.03);
  border: 1px solid rgba(0,0,0,0.12);
  color: var(--text);
}

/* --- EDN overlay (edn.css) --- */
:root[data-theme="light"] .edn-panel{
  border: 1px solid rgba(0,0,0,0.18);
  background: rgba(255,255,255,0.98);
  box-shadow: 0 12px 40px rgba(0,0,0,0.18);
}
:root[data-theme="light"] .edn-header{
  background: rgba(0,0,0,0.03);
  border-bottom: 1px solid rgba(0,0,0,0.10);
}
:root[data-theme="light"] .edn-col-left{ border-right:1px solid rgba(0,0,0,0.10); }
:root[data-theme="light"] .edn-item{
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(255,255,255,0.85);
}
:root[data-theme="light"] .edn-item:hover{ background: rgba(37,99,235,0.06); }
:root[data-theme="light"] .edn-item.active{ border-color: rgba(37,99,235,0.45); }

/* --- AI Assistant tabs (assistant.css uses var(--stroke) and light text in active tab) --- */
:root[data-theme="light"] .tabs-shell{ border-color: var(--stroke); }
:root[data-theme="light"] .tabs-bar{
  background: rgba(0,0,0,0.03);
  border-bottom: 1px solid rgba(0,0,0,0.10);
}
:root[data-theme="light"] .tab-btn{
  border-color: rgba(0,0,0,0.18);
  background: rgba(255,255,255,0.65);
}
:root[data-theme="light"] .tab-btn:hover{ background: rgba(37,99,235,0.06); }
:root[data-theme="light"] .tab-btn.active{
  background: rgba(11,122,51,0.12);
  border-color: rgba(11,122,51,0.35);
  color: var(--text);
}

/* --- GP Stats skin (stats_gp.css) --- */
/* Override gp variables (stats_gp.css defines :root --gp-*; attribute selector wins). */
:root[data-theme="light"]{
  --gp-bg0: var(--bg);
  --gp-bg1: #ffffff;
  --gp-panel: var(--panel);
  --gp-panel2: var(--panel2);
  --gp-panel3: var(--panel3);
  --gp-border: rgba(0,0,0,0.18);
  --gp-border2: rgba(0,0,0,0.28);
  --gp-text: var(--text);
  --gp-muted: var(--muted);
  --gp-green: var(--good);
  --gp-red: var(--bad);
}

:root[data-theme="light"] body.gp-stats-page{
  background:
    radial-gradient(1200px 700px at 65% 20%, rgba(37,99,235,.10), rgba(0,0,0,0)),
    radial-gradient(900px 650px at 20% 85%, rgba(11,122,51,.08), rgba(0,0,0,0)),
    linear-gradient(180deg, #ffffff, var(--bg));
}

:root[data-theme="light"] .gp-left,
:root[data-theme="light"] .gp-right{
  border: 1px solid rgba(0,0,0,0.18);
  background: linear-gradient(180deg, rgba(255,255,255,0.92), rgba(245,247,250,0.92));
  box-shadow: 0 18px 40px rgba(0,0,0,0.14);
}

:root[data-theme="light"] .gp-center{
  border: 1px solid rgba(0,0,0,0.18);
  background: linear-gradient(180deg, rgba(255,255,255,0.92), rgba(245,247,250,0.92));
  box-shadow: 0 18px 40px rgba(0,0,0,0.14);
}

/* --- Tyres module (tyres.css hard-coded dark surfaces) --- */
:root[data-theme="light"] .tyre-thumb{
  background: var(--panel2);
  border-color: rgba(0,0,0,0.18);
}
:root[data-theme="light"] .tyre-thumb img{
  border: 1px solid rgba(0,0,0,0.10);
  background: #ffffff;
}
:root[data-theme="light"] .tyre-thumb-label .name{ color: var(--text); }
:root[data-theme="light"] .tyre-thumb-badge{
  color: var(--text);
  background: rgba(37,99,235,0.10);
  border-color: rgba(0,0,0,0.18);
}
:root[data-theme="light"] .tyre-thumb-badge.edited{
  background: rgba(11,122,51,0.10);
  border-color: rgba(11,122,51,0.25);
}
:root[data-theme="light"] .tyre-editor-img{
  background: #ffffff;
}
:root[data-theme="light"] .tyre-note{
  background: #ffffff;
  border-color: rgba(0,0,0,0.18);
  color: var(--text);
}

/* --- Power module (power.css hard-coded dark surfaces) --- */
:root[data-theme="light"] .cfg-group{
  background: var(--panel2);
  border-color: rgba(0,0,0,0.18);
}
:root[data-theme="light"] .cfg-h{ color: var(--text); }
:root[data-theme="light"] .tbtn{
  background: #ffffff;
  color: var(--text);
  border-color: rgba(0,0,0,0.18);
}
:root[data-theme="light"] .tbtn:hover{ border-color: rgba(0,0,0,0.35); }

/* Power module declares global select/background; normalize under light mode */
:root[data-theme="light"] body select{
  background:#ffffff;
  color:var(--text);
  border-color: rgba(0,0,0,0.18);
}

/* --- Video module touches black backgrounds; keep those black, but fix borders in light mode --- */
:root[data-theme="light"] .video-canvas-wrap{
  border-color: rgba(0,0,0,0.18);
}
:root[data-theme="light"] .video-placeholder{
  background: rgba(255,255,255,0.70);
  color: var(--text);
}

/* --- Helpdesk / tickets thread surface --- */
:root[data-theme="light"] .thread{
  background: rgba(0,0,0,0.03);
  border-color: rgba(0,0,0,0.18);
}

/* --- Community module (chat, forums, data library) --- */
:root[data-theme="light"] .community-subtabs .subtab{
  background: linear-gradient(180deg, #ffffff 0%, #e9edf2 100%);
  border-color: var(--stroke);
  color: var(--text);
  box-shadow: 0 1px 0 rgba(0,0,0,0.04) inset;
}
:root[data-theme="light"] .community-subtabs .subtab:hover{
  border-color: var(--border);
}
:root[data-theme="light"] .community-subtabs .subtab.active{
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--focus);
}

:root[data-theme="light"] .community-presence-select,
:root[data-theme="light"] .community-screen-name-input-wrap .form-input,
:root[data-theme="light"] .community-search,
:root[data-theme="light"] .community-conv-input{
  background: #ffffff;
  color: var(--text);
  border-color: var(--stroke);
}

:root[data-theme="light"] .community-screen-name-input-wrap .btn,
:root[data-theme="light"] .community-screen-name-save{
  background: #ffffff;
  color: var(--text);
  border-color: var(--stroke);
}
:root[data-theme="light"] .community-screen-name-input-wrap .btn:hover,
:root[data-theme="light"] .community-screen-name-save:hover{
  border-color: var(--border);
}

:root[data-theme="light"] .community-placeholder{
  background: rgba(0,0,0,0.03);
  border-color: var(--stroke);
  color: var(--muted);
}

:root[data-theme="light"] .community-list-item:hover,
:root[data-theme="light"] .community-pending-item:hover{
  background: rgba(0,0,0,0.05);
}
:root[data-theme="light"] .community-list-item.active,
:root[data-theme="light"] .community-friend-item[data-user-id].active{
  background: rgba(37,99,235,0.12);
  border-left-color: var(--accent);
}

:root[data-theme="light"] .community-pending-actions .btn{
  background: #ffffff;
  color: var(--text);
  border-color: var(--stroke);
}
:root[data-theme="light"] .community-pending-actions .btn:hover{
  border-color: var(--border);
}
:root[data-theme="light"] .community-pending-actions .btn-success{
  background: rgba(11,122,51,0.12);
  border-color: rgba(11,122,51,0.35);
  color: var(--good);
}
:root[data-theme="light"] .community-pending-actions .btn-success:hover{
  border-color: rgba(11,122,51,0.55);
}

:root[data-theme="light"] .community-blocked-item:hover{
  background: rgba(0,0,0,0.04);
}

:root[data-theme="light"] .community-msg-mine{
  background: rgba(37,99,235,0.18);
}
:root[data-theme="light"] .community-msg-theirs{
  background: rgba(0,0,0,0.06);
}

:root[data-theme="light"] .community-conv-form .btn,
:root[data-theme="light"] .community-add-friend-actions .btn{
  background: #ffffff;
  color: var(--text);
  border-color: var(--stroke);
}
:root[data-theme="light"] .community-conv-form .btn:hover,
:root[data-theme="light"] .community-add-friend-actions .btn:hover{
  border-color: var(--border);
}
:root[data-theme="light"] .community-conv-form .btn.primary,
:root[data-theme="light"] .community-add-friend-actions .btn.primary{
  background: linear-gradient(180deg, #3b82f6 0%, #1d4ed8 100%);
  border-color: rgba(0,0,0,0.20);
  color: #ffffff;
}
:root[data-theme="light"] .community-conv-form .btn.primary:hover,
:root[data-theme="light"] .community-add-friend-actions .btn.primary:hover{
  filter: brightness(1.05);
}

:root[data-theme="light"] .community-add-friend-inner,
:root[data-theme="light"] .community-policies-inner{
  background: var(--panel2);
  border-color: var(--stroke);
}

:root[data-theme="light"] .community-ptt-btn.listening{
  background: rgba(176,0,32,0.15);
  color: var(--bad);
}

:root[data-theme="light"] .community-create-group-members{
  background: rgba(0,0,0,0.03);
  border-color: var(--stroke);
}
:root[data-theme="light"] .community-create-group-member-row:hover{
  background: rgba(0,0,0,0.05);
}
:root[data-theme="light"] .community-group-item:hover{
  background: rgba(0,0,0,0.05);
}
:root[data-theme="light"] .community-group-item.active{
  background: rgba(37,99,235,0.12);
  border-left-color: var(--accent);
}

:root[data-theme="light"] .community-listening-box{
  background: rgba(37,99,235,0.12);
  border-color: rgba(37,99,235,0.35);
}

:root[data-theme="light"] .community-datalibrary-file-select,
:root[data-theme="light"] .community-datalibrary-target-select{
  background: #fff;
  border-color: var(--stroke);
  color: var(--text);
}
:root[data-theme="light"] .community-datalibrary-file-select:hover,
:root[data-theme="light"] .community-datalibrary-target-select:hover{
  border-color: var(--border);
}
