/**
 * sweetalert.css :: tema do SweetAlert2 v11 na identidade da AURA.
 *
 * Escrito do zero em vez de sobrescrever o CSS oficial: o pacote original
 * carrega centenas de regras para animações e variações que não usamos, e a
 * folha inteira viria com o visual claro padrão, que destoa do site.
 *
 * Cobre apenas o que os diálogos do projeto usam: título, texto, ícones,
 * botões, campo de entrada, barra de tempo e as animações de entrada e saída.
 * Se algum dia for usado um recurso novo do plugin (toast, imagem, progress
 * steps), a regra correspondente precisa ser acrescentada aqui.
 *
 * As cores saem das variáveis de assets/css/style.css; os valores literais
 * são apenas o reserva para quando esta folha carregar isolada.
 */

.swal2-container {
    position: fixed;
    inset: 0;
    z-index: 1090;
    display: grid;
    place-items: center;
    padding: 20px;
    overflow-y: auto;
    background: rgba(5, 8, 18, .72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.swal2-container.swal2-backdrop-hide {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* O plugin injeta esta classe no body para travar a rolagem de fundo */
body.swal2-shown,
body.swal2-height-auto {
    overflow: hidden;
}

.swal2-popup {
    width: min(460px, 100%);
    background: var(--ink2, #0d1326);
    color: var(--light, #F5F7FA);
    border: 1px solid var(--line, rgba(255, 255, 255, .08));
    border-radius: 18px;
    padding: 30px 28px 24px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .6);
    text-align: center;
    font-size: 15px;
    line-height: 1.55;
}

.swal2-title {
    margin: 0 0 8px;
    font-size: 1.32rem;
    font-weight: 700;
    letter-spacing: -.01em;
    color: var(--light, #F5F7FA);
}

.swal2-html-container {
    margin: 6px 0 0;
    color: #c7cde0;
    font-size: .95rem;
    word-break: break-word;
}

/* Sem título, o texto sozinho não deve encostar no ícone */
.swal2-popup:not(:has(.swal2-title)) .swal2-html-container {
    margin-top: 12px;
}

/* ============================================
   ÍCONES
   O plugin monta a estrutura interna de cada ícone; aqui só definimos a
   moldura circular e a cor de cada estado.
   ============================================ */

.swal2-icon {
    position: relative;
    box-sizing: content-box;
    width: 72px;
    height: 72px;
    margin: 4px auto 20px;
    border: 3px solid transparent;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: inherit;
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 1;
    user-select: none;
}

.swal2-icon .swal2-icon-content {
    display: flex;
    align-items: center;
    font-size: 2.4rem;
}

.swal2-icon.swal2-question {
    border-color: rgba(106, 124, 240, .45);
    color: var(--blue, #6A7CF0);
}

.swal2-icon.swal2-info {
    border-color: rgba(86, 197, 242, .45);
    color: var(--teal, #56C5F2);
}

.swal2-icon.swal2-warning {
    border-color: rgba(245, 190, 90, .5);
    color: #F5BE5A;
}

.swal2-icon.swal2-error {
    border-color: rgba(240, 100, 120, .5);
    color: #F06478;
}

.swal2-icon.swal2-success {
    border-color: rgba(80, 200, 140, .5);
    color: #50C88C;
}

/* Traços dos ícones de erro e sucesso, desenhados pelo plugin */
.swal2-icon.swal2-error .swal2-x-mark {
    position: relative;
    flex-grow: 1;
}

.swal2-icon.swal2-error [class^='swal2-x-mark-line'] {
    position: absolute;
    top: 33px;
    left: 15px;
    width: 40px;
    height: 3px;
    border-radius: 2px;
    background: #F06478;
}

.swal2-icon.swal2-error [class$='left'] { transform: rotate(45deg); }
.swal2-icon.swal2-error [class$='right'] { transform: rotate(-45deg); }

.swal2-icon.swal2-success [class^='swal2-success-line'] {
    position: absolute;
    height: 3px;
    border-radius: 2px;
    background: #50C88C;
}

.swal2-icon.swal2-success [class$='tip'] {
    top: 42px;
    left: 15px;
    width: 22px;
    transform: rotate(45deg);
}

.swal2-icon.swal2-success [class$='long'] {
    top: 36px;
    right: 10px;
    width: 38px;
    transform: rotate(-45deg);
}

/* Elementos decorativos do ícone de sucesso que não usamos */
.swal2-icon.swal2-success .swal2-success-ring,
.swal2-icon.swal2-success [class^='swal2-success-circular-line'],
.swal2-icon.swal2-success .swal2-success-fix {
    display: none;
}

/* ============================================
   AÇÕES
   ============================================ */

.swal2-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin: 24px 0 0;
}

.swal2-actions:not(.swal2-loading) .swal2-styled[disabled] {
    opacity: .45;
    cursor: not-allowed;
}

.swal2-styled {
    padding: 11px 24px;
    border: 0;
    border-radius: 30px;
    color: #fff;
    font: inherit;
    font-size: .93rem;
    font-weight: 600;
    cursor: pointer;
    transition: filter .15s, transform .15s;
}

.swal2-styled:hover { filter: brightness(1.1); }
.swal2-styled:active { transform: translateY(1px); }

.swal2-styled:focus-visible {
    outline: 2px solid var(--teal, #56C5F2);
    outline-offset: 2px;
}

/* O gradiente da marca só no botão principal, para guiar a ação desejada */
.swal2-styled.swal2-confirm {
    background: var(--grad, linear-gradient(120deg, #56C5F2, #6A7CF0 45%, #9E84F2));
}

.swal2-styled.swal2-cancel,
.swal2-styled.swal2-deny {
    background: rgba(255, 255, 255, .1);
    border: 1px solid var(--line, rgba(255, 255, 255, .12));
    color: #c7cde0;
}

.swal2-styled.swal2-deny {
    background: rgba(240, 100, 120, .18);
    border-color: rgba(240, 100, 120, .35);
    color: #F06478;
}

.swal2-loader {
    display: none;
    width: 28px;
    height: 28px;
    margin: 0 auto;
    border: 3px solid rgba(255, 255, 255, .2);
    border-top-color: var(--teal, #56C5F2);
    border-radius: 50%;
    animation: swal2-rotate 1s linear infinite;
}

.swal2-actions.swal2-loading .swal2-loader { display: block; }
.swal2-actions.swal2-loading .swal2-styled.swal2-confirm { display: none; }

@keyframes swal2-rotate { to { transform: rotate(360deg); } }

/* ============================================
   ENTRADA DE DADOS E RODAPÉ
   ============================================ */

.swal2-input,
.swal2-textarea,
.swal2-select {
    width: 100%;
    margin: 16px 0 0;
    padding: 11px 14px;
    background: rgba(255, 255, 255, .04);
    border: 1px solid var(--line, rgba(255, 255, 255, .12));
    border-radius: 12px;
    color: var(--light, #F5F7FA);
    font: inherit;
    font-size: .95rem;
}

.swal2-input:focus,
.swal2-textarea:focus,
.swal2-select:focus {
    outline: none;
    border-color: rgba(106, 124, 240, .6);
}

.swal2-validation-message {
    margin: 14px 0 0;
    padding: 9px 13px;
    background: rgba(240, 100, 120, .14);
    border-radius: 10px;
    color: #F06478;
    font-size: .85rem;
}

.swal2-footer {
    margin: 20px 0 0;
    padding: 14px 0 0;
    border-top: 1px solid var(--line, rgba(255, 255, 255, .08));
    color: var(--muted, #8b93a8);
    font-size: .84rem;
}

.swal2-close {
    position: absolute;
    top: 10px;
    right: 14px;
    background: none;
    border: 0;
    color: var(--muted, #8b93a8);
    font-size: 1.7rem;
    line-height: 1;
    cursor: pointer;
    transition: color .15s;
}

.swal2-close:hover { color: var(--light, #F5F7FA); }

/* Barra do fechamento automático, usada nos avisos de sucesso */
.swal2-timer-progress-bar-container {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    border-radius: 0 0 18px 18px;
    overflow: hidden;
}

.swal2-timer-progress-bar {
    width: 100%;
    height: 100%;
    background: var(--grad, linear-gradient(120deg, #56C5F2, #6A7CF0 45%, #9E84F2));
}

/* ============================================
   ANIMAÇÕES
   ============================================ */

.swal2-show { animation: swal2-entrada .28s cubic-bezier(.2, .9, .3, 1.2); }
.swal2-hide { animation: swal2-saida .16s forwards; }

@keyframes swal2-entrada {
    from { opacity: 0; transform: translateY(14px) scale(.96); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes swal2-saida {
    to { opacity: 0; transform: scale(.96); }
}

/* Respeita quem pediu menos movimento no sistema */
@media (prefers-reduced-motion: reduce) {
    .swal2-show,
    .swal2-hide { animation: none; }
}

@media (max-width: 520px) {
    .swal2-popup { padding: 26px 20px 20px; border-radius: 16px; }
    .swal2-actions { flex-direction: column-reverse; }
    .swal2-styled { width: 100%; }
}

/* ============================================
   REFORÇO DOS TRAÇOS (sucesso / erro)
   O sweetalert2 "all" injeta o próprio CSS com medidas em "em" e animações
   dos traços; o seletor dele tem especificidade maior que as regras acima e
   desmontava o "check". Aqui o desenho fica fixo na caixa de 72px.
   ============================================ */

div.swal2-icon.swal2-success [class^='swal2-success-line'],
div.swal2-icon.swal2-error [class^='swal2-x-mark-line'] {
    position: absolute !important;
    height: 3px !important;
    border-radius: 2px;
    animation: none !important;
}

div.swal2-icon.swal2-success [class^='swal2-success-line'][class$='tip'] {
    top: 42px !important;
    left: 16px !important;
    width: 18px !important;
    transform: rotate(45deg) !important;
}

div.swal2-icon.swal2-success [class^='swal2-success-line'][class$='long'] {
    top: 34px !important;
    left: 24px !important;
    right: auto !important;
    width: 36px !important;
    transform: rotate(-45deg) !important;
}

div.swal2-icon.swal2-error [class^='swal2-x-mark-line'] {
    top: 34px !important;
    left: 16px !important;
    width: 40px !important;
}

div.swal2-icon.swal2-error [class^='swal2-x-mark-line'][class$='left']  { transform: rotate(45deg) !important; }
div.swal2-icon.swal2-error [class^='swal2-x-mark-line'][class$='right'] { transform: rotate(-45deg) !important; }

div.swal2-icon.swal2-error .swal2-x-mark {
    position: absolute !important;
    inset: 0;
    animation: none !important;
}
