/**
 * Hiire portal shell — shared layout for candidate, client, and apply pages.
 */

:root {
  --hiire-primary: #15233F;
  --hiire-accent: #C45D2E;
  --hiire-accent-hover: #B15428;
  --hiire-background: #F6F1E8;
  --hiire-surface: #FCFAF4;
  --hiire-border: #E3DACB;
  --hiire-text-primary: #15233F;
  --hiire-text-secondary: #5C6678;
  --hiire-text-muted: #8A8F9A;
  --hiire-font-heading: 'Archivo', sans-serif;
  --hiire-font-body: 'IBM Plex Sans', sans-serif;
  --success: #357A57;
  --warning: #C2872C;
  --error: #B23A2C;
  --info: #2C3E5E;
  --sidebar-border: rgba(255, 255, 255, 0.12);
  /* Legacy colour aliases (cream/navy portal shell) */
  --gold: var(--hiire-primary);
  --gold-light: var(--hiire-accent-hover);
  --dark: var(--hiire-background);
  --dark-2: var(--hiire-surface);
  --dark-3: #FFFFFF;
  --dark-4: var(--hiire-background);
  --border: var(--hiire-border);
  --text: var(--hiire-text-primary);
  --text-muted: var(--hiire-text-muted);
  --muted: var(--hiire-text-muted);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html {
  color-scheme: light;
}

body {
  background: var(--hiire-background) !important;
  color: var(--hiire-text-primary) !important;
  font-family: var(--hiire-font-body) !important;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  color-scheme: light;
}

body::before {
  background-image: linear-gradient(rgba(21, 35, 63, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21, 35, 63, 0.04) 1px, transparent 1px) !important;
}

/* ── NAV HEADERS (navy) ── */
.portal-header,
.phdr,
.hdr,
.ob-hdr {
  background: var(--hiire-primary) !important;
  border-bottom: 1px solid var(--sidebar-border) !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.portal-header {
  padding: 12px 16px;
}

/* Logos on navy chrome stay white */
.portal-header .portal-logo,
.phdr .plogo,
.hdr .hdr-logo,
.ob-hdr .ob-logo,
.auth-mobile-hdr .plogo {
  font-family: var(--hiire-font-heading) !important;
  color: #FFFFFF !important;
  letter-spacing: 0.02em !important;
  text-transform: none;
  flex: 0 0 auto;
  max-width: 70%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-header .portal-logo span,
.phdr .plogo span,
.hdr .hdr-logo span,
.ob-hdr .ob-logo span,
.auth-mobile-hdr .plogo span {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Auth / cream-ground wordmarks — navy and prominent */
.wordmark,
.reg-page .logo,
.verify-main .logo,
.auth-wrap .logo,
.auth-wrap .auth-logo,
.auth-box .logo,
.auth-box .auth-logo {
  font-family: var(--hiire-font-heading) !important;
  font-weight: 800 !important;
  font-size: clamp(1.75rem, 4vw, 2.25rem) !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
  color: #15233F !important;
  text-align: center;
  margin: 0 0 0.35rem !important;
}

.wordmark span,
.reg-page .logo span,
.verify-main .logo span,
.auth-wrap .logo span,
.auth-wrap .auth-logo span,
.auth-box .logo span,
.auth-box .auth-logo span {
  color: #15233F !important;
}

.auth-wrap .auth-brand,
.auth-box .auth-brand {
  display: block;
  width: 100%;
  text-align: center;
  margin: 0 0 1.75rem;
}

.auth-wrap .tagline,
.auth-wrap .auth-tagline,
.auth-box .tagline,
.auth-box .auth-tagline {
  display: block;
  width: 100%;
  text-align: center !important;
  letter-spacing: 0.12em !important;
  margin: 0 !important;
}

.hdr-step,
.ob-progress,
.progress {
  background: var(--hiire-surface) !important;
  border-bottom-color: var(--hiire-border) !important;
}

.ptabs {
  background: var(--hiire-surface) !important;
  border-bottom-color: var(--hiire-border) !important;
}

.ptab.on {
  color: var(--hiire-primary) !important;
  border-bottom-color: var(--hiire-primary) !important;
}

/* ── FORM CONTROLS (light surface, navy text) ── */
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="color"]),
textarea,
select {
  background-color: #FFFFFF !important;
  color: var(--hiire-text-primary) !important;
  -webkit-text-fill-color: var(--hiire-text-primary) !important;
  caret-color: var(--hiire-text-primary) !important;
  color-scheme: light;
}

input::placeholder,
textarea::placeholder {
  color: var(--hiire-text-muted) !important;
  -webkit-text-fill-color: var(--hiire-text-muted) !important;
  opacity: 1;
}

/* ── PRIMARY BUTTONS (orange only) ── */
.btn-main,
.btn-gold,
.btn-primary,
.btn-next.primary,
button.primary,
.cbtn.gold,
.pb-gold,
.pb-gold:hover,
.pe-save:not(.secondary),
.doc-btn.primary,
.contact-team-bar a {
  background: var(--hiire-accent) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  border-color: var(--hiire-accent) !important;
}

.btn-main:hover,
.btn-gold:hover,
.btn-primary:hover,
.btn-next.primary:hover,
.pe-save:not(.secondary):hover:not(:disabled) {
  background: var(--hiire-accent-hover) !important;
  border-color: var(--hiire-accent-hover) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* ── MOBILE NAV ── */
.vs-mnav-toggle {
  background: var(--hiire-primary) !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
  color: #FFFFFF !important;
}
.vs-mnav-bar { background: #FFFFFF !important; }
#cli-mnav-panel {
  background: var(--hiire-primary) !important;
  border-bottom-color: rgba(255, 255, 255, 0.2) !important;
}
.cli-mnav-item {
  color: rgba(255, 255, 255, 0.9) !important;
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
  font-family: var(--hiire-font-body) !important;
  text-transform: none !important;
}

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--hiire-background); }
::-webkit-scrollbar-thumb { background: var(--hiire-border); border-radius: 3px; }