﻿/* Extracted from legacy/includes/inline_styles.php. Keep file order in that include unless deliberately changing the cascade. */
/* Minimal palette pass: white surfaces, dark text, one blue, light gray borders */
:root{--kdx-blue:#2c4699;--kdx-ink:#0b1230;--kdx-muted:#667085;--kdx-border:#e4e7ec;--kdx-soft:#f8fafc}
body{background:#fff!important;color:var(--kdx-ink)!important}
.header,.footer,.card,.job-card,.search,.input,.select,.textarea,.filter-panel,.profile-box,.info,.app-panel,.table-wrap,.application-card,.notification-card,.job-detail-main,.overview-panel,.profile-section-card,.profile-hero-card,.profile-score-card{background:#fff!important;border-color:var(--kdx-border)!important}
.section,.home-stats-band,.role-tabs,.applicant,.panel-inner,.skill-option,.skills-dropdown-menu,.skills-dropdown summary,.upload,.cv-upload,.data-table th,.home-stats-row>.stat .icon,.icon{background:var(--kdx-soft)!important;border-color:var(--kdx-border)!important}
h1,h2,h3,.brand-title,.stat-value,.table-primary,.job-card strong,.profile-box strong{color:var(--kdx-ink)!important}
.lead,.muted,.job-meta,.section-title p:last-child,.tiny,.label,.table-secondary,.table-tertiary{color:var(--kdx-muted)!important}
.btn,.nav-actions .btn:not(.outline),.nav-link.active,.nav-link[aria-current="page"]{background:var(--kdx-blue)!important;color:#fff!important;border-color:var(--kdx-blue)!important;box-shadow:none!important}
.btn:hover,.nav-actions .btn:not(.outline):hover{background:#293681!important;color:#fff!important}
.btn.dark{background:var(--kdx-ink)!important;color:#fff!important}
.btn.outline,.nav-actions .btn.outline,.theme-toggle{background:#fff!important;color:var(--kdx-blue)!important;border-color:var(--kdx-border)!important;box-shadow:none!important}
.btn.outline:hover,.nav-actions .btn.outline:hover,.nav-link:hover,.side-btn:hover,.side-btn.active{background:#e6eefb!important;color:var(--kdx-blue)!important;border-color:var(--kdx-border)!important;box-shadow:none!important}
.eyebrow,.pill,.badge,.tag,.meta-mark,.filter-count,.status-pill,.smart-match-score,.overview-panel .overview-row b,.cv-upload-file{background:#e6eefb!important;color:var(--kdx-blue)!important;border-color:#d0d5dd!important}
.btn.green,.btn.red{background:#fff!important;color:var(--kdx-blue)!important;border-color:var(--kdx-border)!important}
.ok,.bad,.alert,.match-explain-card.good,.match-explain-card.risk,.smart-match-card.high,.smart-match-card.medium,.smart-match-card.low,.smart-match-card.empty,.verification-pill.verified,.verification-pill.pending,.verification-pill.rejected{background:#fff!important;color:var(--kdx-ink)!important;border-color:var(--kdx-border)!important}
.score-bar span,.match-score.high .score-bar span,.match-score.medium .score-bar span,.match-score.low .score-bar span{background:var(--kdx-blue)!important}
.brand-icon{background:#fff!important;border-color:var(--kdx-border)!important;color:var(--kdx-blue)!important;box-shadow:none!important}
.nav-links{background:#fff!important;border-color:var(--kdx-border)!important;box-shadow:none!important}
.nav-link{color:#344054!important}
.home-stats-band{background:var(--kdx-soft)!important;border-color:var(--kdx-border)!important}
.home-stats-row>.stat{background:#fff!important}
.footer-kdx-word,.footer-logo,.footer-links a:hover,.file-link,.match-details summary,.match-details-link{color:var(--kdx-blue)!important}
[style*="color:#2d51a8"],[style*="color:#3a67cf"],[style*="color:#24448c"],[style*="color:#087443"],[style*="color:#b54708"],[style*="color:#166534"],[style*="color:#92400e"]{color:var(--kdx-blue)!important}
[style*="background:#f0fdf4"],[style*="background:#fff7ed"],[style*="background:#ecfdf3"],[style*="background:#fffaeb"],[style*="background:#dce8f9"]{background:var(--kdx-soft)!important}
@media(min-width:901px){.header,.nav-links{background:#fff!important;border-color:var(--kdx-border)!important;box-shadow:none!important}.nav-link.active,.nav-link[aria-current="page"],.nav-actions .btn:not(.outline){background:var(--kdx-blue)!important;box-shadow:none!important}.nav-link:hover{background:#e6eefb!important;color:var(--kdx-blue)!important;box-shadow:none!important}}
/* Flat card pass */
.card,.job-card,.stat,.profile-box,.info,.filter-panel,.application-card,.notification-card,.job-detail-main,.overview-panel,.profile-section-card,.profile-hero-card,.profile-score-card,.app-panel,.table-wrap,.blog-list-card,.journey-card,.innovation-card,.idea-card,.match-explain-card,.smart-match-card,.verification-card,.check-option{border-radius:10px!important;box-shadow:none!important}
.card-pad,.job-card,.profile-box,.info,.filter-panel,.application-card,.notification-card,.job-detail-main,.overview-panel,.profile-section-card,.profile-hero-card,.profile-score-card,.app-panel-body,.blog-list-card,.journey-card,.innovation-card,.idea-card{padding:28px!important}
.grid,.grid3,.grid4,.featured-jobs-row,.jobs-list-grid,.profile-grid,.info-grid,.application-panels,.notification-list,.journey-grid,.idea-grid{gap:28px!important}
.job-card:hover,.idea-card:hover,.journey-card:hover,.innovation-card:hover,.blog-list-card:hover,.jobs-list-slot .job-card:hover{transform:none!important;box-shadow:none!important;border-color:#d0d5dd!important}
.search{border-radius:12px!important;box-shadow:none!important;padding:14px!important}
.home-stats-row>.stat{border-radius:10px!important;padding:28px!important}
.home-stats-row{gap:28px!important}
.featured-jobs-row{gap:28px!important}
.badge,.tag,.pill,.eyebrow,.meta-mark,.status-pill,.filter-count{border-radius:8px!important}
.btn,.btn.outline,.nav-actions .btn,.input,.select,.textarea,.skills-dropdown summary{border-radius:8px!important}
.icon,.home-stats-row>.stat .icon,.brand-icon{border-radius:10px!important}
@media(max-width:760px){.card-pad,.job-card,.profile-box,.info,.filter-panel,.application-card,.notification-card,.job-detail-main,.overview-panel,.profile-section-card,.profile-hero-card,.profile-score-card,.app-panel-body,.blog-list-card,.journey-card,.innovation-card,.idea-card{padding:22px!important}.grid,.grid3,.grid4,.featured-jobs-row,.jobs-list-grid,.profile-grid,.info-grid,.application-panels,.notification-list,.journey-grid,.idea-grid{gap:20px!important}}
/* Quiet navigation pass */
.header{background:#fff!important;border-bottom:1px solid var(--kdx-border)!important;box-shadow:none!important}
.header:after{display:none!important}
.nav{min-height:76px!important}
.nav-links{gap:2px!important;border:0!important;border-radius:0!important;background:transparent!important;padding:0!important;box-shadow:none!important}
.nav-link{min-height:40px!important;border:0!important;border-radius:8px!important;background:transparent!important;padding:0 13px!important;color:#475467!important;font-size:14px!important;font-weight:850!important;box-shadow:none!important;transform:none!important}
.nav-link:hover{background:#f8fafc!important;color:var(--kdx-ink)!important;box-shadow:none!important}
.nav-link.active,.nav-link[aria-current="page"]{background:var(--kdx-blue)!important;color:#fff!important;border-color:var(--kdx-blue)!important;box-shadow:none!important}
.nav-actions{gap:8px!important}
.nav-actions .btn{min-height:40px!important;border-radius:8px!important;padding:0 14px!important;font-size:14px!important;box-shadow:none!important;transform:none!important}
.nav-actions .btn.outline{border-color:transparent!important;background:transparent!important;color:#344054!important}
.nav-actions .btn.outline:hover{border-color:var(--kdx-border)!important;background:#f8fafc!important;color:var(--kdx-ink)!important}
.nav-actions .theme-toggle{width:40px!important;height:40px!important;min-width:40px!important;border-color:var(--kdx-border)!important;background:#fff!important;color:#475467!important}
.nav-actions .btn:not(.outline){background:var(--kdx-blue)!important;color:#fff!important;border-color:var(--kdx-blue)!important}
.nav-actions .btn:not(.outline):hover{background:#293681!important;color:#fff!important}
.nav-actions .btn.outline.active,.nav-actions .btn.outline[aria-current="page"]{border-color:var(--kdx-border)!important;background:#f8fafc!important;color:var(--kdx-blue)!important}
.nav-mobile-actions a[href*="page=register"]{background:var(--kdx-blue)!important;color:#fff!important}
@media(min-width:901px){.header,.nav-links{background:#fff!important;border-color:var(--kdx-border)!important;box-shadow:none!important}.nav-link:hover{background:#f8fafc!important;color:var(--kdx-ink)!important}.nav-link.active,.nav-link[aria-current="page"],.nav-actions .btn:not(.outline){background:var(--kdx-blue)!important;color:#fff!important;box-shadow:none!important}}
@media(max-width:900px){.nav-links{border:1px solid var(--kdx-border)!important;border-radius:10px!important;background:#fff!important;padding:8px!important;box-shadow:none!important}.nav-link{justify-content:flex-start!important;width:100%!important}.nav-mobile-actions{border-top:1px solid var(--kdx-border)!important}}


/* ═══════════════════════════════════════════════════════════════════════
   SITE-WIDE DESIGN UPGRADE
   Propagates the homepage aesthetic across all pages.
   Appended last so these rules win the cascade.
═══════════════════════════════════════════════════════════════════════ */

/* ── Updated CSS variables ───────────────────────────────────────── */
:root {
    --kdx-border: #bcd2f2;
    --kdx-border-hover: #93b4e9;
    --kdx-soft: #f2f7fd;
    --kdx-card-shadow: 0 6px 20px rgba(16,24,40,.05);
    --kdx-card-shadow-hover: 0 12px 32px rgba(16,24,40,.09);
}

/* ── Page background gradient ────────────────────────────────────── */
body {
    background: linear-gradient(180deg,#ecf3fc 0%,#f8f5ff 40%,#fff 100%) !important;
}
body.theme-dark {
    background: linear-gradient(180deg,#0a0718 0%,#0b1230 40%,#0d1330 100%) !important;
    --kdx-soft: #101a3d;
    --kdx-border: #2a3a70;
    --kdx-ink: #f8fafc;
    --kdx-muted: #5c6773;
    --kdx-card-shadow: 0 6px 20px rgba(0,0,0,.18);
    --kdx-card-shadow-hover: 0 12px 32px rgba(0,0,0,.28);
}

/* ── Global card / surface refinements ──────────────────────────── */
.card,.job-card,.stat,.profile-box,.info,
.filter-panel,.application-card,.notification-card,
.job-detail-main,.overview-panel,.profile-section-card,
.profile-hero-card,.profile-score-card,.app-panel,
.table-wrap,.blog-list-card,.journey-card,
.innovation-card,.idea-card,.match-explain-card,
.smart-match-card,.verification-card,.check-option,
.analytics-kpi,.analytics-card,.analytics-hero-card,
.analytics-alert,.quiz-card,.quiz-model-card,
.learning-quiz-shell,.settings-card,
.dashboard-content-card,.about-panel,.about-metric,
.about-value,.tracking-story,.job-match-card,
.pipeline-summary div,.overview-row,.check-list span,
.service-chat,.profile-header,.recruiter-preview,
.profile-section-card,.manage-copy,.timeline-item {
    border-color: var(--kdx-border) !important;
    border-radius: 16px !important;
    box-shadow: var(--kdx-card-shadow) !important;
}

/* Elements that should keep pill radius */
.badge,.tag,.pill,.meta-mark,.status-pill,.filter-count,
.progress-step,.skill-chip-list span,.profile-summary-pills span,
.about-chip,.task-dot,.hero-trust-sep {
    border-radius: 999px !important;
}
.data-table,.data-table td,.data-table th { box-shadow: none !important; }

/* ── Card hover states ───────────────────────────────────────────── */
.job-card:hover,.idea-card:hover,.journey-card:hover,
.blog-list-card:hover,.analytics-kpi:hover,
.profile-activity-grid a:hover,.overview-row:hover,
.quiz-card:hover,.similar-job-card:hover,.about-value:hover {
    border-color: var(--kdx-border-hover) !important;
    box-shadow: var(--kdx-card-shadow-hover) !important;
    transform: translateY(-2px) !important;
}

/* ── Eyebrow labels — pill style ─────────────────────────────────── */
.eyebrow {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 14px !important;
    border: 1px solid var(--kdx-border) !important;
    border-radius: 999px !important;
    background: #e6eefb !important;
    color: #2c4699 !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    letter-spacing: .1em !important;
    text-transform: uppercase !important;
    margin-bottom: 10px !important;
    line-height: 1.5 !important;
}
.section-title .eyebrow {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ── Section header spacing ──────────────────────────────────────── */
.section-title {
    margin-bottom: 40px !important;
}

/* ── Input refinements ───────────────────────────────────────────── */
.input,.select,.textarea,.skills-dropdown summary {
    border-color: var(--kdx-border) !important;
}
.input:focus,.select:focus,.textarea:focus,
.skills-dropdown[open] summary {
    border-color: var(--kdx-border-hover) !important;
    box-shadow: 0 0 0 3px rgba(53,86,176,.09) !important;
    outline: none !important;
}

/* ── Search bar ──────────────────────────────────────────────────── */
.search {
    border-color: var(--kdx-border) !important;
    box-shadow: 0 10px 30px rgba(66,116,217,.06) !important;
}
.search:focus-within {
    border-color: var(--kdx-border-hover) !important;
    box-shadow: 0 14px 38px rgba(66,116,217,.12) !important;
}

/* ── Badge style ─────────────────────────────────────────────────── */
.badge {
    border: 1px solid var(--kdx-border) !important;
    background: #e6eefb !important;
    color: #2c4699 !important;
}

/* ── Table header — blue tinted ──────────────────────────────────── */
.data-table th {
    background: #eff5fd !important;
    border-color: var(--kdx-border) !important;
}
.data-table td { border-color: #dce8f9 !important; }
.data-table tbody tr:hover td { background: #f2f7fd !important; }

/* ── Dashboard hero band ─────────────────────────────────────────── */
.dash-hero {
    background: linear-gradient(135deg,#293681 0%,#2c4699 55%,#4274d9 100%) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(66,116,217,.22) !important;
}

/* ── App panel (accordion) ───────────────────────────────────────── */
.app-panel {
    border-color: var(--kdx-border) !important;
}
.app-panel[open] summary {
    border-bottom: 1px solid var(--kdx-border) !important;
}

/* ── About page layout ───────────────────────────────────────────── */
.about-story {
    display: grid;
    gap: 20px;
    margin-bottom: 24px;
}
.about-values {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 18px;
    margin-top: 22px;
}
.about-value {
    border: 1px solid var(--kdx-border);
    border-radius: 16px;
    background: linear-gradient(135deg,var(--kdx-soft),#fff);
    padding: 22px;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.about-value h3 { margin-bottom: 10px; }
@media(max-width:760px){
    .about-story { grid-template-columns: 1fr; }
    .about-values { grid-template-columns: 1fr; }
    .about-panel { padding: 20px; }
    .about-metric-grid { grid-template-columns: 1fr; }
    .about-metric strong { font-size: 22px; }
    .about-chip-row { justify-content: center; }
}

/* ── Status pills — refined colors ──────────────────────────────── */
.status-pill.new,.status-pill.applied {
    background: #e6eefb !important;
    color: #2c4699 !important;
    border: 1px solid var(--kdx-border) !important;
}
.status-pill.reviewed {
    background: #e6eefb !important;
    color: #293681 !important;
    border: 1px solid #b7cef2 !important;
}
.status-pill.shortlisted {
    background: #fffbeb !important;
    color: #92400e !important;
    border: 1px solid #fde68a !important;
}
.status-pill.accepted {
    background: #f0fdf4 !important;
    color: #15803d !important;
    border: 1px solid #bbf7d0 !important;
}
.status-pill.rejected {
    background: #fff1f2 !important;
    color: #9f1239 !important;
    border: 1px solid #fecdd3 !important;
}

/* ── Job detail side facts ───────────────────────────────────────── */
.job-side-facts {
    display: grid !important;
    gap: 10px !important;
    margin: 14px 0 !important;
    border: 1px solid var(--kdx-border) !important;
    border-radius: 14px !important;
    background: var(--kdx-soft) !important;
    padding: 14px !important;
    box-shadow: none !important;
}
.job-side-facts div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 13px;
    font-weight: 800;
    color: #64748b;
}
.job-side-facts strong { color: #0d1330; font-weight: 950; }

/* ── Auth / login page ───────────────────────────────────────────── */
.role-tabs {
    border: 1px solid var(--kdx-border) !important;
    border-radius: 14px !important;
    background: var(--kdx-soft) !important;
}
.role-tabs button.active {
    border-radius: 10px !important;
    background: #fff !important;
    color: #2c4699 !important;
    box-shadow: 0 2px 8px rgba(16,24,40,.06) !important;
}

/* ── Application detail section head ────────────────────────────── */
.section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--kdx-border);
}

/* ── Section padding ─────────────────────────────────────────────── */
.section { padding: 58px 0 !important; }
@media(max-width:760px){ .section { padding: 40px 0 !important; } }

/* ═══════════════════════════════════════════════════════════════════
   DARK MODE PARITY
═══════════════════════════════════════════════════════════════════ */
body.theme-dark .card,body.theme-dark .job-card,
body.theme-dark .stat,body.theme-dark .profile-box,
body.theme-dark .info,body.theme-dark .filter-panel,
body.theme-dark .application-card,body.theme-dark .notification-card,
body.theme-dark .job-detail-main,body.theme-dark .overview-panel,
body.theme-dark .profile-section-card,body.theme-dark .profile-hero-card,
body.theme-dark .profile-score-card,body.theme-dark .app-panel,
body.theme-dark .table-wrap,body.theme-dark .blog-list-card,
body.theme-dark .journey-card,body.theme-dark .innovation-card,
body.theme-dark .idea-card,body.theme-dark .match-explain-card,
body.theme-dark .smart-match-card,body.theme-dark .verification-card,
body.theme-dark .check-option,body.theme-dark .analytics-kpi,
body.theme-dark .analytics-card,body.theme-dark .analytics-hero-card,
body.theme-dark .analytics-alert,body.theme-dark .quiz-card,
body.theme-dark .quiz-model-card,body.theme-dark .learning-quiz-shell,
body.theme-dark .settings-card,body.theme-dark .dashboard-content-card,
body.theme-dark .about-panel,body.theme-dark .about-metric,
body.theme-dark .about-value,body.theme-dark .tracking-story,
body.theme-dark .job-match-card,body.theme-dark .pipeline-summary div,
body.theme-dark .overview-row,body.theme-dark .check-list span,
body.theme-dark .service-chat,body.theme-dark .profile-header,
body.theme-dark .recruiter-preview,body.theme-dark .timeline-item {
    border-color: #2a3a70 !important;
    background: #101a3d !important;
    color: #e5e7eb !important;
    box-shadow: 0 6px 20px rgba(0,0,0,.18) !important;
}
body.theme-dark .section { background: transparent !important; }
body.theme-dark .job-card:hover,body.theme-dark .idea-card:hover,
body.theme-dark .journey-card:hover,body.theme-dark .blog-list-card:hover,
body.theme-dark .analytics-kpi:hover,body.theme-dark .overview-row:hover,
body.theme-dark .about-value:hover {
    border-color: #3f5aa0 !important;
    box-shadow: 0 12px 32px rgba(0,0,0,.28) !important;
}
body.theme-dark .eyebrow {
    background: #16224c !important;
    color: #93b4e9 !important;
    border-color: #2a3a70 !important;
}
body.theme-dark .badge {
    background: #1b3168 !important;
    color: #bcd2f2 !important;
    border-color: #2a3a70 !important;
}
body.theme-dark .input,body.theme-dark .select,
body.theme-dark .textarea,body.theme-dark .skills-dropdown summary {
    border-color: #2a3a70 !important;
}
body.theme-dark .input:focus,body.theme-dark .select:focus,
body.theme-dark .textarea:focus {
    border-color: #3f5aa0 !important;
    box-shadow: 0 0 0 3px rgba(102,147,224,.10) !important;
}
body.theme-dark .data-table th {
    background: #101a3d !important;
    border-color: #2a3a70 !important;
}
body.theme-dark .data-table td { border-color: #182550 !important; }
body.theme-dark .data-table tbody tr:hover td { background: #172450 !important; }
body.theme-dark .search {
    border-color: #2a3a70 !important;
    background: #101a3d !important;
    box-shadow: none !important;
}
body.theme-dark .about-value {
    border-color: #2a3a70 !important;
    background: linear-gradient(135deg,#0d1330,#101a3d) !important;
    color: #e5e7eb !important;
}
body.theme-dark .job-side-facts {
    border-color: #2a3a70 !important;
    background: #0d1330 !important;
}
body.theme-dark .job-side-facts div { color:#5c6773 !important; }
body.theme-dark .job-side-facts strong { color: #e5e7eb !important; }
body.theme-dark .role-tabs {
    border-color: #2a3a70 !important;
    background: #0d1330 !important;
}
body.theme-dark .role-tabs button.active {
    background: #101a3d !important;
    color: #bcd2f2 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.28) !important;
}
body.theme-dark .section-head { border-color: #2a3a70; }
body.theme-dark .app-panel { border-color: #2a3a70 !important; }
body.theme-dark .app-panel[open] summary { border-color: #2a3a70 !important; }
body.theme-dark .status-pill.new,body.theme-dark .status-pill.applied {
    background: #16224c !important;
    color: #bcd2f2 !important;
    border-color: #2a3a70 !important;
}

/* ── Honeypot field — invisible to real users, visible to bots ── */
.hp-field {
    position: absolute;
    left: -9999px;
    top: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    tab-index: -1;
}

/* ── Empty state card ────────────────────────────────────── */
.empty-state-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 10px;
    border: 1px dashed var(--kdx-border);
    border-radius: 16px;
    background: var(--kdx-soft);
    padding: 48px 24px;
}
.empty-state-icon {
    font-size: 40px;
    line-height: 1;
    margin-bottom: 4px;
    opacity: .7;
}
.empty-state-card h3 { font-size: 18px; color: var(--kdx-ink); margin: 0; }
.empty-state-card p  { max-width: 420px; margin: 0; color: var(--kdx-muted); font-size: 14px; line-height: 1.6; }
body.theme-dark .empty-state-card { border-color: #2a3a70; background: #0d1330; }
body.theme-dark .empty-state-card h3 { color: #f8fafc; }

/* ── Flash alert wrapper ─────────────────────────────────── */
.alert-wrap { padding: 10px 0 0; margin-bottom: 8px; }
.alert-wrap .alert { margin: 0; border-radius: 12px; }
body.theme-dark .alert-wrap .ok  { border-color: #166534; background: #052e16; color: #bbf7d0; }
body.theme-dark .alert-wrap .bad { border-color: #7f1d1d; background: #450a0a; color: #fecaca; }

/* ── Show / hide password toggle ─────────────────────────── */
.pw-wrap { position: relative; display: block; }
.pw-wrap .input { padding-right: 48px; width: 100%; }
.pw-toggle {
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #4274d9;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.pw-toggle:hover  { background: #dce8f9; }
.pw-toggle:focus-visible { outline: 2px solid #4274d9; outline-offset: 2px; }
.pw-toggle svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pw-toggle .eye-off { display: none; }
.pw-toggle.is-on .eye { display: none; }
.pw-toggle.is-on .eye-off { display: inline; }
.pw-toggle.is-on { color: #2d51a8; }
body.theme-dark .pw-toggle { color: #93b4e9; }
body.theme-dark .pw-toggle:hover { background: #172450; }

/* ── Upload CV dropzone (nicer) ──────────────────────────── */
.cv-upload {
    position: relative;
    grid-template-columns: auto 1fr;
    gap: 16px;
    align-items: center;
    border: 1.5px dashed #93b4e9;
    border-radius: 20px;
    background:
        radial-gradient(120% 120% at 100% 0%, rgba(66,116,217, .06), transparent 60%),
        linear-gradient(135deg, #f7f5ff, #ffffff);
    padding: 18px 20px;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.cv-upload:hover,
.cv-upload.is-drag {
    border-color: #4274d9;
    background: linear-gradient(135deg, #efeafe, #f2f7fd);
    box-shadow: 0 16px 34px rgba(66,116,217, .16);
}
.cv-upload.is-drag { border-style: solid; transform: translateY(-2px); }

/* icon tile gets a subtle bob on hover/drag */
.cv-upload-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: linear-gradient(140deg, #4274d9, #2d51a8);
    box-shadow: 0 12px 22px rgba(66,116,217, .28);
    transition: transform .18s ease;
}
.cv-upload:hover .cv-upload-icon,
.cv-upload.is-drag .cv-upload-icon { transform: translateY(-2px) scale(1.03); }

/* hide the native file control — the whole card is a <label> so it stays clickable */
.cv-upload-input {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0; max-width: none;
}

/* "Choose a PDF file" becomes a real button-looking pill with an upload glyph */
.cv-upload-file {
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    width: max-content;
    max-width: 100%;
    margin-top: 2px;
    border: 1px solid #bcd2f2;
    border-radius: 999px;
    background: #ffffff;
    padding: 7px 14px !important;
    color: #2d51a8 !important;
    font-size: 12.5px !important;
    font-weight: 900 !important;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.cv-upload-file::before {
    content: "";
    flex: none;
    width: 14px; height: 14px;
    background: currentColor;
    -webkit-mask: no-repeat center / contain url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M12 16V4"/><path d="M7 9l5-5 5 5"/><path d="M4 20h16"/></svg>');
    mask: no-repeat center / contain url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M12 16V4"/><path d="M7 9l5-5 5 5"/><path d="M4 20h16"/></svg>');
}
.cv-upload:hover .cv-upload-file { border-color: #93b4e9; background: #eef4fc; }

/* selected state — turns green with a check */
.cv-upload.has-file {
    border-style: solid;
    border-color: #86efac;
    background: linear-gradient(135deg, #f0fdf4, #ffffff);
}
.cv-upload.has-file .cv-upload-icon {
    background: linear-gradient(140deg, #22c55e, #15803d);
    box-shadow: 0 12px 22px rgba(34, 197, 94, .28);
}
.cv-upload.has-file .cv-upload-file {
    border-color: #bbf7d0;
    background: #f0fdf4;
    color: #15803d !important;
}
.cv-upload.has-file .cv-upload-file::before {
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>');
}

body.theme-dark .cv-upload-file { background: #101a3d; border-color: #2a3a70; color: #bcd2f2 !important; }
body.theme-dark .cv-upload.has-file { border-color: #166534; background: linear-gradient(135deg, #052e16, #0b1220); }
body.theme-dark .cv-upload.has-file .cv-upload-file { background: #052e16; border-color: #166534; color: #bbf7d0 !important; }

/* Image variant (e.g. company logo) — live thumbnail preview in the tile */
.cv-upload--image .cv-upload-icon { overflow: hidden; position: relative; }
.cv-upload-preview {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}
.cv-upload.has-preview .cv-upload-icon {
    background: #ffffff;
    box-shadow: 0 12px 22px rgba(20, 16, 44, .18);
}
.cv-upload.has-preview .cv-upload-icon svg { display: none; }
/* keep the tile violet for images until a file is picked */
.cv-upload--image .cv-upload-icon { background: linear-gradient(140deg, #3556b0, #2c4699); }
.cv-upload--image.has-file:not(.has-preview) .cv-upload-icon { background: linear-gradient(140deg, #22c55e, #15803d); }

@media (prefers-reduced-motion: reduce) {
    .cv-upload, .cv-upload-icon, .cv-upload-file, .pw-toggle { transition: none; }
    .cv-upload.is-drag { transform: none; }
}
