/* Shared SweetAlert skin used throughout the game and admin screens. */
.swal2-container {
    z-index: 20000 !important;
}

.swal2-container.swal2-backdrop-show {
    background: rgba(2, 12, 24, .78) !important;
}

.swal2-popup {
    position: relative !important;
    width: min(34rem, calc(100vw - 28px)) !important;
    font-family: 'Inria Sans', 'Segoe UI', sans-serif !important;
    overflow: hidden !important;
    border: 1px solid rgba(124, 220, 231, .48) !important;
    border-radius: 20px !important;
    background: linear-gradient(155deg, rgba(17, 47, 64, .99), rgba(8, 29, 45, .99)) !important;
    color: #f4fbff !important;
    box-shadow: 0 8px 0 rgba(3, 22, 34, .72), 0 24px 60px rgba(0, 0, 0, .48), inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}

.swal2-popup::before {
    position: absolute;
    top: 0;
    left: 12%;
    right: 12%;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, transparent, #16b091, #45d5df, #ffd34f, transparent);
    content: "";
    pointer-events: none;
}

.swal2-title {
    color: #fff !important;
    font-weight: 950 !important;
}

.swal2-html-container {
    color: #d8edf3 !important;
}

.swal2-actions {
    gap: 10px !important;
}

.swal2-styled {
    border: 1px solid rgba(202, 250, 248, .48) !important;
    border-radius: 11px !important;
    font-weight: 900 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 4px 0 rgba(3, 22, 34, .55) !important;
    transition: transform .16s ease, filter .16s ease !important;
}

.swal2-confirm {
    background: linear-gradient(180deg, #1bc2a0, #0b857d) !important;
    color: #fff !important;
}

.swal2-cancel {
    background: linear-gradient(180deg, #456679, #294657) !important;
    color: #fff !important;
}

.swal2-deny {
    background: linear-gradient(180deg, #d95f55, #a63635) !important;
    color: #fff !important;
}

.swal2-styled:not(:disabled):hover {
    filter: brightness(1.1) !important;
    transform: translateY(-1px);
}

.swal2-icon.swal2-success {
    border-color: rgba(69, 213, 223, .35) !important;
    color: #55e1a1 !important;
}

.swal2-icon.swal2-success .swal2-success-ring {
    border-color: rgba(69, 213, 223, .38) !important;
}

.swal2-icon.swal2-success [class^="swal2-success-line"] {
    background-color: #55e1a1 !important;
}

.swal2-icon.swal2-warning {
    border-color: rgba(255, 211, 79, .55) !important;
    color: #ffd34f !important;
}

.swal2-icon.swal2-error {
    border-color: rgba(255, 128, 110, .55) !important;
    color: #ff8975 !important;
}

.swal2-icon.swal2-error [class^="swal2-x-mark-line"] {
    background-color: #ff8975 !important;
}

.swal2-close {
    color: #d8edf3 !important;
}

.swal2-timer-progress-bar {
    background: linear-gradient(90deg, #16b091, #45d5df, #ffd34f) !important;
}

.swal2-input,
.swal2-textarea,
.swal2-select {
    border: 1px solid rgba(124, 220, 231, .4) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, .08) !important;
    color: #f4fbff !important;
}

.swal2-input::placeholder,
.swal2-textarea::placeholder {
    color: rgba(216, 237, 243, .62) !important;
}

@media (max-width: 560px) {
   .swal2-popup {
        border-radius: 17px !important;
    }

    .swal2-actions {
        gap: 8px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .swal2-styled {
        transition: none !important;
    }
}