/* ETEA module tokens — light */
html[data-theme="light"] {
  --et-bg: #f0f0f1;
  --et-bg-elevated: #ffffff;
  --et-surface: #ffffff;
  --et-surface-2: #f6f7f7;
  --et-border: #c3c4c7;
  --et-border-subtle: #dcdcde;
  --et-text: #1d2327;
  --et-text-soft: #50575e;
  --et-text-muted: #646970;
  --et-alert-soft: rgba(214, 54, 56, 0.1);
  --et-alert-border: rgba(214, 54, 56, 0.35);
  --et-warn-soft: rgba(219, 166, 23, 0.15);
  --et-action: #1d2327;
  --et-action-bg: #f6f7f7;
  --et-action-hover: #f0f0f1;
  --sergio-bg: var(--et-bg);
  --sergio-bg-soft: var(--et-bg-elevated);
  --sergio-surface: var(--et-surface);
  --sergio-surface-soft: var(--et-surface-2);
  --sergio-border-subtle: var(--et-border-subtle);
  --sergio-border-strong: var(--et-border);
  --sergio-text: var(--et-text);
  --sergio-text-soft: var(--et-text-soft);
  --sergio-muted: var(--et-text-muted);
  --sergio-accent-soft: rgba(34, 113, 177, 0.1);
  --sergio-backdrop: rgba(0, 0, 0, 0.45);
  --card: #ffffff;
  --bg2: #f0f0f1;
}

/**
 * ETEA Portal — Light professional theme (WordPress admin inspired)
 */

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

  /* WP-like palette */
  --wp-body: #f0f0f1;
  --wp-surface: #ffffff;
  --wp-sidebar: #ffffff;
  --wp-sidebar-border: #dcdcde;
  --wp-topbar: #ffffff;
  --wp-border: #c3c4c7;
  --wp-border-light: #dcdcde;
  --wp-text: #1d2327;
  --wp-text-muted: #646970;
  --wp-primary: #2271b1;
  --wp-primary-hover: #135e96;
  --wp-accent: #2271b1;
  --wp-warn: #dba617;
  --wp-success: #00a32a;
  --wp-danger: #d63638;
  --wp-radius: 4px;
  --wp-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
  --wp-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06);

  /* Map to dashboard tokens */
  --bg: var(--wp-body);
  --bg2: var(--wp-body);
  --surface: var(--wp-surface);
  --border: var(--wp-border-light);
  --text: var(--wp-text);
  --accent: var(--wp-primary);
  --warn: var(--wp-warn);
  --accent-rgb: 34 113 177;
  --warn-rgb: 219 166 23;
  --sidebar-rgb: 255 255 255;
  --sidebar-alpha: 1;
  --topbar-rgb: 255 255 255;
  --topbar-alpha: 1;
  --main-bg-rgb: 240 240 241;
  --main-bg-alpha: 1;
  --menu-hover-rgb: 34 113 177;
  --menu-hover-alpha: 0.08;
  --portal-name-rgb: 29 35 39;
  --portal-subtitle-rgb: 100 105 112;
  --header-title-rgb: 29 35 39;
  --radius: var(--wp-radius);
  --shadow: var(--wp-shadow-card);
}

html[data-theme="light"] {
  background: var(--wp-body) !important;
}

html[data-theme="light"] body {
  color: var(--wp-text) !important;
  background: var(--wp-body) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
  font-size: 14px;
  line-height: 1.5;
}

html[data-theme="light"] #tsparticles,
html[data-theme="light"] #mainBgImageLayer {
  display: none !important;
}

/* ── Sidebar (WP admin menu) ───────────────── */
html[data-theme="light"] .sidebar,
html[data-theme="light"] #sidebar {
  background: var(--wp-sidebar) !important;
  border-right: 1px solid var(--wp-sidebar-border) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .sidebar nav a {
  color: var(--wp-text) !important;
  border-radius: var(--wp-radius) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin: 2px 8px;
}

html[data-theme="light"] .sidebar nav a:hover,
html[data-theme="light"] .sidebar nav a:focus-visible {
  background: #f6f7f7 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  color: var(--wp-primary) !important;
}

html[data-theme="light"] .sidebar nav a.is-active {
  background: #f0f6fc !important;
  border-color: transparent !important;
  color: var(--wp-primary) !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .sidebar nav a.is-active::before {
  background: var(--wp-primary) !important;
  box-shadow: none !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 4px !important;
  border-radius: 0 !important;
}

html[data-theme="light"] #portalNameSidebar {
  color: var(--wp-text) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
}

html[data-theme="light"] #portalSubtitleSidebar {
  color: var(--wp-text-muted) !important;
  font-size: 12px !important;
}

/* ── Topbar ─────────────────────────────────── */
html[data-theme="light"] .topbar {
  background: var(--wp-topbar) !important;
  border-bottom: 1px solid var(--wp-sidebar-border) !important;
  color: var(--wp-text) !important;
  backdrop-filter: none !important;
}

html[data-theme="light"] #portalHeaderTitle {
  color: var(--wp-text) !important;
  font-size: 20px !important;
  font-weight: 600 !important;
}

/* ── Main content ───────────────────────────── */
html[data-theme="light"] main.flex-1,
html[data-theme="light"] main.flex-1.p-6 {
  color: var(--wp-text) !important;
  background: var(--wp-body) !important;
}

html[data-theme="light"] main.flex-1 h2 {
  color: var(--wp-text) !important;
  font-size: 23px !important;
  font-weight: 400 !important;
  margin-bottom: 1rem !important;
}

/* Postbox-style chart cards */
html[data-theme="light"] .dashboard-chart-box {
  background: var(--wp-surface) !important;
  border: 1px solid var(--wp-border) !important;
  border-radius: var(--wp-radius) !important;
  box-shadow: var(--wp-shadow) !important;
  padding: 0 !important;
  overflow: hidden;
}

html[data-theme="light"] .dashboard-chart-title {
  color: var(--wp-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 12px 16px !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--wp-border-light) !important;
  background: #f6f7f7 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html[data-theme="light"] .dashboard-chart-box canvas {
  padding: 12px 16px 16px !important;
}

/* ── Buttons ────────────────────────────────── */
html[data-theme="light"] .btn-accent,
html[data-theme="light"] .btn-primary,
html[data-theme="light"] .sergio-btn--primary,
html[data-theme="light"] [class*="btn-accent"] {
  background: var(--accent, var(--wp-primary)) !important;
  border-color: var(--accent, var(--wp-primary)) !important;
  color: #fff !important;
  border-radius: var(--wp-radius) !important;
  box-shadow: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 500 !important;
}

html[data-theme="light"] .btn-accent:hover,
html[data-theme="light"] .btn-primary:hover,
html[data-theme="light"] .sergio-btn--primary:hover {
  filter: brightness(0.92);
}

html[data-theme="light"] .btn:not(.btn-accent):not(.btn-primary):not(.btn-grad):not(.btn-danger),
html[data-theme="light"] .sergio-btn:not(.sergio-btn--primary):not(.sergio-btn--ghost):not(.sergio-btn--ghost-danger) {
  background: #f6f7f7 !important;
  border: 1px solid var(--wp-border) !important;
  color: var(--wp-text) !important;
  border-radius: var(--wp-radius) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

html[data-theme="light"] .btn:not(.btn-accent):not(.btn-primary):not(.btn-grad):not(.btn-danger):hover,
html[data-theme="light"] .sergio-btn:not(.sergio-btn--primary):not(.sergio-btn--ghost):not(.sergio-btn--ghost-danger):hover {
  background: #f0f0f1 !important;
  border-color: #8c8f94 !important;
  transform: none !important;
}

html[data-theme="light"] .sergio-btn--ghost {
  background: transparent !important;
  border-color: var(--wp-border) !important;
  color: var(--wp-text-muted) !important;
}

html[data-theme="light"] .sergio-btn--ghost:hover {
  background: #f6f7f7 !important;
  border-color: #8c8f94 !important;
  color: var(--wp-text) !important;
}

html[data-theme="light"] .sergio-btn--ghost-danger {
  background: transparent !important;
  border-color: var(--wp-danger) !important;
  color: var(--wp-danger) !important;
}

html[data-theme="light"] .sergio-btn--ghost-danger:hover {
  background: rgba(214, 54, 56, 0.08) !important;
  border-color: var(--wp-danger) !important;
  color: #b32d2e !important;
}

/* ── Module: eventologio / emergency glass UI ─ */
html[data-theme="light"] .btn-glass,
html[data-theme="light"] .btn-grad,
html[data-theme="light"] .glass,
html[data-theme="light"] .select-glass,
html[data-theme="light"] .month-chip {
  background: var(--wp-surface) !important;
  border: 1px solid var(--wp-border) !important;
  color: var(--wp-text) !important;
  box-shadow: var(--wp-shadow) !important;
  backdrop-filter: none !important;
}

html[data-theme="light"] .btn-grad {
  background: var(--wp-primary) !important;
  border-color: var(--wp-primary) !important;
  color: #fff !important;
}

html[data-theme="light"] .text-white,
html[data-theme="light"] .text-white\/90,
html[data-theme="light"] .text-white\/80 {
  color: var(--wp-text) !important;
}

html[data-theme="light"] .text-red-300,
html[data-theme="light"] .text-red-400 {
  color: var(--wp-danger) !important;
}

html[data-theme="light"] .text-gray-300,
html[data-theme="light"] .text-gray-400 {
  color: var(--wp-text-muted) !important;
}

html[data-theme="light"] .bg-black\/40,
html[data-theme="light"] .bg-black\/70,
html[data-theme="light"] .bg-slate-900,
html[data-theme="light"] .bg-gray-900 {
  background: var(--wp-surface) !important;
}

html[data-theme="light"] .calendar-cell {
  background: var(--wp-surface) !important;
  border: 1px solid var(--wp-border-light) !important;
  color: var(--wp-text) !important;
}

html[data-theme="light"] .calendar-cell .et-date {
  color: var(--wp-text) !important;
}

html[data-theme="light"] #eventDetailsModal > div {
  background: rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="light"] #eventDetailsModal .bg-slate-900 {
  background: var(--wp-surface) !important;
  border: 1px solid var(--wp-border) !important;
  color: var(--wp-text) !important;
}

/* Rescuers module cards */
html[data-theme="light"] #rescuersModuleContainer .bg-black\/40 {
  background: var(--wp-surface) !important;
  border: 1px solid var(--wp-border-light) !important;
  box-shadow: var(--wp-shadow-card) !important;
  color: var(--wp-text) !important;
}

html[data-theme="light"] #rescuersModuleContainer .text-white,
html[data-theme="light"] #rescuersModuleContainer .text-gray-300 {
  color: var(--wp-text) !important;
}

html[data-theme="light"] #rescuersModuleContainer .text-gray-300 {
  color: var(--wp-text-muted) !important;
}

/* Tables */
html[data-theme="light"] table thead th {
  background: #f6f7f7 !important;
  color: var(--wp-text) !important;
  border-bottom: 1px solid var(--wp-border) !important;
}

html[data-theme="light"] table tbody td {
  border-bottom: 1px solid var(--wp-border-light) !important;
  color: var(--wp-text) !important;
}

/* User dropdown */
html[data-theme="light"] #userDropdown {
  background: var(--wp-surface) !important;
  border: 1px solid var(--wp-border) !important;
  color: var(--wp-text) !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12) !important;
}

/* Admin settings panel */
html[data-theme="light"] #adminSettingsPanel,
html[data-theme="light"] [class*="bg-zinc-900"] {
  background: var(--wp-surface) !important;
  color: var(--wp-text) !important;
  border-color: var(--wp-border) !important;
}

/* Scrollbars */
html[data-theme="light"] ::-webkit-scrollbar-track {
  background: #f0f0f1 !important;
}

html[data-theme="light"] ::-webkit-scrollbar-thumb {
  background: #c3c4c7 !important;
}

/* Tailwind utility overrides inside dashboard */
html[data-theme="light"] .text-gray-100 {
  color: var(--wp-text) !important;
}

html[data-theme="light"] .border-white\/10,
html[data-theme="light"] .border-white\/20 {
  border-color: var(--wp-border-light) !important;
}

html[data-theme="light"] .bg-white\/10,
html[data-theme="light"] .bg-white\/80 {
  background: var(--wp-surface) !important;
}

html[data-theme="light"] .ring-white\/10 {
  --tw-ring-color: var(--wp-border-light) !important;
}

html[data-theme="light"] .from-slate-900,
html[data-theme="light"] .to-slate-700,
html[data-theme="light"] .bg-gradient-to-r {
  background: var(--wp-surface) !important;
  color: var(--wp-text) !important;
}

/* Login page (when etea-gov + portal-light linked) */
html[data-theme="light"] .login-wrap {
  background: var(--wp-body) !important;
}

html[data-theme="light"] .login-card {
  background: var(--wp-surface) !important;
  border: 1px solid var(--wp-border) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
  color: var(--wp-text) !important;
}

html[data-theme="light"] .login-card input {
  background: #fff !important;
  border: 1px solid var(--wp-border) !important;
  color: var(--wp-text) !important;
}

/* ── Login / register pages (index.php, register.php) ── */
html[data-theme="light"] {
  --bg: #f0f0f1;
  --bg2: #f0f0f1;
  --card: #ffffff;
  --border: #c3c4c7;
  --text: #1d2327;
}

html[data-theme="light"] #bg {
  background: #f0f0f1 !important;
}

html[data-theme="light"] .login-card .logo-text,
html[data-theme="light"] .login-card h1 {
  background: linear-gradient(135deg, #1d2327 20%, #50575e) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

html[data-theme="light"] .login-card .logo-sub,
html[data-theme="light"] .field label,
html[data-theme="light"] .remember {
  color: #646970 !important;
}

html[data-theme="light"] .field input {
  background: #fff !important;
  border: 1px solid #c3c4c7 !important;
  color: #1d2327 !important;
}

html[data-theme="light"] .field input::placeholder {
  color: #8c8f94 !important;
}

html[data-theme="light"] .field input:focus {
  background: #fff !important;
  border-color: #2271b1 !important;
  box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.15) !important;
}

html[data-theme="light"] .card-footer span,
html[data-theme="light"] .register-wizard-link {
  color: #646970 !important;
}

html[data-theme="light"] .telegram-join-card {
  background: #fff !important;
  border-color: #c3c4c7 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

html[data-theme="light"] .telegram-join-card__title,
html[data-theme="light"] .telegram-join-card__hint {
  color: #1d2327 !important;
}

html[data-theme="light"] .telegram-join-card__subtitle,
html[data-theme="light"] .telegram-join-card__steps,
html[data-theme="light"] .telegram-join-card__note {
  color: #646970 !important;
}

html[data-theme="light"] #pushNotifBtn,
html[data-theme="light"] #userMenuBtn {
  border-color: #c3c4c7 !important;
  background: #fff !important;
  color: #646970 !important;
}

html[data-theme="light"] #portalHeaderTitle {
  color: #1d2327 !important;
}

html[data-theme="light"] .register-shell,
html[data-theme="light"] .register-card,
html[data-theme="light"] .wizard-card {
  background: #fff !important;
  border-color: #c3c4c7 !important;
  color: #1d2327 !important;
}

html[data-theme="light"] .mobile-entry-wrap,
html[data-theme="light"] .mobile-entry-card {
  background: #f0f0f1 !important;
  color: #1d2327 !important;
}

html[data-theme="light"] .mobile-bottom-nav {
  background: #fff !important;
  border-top-color: #dcdcde !important;
}