/* === Dryft SweetAlert2 Styling (Light + Dark theme aware) === */

/* ---------- Root Theme Variables ---------- */
:root,
:root[data-bs-theme="light"] {
    --sa-bg: var(--bs-body-bg);
    --sa-fg: var(--bs-body-color);
    --sa-border: var(--bs-border-color);
    --sa-shadow: var(--bs-box-shadow-lg, 0 1rem 3rem rgba(0,0,0,.175));
    --sa-toast-bg: color-mix(in srgb, var(--bs-body-bg) 92%, transparent);
    --sa-toast-border: var(--bs-border-color);
    --sa-success: var(--bs-success);
    --sa-error: var(--bs-danger);
    --sa-warning: var(--bs-warning);
    --sa-info: var(--bs-info);
    --sa-primary: var(--bs-primary);
}

    :root[data-bs-theme="dark"] {
        --sa-bg: var(--bs-body-bg);
        --sa-fg: var(--bs-body-color);
        --sa-border: var(--bs-border-color);
        --sa-shadow: var(--bs-box-shadow-lg, 0 1rem 3rem rgba(0,0,0,.5));
        --sa-toast-bg: color-mix(in srgb, var(--bs-body-bg) 80%, transparent);
        --sa-toast-border: color-mix(in srgb, var(--bs-border-color) 60%, transparent);
        --sa-success: var(--bs-success);
        --sa-error: var(--bs-danger);
        --sa-warning: var(--bs-warning);
        --sa-info: var(--bs-info);
        --sa-primary: var(--bs-primary);
    }

/* Fallback for system dark mode */
@media (prefers-color-scheme: dark) {
    :root:not([data-bs-theme]) {
        --sa-bg: #181a1b;
        --sa-fg: #e2e2e2;
        --sa-border: #2a2d2f;
        --sa-shadow: 0 1rem 3rem rgba(0,0,0,.6);
        --sa-toast-bg: rgba(24,26,27,.92);
        --sa-toast-border: #2a2d2f;
        --sa-success: #28a745;
        --sa-error: #dc3545;
        --sa-warning: #ffc107;
        --sa-info: #17a2b8;
        --sa-primary: #0d6efd;
    }
}

/* ---------- Modal Popup ---------- */
.swal2-popup {
    font-family: var(--bs-body-font-family, "Inter", system-ui, sans-serif);
    border-radius: .5rem;
    padding: 1.5rem 1.75rem;
    width: 320px !important; /* compact layout */
    box-shadow: var(--sa-shadow);
    background: var(--sa-bg) !important;
    color: var(--sa-fg) !important;
    border: 1px solid var(--sa-border);
}

.swal2-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--sa-fg);
    margin-bottom: .25rem;
}

.swal2-html-container {
    font-size: .9rem;
    color: var(--bs-secondary-color, #666);
    margin-top: .25rem;
}

/* Icons */
.swal2-icon {
    margin: 0 auto 0.75rem !important;
    transform: scale(0.85);
    border-width: 2px !important;
}

    .swal2-icon.swal2-warning {
        color: var(--sa-warning);
        border-color: var(--sa-warning);
    }

    .swal2-icon.swal2-success {
        color: var(--sa-success);
        border-color: var(--sa-success);
    }

    .swal2-icon.swal2-error {
        color: var(--sa-error);
        border-color: var(--sa-error);
    }

    .swal2-icon.swal2-info {
        color: var(--sa-info);
        border-color: var(--sa-info);
    }

/* Actions / Buttons */
.swal2-actions {
    margin-top: 1.25rem;
}

.swal2-styled.swal2-confirm,
.swal2-styled.swal2-cancel {
    border-radius: .375rem !important;
    padding: .35rem 1rem !important;
    font-size: .85rem;
    font-weight: 500;
    box-shadow: none !important;
}

.swal2-confirm.swal2-styled {
    background-color: var(--sa-primary) !important;
    color: var(--bs-primary-contrast, #fff) !important;
    border: 0 !important;
}

.swal2-cancel.swal2-styled {
    background-color: var(--bs-secondary-bg, #e9ecef) !important;
    color: var(--bs-body-color) !important;
    border: 0 !important;
}

.swal2-styled:focus {
    box-shadow: 0 0 0 .25rem color-mix(in srgb, var(--sa-primary) 25%, transparent) !important;
}

.swal2-confirm:hover {
    filter: brightness(1.1);
}

.swal2-cancel:hover {
    filter: brightness(0.95);
}

.swal2-backdrop-show {
    background: rgba(0,0,0,0.25) !important;
}

/* Inputs inside modals */
.swal2-input,
.swal2-textarea,
.swal2-select {
    background: var(--bs-body-bg);
    color: var(--bs-body-color);
    border: 1px solid var(--bs-border-color);
}

/* ---------- Toasts ---------- */
.swal2-popup.swal2-toast {
    background: var(--sa-toast-bg) !important;
    color: var(--sa-fg) !important;
    border: 1px solid var(--sa-toast-border);
    box-shadow: var(--sa-shadow);
    backdrop-filter: blur(6px);
    border-radius: .5rem;
    padding: .75rem 1rem;
    min-width: 260px;
}

    .swal2-popup.swal2-toast .swal2-title,
    .swal2-popup.swal2-toast .swal2-html-container {
        color: inherit !important;
    }

    .swal2-popup.swal2-toast .swal2-success,
    .swal2-popup.swal2-toast .swal2-error,
    .swal2-popup.swal2-toast .swal2-warning,
    .swal2-popup.swal2-toast .swal2-info {
        border-color: currentColor;
    }

.swal2-timer-progress-bar {
    background: color-mix(in srgb, var(--sa-primary) 70%, transparent);
}