/* =========================================================
   JAMAICA ELECTORAL ANALYTICS
   F — EXPANDED COMPETITIVENESS STUDY

   Owns:
   - expanded F study presentation
   - study scope controls
   - study heading
   - summary metrics
   - rankings
   - compare groups
   - detail accordion
   - deep geography controls
   - detailed tables
   - responsive presentation

   Does NOT own:
   - collapsed F chart
   - shared expanded panel positioning
   - DashboardState logic
   - electoral calculations

   Collapsed F:
   dashboardCompetitive.css

   Shared pop-out shell:
   dashboardPanelExpand.css
   ========================================================= */


/* =========================================================
   VISIBILITY

   The study exists inside the panel body but is only
   presented when F is expanded.
   ========================================================= */

.competitive-study {
    display: none;
}


.dashboard-panel--competitive.dashboard-panel--expanded
.competitive-chart {
    display: none;
}


.dashboard-panel--competitive.dashboard-panel--expanded
.competitive-study {
    display: block;

    width: 100%;
    min-width: 0;

    padding:
        0.85rem
        0.9rem
        1rem;
}


/* =========================================================
   EXPANDED BODY

   Shared panel shell owns scrolling.
   F only removes collapsed-card padding constraints.
   ========================================================= */

.dashboard-panel--competitive.dashboard-panel--expanded
.dashboard-panel__body--competitive {
    display: block;

    padding: 0;

    overflow:
        auto;
}


/* =========================================================
   SCOPE TOOLBAR
   ========================================================= */

.competitive-study__scope {
    display: grid;

    grid-template-columns:
        minmax(175px, 0.8fr)
        minmax(0, 2.2fr);

    align-items:
        center;

    gap:
        0.9rem;

    margin-bottom:
        0.9rem;

    padding:
        0.7rem
        0.8rem;

    border:
        1px solid
        var(--border);

    border-radius:
        10px;

    background:
        var(--surface-muted);
}


/* =========================================================
   SCOPE HEADING
   ========================================================= */

.competitive-study__scope-head {
    min-width: 0;

    display: flex;

    flex-direction:
        column;

    gap:
        0.18rem;
}


.competitive-study__scope-head > div {
    display: flex;

    flex-direction:
        column;

    gap:
        0.12rem;
}


.competitive-study__scope-head strong {
    color:
        var(--text-primary);

    font-size:
        0.64rem;

    font-weight:
        800;

    line-height:
        1.2;
}


.competitive-study__scope-head span {
    color:
        var(--text-muted);

    font-size:
        0.5rem;

    font-weight:
        500;

    line-height:
        1.3;
}


.competitive-study__scope-context {
    display: inline-flex;

    align-items:
        center;

    width:
        fit-content;

    margin-top:
        0.15rem;

    padding:
        0.24rem
        0.42rem;

    border:
        1px solid
        var(--border);

    border-radius:
        999px;

    color:
        var(--text-secondary) !important;

    background:
        var(--surface);

    font-size:
        0.47rem !important;

    font-weight:
        700 !important;
}


/* =========================================================
   SCOPE CONTROLS
   ========================================================= */

.competitive-study__scope-controls {
    min-width:
        0;

    display: flex;

    align-items:
        flex-end;

    justify-content:
        flex-end;

    flex-wrap:
        wrap;

    gap:
        0.55rem;
}


.competitive-study__scope-group {
    min-width:
        0;

    display: flex;

    flex-direction:
        column;

    gap:
        0.28rem;
}


.competitive-study__scope-label {
    color:
        var(--text-muted);

    font-size:
        0.46rem;

    font-weight:
        750;

    line-height:
        1;

    letter-spacing:
        0.025em;

    text-transform:
        uppercase;
}


/* =========================================================
   SEGMENTED CONTROL
   ========================================================= */

.competitive-study__segmented {
    display:
        inline-flex;

    align-items:
        center;

    padding:
        2px;

    border:
        1px solid
        var(--border);

    border-radius:
        7px;

    background:
        var(--surface);
}


.competitive-study__scope-button {
    min-height:
        27px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0
        0.55rem;

    border:
        0;

    border-radius:
        5px;

    color:
        var(--text-secondary);

    background:
        transparent;

    font-family:
        inherit;

    font-size:
        0.51rem;

    font-weight:
        700;

    line-height:
        1;

    cursor:
        pointer;

    transition:
        color
        var(--transition-fast),
        background-color
        var(--transition-fast),
        box-shadow
        var(--transition-fast);
}


.competitive-study__scope-button:hover {
    color:
        var(--text-primary);

    background:
        var(--surface-muted);
}


.competitive-study__scope-button.is-active {
    color:
        #ffffff;

    background:
        var(--brand-green);

    box-shadow:
        0 1px 2px
        rgba(15, 23, 42, 0.08);
}


/* =========================================================
   SELECTS
   ========================================================= */

.competitive-study__scope-select {
    min-width:
        88px;

    height:
        31px;

    padding:
        0
        1.7rem
        0
        0.55rem;

    border:
        1px solid
        var(--border);

    border-radius:
        7px;

    color:
        var(--text-primary);

    background:
        var(--surface);

    font-family:
        inherit;

    font-size:
        0.52rem;

    font-weight:
        700;

    outline:
        none;
}


.competitive-study__scope-select:focus {
    border-color:
        var(--brand-green);

    box-shadow:
        0 0 0 2px
        var(--brand-green-soft);
}


.competitive-study__scope-vs {
    align-self:
        center;

    padding-bottom:
        0.42rem;

    color:
        var(--text-muted);

    font-size:
        0.48rem;

    font-weight:
        750;
}


/* =========================================================
   STUDY INTRO
   ========================================================= */

.competitive-study__intro {
    display: flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        1rem;

    margin:
        0.2rem
        0
        0.65rem;

    padding:
        0
        0.1rem;
}


.competitive-study__eyebrow {
    margin-bottom:
        0.18rem;

    color:
        var(--brand-green);

    font-size:
        0.49rem;

    font-weight:
        800;

    line-height:
        1;

    letter-spacing:
        0.07em;

    text-transform:
        uppercase;
}


.competitive-study__intro h3 {
    margin: 0;

    color:
        var(--text-primary);

    font-size:
        1rem;

    font-weight:
        800;

    line-height:
        1.15;

    letter-spacing:
        -0.025em;
}


.competitive-study__period {
    flex:
        0 0 auto;

    display:
        inline-flex;

    align-items:
        center;

    min-height:
        26px;

    padding:
        0
        0.55rem;

    border:
        1px solid
        var(--border);

    border-radius:
        999px;

    color:
        var(--text-secondary);

    background:
        var(--surface);

    font-size:
        0.5rem;

    font-weight:
        750;

    font-variant-numeric:
        tabular-nums;
}


/* =========================================================
   SUMMARY GRID

   Five-track grid lets one important card occupy
   double width without forcing another row.
   ========================================================= */

.competitive-study__summary {
    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap:
        0.55rem;

    margin-bottom:
        0.8rem;
}


/* =========================================================
   SUMMARY CARD
   ========================================================= */

.competitive-study__summary-card {
    position:
        relative;

    min-width:
        0;

    min-height:
        74px;

    display: flex;

    flex-direction:
        column;

    justify-content:
        center;

    gap:
        0.2rem;

    padding:
        0.65rem
        0.7rem;

    border:
        1px solid
        var(--border);

    border-radius:
        9px;

    background:
        var(--surface);

    overflow:
        hidden;
}


.competitive-study__summary-card::before {
    content: "";

    position:
        absolute;

    top:
        0;

    left:
        0;

    width:
        100%;

    height:
        2px;

    background:
        var(--brand-green);

    opacity:
        0.75;
}


.competitive-study__summary-card--wide {
    grid-column:
        span 2;
}


.competitive-study__summary-card > span {
    color:
        var(--text-muted);

    font-size:
        0.48rem;

    font-weight:
        750;

    line-height:
        1.2;

    letter-spacing:
        0.02em;
}


.competitive-study__summary-card > strong {
    max-width:
        100%;

    overflow:
        hidden;

    color:
        var(--text-primary);

    font-size:
        0.79rem;

    font-weight:
        820;

    line-height:
        1.2;

    letter-spacing:
        -0.015em;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    font-variant-numeric:
        tabular-nums;
}


.competitive-study__summary-card--wide > strong {
    font-size:
        0.7rem;
}


.competitive-study__summary-card > small {
    color:
        var(--text-muted);

    font-size:
        0.47rem;

    font-weight:
        600;

    line-height:
        1.25;
}

/* =========================================================
   MAIN ANALYSIS BLOCK
   ========================================================= */

.competitive-study__main-block {
    margin-bottom:
        0.5rem;

    border:
        1px solid
        var(--border);

    border-radius:
        8px;

    background:
        var(--surface);

    overflow:
        hidden;
}


/* =========================================================
   SECTION HEADING
   ========================================================= */

.competitive-study__section-head {
    min-height:
        36px;

    display: flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        0.75rem;

    padding:
        0.34rem
        0.55rem;

    border-bottom:
        1px solid
        var(--border);

    background:
        var(--surface-muted);
}


.competitive-study__section-head > div {
    min-width:
        0;

    display: flex;

    flex-direction:
        column;

    gap:
        1px;
}


.competitive-study__section-head > div > span {
    color:
        var(--text-muted);

    font-size:
        0.39rem;

    font-weight:
        750;

    line-height:
        1;

    letter-spacing:
        0.045em;

    text-transform:
        uppercase;
}


.competitive-study__section-head > div > strong {
    color:
        var(--text-primary);

    font-size:
        0.52rem;

    font-weight:
        800;

    line-height:
        1.1;
}


.competitive-study__section-head > span {
    min-height:
        19px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0
        0.38rem;

    border:
        1px solid
        var(--border);

    border-radius:
        999px;

    color:
        var(--text-secondary);

    background:
        var(--surface);

    font-size:
        0.4rem;

    font-weight:
        750;

    line-height:
        1;

    font-variant-numeric:
        tabular-nums;
}


/* =========================================================
   RANKING
   ========================================================= */

.competitive-study__ranking {
    width:
        100%;
}


/* =========================================================
   RANKING ROW

   Name + party + rating now sit on one line.
   ========================================================= */

.competitive-study__ranking-row {
    display: grid;

    grid-template-columns:
        22px
        minmax(0, 1fr)
        auto;

    align-items:
        center;

    gap:
        0.5rem;

    min-height:
        37px;

    padding:
        0.26rem
        0.55rem;

    border-bottom:
        1px solid
        var(--border);

    transition:
        background-color
        var(--transition-fast);
}


.competitive-study__ranking-row:hover {
    background:
        var(--surface-muted);
}


.competitive-study__ranking-row:last-child {
    border-bottom:
        0;
}


/* =========================================================
   RANK
   ========================================================= */

.competitive-study__rank {
    width:
        20px;

    height:
        20px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid
        var(--border);

    border-radius:
        5px;

    color:
        var(--text-muted);

    background:
        var(--surface);

    font-size:
        0.4rem;

    font-weight:
        800;

    line-height:
        1;

    font-variant-numeric:
        tabular-nums;
}


.competitive-study__ranking-row:first-child
.competitive-study__rank {
    color:
        var(--brand-green);

    border-color:
        color-mix(
            in srgb,
            var(--brand-green) 25%,
            var(--border)
        );

    background:
        var(--brand-green-soft);
}


/* =========================================================
   RANKING IDENTITY

   IMPORTANT:
   Previously this was a vertical stack.
   It is now one horizontal analytical line.
   ========================================================= */

.competitive-study__ranking-name {
    min-width:
        0;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto;

    align-items:
        center;

    gap:
        0.45rem;
}


.competitive-study__ranking-name > strong {
    min-width:
        0;

    overflow:
        hidden;

    color:
        var(--text-primary);

    font-size:
        0.5rem;

    font-weight:
        800;

    line-height:
        1.1;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;
}


.competitive-study__ranking-name > span {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        flex-end;

    gap:
        0.2rem;

    white-space:
        nowrap;
}


/* =========================================================
   DRILL BUTTON
   ========================================================= */

.competitive-study__drill {
    min-width:
        0;

    max-width:
        100%;

    display:
        block;

    overflow:
        hidden;

    padding:
        0;

    border:
        0;

    color:
        var(--text-primary);

    background:
        transparent;

    font-family:
        inherit;

    text-align:
        left;

    cursor:
        pointer;
}


.competitive-study__drill strong {
    display:
        block;

    overflow:
        hidden;

    max-width:
        100%;

    color:
        inherit;

    font-size:
        0.5rem;

    font-weight:
        800;

    line-height:
        1.1;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;
}


.competitive-study__drill:hover {
    color:
        var(--brand-green);
}


/* =========================================================
   MARGIN
   ========================================================= */

.competitive-study__ranking-margin {
    min-width:
        50px;

    min-height:
        21px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0
        0.36rem;

    border:
        1px solid
        var(--border);

    border-radius:
        999px;

    color:
        var(--text-primary);

    background:
        var(--surface-muted);

    font-size:
        0.46rem;

    font-weight:
        820;

    line-height:
        1;

    font-variant-numeric:
        tabular-nums;

    white-space:
        nowrap;
}


/* =========================================================
   WINNER
   ========================================================= */

.competitive-study__winner {
    min-width:
        25px;

    min-height:
        16px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0
        0.22rem;

    border:
        1px solid
        transparent;

    border-radius:
        4px;

    font-size:
        0.36rem;

    font-weight:
        800;

    line-height:
        1;
}


.competitive-study__winner--jlp {
    color:
        #0d744c;

    border-color:
        rgba(22, 135, 93, 0.13);

    background:
        #e4f4ec;
}


.competitive-study__winner--pnp {
    color:
        #c95c1b;

    border-color:
        rgba(244, 122, 35, 0.14);

    background:
        #fff0e5;
}


.competitive-study__winner--tie,
.competitive-study__winner--other,
.competitive-study__winner--unknown {
    color:
        var(--text-secondary);

    border-color:
        var(--border);

    background:
        var(--surface-muted);
}


/* =========================================================
   RATING
   ========================================================= */

.competitive-study__rating {
    min-height:
        16px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0
        0.25rem;

    border:
        1px solid
        var(--border);

    border-radius:
        999px;

    color:
        var(--text-secondary);

    background:
        var(--surface-muted);

    font-size:
        0.35rem;

    font-weight:
        750;

    line-height:
        1;

    white-space:
        nowrap;
}


.competitive-study__rating--knife {
    color:
        #9c3d3d;

    border-color:
        rgba(156, 61, 61, 0.15);

    background:
        rgba(156, 61, 61, 0.06);
}


.competitive-study__rating--very-close {
    color:
        #a96818;

    border-color:
        rgba(169, 104, 24, 0.15);

    background:
        rgba(169, 104, 24, 0.06);
}


.competitive-study__rating--competitive {
    color:
        var(--brand-green);

    border-color:
        color-mix(
            in srgb,
            var(--brand-green) 22%,
            var(--border)
        );

    background:
        var(--brand-green-soft);
}


.competitive-study__rating--comfortable,
.competitive-study__rating--safe {
    color:
        var(--text-muted);
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .competitive-study__ranking-row {
        grid-template-columns:
            21px
            minmax(0, 1fr)
            auto;

        gap:
            0.4rem;

        min-height:
            38px;

        padding:
            0.28rem
            0.45rem;
    }


    .competitive-study__ranking-name {
        gap:
            0.3rem;
    }

}
/* =========================================================
   COMPETITIVENESS RATING
   ========================================================= */

.competitive-study__rating {
    min-height:
        19px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0.1rem
        0.34rem;

    border:
        1px solid
        var(--border);

    border-radius:
        999px;

    color:
        var(--text-secondary);

    background:
        var(--surface-muted);

    font-size:
        0.42rem;

    font-weight:
        750;

    line-height:
        1;

    white-space:
        nowrap;
}


.competitive-study__rating--knife {
    color:
        #9c3d3d;

    border-color:
        rgba(156, 61, 61, 0.17);

    background:
        rgba(156, 61, 61, 0.07);
}


.competitive-study__rating--very-close {
    color:
        #a96818;

    border-color:
        rgba(169, 104, 24, 0.18);

    background:
        rgba(169, 104, 24, 0.07);
}


.competitive-study__rating--competitive {
    color:
        var(--brand-green);

    border-color:
        color-mix(
            in srgb,
            var(--brand-green) 25%,
            var(--border)
        );

    background:
        var(--brand-green-soft);
}


.competitive-study__rating--comfortable {
    color:
        var(--text-secondary);
}


.competitive-study__rating--safe {
    color:
        var(--text-muted);

    background:
        var(--surface-muted);
}


/* =========================================================
   COMPARE GRID
   ========================================================= */

.competitive-study__compare-grid {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap:
        0.65rem;

    margin-bottom:
        0.75rem;
}


/* =========================================================
   COMPARE GROUP
   ========================================================= */

.competitive-study__compare-group {
    min-width:
        0;

    border:
        1px solid
        var(--border);

    border-radius:
        10px;

    background:
        var(--surface);

    overflow:
        hidden;
}


.competitive-study__compare-group-head {
    display: flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        0.6rem;

    min-height:
        46px;

    padding:
        0.55rem
        0.65rem;

    border-bottom:
        1px solid
        var(--border);

    background:
        var(--surface-muted);
}


.competitive-study__compare-group-head strong {
    color:
        var(--text-primary);

    font-size:
        0.59rem;

    font-weight:
        800;
}


.competitive-study__compare-group-head span {
    color:
        var(--text-muted);

    font-size:
        0.47rem;

    font-weight:
        650;
}


/* =========================================================
   COMPARE LIST
   ========================================================= */

.competitive-study__compare-list {
    min-width:
        0;
}


.competitive-study__compare-item {
    min-height:
        49px;

    display: flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        0.65rem;

    padding:
        0.5rem
        0.65rem;

    border-bottom:
        1px solid
        var(--border);
}


.competitive-study__compare-item:last-child {
    border-bottom:
        0;
}


.competitive-study__compare-item > div {
    min-width:
        0;

    display: flex;

    flex-direction:
        column;

    gap:
        0.15rem;
}


.competitive-study__compare-item > div strong {
    overflow:
        hidden;

    color:
        var(--text-primary);

    font-size:
        0.55rem;

    font-weight:
        750;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;
}


.competitive-study__compare-item > div span {
    color:
        var(--text-muted);

    font-size:
        0.46rem;

    font-weight:
        600;

    font-variant-numeric:
        tabular-nums;
}


/* =========================================================
   CLOSENESS CHANGE
   ========================================================= */

.competitive-study__closeness {
    flex:
        0 0 auto;

    min-width:
        60px;

    text-align:
        right;

    font-size:
        0.53rem;

    font-weight:
        820;

    font-variant-numeric:
        tabular-nums;

    white-space:
        nowrap;
}


.competitive-study__closeness--more {
    color:
        var(--brand-green);
}


.competitive-study__closeness--less {
    color:
        #b65c5c;
}


.competitive-study__closeness--stable {
    color:
        var(--text-muted);
}


.competitive-study__compare-empty {
    padding:
        1rem;

    color:
        var(--text-muted);

    font-size:
        0.53rem;

    text-align:
        center;
}


/* =========================================================
   DETAIL ACCORDION
   ========================================================= */

.competitive-study__accordion {
    margin-top:
        0.7rem;

    border:
        1px solid
        var(--border);

    border-radius:
        10px;

    background:
        var(--surface);

    overflow:
        hidden;
}


.competitive-study__accordion-button {
    width:
        100%;

    min-height:
        48px;

    display: grid;

    grid-template-columns:
        22px
        auto
        minmax(0, 1fr);

    align-items:
        center;

    gap:
        0.45rem;

    padding:
        0.55rem
        0.7rem;

    border:
        0;

    color:
        var(--text-primary);

    background:
        var(--surface);

    font-family:
        inherit;

    text-align:
        left;

    cursor:
        pointer;

    transition:
        background-color
        var(--transition-fast);
}


.competitive-study__accordion-button:hover {
    background:
        var(--surface-muted);
}


.competitive-study__accordion-arrow {
    width:
        21px;

    height:
        21px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid
        var(--border);

    border-radius:
        6px;

    color:
        var(--text-muted);

    font-size:
        0.75rem;

    line-height:
        1;

    transition:
        transform
        var(--transition-fast);
}


.competitive-study__accordion.is-open
.competitive-study__accordion-arrow {
    transform:
        rotate(90deg);
}


.competitive-study__accordion-button strong {
    font-size:
        0.58rem;

    font-weight:
        800;
}


.competitive-study__accordion-note {
    justify-self:
        end;

    color:
        var(--text-muted);

    font-size:
        0.47rem;

    font-weight:
        600;

    text-align:
        right;
}


.competitive-study__accordion-content {
    padding:
        0.7rem;

    border-top:
        1px solid
        var(--border);

    background:
        var(--surface-muted);
}


/* =========================================================
   DETAILED TABLE
   ========================================================= */

.competitive-study__table-wrap {
    width:
        100%;

    max-width:
        100%;

    overflow:
        auto;

    border:
        1px solid
        var(--border);

    border-radius:
        8px;

    background:
        var(--surface);

    scrollbar-width:
        thin;

    scrollbar-color:
        var(--border-strong)
        transparent;
}


.competitive-study__table-wrap::-webkit-scrollbar {
    width:
        6px;

    height:
        6px;
}


.competitive-study__table-wrap::-webkit-scrollbar-track {
    background:
        transparent;
}


.competitive-study__table-wrap::-webkit-scrollbar-thumb {
    border-radius:
        999px;

    background:
        var(--border-strong);
}


.competitive-study__table {
    width:
        100%;

    min-width:
        670px;

    border-collapse:
        collapse;

    color:
        var(--text-primary);

    background:
        var(--surface);

    font-size:
        0.52rem;

    font-variant-numeric:
        tabular-nums;
}


.competitive-study__table--compare {
    min-width:
        850px;
}


.competitive-study__table--history {
    min-width:
        850px;
}


.competitive-study__table th,
.competitive-study__table td {
    padding:
        0.5rem
        0.55rem;

    border-bottom:
        1px solid
        var(--border);

    text-align:
        left;

    vertical-align:
        middle;

    white-space:
        nowrap;
}


.competitive-study__table thead th {
    position:
        sticky;

    top:
        0;

    z-index:
        3;

    color:
        var(--text-secondary);

    background:
        var(--surface-muted);

    font-size:
        0.47rem;

    font-weight:
        800;
}


.competitive-study__table tbody tr:hover {
    background:
        var(--surface-muted);
}


.competitive-study__table tbody tr:last-child td {
    border-bottom:
        0;
}


/* =========================================================
   STATUS CHIP
   ========================================================= */

.competitive-study__status {
    display:
        inline-flex;

    align-items:
        center;

    min-height:
        20px;

    padding:
        0
        0.35rem;

    border:
        1px solid
        var(--border);

    border-radius:
        999px;

    color:
        var(--text-secondary);

    background:
        var(--surface-muted);

    font-size:
        0.43rem;

    font-weight:
        750;
}


.competitive-study__status--more {
    color:
        var(--brand-green);

    border-color:
        color-mix(
            in srgb,
            var(--brand-green) 25%,
            var(--border)
        );

    background:
        var(--brand-green-soft);
}


.competitive-study__status--less {
    color:
        #b65c5c;

    border-color:
        rgba(182, 92, 92, 0.18);

    background:
        rgba(182, 92, 92, 0.06);
}


.competitive-study__status--stable {
    color:
        var(--text-muted);
}


/* =========================================================
   DEEP GEOGRAPHY HEADER
   ========================================================= */

.competitive-study__deep-head {
    display: grid;

    grid-template-columns:
        auto
        minmax(0, 1fr)
        auto;

    align-items:
        center;

    gap:
        0.7rem;

    margin-bottom:
        0.65rem;

    padding:
        0.55rem
        0.6rem;

    border:
        1px solid
        var(--border);

    border-radius:
        8px;

    background:
        var(--surface);
}


.competitive-study__back {
    min-height:
        28px;

    padding:
        0
        0.48rem;

    border:
        1px solid
        var(--border);

    border-radius:
        6px;

    color:
        var(--text-secondary);

    background:
        var(--surface);

    font-family:
        inherit;

    font-size:
        0.48rem;

    font-weight:
        700;

    cursor:
        pointer;
}


.competitive-study__back:hover {
    color:
        var(--brand-green);

    border-color:
        var(--brand-green);
}


.competitive-study__deep-context {
    min-width:
        0;

    display: flex;

    flex-direction:
        column;

    gap:
        0.1rem;
}


.competitive-study__deep-context strong {
    overflow:
        hidden;

    color:
        var(--text-primary);

    font-size:
        0.58rem;

    font-weight:
        800;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;
}


.competitive-study__deep-context span {
    color:
        var(--text-muted);

    font-size:
        0.46rem;

    line-height:
        1.3;
}


/* =========================================================
   DEEP TABS
   ========================================================= */

.competitive-study__deep-tabs {
    display:
        inline-flex;

    padding:
        2px;

    border:
        1px solid
        var(--border);

    border-radius:
        7px;

    background:
        var(--surface-muted);
}


.competitive-study__deep-tab {
    min-height:
        27px;

    padding:
        0
        0.48rem;

    border:
        0;

    border-radius:
        5px;

    color:
        var(--text-secondary);

    background:
        transparent;

    font-family:
        inherit;

    font-size:
        0.48rem;

    font-weight:
        700;

    cursor:
        pointer;
}


.competitive-study__deep-tab.is-active {
    color:
        #ffffff;

    background:
        var(--brand-green);
}


/* =========================================================
   LOWER-GEOGRAPHY WARNING
   ========================================================= */

.competitive-study__deep-warning {
    display: flex;

    flex-direction:
        column;

    gap:
        0.25rem;

    padding:
        0.7rem
        0.8rem;

    border:
        1px solid
        var(--border);

    border-left:
        3px solid
        var(--brand-green);

    border-radius:
        8px;

    background:
        var(--surface);
}


.competitive-study__deep-warning strong {
    color:
        var(--text-primary);

    font-size:
        0.56rem;

    font-weight:
        800;
}


.competitive-study__deep-warning span {
    color:
        var(--text-secondary);

    font-size:
        0.5rem;

    line-height:
        1.45;
}


/* =========================================================
   DEFINITION
   ========================================================= */

.competitive-study__definition {
    margin-top:
        0.7rem;

    padding:
        0.55rem
        0.65rem;

    border-left:
        2px solid
        var(--brand-green);

    color:
        var(--text-muted);

    background:
        var(--surface-muted);

    font-size:
        0.47rem;

    line-height:
        1.4;
}


/* =========================================================
   LEGACY / DEVELOPMENT NOTE

   If this still appears in an old local build, keep it
   visibly distinct from real analytical output.
   ========================================================= */

.competitive-study__mock-note {
    margin-top:
        0.55rem;

    padding:
        0.5rem
        0.6rem;

    border:
        1px dashed
        var(--border-strong);

    border-radius:
        7px;

    color:
        var(--text-muted);

    background:
        var(--surface-muted);

    font-size:
        0.46rem;

    line-height:
        1.4;
}


/* =========================================================
   DARK MODE
   ========================================================= */

html[data-theme="dark"]
.competitive-study__winner--jlp {
    color:
        #6fd3aa;

    border-color:
        rgba(111, 211, 170, 0.16);

    background:
        rgba(22, 135, 93, 0.14);
}


html[data-theme="dark"]
.competitive-study__winner--pnp {
    color:
        #f3a36c;

    border-color:
        rgba(243, 163, 108, 0.16);

    background:
        rgba(244, 122, 35, 0.13);
}


html[data-theme="dark"]
.competitive-study__rating--knife {
    color:
        #e99898;
}


html[data-theme="dark"]
.competitive-study__rating--very-close {
    color:
        #e5b36f;
}


html[data-theme="dark"]
.competitive-study__closeness--less,
html[data-theme="dark"]
.competitive-study__status--less {
    color:
        #db8585;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {

    .competitive-study__scope {
        grid-template-columns:
            1fr;
    }


    .competitive-study__scope-controls {
        justify-content:
            flex-start;
    }


    .competitive-study__summary {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .competitive-study__summary-card--wide {
        grid-column:
            span 2;
    }


    .competitive-study__compare-grid {
        grid-template-columns:
            1fr;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .dashboard-panel--competitive.dashboard-panel--expanded
    .competitive-study {
        padding:
            0.65rem;
    }


    .competitive-study__scope {
        padding:
            0.6rem;
    }


    .competitive-study__scope-controls {
        align-items:
            stretch;

        flex-direction:
            column;
    }


    .competitive-study__scope-group {
        width:
            100%;
    }


    .competitive-study__segmented {
        width:
            100%;
    }


    .competitive-study__scope-button {
        flex:
            1;
    }


    .competitive-study__scope-select {
        width:
            100%;
    }


    .competitive-study__scope-vs {
        align-self:
            flex-start;

        padding:
            0;
    }


    .competitive-study__intro {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            0.45rem;
    }


    .competitive-study__summary {
        grid-template-columns:
            1fr;
    }


    .competitive-study__summary-card--wide {
        grid-column:
            auto;
    }


    .competitive-study__ranking-row {
        grid-template-columns:
            27px
            minmax(0, 1fr)
            auto;

        gap:
            0.45rem;

        padding:
            0.5rem;
    }


    .competitive-study__accordion-button {
        grid-template-columns:
            22px
            minmax(0, 1fr);

        gap:
            0.4rem;
    }


    .competitive-study__accordion-note {
        grid-column:
            2;

        justify-self:
            start;

        text-align:
            left;
    }


    .competitive-study__deep-head {
        grid-template-columns:
            1fr;

        align-items:
            flex-start;
    }


    .competitive-study__deep-tabs {
        width:
            100%;
    }


    .competitive-study__deep-tab {
        flex:
            1;
    }

}