/* Candidate portal theme guard.
 * This layer deliberately owns the portal colours so Frappe/ERPNext theme
 * inheritance cannot make interview text or controls unreadable.
 */
.intervee-shell {
  --portal-page-top: #f7f8fc;
  --portal-page-bottom: #edf0f6;
  --portal-surface: #ffffff;
  --portal-surface-soft: #f7f8fb;
  --portal-surface-raised: rgba(255, 255, 255, 0.96);
  --portal-ink: #172033;
  --portal-secondary: #4e5a70;
  --portal-muted: #657084;
  --portal-line: #dfe4ed;
  --portal-input: #ffffff;
  --portal-input-border: #cfd5df;
  --portal-track: #e7eaf0;
  --portal-warning-bg: #fff9ea;
  --portal-warning-border: #efe0b2;
  --portal-warning-text: #74581c;
  --portal-error-bg: #fff2f2;
  --portal-error-border: #ffd6d8;
  --portal-error-text: #9e2930;
  --portal-success-bg: #e7f7f0;
  --portal-success-text: #197553;
  color-scheme: light;
  color: var(--portal-ink) !important;
}

html[data-theme="dark"] .intervee-shell,
body[data-theme="dark"] .intervee-shell,
html.dark .intervee-shell,
body.dark .intervee-shell,
[data-theme="dark"] .intervee-shell {
  --portal-page-top: #11192b;
  --portal-page-bottom: #080d18;
  --portal-surface: #121a2a;
  --portal-surface-soft: #172133;
  --portal-surface-raised: rgba(18, 26, 42, 0.97);
  --portal-ink: #f3f6fb;
  --portal-secondary: #d1d8e5;
  --portal-muted: #a4afc0;
  --portal-line: #2c374a;
  --portal-input: #0e1625;
  --portal-input-border: #3a465a;
  --portal-track: #283347;
  --portal-warning-bg: #2c2413;
  --portal-warning-border: #5e4a20;
  --portal-warning-text: #f4d887;
  --portal-error-bg: #321a1e;
  --portal-error-border: #673038;
  --portal-error-text: #ffb3ba;
  --portal-success-bg: #143026;
  --portal-success-text: #83ddb8;
  color-scheme: dark;
}

.intervee-shell .portal-backdrop {
  background:
    radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 35%),
    radial-gradient(circle at 90% 100%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 32%),
    linear-gradient(180deg, var(--portal-page-top) 0%, var(--portal-page-bottom) 100%) !important;
}

.intervee-shell .portal-card {
  background: var(--portal-surface-raised) !important;
  border-color: var(--portal-line) !important;
  color: var(--portal-ink) !important;
}

.intervee-shell h1,
.intervee-shell h2,
.intervee-shell h3,
.intervee-shell label,
.intervee-shell strong,
.intervee-shell .brand-name,
.intervee-shell .metric-value,
.intervee-shell .device-status-row,
.intervee-shell .recording-status,
.intervee-shell .timer-value,
.intervee-shell .question-text {
  color: var(--portal-ink) !important;
}

.intervee-shell .lead,
.intervee-shell .consent-row,
.intervee-shell .notice-card {
  color: var(--portal-secondary) !important;
}

.intervee-shell .muted,
.intervee-shell .field-help,
.intervee-shell .brand-subtitle,
.intervee-shell .metric-label,
.intervee-shell .mic-label,
.intervee-shell .timer-stage,
.intervee-shell .portal-footer,
.intervee-shell .rule-item p,
.intervee-shell .status-pill {
  color: var(--portal-muted) !important;
}

.intervee-shell .status-pill {
  background: var(--portal-surface-raised) !important;
  border-color: var(--portal-line) !important;
}

.intervee-shell .passcode-input {
  background: var(--portal-input) !important;
  border-color: var(--portal-input-border) !important;
  color: var(--portal-ink) !important;
  -webkit-text-fill-color: var(--portal-ink) !important;
  caret-color: var(--accent);
}

.intervee-shell .passcode-input::placeholder {
  color: color-mix(in srgb, var(--portal-muted) 72%, transparent) !important;
  opacity: 1;
}

.intervee-shell .button.secondary {
  background: var(--portal-surface-soft) !important;
  border-color: var(--portal-line) !important;
  color: var(--portal-ink) !important;
}

.intervee-shell .button.primary:disabled {
  color: #ffffff !important;
}

.intervee-shell .metric-card,
.intervee-shell .rule-item,
.intervee-shell .timer-panel {
  background: var(--portal-surface-soft) !important;
  border-color: var(--portal-line) !important;
  color: var(--portal-ink) !important;
}

.intervee-shell .notice-card {
  background: var(--portal-surface-soft) !important;
  border-color: var(--portal-line) !important;
}

.intervee-shell .notice-card.warning {
  background: var(--portal-warning-bg) !important;
  border-color: var(--portal-warning-border) !important;
  color: var(--portal-warning-text) !important;
}

.intervee-shell .notice-card.warning strong {
  color: var(--portal-warning-text) !important;
}

.intervee-shell .inline-alert.error {
  background: var(--portal-error-bg) !important;
  border-color: var(--portal-error-border) !important;
  color: var(--portal-error-text) !important;
}

.intervee-shell .progress-track,
.intervee-shell .mic-meter {
  background: var(--portal-track) !important;
}

.intervee-shell .device-chip.pending {
  background: var(--portal-surface-soft) !important;
  color: var(--portal-muted) !important;
  border: 1px solid var(--portal-line);
}

html[data-theme="dark"] .intervee-shell .device-chip.good,
[data-theme="dark"] .intervee-shell .device-chip.good {
  background: #143026 !important;
  color: #83ddb8 !important;
}

html[data-theme="dark"] .intervee-shell .device-chip.bad,
[data-theme="dark"] .intervee-shell .device-chip.bad {
  background: #321a1e !important;
  color: #ffb3ba !important;
}

.intervee-shell .success-icon {
  background: var(--portal-success-bg) !important;
  color: var(--portal-success-text) !important;
}

.intervee-shell .error-icon {
  background: var(--portal-error-bg) !important;
  color: var(--portal-error-text) !important;
}

.intervee-shell .rule-number {
  background: color-mix(in srgb, var(--accent) 16%, var(--portal-surface)) !important;
}

.intervee-shell .portal-footer a,
.intervee-shell .eyebrow {
  color: var(--accent) !important;
}

.intervee-shell button:focus-visible,
.intervee-shell input:focus-visible,
.intervee-shell a:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--accent) 58%, transparent);
  outline-offset: 3px;
}