/* ============================================================
   GLMC Portal — theme.css
   Colour palette only — edit here to restyle the portal.
   All other layout/spacing variables live in portal.css.
   ============================================================ */

/* ── Light theme (default) ─────────────────────────────────── */
:root,
body.light {

  /* ── Backgrounds & surfaces ───────────────────────────── */
  --bg:            #f4f5f8;   /* page background — cool off-white */
  --surface:       #ffffff;   /* card / panel background */
  --surface2:      #f0f2f6;   /* inputs, alternating rows */
  --surface3:      #e6e9f0;   /* hover states */

  /* ── Borders ──────────────────────────────────────────── */
  --border:        #e2e5ee;
  --border-dark:   #c8cdd9;

  /* ── Accent (Rhythmetric brand blue) ─────────────────── */
  --accent:        #2158d4;   /* mid-blue from logo gradient */
  --accent-light:  #e8effc;
  --accent-mid:    #1a6aff;   /* bright electric blue — hover/active */

  /* ── Text ─────────────────────────────────────────────── */
  --text:          #1a1d2e;   /* near-black with blue undertone */
  --text-muted:    #5c6282;   /* muted — cool purple-grey */
  --text-dim:      #9499b5;   /* placeholder / disabled */

  /* ── Semantic ─────────────────────────────────────────── */
  --success:       #1a7f4b;
  --warning:       #f97316;
  --warning-bg:    #fff7ed;
  --warning-text:  #9a3412;
  --danger:        #c0312b;

  /* ── Attendance: Present ──────────────────────────────── */
  --p:             #1e7e40;
  --p-bg:          #bbf0cc;
  --p-border:      #34c464;

  /* ── Attendance: Absent ───────────────────────────────── */
  --a:             #c0392b;
  --a-bg:          #fbc4bc;
  --a-border:      #e05a4a;

  /* ── Attendance: Away N/C ─────────────────────────────── */
  --anc:           #b06010;
  --anc-bg:        #fde5a0;
  --anc-border:    #e0a020;

  /* ── Attendance: Closed ───────────────────────────────── */
  --closed:        #0d1b3e;   /* logo navy */
  --closed-bg:     #c8d4ee;
  --closed-border: #4a6aaa;

  /* ── Attendance: First lesson ─────────────────────────── */
  --first:         #0e7878;   /* teal — celebratory, clearly distinct from red */
  --first-bg:      #ccf2f0;
  --first-border:  #2ab8b0;

  /* ── Attendance: Handover ─────────────────────────────── */
  --ho:            #5b21b6;
  --ho-bg:         #ede9fe;
  --ho-border:     #a78bfa;

}

/* ── Dark theme ────────────────────────────────────────────── */
body.dark {

  /* ── Backgrounds & surfaces ───────────────────────────── */
  --bg:            #0f1117;   /* deep blue-black */
  --surface:       #181c27;   /* card background */
  --surface2:      #1e2334;   /* inputs, rows */
  --surface3:      #252b3d;   /* hover */

  /* ── Borders ──────────────────────────────────────────── */
  --border:        #2a3047;
  --border-dark:   #3a4460;

  /* ── Accent ───────────────────────────────────────────── */
  --accent:        #4d7ef5;   /* brighter in dark context */
  --accent-light:  #172044;
  --accent-mid:    #1a6aff;

  /* ── Text ─────────────────────────────────────────────── */
  --text:          #e8eaf4;   /* near-white with blue warmth */
  --text-muted:    #8b93b8;   /* visible muted */
  --text-dim:      #555e80;   /* placeholder — still readable */

  /* ── Semantic ─────────────────────────────────────────── */
  --success:       #34d399;
  --warning:       #fb923c;
  --warning-bg:    #2d1500;
  --warning-text:  #fdba74;
  --danger:        #f87171;

  /* ── Attendance: Present ──────────────────────────────── */
  --p:             #34d399;
  --p-bg:          #064e33;
  --p-border:      #10b981;

  /* ── Attendance: Absent ───────────────────────────────── */
  --a:             #f87171;
  --a-bg:          #4c1010;
  --a-border:      #ef4444;

  /* ── Attendance: Away N/C ─────────────────────────────── */
  --anc:           #fbbf24;
  --anc-bg:        #4a2e00;
  --anc-border:    #d97706;

  /* ── Attendance: Closed ───────────────────────────────── */
  --closed:        #93c5fd;
  --closed-bg:     #1e3560;
  --closed-border: #3b82f6;

  /* ── Attendance: First lesson ─────────────────────────── */
  --first:         #2dd4bf;   /* bright teal on dark */
  --first-bg:      #0d3d38;
  --first-border:  #14b8a6;

  /* ── Attendance: Handover ─────────────────────────────── */
  --ho:            #c4b5fd;
  --ho-bg:         #2e1f5e;
  --ho-border:     #7c3aed;

}

/* ── Timetable hours row (warm amber tone) ──────────────────── */
:root,
body.light {
  --hours-row-bg:       #fffdf5;
  --hours-row-border:   #f0e0b0;
  --hours-label-bg:     #fffbec;
  --hours-accent:       #c09030;
  --hours-text:         #4a2800;
  --hours-muted:        #b08030;
  --hours-label-color:  #6b3a00;
  --hours-input-border: #e8d8a0;
  --inv-row-bg:         #eef3fc;
  --inv-row-border:     #c8d8f0;
}

body.dark {
  --hours-row-bg:       #1c1e2a;
  --hours-row-border:   #2e3048;
  --hours-label-bg:     #181a28;
  --hours-accent:       #a07840;
  --hours-text:         #d4b896;
  --hours-muted:        #7a6040;
  --hours-label-color:  #b09070;
  --hours-input-border: #3a3020;
  --inv-row-bg:         #162038;
  --inv-row-border:     #1e3060;
}