/*
 * shared-theme.css - same source of truth as oneworldclassroom.de's
 * css/shared-theme.css (dark ash-black default, butter light override).
 * Scoped to the admin panel only via body.admin-body - the public
 * marketing site keeps its own fixed butter palette from style.css.
 */

:root {
  --bg-primary: #0d0d0e;
  --bg-secondary: #17171a;
  --bg-card: #1e1e21;
  --bg-hover: #292930;
  --border: #3a3a3f;
  --border2: #46464c;
  --text-primary: #f4f5f7;
  --text-secondary: #a9adb3;
  --text-muted: #7d8188;

  /* aliases used by the ported lecturer/company portal component CSS,
     matching oneworldclassroom.de's shared-theme.css naming exactly */
  --bg: var(--bg-primary);
  --bg2: var(--bg-secondary);
  --bg3: var(--bg-card);
  --text: var(--text-primary);
  --text2: var(--text-secondary);
  --text3: var(--text-muted);
  --text4: #ffffff;
}

[data-theme="light"] {
  --bg-primary: #fdf6df;
  --bg-secondary: #fffaf0;
  --bg-card: #fffdf6;
  --bg-hover: #f5ecc9;
  --border: #e8dcae;
  --border2: #d8c98a;
  --text-primary: #16161a;
  --text-secondary: #46464c;
  --text-muted: #6b6b70;

  --bg: var(--bg-primary);
  --bg2: var(--bg-secondary);
  --bg3: var(--bg-card);
  --text: var(--text-primary);
  --text2: var(--text-secondary);
  --text3: var(--text-muted);
  --text4: #000000;
}

/*
 * Shared session date/time/timezone block — used by both the lecturer
 * Sessions page and the client Sessions page so the two read identically.
 * Getting this wrong means someone joins at the wrong time or misses a real
 * session, so the time itself is made large/bold and the timezone is broken
 * out into its own labeled badge rather than trailing plain text that's
 * easy to skim past or misread against a different-timezone assumption.
 * Relies on --accent/--accent-dim, which are declared per-portal
 * (lecturer-portal.css / company-portal.css, loaded after this file) —
 * CSS custom properties resolve at paint time, so this still picks up
 * whichever portal's accent is in effect.
 */
.corp-st { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.corp-st-main { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.corp-st-date { font-weight: 700; font-size: 13.5px; color: var(--text2); }
.corp-st-time { font-weight: 900; font-size: 20px; color: var(--text); letter-spacing: .01em; }
.corp-st-tz {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  padding: 4px 10px 4px 8px; border-radius: 999px;
  background: var(--accent-dim); color: var(--accent); border: 1px solid rgba(255, 55, 0, .35);
  white-space: nowrap;
}
.corp-st-tz::before { content: '\1F310'; font-size: 10px; }
.corp-st-unscheduled { font-size: 13.5px; color: var(--text3); font-style: italic; }
.corp-st--muted .corp-st-time { color: var(--text2); }
.corp-st--muted .corp-st-tz { background: var(--bg-hover); color: var(--text2); border-color: var(--border2); }
