/* ── SIMULATOR SCOPED STYLES ── */
.sim-wrap {
    background: var(--white);
    min-height: 100vh;
}

.page-header-section .hero-badge {
    border-left: none;
    padding-left: 0;
}

/* ── BREADCRUMB / BACK BAR ── */
.sim-breadcrumb {
    background: var(--white);
    border-bottom: 1px solid var(--border-color);
    padding: 12px 0;
}

.sim-breadcrumb .container {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--text-muted);
}

.sim-breadcrumb a {
    color: var(--primary-light);
    text-decoration: none;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: color 0.2s;
}

.sim-breadcrumb a:hover {
    color: var(--primary-color);
}

.sim-breadcrumb .sep {
    color: var(--text-light-muted);
}

.sim-breadcrumb .current {
    color: var(--primary-color);
    font-weight: 600;
}

/* ── SIM CONTENT WRAPPER ── */
.sim-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 32px 80px;
}

:root {
    /* Text colors */
    --gd: var(--primary-color);
    --gm: var(--text-muted);
    --gl: var(--text-light-muted);

    /* Theme brand colors */
    --bs: var(--primary-light);
    --bm: var(--primary-light);
    --bd: var(--primary-color);
    --bl: var(--accent-light);
    --bx: rgba(116, 167, 201, 0.08);
    --bxx: rgba(116, 167, 201, 0.04);

    /* Basic background & borders */
    --cr: #F8FAFC;
    --wh: var(--white);
    --ye: #FFFDF6;
    --bo: var(--border-color);

    /* Shadows & radii */
    --sh: var(--shadow-sm);
    --sh2: var(--shadow-md);

    /* Specific feedback colors */
    --gbg: #E8F5E9;
    --gn: #2E7D32;
    --obg: #FFF3E0;
    --or: #E65100;
}

/* ── SECTION TITLE ── */
.sec {
    margin-bottom: 28px;
}

.sec-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--bo);
}

.sec-num {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--bs);
    color: var(--wh);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
}

.sec-title h2 {
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 700;
    color: var(--gd);
}

.sec-title p {
    font-size: 13px;
    color: var(--gm);
    margin-top: 2px;
}

/* ── DIVIDER ── */
.divider {
    height: 1px;
    background: var(--bo);
    margin: 44px 0;
}

/* ── 2-COL GRID ── */
.g2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}

/* ── CARD ── */
.s-card {
    background: var(--wh);
    border-radius: var(--radius-md);
    border: 1px solid var(--bo);
    box-shadow: var(--sh);
    overflow: hidden;
    margin-bottom: 18px;
    transition: var(--transition-smooth);
}

.s-card:last-child {
    margin-bottom: 0;
}

.s-card:hover {
    box-shadow: var(--sh2);
}

.ch {
    background: var(--wh);
    color: var(--gd);
    padding: 14px 22px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid var(--bo);
}

.ch.blue {
    border-bottom: 2px solid var(--bs);
}

.ni>span:first-child {
    color: var(--bs);
    font-weight: 700;
    font-size: 16px;
    line-height: 1;
    margin-top: 2px;
}

.ch h3 {
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    color: var(--gd);
    margin: 0;
}

/* ── FIELD ROWS ── */
.fgt {
    padding: 10px 22px 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--gd);
    background: var(--bxx);
    border-bottom: 1px solid var(--bo);
}

.fr {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 14px;
    padding: 10px 22px;
    border-bottom: 1px solid var(--bo);
    transition: background .15s;
}

.fr:last-child {
    border-bottom: none;
}

.fr:hover {
    background: var(--bxx);
}

.fr.odd {
    background: var(--cr);
}

.fr.odd:hover {
    background: var(--bxx);
}

.fl {
    font-size: 13.5px;
    line-height: 1.35;
    color: var(--gd);
    font-family: var(--font-body);
}

.fh {
    font-size: 11px;
    color: var(--gm);
    font-style: italic;
    margin-top: 2px;
}

.fi {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fi input,
.fi select {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--bd);
    background: var(--ye);
    border: 1.5px solid var(--bl);
    border-radius: var(--radius-md);
    padding: 7px 10px;
    width: 130px;
    text-align: right;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
    appearance: none;
    -webkit-appearance: none;
    font-variant-numeric: tabular-nums;
}

.fi input:focus,
.fi select:focus {
    border-color: var(--bs);
    background: #FFFDF1;
    box-shadow: 0 0 0 3px rgba(116, 167, 201, 0.2);
}

.unit {
    font-size: 12px;
    color: var(--gm);
    font-weight: 500;
    min-width: 24px;
    font-family: var(--font-body);
}

.sw {
    position: relative;
}

.sw::after {
    content: '▾';
    position: absolute;
    right: 9px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--bs);
    pointer-events: none;
    font-size: 11px;
}

.sw select {
    padding-right: 26px;
    cursor: pointer;
}

/* ── VERDICT ── */
.verdict {
    border-radius: var(--radius-md);
    padding: 24px 32px;
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 28px;
    box-shadow: var(--sh2);
    transition: var(--transition-smooth);
}

.vr {
    background: linear-gradient(135deg, #E8F5E9, #C8E6C9);
    border: 1.5px solid #A5D6A7;
}

.vm {
    background: linear-gradient(135deg, #FFF3E0, #FFE0B2);
    border: 1.5px solid #FFCC80;
}

.vn {
    background: linear-gradient(135deg, var(--bxx), var(--bx));
    border: 1.5px solid var(--bl);
}

.vi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.vr .vi {
    color: var(--gn);
}

.vm .vi {
    color: var(--or);
}

.vn .vi {
    color: var(--bd);
}

.vt h2 {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 6px;
}

.vr .vt h2 {
    color: var(--gn);
}

.vm .vt h2 {
    color: var(--or);
}

.vn .vt h2 {
    color: var(--bd);
}

.vt p {
    font-size: 13.5px;
    color: var(--gm);
    line-height: 1.6;
    font-family: var(--font-body);
}

.vt strong {
    color: var(--gd);
}

.va-box {
    margin-left: auto;
    flex-shrink: 0;
    text-align: center;
    background: rgba(255, 255, 255, 0.8);
    border-radius: var(--radius-md);
    padding: 14px 24px;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.va {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 600;
    line-height: 1;
}

.vr .va {
    color: var(--gn);
}

.vm .va {
    color: var(--or);
}

.vl {
    font-size: 9px;
    color: var(--gm);
    letter-spacing: 1px;
    margin-top: 4px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: var(--font-body);
}

/* ── RESULT CARDS ── */
.rg {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    margin-bottom: 22px;
}

.rc {
    border-radius: var(--radius-md);
    overflow: hidden;
    border: 1px solid var(--bo);
    box-shadow: var(--sh);
}

.rch {
    padding: 16px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.rch.mic {
    background: var(--obg);
    border-bottom: 2px solid #FFCC80;
}

.rch.rel {
    background: var(--gbg);
    border-bottom: 2px solid #A5D6A7;
}

.rch h3 {
    font-family: var(--font-heading);
    font-size: 17px;
    font-weight: 700;
}

.rch.mic h3 {
    color: var(--or);
}

.rch.rel h3 {
    color: var(--gn);
}

.rtag {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: var(--radius-md);
}

.rtag.mic {
    background: #FFE0B2;
    color: var(--or);
}

.rtag.rel {
    background: #C8E6C9;
    color: var(--gn);
}

.rl {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 22px;
    border-bottom: 1px solid var(--bo);
    font-size: 13.5px;
    font-family: var(--font-body);
}

.rl:last-child {
    border-bottom: none;
}

.rl.odd {
    background: var(--cr);
}

.rl.tot {
    padding: 14px 22px;
    font-weight: 600;
    font-size: 15px;
}

.rl.tot.mic {
    background: var(--obg);
    color: var(--or);
}

.rl.tot.rel {
    background: var(--gbg);
    color: var(--gn);
}

.rv {
    font-family: var(--font-body);
    font-weight: 500;
    font-size: 13.5px;
    font-variant-numeric: tabular-nums;
}

/* ── YEAR BUTTONS ── */
.yrtabs {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
    flex-wrap: wrap;
}

.yrb {
    padding: 8px 18px;
    border-radius: var(--radius-md);
    border: 1.5px solid var(--bo);
    background: var(--wh);
    font-size: 13px;
    font-weight: 600;
    color: var(--gm);
    cursor: pointer;
    transition: all .2s;
    font-family: var(--font-body);
}

.yrb:hover {
    border-color: var(--bs);
    color: var(--bs);
}

.yrb.active {
    background: var(--bs);
    border-color: var(--bs);
    color: var(--wh);
    box-shadow: 0 2px 8px rgba(116, 167, 201, 0.2);
}

/* ── TABLE 5 ANS ── */
.tbl {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
    font-family: var(--font-body);
}

.tbl thead tr {
    background: var(--gd);
    color: var(--wh);
}

.tbl thead th {
    padding: 12px 16px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    text-align: left;
}

.tbl thead th:not(:first-child) {
    text-align: right;
    font-family: var(--font-body);
    font-variant-numeric: tabular-nums;
}

.tbl tbody tr {
    border-bottom: 1px solid var(--bo);
}

.tbl tbody tr:hover {
    background: var(--bxx);
}

.tbl tbody tr.odd {
    background: var(--cr);
}

.tbl tr.sh td {
    background: var(--bx);
    color: var(--bd);
    font-weight: 600;
    font-size: 12.5px;
    letter-spacing: 0.5px;
    padding: 10px 16px;
    text-transform: uppercase;
}

.tbl tr.tr td {
    background: var(--bxx);
    font-weight: 600;
    border-top: 2px solid var(--bs);
    border-bottom: 2px solid var(--bs);
    padding: 12px 16px;
    color: var(--bd);
    font-size: 14.5px;
}

.tbl td {
    padding: 10px 16px;
}

.tbl td:not(:first-child) {
    text-align: right;
    font-family: var(--font-body);
    font-variant-numeric: tabular-nums;
}

.neg {
    color: var(--gn) !important;
    font-weight: 600 !important;
}

.pos {
    color: var(--or) !important;
    font-weight: 600 !important;
}

/* ── NOTES ── */
.notes {
    background: var(--wh);
    border-radius: var(--radius-md);
    border: 1px solid var(--bo);
    overflow: hidden;
    box-shadow: var(--sh);
    margin-top: 22px;
}

.nh {
    background: var(--wh);
    color: var(--gd);
    padding: 14px 22px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-bottom: 1px solid var(--bo);
}

.ni {
    display: flex;
    gap: 12px;
    padding: 12px 22px;
    border-bottom: 1px solid var(--bo);
    font-size: 14px;
    color: var(--gm);
    line-height: 1.6;
    align-items: flex-start;
    font-family: var(--font-body);
}

.ni:last-child {
    border-bottom: none;
}

.ni.odd {
    background: var(--cr);
}



.deficit-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #E3F2FD;
    border: 1px solid #90CAF9;
    border-radius: var(--radius-md);
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 600;
    color: #1565C0;
    margin-top: 8px;
}

@media (max-width: 860px) {
    .sim-page {
        padding: 22px 14px 60px;
    }

    .g2,
    .rg {
        grid-template-columns: 1fr;
    }

    .fi input,
    .fi select {
        width: 108px;
    }

    .verdict {
        flex-wrap: wrap;
    }

    .va-box {
        margin-left: 0;
        width: 100%;
    }
}