/* Banner overrides. Loaded after style.css to take precedence.
   Full-width centered banner; on mobile the CTA stacks under the text
   and the close button moves to the top-right. */

.simple-banner-text > span {
    max-width: 100% !important;
    box-sizing: border-box;
    padding: 0 10px;
    flex-direction: row !important;
}

@media (max-width: 808px) {
    .simple-banner {
        height: auto !important;
        overflow: visible !important;
        padding: 5px 5px !important;
    }
    .simple-banner-text > span {
        flex-direction: column !important;
        gap: 10px;
        padding: 0 8px !important;
        text-align: center;
    }
    .simple-banner-text > span > a {
        margin: 0 !important;
    }
    #simple-banner-close-button {
        position: absolute !important;
        top: 15px !important;
        right: 0px !important;
    }
}