/* Section: crisis-banner.
   Variables can be overridden inline (per-page or via Customizer):
     --crisis-bg, --crisis-fg, --crisis-btn-bg, --crisis-btn-fg, --crisis-btn-bg-hover
*/

.crisis-banner {
    --crisis-bg: var(--emergency);
    --crisis-fg: #ffffff;
    --crisis-btn-bg: rgba(255,255,255,0.95);
    --crisis-btn-fg: var(--emergency);
    --crisis-btn-bg-hover: #ffffff;

    background: var(--crisis-bg);
    color: var(--crisis-fg);
    padding: 8px 0;
    font-size: 13.5px;
    line-height: 1.4;
}
.crisis-banner .container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px 18px;
    flex-wrap: wrap;
}
.crisis-banner > .container > span { display: inline-flex; align-items: center; }
.crisis-banner strong { font-weight: 700; }
/* Subtle inline link, not a solid button — keeps the bar slim and calm. */
.crisis-banner a {
    color: #ffffff;
    background: none;
    padding: 0;
    border-radius: 0;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: opacity 0.15s ease;
}
.crisis-banner a:hover { color: #ffffff; opacity: 0.82; }
.crisis-banner .pulse {
    display: inline-block;
    width: 7px;
    height: 7px;
    background: currentColor;
    border-radius: 50%;
    margin-right: 7px;
    animation: crisis-pulse 1.8s infinite ease-in-out;
}
@keyframes crisis-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.4; transform: scale(1.4); }
}
@media (max-width: 720px) {
    .crisis-banner { font-size: 13px; padding: 12px 0; }
    .crisis-banner .container { gap: 12px; }
}

.crisis-banner.is-dismissed { display: none; }