/**
 * TheLeo.info SweetAlert2 Custom Theme
 * Based on the color scheme from README_CORES.md
 */

/* === SweetAlert2 Base Styling === */
.swal2-popup {
    border-radius: 15px !important;
    box-shadow: 0 10px 30px rgba(58, 45, 125, 0.2) !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(169, 150, 227, 0.2) !important;
}

.swal2-popup::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #A996E3, #F4C9C9);
    border-radius: 15px 15px 0 0;
}

/* === Title Styling === */
.swal2-title {
    color: #3A2D7D !important;
    font-weight: 600 !important;
    font-size: 1.5rem !important;
    margin-bottom: 1rem !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

/* === Content Styling === */
.swal2-html-container {
    color: #3A2D7D !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
}

/* === Icon Styling === */
.swal2-icon {
    border: none !important;
    margin: 1.5rem auto 1rem !important;
}

.swal2-icon.swal2-success {
    border-color: #68C4B5 !important;
    color: #68C4B5 !important;
}

.swal2-icon.swal2-success .swal2-success-ring {
    border-color: rgba(104, 196, 181, 0.3) !important;
}

.swal2-icon.swal2-success .swal2-success-fix {
    background-color: #68C4B5 !important;
}

.swal2-icon.swal2-error {
    border-color: #F05C79 !important;
    color: #F05C79 !important;
}

.swal2-icon.swal2-warning {
    border-color: #D989C2 !important;
    color: #D989C2 !important;
}

.swal2-icon.swal2-info {
    border-color: #A0B3F0 !important;
    color: #A0B3F0 !important;
}

.swal2-icon.swal2-question {
    border-color: #A996E3 !important;
    color: #A996E3 !important;
}

/* === Button Styling === */
.swal2-styled.swal2-confirm {
    background: linear-gradient(135deg, #F05C79 0%, #F47392 100%) !important;
    border: none !important;
    border-radius: 25px !important;
    padding: 12px 25px !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    box-shadow: 0 4px 15px rgba(240, 92, 121, 0.3) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

.swal2-styled.swal2-confirm:hover {
    background: linear-gradient(135deg, #e54968 0%, #f26181 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(240, 92, 121, 0.4) !important;
}

.swal2-styled.swal2-cancel {
    background: linear-gradient(135deg, #68C4B5 0%, #7ED8CC 100%) !important;
    border: none !important;
    border-radius: 25px !important;
    padding: 12px 25px !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    box-shadow: 0 4px 15px rgba(104, 196, 181, 0.3) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    color: white !important;
}

.swal2-styled.swal2-cancel:hover {
    background: linear-gradient(135deg, #5bb3a4 0%, #6cd0bb 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(104, 196, 181, 0.4) !important;
}

.swal2-styled.swal2-deny {
    background: linear-gradient(135deg, #D989C2 0%, #E0A1D1 100%) !important;
    border: none !important;
    border-radius: 25px !important;
    padding: 12px 25px !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    box-shadow: 0 4px 15px rgba(217, 137, 194, 0.3) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    color: white !important;
}

.swal2-styled.swal2-deny:hover {
    background: linear-gradient(135deg, #d178b5 0%, #d995c7 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(217, 137, 194, 0.4) !important;
}

/* === Input Styling === */
.swal2-input,
.swal2-textarea,
.swal2-select {
    border: 2px solid rgba(169, 150, 227, 0.2) !important;
    border-radius: 10px !important;
    padding: 12px 15px !important;
    font-size: 1rem !important;
    transition: all 0.3s ease !important;
    background: rgba(245, 245, 247, 0.5) !important;
}

.swal2-input:focus,
.swal2-textarea:focus,
.swal2-select:focus {
    border-color: #A996E3 !important;
    box-shadow: 0 0 0 3px rgba(169, 150, 227, 0.1) !important;
    outline: none !important;
    background: white !important;
}

/* === Progress Bar === */
.swal2-progress-steps .swal2-progress-step {
    background: #A996E3 !important;
    color: white !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
    font-weight: 600 !important;
}

.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step {
    background: linear-gradient(135deg, #F05C79 0%, #F47392 100%) !important;
    box-shadow: 0 4px 15px rgba(240, 92, 121, 0.3) !important;
}

.swal2-progress-steps .swal2-progress-step-line {
    background: rgba(169, 150, 227, 0.3) !important;
}

/* === Loading Spinner === */
.swal2-loading .swal2-styled.swal2-confirm {
    background: linear-gradient(135deg, #A996E3 0%, #F4C9C9 100%) !important;
}

.swal2-loader {
    border-color: rgba(169, 150, 227, 0.2) rgba(169, 150, 227, 0.2) #A996E3 #A996E3 !important;
}

/* === Close Button === */
.swal2-close {
    color: #6c757d !important;
    font-size: 1.5rem !important;
    transition: all 0.3s ease !important;
    background: rgba(255, 255, 255, 0.1) !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
}

.swal2-close:hover {
    color: #F05C79 !important;
    background: rgba(240, 92, 121, 0.1) !important;
    transform: scale(1.1) !important;
}

/* === Footer === */
.swal2-footer {
    border-top: 1px solid rgba(169, 150, 227, 0.1) !important;
    color: #6c757d !important;
    font-size: 0.9rem !important;
    padding-top: 1rem !important;
}

/* === Custom Classes === */
.swal-theleo-popup {
    border-radius: 15px !important;
    box-shadow: 0 10px 30px rgba(58, 45, 125, 0.2) !important;
}

.swal-theleo-confirm {
    background-color: #F05C79 !important;
    border-radius: 25px !important;
    border: none !important;
    padding: 10px 25px !important;
    font-weight: 600 !important;
}

.swal-theleo-confirm:hover {
    background-color: #e54968 !important;
}

.swal-theleo-cancel {
    background-color: #68C4B5 !important;
    border-radius: 25px !important;
    border: none !important;
    padding: 10px 25px !important;
    font-weight: 600 !important;
}

.swal-theleo-cancel:hover {
    background-color: #5bb3a4 !important;
}

/* === Animation Overrides === */
.swal2-show {
    animation: swal2-show 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.swal2-hide {
    animation: swal2-hide 0.15s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

@keyframes swal2-show {
    0% {
        transform: scale(0.7) translateY(-50px);
        opacity: 0;
    }
    100% {
        transform: scale(1) translateY(0);
        opacity: 1;
    }
}

@keyframes swal2-hide {
    0% {
        transform: scale(1) translateY(0);
        opacity: 1;
    }
    100% {
        transform: scale(0.9) translateY(50px);
        opacity: 0;
    }
}

/* === Responsive Design === */
@media (max-width: 768px) {
    .swal2-popup {
        margin: 0 10px !important;
        max-width: calc(100vw - 20px) !important;
    }
    
    .swal2-title {
        font-size: 1.3rem !important;
    }
    
    .swal2-html-container {
        font-size: 0.9rem !important;
    }
    
    .swal2-styled.swal2-confirm,
    .swal2-styled.swal2-cancel,
    .swal2-styled.swal2-deny {
        padding: 10px 20px !important;
        font-size: 0.9rem !important;
    }
}

/* === Toast Styling === */
.swal2-toast {
    border-radius: 15px !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
    backdrop-filter: blur(10px) !important;
}

.swal2-toast .swal2-title {
    color: #3A2D7D !important;
    font-size: 1rem !important;
}

.swal2-toast.swal2-icon-success {
    background: linear-gradient(135deg, rgba(104, 196, 181, 0.95) 0%, rgba(126, 216, 204, 0.9) 100%) !important;
}

.swal2-toast.swal2-icon-error {
    background: linear-gradient(135deg, rgba(240, 92, 121, 0.95) 0%, rgba(244, 115, 146, 0.9) 100%) !important;
}

.swal2-toast.swal2-icon-warning {
    background: linear-gradient(135deg, rgba(217, 137, 194, 0.95) 0%, rgba(224, 161, 209, 0.9) 100%) !important;
}

.swal2-toast.swal2-icon-info {
    background: linear-gradient(135deg, rgba(160, 179, 240, 0.95) 0%, rgba(181, 196, 243, 0.9) 100%) !important;
}