/* Shared PESO component layer. See DESIGN_SYSTEM.md for token usage. */
:root {
    --peso-primary: #087443;
    --peso-primary-hover: #056136;
    --peso-primary-soft: #eaf7ef;
    --peso-gold: #d6a514;
    --peso-gold-soft: #fff7d6;
    --peso-ink: #17251e;
    --peso-muted: #607168;
    --peso-canvas: #f4f8f5;
    --peso-surface: #fff;
    --peso-surface-soft: #edf5f0;
    --peso-line: #d8e5dd;
    --peso-danger: #b42318;
    --peso-warning: #8c5506;
    --peso-focus-ring: 0 0 0 3px rgba(8,116,67,.28);
    --peso-radius-sm: 10px;
    --peso-radius: 16px;
    --peso-radius-lg: 22px;
    --peso-shadow: 0 14px 38px rgba(15,23,42,.09);
}

body.peso-theme-aware:not(.light), body.dark-mode, html[data-theme="dark"] body {
    --peso-primary: #4fd18e;
    --peso-primary-hover: #75dda8;
    --peso-primary-soft: #143a2a;
    --peso-gold: #f1cb50;
    --peso-gold-soft: #3b3216;
    --peso-ink: #f3f8f5;
    --peso-muted: #b3c8bd;
    --peso-canvas: #071c14;
    --peso-surface: #102b20;
    --peso-surface-soft: #15372a;
    --peso-line: #315442;
    --peso-danger: #ff817b;
    --peso-warning: #f1cb50;
    --peso-focus-ring: 0 0 0 3px rgba(241,203,80,.34);
    --peso-shadow: 0 18px 42px rgba(0,0,0,.27);
}

.peso-page-shell { width:min(100% - 32px,1440px); margin-inline:auto; padding-block:24px 48px; }
.peso-page-header { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:22px; padding:clamp(22px,3vw,34px); color:#fff; background:linear-gradient(125deg,#064b2e,#087443 70%,#0d8b52); border:1px solid rgba(255,255,255,.15); border-radius:var(--peso-radius-lg); box-shadow:var(--peso-shadow); }
.peso-page-header h1 { margin:4px 0 6px; color:#fff !important; font-size:clamp(26.4px,3vw,34.4px); line-height:1.08; }
.peso-page-header p,.peso-page-header span,.peso-page-header small { color:rgba(255,255,255,.9) !important; font-size:14.72px; }
.peso-page-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.peso-eyebrow { display:block; color:var(--peso-primary); font-size:.72rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.peso-card { color:var(--peso-ink); background:var(--peso-surface); border:1px solid var(--peso-line); border-radius:var(--peso-radius); box-shadow:0 8px 24px rgba(15,23,42,.05); }
.peso-card-pad { padding:clamp(18px,2.5vw,26px); }
.peso-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px; }
.peso-grid > * { min-width:0; }
.peso-btn { min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 16px; color:#fff !important; background:var(--peso-primary); border:1px solid var(--peso-primary); border-radius:12px; font:inherit; font-weight:800; line-height:1.2; text-decoration:none; cursor:pointer; }
.peso-btn:hover { background:var(--peso-primary-hover); border-color:var(--peso-primary-hover); transform:translateY(-1px); }
.peso-btn--secondary { color:var(--peso-ink) !important; background:var(--peso-surface); border-color:var(--peso-line); }
.peso-btn--danger { color:#fff !important; background:#b42318; border-color:#b42318; }
.peso-btn--small { min-height:38px; padding:8px 12px; font-size:.84rem; }
.peso-form-field { display:grid; gap:7px; }
.peso-form-field label { color:var(--peso-ink); font-size:.84rem; font-weight:800; }
.peso-form-field :is(input,select,textarea) { width:100%; min-height:46px; padding:11px 13px; color:var(--peso-ink); background:var(--peso-surface); border:1px solid var(--peso-line); border-radius:11px; font:inherit; }
.peso-form-field textarea { min-height:120px; resize:vertical; }
.peso-form-field small { color:var(--peso-muted); }
.peso-empty-state { display:grid; place-items:center; min-height:200px; padding:30px; color:var(--peso-muted); background:var(--peso-surface-soft); border:1px dashed var(--peso-line); border-radius:var(--peso-radius); text-align:center; }
.peso-table-wrap { overflow:auto; border:1px solid var(--peso-line); border-radius:var(--peso-radius); background:var(--peso-surface); }
.peso-table { width:100%; border-collapse:collapse; color:var(--peso-ink); }
.peso-table th { color:var(--peso-muted); background:var(--peso-surface-soft); font-size:.75rem; letter-spacing:.03em; text-align:left; text-transform:uppercase; }
.peso-table :is(th,td) { padding:14px 16px; border-bottom:1px solid var(--peso-line); vertical-align:top; }
.peso-status { display:inline-flex; align-items:center; gap:6px; padding:5px 9px; color:var(--peso-ink); background:var(--peso-surface-soft); border:1px solid var(--peso-line); border-radius:999px; font-size:.75rem; font-weight:800; }

.peso-completion-card { margin:0 0 22px; padding:clamp(19px,3vw,28px); color:var(--peso-ink); background:linear-gradient(145deg,var(--peso-surface),var(--peso-surface-soft)); border:1px solid var(--peso-line); border-radius:var(--peso-radius-lg); box-shadow:var(--peso-shadow); }
.peso-completion-summary { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.peso-completion-summary h2 { margin:4px 0; color:var(--peso-ink) !important; font-size:clamp(1.15rem,2vw,1.45rem); }
.peso-completion-summary p { margin:0; color:var(--peso-muted) !important; }
.peso-completion-score { min-width:86px; min-height:86px; display:grid; place-content:center; color:var(--peso-ink); background:var(--peso-gold-soft); border:1px solid color-mix(in srgb,var(--peso-gold) 40%,var(--peso-line)); border-radius:50%; text-align:center; }
.peso-completion-score strong { font-size:1.25rem; line-height:1; }
.peso-completion-score span { margin-top:3px; color:var(--peso-muted); font-size:.65rem; }
.peso-progress { height:9px; margin:18px 0; overflow:hidden; background:var(--peso-line); border-radius:999px; }
.peso-progress span { display:block; height:100%; background:linear-gradient(90deg,var(--peso-primary),var(--peso-gold)); border-radius:inherit; }
.peso-checklist { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.peso-checklist-item { min-width:0; display:flex; align-items:center; gap:10px; padding:11px; color:var(--peso-ink) !important; background:var(--peso-surface); border:1px solid var(--peso-line); border-radius:12px; text-decoration:none; }
.peso-checklist-item:hover { border-color:var(--peso-primary); }
.peso-checklist-icon { width:29px; height:29px; flex:0 0 29px; display:grid; place-items:center; color:#fff; background:var(--peso-primary); border-radius:9px; font-weight:900; }
.peso-checklist-item.is-pending .peso-checklist-icon { color:var(--peso-ink); background:var(--peso-gold-soft); }
.peso-checklist-item strong,.peso-checklist-item small { display:block; overflow:hidden; text-overflow:ellipsis; }
.peso-checklist-item small { margin-top:2px; color:var(--peso-muted); font-size:.7rem; line-height:1.35; white-space:normal; }

.peso-search-results { position:absolute; inset:calc(100% + 8px) 0 auto 0; z-index:1000; overflow:hidden; color:var(--peso-ink); background:var(--peso-surface); border:1px solid var(--peso-line); border-radius:14px; box-shadow:var(--peso-shadow); }
.peso-search-result { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; color:var(--peso-ink) !important; text-decoration:none; }
.peso-search-result:hover,.peso-search-result[aria-selected="true"] { background:var(--peso-primary-soft); }
.peso-search-result small { color:var(--peso-muted); }

:where(a,button,input,select,textarea,[tabindex]):focus-visible { outline:2px solid var(--peso-primary) !important; outline-offset:3px !important; box-shadow:var(--peso-focus-ring) !important; }

@media (max-width:900px) {
    .peso-checklist { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .peso-page-header { align-items:flex-start; flex-direction:column; }
}
@media (max-width:700px) {
    .peso-page-shell { width:min(100% - 20px,1440px); padding-top:12px; }
    .peso-checklist { grid-template-columns:1fr; }
    .peso-completion-summary { align-items:flex-start; }
    .peso-completion-score { min-width:72px; min-height:72px; }
    table.peso-responsive-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
    table.peso-responsive-table,table.peso-responsive-table tbody,table.peso-responsive-table tr,table.peso-responsive-table td { display:block; width:100%; }
    table.peso-responsive-table tbody { display:grid; gap:12px; padding:12px; }
    table.peso-responsive-table tr { padding:12px; background:var(--peso-surface); border:1px solid var(--peso-line); border-radius:12px; }
    table.peso-responsive-table td { display:grid; grid-template-columns:minmax(100px,.38fr) 1fr; gap:10px; padding:8px 2px; border:0; }
    table.peso-responsive-table td::before { content:attr(data-label); color:var(--peso-muted); font-size:.72rem; font-weight:800; text-transform:uppercase; }
}
@media (prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto !important; }
    *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* One consistent dashboard header for every jobseeker workspace page. */
:where(body[data-peso-page='jobseeker-home'],body[data-peso-page='jobseeker-applied'],body[data-peso-page='jobseeker-saved'],body[data-peso-page='jobseeker-profile'],body[data-peso-page='jobseeker-settings'],body[data-peso-page='jobseeker-skills'],body[data-peso-page='jobseeker-search'],body[data-peso-page='jobseeker-calendar'],body[data-peso-page='jobseeker-announcements'],body[data-peso-page='jobseeker-community'],body[data-peso-page='job-details']) :is(.page-header,.welcome-banner,.hero,.community-banner,.job-header) {
    min-height:142px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:20px !important;
    margin:0 0 24px !important;
    padding:clamp(22px,3vw,32px) !important;
    color:#fff !important;
    background:linear-gradient(125deg,#064b2e 0%,#087443 68%,#0d8b52 100%) !important;
    border:1px solid rgba(255,255,255,.15) !important;
    border-radius:22px !important;
    box-shadow:0 16px 40px rgba(5,83,47,.17) !important;
    text-align:left !important;
}
:where(body[data-peso-page='jobseeker-home'],body[data-peso-page='jobseeker-applied'],body[data-peso-page='jobseeker-saved'],body[data-peso-page='jobseeker-profile'],body[data-peso-page='jobseeker-settings'],body[data-peso-page='jobseeker-skills'],body[data-peso-page='jobseeker-search'],body[data-peso-page='jobseeker-calendar'],body[data-peso-page='jobseeker-announcements'],body[data-peso-page='jobseeker-community'],body[data-peso-page='job-details']) :is(.page-header,.welcome-banner,.hero,.community-banner,.job-header) :is(h1,.page-title) {
    margin:0 0 6px !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font-size:clamp(26.4px,3vw,34.4px) !important;
    font-weight:850 !important;
    letter-spacing:-.035em !important;
    line-height:1.08 !important;
}
:where(body[data-peso-page='jobseeker-home'],body[data-peso-page='jobseeker-applied'],body[data-peso-page='jobseeker-saved'],body[data-peso-page='jobseeker-profile'],body[data-peso-page='jobseeker-settings'],body[data-peso-page='jobseeker-skills'],body[data-peso-page='jobseeker-search'],body[data-peso-page='jobseeker-calendar'],body[data-peso-page='jobseeker-announcements'],body[data-peso-page='jobseeker-community'],body[data-peso-page='job-details']) :is(.page-header,.welcome-banner,.hero,.community-banner,.job-header) :is(p,.page-subtitle,.page-eyebrow,.role-home-kicker) {
    color:rgba(255,255,255,.91) !important;
    -webkit-text-fill-color:currentColor !important;
    font-size:14.72px !important;
    line-height:1.55 !important;
}

:where(body[data-peso-page='jobseeker-home'],body[data-peso-page='jobseeker-community']) :is(.welcome-banner,.community-banner) :is(.stat-number,.stat-label,.banner-stats span,.banner-stats i) {
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
}

/* Authentication theme controls stay in the viewport corner, never over the form. */
:where(body[data-peso-page='jobseeker-login'],body[data-peso-page='employer-login'],body[data-peso-page='admin-login'],body[data-peso-page='two-factor-login']) .auth-theme-toggle {
    position:fixed !important;
    top:max(16px,env(safe-area-inset-top)) !important;
    right:max(16px,env(safe-area-inset-right)) !important;
    left:auto !important;
    bottom:auto !important;
    z-index:1300 !important;
    width:auto !important;
    min-width:46px !important;
    margin:0 !important;
}
@media(max-width:700px){
    :where(body[data-peso-page='jobseeker-home'],body[data-peso-page='jobseeker-applied'],body[data-peso-page='jobseeker-saved'],body[data-peso-page='jobseeker-profile'],body[data-peso-page='jobseeker-settings'],body[data-peso-page='jobseeker-skills'],body[data-peso-page='jobseeker-search'],body[data-peso-page='jobseeker-calendar'],body[data-peso-page='jobseeker-announcements'],body[data-peso-page='jobseeker-community'],body[data-peso-page='job-details']) :is(.page-header,.welcome-banner,.hero,.community-banner,.job-header){min-height:126px!important;align-items:flex-start!important;flex-direction:column!important;border-radius:18px!important}
    :where(body[data-peso-page='jobseeker-login'],body[data-peso-page='employer-login'],body[data-peso-page='admin-login'],body[data-peso-page='two-factor-login']) .auth-theme-toggle span{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important}
}

/* Final workspace-header contract. Specificity intentionally matches legacy
   product rules so every authenticated jobseeker page renders identically. */
html body.peso-product-ui:is([data-peso-page='jobseeker-home'],[data-peso-page='jobseeker-applied'],[data-peso-page='jobseeker-saved'],[data-peso-page='jobseeker-profile'],[data-peso-page='jobseeker-settings'],[data-peso-page='jobseeker-skills'],[data-peso-page='jobseeker-search'],[data-peso-page='jobseeker-calendar'],[data-peso-page='jobseeker-announcements'],[data-peso-page='jobseeker-community'],[data-peso-page='job-details'],[data-peso-page='jobs']) :is(.page-header,.welcome-banner,.hero,.community-banner,.job-header) {
    min-height:142px !important;
    margin:0 0 24px !important;
    padding:clamp(22px,3vw,32px) !important;
    color:#fff !important;
    background:linear-gradient(125deg,#064b2e 0%,#087443 68%,#0d8b52 100%) !important;
    border:1px solid rgba(255,255,255,.15) !important;
    border-radius:22px !important;
    box-shadow:0 16px 40px rgba(5,83,47,.17) !important;
}
html body.peso-product-ui:is([data-peso-page='jobseeker-home'],[data-peso-page='jobseeker-applied'],[data-peso-page='jobseeker-saved'],[data-peso-page='jobseeker-profile'],[data-peso-page='jobseeker-settings'],[data-peso-page='jobseeker-skills'],[data-peso-page='jobseeker-search'],[data-peso-page='jobseeker-calendar'],[data-peso-page='jobseeker-announcements'],[data-peso-page='jobseeker-community'],[data-peso-page='job-details'],[data-peso-page='jobs']) :is(.page-header,.welcome-banner,.hero,.community-banner,.job-header) :is(h1,.page-title) {
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font-size:clamp(26.4px,3vw,34.4px) !important;
    font-weight:850 !important;
    letter-spacing:-.035em !important;
    line-height:1.08 !important;
}
html body.peso-product-ui:is([data-peso-page='jobseeker-home'],[data-peso-page='jobseeker-applied'],[data-peso-page='jobseeker-saved'],[data-peso-page='jobseeker-profile'],[data-peso-page='jobseeker-settings'],[data-peso-page='jobseeker-skills'],[data-peso-page='jobseeker-search'],[data-peso-page='jobseeker-calendar'],[data-peso-page='jobseeker-announcements'],[data-peso-page='jobseeker-community'],[data-peso-page='job-details'],[data-peso-page='jobs']) :is(.page-header,.welcome-banner,.hero,.community-banner,.job-header) :is(p,.page-subtitle,.subtitle,.page-eyebrow,.role-home-kicker) {
    color:rgba(255,255,255,.91) !important;
    -webkit-text-fill-color:currentColor !important;
    font-size:14.72px !important;
    line-height:1.55 !important;
}
@media(max-width:700px){
    html body.peso-product-ui:is([data-peso-page='jobseeker-home'],[data-peso-page='jobseeker-applied'],[data-peso-page='jobseeker-saved'],[data-peso-page='jobseeker-profile'],[data-peso-page='jobseeker-settings'],[data-peso-page='jobseeker-skills'],[data-peso-page='jobseeker-search'],[data-peso-page='jobseeker-calendar'],[data-peso-page='jobseeker-announcements'],[data-peso-page='jobseeker-community'],[data-peso-page='job-details'],[data-peso-page='jobs']) :is(.page-header,.welcome-banner,.hero,.community-banner,.job-header){min-height:126px!important;padding:22px!important;border-radius:18px!important}
    html body.peso-product-ui[data-peso-page='jobseeker-saved'] .page-header > div:last-child{gap:12px!important}
    html body.peso-product-ui[data-peso-page='jobseeker-saved'] .page-header .search-wrapper{flex:0 0 auto!important;height:auto!important;min-height:0!important}
}

/* Text-symbol fallbacks keep critical actions understandable if the external
   icon font is blocked. They activate only when Font Awesome is unavailable. */
html.peso-icon-fallback i[class*='fa-']::before{font-family:'Segoe UI Symbol','Arial Unicode MS',sans-serif!important;font-style:normal!important;font-weight:700!important}
html.peso-icon-fallback :is(.fa-magnifying-glass,.fa-search)::before{content:'⌕'!important}
html.peso-icon-fallback .fa-bell::before{content:'◔'!important}
html.peso-icon-fallback .fa-user::before{content:'○'!important}
html.peso-icon-fallback .fa-house::before,html.peso-icon-fallback .fa-home::before{content:'⌂'!important}
html.peso-icon-fallback :is(.fa-briefcase,.fa-suitcase)::before{content:'▣'!important}
html.peso-icon-fallback .fa-calendar::before,html.peso-icon-fallback .fa-calendar-alt::before{content:'□'!important}
html.peso-icon-fallback .fa-bullhorn::before{content:'!'!important}
html.peso-icon-fallback :is(.fa-gear,.fa-cog)::before{content:'⚙'!important}
html.peso-icon-fallback :is(.fa-check,.fa-check-circle,.fa-circle-check)::before{content:'✓'!important}
html.peso-icon-fallback :is(.fa-plus,.fa-circle-plus)::before{content:'+'!important}
html.peso-icon-fallback :is(.fa-xmark,.fa-times)::before{content:'×'!important}
html.peso-icon-fallback :is(.fa-location-dot,.fa-map-marker-alt)::before{content:'⌖'!important}
html.peso-icon-fallback :is(.fa-clock,.fa-clock-o)::before{content:'◷'!important}
html.peso-icon-fallback .fa-envelope::before{content:'@'!important}
html.peso-icon-fallback .fa-phone::before{content:'☎'!important}
html.peso-icon-fallback .fa-bars::before{content:'☰'!important}
html.peso-icon-fallback :is(.fa-arrow-left,.fa-chevron-left)::before{content:'←'!important}
html.peso-icon-fallback :is(.fa-arrow-right,.fa-chevron-right)::before{content:'→'!important}
html.peso-icon-fallback :is(.fa-shield,.fa-shield-halved)::before{content:'◆'!important}
