﻿:root {
    --competition-green: #5B8C3B;
    --competition-green-dark: #466f2d;
    --competition-green-soft: #edf5e8;
    --competition-text: #1f2937;
    --competition-muted: #6b7280;
    --competition-border: #e5e7eb;
    --competition-surface: #ffffff;
    --competition-page-bg: #f6f8f5;
    --competition-danger: #b42318;
    --competition-danger-soft: #fff1f0;
    --competition-warning: #9a6700;
    --competition-warning-soft: #fff8e5;
    --competition-shadow: 0 10px 28px rgba(31, 41, 55, .065);
}

.competition-page,
.competition-page * {
    box-sizing: border-box;
}

.competition-page {
    width: 100%;
    min-height: 100vh;
    padding: 22px 12px 44px;
    background: var(--competition-page-bg);
    color: var(--competition-text);
    font-family: "Tajawal", Arial, sans-serif;
}

.competition-shell {
    width: min(1320px, 100%);
    margin: 0 auto;
}

.competition-message,
.competition-empty-state {
    padding: 26px 20px;
    border: 1px solid var(--competition-border);
    border-radius: 18px;
    background: #fff;
    color: var(--competition-muted);
    text-align: center;
    font-weight: 700;
}

    .competition-message.is-error {
        border-color: #f0c9c5;
        background: #fff7f6;
        color: #9f2f24;
    }

    .competition-empty-state.small {
        padding: 16px;
        border-radius: 12px;
    }

/* ================================================================
   Social profile header
   ================================================================ */

.competition-profile-card {
    overflow: hidden;
    border: 1px solid var(--competition-border);
    border-radius: 22px;
    background: var(--competition-surface);
    box-shadow: var(--competition-shadow);
}

.competition-cover {
    position: relative;
    height: clamp(190px, 27vw, 345px);
    overflow: hidden;
    background: radial-gradient(circle at 17% 22%, rgba(91, 140, 59, .28), transparent 31%), radial-gradient(circle at 82% 72%, rgba(70, 111, 45, .20), transparent 36%), linear-gradient(135deg, #eaf2e5, #f6f8f5 52%, #e8eee5);
}

    .competition-cover.has-fallback::after {
        content: "";
        position: absolute;
        inset: 0;
        background-image: linear-gradient(rgba(255,255,255,.28) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.28) 1px, transparent 1px);
        background-size: 46px 46px;
        opacity: .36;
    }

.competition-cover-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.competition-cover-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(13, 26, 15, .34), transparent 54%);
    pointer-events: none;
}

.competition-cover-season {
    position: absolute;
    z-index: 2;
    left: 24px;
    bottom: 20px;
    display: grid;
    gap: 1px;
    min-width: 118px;
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, .62);
    border-radius: 13px;
    background: rgba(255, 255, 255, .88);
    backdrop-filter: blur(8px);
    color: var(--competition-text);
    box-shadow: 0 5px 18px rgba(0,0,0,.09);
}

    .competition-cover-season span {
        color: var(--competition-muted);
        font-size: .76rem;
        font-weight: 700;
    }

    .competition-cover-season strong {
        font-size: .98rem;
        font-weight: 900;
    }

.competition-profile-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(290px, 390px);
    gap: 28px;
    padding: 0 28px 24px;
}

.competition-profile-main {
    display: flex;
    align-items: flex-start;
    gap: 22px;
    min-width: 0;
}

.competition-logo-wrap {
    position: relative;
    z-index: 3;
    flex: 0 0 132px;
    width: 132px;
    height: 132px;
    margin-top: -58px;
    overflow: hidden;
    border: 5px solid #fff;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 10px 26px rgba(31, 41, 55, .14);
}

.competition-logo-image,
.competition-logo-fallback {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.competition-logo-image {
    object-fit: contain;
    padding: 10px;
    background: #fff;
}

.competition-logo-fallback {
    background: var(--competition-green-soft);
    color: var(--competition-green-dark);
    font-size: 2.5rem;
    font-weight: 900;
}

.competition-heading {
    min-width: 0;
    padding-top: 18px;
}

.competition-name-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

    .competition-name-row h1 {
        margin: 0;
        color: var(--competition-text);
        font-size: clamp(1.55rem, 2.4vw, 2.25rem);
        line-height: 1.3;
        font-weight: 900;
    }

.competition-status,
.fixture-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 29px;
    padding: 5px 10px;
    border-radius: 999px;
    background: #f3f4f6;
    color: #4b5563;
    font-size: .75rem;
    font-weight: 800;
    white-space: nowrap;
}

    .competition-status.is-ongoing,
    .fixture-status.is-live {
        background: #fff0ef;
        color: #b42318;
    }

    .competition-status.is-completed,
    .fixture-status.is-finished {
        background: var(--competition-green-soft);
        color: var(--competition-green-dark);
    }

    .competition-status.is-suspended,
    .competition-status.is-cancelled,
    .fixture-status.is-problem {
        background: var(--competition-warning-soft);
        color: var(--competition-warning);
    }

.competition-season-line {
    margin-top: 4px;
    color: var(--competition-muted);
    font-size: 1rem;
    font-weight: 800;
}

.competition-essential-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 16px;
}

.competition-meta-item,
.competition-meta-link {
    display: grid;
    gap: 2px;
    min-width: 132px;
    padding: 9px 12px;
    border: 1px solid var(--competition-border);
    border-radius: 11px;
    background: #fbfcfb;
    color: inherit;
    text-decoration: none;
}

    .competition-meta-link:hover {
        border-color: #b7caa9;
        background: #f8fbf6;
        color: var(--competition-green-dark);
    }

    .competition-meta-item span,
    .competition-meta-link span {
        color: var(--competition-muted);
        font-size: .72rem;
        font-weight: 700;
    }

    .competition-meta-item strong,
    .competition-meta-link strong {
        color: var(--competition-text);
        font-size: .86rem;
        font-weight: 900;
    }

.competition-managers-area {
    align-self: end;
    padding-top: 18px;
}

.competition-manager-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 9px;
}

    .competition-manager-heading span {
        color: var(--competition-muted);
        font-size: .76rem;
        font-weight: 700;
    }

    .competition-manager-heading strong {
        font-size: .92rem;
        font-weight: 900;
    }

.competition-manager-list {
    display: grid;
    gap: 8px;
}

.competition-manager-card {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid var(--competition-border);
    border-radius: 13px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

    .competition-manager-card:not(.is-static):hover {
        border-color: #b8cba9;
        transform: translateY(-1px);
        box-shadow: 0 7px 18px rgba(31,41,55,.07);
        color: inherit;
    }

.competition-manager-photo {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    overflow: hidden;
    border: 1px solid #dce7d7;
    border-radius: 50%;
    background: var(--competition-green-soft);
}

    .competition-manager-photo img,
    .competition-manager-fallback {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .competition-manager-photo img {
        object-fit: cover;
    }

.competition-manager-fallback {
    color: var(--competition-green-dark);
    font-size: 1rem;
    font-weight: 900;
}

.competition-manager-copy {
    display: grid;
    min-width: 0;
}

    .competition-manager-copy small {
        color: var(--competition-muted);
        font-size: .69rem;
        font-weight: 700;
    }

    .competition-manager-copy strong {
        overflow: hidden;
        color: var(--competition-text);
        font-size: .86rem;
        font-weight: 900;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.competition-manager-empty {
    padding: 11px 12px;
    border: 1px dashed #d7dfd3;
    border-radius: 12px;
    color: var(--competition-muted);
    font-size: .8rem;
    font-weight: 700;
}

.competition-statistics-bar {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    border-top: 1px solid var(--competition-border);
    background: #fcfdfc;
}

.competition-stat-item {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 2px;
    padding: 16px 10px;
    text-align: center;
}

    .competition-stat-item + .competition-stat-item::before {
        content: "";
        position: absolute;
        inset-block: 15px;
        right: 0;
        width: 1px;
        background: var(--competition-border);
    }

    .competition-stat-item strong {
        color: var(--competition-green-dark);
        font-size: 1.25rem;
        font-weight: 900;
    }

    .competition-stat-item span {
        color: var(--competition-muted);
        font-size: .78rem;
        font-weight: 700;
    }

/* ================================================================
   Tabs
   ================================================================ */

.competition-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px;
    margin-top: 16px;
    padding: 6px;
    border: 1px solid var(--competition-border);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 7px 20px rgba(31,41,55,.04);
}

.competition-tab-button {
    min-height: 46px;
    padding: 9px 12px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #4b5563;
    font-family: inherit;
    font-size: .9rem;
    font-weight: 900;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}

    .competition-tab-button:hover {
        background: #f6f8f5;
    }

    .competition-tab-button.is-active {
        background: var(--competition-green-soft);
        color: var(--competition-green-dark);
        box-shadow: inset 0 0 0 1px #cfdfc5;
    }

.competition-tab-panels {
    margin-top: 14px;
}

.competition-tab-panel {
    display: grid;
    gap: 14px;
}

    .competition-tab-panel[hidden] {
        display: none !important;
    }

.competition-info-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(250px, .7fr);
    gap: 14px;
}

.competition-content-card {
    padding: 20px;
    border: 1px solid var(--competition-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 7px 20px rgba(31,41,55,.04);
}

.competition-section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

    .competition-section-heading.compact {
        margin-bottom: 10px;
    }

    .competition-section-heading span {
        display: block;
        margin-bottom: 2px;
        color: var(--competition-green-dark);
        font-size: .72rem;
        font-weight: 800;
    }

    .competition-section-heading h2 {
        margin: 0;
        color: var(--competition-text);
        font-size: 1.08rem;
        font-weight: 900;
    }

    .competition-section-heading p {
        margin: 4px 0 0;
        color: var(--competition-muted);
        font-size: .8rem;
        font-weight: 600;
    }

.competition-inline-tab-link {
    min-height: 36px;
    padding: 7px 11px;
    border: 1px solid #cbdac2;
    border-radius: 9px;
    background: #fff;
    color: var(--competition-green-dark);
    font-family: inherit;
    font-size: .76rem;
    font-weight: 900;
    cursor: pointer;
}

    .competition-inline-tab-link:hover {
        background: var(--competition-green-soft);
    }

.competition-facts-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .competition-facts-list li {
        display: grid;
        grid-template-columns: 9px minmax(0, 1fr);
        gap: 12px;
        padding: 13px 0;
        border-bottom: 1px solid #eef1ec;
    }

        .competition-facts-list li:last-child {
            border-bottom: 0;
        }

.fact-dot {
    width: 8px;
    height: 8px;
    margin-top: 7px;
    border-radius: 50%;
    background: var(--competition-green);
    box-shadow: 0 0 0 4px var(--competition-green-soft);
}

.competition-facts-list strong {
    display: block;
    margin-bottom: 3px;
    font-size: .88rem;
    font-weight: 900;
}

.competition-facts-list p {
    margin: 0;
    color: var(--competition-muted);
    font-size: .82rem;
    line-height: 1.8;
    font-weight: 600;
}

.competition-facts-list a,
.fixture-venue a,
.fixture-referees a,
.scorer-club-name {
    color: var(--competition-green-dark);
    text-decoration: none;
    font-weight: 800;
}

    .competition-facts-list a:hover,
    .fixture-venue a:hover,
    .fixture-referees a:hover,
    .scorer-club-name:not(.is-static):hover {
        text-decoration: underline;
    }

.competition-live-summary {
    min-height: 100%;
}

.competition-current-fixture {
    display: block;
    padding: 16px;
    border-radius: 12px;
    background: var(--competition-green-soft);
    color: var(--competition-green-dark);
    font-size: 1rem;
    line-height: 1.55;
    text-align: center;
    font-weight: 900;
}

.competition-current-fixture-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin-top: 10px;
}

    .competition-current-fixture-stats span {
        display: grid;
        justify-items: center;
        gap: 1px;
        padding: 9px 5px;
        border: 1px solid var(--competition-border);
        border-radius: 10px;
        color: var(--competition-muted);
        font-size: .69rem;
        font-weight: 700;
    }

    .competition-current-fixture-stats b {
        color: var(--competition-text);
        font-size: .95rem;
        font-weight: 900;
    }

/* ================================================================
   Tables
   ================================================================ */

.competition-table-group + .competition-table-group {
    margin-top: 18px;
}

.competition-table-group > h3 {
    margin: 0 0 8px;
    color: var(--competition-text);
    font-size: .9rem;
    font-weight: 900;
}

.competition-table-scroll {
    overflow-x: auto;
    border: 1px solid var(--competition-border);
    border-radius: 13px;
    background: #fff;
}

.competition-table {
    width: 100%;
    min-width: 650px;
    border-collapse: collapse;
    font-size: .79rem;
}

    .competition-table.is-detailed {
        min-width: 1060px;
    }

    .competition-table th,
    .competition-table td {
        padding: 11px 10px;
        border-bottom: 1px solid #edf0eb;
        text-align: center;
        vertical-align: middle;
        white-space: nowrap;
    }

    .competition-table th {
        background: #f8faf7;
        color: #59635a;
        font-size: .72rem;
        font-weight: 900;
    }

    .competition-table tbody tr:last-child td {
        border-bottom: 0;
    }

    .competition-table tbody tr:hover td {
        background: #fbfdf9;
    }

    .competition-table .club-column {
        min-width: 210px;
        text-align: right;
    }

.rank-cell {
    color: var(--competition-muted);
    font-weight: 900;
}

.points-cell {
    color: var(--competition-green-dark);
    font-weight: 900;
}

.positive-number {
    color: #157347;
    font-weight: 900;
}

.negative-number {
    color: #b42318;
    font-weight: 900;
}

.table-club-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    max-width: 100%;
    color: var(--competition-text);
    text-decoration: none;
}

    .table-club-link:hover {
        color: var(--competition-green-dark);
    }

.table-club-logo,
.next-opponent-link,
.next-opponent-fallback {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    overflow: hidden;
    border: 1px solid #dde5d9;
    border-radius: 50%;
    background: #fff;
}

    .table-club-logo img,
    .next-opponent-link img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 3px;
    }

.table-logo-fallback,
.next-opponent-fallback {
    width: 100%;
    height: 100%;
    border: 0;
    background: var(--competition-green-soft);
    color: var(--competition-green-dark);
    font-size: .75rem;
    font-weight: 900;
}

.next-opponent-link {
    transition: transform .15s ease, border-color .15s ease;
}

    .next-opponent-link:hover {
        transform: scale(1.06);
        border-color: var(--competition-green);
    }

.table-dash {
    color: #a0a7a0;
}

/* ================================================================
   Top scorers
   ================================================================ */

.competition-scorers-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.competition-scorer-card {
    padding: 12px;
    border: 1px solid var(--competition-border);
    border-radius: 13px;
    background: #fcfdfc;
}

.scorer-profile-link {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

    .scorer-profile-link:not(.is-static):hover strong {
        color: var(--competition-green-dark);
    }

.scorer-photo {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    overflow: hidden;
    border-radius: 50%;
    background: var(--competition-green-soft);
}

    .scorer-photo img,
    .scorer-fallback {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .scorer-photo img {
        object-fit: cover;
    }

.scorer-fallback {
    color: var(--competition-green-dark);
    font-weight: 900;
}

.scorer-main-copy {
    display: grid;
    min-width: 0;
}

    .scorer-main-copy small {
        color: var(--competition-green-dark);
        font-size: .69rem;
        font-weight: 900;
    }

    .scorer-main-copy strong {
        overflow: hidden;
        font-size: .84rem;
        font-weight: 900;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.scorer-club-name {
    display: block;
    overflow: hidden;
    margin-top: 8px;
    font-size: .72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.scorer-numbers {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
    margin-top: 9px;
}

    .scorer-numbers span {
        display: grid;
        justify-items: center;
        padding: 6px 3px;
        border-radius: 8px;
        background: #f1f4ef;
        color: var(--competition-muted);
        font-size: .62rem;
        font-weight: 700;
    }

    .scorer-numbers b {
        color: var(--competition-text);
        font-size: .82rem;
        font-weight: 900;
    }

/* ================================================================
   Fixtures
   ================================================================ */

.fixtures-heading {
    align-items: center;
}

.fixture-visible-count {
    display: grid;
    justify-items: center;
    min-width: 78px;
    padding: 7px 11px;
    border: 1px solid #dce6d7;
    border-radius: 11px;
    background: var(--competition-green-soft);
}

    .fixture-visible-count strong {
        color: var(--competition-green-dark);
        font-size: 1rem;
        font-weight: 900;
    }

    .fixture-visible-count span {
        margin: 0;
        color: var(--competition-muted);
        font-size: .66rem;
    }

.fixture-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 9px;
    padding: 12px;
    margin-bottom: 14px;
    border: 1px solid #e2e8df;
    border-radius: 13px;
    background: #f8faf7;
}

.fixture-filter-control {
    display: grid;
    gap: 4px;
}

    .fixture-filter-control > span {
        color: var(--competition-muted);
        font-size: .69rem;
        font-weight: 800;
    }

    .fixture-filter-control input,
    .fixture-filter-control select {
        width: 100%;
        min-height: 39px;
        padding: 7px 10px;
        border: 1px solid #d9e0d5;
        border-radius: 9px;
        outline: none;
        background: #fff;
        color: var(--competition-text);
        font-family: inherit;
        font-size: .78rem;
        font-weight: 700;
    }

        .fixture-filter-control input:focus,
        .fixture-filter-control select:focus {
            border-color: #98b786;
            box-shadow: 0 0 0 3px rgba(91,140,59,.10);
        }

.fixture-reset-button {
    align-self: end;
    min-height: 39px;
    padding: 7px 13px;
    border: 1px solid #cad6c3;
    border-radius: 9px;
    background: #fff;
    color: var(--competition-green-dark);
    font-family: inherit;
    font-size: .75rem;
    font-weight: 900;
    cursor: pointer;
}

    .fixture-reset-button:hover {
        background: var(--competition-green-soft);
    }

/* Fixture grouping: dbo.Fixtures -> Matches.FixtureID */
.competition-fixture-groups {
    display: grid;
    gap: 16px;
}

.competition-fixture-group {
    overflow: hidden;
    border: 1px solid #dfe7db;
    border-radius: 16px;
    background: #fbfcfa;
    box-shadow: 0 5px 16px rgba(31, 41, 55, .035);
}

    .competition-fixture-group[hidden] {
        display: none !important;
    }

.competition-fixture-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border-bottom: 1px solid #e7ece4;
    background: linear-gradient( 135deg, rgba(237, 245, 232, .96), rgba(255, 255, 255, .96));
}

.competition-fixture-group-title {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    min-width: 0;
}

.competition-fixture-group-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d6e3cf;
    border-radius: 11px;
    background: #fff;
    font-size: 1rem;
}

.competition-fixture-group-title > div {
    min-width: 0;
}

.competition-fixture-group-eyebrow {
    display: block;
    margin-bottom: 2px;
    color: var(--competition-green-dark);
    font-size: .68rem;
    font-weight: 900;
}

.competition-fixture-group-title h3 {
    margin: 0;
    color: var(--competition-text);
    font-size: 1rem;
    line-height: 1.4;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.competition-fixture-group-title p {
    margin: 2px 0 0;
    color: var(--competition-muted);
    font-size: .72rem;
    font-weight: 700;
}

.competition-fixture-group-title small {
    display: block;
    margin-top: 5px;
    color: #64705f;
    font-size: .69rem;
    font-weight: 700;
}

.competition-fixture-group-summary {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 7px;
    flex: 0 0 auto;
}

.fixture-group-status,
.fixture-group-match-count,
.fixture-group-live-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 29px;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 900;
    white-space: nowrap;
}

.fixture-group-status {
    background: #f3f4f6;
    color: #4b5563;
}

    .fixture-group-status.is-scheduled {
        background: #eef5ff;
        color: #315b8a;
    }

    .fixture-group-status.is-ongoing {
        background: #fff0ef;
        color: #b42318;
    }

    .fixture-group-status.is-completed {
        background: var(--competition-green-soft);
        color: var(--competition-green-dark);
    }

    .fixture-group-status.is-not-completed,
    .fixture-group-status.is-postponed {
        background: var(--competition-warning-soft);
        color: var(--competition-warning);
    }

    .fixture-group-status.is-unassigned {
        background: #f3f4f6;
        color: #6b7280;
    }

.fixture-group-match-count {
    gap: 4px;
    border: 1px solid #dce5d8;
    background: #fff;
    color: var(--competition-muted);
}

    .fixture-group-match-count strong {
        color: var(--competition-text);
        font-size: .78rem;
    }

.fixture-group-live-count {
    background: #fff0ef;
    color: #b42318;
}

.competition-fixture-group-note {
    padding: 9px 16px;
    border-bottom: 1px solid #edf0eb;
    background: #fffdf7;
    color: #6f6040;
    font-size: .74rem;
    line-height: 1.7;
    font-weight: 700;
}

.competition-fixture-group-matches {
    padding: 11px;
}

    .competition-fixture-group-matches .fixtures-list {
        gap: 9px;
    }

.fixture-group-empty {
    padding: 18px 14px;
    border: 1px dashed #d9e1d5;
    border-radius: 12px;
    background: #fff;
    color: var(--competition-muted);
    text-align: center;
    font-size: .78rem;
    font-weight: 700;
}

.competition-fixture-group.is-ongoing {
    border-color: #efc7c2;
}

    .competition-fixture-group.is-ongoing .competition-fixture-group-header {
        background: linear-gradient( 135deg, rgba(255, 240, 239, .95), rgba(255, 255, 255, .96));
    }

.competition-fixture-group.is-unassigned {
    border-style: dashed;
    background: #fafafa;
}

.fixtures-list {
    display: grid;
    gap: 10px;
}

.fixture-card {
    overflow: hidden;
    border: 1px solid var(--competition-border);
    border-radius: 14px;
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease;
}

    .fixture-card:hover {
        border-color: #ccd9c5;
        box-shadow: 0 7px 18px rgba(31,41,55,.05);
    }

    .fixture-card.is-live {
        border-right: 4px solid #d92d20;
    }

.fixture-card-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 13px;
    border-bottom: 1px solid #edf0eb;
    background: #fafbfa;
}

.fixture-context {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

    .fixture-context strong {
        font-size: .72rem;
        font-weight: 900;
    }

    .fixture-context span {
        color: var(--competition-muted);
        font-size: .69rem;
        font-weight: 700;
    }

.fixture-match-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 130px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
}

.fixture-team-link {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: var(--competition-text);
    text-decoration: none;
}

.fixture-team.home-team .fixture-team-link {
    justify-content: flex-start;
}

.fixture-team.away-team .fixture-team-link {
    justify-content: flex-end;
}

.fixture-team-link:not(.is-static):hover strong {
    color: var(--competition-green-dark);
}

.fixture-team-link strong {
    overflow: hidden;
    font-size: .86rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fixture-team-logo {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid #dde5d9;
    border-radius: 50%;
    background: #fff;
}

    .fixture-team-logo img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 4px;
    }

    .fixture-team-logo > span {
        color: var(--competition-green-dark);
        font-size: .9rem;
        font-weight: 900;
    }

.fixture-score-link {
    display: grid;
    justify-items: center;
    gap: 2px;
    min-width: 0;
    padding: 7px 8px;
    border-radius: 10px;
    background: #f5f7f4;
    color: var(--competition-text);
    text-decoration: none;
}

    .fixture-score-link:hover {
        background: var(--competition-green-soft);
        color: var(--competition-green-dark);
    }

    .fixture-score-link strong {
        font-size: 1.14rem;
        font-weight: 900;
    }

    .fixture-score-link small {
        color: var(--competition-muted);
        font-size: .62rem;
        font-weight: 700;
    }

.fixture-card-footer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 16px;
    min-height: 42px;
    padding: 9px 13px;
    border-top: 1px solid #edf0eb;
    background: #fcfdfc;
    color: var(--competition-muted);
    font-size: .71rem;
    font-weight: 700;
}

.fixture-referees {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px 9px;
}

.fixture-details-link {
    margin-right: auto;
    color: var(--competition-green-dark);
    text-decoration: none;
    font-weight: 900;
}

    .fixture-details-link:hover {
        text-decoration: underline;
    }

/* ================================================================
   Seasons
   ================================================================ */

.competition-seasons-list {
    display: grid;
    gap: 14px;
}

.competition-season-card {
    overflow: hidden;
    border: 1px solid var(--competition-border);
    border-radius: 15px;
    background: #fff;
}

    .competition-season-card.is-current {
        border-color: #bfd2b2;
        box-shadow: inset 4px 0 0 var(--competition-green);
    }

.season-card-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
    gap: 14px;
    align-items: center;
    padding: 14px;
    border-bottom: 1px solid #edf0eb;
    background: #fafbfa;
}

.season-title-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

    .season-title-group span {
        display: block;
        color: var(--competition-muted);
        font-size: .68rem;
        font-weight: 700;
    }

    .season-title-group h3 {
        margin: 2px 0 0;
        font-size: 1rem;
        font-weight: 900;
    }

.season-page-link {
    padding: 6px 10px;
    border: 1px solid #cad8c2;
    border-radius: 8px;
    color: var(--competition-green-dark);
    text-decoration: none;
    font-size: .69rem;
    font-weight: 900;
}

    .season-page-link:hover {
        background: var(--competition-green-soft);
    }

.season-winner-card {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 220px;
    padding: 8px 10px;
    border: 1px solid #d5e1cf;
    border-radius: 11px;
    background: var(--competition-green-soft);
    color: inherit;
    text-decoration: none;
}

    .season-winner-card:hover {
        color: var(--competition-green-dark);
    }

    .season-winner-card.is-pending {
        background: #f7f7f7;
        color: var(--competition-muted);
    }

.season-winner-label {
    color: var(--competition-green-dark);
    font-size: .64rem;
    font-weight: 900;
}

.season-winner-logo {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid #cad8c2;
    border-radius: 50%;
    background: #fff;
}

    .season-winner-logo img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 3px;
    }

    .season-winner-logo > span {
        color: var(--competition-green-dark);
        font-weight: 900;
    }

.season-winner-card strong {
    overflow: hidden;
    font-size: .79rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.season-table {
    min-width: 760px;
}

.is-winner-row td {
    background: #f5faf2 !important;
}

.winner-inline-label {
    display: inline-flex;
    margin-right: 6px;
    padding: 2px 6px;
    border-radius: 999px;
    background: #deeed5;
    color: var(--competition-green-dark);
    font-size: .6rem;
    font-weight: 900;
}

/* ================================================================
   Responsive
   ================================================================ */

@media (max-width: 1050px) {
    .competition-profile-body {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .competition-managers-area {
        padding-top: 0;
    }

    .competition-manager-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .competition-info-grid {
        grid-template-columns: 1fr;
    }

    .competition-scorers-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .competition-page {
        padding-inline: 8px;
    }

    .competition-profile-card,
    .competition-content-card {
        border-radius: 16px;
    }

    .competition-cover {
        height: 210px;
    }

    .competition-profile-body {
        padding: 0 16px 18px;
    }

    .competition-logo-wrap {
        flex-basis: 96px;
        width: 96px;
        height: 96px;
        margin-top: -42px;
        border-width: 4px;
    }

    .competition-profile-main {
        gap: 13px;
    }

    .competition-heading {
        padding-top: 12px;
    }

    .competition-statistics-bar {
        grid-template-columns: repeat(3, 1fr);
    }

    .competition-stat-item + .competition-stat-item::before {
        display: none;
    }

    .competition-stat-item:nth-child(n+4) {
        border-top: 1px solid var(--competition-border);
    }

    .competition-tabs {
        display: flex;
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .competition-tab-button {
        flex: 0 0 auto;
        min-width: 135px;
    }

    .fixture-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .fixture-reset-button {
        grid-column: span 2;
    }

    .fixture-match-row {
        grid-template-columns: minmax(0, 1fr) 92px minmax(0, 1fr);
        gap: 7px;
        padding-inline: 10px;
    }

    .fixture-team-logo {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
    }

    .fixture-team-link {
        gap: 6px;
    }

        .fixture-team-link strong {
            font-size: .75rem;
        }

    .competition-scorers-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .season-card-header {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .competition-page {
        padding-top: 10px;
    }

    .competition-cover {
        height: 170px;
    }

    .competition-cover-season {
        left: 12px;
        bottom: 10px;
        min-width: 94px;
        padding: 7px 10px;
    }

    .competition-profile-main {
        display: block;
    }

    .competition-logo-wrap {
        width: 86px;
        height: 86px;
        margin-top: -38px;
    }

    .competition-heading {
        padding-top: 8px;
    }

    .competition-name-row {
        margin-top: 4px;
    }

        .competition-name-row h1 {
            font-size: 1.35rem;
        }

    .competition-essential-meta {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .competition-meta-link:first-child,
    .competition-meta-item:first-child {
        grid-column: 1 / -1;
    }

    .competition-manager-list {
        grid-template-columns: 1fr;
    }

    .competition-statistics-bar {
        grid-template-columns: repeat(2, 1fr);
    }

    .competition-stat-item:nth-child(n+3) {
        border-top: 1px solid var(--competition-border);
    }

    .competition-stat-item:last-child {
        grid-column: 1 / -1;
    }

    .competition-content-card {
        padding: 14px 10px;
    }

    .competition-section-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .competition-inline-tab-link {
        align-self: flex-start;
    }

    .fixture-filters {
        grid-template-columns: 1fr;
    }

    .fixture-reset-button {
        grid-column: auto;
    }

    .fixture-card-topline {
        align-items: flex-start;
    }

    .fixture-match-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .fixture-team.home-team .fixture-team-link,
    .fixture-team.away-team .fixture-team-link {
        justify-content: center;
    }

    .fixture-team.home-team .fixture-team-link {
        flex-direction: row-reverse;
    }

    .fixture-score-link {
        width: 120px;
        margin: 0 auto;
    }

    .fixture-card-footer {
        display: grid;
        gap: 8px;
    }

    .fixture-details-link {
        margin-right: 0;
    }

    .competition-scorers-grid {
        grid-template-columns: 1fr;
    }

    .season-title-group {
        align-items: flex-start;
        flex-direction: column;
    }

    .season-winner-card {
        min-width: 0;
    }
}


/* ================================================================
   2026-09-18 Profile refinement
   Winner banner + Association logo + sketch-based lower profile row
   ================================================================ */

.competition-profile-sketch {
    overflow: visible;
}

    .competition-profile-sketch .competition-cover {
        height: clamp(220px, 29vw, 365px);
        border-radius: 22px 22px 0 0;
    }

    .competition-profile-sketch .competition-cover-image {
        object-position: center center;
    }

    .competition-profile-sketch .competition-cover-shade {
        background: linear-gradient(to top, rgba(13, 26, 15, .18), transparent 52%);
    }

.competition-profile-lower {
    position: relative;
    display: grid;
    grid-template-columns: minmax(190px, .72fr) minmax(0, 1.9fr) 168px;
    align-items: end;
    gap: 18px;
    min-height: 182px;
    padding: 18px 24px 20px;
    background: #fff;
}

.competition-profile-center {
    min-width: 0;
    display: grid;
    gap: 14px;
}

.competition-profile-sketch .competition-heading {
    padding: 0;
}

    .competition-profile-sketch .competition-heading h1 {
        margin: 0;
        color: var(--competition-text);
        font-size: clamp(1.5rem, 2.5vw, 2.2rem);
        font-weight: 900;
        line-height: 1.25;
    }

.competition-profile-sketch .competition-season-line {
    margin-top: 4px;
    color: var(--competition-muted);
    font-size: .88rem;
    font-weight: 700;
}

    .competition-profile-sketch .competition-season-line strong {
        color: #3b4639;
        font-weight: 900;
    }

.competition-organizer-link {
    display: inline-flex;
    width: fit-content;
    margin-top: 3px;
    color: var(--competition-green-dark);
    font-size: .83rem;
    font-weight: 900;
    text-decoration: none;
}

    .competition-organizer-link:not(.is-static):hover {
        text-decoration: underline;
    }

.competition-essential-dates {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 8px;
}

    .competition-essential-dates > span {
        min-width: 128px;
        padding: 7px 10px;
        border: 1px solid var(--competition-border);
        border-radius: 9px;
        background: #fbfcfb;
    }

    .competition-essential-dates small,
    .competition-essential-dates strong {
        display: block;
    }

    .competition-essential-dates small {
        color: var(--competition-muted);
        font-size: .62rem;
        font-weight: 700;
    }

    .competition-essential-dates strong {
        margin-top: 1px;
        color: var(--competition-text);
        font-size: .75rem;
        font-weight: 900;
    }

.competition-profile-sketch .competition-logo-wrap {
    position: relative;
    z-index: 6;
    align-self: start;
    width: 168px;
    height: 168px;
    margin-top: -92px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 6px solid #fff;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 14px 34px rgba(31,41,55,.16);
    color: inherit;
    text-decoration: none;
}

.competition-profile-sketch .competition-logo-image {
    padding: 15px;
    object-fit: contain;
}

.competition-profile-sketch .competition-statistics-bar {
    overflow: hidden;
    border: 1px solid #dce6d7;
    border-radius: 13px;
    background: linear-gradient(180deg, #fff, #f8fbf6);
    box-shadow: 0 5px 15px rgba(31,41,55,.04);
}

.competition-profile-sketch .competition-stat-item {
    padding: 10px 7px;
}

    .competition-profile-sketch .competition-stat-item strong {
        font-size: 1.02rem;
    }

    .competition-profile-sketch .competition-stat-item span {
        font-size: .65rem;
    }

/* Competition managers: compact horizontal slider */

.competition-profile-sketch .competition-managers-area {
    align-self: end;
    min-width: 0;
    padding: 0;
}

.competition-profile-sketch .competition-manager-heading {
    display: grid;
    justify-content: start;
    gap: 0;
    margin-bottom: 7px;
}

    .competition-profile-sketch .competition-manager-heading span {
        font-size: .59rem;
    }

    .competition-profile-sketch .competition-manager-heading strong {
        font-size: .78rem;
    }

.competition-manager-slider {
    direction: ltr;
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr) 25px;
    align-items: center;
    gap: 5px;
}

.competition-manager-viewport {
    min-width: 0;
    overflow: hidden;
}

.competition-manager-track {
    display: flex;
    width: 100%;
    transition: transform .38s ease;
    will-change: transform;
}

.competition-profile-sketch .competition-manager-card {
    direction: rtl;
    flex: 0 0 100%;
    width: 100%;
    min-width: 0;
    padding: 7px;
    gap: 7px;
    border-radius: 11px;
}

.competition-profile-sketch .competition-manager-photo {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
}

.competition-profile-sketch .competition-manager-copy small {
    font-size: .58rem;
}

.competition-profile-sketch .competition-manager-copy strong {
    font-size: .73rem;
}

.competition-manager-nav {
    width: 25px;
    height: 25px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 1px solid #dce5d8;
    border-radius: 50%;
    background: #fff;
    color: var(--competition-green-dark);
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

    .competition-manager-nav:hover {
        background: var(--competition-green-soft);
    }

.competition-manager-dots {
    direction: ltr;
    min-height: 12px;
    margin-top: 5px;
    display: flex;
    justify-content: center;
    gap: 4px;
}

.competition-manager-dot {
    width: 5px;
    height: 5px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #cfd7cb;
}

    .competition-manager-dot.is-active {
        width: 14px;
        border-radius: 999px;
        background: var(--competition-green);
    }

/* ================================================================
   Merged quick/current overview
   ================================================================ */

.competition-current-overview-card {
    background: radial-gradient(circle at 95% 0%, rgba(91,140,59,.07), transparent 18rem), #fff;
}

.competition-overview-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
}

.competition-overview-item {
    min-width: 0;
    min-height: 84px;
    padding: 11px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 1px solid #e2e8df;
    border-radius: 12px;
    background: linear-gradient(180deg, #fff, #fafcf9);
}

    .competition-overview-item > small {
        color: var(--competition-muted);
        font-size: .67rem;
        font-weight: 700;
    }

    .competition-overview-item > strong,
    .competition-overview-item > a:not(.competition-overview-person-link) {
        margin-top: 4px;
        overflow: hidden;
        color: #2e3b2a;
        font-size: .82rem;
        font-weight: 900;
        text-decoration: none;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        .competition-overview-item > a:not(.competition-overview-person-link):hover {
            color: var(--competition-green-dark);
            text-decoration: underline;
        }

.competition-overview-person-link {
    min-width: 0;
    margin-top: 5px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    color: inherit;
    text-decoration: none;
}

    .competition-overview-person-link.is-static {
        cursor: default;
    }

.competition-overview-avatar {
    width: 34px;
    height: 34px;
    overflow: hidden;
    display: grid;
    place-items: center;
    border: 1px solid #dbe5d6;
    border-radius: 50%;
    background: var(--competition-green-soft);
    color: var(--competition-green-dark);
    font-size: .72rem;
    font-weight: 900;
}

    .competition-overview-avatar.is-club {
        border-radius: 9px;
        background: #fff;
    }

    .competition-overview-avatar img,
    .competition-overview-avatar > span {
        width: 100%;
        height: 100%;
    }

    .competition-overview-avatar img {
        object-fit: contain;
        padding: 2px;
    }

    .competition-overview-avatar:not(.is-club) img {
        object-fit: cover;
        padding: 0;
    }

    .competition-overview-avatar > span {
        display: grid;
        place-items: center;
    }

.competition-overview-person-link strong {
    min-width: 0;
    overflow: hidden;
    color: #2f3d2b;
    font-size: .76rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.competition-overview-person-link em {
    color: var(--competition-green-dark);
    font-size: .62rem;
    font-style: normal;
    font-weight: 900;
    white-space: nowrap;
}

.competition-overview-item.is-number strong {
    color: var(--competition-green-dark);
    font-size: 1.18rem;
}

.competition-overview-item.is-stage {
    border-color: #d8e5d1;
    background: #f6faf3;
}

/* ================================================================
   Season dropdown / one season at a time
   ================================================================ */

.season-section-heading {
    align-items: end;
}

.competition-season-selector {
    min-width: 220px;
    display: grid;
    gap: 4px;
}

    .competition-season-selector > span {
        margin: 0;
        color: var(--competition-muted);
        font-size: .65rem;
        font-weight: 800;
    }

    .competition-season-selector select {
        width: 100%;
        min-height: 40px;
        padding: 7px 10px;
        border: 1px solid #d6e2d0;
        border-radius: 10px;
        outline: 0;
        background: #fff;
        color: var(--competition-text);
        font-family: inherit;
        font-size: .78rem;
        font-weight: 800;
    }

        .competition-season-selector select:focus {
            border-color: var(--competition-green);
            box-shadow: 0 0 0 3px rgba(91,140,59,.09);
        }

.competition-season-single-view {
    display: block;
}

    .competition-season-single-view .competition-season-card[hidden] {
        display: none !important;
    }

@media (max-width: 1050px) {
    .competition-profile-lower {
        grid-template-columns: minmax(170px, .68fr) minmax(0, 1.8fr) 135px;
        gap: 14px;
    }

    .competition-profile-sketch .competition-logo-wrap {
        width: 135px;
        height: 135px;
        margin-top: -72px;
    }

    .competition-overview-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .competition-profile-lower {
        grid-template-columns: 1fr 112px;
        align-items: start;
        padding: 16px;
    }

    .competition-profile-center {
        grid-column: 1;
        grid-row: 1;
    }

    .competition-profile-sketch .competition-logo-wrap {
        grid-column: 2;
        grid-row: 1;
        width: 112px;
        height: 112px;
        margin-top: -64px;
    }

    .competition-profile-sketch .competition-managers-area {
        grid-column: 1 / -1;
        grid-row: 2;
        width: min(300px, 100%);
    }

    .competition-profile-sketch .competition-statistics-bar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .competition-profile-sketch .competition-stat-item:nth-child(n+4) {
        border-top: 1px solid var(--competition-border);
    }

    .competition-overview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .competition-profile-sketch .competition-cover {
        height: 175px;
    }

    .competition-profile-lower {
        grid-template-columns: 1fr 86px;
        gap: 10px;
        min-height: 0;
        padding: 12px;
    }

    .competition-profile-sketch .competition-logo-wrap {
        width: 86px;
        height: 86px;
        margin-top: -49px;
        border-width: 4px;
    }

    .competition-profile-sketch .competition-logo-image {
        padding: 8px;
    }

    .competition-profile-sketch .competition-heading h1 {
        font-size: 1.22rem;
    }

    .competition-essential-dates {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

        .competition-essential-dates > span {
            min-width: 0;
        }

    .competition-profile-sketch .competition-statistics-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .competition-profile-sketch .competition-stat-item:last-child {
        grid-column: auto;
    }

    .competition-overview-grid {
        grid-template-columns: 1fr;
    }

    .season-section-heading {
        align-items: stretch;
    }

    .competition-season-selector {
        min-width: 0;
        width: 100%;
    }
}

/* =========================================================
   CompetitionDetails 2026-09-18 layout refinement
   Sketch-based profile header adjustments
   ========================================================= */

.competition-page[dir="rtl"] .competition-profile-sketch,
.competition-page[dir="ltr"] .competition-profile-sketch {
    padding: 0;
    overflow: visible;
}

.competition-profile-sketch .competition-cover {
    position: relative;
    min-height: 320px;
    border-radius: 2rem;
    overflow: hidden;
    margin-bottom: 1.1rem;
    background: linear-gradient(135deg, #eff4ea 0%, #dfe8d4 100%);
}

.competition-profile-sketch .competition-cover-copy {
    position: absolute;
    inset-inline-start: 2.3rem;
    inset-inline-end: 2.3rem;
    inset-block-end: 2rem;
    z-index: 4;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0,0,0,.38);
}

    .competition-profile-sketch .competition-cover-copy h1 {
        margin: 0;
        font-size: clamp(1.8rem, 3.2vw, 2.55rem);
        font-weight: 900;
        line-height: 1.15;
    }

.competition-profile-sketch .competition-season-line,
.competition-profile-sketch .competition-organizer-link,
.competition-profile-sketch .competition-organizer-link.is-static {
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
}

    .competition-profile-sketch .competition-organizer-link:hover {
        text-decoration: underline;
    }

.competition-profile-sketch .competition-essential-dates.is-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.6rem;
    margin-top: .15rem;
}

    .competition-profile-sketch .competition-essential-dates.is-inline span {
        display: inline-flex;
        flex-direction: column;
        gap: .18rem;
    }

    .competition-profile-sketch .competition-essential-dates.is-inline small {
        color: rgba(255,255,255,.88);
        font-size: .78rem;
        font-weight: 700;
    }

    .competition-profile-sketch .competition-essential-dates.is-inline strong {
        color: #fff;
        font-size: .98rem;
        font-weight: 900;
    }

.competition-profile-sketch .competition-identity-row {
    display: flex;
    align-items: flex-end;
    gap: 1.15rem;
}

.competition-page[dir="rtl"] .competition-profile-sketch .competition-identity-row,
.competition-page[dir="ltr"] .competition-profile-sketch .competition-identity-row {
    flex-direction: row;
}

.competition-profile-sketch .competition-manager-side,
.competition-profile-sketch .competition-logo-side {
    width: 165px;
    flex: 0 0 165px;
}

.competition-profile-sketch .competition-logo-wrap.is-rect {
    width: 100%;
    min-height: 190px;
    border-radius: 1.75rem;
    border: 1px solid #d8e1d0;
    background: linear-gradient(180deg, #ffffff 0%, #f4f8ef 100%);
    box-shadow: 0 16px 30px rgba(15, 23, 42, .10);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    overflow: hidden;
}

.competition-profile-sketch .competition-logo-image {
    width: 100%;
    height: 100%;
    max-width: 120px;
    max-height: 120px;
    object-fit: contain;
}

.competition-profile-sketch .competition-logo-fallback {
    width: 108px;
    height: 108px;
    border-radius: 1.5rem;
    background: linear-gradient(135deg, #5b8c3b 0%, #3f6d24 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.15rem;
    font-weight: 900;
}

.competition-profile-sketch .competition-statistics-bar--profile {
    flex: 1 1 auto;
    min-height: 112px;
    padding: 1rem 1.15rem;
    border-radius: 1.55rem;
    border: 1px solid #d8e1d0;
    background: #fff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .08);
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .75rem;
    align-self: center;
}

    .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item {
        min-width: 0;
    }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item strong {
            font-size: 1.35rem;
        }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item span {
            font-size: .84rem;
        }

.competition-profile-sketch .competition-manager-slider.compact {
    position: relative;
    width: 100%;
}

.competition-profile-sketch .competition-manager-viewport {
    overflow: hidden;
    width: 100%;
}

.competition-profile-sketch .competition-manager-track {
    display: flex;
    transition: transform .35s ease;
    width: 100%;
}

.competition-profile-sketch .competition-manager-card.is-portrait {
    flex: 0 0 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    gap: .6rem;
    padding: .15rem .15rem 0;
}

.competition-profile-sketch .competition-manager-photo {
    width: 96px;
    height: 96px;
    border-radius: 999px;
    overflow: hidden;
    border: 4px solid #fff;
    box-shadow: 0 10px 20px rgba(15, 23, 42, .14);
    background: linear-gradient(135deg, #eff4ea 0%, #dce7cf 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .competition-profile-sketch .competition-manager-photo img,
    .competition-profile-sketch .competition-manager-fallback {
        width: 100%;
        height: 100%;
    }

.competition-profile-sketch .competition-manager-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #244014;
    font-size: 1.9rem;
    font-weight: 900;
}

.competition-profile-sketch .competition-manager-copy {
    display: flex;
    flex-direction: column;
    gap: .18rem;
    align-items: center;
}

    .competition-profile-sketch .competition-manager-copy strong {
        color: #11243b;
        font-size: .98rem;
        line-height: 1.3;
    }

    .competition-profile-sketch .competition-manager-copy small {
        color: #5f6f84;
        font-size: .8rem;
        font-weight: 700;
    }

.competition-profile-sketch .competition-manager-nav {
    position: absolute;
    top: 34px;
    width: 30px;
    height: 30px;
    border-radius: 999px;
    border: 1px solid #d7e0cf;
    background: #fff;
    color: #33561f;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    line-height: 1;
    z-index: 3;
    box-shadow: 0 6px 14px rgba(15, 23, 42, .09);
}

.competition-page[dir="rtl"] .competition-profile-sketch .competition-manager-nav.is-prev,
.competition-page[dir="ltr"] .competition-profile-sketch .competition-manager-nav.is-next {
    inset-inline-start: 0;
}

.competition-page[dir="rtl"] .competition-profile-sketch .competition-manager-nav.is-next,
.competition-page[dir="ltr"] .competition-profile-sketch .competition-manager-nav.is-prev {
    inset-inline-end: 0;
}

.competition-profile-sketch .competition-manager-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .36rem;
    margin-top: .6rem;
}

@media (max-width: 1180px) {
    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .competition-profile-sketch .competition-cover {
        min-height: 285px;
    }

    .competition-profile-sketch .competition-cover-copy {
        inset-inline-start: 1.3rem;
        inset-inline-end: 1.3rem;
        inset-block-end: 1.25rem;
    }

    .competition-profile-sketch .competition-identity-row {
        flex-direction: column !important;
        align-items: stretch;
    }

    .competition-profile-sketch .competition-manager-side,
    .competition-profile-sketch .competition-logo-side,
    .competition-profile-sketch .competition-statistics-bar--profile {
        width: 100%;
        flex: 1 1 auto;
    }

    .competition-profile-sketch .competition-statistics-bar--profile {
        order: 2;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .competition-profile-sketch .competition-logo-side {
        order: 1;
    }

    .competition-profile-sketch .competition-manager-side {
        order: 3;
    }

    .competition-profile-sketch .competition-logo-wrap.is-rect {
        min-height: 150px;
    }
}

@media (max-width: 640px) {
    .competition-profile-sketch .competition-cover {
        min-height: 250px;
        border-radius: 1.5rem;
    }

    .competition-profile-sketch .competition-cover-copy h1 {
        font-size: 1.42rem;
    }

    .competition-profile-sketch .competition-essential-dates.is-inline {
        gap: .65rem 1rem;
    }

    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: 1fr;
    }

    .competition-profile-sketch .competition-manager-side,
    .competition-profile-sketch .competition-logo-side {
        width: 100%;
    }
}


/* Arabic profile-side positions: logo right, manager left.
   LTR can be enabled later by changing the page dir to ltr; the inline axis reverses naturally. */
.competition-page[dir="rtl"] .competition-logo-side {
    order: 1;
}

.competition-page[dir="rtl"] .competition-statistics-bar--profile {
    order: 2;
}

.competition-page[dir="rtl"] .competition-manager-side {
    order: 3;
}

.competition-page[dir="ltr"] .competition-logo-side {
    order: 1;
}

.competition-page[dir="ltr"] .competition-statistics-bar--profile {
    order: 2;
}

.competition-page[dir="ltr"] .competition-manager-side {
    order: 3;
}

/* ================================================================
   2026-09-18 Compact profile + unified overview refinement
   ================================================================ */

/* Banner dates follow the same transparent text treatment as season/name. */
.competition-profile-sketch .competition-essential-dates.is-inline {
    gap: .5rem 1.35rem;
    margin-top: .05rem;
}

    .competition-profile-sketch .competition-essential-dates.is-inline > span {
        min-width: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .competition-profile-sketch .competition-essential-dates.is-inline small {
        color: rgba(255,255,255,.88);
        font-size: .72rem;
    }

    .competition-profile-sketch .competition-essential-dates.is-inline strong {
        margin-top: 0;
        color: #fff;
        font-size: .88rem;
    }

/* Give the manager more visual room; the statistics strip is intentionally tighter. */
.competition-profile-sketch .competition-manager-side {
    width: 205px;
    flex: 0 0 205px;
}

.competition-profile-sketch .competition-logo-side {
    width: 160px;
    flex: 0 0 160px;
}

.competition-profile-sketch .competition-statistics-bar--profile {
    min-height: 76px;
    padding: .45rem .65rem;
    border-radius: 1.15rem;
    gap: .25rem;
    align-self: center;
}

    .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item {
        min-height: 58px;
        gap: 0;
        padding: .35rem .32rem;
        align-content: center;
    }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item + .competition-stat-item::before {
            inset-block: 10px;
        }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item strong {
            font-size: 1.08rem;
            line-height: 1.1;
        }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item span {
            font-size: .69rem;
            line-height: 1.25;
        }

.competition-profile-sketch .competition-manager-photo {
    width: 112px;
    height: 112px;
}

.competition-profile-sketch .competition-manager-copy strong {
    font-size: 1.02rem;
}

.competition-profile-sketch .competition-manager-copy small {
    font-size: .82rem;
}

.competition-profile-sketch .competition-manager-nav {
    top: 42px;
}

/* One shared summary surface instead of separate boxes for every fact. */
.competition-current-overview-card {
    background: #fff;
}

.competition-overview-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 8px 12px;
    overflow: hidden;
    list-style: none;
    border: 1px solid #dfe7db;
    border-radius: 14px;
    background: linear-gradient(180deg, #fcfefb 0%, #f7faf5 100%);
}

.competition-overview-item {
    position: relative;
    min-width: 0;
    min-height: 62px;
    padding: 9px 22px 9px 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 0;
    border-radius: 0;
    background: transparent;
}

    .competition-overview-item::after {
        content: "";
        position: absolute;
        inset-block: 10px;
        inset-inline-end: 0;
        width: 1px;
        background: #e3e9df;
    }

    .competition-overview-item:nth-child(4n)::after {
        display: none;
    }

.competition-overview-bullet {
    position: absolute;
    inset-inline-start: 7px;
    top: 16px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--competition-green);
    box-shadow: 0 0 0 3px rgba(91,140,59,.12);
}

.competition-overview-label {
    color: var(--competition-muted);
    font-size: .67rem;
    font-weight: 800;
}

.competition-overview-item > strong,
.competition-overview-item > a:not(.competition-overview-person-link) {
    margin-top: 3px;
    overflow: hidden;
    color: #2e3b2a;
    font-size: .8rem;
    font-weight: 900;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.competition-overview-item.is-stage {
    border: 0;
    background: transparent;
}

.competition-overview-item.is-number strong {
    font-size: 1rem;
}

.competition-overview-person-link {
    margin-top: 3px;
}

.competition-overview-avatar {
    width: 30px;
    height: 30px;
}

@media (max-width: 1180px) {
    .competition-profile-sketch .competition-manager-side {
        width: 185px;
        flex-basis: 185px;
    }

    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .competition-overview-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .competition-overview-item:nth-child(4n)::after {
        display: block;
    }

    .competition-overview-item:nth-child(3n)::after {
        display: none;
    }
}

@media (max-width: 900px) {
    .competition-profile-sketch .competition-manager-side,
    .competition-profile-sketch .competition-logo-side {
        width: 100%;
        flex-basis: auto;
    }

    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-height: 0;
    }

    .competition-overview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .competition-overview-item:nth-child(3n)::after {
        display: block;
    }

    .competition-overview-item:nth-child(2n)::after {
        display: none;
    }
}

@media (max-width: 560px) {
    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .competition-profile-sketch .competition-manager-photo {
        width: 104px;
        height: 104px;
    }

    .competition-overview-grid {
        grid-template-columns: 1fr;
        padding: 6px 10px;
    }

    .competition-overview-item {
        min-height: 54px;
        padding-block: 7px;
    }

        .competition-overview-item::after,
        .competition-overview-item:nth-child(2n)::after,
        .competition-overview-item:nth-child(3n)::after,
        .competition-overview-item:nth-child(4n)::after {
            display: none;
        }

        .competition-overview-item + .competition-overview-item {
            border-top: 1px solid #e6ece2;
        }
}

/* ================================================================
   2026-09-18 Final CompetitionDetails refinement
   ================================================================ */

.competition-profile-sketch .competition-cover-copy {
    gap: .45rem;
}

    .competition-profile-sketch .competition-cover-copy .competition-organizer-link {
        margin-top: 0;
        font-size: .95rem;
    }

/* Six-item competition details bar; preserve the compact height. */
.competition-profile-sketch .competition-statistics-bar--profile {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    min-height: 76px;
    padding: .42rem .5rem;
    gap: .12rem;
}

    .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item {
        min-width: 0;
        min-height: 58px;
        padding: .32rem .22rem;
        gap: 1px;
        align-content: center;
    }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item + .competition-stat-item::before {
            inset-block: 10px;
        }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item strong {
            max-width: 100%;
            overflow: hidden;
            color: var(--competition-green-dark);
            font-size: .94rem;
            line-height: 1.08;
            font-weight: 900;
            text-align: center;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item span {
            max-width: 100%;
            color: var(--competition-muted);
            font-size: .58rem;
            line-height: 1.18;
            font-weight: 800;
            text-align: center;
        }

    .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item--meta strong {
        font-size: .78rem;
    }

    .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item--format strong {
        display: -webkit-box;
        overflow: hidden;
        font-size: .69rem;
        line-height: 1.18;
        white-space: normal;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

/* Clean circular manager carousel. */
.competition-profile-sketch .competition-manager-side {
    width: 215px;
    flex: 0 0 215px;
    align-self: center;
}

.competition-manager-carousel,
.competition-manager-viewport {
    width: 100%;
    min-width: 0;
}

.competition-manager-viewport {
    overflow: hidden;
}

.competition-manager-track {
    direction: ltr;
    display: flex;
    width: 100%;
    transition: transform .42s ease;
    will-change: transform;
}

.competition-manager-profile {
    direction: rtl;
    flex: 0 0 100%;
    width: 100%;
    min-width: 0;
    min-height: 178px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .48rem;
    padding: .7rem .4rem;
    text-align: center;
}

.competition-manager-photo-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
    text-decoration: none;
}

    .competition-manager-photo-link:not(.is-static):hover .competition-manager-photo {
        border-color: #bdd0b0;
        transform: translateY(-2px);
        box-shadow: 0 14px 28px rgba(15, 23, 42, .16);
    }

.competition-profile-sketch .competition-manager-photo {
    width: 122px;
    height: 122px;
    flex: 0 0 122px;
    overflow: hidden;
    border: 5px solid #fff;
    border-radius: 50%;
    outline: 1px solid #dce6d7;
    background: linear-gradient(135deg, #eff4ea 0%, #dce7cf 100%);
    box-shadow: 0 10px 20px rgba(15, 23, 42, .12);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

    .competition-profile-sketch .competition-manager-photo img,
    .competition-profile-sketch .competition-manager-fallback {
        width: 100%;
        height: 100%;
    }

    .competition-profile-sketch .competition-manager-photo img {
        object-fit: cover;
    }

.competition-profile-sketch .competition-manager-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #244014;
    font-size: 1.9rem;
    font-weight: 900;
}

.competition-profile-sketch .competition-manager-copy {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .08rem;
    text-align: center;
}

.competition-manager-eyebrow {
    display: block;
    width: 100%;
    margin: 0;
    color: var(--competition-green-dark);
    font-size: .68rem;
    line-height: 1.25;
    font-weight: 900;
    text-align: center;
}

.competition-profile-sketch .competition-manager-copy strong {
    display: block;
    width: 100%;
    max-width: 205px;
    overflow: hidden;
    color: var(--competition-text);
    font-size: .96rem;
    line-height: 1.3;
    font-weight: 900;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.competition-profile-sketch .competition-manager-copy small {
    display: block;
    width: 100%;
    color: var(--competition-muted);
    font-size: .72rem;
    text-align: center;
}

.competition-manager-profile.is-placeholder .competition-manager-photo {
    box-shadow: 0 9px 20px rgba(15, 23, 42, .08);
}

.competition-manager-dots {
    direction: ltr;
    min-height: 14px;
    margin-top: .15rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .34rem;
}

.competition-manager-dot {
    width: 6px;
    height: 6px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #cfd7cb;
    transition: width .2s ease, background .2s ease;
}

    .competition-manager-dot.is-active {
        width: 16px;
        background: var(--competition-green);
    }

.rank-cell {
    position: relative;
}

.standing-adjustment-mark {
    margin-inline-start: 2px;
    color: #9a6700;
    font-size: .72rem;
    font-weight: 900;
    vertical-align: super;
}

.standing-legend-item.is-adjustment {
    width: 100%;
    color: #6d5b24;
}

@media (max-width: 1180px) {
    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item strong {
            font-size: .86rem;
        }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item span {
            font-size: .54rem;
        }

        .competition-profile-sketch .competition-statistics-bar--profile .competition-stat-item--format strong {
            font-size: .63rem;
        }
}

@media (max-width: 900px) {
    .competition-profile-sketch .competition-manager-side {
        width: 100%;
        flex-basis: auto;
    }

    .competition-manager-profile {
        min-height: 0;
        padding-block: .3rem .6rem;
    }

    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-height: 0;
    }
}

@media (max-width: 560px) {
    .competition-profile-sketch .competition-manager-photo {
        width: 108px;
        height: 108px;
        flex-basis: 108px;
    }

    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}










/* ================================================================
   2026-09-20 Competition staging hierarchy
   CompetitionStages -> CompetitionStageDetails -> clubs
   Existing table/card design is intentionally preserved.
   ================================================================ */

.competition-stage-hierarchy {
    display: grid;
    gap: 18px;
}

.competition-stage-public-block {
    overflow: hidden;
    border: 1px solid var(--competition-border);
    border-radius: 16px;
    background: #fff;
}

.competition-stage-public-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 13px 15px;
    border-bottom: 1px solid #e5ebe1;
    background: linear-gradient(180deg, #f8fbf6 0%, #f3f8f0 100%);
}

.competition-stage-public-title {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.competition-stage-order-badge {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: var(--competition-green);
    color: #fff;
    font-size: .84rem;
    font-weight: 900;
    box-shadow: 0 5px 12px rgba(91, 140, 59, .16);
}

.competition-stage-public-title small {
    display: block;
    color: var(--competition-muted);
    font-size: .63rem;
    font-weight: 800;
}

.competition-stage-public-title h3 {
    margin: 1px 0 0;
    color: var(--competition-text);
    font-size: .96rem;
    line-height: 1.3;
    font-weight: 900;
}

.competition-stage-public-title p {
    margin: 2px 0 0;
    color: var(--competition-muted);
    font-size: .67rem;
    font-weight: 700;
}

.competition-stage-details-count,
.competition-stage-detail-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 27px;
    padding: 4px 9px;
    border: 1px solid #d5e1cf;
    border-radius: 999px;
    background: #fff;
    color: var(--competition-green-dark);
    font-size: .66rem;
    font-weight: 900;
    white-space: nowrap;
}

.competition-stage-public-block .competition-table-group {
    margin: 0;
    padding: 14px;
}

    .competition-stage-public-block .competition-table-group + .competition-table-group {
        margin-top: 0;
        border-top: 1px solid #edf0eb;
    }

.competition-stage-detail-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

    .competition-stage-detail-heading > div {
        min-width: 0;
    }

    .competition-stage-detail-heading span:not(.competition-stage-detail-count) {
        display: block;
        color: var(--competition-muted);
        font-size: .62rem;
        font-weight: 700;
    }

    .competition-stage-detail-heading h4 {
        margin: 1px 0 0;
        color: var(--competition-text);
        font-size: .88rem;
        font-weight: 900;
    }

    .competition-stage-detail-heading small {
        display: block;
        margin-top: 1px;
        color: var(--competition-muted);
        font-size: .65rem;
        font-weight: 700;
    }

.competition-stage-empty {
    padding: 18px 15px;
    color: var(--competition-muted);
    font-size: .78rem;
    font-weight: 700;
    text-align: center;
}

    .competition-stage-empty.is-detail {
        margin-top: 7px;
        padding: 14px;
        border: 1px dashed #dde5d9;
        border-radius: 11px;
        background: #fbfcfb;
    }

.stage-club-cell {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 9px;
}

.competition-stage-club-status {
    display: inline-flex;
    align-items: center;
    min-height: 21px;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: .58rem;
    font-weight: 900;
    white-space: nowrap;
}

    .competition-stage-club-status.is-completed {
        background: var(--competition-green-soft);
        color: var(--competition-green-dark);
    }

    .competition-stage-club-status.is-pending {
        background: var(--competition-warning-soft);
        color: var(--competition-warning);
    }

@media (max-width: 640px) {
    .competition-stage-public-header,
    .competition-stage-detail-heading {
        align-items: flex-start;
    }

    .competition-stage-public-header {
        padding: 11px;
    }

    .competition-stage-public-block .competition-table-group {
        padding: 10px;
    }

    .competition-stage-order-badge {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }

    .competition-stage-details-count,
    .competition-stage-detail-count {
        font-size: .6rem;
    }
}


/* =============================================================================
   2026-10-02 MOBILE-FIRST RESPONSIVE STABILIZATION
   -----------------------------------------------------------------------------
   Desktop/laptop styling above is intentionally preserved.
   These overrides apply only to tablet/mobile widths and are focused on:
   - preventing page-level horizontal overflow
   - making the profile header stack cleanly
   - keeping the 7-item statistics block readable
   - turning the 4 tabs into a clean mobile grid
   - keeping standings tables horizontally scrollable inside their own cards
   - keeping fixture teams side-by-side like a sports app
   - improving touch targets and spacing
   ============================================================================= */

@media (max-width: 900px) {

    .competition-page {
        overflow-x: hidden;
    }

    .competition-shell,
    .competition-profile-card,
    .competition-content-card,
    .competition-tab-panels,
    .competition-tab-panel,
    .competition-stage-hierarchy,
    .competition-stage-public-block,
    .competition-table-group,
    .fixtures-list,
    .fixture-card,
    .competition-season-single-view,
    .competition-season-card {
        min-width: 0;
        max-width: 100%;
    }

    /* Profile header */
    .competition-profile-sketch .competition-identity-row {
        display: flex;
        flex-direction: column !important;
        align-items: stretch;
        gap: 12px;
    }

    .competition-profile-sketch .competition-logo-side,
    .competition-profile-sketch .competition-manager-side,
    .competition-profile-sketch .competition-statistics-bar--profile {
        width: 100%;
        max-width: 100%;
        flex: 0 0 auto;
    }

    .competition-profile-sketch .competition-logo-side {
        order: 1 !important;
    }

    .competition-profile-sketch .competition-statistics-bar--profile {
        order: 2 !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0;
    }

    .competition-profile-sketch .competition-manager-side {
        order: 3 !important;
    }

    .competition-profile-sketch .competition-logo-wrap.is-rect {
        width: 100%;
        min-height: 132px;
        height: 132px;
        margin: 0;
        border-radius: 18px;
    }

    .competition-profile-sketch .competition-logo-image {
        max-width: 108px;
        max-height: 108px;
        padding: 8px;
    }

    .competition-profile-sketch .competition-cover {
        margin-bottom: 12px;
    }

    .competition-profile-sketch .competition-cover-copy {
        max-width: calc(100% - 2.6rem);
    }

        .competition-profile-sketch .competition-cover-copy h1 {
            overflow-wrap: anywhere;
        }

    .competition-profile-sketch .competition-statistics-bar--profile
    .competition-stat-item {
        min-width: 0;
    }

        .competition-profile-sketch .competition-statistics-bar--profile
        .competition-stat-item strong,
        .competition-profile-sketch .competition-statistics-bar--profile
        .competition-stat-item span {
            overflow-wrap: anywhere;
        }

    /* Section headings */
    .competition-section-heading {
        min-width: 0;
    }

        .competition-section-heading > div {
            min-width: 0;
        }

    /* Tables stay inside their own scroller instead of widening the page. */
    .competition-table-scroll {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-inline: contain;
    }

    .competition-table {
        width: max-content;
        max-width: none;
    }

    /* Season header */
    .season-card-header {
        grid-template-columns: 1fr;
    }

    .season-winner-card {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 640px) {

    /* -------------------------------------------------------------
       Page shell / surfaces
       ------------------------------------------------------------- */
    .competition-page {
        padding: 8px 6px 26px;
    }

    .competition-shell {
        width: 100%;
    }

    .competition-profile-card,
    .competition-content-card {
        border-radius: 14px;
    }

    .competition-content-card {
        padding: 12px 8px;
    }

    /* -------------------------------------------------------------
       Cover / identity
       ------------------------------------------------------------- */
    .competition-profile-sketch .competition-cover {
        height: 205px;
        min-height: 205px;
        margin-bottom: 8px;
        border-radius: 14px 14px 0 0;
    }

    .competition-profile-sketch .competition-cover-copy {
        inset-inline-start: 14px;
        inset-inline-end: 14px;
        inset-block-end: 14px;
        max-width: calc(100% - 28px);
        gap: 4px;
    }

        .competition-profile-sketch .competition-cover-copy h1 {
            font-size: 1.3rem;
            line-height: 1.25;
        }

        .competition-profile-sketch .competition-cover-copy
        .competition-organizer-link,
        .competition-profile-sketch .competition-organizer-link.is-static {
            font-size: .82rem;
            line-height: 1.4;
        }

    .competition-profile-sketch .competition-essential-dates.is-inline {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
        width: 100%;
    }

        .competition-profile-sketch
        .competition-essential-dates.is-inline > span {
            min-width: 0;
        }

        .competition-profile-sketch
        .competition-essential-dates.is-inline small {
            font-size: .64rem;
        }

        .competition-profile-sketch
        .competition-essential-dates.is-inline strong {
            font-size: .78rem;
            white-space: normal;
        }

    .competition-profile-sketch .competition-identity-row {
        gap: 9px;
    }

    .competition-profile-sketch .competition-logo-wrap.is-rect {
        min-height: 104px;
        height: 104px;
        padding: 8px;
        border-radius: 14px;
        box-shadow: 0 7px 18px rgba(15, 23, 42, .07);
    }

    .competition-profile-sketch .competition-logo-image {
        max-width: 86px;
        max-height: 86px;
        padding: 5px;
    }

    .competition-profile-sketch .competition-logo-fallback {
        width: 78px;
        height: 78px;
        border-radius: 14px;
        font-size: 1.55rem;
    }

    /* -------------------------------------------------------------
       Statistics: readable 2-column mobile card
       ------------------------------------------------------------- */
    .competition-profile-sketch .competition-statistics-bar--profile {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-height: 0;
        padding: 6px;
        gap: 0;
        border-radius: 14px;
    }

        .competition-profile-sketch .competition-statistics-bar--profile
        .competition-stat-item {
            min-height: 56px;
            padding: 8px 5px;
            border-top: 0;
            border-bottom: 1px solid #edf1ea;
        }

            .competition-profile-sketch .competition-statistics-bar--profile
            .competition-stat-item:nth-child(odd) {
                border-inline-end: 1px solid #edf1ea;
            }

            .competition-profile-sketch .competition-statistics-bar--profile
            .competition-stat-item:nth-last-child(-n+2) {
                border-bottom: 0;
            }

            .competition-profile-sketch .competition-statistics-bar--profile
            .competition-stat-item:last-child {
                grid-column: auto;
                border-inline-end: 0;
                border-bottom: 0;
            }

            .competition-profile-sketch .competition-statistics-bar--profile
            .competition-stat-item + .competition-stat-item::before {
                display: none;
            }

            .competition-profile-sketch .competition-statistics-bar--profile
            .competition-stat-item strong {
                max-width: 100%;
                font-size: .93rem;
                line-height: 1.2;
                white-space: normal;
                text-overflow: clip;
            }

        .competition-profile-sketch .competition-statistics-bar--profile
        .competition-stat-item--meta strong {
            font-size: .76rem;
        }

        .competition-profile-sketch .competition-statistics-bar--profile
        .competition-stat-item--format strong {
            font-size: .72rem;
            -webkit-line-clamp: 3;
        }

        .competition-profile-sketch .competition-statistics-bar--profile
        .competition-stat-item span {
            font-size: .62rem;
            line-height: 1.35;
        }

    /* -------------------------------------------------------------
       Manager: compact horizontal mobile card
       ------------------------------------------------------------- */
    .competition-profile-sketch .competition-manager-side {
        width: 100%;
        padding: 0;
    }

    .competition-manager-carousel {
        overflow: hidden;
        border: 1px solid #e1e8dd;
        border-radius: 14px;
        background: #fff;
    }

    .competition-manager-profile {
        min-height: 0;
        flex-direction: row;
        justify-content: flex-start;
        gap: 11px;
        padding: 10px 12px;
        text-align: right;
    }

    .competition-profile-sketch .competition-manager-photo {
        width: 68px;
        height: 68px;
        flex: 0 0 68px;
        border-width: 3px;
    }

    .competition-profile-sketch .competition-manager-fallback {
        font-size: 1.25rem;
    }

    .competition-profile-sketch .competition-manager-copy {
        min-width: 0;
        align-items: flex-start;
        text-align: right;
    }

        .competition-manager-eyebrow,
        .competition-profile-sketch .competition-manager-copy strong,
        .competition-profile-sketch .competition-manager-copy small {
            text-align: right;
        }

        .competition-profile-sketch .competition-manager-copy strong {
            max-width: 100%;
            font-size: .9rem;
            white-space: normal;
            overflow-wrap: anywhere;
        }

    .competition-manager-dots {
        padding-bottom: 7px;
    }

    /* -------------------------------------------------------------
       Tabs: 2 x 2 instead of a long horizontal rail
       ------------------------------------------------------------- */
    .competition-tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px;
        overflow: visible;
        padding: 5px;
        border-radius: 13px;
    }

    .competition-tab-button {
        min-width: 0;
        min-height: 44px;
        padding: 8px 6px;
        font-size: .78rem;
        line-height: 1.35;
        white-space: normal;
    }

    /* -------------------------------------------------------------
       Section headings and action buttons
       ------------------------------------------------------------- */
    .competition-section-heading,
    .fixtures-heading,
    .season-section-heading {
        align-items: stretch;
        flex-direction: column;
        gap: 9px;
        margin-bottom: 12px;
    }

        .competition-section-heading h2 {
            font-size: 1rem;
        }

        .competition-section-heading p {
            font-size: .74rem;
            line-height: 1.6;
        }

    .competition-inline-tab-link,
    .fixture-reset-button {
        width: 100%;
        min-height: 42px;
    }

    .fixture-visible-count {
        width: 100%;
        min-width: 0;
        grid-template-columns: auto auto;
        justify-content: center;
        align-items: center;
        gap: 6px;
    }

    /* -------------------------------------------------------------
       Competition stages / groups
       ------------------------------------------------------------- */
    .competition-stage-hierarchy {
        gap: 11px;
    }

    .competition-stage-public-block {
        border-radius: 12px;
    }

    .competition-stage-public-header,
    .competition-stage-detail-heading {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .competition-stage-public-header {
        padding: 10px;
    }

    .competition-stage-details-count,
    .competition-stage-detail-count {
        align-self: flex-start;
    }

    .competition-stage-public-block .competition-table-group {
        padding: 8px 6px 10px;
    }

    .competition-stage-public-title {
        align-items: flex-start;
    }

        .competition-stage-public-title h3,
        .competition-stage-detail-heading h4 {
            overflow-wrap: anywhere;
        }

    .stage-club-cell {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    /* -------------------------------------------------------------
       Tables
       ------------------------------------------------------------- */
    .competition-table {
        min-width: 560px;
        font-size: .73rem;
    }

        .competition-table.is-detailed {
            min-width: 900px;
        }

    .season-table {
        min-width: 680px;
    }

    .competition-table th,
    .competition-table td {
        padding: 8px 7px;
    }

    .competition-table .club-column {
        min-width: 165px;
    }

    .table-club-link {
        gap: 6px;
    }

    .table-club-logo,
    .next-opponent-link,
    .next-opponent-fallback {
        width: 30px;
        height: 30px;
        flex-basis: 30px;
    }

    .standing-legend-item {
        width: 100%;
        line-height: 1.55;
    }

    /* -------------------------------------------------------------
       Fixture filters
       ------------------------------------------------------------- */
    .fixture-filters {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 10px;
    }

    .fixture-reset-button {
        grid-column: auto;
    }

    /* -------------------------------------------------------------
       Fixtures: keep both teams on the same row on phones
       ------------------------------------------------------------- */
    .fixture-card {
        border-radius: 12px;
    }

    .fixture-card-topline {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 7px;
        padding: 8px 9px;
    }

    .fixture-context {
        min-width: 0;
        flex: 1 1 180px;
        gap: 4px 7px;
    }

    .fixture-status {
        flex: 0 0 auto;
        min-height: 26px;
        padding: 4px 8px;
        font-size: .67rem;
    }

    .fixture-match-row {
        grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr);
        gap: 4px;
        padding: 12px 7px;
    }

    .fixture-team.home-team .fixture-team-link,
    .fixture-team.away-team .fixture-team-link {
        justify-content: flex-start;
        flex-direction: column;
        gap: 5px;
        text-align: center;
    }

    .fixture-team.home-team .fixture-team-link {
        flex-direction: column;
    }

    .fixture-team-link strong {
        display: -webkit-box;
        width: 100%;
        overflow: hidden;
        font-size: .72rem;
        line-height: 1.35;
        text-align: center;
        white-space: normal;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .fixture-team-logo {
        width: 40px;
        height: 40px;
        flex: 0 0 40px;
    }

    .fixture-score-link {
        width: auto;
        min-width: 0;
        margin: 0;
        padding: 7px 3px;
    }

        .fixture-score-link strong {
            font-size: 1rem;
            white-space: nowrap;
        }

        .fixture-score-link small {
            font-size: .56rem;
            line-height: 1.3;
            text-align: center;
        }

    .fixture-card-footer {
        display: grid;
        gap: 7px;
        padding: 8px 9px;
        line-height: 1.55;
    }

    .fixture-details-link {
        width: 100%;
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0;
        border: 1px solid #d3dfcc;
        border-radius: 9px;
        background: #fff;
    }

    /* -------------------------------------------------------------
       Scorers
       ------------------------------------------------------------- */
    .competition-scorers-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .competition-scorer-card {
        padding: 10px;
    }

    /* -------------------------------------------------------------
       Seasons
       ------------------------------------------------------------- */
    .competition-season-selector {
        width: 100%;
        min-width: 0;
    }

        .competition-season-selector select {
            min-height: 44px;
        }

    .season-card-header {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 10px;
    }

    .season-title-group {
        align-items: stretch;
        flex-direction: column;
        gap: 7px;
    }

    .season-page-link {
        width: 100%;
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .season-winner-card {
        width: 100%;
        min-width: 0;
    }

    /* -------------------------------------------------------------
       Touch/accessibility
       ------------------------------------------------------------- */
    .competition-tab-button,
    .competition-inline-tab-link,
    .fixture-reset-button,
    .fixture-details-link,
    .season-page-link,
    .competition-season-selector select,
    .fixture-filter-control input,
    .fixture-filter-control select {
        touch-action: manipulation;
    }
}

@media (max-width: 390px) {

    .competition-page {
        padding-inline: 4px;
    }

    .competition-content-card {
        padding-inline: 6px;
    }

    .competition-profile-sketch .competition-cover {
        height: 190px;
        min-height: 190px;
    }

    .competition-profile-sketch .competition-cover-copy h1 {
        font-size: 1.16rem;
    }

    .competition-profile-sketch .competition-statistics-bar--profile
    .competition-stat-item strong {
        font-size: .86rem;
    }

    .competition-profile-sketch .competition-statistics-bar--profile
    .competition-stat-item span {
        font-size: .58rem;
    }

    .competition-tab-button {
        font-size: .73rem;
    }

    .fixture-match-row {
        grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr);
    }

    .fixture-team-logo {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
    }

    .fixture-score-link strong {
        font-size: .92rem;
    }
}

/* ================================================================
   Fixture grouping responsive refinements
   ================================================================ */
@media (max-width: 720px) {
    .competition-fixture-groups {
        gap: 12px;
    }

    .competition-fixture-group {
        border-radius: 13px;
    }

    .competition-fixture-group-header {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
        padding: 11px;
    }

    .competition-fixture-group-title {
        gap: 9px;
    }

    .competition-fixture-group-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }

    .competition-fixture-group-title h3 {
        font-size: .9rem;
    }

    .competition-fixture-group-summary {
        justify-content: flex-start;
    }

    .competition-fixture-group-matches {
        padding: 7px;
    }

    .competition-fixture-group-note {
        padding: 8px 11px;
    }
}

@media (max-width: 390px) {
    .competition-fixture-group-header {
        padding: 9px;
    }

    .competition-fixture-group-summary {
        gap: 5px;
    }

    .fixture-group-status,
    .fixture-group-match-count,
    .fixture-group-live-count {
        min-height: 27px;
        padding: 4px 7px;
        font-size: .63rem;
    }
}

/* ================================================================
   GEDIAN FOLLOW + LIKE - COMPETITION
   ================================================================ */

.competition-social-feedback {
    margin: 0 0 10px;
    padding: 10px 13px;
    border: 1px solid #d8e4d2;
    border-radius: 11px;
    background: #f6faf3;
    color: #466f2d;
    font-size: .8rem;
    font-weight: 800;
    box-shadow: 0 6px 16px rgba(45,75,32,.045);
}

.competition-gedian-social-actions {
    margin-top: .4rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .45rem;
    text-shadow: none;
}

.competition-social-form {
    margin: 0;
}

.competition-followers-stat,
.competition-follow-button,
.competition-like-button {
    min-height: 38px;
    border: 1px solid rgba(255,255,255,.48);
    border-radius: 10px;
    backdrop-filter: blur(7px);
}

.competition-followers-stat {
    padding: 6px 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: rgba(8,25,14,.34);
    color: #fff;
}

    .competition-followers-stat small {
        color: rgba(255,255,255,.82);
        font-size: .68rem;
        font-weight: 800;
    }

    .competition-followers-stat strong {
        color: #fff;
        font-family: Arial,"Tajawal",sans-serif;
        font-size: .8rem;
        font-weight: 900;
    }

.competition-follow-button,
.competition-like-button {
    padding: 6px 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: rgba(255,255,255,.14);
    color: #fff;
    font-family: inherit;
    font-size: .73rem;
    font-weight: 900;
    cursor: pointer;
    transition: transform .14s ease, background .14s ease, border-color .14s ease;
}

    .competition-follow-button:hover,
    .competition-like-button:hover {
        transform: translateY(-1px);
        background: rgba(255,255,255,.24);
    }

    .competition-follow-button.is-following {
        border-color: #d6ead0;
        background: #fff;
        color: var(--competition-green-dark);
    }

    .competition-like-button.is-liked {
        border-color: #efc2c9;
        background: #fff3f5;
        color: #a52d3d;
    }

    .competition-like-button > strong {
        min-width: 23px;
        padding: 2px 6px;
        border-radius: 999px;
        background: rgba(255,255,255,.17);
        color: inherit;
        font-family: Arial,"Tajawal",sans-serif;
        font-size: .65rem;
        font-weight: 900;
    }

    .competition-like-button.is-liked > strong {
        background: rgba(15,23,42,.06);
    }

@media (max-width: 620px) {
    .competition-gedian-social-actions {
        width: 100%;
        align-items: stretch;
    }

    .competition-followers-stat {
        flex: 1 1 100%;
    }

    .competition-social-form {
        flex: 1 1 calc(50% - .25rem);
    }

    .competition-follow-button,
    .competition-like-button {
        width: 100%;
    }
}

/* ==========================================================
   GEDIAN SPORTS — Public stage + single-surface fixture refinement
   Retains the existing competition-details.css; no new CSS file.
   ========================================================== */
.competition-stage-public-header {
    align-items: center;
    padding-block: 13px;
}

.competition-stage-public-title {
    gap: 0;
}

    .competition-stage-public-title h3 {
        margin: 0;
        font-size: 1.02rem;
        line-height: 1.4;
    }

.competition-stage-public-date {
    display: block;
    margin-top: 5px;
    font-size: .77rem;
    line-height: 1.45;
    font-weight: 700;
    color: #64748b;
}

    .competition-stage-public-date.is-confirmed {
        color: var(--competition-green-dark);
    }

.competition-fixtures-overview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 12px;
    padding: 0 2px;
}

    .competition-fixtures-overview > strong {
        font-size: 1rem;
        font-weight: 900;
        color: var(--competition-text);
    }

/* Show each configured stage in the detailed table, including empty future stages. */
#competition-panel-details .competition-stage-hierarchy {
    gap: 16px;
}

#competition-panel-details .competition-stage-public-block {
    border-radius: 16px;
    overflow: hidden;
}

#competition-panel-details .competition-stage-public-header {
    min-height: 64px;
    padding: 14px 18px;
}

#competition-panel-details .competition-stage-public-title h3 {
    margin: 0;
    font-size: 1.05rem;
}

#competition-panel-details .competition-stage-detail-heading {
    padding-top: 13px;
    padding-bottom: 13px;
}

/* ===============================================================
   COMPETITION DETAILS | Fixture matchday list inspired by the
   supplied football-app reference; tailored for Arabic RTL.
   Each fixture remains ONE card, with matchday headings and rows.
   Do not add separate per-match cards or a new stylesheet.
   =============================================================== */
#competition-panel-fixtures .competition-fixture-group {
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e9e0;
    border-radius: 18px;
    box-shadow: 0 7px 20px rgba(25, 45, 27, .035);
}

#competition-panel-fixtures .competition-fixture-header--editorial {
    min-height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 24px;
    background: linear-gradient(100deg, #f6faf3, #fff);
    border-bottom: 1px solid #e8eee5;
}

    #competition-panel-fixtures .competition-fixture-header--editorial .competition-fixture-group-title {
        min-width: 0;
        display: block;
    }

    #competition-panel-fixtures .competition-fixture-header--editorial h3 {
        font-size: 1.06rem;
        line-height: 1.4;
        margin: 2px 0 0;
        color: #16334d;
    }

#competition-panel-fixtures .competition-fixture-group-matches {
    padding: 10px 18px 16px;
    background: white;
}

#competition-panel-fixtures .fixtures-list--matchdays {
    display: block;
    padding: 0;
}

#competition-panel-fixtures .fixture-matchday {
    margin: 0;
}

    #competition-panel-fixtures .fixture-matchday[hidden] {
        display: none !important;
    }

#competition-panel-fixtures .fixture-matchday-heading {
    margin: 9px 0 0;
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 10px 20px;
    border-radius: 11px;
    background: #f5f6f5;
    color: #18324a;
    font-size: .91rem;
    line-height: 1.6;
    font-weight: 900;
    text-align: right;
}

#competition-panel-fixtures .fixture-matchday-rows {
    display: block;
}

    #competition-panel-fixtures .fixture-matchday-rows .fixture-card {
        margin: 0;
        display: block;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background: #fff;
        overflow: visible;
    }

        #competition-panel-fixtures .fixture-matchday-rows .fixture-card[hidden],
        #competition-panel-fixtures .fixture-matchday-rows .fixture-card[style*="display: none"] {
            display: none !important;
        }

        #competition-panel-fixtures .fixture-matchday-rows .fixture-card + .fixture-card {
            border-top: 1px solid #edf0ed;
        }

        #competition-panel-fixtures .fixture-matchday-rows .fixture-card:hover {
            box-shadow: none;
            border-color: #edf0ed;
            background: #fafcf9;
        }

#competition-panel-fixtures .fixture-match-editorial {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) minmax(0, 740px) minmax(120px, 1fr);
    grid-template-areas: "meta matchup venue";
    gap: clamp(10px, 1.7vw, 32px);
    direction: rtl;
    align-items: center;
    min-height: 88px;
    padding: 11px 22px;
}

    #competition-panel-fixtures .fixture-match-editorial > * {
        min-width: 0;
    }

#competition-panel-fixtures .fixture-match-meta {
    grid-area: meta;
    justify-self: start;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
}

    #competition-panel-fixtures .fixture-match-meta .fixture-status {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 25px;
        padding: 4px 11px;
        border: 0;
        border-radius: 20px;
        background: #f3f4f3;
        color: #667485;
        font-size: .73rem;
        line-height: 1.2;
        font-weight: 800;
        white-space: nowrap;
    }

        #competition-panel-fixtures .fixture-match-meta .fixture-status.is-live {
            background: #ffedec;
            color: #bd2a24;
        }

        #competition-panel-fixtures .fixture-match-meta .fixture-status.is-finished {
            background: #f1f3f2;
            color: #596779;
        }

#competition-panel-fixtures .fixture-kickoff-time {
    color: #6b7886;
    font-size: .74rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

#competition-panel-fixtures .fixture-matchup {
    grid-area: matchup;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(84px, 106px) minmax(0, 1fr);
    direction: rtl;
    align-items: center;
    gap: clamp(6px, .9vw, 14px);
    width: 100%;
    min-width: 0;
}

    #competition-panel-fixtures .fixture-matchup .fixture-team {
        min-width: 0;
        width: 100%;
    }

    #competition-panel-fixtures .fixture-matchup .fixture-team-link {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 11px;
        min-width: 0;
        padding: 0;
        color: #172e45;
        text-decoration: none;
    }

    #competition-panel-fixtures .fixture-matchup .fixture-team.home-team .fixture-team-link {
        justify-content: flex-end;
        direction: rtl;
    }

    #competition-panel-fixtures .fixture-matchup .fixture-team.away-team .fixture-team-link {
        justify-content: flex-start;
        direction: rtl;
    }

    #competition-panel-fixtures .fixture-matchup .fixture-team-link strong {
        min-width: 0;
        font-size: .87rem;
        line-height: 1.5;
        font-weight: 800;
        color: inherit;
        white-space: normal;
        overflow-wrap: anywhere;
        text-overflow: clip;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    #competition-panel-fixtures .fixture-matchup .fixture-team-logo {
        flex: 0 0 36px;
        width: 36px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        background: #fff;
        border: 1px solid #e4ebe1;
        border-radius: 50%;
    }

        #competition-panel-fixtures .fixture-matchup .fixture-team-logo img {
            display: block;
            width: 100%;
            height: 100%;
            padding: 4px;
            object-fit: contain;
        }

    #competition-panel-fixtures .fixture-matchup .fixture-team-fallback {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        color: #4b7d31;
        font-size: .82rem;
        font-weight: 900;
    }

        #competition-panel-fixtures .fixture-matchup .fixture-team-fallback[style*="display:none"],
        #competition-panel-fixtures .fixture-matchup .fixture-team-fallback[style*="display: none"] {
            display: none;
        }

    #competition-panel-fixtures .fixture-matchup .fixture-match-score {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 1px;
        text-decoration: none;
        padding: 5px 2px;
        border: 0;
        border-radius: 8px;
        background: transparent;
        min-height: 52px;
        box-shadow: none;
    }

        #competition-panel-fixtures .fixture-matchup .fixture-match-score:hover {
            background: #eef5e9;
        }

        #competition-panel-fixtures .fixture-matchup .fixture-match-score .fixture-score-numbers {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            direction: rtl;
            unicode-bidi: isolate;
            color: #10273f;
            font-size: 1.11rem;
            font-weight: 900;
            font-variant-numeric: tabular-nums;
            line-height: 1.35;
            white-space: nowrap;
        }

        #competition-panel-fixtures .fixture-matchup .fixture-match-score > small {
            display: block;
            color: #5b8c3b;
            font-size: .63rem;
            font-weight: 750;
            line-height: 1.35;
            white-space: nowrap;
        }

        #competition-panel-fixtures .fixture-matchup .fixture-match-score .fixture-penalty-score {
            color: #7d8794;
            font-size: .62rem;
        }

#competition-panel-fixtures .fixture-venue-cell {
    grid-area: venue;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-align: left;
    min-width: 0;
}

#competition-panel-fixtures .fixture-venue-name {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
    max-width: 100%;
    color: #4e7938;
    line-height: 1.45;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
    text-align: right;
    overflow-wrap: anywhere;
}

#competition-panel-fixtures .fixture-venue-label {
    color: #89939d;
    font-weight: 600;
    font-size: .64rem;
}

#competition-panel-fixtures .fixture-venue-unknown {
    color: #9ca3af;
}

#competition-panel-fixtures a.fixture-venue-name:hover {
    text-decoration: underline;
}

@media (max-width: 1120px) {
    #competition-panel-fixtures .fixture-match-editorial {
        grid-template-columns: minmax(95px, 1fr) minmax(0, 720px) minmax(95px, 1fr);
        gap: 12px;
        padding: 11px 14px;
    }

    #competition-panel-fixtures .fixture-matchup {
        grid-template-columns: minmax(0, 1fr) 86px minmax(0, 1fr);
        gap: 6px;
    }

        #competition-panel-fixtures .fixture-matchup .fixture-team-link {
            gap: 6px;
        }

        #competition-panel-fixtures .fixture-matchup .fixture-team-logo {
            flex-basis: 32px;
            width: 32px;
            height: 32px;
        }
}

@media (max-width: 800px) {
    #competition-panel-fixtures .competition-fixture-group-matches {
        padding: 8px 10px 12px;
    }

    #competition-panel-fixtures .fixture-matchday-heading {
        min-height: 43px;
        padding: 9px 12px;
        font-size: .82rem;
    }

    #competition-panel-fixtures .fixture-match-editorial {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas: "matchup matchup" "meta venue";
        gap: 7px 12px;
        padding: 13px 9px;
        min-height: 104px;
    }

    #competition-panel-fixtures .fixture-matchup {
        grid-template-columns: minmax(0, 1fr) 88px minmax(0, 1fr);
    }

    #competition-panel-fixtures .fixture-match-meta {
        flex-direction: row;
        align-items: center;
        gap: 10px;
        justify-self: start;
    }

    #competition-panel-fixtures .fixture-venue-cell {
        justify-content: flex-end;
    }

    #competition-panel-fixtures .fixture-venue-name {
        flex-direction: row;
        align-items: baseline;
        gap: 5px;
        font-size: .68rem;
    }
}

@media (max-width: 500px) {
    #competition-panel-fixtures .competition-fixture-header--editorial {
        padding: 12px;
    }

    #competition-panel-fixtures .fixture-match-editorial {
        padding: 11px 3px;
        gap: 7px;
    }

    #competition-panel-fixtures .fixture-matchup {
        grid-template-columns: minmax(0, 1fr) 66px minmax(0, 1fr);
        gap: 4px;
    }

        #competition-panel-fixtures .fixture-matchup .fixture-team-link strong {
            font-size: .72rem;
            line-height: 1.4;
        }

        #competition-panel-fixtures .fixture-matchup .fixture-team-link {
            gap: 4px;
        }

        #competition-panel-fixtures .fixture-matchup .fixture-team-logo {
            flex-basis: 26px;
            width: 26px;
            height: 26px;
        }

        #competition-panel-fixtures .fixture-matchup .fixture-match-score .fixture-score-numbers {
            font-size: .93rem;
            gap: 3px;
        }

        #competition-panel-fixtures .fixture-matchup .fixture-match-score > small {
            font-size: .55rem;
        }

    #competition-panel-fixtures .fixture-venue-name {
        font-size: .65rem;
    }

    #competition-panel-fixtures .fixture-match-meta .fixture-status {
        font-size: .63rem;
        padding: 4px 7px;
    }

    #competition-panel-fixtures .fixture-kickoff-time {
        font-size: .67rem;
    }
}


/* ==============================================================
   SMART FIXTURE TIMELINE | Current week on opening; newer rounds
   above, previously played rounds below. Independent scroll area.
   =============================================================== */
#competition-panel-fixtures #competitionFixturesList {
    display: block;
    max-height: min(70vh, 720px);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    scrollbar-gutter: stable;
    padding: 4px 7px 8px;
    scroll-behavior: auto;
}

    #competition-panel-fixtures #competitionFixturesList > .competition-fixture-group {
        margin-bottom: 16px;
    }

        #competition-panel-fixtures #competitionFixturesList > .competition-fixture-group:last-child {
            margin-bottom: 0;
        }

#competition-panel-fixtures .competition-fixture-group[data-current-fixture="true"] {
    border-color: #86ab72;
    box-shadow: 0 0 0 1px rgba(91, 140, 59, .14), 0 6px 22px rgba(40, 80, 35, .07);
}

#competition-panel-fixtures .fixture-group-header-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}

#competition-panel-fixtures .fixture-current-indicator {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    min-height: 29px;
    font-size: .72rem;
    font-weight: 850;
    line-height: 1.2;
    border-radius: 999px;
    background: #e9f4e3;
    color: #376522;
    white-space: nowrap;
}

@media (max-width: 640px) {
    #competition-panel-fixtures #competitionFixturesList {
        max-height: min(70dvh, 610px);
        padding-inline: 2px;
    }

    #competition-panel-fixtures .fixture-current-indicator {
        font-size: .66rem;
        padding: 4px 7px;
    }
}

/* ========================================================================
   GEDIAN 2026 | CompetitionDetails two-card editorial sports profile
   The existing stylesheet, tables and fixture layouts remain intact.
   All new rules are scoped to the rebuilt hero/content card, so older
   .competition-profile-sketch responsive overrides cannot leak into it.
   ======================================================================== */
.competition-page {
    --competition-editorial-font: "Cairo", "Tajawal", Arial, sans-serif;
    --competition-hero-ink: #ffffff;
}

    .competition-page .competition-hero-card {
        position: relative;
        overflow: hidden;
        margin-bottom: 18px;
        border: 1px solid rgba(46, 91, 38, .15);
        border-radius: 24px;
        background: #173b2b;
        box-shadow: 0 20px 52px rgba(16, 48, 34, .19);
        isolation: isolate;
        font-family: var(--competition-editorial-font);
    }

        .competition-page .competition-hero-card .competition-cover {
            height: auto;
            min-height: 388px;
            overflow: hidden;
            background: radial-gradient(circle at 17% 21%, rgba(176, 224, 126, .26), transparent 32%), radial-gradient(circle at 81% 87%, rgba(115, 175, 68, .21), transparent 44%), linear-gradient(110deg, #122f23, #274e32 55%, #152b21);
        }

        .competition-page .competition-hero-card .competition-cover-image {
            position: absolute;
            inset: 0;
            z-index: 0;
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: center;
        }

        .competition-page .competition-hero-card .competition-cover-shade {
            position: absolute;
            z-index: 1;
            inset: 0;
            background: linear-gradient(90deg, rgba(8, 29, 18, .79), rgba(12, 35, 24, .50) 50%, rgba(6, 26, 15, .80)), linear-gradient(to top, rgba(7, 27, 19, .91), transparent 66%);
            pointer-events: none;
        }

    .competition-page .competition-hero-inner {
        position: relative;
        z-index: 2;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        min-height: 388px;
        padding: clamp(24px, 3vw, 42px) clamp(18px, 3vw, 38px) 26px;
        color: #fff;
    }

    .competition-page .competition-hero-top {
        display: grid;
        grid-template-columns: 126px minmax(0, 1fr);
        align-items: start;
        gap: clamp(16px, 2.3vw, 30px);
        width: 100%;
    }

    .competition-page .competition-hero-logo {
        display: grid;
        place-items: center;
        width: 126px;
        height: 126px;
        border: 4px solid rgba(255,255,255,.85);
        border-radius: 50%;
        background: rgba(255,255,255,.97);
        box-shadow: 0 13px 34px rgba(0,0,0,.28);
        color: #39622b;
        text-decoration: none;
        overflow: hidden;
        transition: transform .2s ease;
    }

        .competition-page .competition-hero-logo:hover {
            transform: translateY(-3px);
        }

        .competition-page .competition-hero-logo img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            padding: 9px;
        }

    .competition-page .competition-hero-logo-fallback {
        display: grid;
        place-items: center;
        width: 100%;
        height: 100%;
        font-weight: 900;
        font-size: 3rem;
    }

    .competition-page .competition-hero-copy {
        min-width: 0;
        padding-top: 5px;
    }

    .competition-page .competition-hero-season {
        display: inline-flex;
        align-items: center;
        min-height: 27px;
        padding: 3px 12px;
        margin-bottom: 8px;
        border: 1px solid rgba(255,255,255,.43);
        border-radius: 999px;
        background: rgba(8, 26, 17, .25);
        color: rgba(255,255,255,.95);
        font: 800 .77rem/1.4 var(--competition-editorial-font);
        letter-spacing: .015em;
    }

    .competition-page .competition-hero-copy h1 {
        margin: 0 0 7px;
        max-width: 780px;
        color: #fff;
        font: 900 clamp(1.65rem, 3.1vw, 2.8rem)/1.5 var(--competition-editorial-font);
        text-shadow: 0 3px 18px rgba(0,0,0,.5);
        overflow-wrap: anywhere;
    }

    .competition-page .competition-hero-copy .competition-organizer-link {
        display: inline-flex;
        color: #f3f8f0;
        font: 700 clamp(.86rem, 1.35vw, 1.02rem)/1.55 var(--competition-editorial-font);
        text-decoration: none;
        text-shadow: 0 2px 12px rgba(0,0,0,.4);
    }

    .competition-page .competition-hero-copy a.competition-organizer-link:hover {
        color: #e5ffc6;
        text-decoration: underline;
    }
    /* A single row of translucent, capsule-shaped social controls. */
    .competition-page .competition-hero-copy .competition-gedian-social-actions {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 9px;
        margin: 18px 0 0;
        width: auto;
        min-width: 0;
    }

    .competition-page .competition-hero-copy .competition-social-form {
        margin: 0;
        padding: 0;
    }

    .competition-page .competition-hero-copy .competition-followers-stat,
    .competition-page .competition-hero-copy .competition-follow-button,
    .competition-page .competition-hero-copy .competition-like-button {
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 8px;
        height: 39px;
        min-height: 39px;
        padding: 7px 17px;
        margin: 0;
        border-radius: 999px;
        border: 1px solid rgba(255,255,255,.44);
        background: rgba(16, 42, 29, .44);
        color: #fff;
        font: 800 .8rem/1.4 var(--competition-editorial-font);
        box-shadow: none;
        backdrop-filter: blur(9px);
        cursor: pointer;
        white-space: nowrap;
    }

    .competition-page .competition-hero-copy .competition-followers-stat {
        cursor: default;
    }

        .competition-page .competition-hero-copy .competition-followers-stat small,
        .competition-page .competition-hero-copy .competition-followers-stat strong,
        .competition-page .competition-hero-copy .competition-like-button strong {
            color: #fff;
            margin: 0;
            font-size: .8rem;
            line-height: 1.4;
        }

    .competition-page .competition-hero-copy .competition-follow-button:hover,
    .competition-page .competition-hero-copy .competition-like-button:hover {
        border-color: rgba(255,255,255,.8);
        background: rgba(48, 109, 54, .78);
        color: #fff;
    }

    .competition-page .competition-hero-copy .competition-follow-button.is-following,
    .competition-page .competition-hero-copy .competition-like-button.is-liked {
        background: rgba(76, 139, 47, .80);
        border-color: rgba(200, 241, 175, .7);
        color: #fff;
    }
    /* Manager: anchored in the LEFT end of the statistics row in RTL. */
    .competition-page .competition-hero-managers {
        display: flex;
        justify-content: center;
        align-self: end;
        width: 100%;
        min-width: 0;
        padding-inline-start: 12px;
        border-inline-start: 1px solid rgba(255,255,255,.38);
        color: #fff;
    }

    .competition-page .competition-hero-manager-slider {
        width: 100%;
        min-width: 0;
    }

    .competition-page .competition-hero-manager-viewport {
        min-height: 108px;
    }

    .competition-page .competition-hero-manager-slide {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 5px;
        color: #fff;
    }

        .competition-page .competition-hero-manager-slide[hidden],
        .competition-page .competition-hero-manager-slide:not(.is-active) {
            display: none !important;
        }

    .competition-page .competition-hero-manager-avatar {
        width: 64px;
        height: 64px;
        display: grid;
        place-items: center;
        overflow: hidden;
        border: 2px solid rgba(255,255,255,.85);
        border-radius: 50%;
        background: #f3f7ef;
        box-shadow: 0 9px 24px rgba(0,0,0,.26);
        color: #47702f;
        text-decoration: none;
    }

        .competition-page .competition-hero-manager-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .competition-page .competition-hero-manager-avatar > span {
            display: grid;
            place-items: center;
            width: 100%;
            height: 100%;
            font: 900 1.6rem/1 var(--competition-editorial-font);
        }

    .competition-page .competition-hero-manager-label {
        color: rgba(246, 251, 242, .79);
        font: 700 .69rem/1.4 var(--competition-editorial-font);
    }

    .competition-page .competition-hero-manager-name {
        display: block;
        max-width: 145px;
        color: #fff;
        font: 800 .71rem/1.4 var(--competition-editorial-font);
        overflow-wrap: anywhere;
        text-shadow: 0 2px 9px rgba(0,0,0,.5);
    }

    .competition-page .competition-hero-manager-dots {
        display: flex;
        justify-content: center;
        gap: 7px;
        margin-top: 9px;
    }

    .competition-page .competition-hero-manager-dot {
        width: 7px;
        height: 7px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: rgba(255,255,255,.44);
        cursor: pointer;
    }

        .competition-page .competition-hero-manager-dot[aria-current="true"] {
            width: 18px;
            border-radius: 99px;
            background: #e1f8bf;
        }

        .competition-page .competition-hero-manager-dot:focus-visible,
        .competition-page .competition-hero-copy button:focus-visible {
            outline: 3px solid #e4f5bb;
            outline-offset: 3px;
        }
    /* Single lower banner row: lightweight numbers at RIGHT, manager at LEFT. */
    .competition-page .competition-hero-bottom {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 120px;
        align-items: end;
        gap: 12px;
        width: 100%;
        margin-top: 21px;
        padding-top: 13px;
        border-top: 1px solid rgba(255,255,255,.3);
    }

    .competition-page .competition-hero-statistics {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        align-items: end;
        width: 100%;
        min-width: 0;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .competition-page .competition-hero-stat {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        min-width: 0;
        gap: 2px;
        padding: 3px 5px;
        text-align: center;
    }

        .competition-page .competition-hero-stat + .competition-hero-stat {
            border-inline-start: 1px solid rgba(255,255,255,.38);
        }

        .competition-page .competition-hero-stat strong {
            color: #fff;
            font: 900 clamp(.94rem, 1.3vw, 1.14rem)/1.3 var(--competition-editorial-font);
            font-variant-numeric: tabular-nums;
        }

        .competition-page .competition-hero-stat:last-child strong {
            font-size: clamp(.77rem, 1.05vw, .91rem);
        }

        .competition-page .competition-hero-stat span {
            color: rgba(255,255,255,.91);
            font: 700 clamp(.62rem, .77vw, .7rem)/1.4 var(--competition-editorial-font);
        }
    /* Second and LAST major outer card: pill selector + all original sections. */
    .competition-page .competition-body-card {
        overflow: hidden;
        border: 1px solid var(--competition-border);
        border-radius: 23px;
        background: #fff;
        box-shadow: 0 12px 30px rgba(24, 50, 29, .065);
        padding: 16px;
        min-width: 0;
    }

        .competition-page .competition-body-card .competition-tabs {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-start;
            align-items: center;
            gap: 8px;
            width: 100%;
            padding: 7px;
            margin: 0;
            border: 0;
            border-radius: 999px;
            background: #eff5eb;
            box-shadow: none;
            overflow: visible;
        }

        .competition-page .competition-body-card .competition-tab-button {
            flex: 1 1 auto;
            min-width: 135px;
            min-height: 44px;
            padding: 9px 19px;
            border: 0;
            border-radius: 999px;
            background: transparent;
            box-shadow: none;
            color: #435845;
            font: 800 .85rem/1.5 var(--competition-editorial-font);
            white-space: nowrap;
            transition: background .17s ease, color .17s ease, box-shadow .17s ease;
        }

            .competition-page .competition-body-card .competition-tab-button:hover {
                background: #dcebd3;
                color: #315b27;
            }

            .competition-page .competition-body-card .competition-tab-button.is-active,
            .competition-page .competition-body-card .competition-tab-button[aria-selected="true"] {
                background: #4c7d30;
                color: #fff;
                box-shadow: 0 5px 14px rgba(65, 110, 43, .18);
            }

            .competition-page .competition-body-card .competition-tab-button:focus-visible {
                outline: 3px solid #89bb6a;
                outline-offset: 2px;
            }

        .competition-page .competition-body-card .competition-tab-panels {
            margin: 0;
            padding: 14px 4px 2px;
            min-width: 0;
        }

        .competition-page .competition-body-card .competition-tab-panel {
            min-width: 0;
        }

        .competition-page .competition-body-card .competition-content-card {
            min-width: 0;
            padding: 14px 8px;
            border: 0;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
        }

            .competition-page .competition-body-card .competition-content-card + .competition-content-card {
                border-top: 1px solid #ecf0e9;
            }

        .competition-page .competition-body-card .competition-section-heading h2 {
            font-family: var(--competition-editorial-font);
            font-weight: 900;
        }

@media (max-width: 1050px) {
    .competition-page .competition-hero-top {
        grid-template-columns: 100px minmax(0,1fr);
        gap: 17px;
    }

    .competition-page .competition-hero-logo {
        width: 100px;
        height: 100px;
    }

    .competition-page .competition-hero-bottom {
        grid-template-columns: minmax(0,1fr) 110px;
        gap: 8px;
    }

    .competition-page .competition-hero-manager-viewport {
        min-height: 103px;
    }

    .competition-page .competition-hero-statistics {
        grid-template-columns: repeat(3,minmax(0,1fr));
        row-gap: 10px;
    }

    .competition-page .competition-hero-stat:nth-child(4) {
        border-inline-start: 0;
    }

    .competition-page .competition-hero-stat strong {
        font-size: 1.02rem;
    }
}

@media (max-width: 680px) {
    .competition-page .competition-hero-card {
        border-radius: 17px;
        margin-bottom: 12px;
    }

    .competition-page .competition-hero-inner {
        min-height: 0;
        padding: 18px 14px 18px;
    }

    .competition-page .competition-hero-top {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }

    .competition-page .competition-hero-logo {
        grid-column: 1;
        grid-row: 1;
        width: 82px;
        height: 82px;
        border-width: 3px;
        justify-self: start;
    }

    .competition-page .competition-hero-manager-avatar {
        width: 57px;
        height: 57px;
        border-width: 2px;
    }

    .competition-page .competition-hero-manager-viewport {
        min-height: 102px;
    }

    .competition-page .competition-hero-manager-name {
        font-size: .67rem;
    }

    .competition-page .competition-hero-managers {
        padding-inline-start: 7px;
    }

    .competition-page .competition-hero-bottom {
        grid-template-columns: minmax(0,1fr) 94px;
        gap: 7px;
        margin-top: 17px;
        padding-top: 11px;
    }

    .competition-page .competition-hero-copy {
        grid-column: 1 / -1;
        grid-row: 2;
        padding: 0;
    }

        .competition-page .competition-hero-copy h1 {
            font-size: clamp(1.45rem, 6vw, 2rem);
            line-height: 1.55;
        }

        .competition-page .competition-hero-copy .competition-gedian-social-actions {
            margin-top: 14px;
            gap: 7px;
        }

        .competition-page .competition-hero-copy .competition-followers-stat,
        .competition-page .competition-hero-copy .competition-follow-button,
        .competition-page .competition-hero-copy .competition-like-button {
            min-height: 35px;
            height: 35px;
            padding: 6px 11px;
            font-size: .72rem;
        }

    .competition-page .competition-hero-statistics {
        margin: 0;
        padding: 0;
        grid-template-columns: repeat(2,minmax(0,1fr));
        row-gap: 8px;
    }

    .competition-page .competition-hero-stat {
        padding: 4px 3px;
    }

        .competition-page .competition-hero-stat:nth-child(odd) {
            border-inline-start: 0;
        }

        .competition-page .competition-hero-stat:nth-child(even) {
            border-inline-start: 1px solid rgba(255,255,255,.38);
        }

        .competition-page .competition-hero-stat strong {
            font-size: .94rem;
        }

        .competition-page .competition-hero-stat:last-child strong {
            font-size: .75rem;
        }

        .competition-page .competition-hero-stat span {
            font-size: .62rem;
            line-height: 1.4;
        }

    .competition-page .competition-body-card {
        border-radius: 17px;
        padding: 9px;
    }

        .competition-page .competition-body-card .competition-tabs {
            border-radius: 18px;
            display: grid;
            grid-template-columns: repeat(2,minmax(0,1fr));
            gap: 5px;
        }

        .competition-page .competition-body-card .competition-tab-button {
            min-width: 0;
            min-height: 42px;
            padding: 7px 8px;
            font-size: .76rem;
        }

        .competition-page .competition-body-card .competition-tab-panels {
            padding: 9px 0 0;
        }

        .competition-page .competition-body-card .competition-content-card {
            padding: 10px 3px;
        }
}

@media (prefers-reduced-motion: reduce) {
    .competition-page .competition-hero-logo,
    .competition-page .competition-body-card .competition-tab-button {
        transition: none;
    }
}


/* ========================================================================
   GEDIAN 2026 | FINAL COMPETITION PROFILE REFINEMENTS
   Banner: transparent in the absence of a competition photograph;
   no visual grid or divider rules around statistics / manager.
   The photograph itself (when uploaded) remains visible with contrast shade.
   ======================================================================== */
.competition-page .competition-hero-card {
    background: transparent;
    border: 1px solid #cfddc8; /* Subtle outline of the MAIN banner card */
    box-shadow: none;
}

    .competition-page .competition-hero-card .competition-cover {
        background: transparent;
    }

        .competition-page .competition-hero-card .competition-cover.has-fallback::after {
            content: none;
            display: none;
        }

        .competition-page .competition-hero-card .competition-cover.has-fallback .competition-cover-shade {
            display: none;
        }

.competition-page .competition-hero-bottom {
    border-top: 0;
    padding-top: 0;
}

.competition-page .competition-hero-managers {
    border-inline-start: 0;
}

.competition-page .competition-hero-stat + .competition-hero-stat {
    border-inline-start: 0;
}
/* Preserve the line-free statistics on tablet/phone breakpoints. */
@media (max-width: 680px) {
    .competition-page .competition-hero-stat:nth-child(even),
    .competition-page .competition-hero-stat:nth-child(odd) {
        border-inline-start: 0;
    }
}
/* The original banner's white text must switch to legible dark ink when
   the background is transparent (no banner photo or image-load failure). */
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-inner,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy h1,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-organizer-link,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-stat strong,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-stat span,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-managers,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-manager-name,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-manager-label {
    color: #23362a;
    text-shadow: none;
}

.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-season {
    background: #edf5e8;
    border-color: #d9e8d0;
    color: #466f2d;
}

.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-followers-stat,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-follow-button,
.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-like-button {
    background: #edf5e8;
    border-color: #d6e5ce;
    color: #35562a;
    backdrop-filter: none;
}

    .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-followers-stat small,
    .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-followers-stat strong,
    .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-like-button strong {
        color: #35562a;
    }

    .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-follow-button.is-following,
    .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-like-button.is-liked {
        background: #4c7d30;
        border-color: #4c7d30;
        color: #fff;
    }

        .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-like-button.is-liked strong {
            color: #fff;
        }

    .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-follow-button:hover,
    .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-like-button:hover {
        background: #4c7d30;
        border-color: #4c7d30;
        color: #fff;
    }

        .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-copy .competition-like-button:hover strong {
            color: #fff;
        }

.competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-manager-dot {
    background: #c4d6b8;
}

    .competition-page .competition-hero-card .competition-cover.has-fallback .competition-hero-manager-dot[aria-current="true"] {
        background: #4c7d30;
    }
/* Exactly two visible match filter selectors (round / club) + Cancel. */
.competition-page #fixtureDateFilter[hidden] {
    display: none !important;
}

.competition-page .competition-body-card .fixture-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
}

@media (max-width: 760px) {
    .competition-page .competition-body-card .fixture-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .competition-page .competition-body-card .fixture-reset-button {
        grid-column: 1 / -1;
    }
}

@media (max-width: 480px) {
    .competition-page .competition-body-card .fixture-filters {
        grid-template-columns: 1fr;
    }

    .competition-page .competition-body-card .fixture-reset-button {
        grid-column: auto;
    }
}

/* The competition manager's name opens the same verified public profile as
   the avatar. A placeholder or unmapped account remains non-clickable. */
.competition-page .competition-hero-manager-name-link {
    text-decoration: none;
    text-underline-offset: 3px;
    cursor: pointer;
    transition: text-decoration-color .15s ease, opacity .15s ease;
}

    .competition-page .competition-hero-manager-name-link:hover {
        text-decoration: underline;
        text-decoration-thickness: 1px;
    }

    .competition-page .competition-hero-manager-name-link:focus-visible {
        border-radius: 4px;
        outline: 2px solid #b6e29c;
        outline-offset: 3px;
        text-decoration: underline;
    }

/* GEDIAN 2026-10-17: The six-statistics row was intentionally removed.
   Keep the competition manager at the lower-left without reserving any
   grid column for deleted statistics or reintroducing divider lines. */
.competition-page .competition-hero-card .competition-hero-bottom {
    display: flex;
    justify-content: flex-end; /* left edge in Arabic RTL */
    align-items: flex-end;
    width: 100%;
    margin-top: 12px;
    padding-top: 0;
    border: 0;
    gap: 0;
}

.competition-page .competition-hero-card .competition-hero-managers {
    flex: 0 1 158px;
    width: 158px;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    border: 0;
    align-self: flex-end;
}

@media (max-width: 680px) {
    .competition-page .competition-hero-card .competition-cover {
        min-height: 0;
        height: auto;
    }

    .competition-page .competition-hero-card .competition-hero-inner {
        min-height: 0;
    }

    .competition-page .competition-hero-card .competition-hero-bottom {
        margin-top: 8px;
        padding-top: 0;
    }

    .competition-page .competition-hero-card .competition-hero-managers {
        flex-basis: 124px;
        width: 124px;
    }
}

/* ================================================================
   GEDIAN | 2026-10-17 — Competition hero vertical optical alignment
   Move the logo, season, competition name, organizer, and social
   controls down together towards the manager on the left. The
   manager's bottom-left anchor and banner height stay unchanged.
   The mobile stacked layout intentionally keeps its original flow.
   ================================================================ */
@media (min-width: 1051px) {
    .competition-page .competition-hero-card .competition-hero-top {
        transform: translateY(32px);
    }
}

@media (min-width: 681px) and (max-width: 1050px) {
    .competition-page .competition-hero-card .competition-hero-top {
        transform: translateY(22px);
    }
}

/* ========================================================================
   GEDIAN | 2026-10-20 — Overview standings and bottom-aligned hero identity
   Existing second card, fixture selectors, and manager carousel unchanged.
   ======================================================================== */

/* The first tab is deliberately an at-a-glance, three-column standings list.
   The full statistics remain exclusively in تفاصيل المنافسة. */
.competition-page #competition-panel-info .competition-table.is-overview {
    width: 100%;
    min-width: 0;
    table-layout: auto;
}

    .competition-page #competition-panel-info .competition-table.is-overview .club-column {
        width: 74%;
        min-width: 0;
    }

    .competition-page #competition-panel-info .competition-table.is-overview th:not(.club-column),
    .competition-page #competition-panel-info .competition-table.is-overview td:not(.club-column) {
        width: 13%;
        min-width: 46px;
        font-variant-numeric: tabular-nums;
    }

    .competition-page #competition-panel-info .competition-table.is-overview .table-club-link {
        min-width: 0;
    }

        .competition-page #competition-panel-info .competition-table.is-overview .table-club-link strong {
            white-space: normal;
            overflow-wrap: anywhere;
            line-height: 1.5;
        }

/* Place both sides of the profile on the SAME bottom baseline.
   Arabic RTL: identity/logo on the right and manager on the far left.
   This replaces old desktop-only translateY offsets. */
.competition-page .competition-hero-card .competition-hero-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 158px;
    grid-template-rows: minmax(0, 1fr);
    align-items: end;
    column-gap: clamp(12px, 2.1vw, 26px);
    min-height: 388px;
    padding-block: clamp(20px, 2.6vw, 36px) 23px;
}

.competition-page .competition-hero-card .competition-hero-top {
    grid-column: 1;
    grid-row: 1;
    align-self: end;
    transform: none;
    min-width: 0;
}

.competition-page .competition-hero-card .competition-hero-bottom {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    display: flex;
    width: 100%;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.competition-page .competition-hero-card .competition-hero-managers {
    width: 100%;
    flex: 1 1 auto;
    max-width: 100%;
    min-width: 0;
}

.competition-page .competition-hero-card .competition-hero-copy {
    padding-top: 0;
}

    .competition-page .competition-hero-card .competition-hero-copy .competition-gedian-social-actions {
        margin-top: 15px;
    }

/* Keep mobile identity and interaction controls balanced with the manager.
   The narrow social controls can wrap; they remain anchored to the bottom
   of the same row as the manager, never obscured by absolute positioning. */
@media (max-width: 1050px) {
    .competition-page .competition-hero-card .competition-hero-inner {
        grid-template-columns: minmax(0, 1fr) 124px;
        column-gap: 12px;
    }
}

@media (max-width: 680px) {
    .competition-page .competition-hero-card .competition-hero-inner {
        grid-template-columns: minmax(0, 1fr) 92px;
        min-height: 315px;
        column-gap: 9px;
        padding: 21px 13px 16px;
    }

    .competition-page .competition-hero-card .competition-hero-top {
        display: flex;
        flex-direction: column;
        gap: 11px;
        align-items: flex-start;
        justify-content: flex-end;
        width: 100%;
    }

    .competition-page .competition-hero-card .competition-hero-logo {
        flex: 0 0 auto;
        width: 77px;
        height: 77px;
    }

    .competition-page .competition-hero-card .competition-hero-copy {
        width: 100%;
        min-width: 0;
    }

        .competition-page .competition-hero-card .competition-hero-copy h1 {
            font-size: clamp(1.08rem, 4.75vw, 1.43rem);
            line-height: 1.5;
        }

        .competition-page .competition-hero-card .competition-hero-copy .competition-gedian-social-actions {
            display: flex;
            gap: 6px;
            margin-top: 12px;
            align-items: center;
            justify-content: flex-start;
            flex-wrap: wrap;
        }

        .competition-page .competition-hero-card .competition-hero-copy .competition-followers-stat,
        .competition-page .competition-hero-card .competition-hero-copy .competition-follow-button,
        .competition-page .competition-hero-card .competition-hero-copy .competition-like-button {
            width: auto;
            min-width: 0;
            min-height: 33px;
            height: 33px;
            padding: 5px 9px;
            font-size: .68rem;
        }

        .competition-page .competition-hero-card .competition-hero-copy .competition-social-form {
            width: auto;
            flex: 0 0 auto;
        }

        .competition-page .competition-hero-card .competition-hero-copy .competition-followers-stat {
            flex: 0 0 auto;
        }

    .competition-page .competition-hero-card .competition-hero-managers {
        width: 100%;
        flex-basis: auto;
    }

    .competition-page .competition-hero-card .competition-hero-manager-name {
        max-width: 92px;
    }

    .competition-page #competition-panel-info .competition-table.is-overview th,
    .competition-page #competition-panel-info .competition-table.is-overview td {
        padding: 9px 5px;
    }
}

/* The round/club selectors each occupy ~30% of their previous desktop
   width, while the Cancel button keeps its original intrinsic size. */
.competition-page .competition-body-card .fixture-filters {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 9px;
}

.competition-page .competition-body-card .fixture-filter-control {
    flex: 0 1 clamp(112px, 11.8vw, 152px);
    width: clamp(112px, 11.8vw, 152px);
    max-width: 100%;
    min-width: 0;
}

.competition-page .competition-body-card .fixture-reset-button {
    flex: 0 0 auto;
    grid-column: auto;
    width: auto;
    margin: 0;
}

@media (max-width: 370px) {
    /* Extra upper breathing room on the smallest phones keeps the logo,
       competition identity, and buttons visually lower in the banner. */
    .competition-page .competition-hero-card .competition-hero-inner {
        min-height: 342px;
        padding-top: 46px;
    }

    .competition-page .competition-body-card .fixture-filter-control {
        flex: 1 1 calc(50% - 6px);
        width: calc(50% - 6px);
    }
}

/* ================================================================
   Smart stage-aware detailed competition tab — 2026-10-23
   All new rules scoped to the detailed tab; no changes elsewhere.
   ================================================================ */
#competition-panel-details .competition-smart-stages {
    gap: 14px;
}

#competition-panel-details .competition-smart-stage {
    background: #fff;
    border: 1px solid #dfe8d9;
    border-radius: 16px;
    overflow: hidden;
}

#competition-panel-details .competition-smart-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    list-style: none;
    user-select: none;
    padding: 14px 16px;
}

    #competition-panel-details .competition-smart-summary::-webkit-details-marker {
        display: none;
    }

    #competition-panel-details .competition-smart-summary::marker {
        content: "";
    }

    #competition-panel-details .competition-smart-summary:focus-visible {
        outline: 3px solid #5B8C3B;
        outline-offset: -3px;
    }

#competition-panel-details .competition-smart-stage-title {
    display: block;
    color: #173424;
    font-size: 1rem;
    font-weight: 900;
}

#competition-panel-details .competition-smart-summary-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

#competition-panel-details .competition-smart-kind {
    background: #eaf4e5;
    color: #476f34;
    border: 1px solid #d9e7cf;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 800;
    padding: 5px 12px;
}

#competition-panel-details .competition-smart-arrow {
    font-size: 1.45rem;
    font-weight: 900;
    line-height: 1;
    color: #476f34;
    transition: transform .2s;
}

#competition-panel-details .competition-smart-stage:not([open]) .competition-smart-arrow {
    transform: rotate(90deg);
}

#competition-panel-details .competition-smart-stage-body {
    padding: 0 13px 15px;
}

    #competition-panel-details .competition-smart-stage-body > .competition-table-scroll {
        margin-top: 14px;
    }

#competition-panel-details .competition-smart-group {
    padding: 16px 0 12px;
}

    #competition-panel-details .competition-smart-group + .competition-smart-group {
        border-top: 1px solid #edf0ea;
    }

    #competition-panel-details .competition-smart-group .competition-stage-detail-heading {
        margin: 0 0 10px;
    }

        #competition-panel-details .competition-smart-group .competition-stage-detail-heading h4 {
            font-weight: 900;
            font-size: .94rem;
        }

#competition-panel-details .competition-stage-table-scroll {
    max-width: 100%;
    overflow-x: auto;
    border-radius: 11px;
}

#competition-panel-details .competition-table.is-stage-smart {
    width: 100%;
    min-width: 830px;
    border-collapse: collapse;
    font-size: .83rem;
}

    #competition-panel-details .competition-table.is-stage-smart th {
        background: #f4f8f2;
        font-weight: 850;
        white-space: nowrap;
    }

    #competition-panel-details .competition-table.is-stage-smart th,
    #competition-panel-details .competition-table.is-stage-smart td {
        padding: 11px 9px;
        text-align: center;
    }

        #competition-panel-details .competition-table.is-stage-smart th.club-column,
        #competition-panel-details .competition-table.is-stage-smart td.club-column {
            text-align: right;
            min-width: 175px;
        }

#competition-panel-details .competition-smart-next {
    font-weight: 750;
    color: #47782f;
    white-space: nowrap;
}

    #competition-panel-details .competition-smart-next:hover {
        text-decoration: underline;
    }

#competition-panel-details .competition-smart-note {
    margin-top: 12px;
    padding: 12px 15px;
    font-size: .82rem;
    color: #775c23;
    background: #fffaf0;
    border: 1px solid #ebdfbe;
    border-radius: 12px;
}

#competition-panel-details .competition-smart-knockout {
    display: grid;
    gap: 20px;
    padding: 16px 0 2px;
}

#competition-panel-details .competition-smart-round {
    display: grid;
    gap: 11px;
}

    #competition-panel-details .competition-smart-round h4 {
        font-size: .96rem;
        font-weight: 900;
        color: #233e26;
        margin: 0 3px;
    }

#competition-panel-details .competition-smart-ties {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(min(100%,385px),1fr));
    gap: 12px;
}

#competition-panel-details .competition-smart-tie {
    border: 1px solid #e1e9de;
    border-radius: 13px;
    overflow: hidden;
    background: #fff;
}

#competition-panel-details .competition-smart-tie-top {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
    align-items: center;
    gap: 8px;
    padding: 15px 11px;
    background: #f9fbf8;
}

#competition-panel-details .competition-smart-team {
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 5px;
    text-align: center;
    min-width: 0;
    color: #1f2937;
}

#competition-panel-details .competition-smart-team-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    color: inherit;
    text-align: center;
    min-width: 0;
    font-weight: 650;
}

    #competition-panel-details .competition-smart-team-link img {
        width: 35px;
        height: 35px;
        object-fit: contain;
    }

#competition-panel-details .competition-smart-team.is-qualified,
#competition-panel-details .competition-smart-team.is-qualified .competition-smart-team-link {
    font-weight: 950;
    color: #426e2c;
}

#competition-panel-details .competition-smart-team.is-eliminated,
#competition-panel-details .competition-smart-team.is-eliminated .competition-smart-team-link {
    font-weight: 500;
    color: #8e9893;
    text-decoration: line-through;
    text-decoration-thickness: 1px;
}

#competition-panel-details .competition-smart-qualified-label {
    color: #3f7429;
    background: #eaf4e5;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 850;
    padding: 3px 9px;
    text-decoration: none;
}

#competition-panel-details .competition-smart-tie-score {
    display: grid;
    justify-items: center;
    gap: 3px;
    min-width: 68px;
}

    #competition-panel-details .competition-smart-tie-score strong {
        font-weight: 950;
        font-size: 1.4rem;
        white-space: nowrap;
        color: #182e28;
    }

    #competition-panel-details .competition-smart-tie-score small {
        font-size: .66rem;
        color: #708177;
        white-space: nowrap;
    }

#competition-panel-details .competition-smart-leg-list {
    display: grid;
    border-top: 1px solid #e5ebe4;
}

#competition-panel-details .competition-smart-leg {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    padding: 9px 12px;
    color: #395042;
    font-size: .75rem;
}

    #competition-panel-details .competition-smart-leg:hover {
        background: #f3f9f0;
    }

    #competition-panel-details .competition-smart-leg + .competition-smart-leg {
        border-top: 1px solid #eef1ed;
    }

    #competition-panel-details .competition-smart-leg strong {
        font-weight: 900;
        color: #1b3127;
    }

#competition-panel-details .competition-smart-match-status {
    color: #738577;
}

@media(max-width:600px) {
    #competition-panel-details .competition-smart-summary {
        padding: 12px 10px;
    }

    #competition-panel-details .competition-smart-kind {
        padding: 4px 8px;
        font-size: .67rem;
    }

    #competition-panel-details .competition-smart-stage-body {
        padding: 0 8px 12px;
    }

    #competition-panel-details .competition-smart-ties {
        grid-template-columns: minmax(0,1fr);
    }

    #competition-panel-details .competition-smart-tie-top {
        gap: 5px;
        padding: 12px 6px;
    }

    #competition-panel-details .competition-smart-team-link {
        font-size: .81rem;
    }

    #competition-panel-details .competition-smart-tie-score strong {
        font-size: 1.16rem;
    }

    #competition-panel-details .competition-table.is-stage-smart {
        min-width: 790px;
    }
}

@media(prefers-reduced-motion:reduce) {
    #competition-panel-details .competition-smart-arrow {
        transition: none;
    }
}

/* Unknown stages must remain visibly unconfigured, not silently treated as league. */
.competition-page .competition-smart-unconfigured {
    margin: 12px 16px 18px;
    padding: 15px 17px;
    border: 1px dashed #e1cc99;
    border-radius: 13px;
    background: #fffaf1;
    color: #75561c;
    font-size: .85rem;
    line-height: 1.9;
}

/* Future-stage entrance positions. Read-only qualification preview. */
#competition-panel-details .competition-incoming-stages {
    display: grid;
    gap: 16px;
    padding: 18px 16px 4px;
}

#competition-panel-details .competition-incoming-group {
    border: 1px solid #dce9d2;
    border-radius: 15px;
    background: linear-gradient(135deg, #f5f9f1 0%, #ffffff 80%);
    padding: 16px;
}

#competition-panel-details .competition-incoming-group-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

    #competition-panel-details .competition-incoming-group-heading h4 {
        margin: 0;
        font-size: 1.03rem;
        font-weight: 800;
        color: #315628;
    }

#competition-panel-details .competition-incoming-pending {
    border-radius: 999px;
    background: #fef2d7;
    color: #835915;
    padding: 5px 12px;
    font-weight: 700;
    font-size: .79rem;
}

#competition-panel-details .competition-incoming-caption {
    color: #647165;
    line-height: 1.8;
    margin: 8px 0 14px;
    font-size: .88rem;
}

#competition-panel-details .competition-incoming-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
    gap: 10px;
}

#competition-panel-details .competition-incoming-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 5px 12px;
    border: 1px solid #e4ecdf;
    border-radius: 11px;
    padding: 12px 14px;
    background: #fff;
    min-width: 0;
}

#competition-panel-details .competition-incoming-code {
    grid-row: span 2;
    background: #e6f0df;
    color: #315628;
    border-radius: 8px;
    padding: 9px 10px;
    min-width: 44px;
    text-align: center;
    font-size: 1.05rem;
}

#competition-panel-details .competition-incoming-path {
    color: #233527;
    font-size: .88rem;
    line-height: 1.65;
    overflow-wrap: anywhere;
}

#competition-panel-details .competition-incoming-status {
    color: #856022;
    font-size: .78rem;
}

#competition-panel-details .competition-incoming-table-note {
    border: 1px dashed #d9e5d2;
    border-radius: 11px;
    padding: 12px 15px;
    margin: 12px 16px 16px;
    background: #f9fcf6;
    color: #60765a;
    line-height: 1.9;
    font-size: .87rem;
}

/* ================================================================
   Incoming-slot layout adjustment (2026-10-24).
   Non-knockout stages: one slot card per line at all widths.
   Knockout/final stages: two consecutive configured slots VS each other.
   These are placeholders, not confirmed clubs or published fixtures.
   ================================================================ */
#competition-panel-details .competition-incoming-list.is-single-column,
#competition-panel-details .competition-incoming-list.is-versus-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 11px;
    width: 100%;
}

#competition-panel-details .competition-incoming-versus-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: stretch;
    gap: 12px;
    min-width: 0;
    width: 100%;
}

#competition-panel-details .competition-incoming-versus-entrant {
    align-self: stretch;
    min-width: 0;
}

#competition-panel-details .competition-incoming-versus-label {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: 1.05rem;
    letter-spacing: .04em;
    color: #466f2d;
    min-width: 34px;
}

#competition-panel-details .competition-incoming-versus-entrant.is-awaiting-opponent {
    color: #6b7280;
    background: #fbfcfa;
    border-style: dashed;
    justify-content: center;
}

@media (max-width: 600px) {
    #competition-panel-details .competition-incoming-versus-row {
        gap: 6px;
    }

    #competition-panel-details .competition-incoming-versus-entrant {
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
        padding: 9px 7px;
    }

        #competition-panel-details .competition-incoming-versus-entrant .competition-incoming-code {
            grid-row: auto;
            justify-self: start;
            min-width: 0;
            padding: 6px 7px;
            font-size: .9rem;
        }

        #competition-panel-details .competition-incoming-versus-entrant .competition-incoming-path {
            font-size: .78rem;
        }

        #competition-panel-details .competition-incoming-versus-entrant .competition-incoming-status {
            font-size: .7rem;
        }

    #competition-panel-details .competition-incoming-versus-label {
        min-width: 23px;
        font-size: .85rem;
    }
}

/* ================================================================
   Public display of assigned clubs in pending downstream slots.
   Keeps the established single-column / VS stage layouts unchanged.
   ================================================================ */
#competition-panel-details .competition-incoming-item.has-assigned-club {
    border-color: #c3dcb7;
    background: linear-gradient(115deg, #fbfef9 0%, #f0f7e9 100%);
    box-shadow: 0 2px 8px rgba(70, 111, 45, .045);
}

#competition-panel-details .competition-incoming-club {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

#competition-panel-details .competition-incoming-club-logo,
#competition-panel-details .competition-incoming-club-initial {
    width: 40px;
    height: 40px;
    min-width: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dbead3;
    border-radius: 50%;
    background: #fff;
}

#competition-panel-details .competition-incoming-club-logo {
    object-fit: contain;
    padding: 4px;
}

#competition-panel-details .competition-incoming-club-initial {
    font-weight: 800;
    font-size: 1.05rem;
    color: #466f2d;
}

#competition-panel-details .competition-incoming-club-name {
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.55;
    color: #25491c;
    text-decoration: none;
    overflow-wrap: anywhere;
    min-width: 0;
}

    #competition-panel-details .competition-incoming-club-name:hover,
    #competition-panel-details .competition-incoming-club-name:focus-visible {
        color: #305c20;
        text-decoration: underline;
    }

#competition-panel-details .competition-incoming-status.is-club {
    color: #466f2d;
    font-weight: 700;
}

@media (max-width: 600px) {
    #competition-panel-details .competition-incoming-club {
        gap: 7px;
    }

    #competition-panel-details .competition-incoming-club-logo,
    #competition-panel-details .competition-incoming-club-initial {
        width: 32px;
        height: 32px;
        min-width: 32px;
    }

    #competition-panel-details .competition-incoming-club-name {
        font-size: .86rem;
    }
}


/* ================================================================
   PUBLIC MATCH CONFIGURATIONS / CompetitionDetails - visual journey
   Scoped to the new sections, no changes to existing fixture filters.
   ================================================================ */
.competition-page .gs-public-plans {
    margin: 0 0 24px;
    border: 1px solid #dae6d3;
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
}

.competition-page .gs-public-plans-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    background: linear-gradient(120deg,#f0f7eb,#fff);
    border-bottom: 1px solid #e0ead9;
}

    .competition-page .gs-public-plans-heading h2 {
        margin: 4px 0 0;
        color: #315322;
        font-size: 1.14rem;
        font-weight: 850;
    }

    .competition-page .gs-public-plans-heading p {
        margin: 6px 0 0;
        font-size: .85rem;
        color: #64736b;
    }

.competition-page .gs-public-plans-kicker {
    color: #63864d;
    font-size: .73rem;
    font-weight: 800;
}

.competition-page .gs-public-plans-total {
    flex-shrink: 0;
    border-radius: 999px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #d2e4ca;
    font-size: .82rem;
    color: #456e2e;
    font-weight: 800;
}

.competition-page .gs-plan-stage-table {
    margin: 16px;
    border: 1px solid #e2e9dd;
    border-radius: 14px;
    overflow: hidden;
}

    .competition-page .gs-plan-stage-table > h3 {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 11px 15px;
        margin: 0;
        font-size: 1.02rem;
        color: #314d27;
        background: #f7faf5;
    }

.competition-page .gs-plan-stage-order {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    border-radius: 10px;
    background: #5B8C3B;
    color: white;
    font-weight: 900;
}

.competition-page .gs-plan-table-group {
    padding: 12px 14px 16px;
}

    .competition-page .gs-plan-table-group + .gs-plan-table-group {
        border-top: 1px solid #e8ece6;
    }

    .competition-page .gs-plan-table-group h4 {
        display: flex;
        align-items: center;
        gap: 9px;
        font-size: .98rem;
        color: #344237;
        font-weight: 800;
        margin: 2px 0 11px;
    }

        .competition-page .gs-plan-table-group h4 small {
            font-size: .72rem;
            color: #65815a;
            font-weight: 700;
        }

.competition-page .gs-plan-table-scroll {
    max-width: 100%;
    overflow-x: auto;
    border: 1px solid #e7ede3;
    border-radius: 11px;
}

.competition-page .gs-plan-table {
    width: 100%;
    min-width: 860px;
    border-collapse: collapse;
    font-size: .82rem;
}

    .competition-page .gs-plan-table th {
        padding: 11px 12px;
        white-space: nowrap;
        background: #f3f8ef;
        color: #4b6b3b;
        font-weight: 850;
        text-align: right;
    }

    .competition-page .gs-plan-table td {
        padding: 12px;
        border-top: 1px solid #ecf0ea;
        color: #344336;
        vertical-align: middle;
    }

    .competition-page .gs-plan-table tr:hover td {
        background: #fbfdf9;
    }

.competition-page .gs-plan-code {
    direction: ltr;
    text-align: center;
    font-weight: 850;
    color: #395f23 !important;
}

.competition-page .gs-plan-vs {
    color: #537e39 !important;
    font-weight: 900;
    text-align: center;
}

.competition-page .gs-plan-cell-participant {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px 8px;
    min-width: 180px;
}

    .competition-page .gs-plan-cell-participant img {
        height: 24px;
        width: 24px;
        object-fit: contain;
        border-radius: 50%;
    }

    .competition-page .gs-plan-cell-participant a {
        color: #345e27;
        text-decoration: none;
        font-weight: 800;
    }

        .competition-page .gs-plan-cell-participant a:hover {
            text-decoration: underline;
        }

    .competition-page .gs-plan-cell-participant > small {
        flex-basis: 100%;
        font-size: .69rem;
        color: #87918b;
    }

.competition-page .gs-plan-time {
    white-space: nowrap;
    font-size: .74rem;
}

.competition-page .gs-plan-status {
    display: block;
    color: #657664;
    font-size: .73rem;
    white-space: nowrap;
}

.competition-page .gs-plan-official-link {
    font-size: .73rem;
    font-weight: 800;
    color: #4e792d;
}

.competition-page .gs-public-journey-scroll {
    padding: 18px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scrollbar-color: #a9c39c #f6faf3;
}

.competition-page .gs-public-journey-canvas {
    position: relative;
    width: max-content;
    min-height: 220px;
}

.competition-page .gs-public-journey-stages {
    display: flex;
    align-items: stretch;
    flex-direction: row;
    gap: 70px;
    width: max-content;
    position: relative;
    z-index: 2;
}

.competition-page .gs-public-journey-stage {
    width: 265px;
    flex: 0 0 265px;
    background: #f9fbf7;
    border: 1px solid #e1e9dc;
    border-radius: 16px;
    overflow: hidden;
}

.competition-page .gs-public-journey-stage-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px;
    color: #315222;
    border-bottom: 1px solid #e3ebdc;
    background: #edf5e8;
}

    .competition-page .gs-public-journey-stage-head h3 {
        margin: 0;
        font-size: 1rem;
        font-weight: 850;
    }

    .competition-page .gs-public-journey-stage-head small {
        color: #63765a;
        font-size: .76rem;
    }

.competition-page .gs-public-journey-group {
    padding: 12px;
}

    .competition-page .gs-public-journey-group + .gs-public-journey-group {
        border-top: 1px solid #e0e8dc;
    }

    .competition-page .gs-public-journey-group h4 {
        margin: 2px 0 12px;
        color: #51664b;
        font-size: .85rem;
        font-weight: 850;
    }

.competition-page .gs-public-match-card {
    margin: 0 0 13px;
    background: white;
    border: 1px solid #dce7d5;
    border-radius: 13px;
    padding: 9px;
    box-shadow: 0 5px 12px rgba(41,74,24,.045);
    position: relative;
}

    .competition-page .gs-public-match-card:last-child {
        margin-bottom: 0;
    }

    .competition-page .gs-public-match-card > header {
        display: flex;
        justify-content: space-between;
        gap: 8px;
        padding: 2px 3px 9px;
        color: #486833;
    }

        .competition-page .gs-public-match-card > header strong {
            font-size: .82rem;
        }

        .competition-page .gs-public-match-card > header span {
            color: #839083;
            font-size: .68rem;
        }

.competition-page .gs-public-match-side {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    min-height: 41px;
    background: #f6f9f4;
    border-radius: 8px;
    padding: 7px;
}

    .competition-page .gs-public-match-side.has-club {
        background: #eff6e9;
    }

    .competition-page .gs-public-match-side small {
        flex: 0 0 auto;
        color: #789064;
        font-size: .73rem;
        font-weight: 800;
    }

    .competition-page .gs-public-match-side a, .competition-page .gs-public-match-side strong {
        flex: 1 1 110px;
        min-width: 0;
        overflow-wrap: anywhere;
        color: #294d25;
        text-decoration: none;
        font-weight: 800;
        font-size: .81rem;
    }

    .competition-page .gs-public-match-side img {
        height: 23px;
        width: 23px;
        object-fit: contain;
        border-radius: 50%;
    }

.competition-page .gs-public-card-vs {
    display: block;
    text-align: center;
    font-size: .65rem;
    font-weight: 900;
    color: #7da763;
    padding: 3px 0;
}

.competition-page .gs-public-match-card footer {
    padding: 9px 3px 1px;
    color: #80907a;
    font-size: .69rem;
}

    .competition-page .gs-public-match-card footer a {
        color: #4b762f;
        font-weight: 800;
    }

.competition-page .gs-public-journey-lines {
    position: absolute;
    z-index: 1;
    inset: 0;
    overflow: visible;
    pointer-events: none;
}

.competition-page .gs-public-journey-connector {
    fill: none;
    stroke: #84b16e;
    stroke-width: 2.2;
    stroke-linecap: round;
    opacity: .9;
}

.competition-page .gs-plan-disclaimer {
    margin: 0;
    padding: 0 20px 18px;
    color: #738273;
    font-size: .75rem;
}

@media(max-width:650px) {
    .competition-page .gs-public-plans-heading {
        align-items: flex-start;
        flex-direction: column;
        padding: 16px;
    }

        .competition-page .gs-public-plans-heading h2 {
            font-size: 1.05rem;
        }

    .competition-page .gs-plan-stage-table {
        margin: 10px;
    }

    .competition-page .gs-public-journey-scroll {
        padding: 12px;
    }

    .competition-page .gs-public-journey-stages {
        gap: 52px;
    }

    .competition-page .gs-public-journey-stage {
        width: 244px;
        flex-basis: 244px;
    }
}


/* GEDIAN | Public Road to Final - 2026-10-24
   Preserves the entire original public competition page. */
.competition-page .gs-roadmap-hero {
    padding: 25px 27px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    color: #fff;
    background: radial-gradient(circle at 0% 0%,rgba(185,229,111,.26),transparent 42%),linear-gradient(120deg,#233b25,#3b6332 62%,#5B8C3B);
}

.competition-page .gs-roadmap-eyebrow {
    display: block;
    color: #c4e6b4;
    font-weight: 750;
    letter-spacing: .13em;
    font-family: inherit;
    font-size: .7rem;
    direction: ltr;
    text-align: right;
}

.competition-page .gs-roadmap-hero h2 {
    margin: 8px 0 9px;
    color: #fff;
    font-size: clamp(1.35rem,2.1vw,2rem);
    font-weight: 900;
    line-height: 1.35;
}

    .competition-page .gs-roadmap-hero h2 span {
        color: #d7ed91;
    }

.competition-page .gs-roadmap-hero p {
    margin: 0;
    max-width: 620px;
    color: #e1efdc;
    font-size: .9rem;
    line-height: 1.8;
}

.competition-page .gs-roadmap-hero-metrics {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

    .competition-page .gs-roadmap-hero-metrics > div:not(.gs-roadmap-trophy) {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        min-width: 68px;
        height: 72px;
        border: 1px solid #ffffff37;
        background: #ffffff16;
        border-radius: 14px;
    }

    .competition-page .gs-roadmap-hero-metrics strong {
        color: white;
        font-weight: 900;
        font-size: 1.4rem;
    }

    .competition-page .gs-roadmap-hero-metrics span {
        color: #dfecdc;
        font-weight: 650;
        font-size: .73rem;
    }

.competition-page .gs-roadmap-trophy {
    font-size: 2.6rem;
    line-height: 1;
    padding: 4px;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,.16));
}

.competition-page .gs-roadmap-tools {
    background: #f8fbf6;
    padding: 12px 17px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid #e7eee0;
}

.competition-page .gs-roadmap-pills {
    display: flex;
    align-items: center;
    gap: 7px;
    overflow-x: auto;
    padding: 3px 1px;
    max-width: 100%;
    scrollbar-width: thin;
}

.competition-page .gs-roadmap-stage-pill {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border-radius: 999px;
    border: 1px solid #d8e5d0;
    color: #3b5930;
    background: #fff;
    font: inherit;
    font-size: .77rem;
    font-weight: 800;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s,color .15s;
}

    .competition-page .gs-roadmap-stage-pill span {
        display: inline-flex;
        width: 20px;
        height: 20px;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        background: #e9f3e2;
    }

    .competition-page .gs-roadmap-stage-pill:hover, .competition-page .gs-roadmap-stage-pill:focus-visible {
        color: #fff;
        background: #476f32;
        border-color: #476f32;
        outline-offset: 2px;
    }

.competition-page .gs-roadmap-swipe-hint {
    flex-shrink: 0;
    color: #6f8367;
    font-size: .75rem;
}

.competition-page .gs-public-journey-scroll {
    padding: 25px 21px;
    background: linear-gradient(180deg,#fcfefb,#f7faf4);
}

.competition-page .gs-public-journey-stages {
    gap: 76px;
}

.competition-page .gs-public-journey-stage {
    width: 288px;
    flex: 0 0 288px;
    background: #fff;
    border: 1px solid #dfebdb;
    box-shadow: 0 6px 18px #2545220b;
}

    .competition-page .gs-public-journey-stage.is-final {
        border-color: #c5cc91;
        box-shadow: 0 6px 25px rgba(115,117,48,.1);
    }

        .competition-page .gs-public-journey-stage.is-final .gs-public-journey-stage-head {
            background: #f4f4df;
        }

.competition-page .gs-public-journey-stage-head {
    min-height: 75px;
    background: #edf6e9;
}

    .competition-page .gs-public-journey-stage-head h3 {
        line-height: 1.4;
        font-size: 1.03rem;
    }

.competition-page .gs-roadmap-mini-trophy {
    margin-inline-start: auto;
    font-size: 1.5rem;
}

.competition-page .gs-roadmap-group-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 9px;
    margin: 2px 0 12px;
}

    .competition-page .gs-roadmap-group-head h4 {
        margin: 0;
        font-size: .88rem;
    }

    .competition-page .gs-roadmap-group-head > span {
        background: #edf3e9;
        color: #557545;
        padding: 3px 8px;
        border-radius: 999px;
        font-size: .69rem;
        white-space: nowrap;
    }

.competition-page .gs-public-match-card {
    border-color: #dae6d3;
    border-radius: 13px;
    padding: 11px;
}

    .competition-page .gs-public-match-card.is-preliminary {
        border-style: dashed;
        border-color: #b9cdb1;
    }

    .competition-page .gs-public-match-card > header {
        align-items: center;
    }

.competition-page .gs-public-match-side {
    min-height: 48px;
}

    .competition-page .gs-public-match-side small {
        background: #e1eeda;
        border-radius: 5px;
        padding: 2px 5px;
    }

    .competition-page .gs-public-match-side a {
        font-size: .87rem;
    }

        .competition-page .gs-public-match-side a:hover {
            text-decoration: underline;
        }

.competition-page .gs-roadmap-status {
    display: inline-flex;
    background: #eaf3e4;
    color: #37642a !important;
    padding: 4px 6px;
    border-radius: 6px;
    text-align: center;
}

    .competition-page .gs-roadmap-status.is-draft, .competition-page .gs-plan-status.is-draft {
        color: #7b673b !important;
        background: #f9f4e6;
    }

.competition-page .gs-roadmap-empty-match-card {
    background: repeating-linear-gradient(-45deg,#f8fbf5,#f8fbf5 10px,#f4f8f1 10px,#f4f8f1 20px);
    padding: 21px 12px;
    border: 1px dashed #c7d7bd;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: #648055;
    text-align: center;
}

    .competition-page .gs-roadmap-empty-match-card > span {
        font-size: 1.5rem;
    }

    .competition-page .gs-roadmap-empty-match-card > strong {
        font-size: .83rem;
        color: #47633b;
    }

    .competition-page .gs-roadmap-empty-match-card > small {
        font-size: .74rem;
        line-height: 1.5;
    }

.competition-page .gs-roadmap-empty-slot-list {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    justify-content: center;
}

    .competition-page .gs-roadmap-empty-slot-list span {
        display: inline-flex;
        padding: 3px 7px;
        border-radius: 6px;
        color: #537643;
        border: 1px solid #d1e0c9;
        background: #fff;
        font-weight: 850;
        font-size: .72rem;
    }

.competition-page .gs-roadmap-pending-detail {
    padding: 24px 12px;
    color: #6d8064;
    text-align: center;
    font-size: .85rem;
}

.competition-page .gs-roadmap-legend {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
    padding: 13px 20px 6px;
    color: #586b51;
    font-size: .76rem;
}

    .competition-page .gs-roadmap-legend > span {
        display: inline-flex;
        align-items: center;
        gap: 7px;
    }

.competition-page .gs-roadmap-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    display: inline-block;
    background: #6a9a50;
}

    .competition-page .gs-roadmap-dot.is-pending {
        background: #fff;
        border: 2px solid #9fb393;
    }

    .competition-page .gs-roadmap-dot.is-flow {
        width: 21px;
        height: 3px;
        border-radius: 3px;
        background: #84b16e;
    }

.competition-page .gs-plan-disclaimer {
    padding: 6px 20px 16px;
    line-height: 1.8;
}

.competition-page .gs-roadmap-preview-note, .competition-page .gs-public-roadmap-notice {
    margin: 0;
    padding: 12px 20px;
    border-bottom: 1px solid #f0eadc;
    background: #fffaf0;
    color: #78613f;
    font-size: .8rem;
    line-height: 1.7;
}

.competition-page .gs-public-roadmap-notice {
    background: #f7faf4;
    color: #547045;
}

.competition-page .gs-roadmap-empty {
    padding: 15px 18px;
    color: #7d897a;
    font-size: .82rem;
}

.competition-page .gs-roadmap-group-placeholder {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px;
    border-radius: 12px;
    background: #f8faf6;
    color: #5b7350;
}

    .competition-page .gs-roadmap-group-placeholder strong {
        font-size: .83rem;
    }

    .competition-page .gs-roadmap-group-placeholder p {
        margin: 4px 0 0;
        font-size: .76rem;
    }

.competition-page .gs-roadmap-group-icon {
    font-size: 1.5rem;
    color: #83aa70;
}

.competition-page .gs-roadmap-available-slots {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 10px 0 0;
}

.competition-page .gs-roadmap-slot-chip {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    padding: 7px 10px;
    border: 1px solid #dce8d5;
    border-radius: 9px;
    background: #fff;
    font-size: .8rem;
}

    .competition-page .gs-roadmap-slot-chip b {
        color: #3e7029;
    }

    .competition-page .gs-roadmap-slot-chip a {
        color: #345f26;
        text-decoration: none;
        font-weight: 750;
    }

    .competition-page .gs-roadmap-slot-chip > span {
        color: #8a9486;
    }

.competition-page .gs-roadmap-stage-count {
    margin-inline-start: auto;
    font-size: .76rem;
    font-weight: 700;
    color: #5b7551;
}

.competition-page .gs-roadmap-final-indicator {
    padding: 5px 9px;
    background: #f5efd0;
    color: #80682f;
    border-radius: 999px;
    font-size: .76rem;
}

.competition-page .gs-roadmap-official-heading {
    padding: 16px 20px;
    background: #fafcf9;
    border: 1px solid #e5eddf;
    border-radius: 13px;
    margin: 0 0 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

    .competition-page .gs-roadmap-official-heading span {
        font-size: .7rem;
        color: #728567;
        font-weight: 750;
    }

    .competition-page .gs-roadmap-official-heading h3 {
        margin: 3px 0 0;
        font-size: 1rem;
        color: #354d30;
    }

    .competition-page .gs-roadmap-official-heading small {
        color: #7b8974;
        line-height: 1.5;
    }

.competition-page .gs-roadmap-no-stages {
    border: 1px solid #e1e8dc;
    padding: 30px 20px;
    border-radius: 16px;
    text-align: center;
    margin-bottom: 20px;
}

    .competition-page .gs-roadmap-no-stages strong {
        font-size: 1.03rem;
    }

    .competition-page .gs-roadmap-no-stages p {
        color: #778373;
    }

@media(max-width:680px) {
    .competition-page .gs-roadmap-hero {
        padding: 21px 18px;
        flex-direction: column;
        align-items: flex-start;
    }

    .competition-page .gs-roadmap-hero-metrics {
        align-self: stretch;
    }

    .competition-page .gs-roadmap-trophy {
        margin-inline-start: auto;
    }

    .competition-page .gs-roadmap-tools {
        align-items: flex-start;
        flex-direction: column;
    }

    .competition-page .gs-roadmap-swipe-hint {
        margin-inline-start: auto;
    }

    .competition-page .gs-public-journey-stage {
        width: 264px;
        flex-basis: 264px;
    }

    .competition-page .gs-public-journey-stages {
        gap: 55px;
    }

    .competition-page .gs-roadmap-official-heading {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media(prefers-reduced-motion:reduce) {
    .competition-page .gs-roadmap-stage-pill {
        transition: none;
    }
}

.competition-page .fixture-filters[hidden] {
    display: none !important;
}

/* =====================================================================
   CompetitionDetails · linked official matches on the public roadmap
   Additive and scoped. Original match/fixture/profile styles unchanged.
   ===================================================================== */
.competition-page .gs-plan-row-linked {
    cursor: pointer;
}

    .competition-page .gs-plan-row-linked:hover td,
    .competition-page .gs-plan-row-linked:focus-visible td {
        background: #f1f8ed;
    }

    .competition-page .gs-plan-row-linked:focus-visible {
        outline: 2px solid #5B8C3B;
        outline-offset: -2px;
    }

.competition-page .gs-plan-code a {
    color: #466f2d;
    font-weight: 900;
    text-decoration: none;
}

    .competition-page .gs-plan-code a:hover {
        text-decoration: underline;
    }

.competition-page .gs-plan-vs .gs-official-score {
    display: inline-block;
    padding: 5px 9px;
    border-radius: 9px;
    background: #eaf4e5;
    color: #285420;
    font-weight: 900;
    white-space: nowrap;
    direction: ltr;
}

.competition-page .gs-official-penalties {
    display: block;
    margin-top: 4px;
    font-size: .67rem;
    color: #6b7280;
    white-space: normal;
}

.competition-page .gs-plan-venue {
    min-width: 110px;
    max-width: 190px;
    white-space: normal;
}

    .competition-page .gs-plan-venue a {
        color: #466f2d;
        text-decoration: none;
        font-weight: 800;
    }

        .competition-page .gs-plan-venue a:hover {
            text-decoration: underline;
        }

.competition-page .gs-plan-status.is-linked,
.competition-page .gs-roadmap-status.is-linked {
    background: #e3f3da;
    color: #315d25;
    border-color: #c8dfb9;
}

.competition-page .gs-public-match-card.is-official {
    border: 1px solid #bdd9ad;
    background: linear-gradient(175deg,#fff,#f7fbf5);
    box-shadow: 0 5px 15px rgba(42,85,32,.06);
}

.competition-page .gs-public-match-card.is-interactive {
    cursor: pointer;
    transition: border-color .15s,box-shadow .15s,transform .15s;
}

    .competition-page .gs-public-match-card.is-interactive:hover {
        border-color: #73a85f;
        box-shadow: 0 11px 22px rgba(47,91,39,.13);
        transform: translateY(-1px);
    }

    .competition-page .gs-public-match-card.is-interactive:focus-visible {
        outline: 3px solid #5B8C3B;
        outline-offset: 3px;
    }

.competition-page .gs-public-match-card .gs-public-card-vs.is-scored {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    color: #2f6524;
    font-weight: 900;
    font-size: 1.06rem;
    font-variant-numeric: tabular-nums;
    direction: ltr;
}

    .competition-page .gs-public-match-card .gs-public-card-vs.is-scored small {
        font-size: .59rem;
        color: #6b7280;
        direction: rtl;
    }

.competition-page .gs-public-match-card-footer {
    display: flex;
    gap: 7px 10px;
    flex-wrap: wrap;
    align-items: center;
}

.competition-page .gs-card-official-date {
    color: #526250;
    font-size: .72rem;
}

.competition-page .gs-card-official-venue {
    color: #466f2d;
    text-decoration: none;
    font-size: .72rem;
}

.competition-page a.gs-card-official-venue:hover {
    text-decoration: underline;
}

.competition-page .gs-card-view-match {
    margin-inline-start: auto;
    color: #315f24;
    font-size: .75rem;
    font-weight: 900;
    text-decoration: none;
}

    .competition-page .gs-card-view-match:hover {
        text-decoration: underline;
    }

@media (max-width: 650px) {
    .competition-page .gs-public-match-card-footer {
        gap: 6px 8px;
    }

    .competition-page .gs-card-view-match {
        width: 100%;
        margin-inline-start: 0;
    }
}

/* ============================================================================
   GEDIAN SPORTS | Competition title journey, Overview / معلومات المنافسة
   2026-10-26. Scoped: does not affect detailed stages, fixtures or seasons.
   ============================================================================ */
.competition-page #competition-panel-info .competition-content-card {
    padding: 0;
    min-width: 0;
    overflow: hidden;
}

.competition-page .gs-cp-route {
    --gs-cp-ink: #203325;
    --gs-cp-muted: #718075;
    --gs-cp-green: #5b8c3b;
    --gs-cp-line: #dce7d6;
    color: var(--gs-cp-ink);
    font-family: "Tajawal", "Cairo", sans-serif;
    min-width: 0;
}

.competition-page .gs-cp-route-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 26px 28px 22px;
    background: radial-gradient(circle at 10% 5%, rgba(255,255,255,.13), transparent 27%), linear-gradient(120deg, #28451f 0%, #4e7b32 56%, #659844 100%);
    color: white;
}

.competition-page .gs-cp-route-heading {
    min-width: 0;
}

.competition-page .gs-cp-eyebrow {
    display: block;
    font: 700 .66rem/1.6 Arial,sans-serif;
    letter-spacing: 1.8px;
    color: #d4efc4;
}

.competition-page .gs-cp-route-heading h2 {
    font-size: clamp(1.45rem,2.5vw,2.15rem);
    line-height: 1.35;
    margin: 7px 0;
    font-weight: 950;
    color: #fff;
}

    .competition-page .gs-cp-route-heading h2 span {
        color: #f6e39d;
    }

.competition-page .gs-cp-route-heading p {
    margin: 0;
    max-width: 750px;
    color: #e5f0e0;
    font-size: .86rem;
    line-height: 1.85;
}

.competition-page .gs-cp-route-counter {
    flex: 0 0 auto;
    border: 1px solid #ffffff52;
    background: #ffffff18;
    border-radius: 17px;
    min-width: 115px;
    padding: 12px 17px;
    text-align: center;
}

    .competition-page .gs-cp-route-counter strong {
        display: block;
        font-size: 2rem;
        font-weight: 950;
        line-height: 1.2;
        color: #fff;
    }

    .competition-page .gs-cp-route-counter span {
        display: block;
        font-size: .74rem;
        color: #e5f0e0;
    }

.competition-page .gs-cp-route-navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 19px;
    border-bottom: 1px solid #e5ebdf;
    background: #fbfdf9;
}

.competition-page .gs-cp-route-chips {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.competition-page .gs-cp-jump {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #d8e5d0;
    border-radius: 999px;
    background: #fff;
    color: #456d35;
    padding: 7px 12px;
    font-size: .76rem;
    line-height: 1.3;
    font-weight: 850;
    font-family: inherit;
    cursor: pointer;
    transition: background .15s,border-color .15s;
}

    .competition-page .gs-cp-jump:hover, .competition-page .gs-cp-jump:focus-visible {
        background: #edf5e8;
        border-color: #8cad77;
        outline-offset: 2px;
    }

    .competition-page .gs-cp-jump > span {
        display: inline-grid;
        place-items: center;
        min-width: 21px;
        height: 21px;
        padding: 0 3px;
        border-radius: 50%;
        background: #e6f2df;
        font-weight: 950;
    }

.competition-page .gs-cp-jump-title {
    background: #fff7dc;
    border-color: #efdb99;
    color: #7e5b20;
}

    .competition-page .gs-cp-jump-title > span {
        background: #fae9bc;
    }

.competition-page .gs-cp-route-hint {
    flex: 0 0 auto;
    color: #718075;
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.competition-page .gs-cp-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    width: 100%;
    max-width: 100%;
    direction: rtl;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scrollbar-color: #a6c394 #f1f6ed;
    scroll-snap-type: x proximity;
    cursor: grab;
    background: linear-gradient(180deg,#f8faf7 0%,#fff 160px);
}

    .competition-page .gs-cp-scroll.is-dragging {
        cursor: grabbing;
        scroll-snap-type: none;
        user-select: none;
    }

    .competition-page .gs-cp-scroll:focus-visible {
        outline: 2px solid var(--gs-cp-green);
        outline-offset: -2px;
    }

    .competition-page .gs-cp-scroll::-webkit-scrollbar {
        height: 10px;
    }

    .competition-page .gs-cp-scroll::-webkit-scrollbar-thumb {
        background: #a5bf96;
        border-radius: 99px;
    }

    .competition-page .gs-cp-scroll::-webkit-scrollbar-track {
        background: #edf4e8;
    }

.competition-page .gs-cp-track {
    display: flex;
    align-items: flex-start;
    gap: 0;
    width: max-content;
    min-width: 100%;
    padding: 30px 26px 44px;
    direction: rtl;
}

.competition-page .gs-cp-stage {
    flex: 0 0 348px;
    width: 348px;
    min-width: 0;
    scroll-snap-align: start;
}

.competition-page .gs-cp-stage-shell {
    overflow: hidden;
    border: 1px solid #dfebd9;
    border-radius: 19px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(36,63,32,.075);
}

.competition-page .gs-cp-stage.is-first .gs-cp-stage-shell {
    border-color: #a5c591;
    box-shadow: 0 12px 30px rgba(62,110,38,.13);
}

.competition-page .gs-cp-stage-head {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 82px;
    padding: 14px 14px;
    border-bottom: 1px solid #ebf0e6;
    background: linear-gradient(115deg,#f2f8ef,#fff);
}

.competition-page .gs-cp-stage.is-first .gs-cp-stage-head {
    background: linear-gradient(120deg,#dfeeda,#f2f8ee);
}

.competition-page .gs-cp-stage-num {
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: #5b8c3b;
    color: white;
    font-size: 1.12rem;
    font-weight: 950;
}

.competition-page .gs-cp-stage-head-text {
    flex: 1;
    min-width: 0;
}

    .competition-page .gs-cp-stage-head-text h3 {
        margin: 0;
        color: #294426;
        font-weight: 950;
        font-size: 1rem;
        line-height: 1.45;
    }

    .competition-page .gs-cp-stage-head-text > span {
        display: block;
        color: #748574;
        font-size: .73rem;
        margin-top: 3px;
    }

.competition-page .gs-cp-first-tag {
    font-size: .69rem;
    border-radius: 999px;
    padding: 6px 8px;
    background: #5b8c3b;
    color: #fff;
    font-weight: 900;
    white-space: nowrap;
}

.competition-page .gs-cp-stage-toggle {
    display: grid;
    place-items: center;
    flex: 0 0 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #cfe0c6;
    border-radius: 9px;
    color: #456c35;
    background: #fff;
    font-size: 1.3rem;
    font-family: inherit;
    cursor: pointer;
}

    .competition-page .gs-cp-stage-toggle:hover {
        background: #e8f4e2;
    }

    .competition-page .gs-cp-stage-toggle[aria-expanded="false"] span {
        transform: rotate(180deg);
    }

.competition-page .gs-cp-stage-body {
    max-height: 675px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 14px;
    scrollbar-width: thin;
    scrollbar-color: #c2d4b6 #fff;
}

    .competition-page .gs-cp-stage-body[hidden] {
        display: none !important;
    }

.competition-page .gs-cp-stage-date {
    padding: 5px 10px;
    border-radius: 7px;
    background: #f2f7ef;
    color: #71816e;
    font-size: .73rem;
    margin-bottom: 10px;
    text-align: center;
}

.competition-page .gs-cp-standing-group {
    margin-bottom: 13px;
    border: 1px solid #e5eae0;
    border-radius: 13px;
    overflow: hidden;
    background: #fff;
}

    .competition-page .gs-cp-standing-group:last-child {
        margin-bottom: 0;
    }

.competition-page .gs-cp-group-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 10px 11px;
    background: #f2f7ef;
    border-bottom: 1px solid #e4ece0;
}

    .competition-page .gs-cp-group-heading strong {
        font-size: .83rem;
        color: #325029;
    }

    .competition-page .gs-cp-group-heading span {
        font-size: .7rem;
        color: #748673;
    }

.competition-page .gs-cp-standings {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

    .competition-page .gs-cp-standings thead {
        background: #f8faf7;
    }

    .competition-page .gs-cp-standings th {
        padding: 9px 5px;
        color: #7a8475;
        font-size: .68rem;
        text-align: center;
        border-bottom: 1px solid #e9ede6;
    }

        .competition-page .gs-cp-standings th:nth-child(1), .competition-page .gs-cp-standings td:nth-child(1) {
            width: 29px;
        }

        .competition-page .gs-cp-standings th:nth-child(2), .competition-page .gs-cp-standings td:nth-child(2) {
            width: auto;
            text-align: right;
        }

        .competition-page .gs-cp-standings th:nth-child(n+3), .competition-page .gs-cp-standings td:nth-child(n+3) {
            width: 37px;
        }

    .competition-page .gs-cp-standings td {
        padding: 8px 4px;
        border-bottom: 1px solid #eff2ed;
        vertical-align: middle;
        text-align: center;
        font-size: .78rem;
        line-height: 1.45;
        font-weight: 750;
    }

    .competition-page .gs-cp-standings tbody tr:last-child td {
        border-bottom: 0;
    }

    .competition-page .gs-cp-standings tbody tr.is-leading {
        background: #f3f9ef;
    }

.competition-page .gs-cp-rank {
    color: #7b8874;
}

.competition-page .gs-cp-club {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    text-decoration: none;
    color: #253b29;
    font-weight: 850;
}

    .competition-page .gs-cp-club:hover {
        color: #5b8c3b;
    }

    .competition-page .gs-cp-club img {
        width: 23px;
        height: 23px;
        object-fit: contain;
        flex: 0 0 auto;
    }

    .competition-page .gs-cp-club span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.competition-page .gs-cp-standings td.gs-cp-points {
    color: #2f6d2b;
    font-weight: 950;
}

.competition-page .gs-cp-rule-note {
    margin: 12px 3px 2px;
    font-size: .72rem;
    line-height: 1.75;
    color: #758273;
}

.competition-page .gs-cp-match-list, .competition-page .gs-cp-slot-list, .competition-page .gs-cp-pending-slots {
    display: grid;
    gap: 9px;
}

.competition-page .gs-cp-match {
    border: 1px solid #e0e9db;
    border-radius: 13px;
    padding: 11px;
    background: #fff;
    position: relative;
}

    .competition-page .gs-cp-match.is-official {
        border-color: #bcd6ae;
    }

    .competition-page .gs-cp-match.is-preview {
        border-style: dashed;
    }

.competition-page .gs-cp-match-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #edf1eb;
    padding-bottom: 8px;
    margin-bottom: 9px;
    font-size: .71rem;
    font-weight: 900;
    color: #50713e;
}

    .competition-page .gs-cp-match-meta small {
        font-size: .68rem;
        color: #7a8875;
    }

.competition-page .gs-cp-match-side {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    min-height: 34px;
}

    .competition-page .gs-cp-match-side + .gs-cp-match-side {
        border-top: 1px solid #f0f2ed;
    }

.competition-page .gs-cp-match-team {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    line-height: 1.5;
    font-weight: 850;
    font-size: .81rem;
    text-decoration: none;
    color: #273b2c;
    overflow-wrap: anywhere;
}

.competition-page a.gs-cp-match-team:hover {
    color: #5b8c3b;
}

.competition-page .gs-cp-match-team.is-pending {
    color: #7e8980;
    font-weight: 700;
}

.competition-page .gs-cp-match-team img {
    width: 23px;
    height: 23px;
    flex: 0 0 auto;
    object-fit: contain;
}

.competition-page .gs-cp-match-side strong {
    font-size: 1.04rem;
    font-weight: 950;
    color: #254427;
}

.competition-page .gs-cp-match-link {
    display: block;
    margin-top: 9px;
    padding-top: 7px;
    text-align: left;
    border-top: 1px solid #edf1eb;
    color: #4d7a39;
    font-size: .74rem;
    font-weight: 900;
    text-decoration: none;
}

.competition-page .gs-cp-match-wait {
    display: block;
    margin-top: 9px;
    color: #849085;
    font-size: .7rem;
}

.competition-page .gs-cp-pending-row {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 11px;
    min-height: 40px;
    border: 1px solid #e7ede4;
    border-radius: 10px;
    background: #fafcf9;
    color: #667564;
    font-size: .78rem;
}

    .competition-page .gs-cp-pending-row a {
        color: #325d31;
        font-weight: 850;
        text-decoration: none;
        overflow-wrap: anywhere;
    }

.competition-page .gs-cp-slot-code {
    flex: 0 0 auto;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 37px;
    border-radius: 6px;
    background: #e6efe0;
    color: #457038;
    font: 800 .7rem/1.4 Arial,sans-serif;
    text-align: center;
    padding: 5px 6px;
}

.competition-page .gs-cp-empty-small {
    padding: 30px 14px;
    background: #fafcf9;
    border: 1px dashed #dce7d5;
    border-radius: 12px;
    color: #7b867a;
    font-size: .82rem;
    line-height: 1.8;
    text-align: center;
}

.competition-page .gs-cp-connector {
    position: relative;
    flex: 0 0 89px;
    width: 89px;
    height: 112px;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    margin-top: 110px;
    color: #568446;
}

    .competition-page .gs-cp-connector::before {
        position: absolute;
        right: 4px;
        left: 4px;
        top: 50%;
        height: 2px;
        background: linear-gradient(270deg,#8bb777,#c3d8b7);
        content: "";
    }

.competition-page .gs-cp-connector-fan {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

    .competition-page .gs-cp-connector-fan i {
        position: absolute;
        top: 50%;
        left: 18px;
        width: 49px;
        border-top: 1px solid #b2ceb0;
        transform-origin: left;
    }

        .competition-page .gs-cp-connector-fan i:first-child {
            transform: rotate(-26deg);
        }

        .competition-page .gs-cp-connector-fan i:nth-child(2) {
            transform: rotate(0deg);
        }

        .competition-page .gs-cp-connector-fan i:last-child {
            transform: rotate(26deg);
        }

.competition-page .gs-cp-connector-arrow {
    position: absolute;
    left: 0;
    top: calc(50% - 16px);
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #5b8c3b;
    color: #fff;
    font-size: 1.18rem;
    font-weight: 900;
    box-shadow: 0 5px 14px #3e6b3452;
}

.competition-page .gs-cp-connector small {
    position: absolute;
    top: 82px;
    white-space: nowrap;
    font-size: .69rem;
    color: #5c7d54;
    background: #f0f7ec;
    padding: 4px 7px;
    border-radius: 8px;
}

.competition-page .gs-cp-title {
    flex: 0 0 314px;
    width: 314px;
    min-height: 380px;
    scroll-snap-align: start;
    align-self: flex-start;
    text-align: center;
    overflow: hidden;
    border: 1px solid #ead7a6;
    border-radius: 20px;
    background: radial-gradient(circle at 50% 35%,#fff8de,#fff 66%);
    box-shadow: 0 18px 36px #8f711d15;
}

.competition-page .gs-cp-title-head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 59px;
    background: linear-gradient(120deg,#b48b3f,#edcc7f);
    color: #fff;
    font-size: .91rem;
    font-weight: 950;
}

    .competition-page .gs-cp-title-head > span:first-child {
        font-size: 1.25rem;
    }

.competition-page .gs-cp-trophy-visual {
    display: grid;
    place-items: center;
    width: 128px;
    height: 128px;
    margin: 18px auto 3px;
    border: 1px solid #f0dea9;
    border-radius: 50%;
    background: radial-gradient(circle,#fff,#fff7dd);
    box-shadow: 0 0 0 11px #fcf4df;
}

.competition-page .gs-cp-cup-fallback {
    font-size: 4.35rem;
    filter: drop-shadow(0 6px 9px #a9893455);
}

    .competition-page .gs-cp-cup-fallback[hidden] {
        display: none;
    }

.competition-page .gs-cp-cup-photo {
    width: 94px;
    height: 108px;
    object-fit: contain;
}

.competition-page .gs-cp-title h3 {
    margin: 14px 14px 2px;
    color: #654c24;
    font-size: 1.15rem;
    line-height: 1.5;
    font-weight: 950;
}

.competition-page .gs-cp-cup-season {
    display: block;
    color: #9e8b6d;
    font-size: .75rem;
}

.competition-page .gs-cp-champion {
    display: grid;
    gap: 9px;
    justify-items: center;
    margin: 17px 16px 10px;
    padding: 14px 8px;
    border: 1px solid #f0e1c3;
    border-radius: 13px;
    background: #fffdfa;
}

    .competition-page .gs-cp-champion > span {
        font-size: .74rem;
        font-weight: 850;
        color: #95774b;
    }

        .competition-page .gs-cp-champion > span.is-official {
            color: #378037;
        }

    .competition-page .gs-cp-champion strong {
        font-size: .98rem;
        color: #715929;
    }

.competition-page .gs-cp-champion-club {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #425d31;
    text-decoration: none;
    font-size: .99rem;
    font-weight: 950;
}

    .competition-page .gs-cp-champion-club img {
        width: 32px;
        height: 32px;
        object-fit: contain;
    }

.competition-page .gs-cp-title-note {
    padding: 0 19px 19px;
    margin: 0;
    line-height: 1.7;
    color: #968365;
    font-size: .72rem;
}

.competition-page .gs-cp-bottom-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 21px;
    align-items: center;
    padding: 14px 23px;
    background: #fcfdfb;
    border-top: 1px solid #e9efe5;
    color: #778473;
    font-size: .74rem;
}

    .competition-page .gs-cp-bottom-legend span {
        display: flex;
        align-items: center;
        gap: 7px;
    }

    .competition-page .gs-cp-bottom-legend i {
        display: block;
        flex: 0 0 auto;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: #9ab88a;
    }

    .competition-page .gs-cp-bottom-legend .gs-cp-leg-grey {
        background: #c0c9bf;
    }

    .competition-page .gs-cp-bottom-legend .gs-cp-leg-gold {
        background: #dab458;
    }

@media(max-width:760px) {
    .competition-page .gs-cp-route-top {
        padding: 20px 17px;
        align-items: start;
    }

    .competition-page .gs-cp-route-counter {
        min-width: 74px;
        padding: 11px 9px;
    }

        .competition-page .gs-cp-route-counter strong {
            font-size: 1.5rem;
        }

    .competition-page .gs-cp-route-heading p {
        font-size: .78rem;
    }

    .competition-page .gs-cp-route-navigation {
        padding: 11px 13px;
        flex-direction: column;
        align-items: stretch;
    }

    .competition-page .gs-cp-route-chips {
        flex-wrap: nowrap;
        overflow: auto;
        padding-bottom: 4px;
        scrollbar-width: thin;
    }

    .competition-page .gs-cp-jump {
        flex: 0 0 auto;
    }

    .competition-page .gs-cp-route-hint {
        font-size: .72rem;
    }

    .competition-page .gs-cp-track {
        padding: 19px 13px 31px;
    }

    .competition-page .gs-cp-stage {
        flex-basis: 305px;
        width: 305px;
    }

    .competition-page .gs-cp-connector {
        flex-basis: 58px;
        width: 58px;
    }

    .competition-page .gs-cp-connector-fan {
        display: none;
    }

    .competition-page .gs-cp-connector small {
        font-size: .6rem;
    }

    .competition-page .gs-cp-title {
        flex-basis: 290px;
        width: 290px;
    }

    .competition-page .gs-cp-stage-body {
        max-height: 570px;
    }
}

@media(prefers-reduced-motion:reduce) {
    .competition-page .gs-cp-scroll {
        scroll-behavior: auto;
    }

    .competition-page .gs-cp-jump {
        transition: none;
    }
}
/* Explicit, validated bracket/qualification links. SVG stays behind cards. */
.competition-page .gs-cp-track {
    position: relative;
}

.competition-page .gs-cp-explicit-edges {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: visible;
    pointer-events: none;
}

.competition-page .gs-cp-stage, .competition-page .gs-cp-connector, .competition-page .gs-cp-title {
    position: relative;
    z-index: 2;
}

.competition-page .gs-cp-explicit-edge {
    fill: none;
    stroke: #649751;
    stroke-width: 2.1;
    stroke-linecap: round;
    opacity: .85;
}

.competition-page .gs-cp-explicit-arrow {
    fill: #649751;
    opacity: .92;
}

/* ==================================================================
   Competition path refinements – compact general-info journey
   ================================================================== */
.competition-page .gs-cp-route {
    overflow: hidden;
    border: 1px solid #dfe9da;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(31, 41, 55, .06);
}

.competition-page .gs-cp-route-top {
    display: block;
    padding: 20px 24px 14px;
    background: #fff;
    color: var(--competition-text);
    border-bottom: 1px solid #edf2e9;
}

.competition-page .gs-cp-eyebrow {
    color: #6f7c73;
}

.competition-page .gs-cp-route-heading h2 {
    margin: 8px 0 0;
    color: #203325;
}

    .competition-page .gs-cp-route-heading h2 span {
        color: var(--competition-green);
    }

.competition-page .gs-cp-scroll {
    background: linear-gradient(180deg, #fbfcfb 0%, #ffffff 180px);
}

.competition-page .gs-cp-track {
    padding: 22px 18px 28px;
    gap: 0;
}

.competition-page .gs-cp-stage {
    flex: 0 0 clamp(268px, 30vw, 336px);
    width: clamp(268px, 30vw, 336px);
}

.competition-page .gs-cp-stage-head {
    min-height: 74px;
    padding: 12px 13px;
}

.competition-page .gs-cp-stage-body {
    max-height: 620px;
    padding: 12px;
}

.competition-page .gs-cp-stage-date {
    margin-bottom: 9px;
}

.competition-page .gs-cp-standing-group {
    border-radius: 12px;
}

.competition-page .gs-cp-group-heading {
    padding: 9px 10px;
}

    .competition-page .gs-cp-group-heading strong {
        font-size: .81rem;
    }

.competition-page .gs-cp-standings th {
    padding: 8px 4px;
}

.competition-page .gs-cp-standings td {
    padding: 8px 4px;
}

    .competition-page .gs-cp-standings th:nth-child(1),
    .competition-page .gs-cp-standings td:nth-child(1) {
        width: 32px;
    }

.competition-page .gs-cp-club.gs-cp-club-textonly {
    display: block;
    color: #4f5c54;
    font-weight: 800;
}

    .competition-page .gs-cp-club.gs-cp-club-textonly:hover {
        color: #4f5c54;
    }

.competition-page .gs-cp-match-list,
.competition-page .gs-cp-slot-list,
.competition-page .gs-cp-pending-slots {
    gap: 8px;
}

.competition-page .gs-cp-match.gs-cp-match-compact {
    padding: 10px;
    border-radius: 12px;
}

.competition-page .gs-cp-match-meta {
    margin-bottom: 6px;
    padding-bottom: 6px;
}

    .competition-page .gs-cp-match-meta span {
        color: #476c37;
    }

    .competition-page .gs-cp-match-meta small {
        color: #7a867e;
    }

.competition-page .gs-cp-match-side {
    min-height: 40px;
    padding: 4px 0;
}

.competition-page .gs-cp-match-team {
    width: 100%;
    font-size: .88rem;
    font-weight: 850;
}

    .competition-page .gs-cp-match-team.is-pending {
        color: #7e8a82;
        font-weight: 750;
    }

.competition-page .gs-cp-match-side.is-winner .gs-cp-match-team,
.competition-page .gs-cp-match-side.is-winner .gs-cp-match-team span,
.competition-page .gs-cp-match-side.is-winner .gs-cp-match-team.is-pending {
    color: #2d7d32;
    font-weight: 950;
    font-size: .99rem;
}

.competition-page .gs-cp-match-side.is-loser .gs-cp-match-team,
.competition-page .gs-cp-match-side.is-loser .gs-cp-match-team span,
.competition-page .gs-cp-match-side.is-loser .gs-cp-match-team.is-pending {
    color: #b42318;
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
}

.competition-page .gs-cp-match-link {
    margin-top: 7px;
    padding-top: 7px;
    font-size: .72rem;
}

.competition-page .gs-cp-pending-row {
    min-height: 42px;
    padding: 10px;
}

.competition-page .gs-cp-list-dot {
    flex: 0 0 auto;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #7aa05e;
}

.competition-page .gs-cp-pending-row .gs-cp-match-team {
    font-size: .84rem;
}

.competition-page .gs-cp-connector {
    flex: 0 0 70px;
    width: 70px;
    margin-top: 104px;
}

    .competition-page .gs-cp-connector small {
        display: none;
    }

.competition-page .gs-cp-title {
    flex: 0 0 clamp(250px, 28vw, 300px);
    width: clamp(250px, 28vw, 300px);
    min-height: 350px;
}

.competition-page .gs-cp-title-note,
.competition-page .gs-cp-route-counter,
.competition-page .gs-cp-route-navigation,
.competition-page .gs-cp-bottom-legend {
    display: none !important;
}

@media (max-width: 991px) {
    .competition-page .gs-cp-route-top {
        padding: 18px 16px 12px;
    }

    .competition-page .gs-cp-track {
        padding: 16px 12px 24px;
    }

    .competition-page .gs-cp-stage {
        flex: 0 0 min(82vw, 296px);
        width: min(82vw, 296px);
    }

    .competition-page .gs-cp-title {
        flex: 0 0 min(76vw, 270px);
        width: min(76vw, 270px);
    }

    .competition-page .gs-cp-connector {
        flex: 0 0 50px;
        width: 50px;
        margin-top: 100px;
    }
}

@media (max-width: 575px) {
    .competition-page {
        padding: 14px 8px 28px;
    }

        .competition-page .gs-cp-route {
            border-radius: 18px;
        }

        .competition-page .gs-cp-route-heading h2 {
            font-size: 1.25rem;
        }

        .competition-page .gs-cp-stage {
            flex: 0 0 min(85vw, 280px);
            width: min(85vw, 280px);
        }

        .competition-page .gs-cp-stage-head {
            min-height: 68px;
            gap: 8px;
        }

        .competition-page .gs-cp-stage-num {
            flex-basis: 32px;
            width: 32px;
            height: 32px;
            font-size: 1rem;
        }

        .competition-page .gs-cp-stage-head-text h3 {
            font-size: .93rem;
        }

        .competition-page .gs-cp-stage-head-text > span {
            font-size: .69rem;
        }

        .competition-page .gs-cp-stage-body {
            max-height: 560px;
            padding: 10px;
        }

        .competition-page .gs-cp-standings th,
        .competition-page .gs-cp-standings td {
            font-size: .72rem;
        }

        .competition-page .gs-cp-club,
        .competition-page .gs-cp-match-team {
            gap: 6px;
        }

            .competition-page .gs-cp-club img,
            .competition-page .gs-cp-match-team img {
                width: 20px;
                height: 20px;
            }

        .competition-page .gs-cp-match-side.is-winner .gs-cp-match-team,
        .competition-page .gs-cp-match-side.is-winner .gs-cp-match-team span,
        .competition-page .gs-cp-match-side.is-winner .gs-cp-match-team.is-pending {
            font-size: .92rem;
        }

        .competition-page .gs-cp-title {
            flex: 0 0 min(78vw, 250px);
            width: min(78vw, 250px);
            min-height: 325px;
        }

        .competition-page .gs-cp-trophy-visual {
            width: 108px;
            height: 108px;
        }

        .competition-page .gs-cp-cup-photo {
            width: 80px;
            height: 92px;
        }

        .competition-page .gs-cp-cup-fallback {
            font-size: 3.6rem;
        }
}


/* =====================================================================
   Gedian Sports | Detailed competition stages - 2026-10-26
   Independent stage cards, complete league/group statistics,
   logo-only next opponent, color-coded knockout winners and losers.
   Scoped to tab 2; the stage-to-title journey remains untouched.
   ===================================================================== */
#competition-panel-details .competition-smart-stages {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 20px;
    margin: 0;
}

#competition-panel-details .competition-smart-stage {
    min-width: 0;
    border: 1px solid #dce8d6;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 9px 28px rgba(40, 73, 39, .065);
    overflow: hidden;
}

    #competition-panel-details .competition-smart-stage[open] {
        border-color: #cddfc2;
    }

#competition-panel-details .competition-smart-summary {
    padding: 17px 19px;
    background: linear-gradient(110deg,#f0f7ec,#fff);
    border-bottom: 1px solid #e7eee2;
    min-height: 75px;
}

#competition-panel-details .competition-smart-stage-title {
    font-size: clamp(.95rem,1.5vw,1.14rem);
    color: #203c26;
    line-height: 1.4;
}

#competition-panel-details .competition-smart-stage-body {
    padding: 12px 16px 19px;
    min-width: 0;
}

#competition-panel-details .competition-table.is-stage-smart {
    min-width: 850px;
    width: 100%;
    table-layout: auto;
}

    #competition-panel-details .competition-table.is-stage-smart th,
    #competition-panel-details .competition-table.is-stage-smart td {
        padding: 11px 8px;
        vertical-align: middle;
        white-space: nowrap;
    }

        #competition-panel-details .competition-table.is-stage-smart th.club-column,
        #competition-panel-details .competition-table.is-stage-smart td.club-column {
            min-width: 185px;
            white-space: normal;
        }

#competition-panel-details .competition-stage-table-scroll {
    scrollbar-width: thin;
    scrollbar-color: #a6bf96 #edf4e8;
}

/* Only a real opponent logo is displayed, not the opponent's written name. */
#competition-panel-details .competition-next-opponent-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 33px;
    height: 33px;
    padding: 3px;
    border: 1px solid #e4ece0;
    border-radius: 9px;
    background: #f8fbf6;
    text-decoration: none;
    color: #62824e;
    line-height: 1;
    vertical-align: middle;
}

    #competition-panel-details .competition-next-opponent-logo:hover,
    #competition-panel-details .competition-next-opponent-logo:focus-visible {
        border-color: #79a568;
        background: #edf6e9;
    }

    #competition-panel-details .competition-next-opponent-logo img {
        display: block;
        width: 26px;
        height: 26px;
        object-fit: contain;
    }

#competition-panel-details .competition-next-opponent-fallback {
    font-size: 1rem;
}

/* A winner is green, larger and bold; the eliminated club is red
   with a line-through. No automatic winner is inferred for drawn,
   unfinished, or unconfirmed ties. */
#competition-panel-details .competition-smart-team.is-qualified,
#competition-panel-details .competition-smart-team.is-qualified .competition-smart-team-link,
#competition-panel-details .competition-smart-team.is-qualified .competition-smart-team-link span {
    color: #277a34;
    font-size: 1.04rem;
    font-weight: 950;
    text-decoration: none;
}

#competition-panel-details .competition-smart-team.is-eliminated,
#competition-panel-details .competition-smart-team.is-eliminated .competition-smart-team-link,
#competition-panel-details .competition-smart-team.is-eliminated .competition-smart-team-link span {
    color: #b42318;
    font-size: .87rem;
    font-weight: 750;
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
}

    #competition-panel-details .competition-smart-team.is-qualified img,
    #competition-panel-details .competition-smart-team.is-eliminated img {
        text-decoration: none;
    }

#competition-panel-details .competition-smart-qualified-label {
    font-size: .69rem;
    font-weight: 950;
    color: #2f7835;
}

#competition-panel-details .competition-smart-tie {
    border-radius: 15px;
    border-color: #e2e9dd;
    box-shadow: 0 5px 14px rgba(31, 41, 55, .04);
}

#competition-panel-details .competition-smart-tie-top {
    padding: 15px 12px;
}

#competition-panel-details .competition-smart-tie-score strong {
    font-size: 1.4rem;
    font-weight: 950;
}

/* The extensive configured-match table remains available but starts
   collapsed, ensuring the independent stage cards lead the tab. */
#competition-panel-details .competition-detailed-programme {
    margin-top: 20px;
    border: 1px solid #dce8d6;
    border-radius: 16px;
    background: #fff;
    overflow: hidden;
}

#competition-panel-details .competition-detailed-programme-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 18px;
    background: #f8fbf6;
    color: #30582e;
    font-size: .9rem;
    font-weight: 900;
    cursor: pointer;
    list-style: none;
}

    #competition-panel-details .competition-detailed-programme-summary::-webkit-details-marker {
        display: none;
    }

    #competition-panel-details .competition-detailed-programme-summary::marker {
        content: "";
    }

#competition-panel-details .competition-detailed-programme-action {
    font-size: 1.35rem;
}

#competition-panel-details .competition-detailed-programme[open] .competition-detailed-programme-action {
    transform: rotate(180deg);
}

#competition-panel-details .competition-detailed-programme-body {
    padding: 16px;
}

@media (max-width: 650px) {
    #competition-panel-details .competition-smart-stages {
        gap: 13px;
    }

    #competition-panel-details .competition-smart-stage {
        border-radius: 13px;
    }

    #competition-panel-details .competition-smart-summary {
        padding: 12px 11px;
        min-height: 63px;
    }

    #competition-panel-details .competition-smart-stage-body {
        padding: 10px 8px 14px;
    }

    #competition-panel-details .competition-smart-summary-meta {
        gap: 5px;
    }

    #competition-panel-details .competition-smart-stage-title {
        font-size: .92rem;
    }

    #competition-panel-details .competition-table.is-stage-smart {
        min-width: 770px;
    }

    #competition-panel-details .competition-next-opponent-logo {
        width: 30px;
        height: 30px;
    }

        #competition-panel-details .competition-next-opponent-logo img {
            width: 24px;
            height: 24px;
        }

    #competition-panel-details .competition-smart-tie-top {
        gap: 6px;
        padding: 12px 7px;
    }

    #competition-panel-details .competition-smart-team.is-qualified .competition-smart-team-link,
    #competition-panel-details .competition-smart-team.is-qualified .competition-smart-team-link span {
        font-size: .94rem;
    }

    #competition-panel-details .competition-detailed-programme-body {
        padding: 9px;
    }
}


#competition-panel-details .competition-configured-ties {
    margin-top: 15px;
}

#competition-panel-details .competition-stage-configured-match {
    min-width: 0;
}

#competition-panel-details .competition-stage-match-code {
    padding: 8px 12px 0;
    font-size: .76rem;
    font-weight: 900;
    color: #527643;
    background: #f9fbf8;
}

#competition-panel-details .competition-stage-match-detail-link {
    display: block;
    padding: 10px 12px;
    border-top: 1px solid #e7eee2;
    color: #467c32;
    font-size: .76rem;
    font-weight: 900;
    text-align: center;
    text-decoration: none;
}

    #competition-panel-details .competition-stage-match-detail-link:hover {
        background: #f1f8ec;
        text-decoration: underline;
    }


/* ================================================================
   Detailed competition tab: ONE knockout match per row (26 Oct 2026)
   Preserve other tabs and the full 11-column standings.
   ================================================================ */
#competition-panel-details .competition-smart-ties {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 13px;
    width: 100%;
    max-width: 880px;
    margin-inline: auto;
}

#competition-panel-details .competition-smart-round {
    min-width: 0;
}

    #competition-panel-details .competition-smart-round + .competition-smart-round {
        margin-top: 3px;
    }

#competition-panel-details .competition-smart-knockout {
    gap: 13px;
}

#competition-panel-details .competition-smart-tie {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
}

#competition-panel-details .competition-smart-match-number {
    padding: 10px 14px 8px;
    background: #fff;
    color: #506b47;
    font-weight: 900;
    font-size: .82rem;
    text-align: start;
    border-bottom: 1px solid #eef3ea;
}

#competition-panel-details .competition-smart-tie-top {
    grid-template-columns: minmax(0, 1fr) minmax(62px, auto) minmax(0, 1fr);
    width: 100%;
    min-width: 0;
}

#competition-panel-details .competition-smart-team,
#competition-panel-details .competition-smart-team-link,
#competition-panel-details .competition-smart-team-link span {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
}

#competition-panel-details .competition-smart-leg {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Entry-position cards and knockout pairings are also one per row. */
#competition-panel-details .competition-incoming-list,
#competition-panel-details .competition-incoming-list.is-versus-list,
#competition-panel-details .competition-incoming-list.is-single-column {
    grid-template-columns: minmax(0, 1fr);
}

#competition-panel-details .competition-incoming-item {
    grid-template-columns: minmax(0, 1fr);
}

#competition-panel-details .competition-incoming-versus-row {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    max-width: 880px;
    margin-inline: auto;
}

@media (max-width: 600px) {
    #competition-panel-details .competition-smart-ties {
        gap: 10px;
    }

    #competition-panel-details .competition-smart-match-number {
        font-size: .78rem;
        padding: 9px 10px 7px;
    }

    #competition-panel-details .competition-smart-tie-top {
        grid-template-columns: minmax(0, 1fr) minmax(52px, auto) minmax(0, 1fr);
        gap: 5px;
        padding: 11px 6px;
    }

    #competition-panel-details .competition-smart-team-link {
        gap: 5px;
        font-size: .78rem;
    }

        #competition-panel-details .competition-smart-team-link img {
            width: 27px;
            height: 27px;
        }

    #competition-panel-details .competition-smart-tie-score {
        min-width: 0;
    }

        #competition-panel-details .competition-smart-tie-score strong {
            font-size: 1.07rem;
        }

        #competition-panel-details .competition-smart-tie-score small {
            white-space: normal;
            text-align: center;
            font-size: .61rem;
        }

    #competition-panel-details .competition-smart-qualified-label {
        font-size: .62rem;
        padding: 3px 6px;
    }

    #competition-panel-details .competition-smart-leg {
        align-items: flex-start;
        gap: 5px 10px;
        padding: 8px;
        font-size: .73rem;
    }

    #competition-panel-details .competition-incoming-versus-row {
        gap: 6px;
    }

    #competition-panel-details .competition-incoming-versus-entrant {
        padding: 8px 7px;
    }
}


/* ================================================================
   Detailed knockout match: names outside, logos beside centre result/date
   Scoped exclusively to the Details tab; other views are unchanged.
   ================================================================ */
#competition-panel-details .competition-smart-tie-top.competition-smart-center-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(86px, auto) minmax(0, 1fr);
    align-items: center;
    gap: clamp(8px, 1.5vw, 22px);
    padding: 16px clamp(10px, 2.2vw, 24px);
    direction: rtl;
}

#competition-panel-details .competition-smart-center-line .competition-smart-team {
    display: block;
    min-width: 0;
    width: 100%;
    text-align: initial;
}

#competition-panel-details .competition-smart-center-line .competition-smart-team-link {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    text-decoration: none;
    line-height: 1.5;
}

    #competition-panel-details .competition-smart-center-line .competition-smart-team-link:not(.is-static):focus-visible {
        outline: 2px solid #5b8c3b;
        outline-offset: 3px;
        border-radius: 5px;
    }

/* Limit the defeated-team strike-through to the name, not the crest. */
#competition-panel-details .competition-smart-center-line .competition-smart-team.is-eliminated,
#competition-panel-details .competition-smart-center-line .competition-smart-team.is-eliminated .competition-smart-team-link {
    text-decoration: none;
}

#competition-panel-details .competition-smart-center-line .competition-smart-club-name {
    flex: 1 1 auto;
    min-width: 0;
    text-decoration: inherit;
    overflow-wrap: anywhere;
}

#competition-panel-details .competition-smart-center-line .is-home .competition-smart-club-name {
    text-align: right;
}

#competition-panel-details .competition-smart-center-line .is-away .competition-smart-club-name {
    text-align: left;
}

#competition-panel-details .competition-smart-center-line .competition-smart-center-logo,
#competition-panel-details .competition-smart-center-line .competition-smart-logo-fallback {
    flex: 0 0 43px;
    width: 43px;
    height: 43px;
    object-fit: contain;
    border: 1px solid #e1eadb;
    border-radius: 11px;
    background: #fff;
    padding: 4px;
}

#competition-panel-details .competition-smart-center-line .competition-smart-logo-fallback {
    display: grid;
    place-items: center;
    font-size: 1.15rem;
    color: #809477;
    background: #f1f6ee;
}

#competition-panel-details .competition-smart-center-line .competition-smart-tie-score {
    display: grid;
    justify-items: center;
    align-items: center;
    gap: 3px;
    min-width: 86px;
    padding: 5px 7px;
    border-radius: 10px;
    background: #eef5e9;
    color: #244724;
    text-align: center;
    direction: ltr;
}

    #competition-panel-details .competition-smart-center-line .competition-smart-tie-score strong {
        line-height: 1.45;
        font-size: 1.26rem;
        font-weight: 950;
        font-variant-numeric: tabular-nums;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-tie-score .competition-smart-kickoff-date {
        font-size: .85rem;
        font-weight: 900;
        white-space: nowrap;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-tie-score .competition-smart-pending-score {
        color: #6f8073;
        font-size: .94rem;
    }

#competition-panel-details .competition-smart-center-line .competition-smart-team.is-qualified .competition-smart-club-name {
    color: #277a34;
    font-size: 1.05rem;
    font-weight: 950;
    text-decoration: none;
}

#competition-panel-details .competition-smart-center-line .competition-smart-team.is-eliminated .competition-smart-club-name {
    color: #b42318;
    font-size: .93rem;
    font-weight: 750;
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
}

/* Never strike through the crest; the result reflects the match only. */
#competition-panel-details .competition-smart-center-line .competition-smart-team.is-eliminated .competition-smart-center-logo,
#competition-panel-details .competition-smart-center-line .competition-smart-team.is-eliminated .competition-smart-logo-fallback {
    text-decoration: none;
}

@media(max-width:650px) {
    #competition-panel-details .competition-smart-tie-top.competition-smart-center-line {
        grid-template-columns: minmax(0, 1fr) minmax(75px, auto) minmax(0, 1fr);
        gap: 5px;
        padding: 11px 7px;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-team-link {
        gap: 5px;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-center-logo,
    #competition-panel-details .competition-smart-center-line .competition-smart-logo-fallback {
        flex-basis: 30px;
        width: 30px;
        height: 30px;
        padding: 3px;
        border-radius: 8px;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-club-name,
    #competition-panel-details .competition-smart-center-line .competition-smart-team.is-qualified .competition-smart-club-name,
    #competition-panel-details .competition-smart-center-line .competition-smart-team.is-eliminated .competition-smart-club-name {
        font-size: .79rem;
        line-height: 1.45;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-tie-score {
        min-width: 75px;
        padding: 4px 3px;
    }

        #competition-panel-details .competition-smart-center-line .competition-smart-tie-score strong {
            font-size: .99rem;
        }

        #competition-panel-details .competition-smart-center-line .competition-smart-tie-score .competition-smart-kickoff-date {
            font-size: .71rem;
        }
}

@media(max-width:370px) {
    #competition-panel-details .competition-smart-tie-top.competition-smart-center-line {
        grid-template-columns: minmax(0, 1fr) minmax(69px, auto) minmax(0, 1fr);
        gap: 3px;
        padding-inline: 5px;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-center-logo,
    #competition-panel-details .competition-smart-center-line .competition-smart-logo-fallback {
        flex-basis: 26px;
        width: 26px;
        height: 26px;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-tie-score {
        min-width: 69px;
    }
}


/* ================================================================
   2026-10-26 – knockout club labels visually grouped with logos.
   Keeps crests adjacent to the centered score/date, with club
   names immediately beside the crests instead of at card edges.
   Applies only to the detailed stages, not the matchday list.
   ================================================================ */
#competition-panel-details .competition-smart-tie-top.competition-smart-center-line {
    grid-template-columns: minmax(0, 185px) minmax(82px, max-content) minmax(0, 185px);
    justify-content: center;
    gap: clamp(5px, 1vw, 11px);
}

#competition-panel-details .competition-smart-center-line .competition-smart-team-link {
    width: 100%;
    gap: 6px;
    justify-content: flex-start;
}

/* In RTL, home name → logo; pack toward the central score. */
#competition-panel-details .competition-smart-center-line .is-home .competition-smart-team-link {
    justify-content: flex-end;
}

/* In RTL, away logo → name; pack toward the central score. */
#competition-panel-details .competition-smart-center-line .is-away .competition-smart-team-link {
    justify-content: flex-start;
}

#competition-panel-details .competition-smart-center-line .competition-smart-club-name {
    flex: 0 1 auto;
    max-width: calc(100% - 43px - 6px);
    overflow-wrap: anywhere;
}

@media (max-width: 650px) {
    #competition-panel-details .competition-smart-tie-top.competition-smart-center-line {
        grid-template-columns: minmax(0, 1fr) minmax(75px, max-content) minmax(0, 1fr);
        justify-content: center;
        gap: 4px;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-team-link {
        gap: 4px;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-club-name {
        max-width: calc(100% - 30px - 4px);
    }
}

@media (max-width: 370px) {
    #competition-panel-details .competition-smart-tie-top.competition-smart-center-line {
        grid-template-columns: minmax(0, 1fr) minmax(69px, max-content) minmax(0, 1fr);
        gap: 3px;
    }

    #competition-panel-details .competition-smart-center-line .competition-smart-club-name {
        max-width: calc(100% - 26px - 4px);
    }
}

/* ======================================================================
   CHAMPIONS HISTORY | أبطال المنافسة
   One continuous card with optional league-only expanding final table.
   Scoped to the fourth tab; earlier CompetitionDetails design untouched.
   ====================================================================== */
.competition-page .gs-ch-history-card {
    overflow: hidden;
    padding: 0;
    border: 1px solid #e0e8dc;
    border-radius: 18px;
    background: #fff;
}

.competition-page .gs-ch-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
    padding: 18px 22px 15px;
    border-bottom: 1px solid #e7ece5;
    background: #fbfcfa;
}

    .competition-page .gs-ch-section-heading h2 {
        margin: 0;
        color: #294626;
        font-size: 1.17rem;
        font-weight: 950;
    }

    .competition-page .gs-ch-section-heading p {
        margin: 4px 0 0;
        color: #748072;
        font-size: .77rem;
        font-weight: 650;
    }

.competition-page .gs-ch-history {
    display: block;
    min-width: 0;
}

.competition-page .gs-ch-season {
    position: relative;
    min-width: 0;
    padding: 17px 22px 16px;
    border-bottom: 1px solid #e9eee6;
    background: #fff;
}

    .competition-page .gs-ch-season:last-child {
        border-bottom: 0;
    }

    .competition-page .gs-ch-season:has(.gs-ch-standings-details[open]) {
        background: #fdfefc;
    }

.competition-page .gs-ch-season-heading {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: center;
    justify-content: space-between;
    min-height: 32px;
    margin-bottom: 13px;
}

.competition-page .gs-ch-season.has-standings .gs-ch-season-heading {
    padding-left: 48px;
}

.competition-page .gs-ch-season-title {
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px 9px;
}

    .competition-page .gs-ch-season-title h3 {
        margin: 0;
        color: #233e28;
        font-size: 1.02rem;
        line-height: 1.45;
        font-weight: 950;
    }

.competition-page .gs-ch-season-marker {
    flex: 0 0 auto;
    width: 7px;
    height: 23px;
    border-radius: 7px;
    background: var(--competition-green);
}

.competition-page .gs-ch-ongoing {
    padding: 4px 8px;
    border-radius: 20px;
    background: #f2f3f3;
    color: #6b756e;
    font-size: .67rem;
    font-weight: 750;
}

.competition-page .gs-ch-season-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d4e2cd;
    border-radius: 8px;
    padding: 5px 9px;
    color: #52763f;
    font-size: .73rem;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

    .competition-page .gs-ch-season-link:hover,
    .competition-page .gs-ch-season-link:focus-visible {
        background: #edf5e8;
        color: #365925;
    }

.competition-page .gs-ch-podium {
    display: grid;
    gap: 0;
    max-width: 100%;
}

.competition-page .gs-ch-podium-row {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 6px 14px;
    align-items: center;
    min-height: 48px;
    padding: 5px 1px;
}

    .competition-page .gs-ch-podium-row + .gs-ch-podium-row {
        border-top: 1px dashed #eef0ec;
    }

.competition-page .gs-ch-podium-label {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    color: #6c7b6d;
    font-size: .79rem;
    font-weight: 900;
}

.competition-page .gs-ch-podium-row.is-champion .gs-ch-podium-label {
    color: #468137;
}

.competition-page .gs-ch-club {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    gap: 11px;
    min-width: 0;
    max-width: 100%;
    color: #213b28;
    font-size: .93rem;
    line-height: 1.6;
    font-weight: 850;
    text-decoration: none;
}

    .competition-page .gs-ch-club:hover,
    .competition-page .gs-ch-club:focus-visible {
        color: var(--competition-green-dark);
        text-decoration: underline;
    }

    .competition-page .gs-ch-club strong {
        min-width: 0;
        font-size: inherit;
        font-weight: 900;
        overflow-wrap: anywhere;
    }

.competition-page .gs-ch-podium-row.is-champion .gs-ch-club strong {
    color: #326a2a;
}

.competition-page .gs-ch-logo {
    display: flex;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    overflow: hidden;
    border: 1px solid #e2e9df;
    border-radius: 50%;
    background: #fff;
}

    .competition-page .gs-ch-logo img {
        display: block;
        max-width: 100%;
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 3px;
    }

    .competition-page .gs-ch-logo > span {
        color: #648858;
        font-size: 1rem;
        font-weight: 950;
    }

.competition-page .gs-ch-pending {
    color: #9aa29c;
    font-size: .8rem;
    font-weight: 700;
}

.competition-page .gs-ch-standings-details {
    display: block;
    min-width: 0;
}

.competition-page .gs-ch-expand-toggle {
    position: absolute;
    top: 16px;
    left: 20px;
    display: grid;
    place-items: center;
    width: 35px;
    height: 35px;
    padding: 0;
    border: 1px solid #bbd0ae;
    border-radius: 10px;
    background: #f3f8f0;
    color: #497739;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

    .competition-page .gs-ch-expand-toggle::-webkit-details-marker {
        display: none;
    }

    .competition-page .gs-ch-expand-toggle::marker {
        content: '';
    }

    .competition-page .gs-ch-expand-toggle span {
        display: block;
        font: 900 1.45rem/1 Arial, sans-serif;
    }

    .competition-page .gs-ch-expand-toggle:hover,
    .competition-page .gs-ch-expand-toggle:focus-visible {
        border-color: #83ae6d;
        background: #eaf4e4;
        outline-offset: 3px;
    }

.competition-page .gs-ch-standings-details[open] .gs-ch-expand-toggle span {
    transform: rotate(45deg);
}

.competition-page .gs-ch-table-area {
    margin-top: 15px;
    padding-top: 14px;
    border-top: 1px solid #e3ecdd;
}

    .competition-page .gs-ch-table-area h4 {
        margin: 0 0 12px;
        color: #466839;
        font-size: .88rem;
        font-weight: 950;
    }

.competition-page .gs-ch-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    border: 1px solid #e5eae2;
    border-radius: 10px;
}

.competition-page .gs-ch-standings-table {
    min-width: 810px;
    margin: 0;
}

    .competition-page .gs-ch-standings-table th,
    .competition-page .gs-ch-standings-table td {
        white-space: nowrap;
    }

    .competition-page .gs-ch-standings-table .club-column {
        min-width: 174px;
    }

@media (max-width: 767px) {
    .competition-page .gs-ch-history-card {
        border-radius: 14px;
    }

    .competition-page .gs-ch-section-heading {
        padding: 16px 13px 12px;
    }

        .competition-page .gs-ch-section-heading h2 {
            font-size: 1.07rem;
        }

    .competition-page .gs-ch-season {
        padding: 14px 12px;
    }

        .competition-page .gs-ch-season.has-standings .gs-ch-season-heading {
            padding-left: 37px;
        }

    .competition-page .gs-ch-season-title h3 {
        font-size: .94rem;
    }

    .competition-page .gs-ch-season-link {
        font-size: .69rem;
        padding: 5px 6px;
    }

    .competition-page .gs-ch-podium-row {
        grid-template-columns: 57px minmax(0, 1fr);
        gap: 8px;
        min-height: 46px;
    }

    .competition-page .gs-ch-club {
        gap: 7px;
        font-size: .85rem;
    }

    .competition-page .gs-ch-logo {
        flex-basis: 30px;
        width: 30px;
        height: 30px;
    }

    .competition-page .gs-ch-expand-toggle {
        top: 13px;
        left: 11px;
        width: 31px;
        height: 31px;
    }

    .competition-page .gs-ch-standings-table {
        min-width: 780px;
    }
}

@media (max-width: 380px) {
    .competition-page .gs-ch-season-heading {
        align-items: flex-start;
    }

    .competition-page .gs-ch-season.has-standings .gs-ch-season-heading {
        padding-left: 35px;
    }

    .competition-page .gs-ch-season-link {
        font-size: .65rem;
    }
}
