/* =====================================================================
   [مشترك جديد بـ Access Key سوفت] الزراير (الهيدر / الصفحات / "+" العايم) + مودال الخطوات + صورة الكود
   ألوان الثيم من متغيرات السيستم (--gs-red ...) — نفس شكل باقي الشاشات
   ===================================================================== */
/* ---------- الزراير */
.gs-nm-top, .gs-nm-btn {
    display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 12px; border: 0; cursor: pointer;
    background: var(--gs-red, #d53c41); color: #fff; font-weight: 700; font-size: 13.5px; white-space: nowrap; font-family: inherit;
    box-shadow: 0 8px 18px -10px rgba(var(--gs-red-rgb, 213, 60, 65), .8); transition: background-color .15s, transform .1s, box-shadow .15s, opacity .15s;
}
.gs-nm-top:hover, .gs-nm-btn:hover { background: var(--gs-red-dark, #b52f34); }
.gs-nm-top:active, .gs-nm-btn:active { transform: scale(.97); }
.gs-nm-top:focus-visible, .gs-nm-btn:focus-visible { outline: 3px solid var(--gs-accent-ring, rgba(213, 60, 65, .25)); outline-offset: 2px; }
.gs-nm-n { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 7px; border-radius: 999px; background: rgba(255, 255, 255, .22); font-size: 11.5px; font-weight: 800; font-family: 'Poppins', 'Cairo', sans-serif; }
.gs-nm-n[hidden] { display: none; }
.gs-nm-top { margin-inline-end: 4px; }
@media (max-width: 991.98px) { .gs-nm-top { display: none; } }
.gs-admin .widget-header .gs-nm-btn { margin-inline-start: auto; height: 36px; }
/* خلصت: باهت (والدوسة بتفتح رسالة "خلصت") */
.gs-nm-top.is-empty, .gs-nm-btn.is-empty { background: #e9eaee; color: #8a909b; box-shadow: none; }
.gs-nm-top.is-empty .gs-nm-n, .gs-nm-btn.is-empty .gs-nm-n { background: #d5d8de; color: #6b7280; }
.gs-fab-menu .ic.is-member { background: var(--gs-red-soft, #fbeced); color: var(--gs-red, #d53c41); }
.gs-fab-menu a.gs-nm-fab .gs-nm-n { background: var(--gs-red-soft, #fbeced); color: var(--gs-red-dark, #b52f34); }
.gs-fab-menu a.gs-nm-fab.is-empty { color: #8a909b !important; }
.gs-fab-menu a.gs-nm-fab.is-empty .ic { background: #eef0f3; color: #9aa1ab; }

/* ---------- رسالة "خلصت" */
.gs-nm-out { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.gs-nm-out-ic { width: 64px; height: 64px; border-radius: 20px; display: inline-flex; align-items: center; justify-content: center; font-size: 30px; background: var(--gs-red-soft, #fbeced); color: var(--gs-red, #d53c41); }
.gs-nm-out p { margin: 0; color: #4b5563; font-size: 14.5px; line-height: 1.7; }

/* ---------- المودال */
.gs-nm-modal .modal-content { border-radius: 20px; overflow: hidden; }
.gs-nm-head { align-items: flex-start; }
.gs-nm-hl { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gs-nm-hl .modal-title { font-weight: 800; }
.gs-nm-key { display: inline-flex; align-items: center; gap: 7px; align-self: flex-start; padding: 4px 11px; border-radius: 999px; background: #ecfdf3; color: #067647; font-size: 12.5px; font-weight: 700; }
.gs-nm-key[hidden] { display: none; }
.gs-nm-steps { display: flex; gap: 8px; list-style: none; margin: 0; padding: 12px 18px; border-bottom: 1px solid var(--gs-border, #e1e3e8); background: #fafafb; }
.gs-nm-steps[hidden] { display: none; }
.gs-nm-steps li { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 8px; color: #9aa1ab; font-size: 13px; }
.gs-nm-steps li span { flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 12.5px; background: #eef0f3; color: #8a909b; font-family: 'Poppins', 'Cairo', sans-serif; }
.gs-nm-steps li b { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gs-nm-steps li::after { content: ''; flex: 1 1 auto; height: 2px; border-radius: 2px; background: #e5e7eb; min-width: 10px; }
.gs-nm-steps li:last-child::after { display: none; }
.gs-nm-steps li.is-on { color: var(--gs-text, #1d2127); }
.gs-nm-steps li.is-on span { background: var(--gs-red, #d53c41); color: #fff; box-shadow: 0 0 0 4px var(--gs-accent-ring, rgba(213, 60, 65, .18)); }
.gs-nm-steps li.is-done { color: #067647; }
.gs-nm-steps li.is-done span { background: #12b76a; color: #fff; }
.gs-nm-steps li.is-done::after { background: #12b76a; }
.gs-nm-body { min-height: 260px; }
.gs-nm-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 240px; color: var(--gs-muted, #636b78); text-align: center; }
.gs-nm-loading .fa { font-size: 30px; color: var(--gs-red, #d53c41); }
.gs-nm-loading.is-err .fa { color: #d92d20; }
.gs-nm-loading p { margin: 0; font-weight: 600; }

/* الحقول */
.gs-nm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.gs-nm-f { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin-bottom: 14px; }
.gs-nm-grid > .gs-nm-f { margin-bottom: 0; }
.gs-nm-grid + .gs-nm-f, .gs-nm-grid + .gs-nm-grid, .gs-nm-f + .gs-nm-grid, .gs-nm-train + .gs-nm-grid { margin-top: 14px; }
.gs-nm-f.is-wide { grid-column: 1 / -1; }
.gs-nm-f > label { margin: 0; font-size: 12.5px; font-weight: 700; color: #4b5563; }
.gs-nm-f .form-control { height: 44px; border-radius: 12px; font-size: 14.5px; }
.gs-nm-f.is-bad .form-control, .gs-nm-f.is-bad .gs-nm-seg, .gs-nm-f.is-bad .gs-nm-chips { border-color: #f04438 !important; box-shadow: 0 0 0 3px rgba(240, 68, 56, .12); border-radius: 12px; }
.gs-nm-err { margin: 2px 0 0; color: #d92d20; font-size: 12.5px; font-weight: 700; }
.gs-nm-fixed { height: 44px; display: flex; align-items: center; gap: 8px; padding: 0 14px; border-radius: 12px; background: #f6f7f9; color: var(--gs-text, #1d2127); font-weight: 700; }
.gs-nm-fixed .fa { color: var(--gs-red, #d53c41); }
.gs-nm-seg { display: flex; gap: 6px; padding: 4px; border-radius: 12px; background: #f1f2f4; border: 1px solid transparent; }
.gs-nm-seg button { flex: 1 1 0; min-width: 0; height: 36px; border: 0; border-radius: 9px; background: transparent; color: #4b5563; font-weight: 700; font-size: 13.5px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; font-family: inherit; }
.gs-nm-seg button.is-on { background: #fff; color: var(--gs-text, #1d2127); box-shadow: 0 1px 3px rgba(16, 24, 40, .12); }
.gs-nm-seg button.is-on .fa { color: var(--gs-red, #d53c41); }
.gs-nm-phone { min-height: 18px; font-size: 12.5px; font-weight: 600; line-height: 1.6; }
.gs-nm-phone .is-ok { color: #067647; }
.gs-nm-phone .is-info { color: #175cd3; }
.gs-nm-phone .is-bad { color: #d92d20; }
.gs-nm-phone .is-wait { color: #9aa1ab; }
.gs-nm-link { border: 0; background: none; padding: 0; color: var(--gs-red, #d53c41); font-weight: 800; text-decoration: underline; cursor: pointer; font-size: 12.5px; }
.gs-nm-chips { display: flex; flex-wrap: wrap; gap: 8px; border: 1px solid transparent; padding: 1px; }
.gs-nm-chips button { height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--gs-border, #e1e3e8); background: #fff; color: #374151; font-weight: 700; font-size: 13px; cursor: pointer; display: inline-flex; align-items: center; gap: 7px; font-family: inherit; }
.gs-nm-chips button .fa { color: #9aa1ab; }
.gs-nm-chips button.is-on { border-color: var(--gs-red, #d53c41); background: var(--gs-red-soft, #fbeced); color: var(--gs-red-dark, #b52f34); }
.gs-nm-chips button.is-on .fa { color: var(--gs-red, #d53c41); }
.gs-nm-refmore:empty { display: none; }
.gs-nm-refmore { margin-top: 8px; }
.gs-nm-hits { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.gs-nm-hits:empty { display: none; }
.gs-nm-hits button { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; border: 1px solid var(--gs-border, #e1e3e8); background: #fff; text-align: start; cursor: pointer; font-family: inherit; }
.gs-nm-hits button .fa { font-size: 22px; color: #c0c5cd; }
.gs-nm-hits button span { display: flex; flex-direction: column; min-width: 0; }
.gs-nm-hits button small { color: var(--gs-muted, #636b78); }
.gs-nm-hits button.is-on { border-color: var(--gs-red, #d53c41); background: var(--gs-red-soft, #fbeced); }
.gs-nm-hits button.is-on .fa { color: var(--gs-red, #d53c41); }
.gs-nm-none { margin: 4px 0 0; color: var(--gs-muted, #636b78); font-size: 13px; }
.gs-nm-pinfo { font-size: 12.5px; color: var(--gs-muted, #636b78); font-weight: 600; }
.gs-nm-pinfo:empty { display: none; }
.gs-nm-train { padding: 14px; border-radius: 14px; background: #fafafb; border: 1px dashed #dfe2e7; }
.gs-nm-train[hidden] { display: none; }
.gs-nm-hint { margin: 10px 0 0; color: var(--gs-muted, #636b78); font-size: 12.5px; }
.gs-nm-why { color: var(--gs-muted, #636b78); font-size: 12px; line-height: 1.6; }
.gs-nm-money { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 14px 0; }
.gs-nm-money:empty { display: none; }
.gs-nm-money > div { padding: 10px 12px; border-radius: 12px; background: #f6f7f9; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gs-nm-money small { font-size: 11.5px; font-weight: 700; color: var(--gs-muted, #636b78); }
.gs-nm-money b { font-size: 15px; font-weight: 800; white-space: nowrap; }
.gs-nm-money .is-paid { background: #ecfdf3; } .gs-nm-money .is-paid b { color: #067647; }
.gs-nm-money .is-rem { background: #fff6ed; } .gs-nm-money .is-rem b { color: #b54708; }

/* المراجعة */
.gs-nm-review { display: flex; flex-direction: column; gap: 14px; }
.gs-nm-review section { border: 1px solid var(--gs-border, #e1e3e8); border-radius: 16px; padding: 14px 16px; }
.gs-nm-review h5 { margin: 0 0 10px; font-size: 14px; font-weight: 800; display: flex; align-items: center; gap: 8px; }
.gs-nm-review h5 .fa { color: var(--gs-red, #d53c41); }
.gs-nm-rows { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px 16px; }
.gs-nm-rows > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gs-nm-rows small { font-size: 11.5px; color: var(--gs-muted, #636b78); font-weight: 700; }
.gs-nm-rows b { font-size: 14px; overflow-wrap: anywhere; }
.gs-nm-note { margin: 0; padding: 12px 14px; border-radius: 14px; background: #eff8ff; color: #175cd3; font-weight: 600; font-size: 13px; display: flex; gap: 10px; align-items: flex-start; }
.gs-nm-note .fa { margin-top: 3px; }

/* الفوتر */
.gs-nm-foot { display: flex; gap: 10px; justify-content: space-between; flex-wrap: nowrap; }
.gs-nm-foot .btn { min-height: 44px; border-radius: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 18px; }
.gs-nm-foot .gs-nm-next { margin-inline-start: auto; }

/* تم */
.gs-nm-done-h { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.gs-nm-tick { flex-shrink: 0; width: 52px; height: 52px; border-radius: 50%; background: #12b76a; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 24px; box-shadow: 0 0 0 8px #d1fadf; animation: gsNmPop .45s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes gsNmPop { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
.gs-nm-done-h b { display: block; font-size: 17px; font-weight: 800; }
.gs-nm-done-h small { color: var(--gs-muted, #636b78); font-size: 13px; font-weight: 600; }
.gs-nm-card { display: grid; grid-template-columns: minmax(0, 260px) 1fr; gap: 20px; align-items: center; }
.gs-nm-img { aspect-ratio: 4 / 5; border-radius: 16px; background: #f1f2f4; display: flex; align-items: center; justify-content: center; overflow: hidden; box-shadow: 0 18px 40px -18px rgba(16, 24, 40, .45); }
.gs-nm-img .fa { font-size: 26px; color: #c0c5cd; }
.gs-nm-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gs-nm-acts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gs-nm-acts .btn { min-height: 46px; border-radius: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.gs-nm-acts .btn-primary { grid-column: 1 / -1; min-height: 50px; font-size: 15px; }
.gs-nm-acts .gs-nm-wa { background: #25d366; border-color: #25d366; color: #fff !important; }
.gs-nm-acts .gs-nm-wa:hover { background: #1ebe5a; }
.gs-nm-acts .btn.is-done { background: #ecfdf3; border-color: #a7f3d0; color: #047857; }
.gs-nm-open { grid-column: 1 / -1; font-size: 12.5px; color: #1d4fb8; word-break: break-all; text-align: center; }

@media (max-width: 575.98px) {
    .gs-nm-grid { grid-template-columns: 1fr; }
    .gs-nm-steps { padding: 10px 14px; gap: 6px; }
    .gs-nm-steps li b { font-size: 12px; }
    .gs-nm-steps li:not(.is-on) b { display: none; }
    .gs-nm-steps li { flex: 1 1 0; }
    .gs-nm-steps li.is-on { flex: 2.4 1 auto; }
    .gs-nm-steps li.is-on b { overflow: visible; text-overflow: clip; }
    .gs-nm-acts .btn { font-size: 13.5px; padding: 0 10px; }
    .gs-nm-money b { font-size: 13.5px; }
    .gs-nm-card { grid-template-columns: 1fr; }
    .gs-nm-img { width: min(240px, 72%); margin: 0 auto; }
    .gs-nm-foot .btn { flex: 1 1 0; padding: 0 12px; }
}
@media (prefers-reduced-motion: reduce) { .gs-nm-tick { animation: none; } }