/**
 * ALERT BANNER - REFINED ARCHITECTURE
 * Layout de Colunas: [Icon] [Title + Body]
 */
.alert-banner {
    --ai-bg-primary: #104617;
    --ai-bg-icon: #1B7727;
    --ai-border-lemon: #51FA67;
    --ai-white: #FAFFFA;
    --ai-text-title: #E7FFEB;
    --ai-text-body: #E3E3E3;

    background-color: var(--ai-bg-primary);
    border-bottom: 0.25rem solid var(--ai-border-lemon); /* 4px */
    padding: 0.75rem 0; /* 12px */
    font-family: 'Kanit', sans-serif;
    position: relative;
    z-index: 9999;
}

/* Colunas do Layout */
.alert-banner__wrapper {
    width: 100%;
}


/**
 * Especificidade para o container do banner
 * Permite ajustes sem afetar o container global do site
 */
.alert-banner .container {
    max-width: 82.5rem; /* 1320px */
}

/* Estilos específicos para o tipo 'alerta' se necessário */
@media (min-width: 62rem) { /* Desktop (992px+) */
    .alert-banner--alerta .container {
        padding-left: 8.3rem;
    }
}

.alert-banner__icon-column {
    flex-shrink: 0;
}

.alert-banner__content-column {
    min-width: 0;
}

/* Estilo do Ícone */
.alert-banner__icon-container {
    width: 1.875rem; /* 30px */
    height: 1.875rem; /* 30px */
    padding-left: 0.12rem; /* ~1.91px */
    padding-right: 0.12rem; /* ~1.91px */
    border-radius: 0.535rem; /* ~8.57px */
    background: var(--ai-bg-icon);
}

.alert-banner__icon-container .material-symbols-outlined {
    color: var(--ai-white);
    font-size: 1.125rem; /* 18px */
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Título e Cabeçalho */
.alert-banner__header {
    min-height: .25rem !important;; 
    padding-bottom: .25rem!important; /* 4px */
}

.alert-banner__title {
    font-family: 'Kanit', sans-serif;
    font-weight: 400;
    font-size: 1.25rem; /* 20px */
    line-height: 100%;
    color: var(--ai-text-title);
}

/* Descrição e Link (Inline Flow) */
.alert-banner__body {
    padding-top: 0 !important; /* 4px */
}

.alert-banner__description {
    font-family: 'Kanit', sans-serif;
    font-weight: 300;
    font-size: 1rem; /* 16px */
    line-height: 132%;
    color: var(--ai-text-body);
}

.alert-banner__read-more {
    font-family: 'Kanit', sans-serif;
    font-weight: 500;
    font-size: 1rem; /* 16px */
    line-height: 100%;
    color: var(--ai-white);
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.alert-banner__read-more:hover,
.alert-banner__read-more:focus {
    color: var(--ai-white);
    opacity: 0.8;
}

.alert-banner__read-more span:not(.material-symbols-outlined) {
    text-decoration: underline;
}

.alert-banner__read-more .material-symbols-outlined {
    font-size: 1rem; /* 16px */
    text-decoration: none !important;
    display: inline-block;
}

/* Botão Toggle */
.alert-banner__toggle {
    background: transparent;
    border: none;
    color: var(--ai-white);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
}

.alert-banner__toggle-icon {
    font-size: 1.5rem; /* 24px */
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.alert-banner__toggle[aria-expanded="true"] .alert-banner__toggle-icon {
    transform: rotate(0deg);
}

.alert-banner__toggle[aria-expanded="false"] .alert-banner__toggle-icon {
    transform: rotate(-180deg);
}

.alert-banner__toggle:focus {
    outline: 0.125rem solid var(--ai-border-lemon); /* 2px */
    border-radius: 0.25rem; /* 4px */
}

/* Mobile Adjustments */
@media (max-width: 61.9375rem) { /* Tablet e Mobile (<992px) */
    .alert-banner__title {
        font-size: 1rem; /* Padronizado para 1rem */
    }

    .alert-banner__description,
    .alert-banner__read-more {
        font-size: 1rem;
    }

    .alert-banner__body {
        padding-top: 0 !important;
    }

    .alert-banner__header{
        min-height: .5rem;
        padding-bottom: .5rem;
    }
}