﻿
/* ==========================================================
   TECHCORDAS
   SWEETALERT2 — IDENTIDADE VISUAL
========================================================== */
.swal2-popup {
    font-family: 'Inter', sans-serif !important;
    border-radius: 18px !important;
    padding: 2rem !important;
    background: #ffffff !important;
    color: #071426 !important;
    box-shadow: 0 18px 50px rgba(7, 20, 38, 0.20) !important;
}

.swal2-title {
    color: #071426 !important;
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    margin-bottom: 0.75rem !important;
}

.swal2-html-container,
.swal2-content {
    color: #475569 !important;
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
}

/* ==========================================================
   BOTÕES
========================================================== */

.swal2-actions {
    gap: 10px !important;
    margin-top: 1.5rem !important;
}

.swal2-confirm,
.swal2-cancel {
    border-radius: 10px !important;
    min-height: 42px !important;
    padding: 0.65rem 1.25rem !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    border: none !important;
    box-shadow: none !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease !important;
}

.swal2-confirm {
    background: #299cff !important;
    color: #ffffff !important;
}

    .swal2-confirm:hover {
        background: #168ceF !important;
        transform: translateY(-1px);
        box-shadow: 0 5px 14px rgba(41, 156, 255, 0.28) !important;
    }

.swal2-cancel {
    background: #475569 !important;
    color: #ffffff !important;
}

    .swal2-cancel:hover {
        background: #334155 !important;
        transform: translateY(-1px);
    }

/* ==========================================================
   ÍCONES
========================================================== */

.swal2-icon {
    margin: 0 auto 1rem !important;
}

    .swal2-icon.swal2-warning {
        border-color: #f59e0b !important;
        color: #f59e0b !important;
    }

    .swal2-icon.swal2-success {
        border-color: #22c55e !important;
        color: #22c55e !important;
    }

    .swal2-icon.swal2-error {
        border-color: #ef4444 !important;
        color: #ef4444 !important;
    }

    .swal2-icon.swal2-info {
        border-color: #299cff !important;
        color: #299cff !important;
    }

/* ==========================================================
   FECHAR
========================================================== */

.swal2-close {
    color: #94a3b8 !important;
    font-size: 1.6rem !important;
    transition: color 0.15s ease !important;
}

    .swal2-close:hover {
        color: #071426 !important;
    }

/* ==========================================================
   INPUTS
========================================================== */

.swal2-input,
.swal2-textarea,
.swal2-select {
    border: 1px solid #dbe3ec !important;
    border-radius: 10px !important;
    font-family: 'Inter', sans-serif !important;
    color: #071426 !important;
}

    .swal2-input:focus,
    .swal2-textarea:focus,
    .swal2-select:focus {
        border-color: #299cff !important;
        box-shadow: 0 0 0 3px rgba(41, 156, 255, 0.12) !important;
    }

/* ==========================================================
   FUNDO
========================================================== */

.swal2-container {
    background: rgba(7, 20, 38, 0.55) !important;
}

/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 576px) {

    .swal2-popup {
        width: calc(100% - 30px) !important;
        padding: 1.5rem !important;
        border-radius: 16px !important;
    }

    .swal2-title {
        font-size: 1.15rem !important;
    }

    .swal2-html-container,
    .swal2-content {
        font-size: 0.9rem !important;
    }

    .swal2-actions {
        width: 100% !important;
        flex-direction: column-reverse !important;
    }

    .swal2-confirm,
    .swal2-cancel {
        width: 100% !important;
    }
}

