/* ============================================================================
   TDMS — SweetAlert2 skin
   ----------------------------------------------------------------------------
   Split out of tdms.css so the auth screens (layouts/auth.blade.php), which do
   not load the whole admin design system, still get the same dialogs.
   Loaded by both layouts, after the vendor sweetalert2 stylesheet.
   ============================================================================ */

/* These files load without tdms.css on the auth screens, so the two brand
   tokens they use are declared here as well. Same values as tdms.css — a
   redeclaration, not a second source of truth. */
:root {
    --tdms-navy: #0B2A63;
    --tdms-navy-dark: #082050;
}

/* ============================================================
   SweetAlert2 → TDMS dialog
   ------------------------------------------------------------
   Every Swal.fire in the app inherits this: tinted icon on the left,
   title and message in one column, actions bottom-right. Tone is carried
   by the icon only. The vendor build wraps its rules in :where(), so plain
   class selectors here win the cascade without !important.
   ============================================================ */
.swal2-container { z-index: 100000; }

.swal2-popup.swal2-modal {
    width: 100%;
    max-width: 460px;
    padding: 1.25rem;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: .875rem;
    border: 1px solid #EAECF0;
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(16, 24, 40, .14);
    background: #fff;
    color: #475467;
    font-family: var(--bs-body-font-family, 'Public Sans', system-ui, sans-serif);
    text-align: left;
}

/* ---- Icon: one 38px tile, drawn with the Tabler glyph ---- */
.swal2-popup.swal2-modal .swal2-icon {
    grid-column: 1;
    grid-row: 1 / 99;
    align-self: start;
    width: 38px;
    min-width: 38px;
    height: 38px;
    margin: .125rem 0 0;
    padding: 0;
    border: 0;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #EEF2F8;
    color: var(--tdms-navy);
    font-size: 20px;
    /* Clips anything the vendor positions beyond the tile. */
    overflow: hidden;
    animation: none;
}

/* The vendor draws its icons out of rings, arcs and line divs — including
   .swal2-success-circular-line-left/right, which are oversized white discs
   positioned outside the box. Ours is a single glyph, so every child goes. */
.swal2-popup.swal2-modal .swal2-icon > * { display: none !important; }
.swal2-popup.swal2-modal .swal2-icon::after { display: none; }

.swal2-popup.swal2-modal .swal2-icon::before {
    font-family: "tabler-icons";
    font-weight: 400;
    font-style: normal;
    line-height: 1;
    content: "\eac5";
}

.swal2-popup.swal2-modal .swal2-icon.swal2-info { background: #EEF2F8; color: #0A4BC2; }
.swal2-popup.swal2-modal .swal2-icon.swal2-info::before { content: "\eac5"; }

.swal2-popup.swal2-modal .swal2-icon.swal2-success { background: #ECFDF3; color: #067647; }
.swal2-popup.swal2-modal .swal2-icon.swal2-success::before { content: "\ea67"; }

.swal2-popup.swal2-modal .swal2-icon.swal2-warning { background: #FFF6E5; color: #B54708; }
.swal2-popup.swal2-modal .swal2-icon.swal2-warning::before { content: "\ea06"; }

.swal2-popup.swal2-modal .swal2-icon.swal2-error { background: #FEF3F2; color: #D6001C; }
.swal2-popup.swal2-modal .swal2-icon.swal2-error::before { content: "\ea05"; }

.swal2-popup.swal2-modal .swal2-icon.swal2-question { background: #EEF2F8; color: var(--tdms-navy); }
.swal2-popup.swal2-modal .swal2-icon.swal2-question::before { content: "\f91d"; }

/* ---- Copy ---- */
.swal2-popup.swal2-modal .swal2-title {
    grid-column: 2;
    max-width: none;
    margin: 0;
    padding: .125rem 0 .25rem;
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1.35;
    color: #101828;
    text-align: left;
}

.swal2-popup.swal2-modal .swal2-html-container {
    grid-column: 2;
    margin: 0;
    padding: 0;
    font-size: .8125rem;
    line-height: 1.5;
    color: #475467;
    text-align: left;
    overflow: visible;
}

.swal2-popup.swal2-modal .swal2-html-container ul,
.swal2-popup.swal2-modal .swal2-html-container ol { margin: .5rem 0 0; padding-left: 1.125rem; }

/* ---- Inputs (prompt dialogs) ---- */
.swal2-popup.swal2-modal .swal2-input,
.swal2-popup.swal2-modal .swal2-textarea,
.swal2-popup.swal2-modal .swal2-select {
    grid-column: 2;
    width: 100%;
    height: 38px;
    margin: .75rem 0 0;
    padding: 0 .75rem;
    border: 1px solid #D0D5DD;
    border-radius: 6px;
    box-shadow: none;
    font-size: .875rem;
    color: #101828;
}

.swal2-popup.swal2-modal .swal2-textarea { height: auto; min-height: 88px; padding: .5rem .75rem; }

.swal2-popup.swal2-modal .swal2-input:focus,
.swal2-popup.swal2-modal .swal2-textarea:focus,
.swal2-popup.swal2-modal .swal2-select:focus {
    border-color: #123B84;
    box-shadow: 0 0 0 3px rgba(18, 59, 132, .12);
}

.swal2-popup.swal2-modal .swal2-validation-message {
    grid-column: 2;
    margin: .5rem 0 0;
    padding: .375rem .625rem;
    border-radius: 6px;
    background: #FEF3F2;
    color: #B4001A;
    font-size: .78125rem;
    justify-content: flex-start;
}

.swal2-popup.swal2-modal .swal2-validation-message::before { display: none; }

/* ---- Actions ---- */
.swal2-popup.swal2-modal .swal2-actions {
    grid-column: 2;
    width: 100%;
    margin: 1rem 0 0;
    justify-content: flex-end;
    gap: .5rem;
}

.swal2-popup.swal2-modal .swal2-styled {
    margin: 0;
    padding: .4375rem .875rem;
    border: 1px solid transparent;
    border-radius: 6px;
    box-shadow: none;
    font-size: .8125rem;
    font-weight: 600;
}

.swal2-popup.swal2-modal .swal2-styled:focus { box-shadow: 0 0 0 3px rgba(18, 59, 132, .12); }

.swal2-popup.swal2-modal .swal2-confirm {
    background: var(--tdms-navy);
    border-color: var(--tdms-navy);
    color: #fff;
}

.swal2-popup.swal2-modal .swal2-confirm:hover { background: var(--tdms-navy-dark); border-color: var(--tdms-navy-dark); }

/* A destructive confirm is opted into per call with customClass. */
.swal2-popup.swal2-modal .swal2-confirm.swal2-confirm--danger {
    background: #D6001C;
    border-color: #D6001C;
}

.swal2-popup.swal2-modal .swal2-confirm.swal2-confirm--danger:hover { background: #B4001A; border-color: #B4001A; }

.swal2-popup.swal2-modal .swal2-cancel,
.swal2-popup.swal2-modal .swal2-deny {
    background: #fff;
    border-color: #D0D5DD;
    color: #344054;
}

.swal2-popup.swal2-modal .swal2-cancel:hover,
.swal2-popup.swal2-modal .swal2-deny:hover { background: #F9FAFB; border-color: #C7D2E4; color: var(--tdms-navy); }

/* ---- Close ---- */
.swal2-popup.swal2-modal .swal2-close {
    position: absolute;
    top: .625rem;
    right: .625rem;
    width: 26px;
    height: 26px;
    border-radius: 5px;
    color: #98A2B3;
    font-size: 22px;
    font-weight: 400;
}

.swal2-popup.swal2-modal .swal2-close:hover { background: #F2F4F7; color: #344054; }
.swal2-popup.swal2-modal .swal2-footer {
    grid-column: 2;
    margin: .875rem 0 0;
    padding: .75rem 0 0;
    border-top: 1px solid #EAECF0;
    font-size: .78125rem;
    color: #667085;
    justify-content: flex-start;
}

/* A dialog with no icon should not leave a dead first column. */
.swal2-popup.swal2-modal:not(:has(.swal2-icon)) { grid-template-columns: minmax(0, 1fr); }

/* The loading state Swal.showLoading() paints while a request is in flight. */
.swal2-popup.swal2-modal .swal2-loader {
    grid-column: 1 / -1;
    margin: .5rem auto;
    border-color: var(--tdms-navy) transparent var(--tdms-navy) transparent;
}

/* Some call sites pass buttonsStyling:false with Bootstrap classes, so the
   vendor's .swal2-styled never lands. Normalise those rows too. */
.swal2-popup.swal2-modal .swal2-actions .btn {
    margin: 0;
    padding: .4375rem .875rem;
    border-radius: 6px;
    font-size: .8125rem;
    font-weight: 600;
}
