/* ============================================================
   site-v15.css — Contrast & visibility fixes after white theme
   ============================================================ */

/* ── 1. Buttons: ensure visible variants on white ────── */
.btn.btn-ghost-light {
  color: #14213D !important;
  border-color: rgba(20,33,61,0.25) !important;
  background: #ffffff !important;
}
.btn.btn-ghost-light:hover {
  border-color: #4F8EDC !important;
  color: #4F8EDC !important;
  background: #f5f6f8 !important;
}
.btn.btn-ghost {
  background: #ffffff !important;
  color: #14213D !important;
  border: 1.5px solid rgba(20,33,61,0.20) !important;
}
.btn.btn-ghost:hover { border-color: #4F8EDC !important; color: #4F8EDC !important; }
.btn:disabled, .btn.is-loading { opacity: 0.6 !important; cursor: not-allowed !important; }
.btn:focus-visible, a:focus-visible, button:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid #4F8EDC !important;
  outline-offset: 2px !important;
}

/* Save/bookmark on job cards */
.save-btn { background: #ffffff !important; color: #14213D !important; border: 1px solid rgba(20,33,61,0.18) !important; }
.save-btn:hover { border-color: #4F8EDC !important; color: #4F8EDC !important; }
.save-btn.is-saved { background: #4F8EDC !important; color: #fff !important; border-color: #4F8EDC !important; }

/* ── 2. Card & container separation on white ──────────── */
.card, .case-card, .leader, .insight, .ind-card, .kpi, .dash-card,
.entry-card, .entry-employers, .entry-candidates, .entry-whatsapp,
.mv-card, .why-connect .item, .triptych-dark .item, .roster-group .label,
.brief-form, .job-card, .logo-marquee .logo-tile,
.profile-card, .file-row, .jobs-filter {
  border: 1px solid rgba(20,33,61,0.10) !important;
  box-shadow: 0 1px 2px rgba(20,33,61,0.04) !important;
  background: #ffffff !important;
}
.card:hover, .case-card:hover, .leader:hover, .insight:hover,
.ind-card:hover, .kpi:hover, .job-card:hover {
  border-color: rgba(79,142,220,0.35) !important;
  box-shadow: 0 6px 16px -6px rgba(20,33,61,0.12) !important;
  transform: translateY(-2px);
}

/* Stats band & similar surfaces */
.stats-band { background: #fafbfc !important; border-top: 1px solid rgba(20,33,61,0.08) !important; border-bottom: 1px solid rgba(20,33,61,0.08) !important; }

/* Search bar visible */
.jobs-search { background: #ffffff !important; border: 1px solid rgba(20,33,61,0.12) !important; box-shadow: 0 1px 2px rgba(20,33,61,0.04) !important; }
.jobs-search input, .jobs-search select { background: #ffffff !important; color: #14213D !important; }
.jobs-search input::placeholder { color: #6B7280 !important; }

/* Forms inputs */
.field input, .field textarea, .field select, .field .fake-select,
.input-group input, .input-group select, .input-group textarea,
.tag-input, .dash-topbar .search {
  background: #ffffff !important;
  border: 1px solid rgba(20,33,61,0.18) !important;
  color: #14213D !important;
}
.field input::placeholder, .input-group input::placeholder, .input-group textarea::placeholder {
  color: #6B7280 !important;
}

/* Tables */
.dash-table th { background: #f5f6f8 !important; color: #14213D !important; border-bottom: 1px solid rgba(20,33,61,0.10) !important; }
.dash-table td { color: #14213D !important; border-bottom: 1px solid rgba(20,33,61,0.06) !important; }
.dash-table tbody tr:hover { background: #f5f6f8 !important; }
.dash-table .row-action { background: #f5f6f8 !important; color: #14213D !important; border: 1px solid rgba(20,33,61,0.06) !important; }
.dash-table .row-action:hover { background: #4F8EDC !important; color: #fff !important; border-color: #4F8EDC !important; }
.dash-table .row-action.danger:hover { background: #ef4444 !important; border-color: #ef4444 !important; }

/* ── 3. Hero / CTA / triptych — restore accent backgrounds for visibility ── */
.hero {
  background: linear-gradient(135deg, #4F8EDC 0%, #0058c5 100%) !important;
  color: #ffffff !important;
}
.hero h1, .hero h2, .hero h3, .hero .h1, .hero .h2 { color: #ffffff !important; }
.hero .lede, .hero p { color: rgba(255,255,255,0.92) !important; }
.hero-flank .label { color: rgba(255,255,255,0.92) !important; }
.hero-flank .rule { background: rgba(255,255,255,0.6) !important; }
.hero .btn.btn-primary { background: #ffffff !important; color: #4F8EDC !important; border-color: #ffffff !important; }
.hero .btn.btn-primary:hover { background: #f5f6f8 !important; color: #0058c5 !important; }
.hero .btn.btn-ghost-light { background: transparent !important; color: #ffffff !important; border-color: rgba(255,255,255,0.5) !important; }
.hero .btn.btn-ghost-light:hover { background: rgba(255,255,255,0.1) !important; border-color: #ffffff !important; color: #ffffff !important; }

.cta-dark {
  background: linear-gradient(135deg, #4F8EDC 0%, #0058c5 100%) !important;
  color: #ffffff !important;
}
.cta-dark h2 { color: #ffffff !important; }
.cta-dark p { color: rgba(255,255,255,0.92) !important; }
.cta-dark .eyebrow { color: rgba(255,255,255,0.95) !important; }
.cta-dark .eyebrow::before { background: rgba(255,255,255,0.95) !important; }
.cta-dark .btn.btn-primary { background: #ffffff !important; color: #4F8EDC !important; border-color: #ffffff !important; }
.cta-dark .btn.btn-primary:hover { background: #f5f6f8 !important; color: #0058c5 !important; }
.cta-dark .btn.btn-ghost-light { color: #ffffff !important; border-color: rgba(255,255,255,0.5) !important; background: transparent !important; }
.cta-dark .btn.btn-ghost-light:hover { background: rgba(255,255,255,0.1) !important; border-color: #ffffff !important; }

/* Triptych testimonials — light cards on white */
.triptych-dark .item { background: #ffffff !important; border: 1px solid rgba(20,33,61,0.10) !important; box-shadow: 0 1px 2px rgba(20,33,61,0.04) !important; }
.triptych-dark blockquote { color: #14213D !important; }
.triptych-dark cite { color: #4F8EDC !important; }
.triptych-dark .mark { background: linear-gradient(135deg,#66b3ff 0%,#4F8EDC 100%) !important; color: #fff !important; }

/* Entry employer card — restore blue */
.entry-employers {
  background: linear-gradient(135deg, #4F8EDC 0%, #0058c5 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
.entry-employers h3, .entry-employers .tag { color: #ffffff !important; }
.entry-employers p { color: rgba(255,255,255,0.92) !important; }
.entry-employers .btn { background: #ffffff !important; color: #4F8EDC !important; border-color: #ffffff !important; }
.entry-employers .btn:hover { background: #f5f6f8 !important; color: #0058c5 !important; }

/* Mission/Vision — restore blue for vision card */
.mv-vision {
  background: linear-gradient(135deg, #4F8EDC 0%, #0058c5 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
.mv-vision h3, .mv-vision .tag { color: #ffffff !important; }
.mv-vision h3 em { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; }

/* ── 4. Sticky CTA / WhatsApp / footer admin pill ───── */
.sticky-cta { background: #4F8EDC !important; color: #ffffff !important; border-top: 0 !important; }
.sticky-cta .text .lbl { color: rgba(255,255,255,0.85) !important; }
.sticky-cta .text .sub { color: #ffffff !important; }
.sticky-cta .btn.btn-primary { background: #ffffff !important; color: #4F8EDC !important; border-color: #ffffff !important; }
.sticky-cta .btn.btn-ghost-light { background: transparent !important; color: #ffffff !important; border-color: rgba(255,255,255,0.5) !important; }

.wa-fab { background: #25D366 !important; color: #ffffff !important; box-shadow: 0 6px 16px -4px rgba(37,211,102,0.5) !important; }
.wa-fab svg { fill: #ffffff !important; }
.wa-fab .label { background: #ffffff !important; color: #14213D !important; box-shadow: 0 4px 12px rgba(20,33,61,0.18) !important; }
.wa-fab .label::after { border-left-color: #ffffff !important; }

.footer-admin-btn {
  background: #ffffff !important;
  color: #14213D !important;
  border: 1px solid rgba(20,33,61,0.18) !important;
  box-shadow: 0 4px 12px rgba(20,33,61,0.10) !important;
}
.footer-admin-btn:hover { background: #4F8EDC !important; color: #ffffff !important; border-color: #4F8EDC !important; }
.footer-admin-btn .dot { background: #10b981 !important; }

/* ── 5. Header: pop logo + nav on white ───────────────── */
.utility-bar { background: #fafbfc !important; color: #6b7280 !important; }
.utility-bar a { color: #6b7280 !important; }
.utility-bar a:hover { color: #4F8EDC !important; }
.site-header { background: #ffffff !important; box-shadow: 0 1px 2px rgba(20,33,61,0.05) !important; }
.brand-mark { background: #ffffff !important; border: 1px solid rgba(20,33,61,0.10) !important; }
.menu-toggle { color: #14213D !important; border: 1px solid rgba(20,33,61,0.18) !important; background: #ffffff !important; }
.menu-toggle span { background: #14213D !important; }
.main-nav a { color: #14213D !important; }
.main-nav a:hover { color: #4F8EDC !important; }
.main-nav a.is-active { color: #4F8EDC !important; }
.main-nav a::after { background: #4F8EDC !important; }

.header-cta .login-btn { color: #14213D !important; background: transparent !important; }
.header-cta .login-btn:hover { color: #4F8EDC !important; background: #f5f6f8 !important; }
.user-chip { background: #f5f6f8 !important; color: #14213D !important; border: 1px solid rgba(20,33,61,0.10) !important; }
.user-chip:hover { background: #eaecf0 !important; }
.user-chip .name { color: #14213D !important; }
.user-chip .avatar { background: #4F8EDC !important; color: #ffffff !important; }
.user-chip .caret { color: #6b7280 !important; }
.user-menu { background: #ffffff !important; border: 1px solid rgba(20,33,61,0.10) !important; box-shadow: 0 12px 24px rgba(20,33,61,0.12) !important; }
.user-menu a { color: #14213D !important; }
.user-menu a:hover { background: #f5f6f8 !important; color: #4F8EDC !important; }
.user-menu .header-block .name { color: #14213D !important; }
.user-menu .header-block .role { color: #4F8EDC !important; }
.user-menu a.logout { color: #ef4444 !important; }
.user-menu a.logout:hover { background: #fef2f2 !important; color: #ef4444 !important; }

/* Mobile drawer — keep dark for nav contrast */
.mobile-drawer { background: linear-gradient(180deg, #14213D 0%, #06101c 100%) !important; color: #ffffff !important; }
.mobile-drawer nav a { color: #ffffff !important; border-bottom: 1px solid rgba(255,255,255,0.12) !important; }
.mobile-drawer nav a:hover { color: #66b3ff !important; }
.mobile-drawer nav a .num { color: rgba(255,255,255,0.5) !important; }
.mobile-drawer .close { background: rgba(255,255,255,0.1) !important; color: #ffffff !important; border-color: rgba(255,255,255,0.2) !important; }
.mobile-drawer .drawer-meta { color: rgba(255,255,255,0.7) !important; }
.mobile-drawer .btn.btn-ghost-light { color: #ffffff !important; border-color: rgba(255,255,255,0.4) !important; background: transparent !important; }

/* ── 6. Dashboard topbar visibility ───────────────────── */
.dash-topbar { background: #ffffff !important; border-bottom: 1px solid rgba(20,33,61,0.10) !important; box-shadow: 0 1px 2px rgba(20,33,61,0.04) !important; }
.dash-topbar .greet h1 { color: #14213D !important; }
.dash-topbar .greet p { color: #6B7280 !important; }
.dash-topbar .search { background: #f5f6f8 !important; border: 1px solid rgba(20,33,61,0.08) !important; }
.dash-topbar .search input { color: #14213D !important; }
.dash-topbar .search input::placeholder { color: #6B7280 !important; }
.dash-topbar .icon-btn { background: #f5f6f8 !important; color: #14213D !important; border: 1px solid rgba(20,33,61,0.06) !important; }
.dash-topbar .icon-btn:hover { background: #eaecf0 !important; }
.dash-topbar .icon-btn .dot { border-color: #ffffff !important; }
.dash-topbar .user { background: #f5f6f8 !important; border: 1px solid rgba(20,33,61,0.06) !important; }
.dash-topbar .user .avatar { background: #4F8EDC !important; color: #ffffff !important; }
.dash-topbar .user .name { color: #14213D !important; }
.dash-mobile-toggle { color: #14213D !important; }

/* KPIs */
.kpi .num { color: #14213D !important; }
.kpi .lbl { color: #6B7280 !important; }
.kpi .trend.up { color: #10b981 !important; }
.kpi .trend.down { color: #ef4444 !important; }

/* Status badges ensure contrast (kept tinted) */
.status-badge { border: 1px solid currentColor !important; border-color: transparent !important; }

/* ── 7. Modal contrast ────────────────────────────────── */
.modal { background: #ffffff !important; box-shadow: 0 24px 60px -16px rgba(20,33,61,0.25) !important; }
.modal-head { background: linear-gradient(135deg, #4F8EDC 0%, #0058c5 100%) !important; color: #ffffff !important; }
.modal-head h2 { color: #ffffff !important; }
.modal-head p { color: rgba(255,255,255,0.92) !important; }
.modal-head .brand-row span { color: #ffffff !important; }
.modal-head .close { background: rgba(255,255,255,0.15) !important; color: #ffffff !important; border-color: rgba(255,255,255,0.3) !important; }
.modal-head .close:hover { background: rgba(255,255,255,0.25) !important; }
.modal-tabs { background: #f5f6f8 !important; border-bottom: 1px solid rgba(20,33,61,0.08) !important; }
.modal-tab { color: #6b7280 !important; }
.modal-tab.is-active { background: #ffffff !important; color: #4F8EDC !important; border-bottom: 2px solid #4F8EDC !important; }
.role-row .role-card { background: #ffffff !important; border: 1.5px solid rgba(20,33,61,0.15) !important; color: #14213D !important; }
.role-row .role-card .ic { background: #f5f6f8 !important; color: #4F8EDC !important; }
.role-row input:checked + .role-card { background: #f0f7ff !important; border-color: #4F8EDC !important; box-shadow: 0 0 0 3px rgba(79,142,220,0.15) !important; }
.role-row input:checked + .role-card .ic { background: #4F8EDC !important; color: #ffffff !important; }
.social-btn { background: #ffffff !important; color: #14213D !important; border: 1.5px solid rgba(20,33,61,0.15) !important; }
.social-btn:hover { border-color: #4F8EDC !important; background: #f5f6f8 !important; }
.divider { color: #6B7280 !important; }
.divider::before, .divider::after { background: rgba(20,33,61,0.08) !important; }
.modal-foot .alt { color: #6b7280 !important; }
.modal-foot .alt a { color: #4F8EDC !important; }
.modal-foot .forgot a { color: #4F8EDC !important; }

/* ── 8. Toast contrast ────────────────────────────────── */
.toast { background: #ffffff !important; color: #14213D !important; border-left: 4px solid #4F8EDC !important; box-shadow: 0 16px 32px -12px rgba(20,33,61,0.25) !important; }
.toast.success { border-left-color: #10b981 !important; }
.toast.error { border-left-color: #ef4444 !important; }
.toast.warning { border-left-color: #f59e0b !important; }
.toast .title { color: #14213D !important; }
.toast .msg { color: #6b7280 !important; }
.toast .close { color: #6B7280 !important; }

/* ── 9. Drop zone visibility ─────────────────────────── */
.drop-zone { background: #f5f6f8 !important; border: 2px dashed rgba(20,33,61,0.18) !important; color: #14213D !important; }
.drop-zone:hover, .drop-zone.is-drag { background: #f0f7ff !important; border-color: #4F8EDC !important; }
.drop-zone .ic { background: #ffffff !important; color: #4F8EDC !important; box-shadow: 0 1px 2px rgba(20,33,61,0.06) !important; }
.drop-zone .ttl { color: #14213D !important; }
.drop-zone .sub { color: #6B7280 !important; }

/* ── 10. Pull-quote / logo wall on white ─────────────── */
.pull-quote { background: #ffffff !important; }
.pull-quote .mark { background: linear-gradient(135deg,#66b3ff 0%,#4F8EDC 100%) !important; color: #ffffff !important; box-shadow: 0 6px 16px -6px rgba(79,142,220,0.5) !important; }
.pull-quote blockquote { color: #14213D !important; }
.pull-quote cite { color: #4F8EDC !important; }

.logo-wall { background: #ffffff !important; border-top: 1px solid rgba(20,33,61,0.08) !important; border-bottom: 1px solid rgba(20,33,61,0.08) !important; }
.logo-marquee .logo-tile { background: #ffffff !important; border: 1px solid rgba(20,33,61,0.10) !important; box-shadow: 0 1px 2px rgba(20,33,61,0.04) !important; }
.logo-marquee .logo-tile.tile-stacked { color: #14213D !important; }
.logo-marquee .logo-tile.tile-stacked .sub-line { color: #4F8EDC !important; }
.logo-marquee .logo-tile:hover { border-color: #4F8EDC !important; transform: translateY(-2px); }

/* ── 11. Industry hover-card needs the navy back ──────── */
.ind-card:hover { background: #14213D !important; color: #ffffff !important; border-color: #14213D !important; }
.ind-card:hover h4 { color: #ffffff !important; }
.ind-card:hover .ind-stat { color: #66b3ff !important; }
.ind-card:hover .bignum { color: rgba(255,255,255,0.08) !important; }
.ind-card:hover .rule { background: #66b3ff !important; }

/* ── 12. Job card details ─────────────────────────────── */
.job-card .co-logo { background: #f5f6f8 !important; color: #14213D !important; border: 1px solid rgba(20,33,61,0.08) !important; }
.job-card .ttl { color: #14213D !important; }
.job-card .co { color: #6b7280 !important; }
.job-card .co .verified { color: #4F8EDC !important; }
.job-card .salary { color: #4F8EDC !important; }
.job-card .posted { color: #6B7280 !important; }

/* ── 13. Profile / file row ───────────────────────────── */
.profile-cover { background: linear-gradient(135deg, #4F8EDC 0%, #66b3ff 100%) !important; }
.profile-avatar { background: linear-gradient(135deg, #4F8EDC 0%, #0058c5 100%) !important; color: #ffffff !important; border: 4px solid #ffffff !important; box-shadow: 0 4px 12px rgba(20,33,61,0.12) !important; }
.profile-name h2 { color: #14213D !important; }
.profile-name .meta { color: #6B7280 !important; }
.file-row .ic { background: rgba(79,142,220,0.10) !important; color: #4F8EDC !important; }
.file-row .name { color: #14213D !important; }
.file-row .meta { color: #6B7280 !important; }

/* ── 14. Sidebar nav active state must be readable ──── */
.dash-sidebar nav a { color: rgba(255,255,255,0.75) !important; }
.dash-sidebar nav a:hover { background: rgba(255,255,255,0.08) !important; color: #ffffff !important; }
.dash-sidebar nav a.is-active { background: #4F8EDC !important; color: #ffffff !important; box-shadow: 0 4px 12px -4px rgba(79,142,220,0.6) !important; }
.dash-sidebar nav a .badge { background: rgba(255,255,255,0.15) !important; color: #ffffff !important; }

/* ── 15. Specimen / fn (Expertise tables) ────────────── */
.specimen .row { border-bottom: 1px solid rgba(20,33,61,0.08) !important; }
.specimen .row.head { background: #f5f6f8 !important; }
.specimen .name { color: #14213D !important; }
.specimen .desc { color: #6b7280 !important; }
.specimen .roman { color: #4F8EDC !important; }
.specimen .time { color: #6B7280 !important; }
.fn h4 { color: #14213D !important; border-bottom: 2px solid #4F8EDC !important; padding-bottom: 8px !important; }
.fn li { color: #14213D !important; border-bottom: 1px solid rgba(20,33,61,0.06) !important; }
.fn li:hover { color: #4F8EDC !important; }

/* ── 16. Pill defaults — keep visible ─────────────────── */
.pill { background: #f5f6f8 !important; color: #14213D !important; border: 1px solid rgba(20,33,61,0.06) !important; }
.pill.blue { background: rgba(79,142,220,0.10) !important; color: #4F8EDC !important; border-color: transparent !important; }
.pill.green { background: rgba(16,185,129,0.10) !important; color: #10b981 !important; border-color: transparent !important; }
.pill.amber { background: rgba(245,158,11,0.10) !important; color: #f59e0b !important; border-color: transparent !important; }
.pill.red { background: rgba(239,68,68,0.10) !important; color: #ef4444 !important; border-color: transparent !important; }

/* ── 17. SVG / icons defaults to currentColor ───────── */
svg { fill: currentColor; }
svg[fill="white"], svg[fill="#fff"], svg[fill="#ffffff"], svg[fill="#FFF"], svg[fill="#FFFFFF"] {
  fill: currentColor !important;
}

/* ── 18. Visit split map ──────────────────────────────── */
.visit-split .text { background: #ffffff !important; }
.visit-split .text h3 { color: #14213D !important; }
.visit-split .text p { color: #6B7280 !important; }

/* ── 19. Empty / loader contrast ─────────────────────── */
.empty-state { background: #f5f6f8 !important; border: 1px dashed rgba(20,33,61,0.18) !important; }
.empty-state h3 { color: #14213D !important; }
.empty-state p { color: #6b7280 !important; }
.empty-state .ic { background: #ffffff !important; color: #4F8EDC !important; }
.cj-loader { border-color: rgba(20,33,61,0.1) !important; border-top-color: #4F8EDC !important; }