/* v248 focused refinements
   Scope only: homepage/category sidebar width, prediction list cards, single prediction detail spacing.
   No homepage hero or category hero redesign is included here. */
:root {
    --kisure-v248-sidebar: 350px;
    --kisure-v248-layout-gap: clamp(1.15rem, 1.6vw, 1.75rem);
    --kisure-v248-sticky-top: 78px;
}

@media (min-width: 992px) {
    .content-grid,
    .home-news-layout,
    .category-news-layout,
    .tag-news-layout,
    .article-shell {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) var(--kisure-v248-sidebar) !important;
        gap: var(--kisure-v248-layout-gap) !important;
        align-items: start !important;
        overflow: visible !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .content-grid > section,
    .content-grid > main,
    .content-grid > div,
    .article-shell > article,
    .article-shell > section,
    .stack-grid {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .content-grid > aside,
    .article-shell > aside,
    .sidebar-stack,
    .article-rail,
    .football-sidebar-stack,
    .football-match-sidebar-stack {
        width: var(--kisure-v248-sidebar) !important;
        min-width: var(--kisure-v248-sidebar) !important;
        max-width: var(--kisure-v248-sidebar) !important;
        justify-self: end !important;
        overflow: visible !important;
    }

    .content-grid .news-grid,
    .content-grid .news-grid--cards,
    .category-news-layout .news-grid,
    .tag-news-layout .news-grid,
    .stack-grid .news-grid,
    .stack-grid .news-grid--cards {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: clamp(.9rem, 1.25vw, 1.15rem) !important;
        min-width: 0 !important;
    }

    .content-grid .news-card,
    .content-grid .surface-card,
    .category-news-layout .news-card,
    .tag-news-layout .news-card {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .sticky-sidebar,
    aside.sticky-sidebar,
    .sidebar-stack.sticky-sidebar,
    .article-rail.sticky-sidebar,
    .football-sidebar-stack.sticky-sidebar,
    .football-match-sidebar-stack.sticky-sidebar,
    [data-kisure-sticky-sidebar] {
        position: -webkit-sticky !important;
        position: sticky !important;
        top: var(--kisure-v248-sticky-top) !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        transform: none !important;
        z-index: 4 !important;
    }

    .football-layout,
    .football-layout--wide-main,
    .football-layout--match-page,
    .football-prediction-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) var(--kisure-v248-sidebar) !important;
        gap: var(--kisure-v248-layout-gap) !important;
        align-items: start !important;
        overflow: visible !important;
    }

    .football-layout > aside,
    .football-prediction-layout > aside {
        width: var(--kisure-v248-sidebar) !important;
        min-width: var(--kisure-v248-sidebar) !important;
        max-width: var(--kisure-v248-sidebar) !important;
    }
}

@media (max-width: 991.98px) {
    .content-grid,
    .home-news-layout,
    .category-news-layout,
    .tag-news-layout,
    .article-shell,
    .football-layout,
    .football-layout--wide-main,
    .football-layout--match-page,
    .football-prediction-layout {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }

    .content-grid > aside,
    .article-shell > aside,
    .sidebar-stack,
    .article-rail,
    .football-sidebar-stack,
    .football-match-sidebar-stack,
    [data-kisure-sticky-sidebar] {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        position: static !important;
        top: auto !important;
    }
}

/* Prediction list page: make fixtures read as clean 1-X-2 list cards, grouped by league. */
.football-prediction-grid--league,
.football-prediction-surebet-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: clamp(.9rem, 1.25vw, 1.15rem) !important;
}

.football-prediction-match-card {
    align-items: center !important;
    background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(240,253,252,.86)) !important;
    border: 1px solid rgba(14,165,164,.25) !important;
    border-radius: 24px !important;
    box-shadow: 0 16px 36px rgba(15,23,42,.06) !important;
    display: grid !important;
    gap: .9rem !important;
    padding: clamp(.95rem, 1.3vw, 1.15rem) !important;
    width: 100% !important;
}

@media (min-width: 1280px) {
    .football-prediction-match-card {
        grid-template-columns: minmax(210px, .8fr) minmax(360px, 1.2fr) minmax(230px, .7fr) !important;
        grid-template-areas:
            "top teams stats"
            "meta meta actions" !important;
    }

    .football-prediction-match-card__top { grid-area: top; }
    .football-prediction-match-card__teams { grid-area: teams; }
    .football-prediction-match-card__stats { grid-area: stats; }
    .football-prediction-match-card__meta { grid-area: meta; }
    .football-prediction-match-card__actions { grid-area: actions; }
}

.football-prediction-match-card__top,
.football-prediction-match-card__meta,
.football-prediction-match-card__actions {
    min-width: 0 !important;
}

.football-prediction-match-card__teams {
    align-items: center !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    min-width: 0 !important;
}

.football-prediction-match-card__team strong {
    overflow-wrap: anywhere !important;
}

.football-prediction-match-card__stats--one-x-two {
    align-self: stretch !important;
    display: grid !important;
    gap: .55rem !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.football-prediction-match-card__stats--one-x-two span {
    align-content: center !important;
    background: rgba(14,165,164,.08) !important;
    border: 1px solid rgba(14,165,164,.18) !important;
    border-radius: 16px !important;
    display: grid !important;
    gap: .15rem !important;
    min-height: 66px !important;
    padding: .55rem .35rem !important;
    text-align: center !important;
}

.football-prediction-match-card__stats--one-x-two small {
    color: #0d7f83 !important;
    font-family: var(--font-display) !important;
    font-size: .9rem !important;
    font-weight: 950 !important;
    letter-spacing: .06em !important;
}

.football-prediction-match-card__stats--one-x-two strong {
    color: var(--bg-contrast) !important;
    font-family: var(--font-display) !important;
    font-size: clamp(1rem, 1.4vw, 1.3rem) !important;
}

.football-prediction-match-card__stats--one-x-two em {
    color: var(--text-soft) !important;
    font-size: .72rem !important;
    font-style: normal !important;
    font-weight: 850 !important;
    text-transform: uppercase !important;
}

.football-prediction-match-card__actions {
    justify-content: flex-end !important;
}

.football-prediction-mini-pill {
    min-height: 42px !important;
}

@media (max-width: 1279.98px) {
    .football-prediction-match-card {
        grid-template-columns: 1fr !important;
    }

    .football-prediction-match-card__teams {
        grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr) !important;
    }

    .football-prediction-match-card__actions {
        justify-content: flex-start !important;
    }
}

/* Single prediction page: create clear space between meta chips and action buttons. */
.football-prediction-detail-page .football-prediction-detail-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .75rem !important;
    margin-top: 1.05rem !important;
    margin-bottom: 1.2rem !important;
}

.football-prediction-detail-page .football-prediction-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .9rem !important;
    margin-top: .35rem !important;
}

.football-prediction-detail-page .football-prediction-match-hero__copy {
    min-width: 0 !important;
}

.football-prediction-detail-page .football-prediction-detail-card {
    min-width: 0 !important;
}

.football-prediction-detail-page .football-prediction-detail-card .football-prediction-match-card {
    grid-template-columns: 1fr !important;
}

.football-prediction-detail-page .football-prediction-detail-card .football-prediction-match-card__actions {
    justify-content: flex-start !important;
}

html[data-theme="dark"] .football-prediction-match-card {
    background: linear-gradient(135deg, rgba(15,23,42,.94), rgba(8,15,28,.92)) !important;
}
