/* ============================================================
   gov-loader.css — نظام التحميل المركزي الموحّد (v2)
   ============================================================
   Overlay مظلّل بصبغة خضراء داكنة (لا رمادي عام) + لوحة مرتفعة ذات
   حلقتين متقاطعتين أخضر/ذهبي + نبض/وميض خفيف رسمي، بالإضافة لحالة
   تحميل على مستوى الزر. يستخدم رموز colors.css فقط.
   ============================================================ */

#gov-loader-overlay {
    position: fixed;
    inset: 0;
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(1200px 700px at 50% 40%, rgba(7,77,49,.30), rgba(6,20,14,.62));
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
}

#gov-loader-overlay.visible {
    opacity: 1;
    pointer-events: all;
}

.gov-loader-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    background: var(--c-surface);
    padding: 34px 50px;
    border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-lg);
    min-width: 210px;
    border: 1px solid var(--c-border-1);
    position: relative;
    overflow: hidden;
    animation: gov-loader-pulse 1.9s ease-in-out infinite;
}

    .gov-loader-box::before {
        content: "";
        position: absolute;
        inset-inline: 0;
        top: 0;
        height: 3px;
        background: linear-gradient(90deg, var(--c-brand-800) 0%, var(--c-brand-600) 55%, var(--c-gold) 100%);
    }

/* نبض خفيف ورسمي حول لوحة التحميل */
@keyframes gov-loader-pulse {
    0%, 100% {
        box-shadow: var(--c-shadow-lg), 0 0 0 0 rgba(220, 196, 136, .18);
    }
    50% {
        box-shadow: var(--c-shadow-lg), 0 0 0 10px rgba(220, 196, 136, 0);
    }
}

/* حلقتا دوران متقاطعتان — أخضر (خارجية) وذهبي (داخلية) بسرعتين
   مختلفتين، انطباع "علامة رسمية" لا مؤشر تحميل عام */
.gov-loader-spinner {
    position: relative;
    width: 52px;
    height: 52px;
}

.gov-loader-spinner::before,
.gov-loader-spinner::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 4px solid transparent;
}

.gov-loader-spinner::before {
    inset: 0;
    border-top-color: var(--c-primary);
    border-right-color: var(--c-primary);
    animation: gov-loader-spin .95s linear infinite;
}

.gov-loader-spinner::after {
    inset: 9px;
    border-top-color: var(--c-gold-deep);
    border-left-color: var(--c-gold-deep);
    animation: gov-loader-spin-rev 1.3s linear infinite;
}

@keyframes gov-loader-spin {
    to { transform: rotate(360deg); }
}

@keyframes gov-loader-spin-rev {
    to { transform: rotate(-360deg); }
}

.gov-loader-message {
    font-size: var(--fs-small);
    font-weight: 700;
    color: var(--c-text-heading);
    text-align: center;
    animation: gov-loader-blink 1.9s ease-in-out infinite;
}

/* وميض خافت جدًا للنص فقط (وليس كامل اللوحة) كي يبقى الأثر "رسميًا" */
@keyframes gov-loader-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: .6; }
}

/* ── حالة تحميل على مستوى الزر الذي أطلق العملية ─────────────
   النص/الأيقونة تختفيان (دون تغيير حجم الزر) ويظهر مكانهما مؤشر دوّار صغير */
.gov-btn-loading {
    position: relative;
    color: transparent !important;
    pointer-events: none;
    opacity: .88;
}

.gov-btn-loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -8px;
    border-radius: 50%;
    border: 2.5px solid rgba(255, 255, 255, .55);
    border-top-color: #fff;
    animation: gov-loader-spin .6s linear infinite;
}

/* على الأزرار ذات الخلفية الفاتحة نستخدم مؤشرًا داكنًا بدل الأبيض */
.btn-light.gov-btn-loading::after,
.btn-outline-success.gov-btn-loading::after,
.btn-outline-primary.gov-btn-loading::after,
.btn-outline-danger.gov-btn-loading::after,
.btn-outline-secondary.gov-btn-loading::after,
.btn-outline-dark.gov-btn-loading::after {
    border-color: rgba(31, 41, 55, .25);
    border-top-color: var(--c-text-heading);
}

/* شريط تقدّم رفيع أعلى الصفحة أثناء التنقّل بين الصفحات (روابط/Pagination) —
   إشارة إضافية خفيفة إلى جانب الـ Overlay، شائعة في الأنظمة الرسمية الحديثة */
#gov-loader-bar {
    position: fixed;
    top: 0;
    inset-inline: 0;
    height: 3px;
    z-index: 9100;
    background: linear-gradient(90deg, var(--c-brand-800), var(--c-primary), var(--c-gold));
    transform: scaleX(0);
    transform-origin: right;
    opacity: 0;
    transition: transform .5s ease, opacity .2s ease;
}

#gov-loader-bar.visible {
    opacity: 1;
    transform: scaleX(.75);
}