/* Vidyavan - dark ("night") mode.
   EVERY rule here is scoped to html[data-theme="dark"], so the normal light
   design is completely untouched. The theme is switched by assets/js/theme.js
   (header toggle; choice remembered per device; default = light). */

html[data-theme="dark"] {
  color-scheme: dark;
  /* light-surface tokens re-pointed to night values */
  --surface-100: #0A0F1E;
  --surface-raised: #121A2E;
  --ink: #E9EDF7;
  --ink-muted: #A3ABC2;
  --border: rgba(255,255,255,0.10);
  --border-strong: rgba(255,255,255,0.24);
  --primary: #8DBBFF;
  --primary-bright: #6FA8FF;
  --danger: #FF8A80;
  --success: #5FD39A;
  --accent-teal: #3FD3B0;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.4), 0 8px 24px -8px rgba(0,0,0,0.55);
  --shadow-float: 0 24px 60px -20px rgba(0,0,0,0.75);
}

html[data-theme="dark"] body { background: var(--surface-100); color: var(--ink); }

/* Forms (on the normal light sections only - the dark hero and the already-dark
   dashboard panels keep their own see-through input style) */
html[data-theme="dark"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), select, textarea):not(.hero *):not(.dash-premium *) {
  background-color: #0E1528; color: var(--ink); border-color: rgba(255,255,255,0.16);
}
html[data-theme="dark"] :is(input, textarea):not(.hero *)::placeholder { color: #6E7790; }
html[data-theme="dark"] :is(input, select, textarea):disabled:not(.hero *):not(.dash-premium *) { background-color: #0B1122; color: #7C849C; }
html[data-theme="dark"] select option { color: var(--ink); background: #121A2E; }

/* Links on light (now dark) sections */
html[data-theme="dark"] a { color: #8DBBFF; }
html[data-theme="dark"] .btn, html[data-theme="dark"] .site-header a, html[data-theme="dark"] .site-footer a,
html[data-theme="dark"] .nav-links a, html[data-theme="dark"] .lp-job, html[data-theme="dark"] .lp-links a { color: inherit; }
html[data-theme="dark"] .btn-primary { color: #fff; }

/* Secondary buttons on light sections */
html[data-theme="dark"] .btn-secondary { background: transparent; color: var(--ink); border-color: rgba(255,255,255,0.24); }
html[data-theme="dark"] .btn-secondary:hover { background: rgba(255,255,255,0.06); }

/* Status messages */
html[data-theme="dark"] .flash-error { background: rgba(196,69,61,0.16); color: #FFB4AD; border-color: rgba(196,69,61,0.45); }
html[data-theme="dark"] .flash-success { background: rgba(30,122,76,0.18); color: #9EE6BF; border-color: rgba(30,122,76,0.45); }

/* Badges */
html[data-theme="dark"] .badge-pending, html[data-theme="dark"] .badge-open { background: rgba(217,147,47,0.18); color: #F5C77E; }
html[data-theme="dark"] .badge-approved, html[data-theme="dark"] .badge-hired, html[data-theme="dark"] .badge-shortlisted { background: rgba(30,122,76,0.22); color: #8FE0B5; }
html[data-theme="dark"] .badge-rejected { background: rgba(196,69,61,0.2); color: #FFB0A8; }
html[data-theme="dark"] .badge-submitted, html[data-theme="dark"] .badge-reviewed, html[data-theme="dark"] .badge-role { background: rgba(59,125,216,0.2); color: #A9CBFF; }
html[data-theme="dark"] .badge-withdrawn, html[data-theme="dark"] .badge-dismissed { background: rgba(255,255,255,0.08); color: #B9C0D2; }
html[data-theme="dark"] .badge-interview { background: rgba(124,92,214,0.22); color: #C9B6FF; }

/* Profile-strength tips */
html[data-theme="dark"] .tip-high { background: rgba(196,69,61,0.2); color: #FFB0A8; }
html[data-theme="dark"] .tip-med { background: rgba(217,147,47,0.18); color: #F5C77E; }
html[data-theme="dark"] .tip-low { background: rgba(59,125,216,0.2); color: #A9CBFF; }

/* Skeleton shimmer */
html[data-theme="dark"] .skeleton { background-color: rgba(255,255,255,0.06); }

/* Safety notice and generic notices on light sections */
html[data-theme="dark"] .safety-note { background: rgba(240,180,60,0.10); border-color: rgba(240,180,60,0.35); color: var(--ink); }
html[data-theme="dark"] .notice { background: rgba(255,255,255,0.04); border-color: var(--border); color: var(--ink-muted); }
html[data-theme="dark"] .notice strong { color: var(--ink); }

/* Tables */
html[data-theme="dark"] .data-table th { color: var(--ink-muted); }
html[data-theme="dark"] .data-table tr:hover td { background: rgba(255,255,255,0.03); }

/* Images that are dark-on-transparent stay readable */
html[data-theme="dark"] .company-logo, html[data-theme="dark"] .logo-preview img { background: #fff; }

/* Theme toggle button (added to the header by theme.js) */
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin-right: 8px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.28); background: transparent; color: #F4F6FB; cursor: pointer; padding: 0; flex: none; }
.theme-toggle:hover { background: rgba(255,255,255,0.08); }
.theme-toggle svg { width: 18px; height: 18px; }
.theme-toggle .ico-sun { display: none; }
html[data-theme="dark"] .theme-toggle .ico-sun { display: block; }
html[data-theme="dark"] .theme-toggle .ico-moon { display: none; }
@media (max-width: 900px) {
  /* The login/sign-up buttons move into the menu on phones; keep only the toggle visible. */
  .site-header .nav-cta:has(.theme-toggle) { display: flex; order: 1; margin-left: auto; }
  .site-header .nav-cta:has(.theme-toggle) > :not(.theme-toggle) { display: none; }
  .theme-toggle { margin-right: 0; }
}

/* ================================================================
   DAY MODE - a true light design. The original site used dark bands
   (header, hero, footer, dashboards); in day mode those become light so
   day and night look clearly different. Scoped to html:not([data-theme="dark"])
   so night mode keeps the original dark design exactly.
   ================================================================ */
html:not([data-theme="dark"]) {
  --dark-900: #EEF3FB;
  --dark-800: #F7F9FD;
  --dark-700: #FFFFFF;
  --dark-border: rgba(14,18,32,0.10);
  --on-dark: #0E1220;
  --on-dark-muted: #4E5570;
  --gradient-text: linear-gradient(90deg, #1E4F8D 0%, #138A72 60%, #B8741C 100%);
}
html:not([data-theme="dark"]) body { background: #FFFFFF; }

/* Header */
html:not([data-theme="dark"]) .site-header { background: rgba(255,255,255,0.86); box-shadow: 0 1px 0 rgba(14,18,32,0.04), 0 6px 20px -14px rgba(14,18,32,0.18); }
html:not([data-theme="dark"]) .nav-links a:hover { background: rgba(14,18,32,0.05); }
html:not([data-theme="dark"]) .nav-links a.current,
html:not([data-theme="dark"]) .nav-cta a.current { background: rgba(30,79,141,0.10); color: #1E4F8D; }
html:not([data-theme="dark"]) .site-header .btn-secondary,
html:not([data-theme="dark"]) .btn-ghost,
html:not([data-theme="dark"]) .hero .btn-secondary { background: #fff; color: var(--ink); border-color: rgba(14,18,32,0.18); }
html:not([data-theme="dark"]) .site-header .btn-secondary:hover,
html:not([data-theme="dark"]) .btn-ghost:hover,
html:not([data-theme="dark"]) .hero .btn-secondary:hover { background: #F2F5FA; border-color: rgba(14,18,32,0.32); }
html:not([data-theme="dark"]) .nav-toggle { border-color: rgba(14,18,32,0.18); }
html:not([data-theme="dark"]) .theme-toggle { border-color: rgba(14,18,32,0.18); color: #0E1220; background: #fff; }
html:not([data-theme="dark"]) .theme-toggle:hover { background: #F2F5FA; }

/* Hero bands */
html:not([data-theme="dark"]) .hero {
  background: radial-gradient(1200px 600px at 15% -10%, rgba(59,125,216,0.16), transparent 60%),
              radial-gradient(900px 500px at 85% 10%, rgba(22,160,133,0.12), transparent 60%),
              linear-gradient(180deg, #EAF1FC 0%, #F7F9FD 100%);
}
html:not([data-theme="dark"]) .hero::before { background-image: linear-gradient(rgba(14,18,32,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(14,18,32,0.05) 1px, transparent 1px); }
html:not([data-theme="dark"]) .hero::after { opacity: .28; }
html:not([data-theme="dark"]) .hero .eyebrow,
html:not([data-theme="dark"]) .dash-premium .eyebrow.label { color: #0F7F68; }
html:not([data-theme="dark"]) .hero a:not(.btn) { color: #1E4F8D; }
html:not([data-theme="dark"]) .hero .notice { background: rgba(255,255,255,0.7); }
html:not([data-theme="dark"]) .trust-strip span::before { background: #16A085; box-shadow: 0 0 0 4px rgba(22,160,133,0.15); }
html:not([data-theme="dark"]) .hero input[type=text],
html:not([data-theme="dark"]) .hero select { background-color: #fff; border-color: rgba(14,18,32,0.18); }
html:not([data-theme="dark"]) .hero select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 7.5l5 5 5-5' fill='none' stroke='%230E1220' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
html:not([data-theme="dark"]) .hero select:hover { background-color: #F2F5FA; }
html:not([data-theme="dark"]) .hero input[type=text]:focus,
html:not([data-theme="dark"]) .hero select:focus { border-color: #3B7DD8; box-shadow: 0 0 0 4px rgba(59,125,216,0.15); }

/* Product preview window */
html:not([data-theme="dark"]) .product-window { border-color: rgba(14,18,32,0.10); box-shadow: 0 30px 70px -30px rgba(14,18,32,0.35); }
html:not([data-theme="dark"]) .pw-bar { background: #F3F6FB; border-bottom-color: rgba(14,18,32,0.08); }
html:not([data-theme="dark"]) .pw-url { background: #fff; border: 1px solid rgba(14,18,32,0.08); }
html:not([data-theme="dark"]) .pw-row, html:not([data-theme="dark"]) .pw-kpi { background: #F7F9FD; border-color: rgba(14,18,32,0.07); }
html:not([data-theme="dark"]) .pw-pill.ok { background: #E3F5EF; color: #0F7F68; }
html:not([data-theme="dark"]) .pw-pill.warn { background: #FBF0DE; color: #9A5F12; }
html:not([data-theme="dark"]) .pw-pill.bad { background: #FBE7E5; color: #A8352E; }
html:not([data-theme="dark"]) .pw-pill.info { background: #E6EEFA; color: #1E4F8D; }

/* Call-to-action band: brand blue band with white text */
html:not([data-theme="dark"]) .cta-band { background: radial-gradient(700px 300px at 20% 0%, rgba(111,177,255,0.45), transparent 60%), radial-gradient(600px 300px at 90% 100%, rgba(22,160,133,0.55), transparent 60%), #1E4F8D; border-color: transparent; }
html:not([data-theme="dark"]) .cta-band h2 { color: #fff; }
html:not([data-theme="dark"]) .cta-band p { color: rgba(255,255,255,0.85); }
html:not([data-theme="dark"]) .cta-band .btn-secondary, html:not([data-theme="dark"]) .cta-band .btn-ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,0.5); }

/* Footer */
html:not([data-theme="dark"]) .site-footer { background: #F1F4FA; }

/* Mobile bottom tab bar */
html:not([data-theme="dark"]) .bottom-nav { background: rgba(255,255,255,0.94); box-shadow: 0 -10px 28px -20px rgba(14,18,32,0.35); }
html:not([data-theme="dark"]) .bottom-nav a:hover { background: rgba(14,18,32,0.05); }
html:not([data-theme="dark"]) .bottom-nav a.current { color: #1E4F8D; }

/* Dashboards (.dash-premium): white cards on a soft light background */
html:not([data-theme="dark"]) body:has(.dash-premium) {
  background: radial-gradient(1100px 560px at 100% -10%, rgba(59,125,216,0.10), transparent 60%),
              radial-gradient(900px 520px at -8% 12%, rgba(22,160,133,0.08), transparent 55%), #F4F7FC;
}
html:not([data-theme="dark"]) .dash-premium {
  --border-strong: rgba(14,18,32,0.22); --surface-100: #F4F7FC; --surface-raised: #FFFFFF;
}
html:not([data-theme="dark"]) .dash-premium :is(.app-sidebar, .card, .data-table, .form-card, .search-bar, .job-item, .empty-state, .loading-state, .dash-greeting, .kanban-card, .skel-table) {
  background: #FFFFFF; box-shadow: 0 1px 2px rgba(14,18,32,0.05), 0 10px 28px -16px rgba(14,18,32,0.18);
}
html:not([data-theme="dark"]) .dash-premium .kanban-col { background: #EEF2F9; }
html:not([data-theme="dark"]) .dash-premium .card:hover, html:not([data-theme="dark"]) .dash-premium .job-item:hover { border-color: rgba(14,18,32,0.2); box-shadow: 0 16px 36px -18px rgba(14,18,32,0.28); }
html:not([data-theme="dark"]) .dash-premium .app-sidebar a:hover { background: rgba(14,18,32,0.05); }
html:not([data-theme="dark"]) .dash-premium .stat-tile h3,
html:not([data-theme="dark"]) .dash-premium .data-table th { color: #5B6178; }
html:not([data-theme="dark"]) .dash-premium .data-table th { background: #F5F7FB; }
html:not([data-theme="dark"]) .dash-premium .data-table tbody tr:hover { background: #F7F9FD; }
html:not([data-theme="dark"]) .dash-premium a:not(.btn),
html:not([data-theme="dark"]) .dash-premium .data-table a { color: #1E4F8D; }
html:not([data-theme="dark"]) .dash-premium .btn-secondary { background: #fff; border-color: rgba(14,18,32,0.18); }
html:not([data-theme="dark"]) .dash-premium .btn-secondary:hover { background: #F2F5FA; border-color: rgba(14,18,32,0.32); }
html:not([data-theme="dark"]) .dash-premium :is(.field input, .field select, .field textarea, .search-input-wrap input, .search-bar select, .search-bar-input, .data-table select, .inline-select, .save-menu-new input, .member-note textarea) {
  background-color: #FFFFFF; border-color: rgba(14,18,32,0.18);
}
html:not([data-theme="dark"]) .dash-premium :is(.field input, .field textarea, .search-input-wrap input, .search-bar-input)::placeholder { color: #8A90A6; }
html:not([data-theme="dark"]) .dash-premium .field :is(input, select, textarea):focus { background: #fff; }
html:not([data-theme="dark"]) .dash-premium .search-clear { background: rgba(14,18,32,0.08); }
html:not([data-theme="dark"]) .dash-premium .notice { background: #F5F7FB; }
html:not([data-theme="dark"]) .dash-premium .skill-tag { background: #EEF3FB; border-color: rgba(30,79,141,0.18); }
html:not([data-theme="dark"]) .dash-premium .save-menu { background: #fff; box-shadow: 0 16px 40px -16px rgba(14,18,32,0.3); }
html:not([data-theme="dark"]) .dash-premium .pipeline-dot { background: #fff; border-color: rgba(14,18,32,0.18); }
html:not([data-theme="dark"]) .dash-premium .kanban-count { background: rgba(14,18,32,0.07); }
html:not([data-theme="dark"]) .dash-premium .kanban-match,
html:not([data-theme="dark"]) .dash-premium .btn.is-saved { color: #0F7F68; border-color: #16A085; }
/* Status colours: readable on white */
html:not([data-theme="dark"]) .dash-premium .badge-pending, html:not([data-theme="dark"]) .dash-premium .tip-med { background: #FBF0DE; color: #9A5F12; }
html:not([data-theme="dark"]) .dash-premium :is(.badge-approved, .badge-hired, .badge-shortlisted) { background: #E3F4EA; color: #1A6B43; }
html:not([data-theme="dark"]) .dash-premium .badge-rejected, html:not([data-theme="dark"]) .dash-premium .tip-high { background: #FBE7E5; color: #A8352E; }
html:not([data-theme="dark"]) .dash-premium :is(.badge-submitted, .badge-reviewed), html:not([data-theme="dark"]) .dash-premium .tip-low { background: #E6EEFA; color: #1E4F8D; }
html:not([data-theme="dark"]) .dash-premium :is(.badge-withdrawn, .badge-dismissed) { background: #EEF0F4; color: #5B6178; }
html:not([data-theme="dark"]) .dash-premium .badge-interview { background: #EFE8FB; color: #5B3BA8; }
html:not([data-theme="dark"]) .dash-premium .flash-error { background: #FBE7E5; color: #A8352E; }
html:not([data-theme="dark"]) .dash-premium .flash-success { background: #E3F4EA; color: #1A6B43; }
html:not([data-theme="dark"]) .dash-premium .skill-tag button:hover { color: #A8352E; }
html:not([data-theme="dark"]) .dash-premium .app-sidebar a { color: #4E5570; }
html:not([data-theme="dark"]) .dash-premium .app-sidebar a:hover { color: #0E1220; }
html:not([data-theme="dark"]) .dash-premium .app-sidebar a.current { color: #fff; }
html:not([data-theme="dark"]) .dash-premium .app-sidebar a#sidebar-signout { color: #A8352E; }
html:not([data-theme="dark"]) .dash-premium .lists-nav a { color: #0E1220; }

/* Footer brand block has inline light colours - keep it readable in both modes */
.site-footer .brand span { color: var(--on-dark) !important; }
.site-footer .footer-grid p.muted { color: var(--on-dark-muted) !important; }