/* Al-Gyoushy Popup CSS v1.4.0 */
#agp-overlay {
    position: fixed; inset: 0; z-index: 999999;
    display: flex; align-items: center; justify-content: center;
    padding: 16px; animation: agpFadeIn .3s ease;
}
@keyframes agpFadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes agpSlideUp { from { opacity:0; transform:translateY(40px) scale(.95); } to { opacity:1; transform:translateY(0) scale(1); } }

#agp-popup {
    position: relative; width: 100%; max-width: 360px;
    padding: 22px 20px 18px; text-align: center;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
    animation: agpSlideUp .4s cubic-bezier(.34,1.56,.64,1) both;
    font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
}
#agp-close {
    position: absolute; top: 12px; left: 14px;
    background: none; border: none; font-size: 20px;
    cursor: pointer; line-height: 1; opacity: .85;
    transition: .2s; padding: 4px 8px; border-radius: 50%;
}
#agp-close:hover { opacity:1; transform:rotate(90deg); }

.agp-icon-wrap {
    width: 68px; height: 68px; border-radius: 50%; border: 2.5px solid;
    margin: 0 auto 12px; display: flex; align-items: center;
    justify-content: center; background: rgba(255,255,255,.6);
}
.agp-title {
    font-size: 24px;
    font-weight: 900;
    margin: 0 0 8px;
    direction: rtl;
    line-height: 1.3;
    letter-spacing: -0.3px;
    text-shadow: 0 1px 3px rgba(0,0,0,.08);
    animation: agpTitlePop .5s cubic-bezier(.34,1.56,.64,1) .3s both;
}
@keyframes agpTitlePop {
    from { opacity:0; transform:scale(.85); }
    to   { opacity:1; transform:scale(1); }
}
.agp-subtitle {
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 14px;
    direction: rtl;
    line-height: 1.6;
    padding: 6px 12px;
    border-radius: 8px;
}

/* ── Coupon ── */
.agp-coupon { border:2px dashed; border-radius:10px; padding:8px 12px; margin-bottom:12px; text-align:right; }
.agp-coupon-label { display:block; font-size:12px; font-weight:600; margin-bottom:8px; opacity:.8; }
.agp-coupon-row { display:flex; align-items:center; justify-content:space-between; gap:10px; direction:rtl; }
.agp-coupon-code { font-size:18px; font-weight:900; letter-spacing:3px; font-family:monospace; }
.agp-copy-btn { display:flex; align-items:center; gap:5px; background:rgba(0,0,0,.08); border:1px solid rgba(0,0,0,.15); border-radius:7px; padding:6px 12px; font-size:12px; font-weight:600; cursor:pointer; transition:.2s; color:inherit; }
.agp-copy-btn:hover { background:rgba(0,0,0,.15); }
.agp-copy-btn.copied { background:#25D366; color:#fff; border-color:#25D366; }
.agp-coupon-hint { display:block; font-size:11px; margin-top:7px; opacity:.65; direction:rtl; }

/* ── Countdown ── */
.agp-countdown {
    border: 2px dashed; border-radius: 10px;
    padding: 8px 12px; margin-bottom: 18px; text-align: center;
}
.agp-countdown-label {
    display: block; font-size: 12px; font-weight: 700; margin-bottom: 7px;
}
.agp-countdown-timer {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 6px;
    direction: ltr;
}
.agp-countdown-unit {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    flex-shrink: 0; border-radius: 6px;
    padding: 5px 10px; min-width: 48px;
}
.agp-countdown-num {
    display: block; font-size: 20px; font-weight: 900;
    line-height: 1; font-family: monospace; letter-spacing: 1px;
}
.agp-countdown-sub { display:block; font-size:10px; margin-top:3px; opacity:.85; font-weight:600; }
.agp-countdown-sep { font-size:20px; font-weight:900; flex-shrink:0; padding-bottom:12px; }

/* ── Buttons ── */
.agp-btns { display:flex; gap:10px; direction:rtl; }
.agp-btn { flex:1; display:flex; align-items:center; justify-content:center; gap:7px; padding:10px 8px; border-radius:10px; font-size:14px; font-weight:700; text-decoration:none; transition:.2s; direction:rtl; }
.agp-btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,.15); }

@media (max-width: 480px) {
    #agp-popup { padding:18px 14px 16px; }
    .agp-title  { font-size:19px; }
    .agp-btns   { flex-direction:column; }
}
