/**
 * Information Banner Styles
 */

/* Banner container */
.meom-information-banner {
    background-color: var(--color-black, #000);
    color: var(--color-white, #fff);
    padding-left: var(--side-padding);
    padding-right: max(var(--side-padding), 2.25rem);
    position: fixed;
    z-index: 1000;
    width: 100%;
    top: var(--wp-admin--admin-bar--height, 0px);
}

/* Banner text content */
.meom-information-banner__text {
    font-size: var(--font-size-xs, 1rem);
    padding-bottom: var(--space-3xs, 0.5rem);
    padding-top: var(--space-3xs, 0.5rem);
    text-align: center;
}

/* Button styles within text */
.meom-information-banner__text .btn {
    padding: 0.75rem 1rem;
}

/* Close button */
.meom-information-banner__btn {
    all: unset;
    position: absolute;
    top: 0;
    right: var(--space-xs, 2rem);
    bottom: 0;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.meom-information-banner__btn:hover,
.meom-information-banner__btn:focus {
    opacity: 0.8;
}

.meom-information-banner__btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}