/* =========================================
   DR1059 RIGHT SIDE POPUP ALERT (FIXED VISIBILITY)
   ULTRA PREMIUM 3D SLIDE IN
========================================= */

.dr1059popupalerts{
    position:fixed;
    inset:0;

    display:flex;
    justify-content:flex-end;
    align-items:center;

    z-index:999999;
    font-family:'Poppins', sans-serif;

    pointer-events:none;
}

.dr1059popupalerts.active{
    pointer-events:auto;
}

/* =========================================
   BACKDROP
========================================= */

.dr1059popup-overlay{
    position:absolute;
    inset:0;

    background:rgba(0,0,0,0.35);
    backdrop-filter: blur(6px);

    opacity:0;
    transition:.4s ease;
}

.dr1059popupalerts.active .dr1059popup-overlay{
    opacity:1;
}

/* =========================================
   MAIN CARD (FIXED CONTRAST GLASS)
========================================= */

.dr1059popup-box{
    position:relative;

    width:380px;
    max-width:92vw;

    margin-right:20px;

    color:#fff;

    border-radius:26px;

    padding:28px;

    z-index:2;

    /* ✅ FIX: stronger dark glass base */
    background: linear-gradient(
        145deg,
        rgba(15, 23, 42, 0.82),
        rgba(2, 6, 23, 0.78)
    );

    border:1px solid rgba(255,255,255,0.18);

    backdrop-filter: blur(22px);

    box-shadow:
        -20px 30px 80px rgba(0,0,0,0.65),
        inset 0 1px 0 rgba(255,255,255,0.08);

    transform: translateX(120%) scale(0.95);
    opacity:0;

    transition: all .6s cubic-bezier(.16,1,.3,1);

    overflow:hidden;
}

/* ACTIVE */
.dr1059popupalerts.active .dr1059popup-box{
    transform: translateX(0) scale(1);
    opacity:1;
}

/* =========================================
   SHINE EFFECT (PEN DRIVE LOOK)
========================================= */

.dr1059popup-box::before{
    content:"";
    position:absolute;
    top:0;
    left:-60%;
    width:60%;
    height:100%;

    background: linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,0.14),
        transparent
    );

    transform: skewX(-20deg);
    animation: shine 4s infinite;
    pointer-events:none;
}

@keyframes shine{
    0%{ left:-80%; }
    100%{ left:140%; }
}

/* subtle depth layer for readability */
.dr1059popup-box::after{
    content:"";
    position:absolute;
    inset:0;

    background: radial-gradient(
        circle at left,
        rgba(0,0,0,0.35),
        transparent 70%
    );

    pointer-events:none;
}

/* =========================================
   CLOSE BUTTON
========================================= */

.dr1059popup-close{
    position:absolute;
    top:14px;
    right:14px;

    width:36px;
    height:36px;

    border:none;
    border-radius:50%;

    cursor:pointer;

    background:rgba(255,255,255,0.10);
    color:#fff;

    font-size:18px;
    font-weight:700;

    backdrop-filter: blur(10px);

    transition:.3s ease;
}

.dr1059popup-close:hover{
    background:#ef4444;
    transform: rotate(90deg) scale(1.1);
}

/* =========================================
   BADGE (IMPROVED CONTRAST)
========================================= */

.dr1059popup-badge{
    display:inline-block;

    padding:6px 12px;

    border-radius:20px;

    background:rgba(99,102,241,.25);
    border:1px solid rgba(99,102,241,.45);

    color:#c7d2fe;

    font-size:11px;
    font-weight:600;
}

/* =========================================
   HEADER (FIXED VISIBILITY)
========================================= */

.dr1059popup-header h2{
    font-size:22px;
    margin:12px 0 8px;
    font-weight:800;

    color:#ffffff;
}

.dr1059popup-header p{
    font-size:13px;
    color:rgba(255,255,255,0.88);
    line-height:1.5;
}

/* =========================================
   BODY CARD (FIXED GLASS READABILITY)
========================================= */

.dr1059popup-body{
    margin-top:18px;
    padding:16px;

    display:flex;
    gap:14px;

    /* FIX: stronger inner contrast */
    background:rgba(0,0,0,0.25);
    border:1px solid rgba(255,255,255,0.10);

    border-radius:16px;
}

.dr1059popup-icon{
    width:46px;
    height:46px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:14px;

    font-size:22px;

    background:linear-gradient(135deg,#6366f1,#ec4899);

    box-shadow:0 10px 25px rgba(99,102,241,0.35);
}

/* =========================================
   BUTTON
========================================= */

.dr1059popup-footer{
    margin-top:20px;
    text-align:center;
}

.dr1059popup-btn{
    display:inline-block;

    padding:11px 22px;

    border-radius:14px;

    font-weight:700;

    text-decoration:none;

    color:#0b1224;

    background:linear-gradient(135deg,#22c55e,#38bdf8);

    box-shadow:0 15px 40px rgba(56,189,248,0.25);

    transition:.3s ease;
}

.dr1059popup-btn:hover{
    transform:translateY(-3px);
    box-shadow:0 25px 60px rgba(56,189,248,0.35);
}

/* =========================================
   MOBILE
========================================= */

@media(max-width:768px){

    .dr1059popup-box{
        width:92%;
        margin-right:10px;
    }
}