/* Postponements take priority over live scores and countdowns. */
#dtfc-desktop-hero-section.dtfc-hero-is-postponed > :not(.dtfc-postponement-notice),
#dtfc-mobile-hero-section.dtfc-hero-is-postponed > :not(.dtfc-postponement-notice) { display: none !important; }
#dtfc-desktop-hero-section.dtfc-hero-is-postponed,
#dtfc-mobile-hero-section.dtfc-hero-is-postponed { position: relative; background: #111; min-height: 370px; }
.dtfc-postponement-notice {
    position: absolute; inset: 0; box-sizing: border-box; overflow: hidden;
    display: grid; grid-template-columns: minmax(80px, 180px) minmax(0, 760px) minmax(80px, 180px);
    justify-content: center; align-items: center; gap: clamp(16px, 2.5vw, 48px);
    padding: 40px clamp(24px, 4vw, 72px); text-align: center; color: #fff;
    background: linear-gradient(135deg, #101010, #303030); border-bottom: 5px solid #e0bc4a; z-index: 5;
}
.dtfc-postponement-copy { grid-column: 2; grid-row: 1; position: relative; z-index: 1; min-width: 0; }
.dtfc-postponement-notice p { margin: 0 0 16px; line-height: 1.5; }
.dtfc-postponement-notice .dtfc-postponement-kicker { color: #e0bc4a; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.dtfc-postponement-notice h1 { font-size: clamp(28px, 3.4vw, 50px); line-height: 1.15; margin: 0 0 20px; overflow-wrap: anywhere; }
.dtfc-postponement-team-badge { width: 100%; max-height: 210px; object-fit: contain; grid-row: 1; filter: drop-shadow(0 8px 14px rgba(0,0,0,.35)); }
.dtfc-postponement-home-badge { grid-column: 1; }
.dtfc-postponement-away-badge { grid-column: 3; }
.dtfc-postponement-mobile-badge { display: none; }
#dtfc-mobile-hero-section .dtfc-postponement-notice { display: flex; justify-content: center; align-items: center; padding: 32px 24px; }
#dtfc-mobile-hero-section .dtfc-postponement-team-badge { display: none; }
#dtfc-mobile-hero-section .dtfc-postponement-copy { flex: 1; }
#dtfc-mobile-hero-section .dtfc-postponement-notice h1 { font-size: clamp(27px, 6vw, 38px); }
#dtfc-mobile-hero-section .dtfc-postponement-mobile-badge {
    display: block; position: absolute; width: 300px; height: 300px;
    max-width: none; right: -150px; top: 50%; transform: translateY(-50%);
    object-fit: contain; opacity: .17; pointer-events: none; z-index: 0;
}
@media (max-width: 380px) {
    #dtfc-mobile-hero-section .dtfc-postponement-notice { padding: 26px 18px; }
    #dtfc-mobile-hero-section .dtfc-postponement-notice h1 { font-size: 26px; }
}

/* Let longer reasons grow the hero instead of clipping the text. */
#dtfc-desktop-hero-section.dtfc-hero-is-postponed,
#dtfc-mobile-hero-section.dtfc-hero-is-postponed { height: auto; }
.dtfc-postponement-notice { position: relative; inset: auto; min-height: 370px; }
.dtfc-postponement-reason { line-height: 1.5; overflow-wrap: anywhere; }
.dtfc-postponement-reason p:last-child { margin-bottom: 0; }
.dtfc-postponement-reason a { color: #e0bc4a; text-decoration: underline; text-underline-offset: 3px; }
.dtfc-postponement-reason a:hover, .dtfc-postponement-reason a:focus { color: #fff; }
