/* =========================================================
   MYTHRA CRAFT — IP KOPYALAMA / BAŞARI POPUP TASARIMI

   SweetAlert2 8.11.8 ile uyumludur.
   Masaüstü ve mobilde ortak çalışır.
   ========================================================= */

/* Popup arkasındaki karartma */
.swal2-container:has(.swal2-icon.swal2-success) {
    padding: 18px !important;

    background:
        radial-gradient(
            circle at center,
            rgba(255, 135, 225, 0.13),
            rgba(20, 0, 14, 0.76) 62%
        ) !important;

    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

/* Ana emboss popup */
.swal2-popup:has(.swal2-icon.swal2-success) {
    width: min(92vw, 512px) !important;
    box-sizing: border-box !important;

    padding:
        clamp(28px, 4vw, 38px)
        clamp(22px, 4vw, 36px)
        clamp(25px, 4vw, 32px) !important;

    overflow: hidden !important;

    border: 1px solid rgba(255, 244, 250, 0.88) !important;
    border-radius: 24px !important;

    background:
        radial-gradient(
            circle at 15% 0%,
            rgba(255, 255, 255, 0.70),
            transparent 38%
        ),
        radial-gradient(
            circle at 92% 100%,
            rgba(255, 93, 195, 0.22),
            transparent 44%
        ),
        linear-gradient(
            145deg,
            #ffe3f0 0%,
            #ffb9e7 52%,
            #ff87e1 100%
        ) !important;

    box-shadow:
        /* Üst emboss aydınlatması */
        inset 0 5px 0 rgba(255, 255, 255, 0.65),

        /* Sol iç ışık */
        inset 3px 0 0 rgba(255, 255, 255, 0.19),

        /* Sağ iç derinlik */
        inset -3px 0 0 rgba(151, 20, 103, 0.14),

        /* Alt emboss derinliği */
        inset 0 -8px 0 rgba(151, 20, 103, 0.22),

        /* Dış gölge */
        0 22px 55px rgba(52, 0, 36, 0.42),

        /* Pembe çevre ışığı */
        0 0 32px rgba(255, 92, 201, 0.25),
        0 0 70px rgba(255, 135, 225, 0.11) !important;
}

/* Popup açılma animasyonu */
.swal2-popup.swal2-show:has(.swal2-icon.swal2-success) {
    animation:
        mythraSuccessPopupOpen
        360ms
        cubic-bezier(0.22, 1, 0.36, 1)
        both !important;
}

/* Popup kapanma animasyonu */
.swal2-popup.swal2-hide:has(.swal2-icon.swal2-success) {
    animation:
        mythraSuccessPopupClose
        180ms
        ease-in
        both !important;
}

@keyframes mythraSuccessPopupOpen {
    0% {
        opacity: 0;
        transform: translateY(18px) scale(0.93);
    }

    70% {
        opacity: 1;
        transform: translateY(-3px) scale(1.015);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes mythraSuccessPopupClose {
    from {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    to {
        opacity: 0;
        transform: translateY(10px) scale(0.96);
    }
}

/* =========================================================
   BAŞARI TİKİ
   ========================================================= */

.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-icon.swal2-success {
    margin:
        5px
        auto
        clamp(18px, 3vw, 25px) !important;

    border-color: rgba(125, 0, 84, 0.30) !important;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.52),
            rgba(255, 135, 225, 0.20)
        ) !important;

    box-shadow:
        inset 0 3px 0 rgba(255, 255, 255, 0.72),
        inset 0 -4px 0 rgba(151, 20, 103, 0.16),
        0 8px 18px rgba(86, 0, 59, 0.18),
        0 0 24px rgba(252, 3, 107, 0.17) !important;
}

/* Tik çizgilerinin rengi */
.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-success-line-tip,
.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-success-line-long {
    background-color: #7d0054 !important;

    box-shadow:
        0 0 5px rgba(125, 0, 84, 0.18) !important;
}

/* Tik çevresindeki halka */
.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-success-ring {
    border-color: rgba(125, 0, 84, 0.30) !important;
}

/* SweetAlert'ın beyaz maskeleme parçalarını kaldırır */
.swal2-popup:has(.swal2-icon.swal2-success)
:is(
    .swal2-success-fix,
    .swal2-success-circular-line-left,
    .swal2-success-circular-line-right
) {
    display: none !important;
}

/* =========================================================
   BAŞLIK VE AÇIKLAMA
   ========================================================= */

.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-title {
    margin: 0 !important;
    padding: 0 !important;

    color: #3d092d !important;

    font-size: clamp(23px, 4vw, 29px) !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;

    text-shadow:
        0 2px 0 rgba(255, 255, 255, 0.42),
        0 5px 13px rgba(93, 0, 64, 0.11) !important;
}

.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-content {
    margin-top: 14px !important;
    padding: 0 !important;

    color: rgba(74, 7, 52, 0.82) !important;

    font-size: clamp(15px, 2.8vw, 18px) !important;
    font-weight: 650 !important;
    line-height: 1.45 !important;
}

/* =========================================================
   OK BUTONU
   ========================================================= */

.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-actions {
    margin: 24px auto 0 !important;
}

/* SweetAlert'ın focus halkasını kaldırır */
.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-styled:focus {
    box-shadow: none !important;
}

.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-confirm {
    position: relative !important;
    isolation: isolate;
    overflow: hidden !important;

    min-width: 132px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 12px 27px !important;

    border: 0 !important;
    border-radius: 14px !important;
    outline: 0 !important;

    color: #ffffff !important;

    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.26),
            transparent 43%,
            rgba(84, 0, 55, 0.25)
        ),
        linear-gradient(
            135deg,
            #ff3db8 0%,
            #fc036b 52%,
            #c90076 100%
        ) !important;

    box-shadow:
        inset 0 3px 0 rgba(255, 255, 255, 0.44),
        inset 2px 0 0 rgba(255, 255, 255, 0.14),
        inset -2px 0 0 rgba(102, 0, 65, 0.24),
        inset 0 -5px 0 rgba(102, 0, 65, 0.42),
        0 6px 0 #8f0059,
        0 12px 23px rgba(72, 0, 48, 0.30) !important;

    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;

    transform: translateY(-2px);
    transition:
        transform 190ms ease,
        box-shadow 190ms ease,
        filter 190ms ease !important;
}

/* Butonun üzerinden geçen parlama */
.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-confirm::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -85%;
    left: -55%;

    width: 34%;
    height: 270%;

    pointer-events: none;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.24),
        rgba(255, 255, 255, 0.74),
        rgba(255, 223, 244, 0.28),
        transparent
    );

    transform: skewX(-22deg);

    transition:
        left 650ms cubic-bezier(0.22, 1, 0.36, 1);
}

.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-confirm:hover {
    filter: saturate(1.08) brightness(1.04);

    transform: translateY(-4px) scale(1.055);

    box-shadow:
        inset 0 3px 0 rgba(255, 255, 255, 0.49),
        inset 2px 0 0 rgba(255, 255, 255, 0.16),
        inset -2px 0 0 rgba(102, 0, 65, 0.24),
        inset 0 -5px 0 rgba(102, 0, 65, 0.40),
        0 7px 0 #8f0059,
        0 0 23px rgba(252, 3, 107, 0.48),
        0 0 48px rgba(255, 61, 184, 0.22) !important;
}

.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-confirm:hover::before {
    left: 125%;
}

.swal2-popup:has(.swal2-icon.swal2-success)
.swal2-confirm:active {
    filter: none;

    transform: translateY(1px) scale(0.985);

    box-shadow:
        inset 0 3px 0 rgba(255, 255, 255, 0.38),
        inset 2px 0 0 rgba(255, 255, 255, 0.12),
        inset -2px 0 0 rgba(102, 0, 65, 0.24),
        inset 0 -4px 0 rgba(102, 0, 65, 0.42),
        0 2px 0 #8f0059,
        0 6px 14px rgba(72, 0, 48, 0.26) !important;
}

/* Hareket azaltma tercihini kullanan cihazlar */
@media (prefers-reduced-motion: reduce) {
    .swal2-popup:has(.swal2-icon.swal2-success),
    .swal2-popup:has(.swal2-icon.swal2-success)
    .swal2-confirm,
    .swal2-popup:has(.swal2-icon.swal2-success)
    .swal2-confirm::before {
        animation: none !important;
        transition: none !important;
    }
}

/* =========================================================
   RESPONSIVE V2 — BİLDİRİM / BAŞARI PENCERESİ
   ========================================================= */
@media (min-width: 640px) and (max-width: 1279px) {
    .swal2-container:has(.swal2-icon.swal2-success) {
        padding: 22px !important;
    }

    .swal2-popup:has(.swal2-icon.swal2-success) {
        width: min(520px, calc(100vw - 44px)) !important;
        max-width: calc(100vw - 44px) !important;
        padding: 31px 30px 29px !important;
    }
}

@media (max-width: 639px) {
    .swal2-container:has(.swal2-icon.swal2-success) {
        padding: 14px !important;
    }

    .swal2-popup:has(.swal2-icon.swal2-success) {
        width: min(420px, calc(100vw - 28px)) !important;
        max-width: calc(100vw - 28px) !important;
        padding: 24px 18px 22px !important;
        border-radius: 19px !important;
        box-shadow:
            inset 0 4px 0 rgba(255,255,255,.60),
            inset 0 -6px 0 rgba(151,20,103,.20),
            0 15px 34px rgba(52,0,36,.38),
            0 0 24px rgba(255,92,201,.20) !important;
    }

    .swal2-popup:has(.swal2-icon.swal2-success)
    .swal2-icon.swal2-success {
        width: 70px !important;
        height: 70px !important;
        margin: 2px auto 17px !important;
        transform: scale(.88);
    }

    .swal2-popup:has(.swal2-icon.swal2-success) .swal2-title {
        font-size: clamp(21px, 6.5vw, 26px) !important;
        line-height: 1.18 !important;
        overflow-wrap: anywhere;
    }

    .swal2-popup:has(.swal2-icon.swal2-success) .swal2-content {
        margin-top: 11px !important;
        font-size: clamp(13px, 4vw, 16px) !important;
        line-height: 1.42 !important;
        overflow-wrap: anywhere;
    }

    .swal2-popup:has(.swal2-icon.swal2-success) .swal2-actions {
        width: 100% !important;
        margin-top: 20px !important;
    }

    .swal2-popup:has(.swal2-icon.swal2-success) .swal2-confirm {
        width: min(100%, 260px) !important;
        min-width: 0 !important;
        min-height: 47px !important;
        padding: 11px 20px !important;
        font-size: 14px !important;
        transform: none;
    }
}

@media (hover: none), (pointer: coarse) {
    .swal2-popup:has(.swal2-icon.swal2-success) .swal2-confirm:hover {
        filter: none !important;
        transform: none !important;
    }

    .swal2-popup:has(.swal2-icon.swal2-success) .swal2-confirm:active {
        transform: translateY(2px) scale(.985) !important;
    }
}
