/* ==========================================================================
   Notice Component
   ========================================================================== */

.pf-redes-notice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--pf-redes-spacing-sm) var(--pf-redes-spacing-md);
    border-radius: var(--pf-redes-radius);
    border-left: 4px solid;
    margin-bottom: var(--pf-redes-spacing-md);
    font-size: var(--pf-redes-font-size-sm);
}

.pf-redes-notice--success {
    background: #f0fff4;
    border-left-color: #38a169;
    color: #276749;
}

.pf-redes-notice--error {
    background: #fff5f5;
    border-left-color: #e53e3e;
    color: #9b2c2c;
}

.pf-redes-notice--warning {
    background: #fffff0;
    border-left-color: #d69e2e;
    color: #975a16;
}

.pf-redes-notice--info {
    background: #ebf8ff;
    border-left-color: #3182ce;
    color: #2a4365;
}

.pf-redes-notice__message {
    flex: 1;
}

.pf-redes-notice__close {
    background: none;
    border: none;
    font-size: 1.25rem;
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    padding: 0;
    margin-left: var(--pf-redes-spacing-sm);
    line-height: 1;
    transition: opacity var(--pf-redes-transition);
}

.pf-redes-notice__close:hover {
    opacity: 1;
}