/* KISURE FE893 — solid entity colours + reliable player image trimming.
 * This layer intentionally overrides FE891/FE892 tinted/gradient entity heroes
 * with solid identity colours while preserving the existing page structures.
 */

/* --------------------------------------------------------------------------
 * Shared solid identity hero treatment: club, player, coach, referee.
 * -------------------------------------------------------------------------- */
html[data-kisure-design="865"] body :is(
    .football-club-hero--v337,
    .football-player-hero--v335
) {
    background: var(--ks-hero-accent, #087C78) !important;
    background-image: none !important;
    border-color: var(--ks-hero-border, rgba(255,255,255,.24)) !important;
    color: var(--ks-hero-on-color, #FFFFFF) !important;
    box-shadow: none !important;
}

html[data-kisure-design="865"] body :is(
    .football-club-hero--v337,
    .football-player-hero--v335
) :is(h1, h2, h3, strong, .site-kicker, .football-page-live-indicator) {
    color: var(--ks-hero-on-color, #FFFFFF) !important;
}

html[data-kisure-design="865"] body :is(
    .football-club-hero--v337,
    .football-player-hero--v335
) :is(p, small) {
    color: var(--ks-hero-muted, rgba(255,255,255,.78)) !important;
}

html[data-kisure-design="865"] body :is(
    .football-club-hero--v337,
    .football-player-hero--v335
) :is(
    .football-club-hero__badge,
    .football-player-hero__photo,
    .football-club-hero__quick > span,
    .football-player-hero__quick > span,
    .football-player-team-link
) {
    background: var(--ks-hero-panel, rgba(0,0,0,.18)) !important;
    background-image: none !important;
    border-color: var(--ks-hero-border, rgba(255,255,255,.24)) !important;
    box-shadow: none !important;
}

html[data-kisure-design="865"] body :is(
    .football-club-hero--v337,
    .football-player-hero--v335
) .site-button--ghost {
    background: transparent !important;
    border-color: var(--ks-hero-border, rgba(255,255,255,.38)) !important;
    color: var(--ks-hero-on-color, #FFFFFF) !important;
}

html[data-kisure-design="865"] body :is(
    .football-club-hero--v337,
    .football-player-hero--v335
) .site-button--ghost:hover {
    background: var(--ks-hero-panel, rgba(0,0,0,.18)) !important;
}

html[data-theme="dark"][data-kisure-design="865"] body :is(
    .football-club-hero--v337,
    .football-player-hero--v335
) {
    background: var(--ks-hero-accent, #087C78) !important;
    background-image: none !important;
}

/* Keep crests/portraits visually clean on the solid colour surface. */
html[data-kisure-design="865"] body .football-club-hero__badge img,
html[data-kisure-design="865"] body .football-player-hero__photo img,
html[data-kisure-design="865"] body .football-player-team-link img {
    background: transparent !important;
    object-fit: contain !important;
}

/* --------------------------------------------------------------------------
 * League / competition identity: extracted logo colour becomes the actual
 * solid hero/header surface, not merely a border accent.
 * -------------------------------------------------------------------------- */
html[data-kisure-design="865"] body .football-league-hero[data-kisure-competition-themed="1"] {
    background: var(--ks-competition-accent, #087C78) !important;
    background-image: none !important;
    border-color: var(--ks-competition-border, rgba(255,255,255,.24)) !important;
    color: var(--ks-competition-on-accent, #FFFFFF) !important;
    box-shadow: none !important;
}

html[data-kisure-design="865"] body .football-league-hero[data-kisure-competition-themed="1"] :is(
    h1, h2, h3, strong, .site-kicker, .football-league-hero__country,
    .football-league-hero__country span, .football-page-live-indicator
) {
    color: var(--ks-competition-on-accent, #FFFFFF) !important;
}

html[data-kisure-design="865"] body .football-league-hero[data-kisure-competition-themed="1"] :is(p, small) {
    color: var(--ks-competition-muted, rgba(255,255,255,.78)) !important;
}

html[data-kisure-design="865"] body .football-league-hero[data-kisure-competition-themed="1"] .football-league-hero__meta > span,
html[data-kisure-design="865"] body .football-league-hero[data-kisure-competition-themed="1"] .football-season-switcher--dropdown {
    background: var(--ks-competition-panel, rgba(0,0,0,.18)) !important;
    border-color: var(--ks-competition-border, rgba(255,255,255,.24)) !important;
    color: var(--ks-competition-on-accent, #FFFFFF) !important;
    box-shadow: none !important;
}

html[data-kisure-design="865"] body .football-league-hero[data-kisure-competition-themed="1"] .football-season-switcher--dropdown label {
    color: var(--ks-competition-on-accent, #FFFFFF) !important;
}

html[data-kisure-design="865"] body .football-league-hero[data-kisure-competition-themed="1"] .football-season-switcher--dropdown select {
    background: var(--ks-competition-on-accent, #FFFFFF) !important;
    color: var(--ks-competition-accent, #087C78) !important;
}

/* Fixture competition headings also use their league/logo colour as a solid
 * identity strip, with JS supplying readable foreground contrast. */
html[data-kisure-design="865"] body .football-schedule-competition[data-kisure-competition-themed="1"] > .football-schedule-competition__head {
    background: var(--ks-competition-accent, #087C78) !important;
    background-image: none !important;
    border-color: var(--ks-competition-accent, #087C78) !important;
    box-shadow: none !important;
    color: var(--ks-competition-on-accent, #FFFFFF) !important;
}
html[data-kisure-design="865"] body .football-schedule-competition[data-kisure-competition-themed="1"] > .football-schedule-competition__head * {
    color: inherit !important;
}

/* --------------------------------------------------------------------------
 * Stadium hero: use home-team colour when available, otherwise Kisure dark.
 * The image remains photographic; the information half is solid identity.
 * -------------------------------------------------------------------------- */
html[data-kisure-design="865"] body .ks-stadium-hero__body {
    background: var(--ks-hero-accent, #087C78) !important;
    background-image: none !important;
    color: var(--ks-hero-on-color, #FFFFFF) !important;
}
html[data-kisure-design="865"] body .ks-stadium-hero__body :is(h1, h2, h3, strong, .ks-stadium-kicker) {
    color: var(--ks-hero-on-color, #FFFFFF) !important;
}
html[data-kisure-design="865"] body .ks-stadium-hero__body :is(p, small, .ks-stadium-location) {
    color: var(--ks-hero-muted, rgba(255,255,255,.78)) !important;
}
html[data-kisure-design="865"] body .ks-stadium-hero__body :is(.ks-stadium-facts > div, .ks-stadium-address) {
    background: var(--ks-hero-panel, rgba(0,0,0,.18)) !important;
    border-color: rgba(255,255,255,.22) !important;
    box-shadow: none !important;
}

/* --------------------------------------------------------------------------
 * Player image trim output: the cropped transparent rendition should visually
 * blend directly into the solid team-colour hero.
 * -------------------------------------------------------------------------- */
html[data-kisure-design="865"] body .ks-player-face-img.is-kisure-white-trimmed-v893,
html[data-kisure-design="865"] body .ks-player-face-img--hero.is-kisure-white-trimmed-v893 {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    object-fit: contain !important;
}

/* Prediction model panel: preserve FE892 geometry and make alignment explicit. */
html[data-kisure-design="865"] body .football-prediction-model-panel .football-link-list > span {
    grid-template-columns: 38px minmax(0, 1fr) !important;
    align-items: center !important;
}
html[data-kisure-design="865"] body .football-prediction-model-panel .football-link-list > span > i {
    align-self: center !important;
    justify-self: center !important;
}

@media (max-width: 640px) {
    html[data-kisure-design="865"] body .football-prediction-model-panel .football-link-list > span {
        grid-template-columns: 34px minmax(0, 1fr) !important;
    }
}