/* Flash message — the confirmation ("Forecast updated.") or refusal shown after a post-redirect-get.
   Used on any page, so it lives on its own rather than inside a page's component sheet. */
.flash {
    margin: var(--spacing-4) 0 var(--spacing-5);
    padding: var(--spacing-3) var(--spacing-4);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    overflow: hidden;

    /* A success flash says its piece and then gets out of the way (flash.js). Fading and collapsing
       together lets the content below rise smoothly instead of snapping up when the element goes. */
    transition:
        opacity 0.4s ease,
        margin 0.4s ease,
        padding 0.4s ease,
        border-width 0.4s ease,
        max-height 0.4s ease;
}
.flash--success { color: var(--color-success); background: rgba(22, 163, 74, 0.08); border: 1px solid var(--color-success); }
.flash--error { color: var(--color-danger); background: rgba(220, 38, 38, 0.08); border: 1px solid var(--color-danger); }

.flash--leaving {
    opacity: 0;
    max-height: 0;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-width: 0;
}

@media (prefers-reduced-motion: reduce) {
    .flash { transition: none; }
}