/* Cohesive job discovery and job details experience. */
:is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) {
    --market-canvas: #071c14;
    --market-surface: #102b20;
    --market-surface-raised: #15372a;
    --market-surface-soft: #193e2f;
    --market-field: #0b241a;
    --market-ink: #f2f8f4;
    --market-muted: #adc3b7;
    --market-line: #315343;
    --market-brand: #52ca8a;
    --market-brand-strong: #159159;
    --market-brand-hover: #21a968;
    --market-brand-soft: rgba(82, 202, 138, .14);
    --market-gold: #f0c94d;
    --market-gold-soft: rgba(240, 201, 77, .14);
    --market-danger: #ffaaa5;
    --market-shadow-sm: 0 9px 28px rgba(0, 0, 0, .14);
    --market-shadow: 0 24px 64px rgba(0, 0, 0, .26);
    --market-focus: 0 0 0 4px rgba(82, 202, 138, .2);
    --bg-primary: var(--market-canvas);
    --bg-secondary: var(--market-surface);
    --text-primary: var(--market-ink);
    --text-secondary: var(--market-muted);
    --card-bg: var(--market-surface);
    --card-border: var(--market-line);
    --accent: var(--market-brand);
}

html[data-theme='light'] :is(body[data-peso-page='jobs'], body[data-peso-page='job-details']),
body.light[data-peso-page='job-details'],
body[data-peso-page='jobs']:not(.dark-mode) {
    --market-canvas: #f3f8f5;
    --market-surface: #ffffff;
    --market-surface-raised: #f8fbf9;
    --market-surface-soft: #edf6f0;
    --market-field: #f8fbf9;
    --market-ink: #17251e;
    --market-muted: #5b6c62;
    --market-line: #d2e1d8;
    --market-brand: #087443;
    --market-brand-strong: #087443;
    --market-brand-hover: #056136;
    --market-brand-soft: #e8f6ed;
    --market-gold: #946600;
    --market-gold-soft: #fff5d2;
    --market-danger: #a52621;
    --market-shadow-sm: 0 9px 28px rgba(20, 52, 34, .07);
    --market-shadow: 0 24px 64px rgba(20, 52, 34, .14);
    --market-focus: 0 0 0 4px rgba(8, 116, 67, .17);
}

html { min-width: 320px; }

:is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) {
    min-width: 320px;
    color: var(--market-ink) !important;
    background:
        radial-gradient(circle at 96% 2%, color-mix(in srgb, var(--market-brand) 8%, transparent), transparent 30rem),
        radial-gradient(circle at 4% 96%, color-mix(in srgb, var(--market-gold) 6%, transparent), transparent 28rem),
        var(--market-canvas) !important;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.55;
}

:is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) :is(a, button, input, select, textarea):focus-visible {
    outline: 2px solid var(--market-brand) !important;
    outline-offset: 2px !important;
    box-shadow: var(--market-focus) !important;
}

/* Public job browser */
body[data-peso-page='jobs'] .site-header {
    top: 12px;
    width: min(calc(100% - 32px), 1480px);
    min-height: 72px;
    margin: 12px auto 0;
    padding: 10px 16px !important;
    color: var(--market-ink);
    background: var(--market-surface) !important;
    border: 1px solid var(--market-line) !important;
    border-radius: 20px;
    box-shadow: var(--market-shadow-sm) !important;
}

body[data-peso-page='jobs'] .header-inner {
    width: 100%;
    max-width: none;
    padding: 0;
}

body[data-peso-page='jobs'] .logo img {
    width: 42px;
    height: 42px;
    background: #fff;
    border: 2px solid var(--market-gold);
}

body[data-peso-page='jobs'] .logo span { color: var(--market-ink) !important; font-size: .98rem; }
body[data-peso-page='jobs'] .header-nav { gap: 5px; }

body[data-peso-page='jobs'] .header-nav > a:not(.btn-login) {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    padding: 8px 13px;
    color: var(--market-muted);
    border: 1px solid transparent;
    border-radius: 12px;
    font-size: .8rem;
    font-weight: 720;
}

body[data-peso-page='jobs'] .header-nav > a:not(.btn-login):is(:hover, [aria-current='page']) {
    color: var(--market-brand);
    background: var(--market-brand-soft);
    border-color: color-mix(in srgb, var(--market-brand) 24%, transparent);
}

body[data-peso-page='jobs'] :is(.btn-login, .btn-search, .btn-view, .btn-apply-full) {
    color: #fff !important;
    background: var(--market-brand-strong) !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
}

body[data-peso-page='jobs'] :is(.btn-login, .btn-search, .btn-view, .btn-apply-full):hover {
    color: #fff !important;
    background: var(--market-brand-hover) !important;
    transform: translateY(-1px);
}

body[data-peso-page='jobs'] .btn-theme {
    width: 42px;
    height: 42px;
    color: var(--market-ink);
    background: var(--market-surface-soft);
    border: 1px solid var(--market-line);
    border-radius: 12px;
}

body[data-peso-page='jobs'] .btn-theme:hover { color: var(--market-brand); border-color: var(--market-brand); transform: none; }

body[data-peso-page='jobs'] > .container {
    width: min(calc(100% - 40px), 1480px) !important;
    max-width: 1480px !important;
    padding: 32px 0 78px !important;
}

body[data-peso-page='jobs'] .page-header {
    --peso-h1-color: #ffffff;
    min-height: 210px;
    margin-bottom: 24px !important;
    padding: clamp(28px, 4vw, 48px) !important;
    display: grid;
    align-content: center;
    color: #fff;
    background:
        radial-gradient(circle at 91% 8%, rgba(240, 201, 77, .2), transparent 18rem),
        linear-gradient(135deg, #075d37, #043d25) !important;
    border: 1px solid rgba(255, 255, 255, .13) !important;
    border-radius: 26px;
    box-shadow: 0 20px 50px rgba(3, 47, 27, .2);
}

body[data-peso-page='jobs'] .page-eyebrow {
    width: max-content;
    max-width: 100%;
    margin-bottom: 12px;
    padding: 6px 10px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #e4f5eb;
    background: rgba(0, 0, 0, .18);
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 999px;
    font-size: .69rem;
    font-weight: 800;
    letter-spacing: .075em;
    text-transform: uppercase;
}

html body[data-peso-page='jobs'] .page-header h1 {
    max-width: 820px;
    margin: 0;
    color: #fff !important;
    font-size: clamp(2rem, 4vw, 3.35rem) !important;
    letter-spacing: -.05em;
    line-height: 1.05;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

html body[data-peso-page='jobs'] .page-header p {
    max-width: 760px;
    margin: 13px 0 0;
    color: #e3f1e9 !important;
    font-size: .98rem;
    line-height: 1.65;
}

body[data-peso-page='jobs'] .filters-section {
    margin-bottom: 22px;
    padding: clamp(18px, 3vw, 26px);
    color: var(--market-ink);
    background: var(--market-surface) !important;
    border: 1px solid var(--market-line) !important;
    border-radius: 20px;
    box-shadow: var(--market-shadow-sm) !important;
}

body[data-peso-page='jobs'] .filter-heading {
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 12px;
}

body[data-peso-page='jobs'] .filter-heading-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--market-brand);
    background: var(--market-brand-soft);
    border-radius: 11px;
}

body[data-peso-page='jobs'] .filter-heading strong { display: block; color: var(--market-ink); font-size: .94rem; }
body[data-peso-page='jobs'] .filter-heading span:last-child { color: var(--market-muted); font-size: .75rem; }

body[data-peso-page='jobs'] .filters-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    align-items: end;
    gap: 13px;
}

body[data-peso-page='jobs'] .filter-group:first-child { grid-column: span 2; }
body[data-peso-page='jobs'] .filter-group label { color: var(--market-ink); font-size: .76rem; font-weight: 750; }

body[data-peso-page='jobs'] .filter-group :is(input, select) {
    width: 100%;
    min-height: 46px;
    padding: 0 13px;
    color: var(--market-ink);
    background: var(--market-field);
    border: 1px solid var(--market-line);
    border-radius: 12px;
}

body[data-peso-page='jobs'] .filter-group input::placeholder { color: var(--market-muted); opacity: .8; }
body[data-peso-page='jobs'] .filter-actions { margin-top: 16px; align-items: center; }
body[data-peso-page='jobs'] :is(.btn-search, .btn-clear) { min-height: 44px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 12px; font-weight: 750; }
body[data-peso-page='jobs'] .btn-clear { color: var(--market-ink); background: var(--market-surface-soft); border: 1px solid var(--market-line); }
body[data-peso-page='jobs'] .btn-clear:hover { color: var(--market-brand); border-color: var(--market-brand); }

body[data-peso-page='jobs'] .results-info {
    min-height: 46px;
    margin-bottom: 14px;
    padding: 0 4px;
    color: var(--market-muted);
}

body[data-peso-page='jobs'] .results-count,
body[data-peso-page='jobs'] .results-count strong { color: inherit; }
body[data-peso-page='jobs'] .results-count strong { color: var(--market-ink); }
body[data-peso-page='jobs'] .jobs-list { gap: 14px; }

body[data-peso-page='jobs'] .job-card {
    grid-template-columns: 80px minmax(0, 1fr) auto !important;
    gap: 20px;
    padding: 22px;
    color: var(--market-ink);
    background: var(--market-surface) !important;
    border: 1px solid var(--market-line) !important;
    border-radius: 18px;
    box-shadow: var(--market-shadow-sm) !important;
}

body[data-peso-page='jobs'] .job-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--market-brand) 52%, var(--market-line)) !important; box-shadow: var(--market-shadow) !important; }

body[data-peso-page='jobs'] .company-logo {
    width: 80px;
    height: 80px;
    padding: 8px;
    background: #fff;
    border: 1px solid var(--market-line);
    border-radius: 16px;
}

body[data-peso-page='jobs'] .company-logo img { object-fit: contain; }
body[data-peso-page='jobs'] .company-logo i { color: var(--market-brand); }
body[data-peso-page='jobs'] .job-title { color: var(--market-ink); font-size: 1.13rem; letter-spacing: -.02em; overflow-wrap: anywhere; }
body[data-peso-page='jobs'] :is(.company-name, .job-description, .job-meta-item) { color: var(--market-muted); }
body[data-peso-page='jobs'] .job-description { max-width: 880px; }
body[data-peso-page='jobs'] .job-meta-item i { color: var(--market-brand); }
body[data-peso-page='jobs'] .salary { color: var(--market-brand) !important; }

body[data-peso-page='jobs'] .job-tag {
    color: var(--market-brand);
    background: var(--market-brand-soft);
    border: 1px solid color-mix(in srgb, var(--market-brand) 25%, transparent);
}

body[data-peso-page='jobs'] .job-tag:is(.new, .recommended) { color: var(--market-gold); background: var(--market-gold-soft); border-color: color-mix(in srgb, var(--market-gold) 25%, transparent); }
body[data-peso-page='jobs'] .job-tag:is(.hot, .urgent) { color: var(--market-danger); background: color-mix(in srgb, var(--market-danger) 12%, transparent); border-color: color-mix(in srgb, var(--market-danger) 26%, transparent); }
body[data-peso-page='jobs'] .btn-view { min-height: 44px; padding: 0 20px; display: inline-flex; align-items: center; border-radius: 12px; cursor: pointer; }

body[data-peso-page='jobs'] .empty-state {
    min-height: 300px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 10px;
    color: var(--market-muted);
    background: var(--market-surface);
    border: 1px dashed var(--market-line);
    border-radius: 20px;
}

body[data-peso-page='jobs'] .empty-state h3 { color: var(--market-ink); }
body[data-peso-page='jobs'] .empty-state i { margin: 0; color: var(--market-brand); opacity: 1; font-size: 2rem; }

body[data-peso-page='jobs'] .pagination :is(a, span) {
    min-width: 42px;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--market-ink);
    background: var(--market-surface);
    border: 1px solid var(--market-line);
    border-radius: 11px;
}

body[data-peso-page='jobs'] .pagination a:is(.active, :hover) { color: #fff; background: var(--market-brand-strong); border-color: var(--market-brand-strong); }

body[data-peso-page='jobs'] .footer { margin-top: 0; color: #dcefe5; background: #043d25; }

/* Job browser dialog */
body[data-peso-page='jobs'] .modal-overlay { background: rgba(2, 12, 8, .78); }
body[data-peso-page='jobs'] .job-modal { color: var(--market-ink); background: var(--market-surface); border: 1px solid var(--market-line); box-shadow: var(--market-shadow); }
body[data-peso-page='jobs'] .modal-header { color: var(--market-ink); background: var(--market-surface-raised); border-color: var(--market-line); }
body[data-peso-page='jobs'] .modal-title-area h2 { color: var(--market-ink) !important; }
body[data-peso-page='jobs'] :is(.modal-company, .modal-section p, .meta-label) { color: var(--market-muted); }
body[data-peso-page='jobs'] .modal-section h3 { color: var(--market-ink) !important; }
body[data-peso-page='jobs'] .modal-section h3 i { color: var(--market-brand); }
body[data-peso-page='jobs'] .job-meta-item-detail { color: var(--market-ink); background: var(--market-surface-soft); border: 1px solid var(--market-line); }
body[data-peso-page='jobs'] .meta-value { color: var(--market-ink); }
body[data-peso-page='jobs'] .modal-footer { background: var(--market-surface-raised); border-color: var(--market-line); }
body[data-peso-page='jobs'] .modal-close { color: var(--market-ink); background: var(--market-surface-soft); border-color: var(--market-line); }

/* Logged-in job details */
body[data-peso-page='job-details'] > .container {
    width: min(calc(100% - 40px), 1480px) !important;
    max-width: 1480px !important;
    padding: 22px 0 82px !important;
}

html body[data-peso-page='job-details'] .job-header {
    min-height: 190px;
    padding: clamp(28px, 4vw, 44px);
    color: #fff;
    background:
        radial-gradient(circle at 92% 8%, rgba(240, 201, 77, .2), transparent 17rem),
        linear-gradient(135deg, #075d37, #043d25) !important;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 26px;
    box-shadow: 0 20px 50px rgba(3, 47, 27, .2);
}

html body[data-peso-page='job-details'] .job-header h1 { color: #fff !important; font-size: clamp(1.85rem, 4vw, 3rem); letter-spacing: -.045em; line-height: 1.08; overflow-wrap: anywhere; }
html body[data-peso-page='job-details'] .job-header :is(.company, .company a, .company span, .company i, .status-badge) { color: #fff !important; }
html body[data-peso-page='job-details'] .job-header .status-badge { background: rgba(0, 0, 0, .2) !important; border: 1px solid rgba(255, 255, 255, .3); }

body[data-peso-page='job-details'] .content-grid { grid-template-columns: minmax(280px, 340px) minmax(0, 1fr); gap: 22px; align-items: start; }

body[data-peso-page='job-details'] :is(.info-card, .job-section) {
    color: var(--market-ink) !important;
    background: var(--market-surface) !important;
    border: 1px solid var(--market-line) !important;
    border-radius: 18px !important;
    box-shadow: var(--market-shadow-sm) !important;
}

body[data-peso-page='job-details'] :is(.info-card, .job-section):hover { transform: none !important; border-color: var(--market-line) !important; }
body[data-peso-page='job-details'] :is(.job-section p, .job-section li, .detail-value, .company-description, .related-job-title-sm) { color: var(--market-ink) !important; }
body[data-peso-page='job-details'] :is(.detail-label, .related-job-meta-sm, .match-label, .section-description) { color: var(--market-muted) !important; }
body[data-peso-page='job-details'] .section-title { color: var(--market-ink) !important; }
body[data-peso-page='job-details'] .section-title i { color: var(--market-brand) !important; }
body[data-peso-page='job-details'] .company-logo { background: #fff !important; border: 1px solid var(--market-line); }

body[data-peso-page='job-details'] .related-job-item {
    color: var(--market-ink);
    background: var(--market-surface-soft);
    border: 1px solid var(--market-line);
    border-radius: 13px;
}

body[data-peso-page='job-details'] .related-job-item:hover { color: var(--market-ink); background: var(--market-brand-soft); border-color: var(--market-brand); transform: translateX(2px); }

body[data-peso-page='job-details'] :is(.apply-btn, .btn-primary, .btn-add-skill) {
    color: #fff !important;
    background: var(--market-brand-strong) !important;
    border-color: var(--market-brand-strong) !important;
    box-shadow: none !important;
}

body[data-peso-page='job-details'] :is(.apply-btn, .btn-primary, .btn-add-skill):hover { color: #fff !important; background: var(--market-brand-hover) !important; transform: translateY(-1px); }

body[data-peso-page='job-details'] .modal { background: rgba(2, 12, 8, .78); }
body[data-peso-page='job-details'] .modal-content { color: var(--market-ink) !important; background: var(--market-surface) !important; border: 1px solid var(--market-line) !important; box-shadow: var(--market-shadow) !important; }
body[data-peso-page='job-details'] .modal-header { color: #fff !important; background: linear-gradient(135deg, #075d37, #043d25) !important; border-color: rgba(255, 255, 255, .12) !important; }
body[data-peso-page='job-details'] .modal-header :is(h2, h3, .modal-close) { color: #fff !important; }
body[data-peso-page='job-details'] .modal-close { background: rgba(0, 0, 0, .18) !important; border: 1px solid rgba(255, 255, 255, .28) !important; }
body[data-peso-page='job-details'] :is(.modal-body, .modal-actions) { color: var(--market-ink); background: var(--market-surface) !important; border-color: var(--market-line) !important; }
body[data-peso-page='job-details'] :is(.modal-body input, .modal-body select, .modal-body textarea) { color: var(--market-ink) !important; background: var(--market-field) !important; border: 1px solid var(--market-line) !important; }
body[data-peso-page='job-details'] .footer { margin-top: 0; padding: 28px 20px; color: #dcefe5; background: #043d25 !important; }

/* Smoothness: remove permanent visual work; retain short interaction feedback. */
:is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) :is(.bg-blob-1, .bg-blob-2) { display: none !important; animation: none !important; }

:is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) :is(
    .site-header, .navbar, .job-card, .filters-section, .job-modal,
    .modal, .modal-overlay, .modal-content, .info-card, .job-section,
    .dropdown, .notif-dropdown, .profile-dropdown
) {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

:is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) :is(.container, .page-header, .job-header, .job-card, .info-card, .job-section) { animation: none !important; }
:is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) :is(a, button, input, select, textarea, .job-card, .related-job-item) { transition-duration: 140ms !important; transition-timing-function: ease-out !important; }

@media (max-width: 1100px) {
    body[data-peso-page='jobs'] .filters-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body[data-peso-page='jobs'] .filter-group:first-child { grid-column: span 2; }
    body[data-peso-page='job-details'] .content-grid { grid-template-columns: minmax(250px, 300px) minmax(0, 1fr); }
}

@media (max-width: 760px) {
    body[data-peso-page='jobs'] .site-header { top: 8px; width: min(calc(100% - 20px), 1480px); border-radius: 17px; }
    body[data-peso-page='jobs'] .header-inner { flex-direction: row; gap: 12px; }
    body[data-peso-page='jobs'] .logo span,
    body[data-peso-page='jobs'] .header-nav > a:not(.btn-login) { display: none; }
    body[data-peso-page='jobs'] .header-nav { margin-left: auto; }
    body[data-peso-page='jobs'] .btn-login { min-height: 42px; padding: 0 15px; display: inline-flex; align-items: center; }
    body[data-peso-page='jobs'] > .container,
    body[data-peso-page='job-details'] > .container { width: min(calc(100% - 20px), 1480px) !important; padding-top: 20px !important; }
    body[data-peso-page='jobs'] .page-header { min-height: 0; padding: 28px 22px !important; border-radius: 21px; }
    body[data-peso-page='jobs'] .filters-grid { grid-template-columns: minmax(0, 1fr); }
    body[data-peso-page='jobs'] .filter-group:first-child { grid-column: auto; }
    body[data-peso-page='jobs'] .filter-actions { align-items: stretch; flex-direction: column; }
    body[data-peso-page='jobs'] :is(.btn-search, .btn-clear) { width: 100%; }
    body[data-peso-page='jobs'] .job-card { grid-template-columns: 60px minmax(0, 1fr) !important; align-items: start; padding: 18px; }
    body[data-peso-page='jobs'] .company-logo { width: 60px; height: 60px; }
    body[data-peso-page='jobs'] .job-actions { grid-column: 1 / -1; width: 100%; }
    body[data-peso-page='jobs'] .btn-view { width: 100%; justify-content: center; }
    body[data-peso-page='jobs'] .job-meta { gap: 8px 13px; }
    body[data-peso-page='job-details'] .content-grid { grid-template-columns: minmax(0, 1fr); }
    html body[data-peso-page='job-details'] .job-header { min-height: 0; padding: 28px 22px; border-radius: 21px; }
}

@media (max-width: 440px) {
    body[data-peso-page='jobs'] .job-card { grid-template-columns: minmax(0, 1fr) !important; }
    body[data-peso-page='jobs'] .company-logo { width: 56px; height: 56px; }
    body[data-peso-page='jobs'] .job-tags { gap: 6px; }
    body[data-peso-page='jobs'] .job-tag { font-size: .68rem; }
    body[data-peso-page='jobs'] .modal-header { align-items: flex-start; padding: 24px 20px; }
    body[data-peso-page='jobs'] .modal-logo { width: 58px; height: 58px; }
    body[data-peso-page='jobs'] .modal-body { padding: 22px 20px; }
}

@media (prefers-reduced-motion: reduce) {
    :is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) *,
    :is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) *::before,
    :is(body[data-peso-page='jobs'], body[data-peso-page='job-details']) *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}