/* =====================================================================
   [شكل] قواعد عامة لكل شاشات السيستم والمنصة والموقع
   ===================================================================== */

/* من غير سكرول بار ظاهر في أي مكان (السكرول نفسه شغال عادي بالماوس واللمس) */
html, body, * { scrollbar-width: none; -ms-overflow-style: none; }
html::-webkit-scrollbar, body::-webkit-scrollbar, *::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none; background: transparent; }

/* كل المودالز: المودال نفسه هو اللي بيسكرول لما يكبر (مش الصفحة)، والهيدر والزراير تفضل ثابتة */
.modal-dialog:not(.modal-fullscreen) { max-height: calc(100% - 3.5rem); }
.modal-dialog:not(.modal-fullscreen) > .modal-content { max-height: calc(100vh - 3.5rem); display: flex; flex-direction: column; overflow: hidden; }
.modal-dialog:not(.modal-fullscreen) > .modal-content > form { display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; overflow: hidden; }
.modal-dialog:not(.modal-fullscreen) > .modal-content > .modal-body,
.modal-dialog:not(.modal-fullscreen) > .modal-content > form > .modal-body { overflow-y: auto; min-height: 0; flex: 1 1 auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.modal-dialog:not(.modal-fullscreen) > .modal-content > .modal-header,
.modal-dialog:not(.modal-fullscreen) > .modal-content > .modal-footer,
.modal-dialog:not(.modal-fullscreen) > .modal-content > form > .modal-footer { flex: 0 0 auto; }
@media (max-width: 575.98px) {
    .modal-dialog:not(.modal-fullscreen) > .modal-content { max-height: calc(100vh - 1rem); }
}

/* الصفحة مابتتشدش (سحب/سكرول زيادة عن الآخر) — الخلفية ثابتة والمحتوى بس اللي بيتحرك */
html, body { overscroll-behavior: none; }
/* من غير زووم بالضغطتين، والتكبير بالصباعين ممنوع من gs-base.js (التصغير مسموح عشان عرض التابات في المتصفح) */
html { touch-action: manipulation; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
a, button, input, select, textarea, label, [role="button"] { touch-action: manipulation; }
/* السكرول جوه القايمة الجانبية أو أي مودال أو قايمة منسدلة مابيحركش الصفحة اللي ورا */
.gs-sidebar, .gs-sidebar *, .gs-nav, .modal, .modal-body, .dropdown-menu, .gs-bell-panel, .gs-bell-list, .select2-results__options { overscroll-behavior: contain; }

/* شريط "السيرفر غير متاح" */
.gs-net { position: fixed; z-index: 3000; top: calc(12px + env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 10px; max-width: calc(100vw - 24px);
    padding: 11px 16px; border-radius: 14px; background: #141414; color: #fff; font-family: inherit; box-shadow: 0 18px 44px rgba(0, 0, 0, .35); animation: gsNetIn .3s ease both; }
.gs-net b { font-size: 13.5px; font-weight: 800; white-space: nowrap; }
.gs-net small { font-size: 12px; color: #b9bcc2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-net-dot { width: 9px; height: 9px; border-radius: 50%; background: #f59e0b; flex: 0 0 auto; animation: gsNetPulse 1.2s ease-in-out infinite; }
.gs-net.is-back .gs-net-dot { background: #22c55e; animation: none; }
.gs-net button { border: 0; border-radius: 9px; background: #d53c41; color: #fff; font-weight: 800; font-size: 12.5px; padding: 5px 12px; cursor: pointer; }
@keyframes gsNetIn { from { opacity: 0; transform: translate(-50%, -10px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes gsNetPulse { 50% { opacity: .35; } }

/* [شكل] التحديث: شريط تقدم فوق وقت التحديث + كارت "تم التحديث" بعد ما الصفحة ترجع */
.gs-refbar { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 3100; pointer-events: none; }
.gs-refbar span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #d53c41, #ff7a7e); box-shadow: 0 0 10px rgba(213, 60, 65, .6); border-radius: 0 3px 3px 0; transition: width 2.2s cubic-bezier(.1, .7, .2, 1); }
.gs-refbar.is-on span { width: 85%; }
[dir="rtl"] .gs-refbar span { margin-inline-start: 0; border-radius: 3px 0 0 3px; }
.gs-reftoast { position: fixed; z-index: 3050; top: calc(var(--gs-top-h, 0px) + 12px + env(safe-area-inset-top)); left: 50%; transform: translate(-50%, -16px) scale(.96); opacity: 0;
    display: flex; align-items: center; gap: 10px; padding: 11px 20px 11px 12px; border-radius: 999px; background: #141414; color: #fff; font-family: inherit;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .28); transition: transform .35s cubic-bezier(.34, 1.56, .64, 1), opacity .25s ease; pointer-events: none; }
.gs-reftoast.is-on { opacity: 1; transform: translate(-50%, 0) scale(1); }
.gs-reftoast .fa { width: 27px; height: 27px; border-radius: 50%; background: #22c55e; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; animation: gsRefPop .45s cubic-bezier(.34, 1.56, .64, 1) .1s both; }
.gs-reftoast { white-space: nowrap; max-width: calc(100vw - 24px); }
.gs-reftoast b { font-size: 14.5px; font-weight: 800; white-space: nowrap; }
.gs-reftoast small { font-size: 13px; color: #9ca3af; direction: ltr; white-space: nowrap; flex: 0 0 auto; }
.gs-reftoast .fa { flex: 0 0 auto; }
@keyframes gsRefPop { from { transform: scale(0) rotate(-90deg); } to { transform: none; } }

/* المودال اللي بيطلع من تحت: اللي ورا بار المتصفح (تحت) أبيض زي المودال */
@media (max-width: 767.98px) {
    html.gs-modal-open { background: #fff !important; }
    html.gs-modal-open .modal-dialog > .modal-content { box-shadow: 0 -12px 40px rgba(0, 0, 0, .25); }
    /* آيفون (سفاري الجديد): البار اللي تحت عايم فوق الصفحة، واللي وراه بيبان من خلفية الصفحة (غامقة).
       المودال والضلمة بيوصلوا لآخر الشاشة الحقيقية (100lvh)، والمودال نفسه بيفضل فوق البار (100svh)،
       والمساحة اللي تحته (ورا البار) بيضا زيه — من غير ما شكل الصفحة يتغير */
    @supports (height: 100lvh) {
        html.gs-modal-open body.gsm-body .modal.show { bottom: auto; height: 100lvh; }
        html.gs-modal-open body.gsm-body .modal-backdrop { bottom: auto; height: 100lvh; }
        html.gs-modal-open body.gsm-body .modal.show .modal-dialog { height: 100svh; min-height: 100svh; }
        html.gs-modal-open body.gsm-body .modal.show .modal-dialog > .modal-content {
            box-shadow: 0 -12px 40px rgba(0, 0, 0, .25), 0 calc(100lvh - 100svh) 0 0 #fff;
        }
    }
}

/* المودال مفتوح: السكرول جوه المودال مايعدّيش للصفحة اللي وراه (مايهنّجش) */
.modal { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.modal .modal-body, .modal .modal-content { overscroll-behavior: contain; }
html.gs-scroll-lock, html.gs-scroll-lock body { overflow: hidden; }
.sweet-overlay { touch-action: none; }

/* شاشات الموظفين والمنصة كتطبيق على الآيفون: الهيدر بينزل تحت النوتش والشريط اللي فوق غامق (الساعة تبان) */
.gs-topbar { padding-top: env(safe-area-inset-top, 0px); height: calc(var(--gs-top-h) + env(safe-area-inset-top, 0px)); }
.gs-topbar::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: env(safe-area-inset-top, 0px); background: #0b0b0c; pointer-events: none; }
.gs-sidebar { padding-top: env(safe-area-inset-top, 0px); }