/**
 * Alerts Component
 *
 * Alert/notification styles for user feedback.
 * Uses CSS variables from colors-variables.css for theming.
 *
 * Classes:
 * - .alert            : Base alert
 * - .alert--success   : Success alert (BEM)
 * - .alert--danger    : Danger/error alert (BEM)
 * - .alert--warning   : Warning alert (BEM)
 * - .alert--info      : Info alert (BEM)
 * - .alert-success    : Bootstrap alias
 * - .alert-danger     : Bootstrap alias
 * - .alert-warning    : Bootstrap alias
 * - .alert-info       : Bootstrap alias
 */

/* ========================================
   Base Alert
   ======================================== */

.alert {
    position: relative;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 0.95rem;
    line-height: 1.5;
}

.alert p:last-child {
    margin-bottom: 0;
}

/* ========================================
   Alert Variants (BEM)
   ======================================== */

.alert--success {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #155724;
}

.alert--danger {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}

.alert--warning {
    background-color: #fff3cd;
    border-color: #ffeeba;
    color: #856404;
}

.alert--info {
    background-color: #d1ecf1;
    border-color: #bee5eb;
    color: #0c5460;
}

/* ========================================
   Bootstrap-Style Aliases
   ======================================== */

.alert-success {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #155724;
}

.alert-danger {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}

.alert-warning {
    background-color: #fff3cd;
    border-color: #ffeeba;
    color: #856404;
}

.alert-info {
    background-color: #d1ecf1;
    border-color: #bee5eb;
    color: #0c5460;
}

/* ========================================
   Dismissible Alerts
   ======================================== */

.alert-dismissible {
    padding-right: 3rem;
}

.alert-dismissible .close,
.alert-dismissible .btn-close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 1rem 1.25rem;
    background: transparent;
    border: 0;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
    color: inherit;
    opacity: 0.5;
    cursor: pointer;
}

.alert-dismissible .close:hover,
.alert-dismissible .btn-close:hover {
    opacity: 0.75;
}

/* ========================================
   Alert Links
   ======================================== */

.alert a,
.alert-link {
    font-weight: 600;
}

.alert-success a,
.alert-success .alert-link,
.alert--success a,
.alert--success .alert-link {
    color: #0b4f30;
}

.alert-danger a,
.alert-danger .alert-link,
.alert--danger a,
.alert--danger .alert-link {
    color: #491217;
}

.alert-warning a,
.alert-warning .alert-link,
.alert--warning a,
.alert--warning .alert-link {
    color: #533f03;
}

.alert-info a,
.alert-info .alert-link,
.alert--info a,
.alert--info .alert-link {
    color: #062c33;
}