/*
==============================================================================
SavvyGreat M3 newsroom v7 marquee refinement
- Restores the fixed Breaking news label and bolt icon.
- Keeps only story titles inside the moving lane.
- Uses accessible Material 3 error-container contrast.
- Increases marquee speed while preserving continuous motion.
==============================================================================
*/

.sgnews-m3-page-v3 > .sgnews-m3-breaking-v4.sgnews-m3-breaking-v7 {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: stretch;
    gap: 0;
    min-height: 52px;
    padding: 4px;
    overflow: hidden;
    border: 1px solid var(--md-sys-color-error, #b3261e);
    border-radius: 26px;
    background: var(--md-sys-color-error-container, #f9dedc);
    box-shadow: 0 1px 2px color-mix(in srgb, var(--md-sys-color-shadow, #000) 12%, transparent);
}

.sgnews-m3-breaking-v7 .sgnews-m3-breaking-label-v7 {
    position: relative;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 44px;
    padding: 0 16px;
    border-radius: 21px;
    background: var(--md-sys-color-error, #b3261e);
    color: var(--md-sys-color-on-error, #fff);
    font: 700 12px/16px var(--m3-font-plain, "Segoe UI", sans-serif);
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
    box-shadow: 2px 0 8px color-mix(in srgb, var(--md-sys-color-shadow, #000) 12%, transparent);
}

.sgnews-m3-breaking-v7 .sgnews-m3-breaking-label-v7 .material-symbols-rounded {
    font-size: 19px;
    font-variation-settings: "FILL" 1, "wght" 650, "GRAD" 0, "opsz" 20;
}

.sgnews-m3-breaking-v7 .sgnews-m3-breaking-window {
    min-width: 0;
    border-radius: 0 21px 21px 0;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 97%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 4%, #000 97%, transparent);
}

.sgnews-m3-breaking-v7 .sgnews-m3-breaking-track {
    animation-duration: var(--sgnews-marquee-fast-duration, 32s) !important;
    animation-timing-function: linear !important;
    animation-iteration-count: infinite !important;
}

.sgnews-m3-breaking-v7 .sgnews-m3-breaking-group a {
    min-height: 44px;
    color: var(--md-sys-color-on-error-container, #410e0b);
    font-weight: 650;
    text-shadow: none;
}

.sgnews-m3-breaking-v7 .sgnews-m3-breaking-group a::after {
    background: var(--md-sys-color-error, #b3261e);
    opacity: .65;
}

.sgnews-m3-breaking-v7 .sgnews-m3-breaking-group a:hover,
.sgnews-m3-breaking-v7 .sgnews-m3-breaking-group a:focus-visible {
    background: color-mix(in srgb, var(--md-sys-color-error, #b3261e) 10%, transparent);
}

@media (max-width: 599px) {
    .sgnews-m3-page-v3 > .sgnews-m3-breaking-v4.sgnews-m3-breaking-v7 {
        grid-template-columns: 48px minmax(0, 1fr);
        min-height: 48px;
        padding: 3px;
        border-radius: 23px;
    }

    .sgnews-m3-breaking-v7 .sgnews-m3-breaking-label-v7 {
        justify-content: center;
        width: 42px;
        min-height: 42px;
        padding: 0;
        border-radius: 20px;
    }

    .sgnews-m3-breaking-v7 .sgnews-m3-breaking-label-v7 span:last-child {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .sgnews-m3-breaking-v7 .sgnews-m3-breaking-group a {
        min-height: 42px;
        font-size: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sgnews-m3-breaking-v7 .sgnews-m3-breaking-track {
        animation-duration: var(--sgnews-marquee-fast-reduced-duration, 68s) !important;
    }
}
