/* =========================================================
   Sadaa Design System — Components v1.0
   صدى المتاجر

   المكونات الحالية: Buttons + Forms / Inputs + Switches / Toggles + Date / Time / Flatpickr + File Upload / Media Inputs + Accordion / Collapsible Sections
   جميع المكونات هنا Opt-in ولا تغيّر عناصر الموقع القديمة تلقائياً.
   ========================================================= */

/* =========================================================
   Buttons
   ========================================================= */
.sadaa-btn {
  --sadaa-btn-height: var(--sadaa-control-base, 42px);
  --sadaa-btn-padding-inline: 16px;
  --sadaa-btn-gap: 8px;
  --sadaa-btn-radius: var(--sadaa-radius-button, 8px);
  --sadaa-btn-font-size: var(--sadaa-font-size-md, 14px);
  --sadaa-btn-font-weight: var(--sadaa-font-weight-medium, 500);

  min-height: var(--sadaa-btn-height);
  padding: 8px var(--sadaa-btn-padding-inline);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sadaa-btn-gap);
  box-sizing: border-box;
  border: var(--sadaa-border-width, 1px) solid transparent;
  border-radius: var(--sadaa-btn-radius);
  font-family: var(--sadaa-font-family, var(--site-font-family, Tahoma, Arial, sans-serif));
  font-size: var(--sadaa-btn-font-size);
  font-weight: var(--sadaa-btn-font-weight);
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition:
    background-color var(--sadaa-transition-base, 180ms ease),
    border-color var(--sadaa-transition-base, 180ms ease),
    color var(--sadaa-transition-base, 180ms ease),
    box-shadow var(--sadaa-transition-base, 180ms ease);
}

.sadaa-btn > i,
.sadaa-btn > svg,
.sadaa-btn > .sadaa-btn__icon {
  flex: 0 0 auto;
}

.sadaa-btn:focus-visible {
  outline: 3px solid var(--sadaa-focus, rgba(var(--sadaa-primary-rgb), .14));
  outline-offset: 2px;
}

.sadaa-btn[disabled],
.sadaa-btn[aria-disabled="true"],
.sadaa-btn.is-disabled {
  opacity: .52;
  cursor: not-allowed;
  pointer-events: none;
}

/* Admin Buttons — أزرار لوحة التحكم
   تستخدم ألوان هوية لوحة الإدارة وتتفوق بصرياً على الأنماط المحلية القديمة
   بدون تغيير أبعاد التخطيط الخاصة بكل تبويب. */
.sadaa-btn.sadaa-btn--admin-primary {
  background: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  border-color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  color: #fff !important;
}

.sadaa-btn.sadaa-btn--admin-primary:hover:not(:disabled):not([aria-disabled="true"]) {
  background: var(--sadaa-admin-hover, var(--sadaa-primary-dark)) !important;
  border-color: var(--sadaa-admin-hover, var(--sadaa-primary-dark)) !important;
  color: #fff !important;
}

.sadaa-btn.sadaa-btn--admin-secondary {
  background: #fff !important;
  border-color: var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  color: var(--sadaa-admin-text, var(--sadaa-text-2, #374151)) !important;
}

.sadaa-btn.sadaa-btn--admin-secondary:hover:not(:disabled):not([aria-disabled="true"]) {
  background: var(--sadaa-admin-soft, var(--sadaa-tint-3, #f8fafc)) !important;
  border-color: var(--sadaa-admin-soft-line, var(--sadaa-line-3, #cbd5e1)) !important;
  color: var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
}

.sadaa-btn.sadaa-btn--admin-soft {
  background: var(--sadaa-admin-soft, var(--sadaa-tint, #f5f7f9)) !important;
  border-color: var(--sadaa-admin-soft-line, var(--sadaa-line-2, #e2e8f0)) !important;
  color: var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
}

.sadaa-btn.sadaa-btn--admin-soft:hover:not(:disabled):not([aria-disabled="true"]) {
  background: rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .08) !important;
  border-color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  color: var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
}

.sadaa-btn.sadaa-btn--admin-light {
  background: #fff !important;
  border-color: rgba(255,255,255,.34) !important;
  color: var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
}

.sadaa-btn.sadaa-btn--admin-light:hover:not(:disabled):not([aria-disabled="true"]) {
  background: rgba(255,255,255,.94) !important;
  border-color: #fff !important;
  color: var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
}

.sadaa-btn.sadaa-btn--admin-danger-soft {
  background: var(--sadaa-danger-soft, #fff5f4) !important;
  border-color: var(--sadaa-danger-line, #f3b7b2) !important;
  color: var(--sadaa-danger, #b42318) !important;
}

.sadaa-btn.sadaa-btn--admin-danger-soft:hover:not(:disabled):not([aria-disabled="true"]) {
  background: var(--sadaa-danger-soft-hover, #feeceb) !important;
  border-color: var(--sadaa-danger, #b42318) !important;
  color: var(--sadaa-danger, #b42318) !important;
}

.sadaa-btn.sadaa-btn--admin-icon {
  --sadaa-btn-height: 34px;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
}

.sadaa-btn.sadaa-btn--admin-primary:focus-visible,
.sadaa-btn.sadaa-btn--admin-secondary:focus-visible,
.sadaa-btn.sadaa-btn--admin-soft:focus-visible,
.sadaa-btn.sadaa-btn--admin-light:focus-visible,
.sadaa-btn.sadaa-btn--admin-danger-soft:focus-visible {
  outline-color: rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .22) !important;
}

.sadaa-btn.sadaa-btn--admin-primary:disabled,
.sadaa-btn.sadaa-btn--admin-secondary:disabled,
.sadaa-btn.sadaa-btn--admin-soft:disabled,
.sadaa-btn.sadaa-btn--admin-danger-soft:disabled,
.sadaa-btn.sadaa-btn--admin-primary[aria-disabled="true"],
.sadaa-btn.sadaa-btn--admin-secondary[aria-disabled="true"],
.sadaa-btn.sadaa-btn--admin-soft[aria-disabled="true"],
.sadaa-btn.sadaa-btn--admin-danger-soft[aria-disabled="true"] {
  opacity: .48 !important;
  filter: saturate(.65);
}

/* Primary — الإجراء الرئيسي */
.sadaa-btn--primary {
  background: var(--sadaa-primary);
  border-color: var(--sadaa-primary);
  color: #fff;
}

.sadaa-btn--primary:hover {
  background: var(--sadaa-primary-dark);
  border-color: var(--sadaa-primary-dark);
  color: #fff;
}

/* Secondary — الإجراء الثانوي الهادئ */
.sadaa-btn--secondary {
  background: var(--sadaa-surface, #fff);
  border-color: var(--sadaa-line, #e5e7eb);
  color: var(--sadaa-text-2, #374151);
}

.sadaa-btn--secondary:hover {
  background: var(--sadaa-tint-3, #f8fafc);
  border-color: var(--sadaa-line-3, #cbd5e1);
  color: var(--sadaa-primary-dark);
}

/* Soft — ظهور خفيف من لون الهوية */
.sadaa-btn--soft {
  background: var(--sadaa-tint, #f5f7f9);
  border-color: var(--sadaa-line-2, #e2e8f0);
  color: var(--sadaa-primary-dark);
}

.sadaa-btn--soft:hover {
  background: var(--sadaa-tint-2, #eef4f7);
  border-color: var(--sadaa-line-3, #cbd5e1);
  color: var(--sadaa-primary-dark);
}

/* Ghost — للأدوات البسيطة داخل البطاقات والجداول */
.sadaa-btn--ghost {
  background: transparent;
  border-color: transparent;
  color: var(--sadaa-text-2, #374151);
}

.sadaa-btn--ghost:hover {
  background: var(--sadaa-tint-3, #f8fafc);
  color: var(--sadaa-primary-dark);
}

/* Danger / Success — حالات دلالية وليست ألوان هوية */
.sadaa-btn--danger {
  background: var(--sadaa-danger, #b42318);
  border-color: var(--sadaa-danger, #b42318);
  color: #fff;
}

.sadaa-btn--danger:hover {
  background: var(--sadaa-danger-dark, #912018);
  border-color: var(--sadaa-danger-dark, #912018);
  color: #fff;
}

.sadaa-btn--danger-soft {
  background: var(--sadaa-danger-soft, #fff5f4);
  border-color: var(--sadaa-danger-line, #f3b7b2);
  color: var(--sadaa-danger, #b42318);
}

.sadaa-btn--danger-soft:hover {
  background: var(--sadaa-danger-soft-hover, #feeceb);
  border-color: var(--sadaa-danger, #b42318);
}

.sadaa-btn--success {
  background: var(--sadaa-success, #067647);
  border-color: var(--sadaa-success, #067647);
  color: #fff;
}

.sadaa-btn--success:hover {
  background: var(--sadaa-success-dark, #05603a);
  border-color: var(--sadaa-success-dark, #05603a);
  color: #fff;
}

/* Inverse — فوق الخلفيات الملونة */
.sadaa-btn--light {
  background: #fff;
  border-color: rgba(255,255,255,.9);
  color: var(--sadaa-primary-dark);
}

.sadaa-btn--light:hover {
  background: rgba(255,255,255,.92);
  border-color: #fff;
  color: var(--sadaa-primary-dark);
}

/* Sizes */
.sadaa-btn--xs {
  --sadaa-btn-height: var(--sadaa-control-xs, 32px);
  --sadaa-btn-padding-inline: 10px;
  --sadaa-btn-gap: 6px;
  --sadaa-btn-font-size: var(--sadaa-font-size-xs, 12px);
}

.sadaa-btn--sm {
  --sadaa-btn-height: var(--sadaa-control-sm, 34px);
  --sadaa-btn-padding-inline: 12px;
  --sadaa-btn-gap: 6px;
  --sadaa-btn-font-size: var(--sadaa-font-size-sm, 13px);
}

.sadaa-btn--md {
  --sadaa-btn-height: var(--sadaa-control-md, 38px);
  --sadaa-btn-padding-inline: 14px;
  --sadaa-btn-font-size: var(--sadaa-font-size-sm, 13px);
}

.sadaa-btn--lg {
  --sadaa-btn-height: var(--sadaa-control-lg, 46px);
  --sadaa-btn-padding-inline: 20px;
}

.sadaa-btn--xl {
  --sadaa-btn-height: var(--sadaa-control-xl, 48px);
  --sadaa-btn-padding-inline: 22px;
  --sadaa-btn-font-size: var(--sadaa-font-size-base, 16px);
}

/* Utilities */
.sadaa-btn--full {
  width: 100%;
}

.sadaa-btn--icon {
  width: var(--sadaa-btn-height);
  min-width: var(--sadaa-btn-height);
  padding-inline: 0;
  aspect-ratio: 1;
}

.sadaa-btn-group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sadaa-space-4, 10px);
}

@media (max-width: 480px) {
  .sadaa-btn-group--stack-mobile {
    align-items: stretch;
    flex-direction: column;
  }

  .sadaa-btn-group--stack-mobile > .sadaa-btn {
    width: 100%;
  }
}

/* =========================================================
   Responsive Button Groups
   نمط عام لترتيب مجموعات الإجراءات عبر أحجام الشاشات
   ========================================================= */
.sadaa-btn-group--responsive {
  justify-content: center;
}

@media (max-width: 640px) {
  .sadaa-btn-group--responsive {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    width: min(100%, 440px);
    margin-inline: auto;
  }

  .sadaa-btn-group--responsive > .sadaa-btn {
    width: 100%;
    min-width: 0;
  }
}


/* عند وجود عدد فردي من الأزرار على شبكة الجوال، يمتد الزر الأخير على العمودين. */
@media (max-width: 640px) and (min-width: 411px) {
  .sadaa-btn-group--balanced > .sadaa-btn:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 410px) {
  .sadaa-btn-group--responsive {
    grid-template-columns: 1fr;
    width: min(100%, 320px);
  }
}

/* =========================================================
   Forms / Inputs System — v1.0
   مكونات النماذج المركزية — Opt-in
   ========================================================= */

.sadaa-form {
  color: var(--sadaa-text, #111827);
  font-family: var(--sadaa-font-family, var(--site-font-family, Tahoma, Arial, sans-serif));
}

.sadaa-form-grid {
  display: grid;
  column-gap: var(--sadaa-space-6, 14px);
  row-gap: var(--sadaa-space-7, 16px);
  min-width: 0;
}

.sadaa-form-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sadaa-field {
  display: grid;
  gap: var(--sadaa-space-2, 6px);
  min-width: 0;
}

.sadaa-field--full {
  grid-column: 1 / -1;
}

.sadaa-label {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--sadaa-space-2, 6px);
  width: fit-content;
  max-width: 100%;
  margin: 0;
  color: var(--sadaa-text, #111827);
  font-size: var(--sadaa-font-size-md, 14px);
  font-weight: var(--sadaa-font-weight-medium, 500);
  line-height: var(--sadaa-line-height-base, 1.7);
}

.sadaa-label__hint,
.sadaa-help {
  color: var(--sadaa-muted, #6b7280);
  font-size: var(--sadaa-font-size-xs, 12px);
  font-weight: var(--sadaa-font-weight-regular, 400);
  line-height: var(--sadaa-line-height-base, 1.7);
}

.sadaa-required {
  color: var(--sadaa-danger, #b42318);
}

.sadaa-input,
.sadaa-textarea,
.sadaa-select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  border: var(--sadaa-border-width, 1px) solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-field, 8px);
  background: var(--sadaa-surface, #fff);
  color: var(--sadaa-text, #111827);
  font-family: inherit;
  font-size: var(--sadaa-font-size-md, 14px);
  font-weight: var(--sadaa-font-weight-regular, 400);
  line-height: var(--sadaa-line-height-base, 1.7);
  outline: none;
  transition:
    border-color var(--sadaa-transition-base, 180ms ease),
    box-shadow var(--sadaa-transition-base, 180ms ease),
    background-color var(--sadaa-transition-base, 180ms ease),
    color var(--sadaa-transition-base, 180ms ease);
}

.sadaa-input,
.sadaa-select {
  min-height: var(--sadaa-control-lg, 46px);
  padding: 9px 13px;
}

.sadaa-textarea {
  min-height: 150px;
  padding: 11px 13px;
  resize: vertical;
}

.sadaa-select {
  cursor: pointer;
}

/* Select shell — سهم موحد خارج عنصر select لتفادي تشوه قائمة المتصفح عند الفتح */
.sadaa-select-shell {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
}

.sadaa-select-shell > .sadaa-select,
.sadaa-select-shell > select {
  width: 100%;
  min-width: 0;
}

.sadaa-input::placeholder,
.sadaa-textarea::placeholder {
  color: var(--sadaa-muted, #6b7280);
  opacity: .82;
}

.sadaa-input:hover:not(:disabled):not([readonly]),
.sadaa-textarea:hover:not(:disabled):not([readonly]),
.sadaa-select:hover:not(:disabled) {
  border-color: var(--sadaa-line-3, #cbd5e1);
}

.sadaa-input:focus,
.sadaa-textarea:focus,
.sadaa-select:focus {
  border-color: var(--sadaa-primary);
  box-shadow: 0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb), .13));
  background: var(--sadaa-surface, #fff);
}

.sadaa-input:focus-visible,
.sadaa-textarea:focus-visible,
.sadaa-select:focus-visible {
  outline: none;
}

.sadaa-input:disabled,
.sadaa-textarea:disabled,
.sadaa-select:disabled,
.sadaa-input[aria-disabled="true"],
.sadaa-textarea[aria-disabled="true"],
.sadaa-select[aria-disabled="true"] {
  cursor: not-allowed;
  background: var(--sadaa-tint-3, #f8fafc);
  color: var(--sadaa-muted, #6b7280);
  opacity: .72;
}

.sadaa-input[readonly],
.sadaa-textarea[readonly] {
  background: var(--sadaa-surface-alt, #fcfbfd);
  color: var(--sadaa-text-2, #374151);
}

/* Validation states — تُفعّل صراحةً حتى لا تظهر الأخطاء قبل تفاعل المستخدم */
.sadaa-field.is-error .sadaa-input,
.sadaa-field.is-error .sadaa-textarea,
.sadaa-field.is-error .sadaa-select,
.sadaa-input.is-error,
.sadaa-textarea.is-error,
.sadaa-select.is-error,
.sadaa-input[aria-invalid="true"],
.sadaa-textarea[aria-invalid="true"],
.sadaa-select[aria-invalid="true"] {
  border-color: var(--sadaa-danger, #b42318);
}

.sadaa-field.is-error .sadaa-input:focus,
.sadaa-field.is-error .sadaa-textarea:focus,
.sadaa-field.is-error .sadaa-select:focus,
.sadaa-input.is-error:focus,
.sadaa-textarea.is-error:focus,
.sadaa-select.is-error:focus,
.sadaa-input[aria-invalid="true"]:focus,
.sadaa-textarea[aria-invalid="true"]:focus,
.sadaa-select[aria-invalid="true"]:focus {
  box-shadow: 0 0 0 3px rgba(180, 35, 24, .12);
}

.sadaa-field.is-success .sadaa-input,
.sadaa-field.is-success .sadaa-textarea,
.sadaa-field.is-success .sadaa-select,
.sadaa-input.is-success,
.sadaa-textarea.is-success,
.sadaa-select.is-success {
  border-color: var(--sadaa-success, #067647);
}

.sadaa-field.is-success .sadaa-input:focus,
.sadaa-field.is-success .sadaa-textarea:focus,
.sadaa-field.is-success .sadaa-select:focus,
.sadaa-input.is-success:focus,
.sadaa-textarea.is-success:focus,
.sadaa-select.is-success:focus {
  box-shadow: 0 0 0 3px rgba(6, 118, 71, .12);
}

.sadaa-field-message {
  margin: 0;
  font-size: var(--sadaa-font-size-xs, 12px);
  line-height: var(--sadaa-line-height-base, 1.7);
}

.sadaa-field-message--error {
  color: var(--sadaa-danger, #b42318);
}

.sadaa-field-message--success {
  color: var(--sadaa-success, #067647);
}

/* =========================================================
   Checkbox / Radio System — v1
   عناصر اختيار موحدة، مستقلة عن شكل المتصفح الافتراضي.
   ========================================================= */
.sadaa-choice {
  display: inline-flex;
  align-items: flex-start;
  gap: var(--sadaa-space-3, 8px);
  color: var(--sadaa-text-2, #374151);
  font-size: var(--sadaa-font-size-md, 14px);
  line-height: var(--sadaa-line-height-base, 1.7);
  cursor: pointer;
}

.sadaa-checkbox,
.sadaa-radio {
  -webkit-appearance: none;
  appearance: none;
  display: inline-block;
  width: 18px;
  height: 18px;
  min-width: 18px;
  margin: 3px 0 0;
  flex: 0 0 18px;
  border: 1px solid var(--sadaa-line-2, #d1d5db);
  background-color: var(--sadaa-surface, #fff);
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: none;
  cursor: pointer;
  vertical-align: middle;
  transition:
    border-color var(--sadaa-transition-fast, .15s ease),
    background-color var(--sadaa-transition-fast, .15s ease),
    box-shadow var(--sadaa-transition-fast, .15s ease);
}

.sadaa-checkbox {
  border-radius: 5px;
}

.sadaa-radio {
  border-radius: 50%;
}

.sadaa-checkbox:hover:not(:disabled),
.sadaa-radio:hover:not(:disabled) {
  border-color: var(--sadaa-primary);
}

.sadaa-checkbox:focus-visible,
.sadaa-radio:focus-visible {
  outline: none;
  border-color: var(--sadaa-primary);
  box-shadow: 0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb),.13));
}

.sadaa-checkbox:checked {
  border-color: var(--sadaa-primary);
  background-color: var(--sadaa-primary);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.2' d='M3.2 8.3 6.5 11.3 12.8 4.8'/%3E%3C/svg%3E");
  background-size: 13px 13px;
}

.sadaa-radio:checked {
  border-color: var(--sadaa-primary);
  background-color: var(--sadaa-surface, #fff);
  background-image: radial-gradient(circle at center, var(--sadaa-primary) 0 4px, transparent 4.5px);
}

.sadaa-checkbox:disabled,
.sadaa-radio:disabled,
.sadaa-checkbox[aria-disabled="true"],
.sadaa-radio[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .52;
  background-color: var(--sadaa-tint-3, #f3f4f6);
}

.sadaa-choice:has(.sadaa-checkbox:disabled),
.sadaa-choice:has(.sadaa-radio:disabled) {
  cursor: not-allowed;
  opacity: .72;
}

@media (max-width: 768px) {
  .sadaa-form-grid--2 {
    grid-template-columns: 1fr;
  }

  .sadaa-field--full {
    grid-column: auto;
  }
}

/* =========================================================
   Select System — v1.1
   غلاف موحد للقوائم المنسدلة مع سهم مستقل ومتوافق مع RTL/LTR.
   ========================================================= */
.sadaa-select-shell {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
}

.sadaa-select-shell::after {
  content: "";
  position: absolute;
  inset-inline-end: 15px;
  top: 50%;
  width: 7px;
  height: 7px;
  border: 0;
  border-right: 2px solid var(--sadaa-muted, #6b7280);
  border-bottom: 2px solid var(--sadaa-muted, #6b7280);
  transform: translateY(-68%) rotate(45deg);
  transform-origin: center;
  pointer-events: none;
  transition: border-color var(--sadaa-transition-base, 180ms ease);
}

.sadaa-select-shell:focus-within::after {
  border-color: var(--sadaa-primary);
}

.sadaa-select-shell:has(.sadaa-select:disabled)::after,
.sadaa-select-shell:has(.sadaa-select[aria-disabled="true"])::after {
  border-color: var(--sadaa-muted, #6b7280);
  opacity: .58;
}

.sadaa-select-shell .sadaa-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-inline-end: 42px;
  background-image: none;
}

.sadaa-select-shell .sadaa-select::-ms-expand {
  display: none;
}

.sadaa-select option {
  background: var(--sadaa-surface, #fff);
  color: var(--sadaa-text, #111827);
}


/* =========================================================
   Admin Form Controls / Toolbar — v1
   طبقة موحدة لحقول البحث والفلاتر داخل لوحة التحكم.
   لا تُطبّق إلا عند استخدام sadaa-controls--admin أو sadaa-control--admin.
   ========================================================= */
.sadaa-controls--admin .sadaa-input.sadaa-input,
.sadaa-controls--admin .sadaa-textarea.sadaa-textarea,
.sadaa-controls--admin .sadaa-select.sadaa-select,
.sadaa-input.sadaa-control--admin,
.sadaa-textarea.sadaa-control--admin,
.sadaa-select.sadaa-control--admin {
  border-color: var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  border-radius: var(--sadaa-radius-field, 8px) !important;
  background-color: var(--sadaa-surface, #fff) !important;
  color: var(--sadaa-admin-text, var(--sadaa-text, #111827)) !important;
}

/* أبعاد النماذج القياسية داخل لوحة التحكم؛ Toolbars تستثني نفسها أدناه. */
.sadaa-controls--admin .sadaa-input.sadaa-input,
.sadaa-controls--admin .sadaa-select.sadaa-select {
  width: 100% !important;
  min-height: var(--sadaa-control-lg, 46px) !important;
  padding: 9px 13px !important;
  font-size: var(--sadaa-font-size-md, 14px) !important;
}

.sadaa-controls--admin .sadaa-textarea.sadaa-textarea {
  width: 100% !important;
  min-height: 150px !important;
  padding: 11px 13px !important;
  font-size: var(--sadaa-font-size-md, 14px) !important;
}

/* عند استخدام الغلاف المركزي، نلغي سهم المتصفح/الصفحة القديمة بالكامل. */
.sadaa-controls--admin .sadaa-select-shell .sadaa-select.sadaa-select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  padding-inline-end: 42px !important;
  background-image: none !important;
  background-repeat: no-repeat !important;
}

.sadaa-controls--admin .sadaa-input.sadaa-input:hover:not(:disabled):not([readonly]),
.sadaa-controls--admin .sadaa-textarea.sadaa-textarea:hover:not(:disabled):not([readonly]),
.sadaa-controls--admin .sadaa-select.sadaa-select:hover:not(:disabled),
.sadaa-input.sadaa-control--admin:hover:not(:disabled):not([readonly]),
.sadaa-textarea.sadaa-control--admin:hover:not(:disabled):not([readonly]),
.sadaa-select.sadaa-control--admin:hover:not(:disabled) {
  border-color: var(--sadaa-admin-soft-line, var(--sadaa-line-3, #cbd5e1)) !important;
}

.sadaa-controls--admin .sadaa-input.sadaa-input:focus,
.sadaa-controls--admin .sadaa-textarea.sadaa-textarea:focus,
.sadaa-controls--admin .sadaa-select.sadaa-select:focus,
.sadaa-input.sadaa-control--admin:focus,
.sadaa-textarea.sadaa-control--admin:focus,
.sadaa-select.sadaa-control--admin:focus {
  border-color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  box-shadow: 0 0 0 3px rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .10) !important;
  outline: none !important;
}

.sadaa-controls--admin .sadaa-input.sadaa-input::placeholder,
.sadaa-controls--admin .sadaa-textarea.sadaa-textarea::placeholder,
.sadaa-input.sadaa-control--admin::placeholder,
.sadaa-textarea.sadaa-control--admin::placeholder {
  color: var(--sadaa-admin-muted, var(--sadaa-muted, #6b7280)) !important;
  opacity: .82;
}

/* المقاس الموحّد لأزرار Toolbars؛ يحافظ على محاذاتها مع الحقول. */
.sadaa-btn.sadaa-btn--toolbar {
  --sadaa-btn-height: 42px;
  min-height: 42px !important;
  height: 42px !important;
}

/* المقاس الموحّد لحقول البحث والفلاتر في Toolbars. */
.sadaa-input--toolbar,
.sadaa-select--toolbar,
.sadaa-controls--admin .sadaa-input.sadaa-input--toolbar,
.sadaa-controls--admin .sadaa-select.sadaa-select--toolbar {
  min-height: 42px !important;
  height: 42px !important;
  padding-block: 8px !important;
  border-radius: var(--sadaa-radius-field, 8px) !important;
  font-size: 13.5px !important;
  line-height: 1.4 !important;
}

/* حقل بحث بأيقونة داخلية، متوافق تلقائياً مع RTL/LTR. */
.sadaa-search-field {
  position: relative;
  display: block;
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  justify-self: stretch;
  align-self: stretch;
}

.sadaa-search-field__icon {
  position: absolute !important;
  top: 50% !important;
  z-index: 2;
  width: 16px;
  text-align: center;
  transform: translateY(-50%) !important;
  color: var(--sadaa-admin-muted, var(--sadaa-muted, #6b7280)) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

/*
 * لوحة التحكم عربية RTL؛ نستخدم جهة فعلية هنا بدل الخصائص المنطقية
 * لأن بعض الحقول القديمة تعيد تعريف direction/padding داخل التبويب.
 * هذا يضمن أن الأيقونة تبقى يميناً وأن النص يبدأ بعدها بمسافة ثابتة.
 */
.sadaa-controls--admin .sadaa-search-field__icon {
  right: 14px !important;
  left: auto !important;
  inset-inline-start: auto !important;
  inset-inline-end: auto !important;
  /* تحريك بصري ثابت 20px لليسار؛ لا يتأثر بقواعد right القديمة داخل التبويبات. */
  transform: translate(-20px, -50%) !important;
}

.sadaa-search-field > .sadaa-input,
.sadaa-search-field > input.sadaa-input {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  text-align: start;
}

.sadaa-controls--admin .sadaa-search-field > .sadaa-input,
.sadaa-controls--admin .sadaa-search-field > input.sadaa-input {
  padding-right: 48px !important;
  padding-left: 13px !important;
  padding-inline-start: 48px !important;
  padding-inline-end: 13px !important;
  direction: rtl !important;
}

/*
 * dashboard.css يحتوي قاعدة قديمة باسم .search-form تضيف padding:20px.
 * كل نموذج بحث انتقل للنظام المركزي يلغي هذه المسافة هنا حتى تتساوى
 * حوافه مع الفلاتر وبقية عناصر الـ Toolbar في جميع التبويبات.
 */
.sadaa-controls--admin form.sadaa-form.search-form,
.sadaa-controls--admin .sadaa-form.search-form {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Selects داخل Toolbars تستخدم سهم النظام المركزي فقط. */
.sadaa-select-shell .sadaa-select--toolbar {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  padding-inline-end: 40px !important;
  background-image: none !important;
  background-repeat: no-repeat !important;
}

.sadaa-controls--admin .sadaa-select-shell::after {
  border-right-color: var(--sadaa-admin-muted, var(--sadaa-muted, #6b7280));
  border-bottom-color: var(--sadaa-admin-muted, var(--sadaa-muted, #6b7280));
}

.sadaa-controls--admin .sadaa-select-shell:focus-within::after {
  border-right-color: var(--sadaa-admin-primary, var(--sadaa-primary));
  border-bottom-color: var(--sadaa-admin-primary, var(--sadaa-primary));
}

/* =========================================================
   Switch / Toggle System — v1.0
   مفاتيح تشغيل/إيقاف مركزية ومتوافقة مع RTL ولوحة الإدارة.
   البنية الأساسية:
   <label class="sadaa-switch sadaa-switch--admin">
     <input class="sadaa-switch__input" type="checkbox">
     <span class="sadaa-switch__track" aria-hidden="true"></span>
   </label>
   ========================================================= */
.sadaa-switch {
  --sadaa-switch-width: 42px;
  --sadaa-switch-height: 24px;
  --sadaa-switch-thumb: 16px;
  --sadaa-switch-pad: 3px;
  --sadaa-switch-travel: 18px;
  --sadaa-switch-accent: var(--sadaa-primary);
  --sadaa-switch-focus-rgb: var(--sadaa-primary-rgb);

  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  flex: 0 0 auto;
  vertical-align: middle;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.sadaa-switch--admin {
  --sadaa-switch-accent: var(--sadaa-admin-primary, var(--sadaa-primary));
  --sadaa-switch-focus-rgb: var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb));
}

.sadaa-switch--sm {
  --sadaa-switch-width: 36px;
  --sadaa-switch-height: 20px;
  --sadaa-switch-thumb: 14px;
  --sadaa-switch-pad: 3px;
  --sadaa-switch-travel: 16px;
}

.sadaa-switch--lg {
  --sadaa-switch-width: 70px;
  --sadaa-switch-height: 38px;
  --sadaa-switch-thumb: 28px;
  --sadaa-switch-pad: 5px;
  --sadaa-switch-travel: 32px;
}

.sadaa-switch__input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  opacity: 0 !important;
}

.sadaa-switch__track {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  width: var(--sadaa-switch-width);
  height: var(--sadaa-switch-height);
  flex: 0 0 var(--sadaa-switch-width);
  border: 1px solid var(--sadaa-line-3, #cbd5e1);
  border-radius: 999px;
  background: var(--sadaa-line-2, #e5e7eb);
  box-shadow: inset 0 1px 2px rgba(var(--sadaa-shadow-rgb, 17,24,39), .045);
  transition:
    background-color var(--sadaa-transition-fast, 160ms ease),
    border-color var(--sadaa-transition-fast, 160ms ease),
    box-shadow var(--sadaa-transition-fast, 160ms ease),
    opacity var(--sadaa-transition-fast, 160ms ease);
}

.sadaa-switch__track::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
  top: var(--sadaa-switch-pad);
  right: var(--sadaa-switch-pad);
  width: var(--sadaa-switch-thumb);
  height: var(--sadaa-switch-thumb);
  border-radius: 50%;
  background: #fff;
  border: 1px solid rgba(15,23,42,.06);
  box-shadow: 0 1px 4px rgba(var(--sadaa-shadow-rgb, 17,24,39), .18);
  transition:
    transform var(--sadaa-transition-fast, 160ms ease),
    border-color var(--sadaa-transition-fast, 160ms ease);
}

.sadaa-switch:hover .sadaa-switch__input:not(:disabled) + .sadaa-switch__track,
.sadaa-switch--button:hover:not(:disabled) > .sadaa-switch__track {
  border-color: var(--sadaa-switch-accent);
}

.sadaa-switch__input:checked + .sadaa-switch__track,
.sadaa-switch--button[aria-pressed="true"] > .sadaa-switch__track {
  background: var(--sadaa-switch-accent);
  border-color: var(--sadaa-switch-accent);
}

.sadaa-switch__input:checked + .sadaa-switch__track::after,
.sadaa-switch--button[aria-pressed="true"] > .sadaa-switch__track::after {
  transform: translateX(calc(-1 * var(--sadaa-switch-travel)));
}

.sadaa-switch__input:focus-visible + .sadaa-switch__track,
.sadaa-switch--button:focus-visible > .sadaa-switch__track {
  border-color: var(--sadaa-switch-accent);
  box-shadow: 0 0 0 3px rgba(var(--sadaa-switch-focus-rgb), .14);
  outline: none;
}

.sadaa-switch__input:disabled + .sadaa-switch__track,
.sadaa-switch--button:disabled > .sadaa-switch__track {
  opacity: .52;
  cursor: not-allowed;
}

.sadaa-switch:has(.sadaa-switch__input:disabled),
.sadaa-switch--button:disabled {
  cursor: not-allowed;
}

.sadaa-switch--button {
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  font: inherit;
  line-height: 1;
  box-shadow: none !important;
}

.sadaa-switch--button:hover:not(:disabled) {
  background: transparent !important;
  border-color: transparent !important;
}

.sadaa-switch--button:focus-visible {
  outline: none;
}

@media (prefers-reduced-motion: reduce) {
  .sadaa-switch__track,
  .sadaa-switch__track::after {
    transition: none;
  }
}

/* =========================================================
   Cards System — v1.0
   بطاقات صدى المتاجر المركزية
   ========================================================= */
.sadaa-card {
  min-width: 0;
  background: var(--sadaa-surface, #fff);
  color: var(--sadaa-text, #111827);
  border: var(--sadaa-border, 1px solid #e5e7eb);
  border-radius: var(--sadaa-radius-card, 12px);
  box-shadow: var(--sadaa-shadow-none, none);
}

/* بطاقة محتوى رئيسية للصفحات التعريفية والقانونية. */
.sadaa-card--content {
  padding: 34px 36px;
  box-shadow: 0 8px 20px rgba(var(--sadaa-shadow-rgb, 17,24,39), .055);
}

/* بطاقة مساحة عمل رئيسية للوحات العضو والإدارة.
   تحافظ على الزوايا الأصغر والمساحة الداخلية المستخدمة في لوحات البيانات. */
.sadaa-card--workspace {
  padding: var(--sadaa-space-7, 16px);
  border-color: var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface, #fff);
  box-shadow: none;
}

/* نسخة مرتفعة قليلًا لمساحات العمل التي تحتاج فصلًا بصريًا هادئًا. */
.sadaa-card--workspace-raised {
  box-shadow: 0 10px 24px rgba(var(--sadaa-shadow-rgb, 17,24,39), .04);
}

/* بطاقة داخلية هادئة داخل بطاقة أو قسم أكبر. */
.sadaa-card--soft {
  background: var(--sadaa-surface-alt, #fbfdfe);
  border-color: var(--sadaa-line, #e5e7eb);
  box-shadow: none;
}

/* بطاقة مرفوعة للحالات التي تحتاج فصلًا بصريًا أوضح. */
.sadaa-card--raised {
  box-shadow: var(--sadaa-shadow-md, 0 8px 20px rgba(17,24,39,.075));
}

/* بطاقة نماذج رئيسية؛ تحفظ المساحة الداخلية المستخدمة في صفحات النماذج. */
.sadaa-card--form {
  padding: 30px;
}


/* بطاقة تفاعلية قابلة للنقر أو مرتبطة بإجراء. */
.sadaa-card--interactive {
  transition:
    border-color var(--sadaa-transition-base, 180ms ease),
    background-color var(--sadaa-transition-base, 180ms ease),
    box-shadow var(--sadaa-transition-base, 180ms ease);
}

.sadaa-card--interactive:hover {
  border-color: var(--sadaa-line-3, var(--sadaa-line-2, #d1d5db));
  box-shadow: var(--sadaa-shadow-sm, 0 2px 8px rgba(17,24,39,.055));
}

.sadaa-card--compact {
  padding: var(--sadaa-space-7, 16px);
}

.sadaa-card--section {
  padding: var(--sadaa-space-10, 24px);
}

.sadaa-card__header,
.sadaa-card__body,
.sadaa-card__footer {
  min-width: 0;
}

.sadaa-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sadaa-space-5, 12px);
}

.sadaa-card__title {
  margin: 0;
  color: var(--sadaa-text, #111827);
  font-size: var(--sadaa-font-size-lg, 18px);
  font-weight: var(--sadaa-font-weight-semibold, 600);
  line-height: var(--sadaa-line-height-heading, 1.45);
}

.sadaa-card__footer {
  margin-top: var(--sadaa-space-7, 16px);
}


/* =========================================================
   Internal Cards — v1.3
   بطاقات فرعية ومؤشرات أداء للوحات العضو والإدارة.
   ========================================================= */
.sadaa-card--subsection {
  padding: 14px;
  border-color: var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface, #fff);
  box-shadow: none;
}

.sadaa-card--metric {
  position: relative;
  overflow: hidden;
  min-height: 116px;
  padding: 14px 14px 13px;
  border-color: var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface, #fff);
  box-shadow: none;
}

/* =========================================================
   Metric / Summary Cards — v1.0
   بطاقات الأرقام والملخصات في لوحات الإدارة والعضو.
   ========================================================= */
.sadaa-metric-grid {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.sadaa-metric-card {
  --sadaa-metric-accent: var(--sadaa-primary);
  --sadaa-metric-border: var(--sadaa-line, #e5e7eb);
  --sadaa-metric-soft: var(--sadaa-surface-alt, #f8fafc);
  --sadaa-metric-value: var(--sadaa-text, #111827);
  min-width: 0;
  border-color: var(--sadaa-metric-border);
}

.sadaa-metric-card--admin {
  --sadaa-metric-accent: var(--sadaa-admin-primary, var(--sadaa-primary));
  --sadaa-metric-border: var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb));
  --sadaa-metric-soft: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc));
  --sadaa-metric-value: var(--sadaa-admin-dark, var(--sadaa-text, #111827));
}

.sadaa-metric-card--compact {
  min-height: 0;
  padding: 12px 13px;
}

.sadaa-metric-card--lg {
  min-height: 125px;
  padding: 17px;
}

.sadaa-metric-card--accent,
.sadaa-metric-card--accent-top {
  position: relative;
  overflow: hidden;
}

.sadaa-metric-card--accent::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  width: 3px;
  background: var(--sadaa-metric-accent);
}

.sadaa-metric-card--accent-top::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-start: 0;
  height: 2px;
  background: var(--sadaa-metric-accent);
}

.sadaa-metric-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.sadaa-metric-card__label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  color: var(--sadaa-muted, #6b7280);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.6;
}

.sadaa-metric-card__label > i,
.sadaa-metric-card__label > svg {
  flex: 0 0 auto;
  color: var(--sadaa-metric-accent);
}

.sadaa-metric-card__icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: inline-grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--sadaa-metric-accent) 18%, var(--sadaa-metric-border));
  border-radius: 7px;
  background: color-mix(in srgb, var(--sadaa-metric-accent) 7%, #fff);
  color: var(--sadaa-metric-accent);
  font-size: 14px;
  line-height: 1;
}

.sadaa-metric-card__value {
  display: block;
  margin-top: 6px;
  color: var(--sadaa-metric-value);
  font-size: 21px;
  font-weight: 500;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.sadaa-metric-card--lg .sadaa-metric-card__value {
  margin-top: 15px;
  font-size: 30px;
  line-height: 1;
}

.sadaa-metric-card__note {
  margin-top: 4px;
  color: var(--sadaa-muted, #6b7280);
  font-size: 11.5px;
  line-height: 1.7;
}

.sadaa-metric-card--lg .sadaa-metric-card__note {
  margin-top: 8px;
}

@media (max-width: 768px) {
  .sadaa-metric-card--lg {
    min-height: 108px;
    padding: 14px;
  }

  .sadaa-metric-card--lg .sadaa-metric-card__value {
    font-size: 25px;
  }
}

@media (max-width: 768px) {
  .sadaa-card--content {
    padding: 24px 18px;
  }

  .sadaa-card--form {
    padding: 20px 16px;
  }
}

/* =========================================================
   Data Tables / Data Grids — v1.0
   أسطح البيانات والجداول المركزية في صدى المتاجر.
   تعمل مع <table> التقليدي أو CSS Grid المخصص للصفحات الإدارية.
   ========================================================= */
.sadaa-data-surface {
  min-width: 0;
  background: var(--sadaa-surface, #fff);
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  box-shadow: none;
}

.sadaa-data-surface--raised {
  box-shadow: var(--sadaa-shadow-sm, 0 2px 8px rgba(17,24,39,.055));
}

.sadaa-data-grid {
  width: 100%;
  min-width: 0;
}

.sadaa-data-head {
  background: var(--sadaa-tint-3, #f9fafb);
  color: var(--sadaa-text-2, #374151);
  border-bottom: 1px solid var(--sadaa-line, #e5e7eb);
}

.sadaa-data-row {
  background: var(--sadaa-surface, #fff);
  color: var(--sadaa-text, #111827);
  border-bottom: 1px solid var(--sadaa-line, #e5e7eb);
  transition: background-color var(--sadaa-transition-fast, 150ms ease);
}

.sadaa-data-row:last-child {
  border-bottom: 0;
}

.sadaa-data-cell {
  min-width: 0;
}

/* Admin data-surface tone */
.sadaa-data-surface--admin {
  border-color: var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb));
  background: var(--sadaa-surface, #fff);
}

.sadaa-data-surface--admin .sadaa-data-head {
  background: var(--sadaa-admin-soft, #f8fafc);
  color: var(--sadaa-admin-dark);
  border-bottom-color: var(--sadaa-admin-line, #e5e7eb);
}

.sadaa-data-surface--admin .sadaa-data-row:hover {
  background: #fbfdff;
}

/* Native <table> variant — same visual language as data grids */
.sadaa-data-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--sadaa-surface, #fff);
  color: var(--sadaa-text, #111827);
}

.sadaa-data-table th,
.sadaa-data-table td {
  padding: 11px 10px;
  border-bottom: 1px solid var(--sadaa-line-soft, #eef1f5);
  color: var(--sadaa-text-2, #374151);
  font-size: var(--sadaa-font-size-sm, 13px);
  line-height: 1.6;
  vertical-align: middle;
}

.sadaa-data-table th {
  min-height: 44px;
  background: var(--sadaa-tint-3, #f9fafb);
  color: var(--sadaa-text-2, #374151);
  font-weight: var(--sadaa-font-weight-medium, 500);
  white-space: nowrap;
}

.sadaa-data-table tbody tr {
  background: var(--sadaa-surface, #fff);
  transition: background-color var(--sadaa-transition-fast, 150ms ease);
}

.sadaa-data-table tbody tr:hover {
  background: var(--sadaa-data-row-hover, #fbfdff);
}

.sadaa-data-table tbody tr:last-child td {
  border-bottom: 0;
}

.sadaa-data-table--center th,
.sadaa-data-table--center td {
  text-align: center;
}

.sadaa-data-table--admin {
  --sadaa-data-row-hover: #fbfdff;
}

.sadaa-data-table--admin th {
  background: var(--sadaa-admin-soft, #f8fafc);
  color: var(--sadaa-admin-dark);
  border-bottom-color: var(--sadaa-admin-line, #e5e7eb);
}

/* =========================================================
   Empty State — v1.0
   حالة فارغة موحدة للجداول والقوائم والبطاقات.
   ========================================================= */
.sadaa-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sadaa-space-3, 8px);
  min-width: 0;
  text-align: center;
  color: var(--sadaa-muted, #6b7280);
}

.sadaa-empty-state__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-tint-3, #f3f4f6);
  color: var(--sadaa-muted, #6b7280);
  font-size: 16px;
}

.sadaa-empty-state__title {
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-weight: 700;
  line-height: inherit;
}

.sadaa-empty-state__text {
  margin: 0;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

.sadaa-empty-state--section {
  padding: var(--sadaa-space-10, 24px);
}

.sadaa-empty-state--compact {
  padding: var(--sadaa-space-7, 16px);
}

/* =========================================================
   Page Headers — v1.0
   رؤوس الصفحات والتبويبات المركزية في صدى المتاجر.
   الخلفية/الزخارف تبقى للصفحة أو نوع اللوحة، بينما الهيكل
   والمسافات والعنوان والوصف والمعلومة الجانبية موحدة هنا.
   ========================================================= */
.sadaa-page-header {
  position: relative;
  overflow: hidden;
  margin: 0 0 14px;
  border: 0;
  border-radius: var(--sadaa-radius-md, 8px);
  color: #fff;
}

.sadaa-page-header__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sadaa-space-4, 16px);
  width: 100%;
  min-width: 0;
}

.sadaa-page-header__main {
  display: flex;
  align-items: center;
  gap: var(--sadaa-space-3, 12px);
  flex: 1 1 auto;
  min-width: 0;
}

.sadaa-page-header__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  min-width: 42px;
  flex: 0 0 42px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: var(--sadaa-radius-md, 8px);
  background: rgba(255,255,255,.16);
  color: #fff;
  font-size: var(--sadaa-icon-sm, 16px);
}

.sadaa-page-header__content {
  flex: 1 1 auto;
  min-width: 0;
}

.sadaa-page-header__eyebrow {
  display: block;
  margin: 0 0 2px;
  color: rgba(255,255,255,.72);
  font-size: var(--sadaa-font-size-xs, 12px);
  line-height: 1.5;
}

.sadaa-page-header__title {
  margin: 0;
  color: #fff;
  font-size: var(--sadaa-font-size-xl, 20px);
  font-weight: var(--sadaa-font-weight-medium, 500);
  line-height: 1.5;
}

.sadaa-page-header__description {
  margin: 3px 0 0;
  max-width: 720px;
  color: rgba(255,255,255,.84);
  font-size: var(--sadaa-font-size-sm, 13px);
  line-height: 1.8;
}

.sadaa-page-header__actions {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: var(--sadaa-space-2, 8px);
  flex: 0 0 auto;
  flex-wrap: wrap;
}

.sadaa-page-header__meta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: var(--sadaa-radius-md, 8px);
  background: rgba(255,255,255,.13);
  color: #fff;
  font-size: var(--sadaa-font-size-sm, 13px);
  line-height: 1.4;
  white-space: nowrap;
}

/* المسافات الفعلية المعتمدة في لوحة العضو. */
.sadaa-page-header--member {
  padding: 18px 20px;
}

/* المسافات والرفع المعتمدان حاليًا في رؤوس لوحة الإدارة. */
.sadaa-page-header--admin {
  padding: 22px 24px;
  box-shadow: 0 10px 26px rgba(var(--sadaa-admin-dark-rgb), .09);
}

.sadaa-page-header--admin .sadaa-page-header__meta {
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 7px;
}

@media (max-width: 768px) {
  .sadaa-page-header--admin {
    padding: 18px;
  }
}

@media (max-width: 720px) {
  .sadaa-page-header--admin .sadaa-page-header__icon {
    width: 34px;
    height: 34px;
    min-width: 34px;
    flex-basis: 34px;
    border-radius: 7px;
    font-size: 14px;
  }

  .sadaa-page-header--admin .sadaa-page-header__title {
    font-size: 17px;
    line-height: 1.4;
  }

  .sadaa-page-header--admin .sadaa-page-header__description {
    font-size: 12px;
    line-height: 1.6;
  }
}

@media (max-width: 640px) {
  .sadaa-page-header--member {
    padding: 16px;
  }

  .sadaa-page-header--member .sadaa-page-header__inner {
    align-items: flex-start;
    flex-direction: column;
  }

  .sadaa-page-header--member .sadaa-page-header__meta {
    width: 100%;
  }
}


/* =========================================================
   Badges / Status Pills — v1.0
   الشارات والحالات الدلالية المركزية في صدى المتاجر.
   Badges للمعلومات الصغيرة، وStatus Pills لحالات الطلبات والخدمات.
   ========================================================= */
.sadaa-badge,
.sadaa-status {
  display: grid;
  place-items: center;
  padding: 0;
  line-height: 1;
  box-sizing: border-box;
  border: 1px solid transparent;
  font-family: inherit;
  line-height: 1.35;
  white-space: nowrap;
  vertical-align: middle;
}

.sadaa-badge > i,
.sadaa-status > i,
.sadaa-badge > svg,
.sadaa-status > svg {
  flex: 0 0 auto;
}

/* Badge: معلومة قصيرة مثل مميز / جديد / عدد / تصنيف. */
.sadaa-badge {
  gap: 5px;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: var(--sadaa-radius-pill, 999px);
  font-size: var(--sadaa-font-size-xs, 12px);
  font-weight: var(--sadaa-font-weight-medium, 500);
}

.sadaa-badge--brand {
  background: var(--sadaa-tint, #f5f2f8);
  color: var(--sadaa-primary-dark);
  border-color: var(--sadaa-line-2, #e7deed);
}

.sadaa-badge--neutral {
  background: #f3f4f6;
  color: #4b5563;
  border-color: #d1d5db;
}

.sadaa-badge--success {
  background: #ecfdf3;
  color: #166534;
  border-color: #bbf7d0;
}

.sadaa-badge--warning {
  background: #fffbeb;
  color: #92400e;
  border-color: #fde68a;
}

.sadaa-badge--danger {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

.sadaa-badge--info {
  background: #eff6ff;
  color: #1d4ed8;
  border-color: #bfdbfe;
}

/* Status Pill: الحالة التشغيلية/الدفعية. */
.sadaa-status {
  gap: 6px;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 400;
}

/* حالات عامة قابلة لإعادة الاستخدام. */
.sadaa-status--success,
.sadaa-status--active {
  background: #ecfdf3;
  color: #166534;
  border-color: #bbf7d0;
}

.sadaa-status--review,
.sadaa-status--scheduled,
.sadaa-status--payment-review {
  background: #f5f3ff;
  color: #6d28d9;
  border-color: #ddd6fe;
}

.sadaa-status--warning,
.sadaa-status--expired {
  background: #fffbeb;
  color: #92400e;
  border-color: #fde68a;
}

.sadaa-status--pending {
  background: #fffbeb;
  color: #a16207;
  border-color: #fde68a;
}

.sadaa-status--neutral,
.sadaa-status--inactive,
.sadaa-status--cancelled {
  background: var(--sadaa-admin-soft, #f3f4f6);
  color: var(--sadaa-admin-dark);
  border-color: var(--sadaa-admin-soft-line, #d1d5db);
}

.sadaa-status--info,
.sadaa-status--refunded,
.sadaa-status--refund-pending {
  background: #eff6ff;
  color: #1d4ed8;
  border-color: #bfdbfe;
}

.sadaa-status--payment-pending {
  background: #fff7ed;
  color: #c2410c;
  border-color: #fed7aa;
}

.sadaa-status--danger,
.sadaa-status--payment-failed {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

.sadaa-status--payment-expired {
  background: #f3f4f6;
  color: #4b5563;
  border-color: #d1d5db;
}

.sadaa-status--refund-failed,
.sadaa-status--compact {
  min-height: 20px;
  padding: 2px 7px;
  font-size: 11px;
}

.sadaa-status--refund-failed {
  background: #fff7ed;
  color: #b45309;
  border-color: #fed7aa;
}

@media (max-width: 720px) {
  .sadaa-status {
    min-height: 25px;
    border-radius: 7px;
    font-size: 11px;
  }

  .sadaa-status--refund-failed,
  .sadaa-status--compact {
    min-height: 20px;
    padding: 2px 7px;
    font-size: 11px;
  }
}

/* =========================================================
   Alerts — v1.0
   تنبيهات النجاح والخطأ والتحذير والمعلومة.
   ========================================================= */
/* =========================================================
   Alert stack
   يجمع التنبيهات المتتالية بمسافة داخلية موحدة،
   مع إبقاء المسافة بعد آخر تنبيه وقبل المحتوى التالي.
   ========================================================= */
.sadaa-alert-stack {
  display: grid;
  gap: 8px;
  margin: 0 0 18px;
}

.sadaa-alert-stack > .sadaa-alert {
  margin-bottom: 0;
}

.sadaa-alert {
  width: 100%;
  box-sizing: border-box;
  margin: 0 0 18px;
  padding: 13px 15px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: var(--sadaa-radius-field, 8px);
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
  text-align: start;
}

.sadaa-alert__icon {
  width: 18px;
  min-width: 18px;
  margin-top: .22em;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
}

.sadaa-alert__body {
  flex: 1 1 auto;
  min-width: 0;
}

.sadaa-alert ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sadaa-alert li {
  margin: 0;
}

.sadaa-alert li + li {
  margin-top: 4px;
}

.sadaa-alert a {
  color: inherit;
  font-weight: 600;
  text-underline-offset: 3px;
}

.sadaa-alert--success {
  background: #ecfdf3;
  border-color: #bbf7d0;
  color: #166534;
}

.sadaa-alert--error,
.sadaa-alert--danger {
  background: #fff1f2;
  border-color: #fecdd3;
  color: #9f1239;
}

.sadaa-alert--warning {
  background: #fff8f1;
  border-color: #fed7aa;
  color: #9a3412;
}

.sadaa-alert--info {
  background: #f4f9fd;
  border-color: var(--sadaa-admin-soft-line, #cfe3f3);
  color: #285477;
}

.sadaa-alert--compact {
  margin-bottom: 16px;
  padding: 11px 13px;
  border-radius: 7px;
  font-weight: 500;
}

/* =========================================================
   Pagination — v1.0
   ترقيم صفحات مركزي للمناطق العامة ولوحات العضو والإدارة.
   ========================================================= */
.sadaa-pagination {
  --sadaa-pagination-active-bg: var(--sadaa-primary);
  --sadaa-pagination-active-border: var(--sadaa-primary);
  --sadaa-pagination-active-color: #ffffff;
  --sadaa-pagination-hover-bg: var(--sadaa-tint-3, #f8fafc);
  --sadaa-pagination-hover-border: var(--sadaa-line-3, #cbd5e1);
  --sadaa-pagination-hover-color: var(--sadaa-primary-dark);

  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px;
  margin: 20px 0 0;
}

.sadaa-pagination--dark {
  --sadaa-pagination-active-bg: #111827;
  --sadaa-pagination-active-border: #111827;
  --sadaa-pagination-hover-color: #111827;
}

.sadaa-pagination--admin {
  --sadaa-pagination-active-bg: var(--sadaa-admin-primary);
  --sadaa-pagination-active-border: var(--sadaa-admin-primary);
  --sadaa-pagination-hover-bg: var(--sadaa-admin-soft);
  --sadaa-pagination-hover-border: var(--sadaa-admin-soft-line);
  --sadaa-pagination-hover-color: var(--sadaa-admin-dark);
}

.sadaa-pagination__item,
.sadaa-pagination__gap {
  min-width: 34px;
  min-height: 34px;
  box-sizing: border-box;
  padding: 7px 10px;
  border: 1px solid var(--sadaa-line, #d1d5db);
  border-radius: 7px;
  background: var(--sadaa-surface, #ffffff);
  color: var(--sadaa-text-2, #374151);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background-color var(--sadaa-transition-fast, .15s ease),
    border-color var(--sadaa-transition-fast, .15s ease),
    color var(--sadaa-transition-fast, .15s ease),
    box-shadow var(--sadaa-transition-fast, .15s ease);
}

.sadaa-pagination__item:hover,
.sadaa-pagination__item:focus-visible {
  background: var(--sadaa-pagination-hover-bg);
  border-color: var(--sadaa-pagination-hover-border);
  color: var(--sadaa-pagination-hover-color);
  outline: none;
}

.sadaa-pagination__item:focus-visible {
  box-shadow: 0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb),.14));
}

.sadaa-pagination__item.active,
.sadaa-pagination__item[aria-current="page"] {
  background: var(--sadaa-pagination-active-bg);
  border-color: var(--sadaa-pagination-active-border);
  color: var(--sadaa-pagination-active-color);
  font-weight: 500;
  pointer-events: none;
}

.sadaa-pagination__item.disabled,
.sadaa-pagination__item[aria-disabled="true"] {
  opacity: .45;
  pointer-events: none;
}

.sadaa-pagination__gap {
  border-color: transparent;
  background: transparent;
  color: var(--sadaa-muted, #6b7280);
  padding-inline: 5px;
}

@media (max-width: 720px) {
  .sadaa-pagination {
    gap: 4px;
    margin-top: 14px;
  }

  .sadaa-pagination__item,
  .sadaa-pagination__gap {
    min-width: 30px;
    min-height: 30px;
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 12px;
  }
}

/* =========================================================
   Tabs / Sub-navigation — v1.0
   تبويبات داخلية قابلة لإعادة الاستخدام مع استجابة موحدة.
   ========================================================= */
.sadaa-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
}

.sadaa-tab {
  min-width: 0;
  min-height: 36px;
  box-sizing: border-box;
  padding: 7px 10px;
  border: 1px solid var(--sadaa-line, #d1d5db);
  border-radius: 7px;
  background: var(--sadaa-surface, #ffffff);
  color: var(--sadaa-text-2, #374151);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  text-align: center;
  white-space: nowrap;
  transition:
    background-color var(--sadaa-transition-fast, .15s ease),
    border-color var(--sadaa-transition-fast, .15s ease),
    color var(--sadaa-transition-fast, .15s ease),
    box-shadow var(--sadaa-transition-fast, .15s ease);
}

.sadaa-tab:hover,
.sadaa-tab:focus-visible {
  background: var(--sadaa-tint-3, #f9fafb);
  border-color: var(--sadaa-line-3, #9ca3af);
  color: var(--sadaa-text, #111827);
  outline: none;
}

.sadaa-tab:focus-visible {
  box-shadow: 0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb),.14));
}

.sadaa-tab.active,
.sadaa-tab[aria-current="page"],
.sadaa-tab[aria-selected="true"] {
  background: var(--sadaa-tint-2, #f3f4f6);
  border-color: var(--sadaa-line-3, #9ca3af);
  color: var(--sadaa-text, #111827);
  font-weight: 500;
}

.sadaa-tabs--admin .sadaa-tab:hover,
.sadaa-tabs--admin .sadaa-tab:focus-visible,
.sadaa-tabs--admin .sadaa-tab.active,
.sadaa-tabs--admin .sadaa-tab[aria-current="page"],
.sadaa-tabs--admin .sadaa-tab[aria-selected="true"] {
  background: var(--sadaa-admin-soft);
  border-color: var(--sadaa-admin-soft-line);
  color: var(--sadaa-admin-dark);
}

.sadaa-tabs--admin .sadaa-tab:hover i,
.sadaa-tabs--admin .sadaa-tab:focus-visible i,
.sadaa-tabs--admin .sadaa-tab.active i,
.sadaa-tabs--admin .sadaa-tab[aria-current="page"] i,
.sadaa-tabs--admin .sadaa-tab[aria-selected="true"] i {
  color: var(--sadaa-admin-primary);
}

@media (max-width: 900px) {
  .sadaa-tabs--responsive {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .sadaa-tabs--responsive {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sadaa-tab {
    width: 100%;
    min-height: 34px;
    padding: 7px 8px;
    font-size: 12.5px;
  }
}


/* =========================================================
   Sadaa Design System — Navigation Controls v1
   Side navigation + nested navigation + mobile toggle
   ========================================================= */
.sadaa-nav-stack {
  display:flex;
  flex-direction:column;
  gap:2px;
}

.sadaa-nav-item {
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  min-height:42px;
  margin:0;
  padding:6px 9px;
  border:1px solid transparent;
  border-radius:7px;
  background:var(--sadaa-surface, #fff);
  color:#3c566c;
  text-align:right;
  text-decoration:none;
  cursor:pointer;
  font-family:var(--site-font-family, inherit);
  font-size:14px;
  font-weight:400;
  line-height:1.5;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}

.sadaa-nav-item::after {
  content:"";
  position:absolute;
  inset-inline-end:-1px;
  top:9px;
  bottom:9px;
  width:3px;
  border-radius:3px 0 0 3px;
  background:transparent;
}

.sadaa-nav-item > i,
.sadaa-nav-item__icon {
  width:31px;
  min-width:31px;
  height:31px;
  margin:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#7893a8;
  background:#f4f8fb;
  border:1px solid #e4edf4;
  border-radius:6px;
  text-align:center;
  font-size:6px;
  line-height:1;
  transition:inherit;
}

.sadaa-nav-item:hover,
.sadaa-nav-item:focus-visible {
  background:#f8fbfd;
  border-color:#e3edf4;
  color:var(--sadaa-admin-dark, var(--sadaa-primary-dark));
  transform:translateX(-2px);
  outline:none;
}

.sadaa-nav-item:hover > i,
.sadaa-nav-item:focus-visible > i,
.sadaa-nav-item:hover .sadaa-nav-item__icon,
.sadaa-nav-item:focus-visible .sadaa-nav-item__icon {
  color:var(--sadaa-admin-primary, var(--sadaa-primary));
  background:var(--sadaa-admin-soft, var(--sadaa-tint));
  border-color:var(--sadaa-admin-soft-line, var(--sadaa-line-2));
}

.sadaa-nav-item.active,
.sadaa-nav-item[aria-current="page"] {
  background:var(--sadaa-admin-soft, var(--sadaa-tint));
  border-color:var(--sadaa-admin-soft-line, var(--sadaa-line-2));
  color:var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
}

.sadaa-nav-item.active::after,
.sadaa-nav-item[aria-current="page"]::after {
  background:var(--sadaa-admin-primary, var(--sadaa-primary));
}

.sadaa-nav-item.active > i,
.sadaa-nav-item[aria-current="page"] > i,
.sadaa-nav-item.active .sadaa-nav-item__icon,
.sadaa-nav-item[aria-current="page"] .sadaa-nav-item__icon {
  color:#fff;
  background:var(--sadaa-admin-primary, var(--sadaa-primary));
  border-color:var(--sadaa-admin-primary, var(--sadaa-primary));
}

.sadaa-nav-item--has-children {
  padding-inline-end:42px !important;
}

.sadaa-nav-item--has-children .sadaa-nav-chevron {
  position:absolute;
  inset-inline-end:10px;
  top:50%;
  width:22px;
  min-width:22px;
  height:22px;
  margin:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 22px;
  color:var(--sadaa-muted, #6b7280);
  background:transparent;
  border:0;
  border-radius:6px;
  font-size:10px;
  line-height:1;
  transform:translateY(-50%);
  transition:transform .18s ease,color .18s ease,background-color .18s ease;
}

.sadaa-nav-item--has-children .sadaa-nav-chevron > i {
  width:auto;
  min-width:0;
  height:auto;
  margin:0;
  padding:0;
  display:block;
  color:inherit;
  background:transparent;
  border:0;
  border-radius:0;
  font-size:10px;
  line-height:1;
}

.sadaa-nav-item--has-children[aria-expanded="true"] .sadaa-nav-chevron {
  transform:translateY(-50%) rotate(-90deg);
  color:var(--sadaa-admin-primary, var(--sadaa-primary));
}

.sadaa-nav-item--has-children:hover .sadaa-nav-chevron,
.sadaa-nav-item--has-children:focus-visible .sadaa-nav-chevron,
.sadaa-nav-item--has-children.active .sadaa-nav-chevron {
  color:var(--sadaa-admin-primary, var(--sadaa-primary));
}

.sadaa-subnav {
  margin-top:4px;
  padding:4px 8px 2px 0;
  border-inline-start:1px solid var(--sadaa-admin-line, #e3edf4);
}

.sadaa-subnav__item {
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  min-height:36px;
  margin:4px 0;
  padding:7px 10px;
  border:1px solid transparent;
  border-radius:6px;
  background:transparent;
  color:#60778b;
  text-align:right;
  text-decoration:none;
  font-size:13px;
  font-weight:400;
  line-height:1.5;
  transition:background .16s ease,border-color .16s ease,color .16s ease;
}

.sadaa-subnav__item > i {
  width:16px;
  min-width:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#7893a8;
  text-align:center;
  font-size:11px;
  line-height:1;
}

.sadaa-subnav__item:hover,
.sadaa-subnav__item:focus-visible {
  color:var(--sadaa-admin-dark, var(--sadaa-primary-dark));
  background:#f7fafc;
  border-color:#e4edf4;
  outline:none;
}

.sadaa-subnav__item:hover > i,
.sadaa-subnav__item:focus-visible > i,
.sadaa-subnav__item.active > i,
.sadaa-subnav__item[aria-current="page"] > i {
  color:var(--sadaa-admin-primary, var(--sadaa-primary));
}

.sadaa-subnav__item.active,
.sadaa-subnav__item[aria-current="page"] {
  color:var(--sadaa-admin-dark, var(--sadaa-primary-dark));
  background:var(--sadaa-admin-soft, var(--sadaa-tint));
  border-color:var(--sadaa-admin-soft-line, var(--sadaa-line-2));
}

.sadaa-nav-toggle {
  display:none;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  min-height:46px;
  margin:0 0 10px;
  padding:9px 12px;
  background:var(--sadaa-surface, #fff);
  border:1px solid var(--sadaa-admin-line, var(--sadaa-line));
  border-radius:7px;
  color:var(--sadaa-admin-dark, var(--sadaa-text));
  cursor:pointer;
  font-family:var(--site-font-family, inherit);
  font-size:14px;
  font-weight:400;
  box-shadow:0 8px 20px rgba(var(--sadaa-admin-dark-rgb), .035);
}

.sadaa-nav-toggle > i {
  width:30px;
  height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:6px;
  color:#fff;
  background:var(--sadaa-admin-primary, var(--sadaa-primary));
  font-size:13px;
}

@media (max-width:1100px) {
  .sadaa-nav-toggle--tablet { display:flex; }
}

@media (max-width:768px) {
  .sadaa-nav-toggle { display:flex; }
  .sadaa-nav-stack { gap:1px; }
  .sadaa-nav-item {
    min-height:40px;
    padding:5px 8px;
    font-size:13.5px;
  }
  .sadaa-nav-item:hover,
  .sadaa-nav-item:focus-visible { transform:none; }
}

/* =========================================================
   Sadaa Design System — Dropdown / Action Menus v1
   Reusable compact action menus. Position/open state stays
   owned by the consuming page so existing JS/HTML is safe.
   ========================================================= */
.sadaa-menu-trigger {
  width:34px;
  min-width:34px;
  height:34px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--sadaa-line, #e5e7eb);
  border-radius:7px;
  background:var(--sadaa-surface, #fff);
  color:var(--sadaa-muted, #4b5563);
  cursor:pointer;
  font-family:var(--site-font-family, inherit);
  font-size:14px;
  line-height:1;
  list-style:none;
  text-decoration:none;
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease;
}

summary.sadaa-menu-trigger::-webkit-details-marker { display:none; }

.sadaa-menu-trigger:hover,
.sadaa-menu-trigger:focus-visible,
.sadaa-menu-trigger.active,
[open] > .sadaa-menu-trigger {
  background:rgba(var(--sadaa-primary-rgb), .11);
  border-color:rgba(var(--sadaa-primary-rgb), .34);
  color:var(--sadaa-primary-dark, var(--sadaa-primary));
  outline:none;
}

.sadaa-menu-trigger:focus-visible {
  box-shadow:0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb),.14));
}

.sadaa-menu-trigger--sm {
  width:32px;
  min-width:32px;
  height:32px;
}

.sadaa-menu-trigger--admin:hover,
.sadaa-menu-trigger--admin:focus-visible,
.sadaa-menu-trigger--admin.active,
[open] > .sadaa-menu-trigger--admin {
  background:rgba(var(--sadaa-primary-rgb), .11);
  border-color:rgba(var(--sadaa-primary-rgb), .34);
  color:var(--sadaa-primary-dark, var(--sadaa-primary));
}

.sadaa-menu {
  min-width:168px;
  padding:6px;
  border:1px solid var(--sadaa-line, #e5e7eb);
  border-radius:8px;
  background:var(--sadaa-surface, #fff);
  color:var(--sadaa-text, #1f2937);
  box-shadow:0 12px 26px rgba(var(--sadaa-shadow-rgb, 17,24,39), .12);
  direction:rtl;
  text-align:right;
}

.sadaa-menu--compact { min-width:154px; }
.sadaa-menu--wide { min-width:180px; }

.sadaa-menu__item {
  width:100%;
  min-height:36px;
  margin:0;
  padding:8px 9px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:#374151;
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  font-family:var(--site-font-family, inherit);
  font-size:13px;
  font-weight:400;
  line-height:1.45;
  text-align:right;
  text-decoration:none;
  white-space:nowrap;
  transition:background .14s ease,color .14s ease;
}

.sadaa-menu__item > i {
  width:16px;
  min-width:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.sadaa-menu__item:hover,
.sadaa-menu__item:focus-visible {
  background:rgba(var(--sadaa-primary-rgb), .12);
  color:var(--sadaa-primary-dark, var(--sadaa-primary));
  outline:none;
}

.sadaa-menu--admin .sadaa-menu__item:hover,
.sadaa-menu--admin .sadaa-menu__item:focus-visible {
  background:rgba(var(--sadaa-primary-rgb), .12);
  color:var(--sadaa-primary-dark, var(--sadaa-primary));
}

.sadaa-menu__item--danger,
.sadaa-menu__item--danger > i {
  color:#991b1b;
}

.sadaa-menu__item--danger:hover,
.sadaa-menu__item--danger:focus-visible {
  background:#fef2f2;
  color:#991b1b;
}

.sadaa-menu__divider {
  height:1px;
  margin:5px 4px;
  background:var(--sadaa-line, #e5e7eb);
}



/* Dropdown / Action Menus — migration hardening
   يجعل المكوّن المركزي هو المرجع البصري حتى مع بقاء CSS محلي قديم
   مسؤول فقط عن الشكل؛ التموضع وحالة الفتح تبقى للصفحة المستهلكة. */
.sadaa-menu-trigger {
  width:34px !important;
  min-width:34px !important;
  height:34px !important;
  padding:0 !important;
  border:1px solid var(--sadaa-line, #e5e7eb) !important;
  border-radius:7px !important;
  background:var(--sadaa-surface, #fff) !important;
  color:var(--sadaa-muted, #4b5563) !important;
  font-size:14px !important;
  line-height:1 !important;
  box-shadow:none !important;
}

.sadaa-menu-trigger:hover,
.sadaa-menu-trigger:focus-visible,
.sadaa-menu-trigger.active,
.sadaa-menu-trigger.is-open,
[open] > .sadaa-menu-trigger {
  background:rgba(var(--sadaa-primary-rgb), .11) !important;
  border-color:rgba(var(--sadaa-primary-rgb), .34) !important;
  color:var(--sadaa-primary-dark, var(--sadaa-primary)) !important;
}

.sadaa-menu-trigger--admin:hover,
.sadaa-menu-trigger--admin:focus-visible,
.sadaa-menu-trigger--admin.active,
.sadaa-menu-trigger--admin.is-open,
[open] > .sadaa-menu-trigger--admin {
  background:rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .11) !important;
  border-color:rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .34) !important;
  color:var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
}

.sadaa-menu {
  min-width:168px !important;
  padding:6px !important;
  border:1px solid var(--sadaa-line, #e5e7eb) !important;
  border-radius:8px !important;
  background:var(--sadaa-surface, #fff) !important;
  color:var(--sadaa-text, #1f2937) !important;
  box-shadow:0 12px 26px rgba(var(--sadaa-shadow-rgb, 17,24,39), .12) !important;
  direction:rtl !important;
  text-align:right !important;
}

.sadaa-menu--compact { min-width:154px !important; }
.sadaa-menu--wide { min-width:180px !important; }
.sadaa-menu::before { content:none !important; display:none !important; }

.sadaa-menu__item {
  width:100% !important;
  min-height:36px !important;
  margin:0 !important;
  padding:8px 9px !important;
  border:0 !important;
  border-radius:6px !important;
  background:transparent !important;
  color:#374151 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  font-family:var(--site-font-family, inherit) !important;
  font-size:13px !important;
  font-weight:400 !important;
  line-height:1.45 !important;
  text-align:right !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

.sadaa-menu__item:hover,
.sadaa-menu__item:focus-visible {
  background:rgba(var(--sadaa-primary-rgb), .12) !important;
  color:var(--sadaa-primary-dark, var(--sadaa-primary)) !important;
}

.sadaa-menu--admin .sadaa-menu__item:hover,
.sadaa-menu--admin .sadaa-menu__item:focus-visible {
  background:rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .12) !important;
  color:var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
}

.sadaa-menu__item--danger,
.sadaa-menu__item--danger > i {
  color:#991b1b !important;
}

.sadaa-menu__item--danger:hover,
.sadaa-menu__item--danger:focus-visible {
  background:#fef2f2 !important;
  color:#991b1b !important;
}

.sadaa-menu__item.is-disabled,
.sadaa-menu__item:disabled,
.sadaa-menu__item[aria-disabled="true"] {
  color:#9ca3af !important;
  background:transparent !important;
  opacity:.68 !important;
  cursor:not-allowed !important;
  pointer-events:none;
}

.sadaa-menu__divider {
  height:1px !important;
  margin:5px 4px !important;
  background:var(--sadaa-line, #e5e7eb) !important;
}

@media (max-width:720px) {
  .sadaa-menu-trigger {
    width:38px !important;
    min-width:38px !important;
    height:38px !important;
  }
}


/* =========================================================
   Sadaa Design System — Modals / Dialogs v1
   طبقة مركزية للنوافذ المنبثقة بدون ربط منطق الفتح والإغلاق
   ========================================================= */
.sadaa-modal {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: var(--sadaa-space-5, 20px);
  isolation: isolate;
}

.sadaa-modal.is-open,
.sadaa-modal[aria-hidden="false"].is-open {
  display: flex;
}

.sadaa-modal__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: rgba(17, 24, 39, .45);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.sadaa-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(560px, 100%);
  max-height: calc(100dvh - 40px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-lg, 12px);
  background: var(--sadaa-surface, #ffffff);
  color: var(--sadaa-text, #111827);
  box-shadow: var(--sadaa-shadow-xl, 0 18px 42px rgba(17,24,39,.14));
}

.sadaa-modal__dialog--sm { width: min(420px, 100%); }
.sadaa-modal__dialog--md { width: min(560px, 100%); }
.sadaa-modal__dialog--lg { width: min(760px, 100%); }
.sadaa-modal__dialog--xl { width: min(960px, 100%); }

.sadaa-modal__header {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sadaa-space-3, 12px);
  padding: 15px var(--sadaa-space-4, 16px);
  border-bottom: 1px solid var(--sadaa-line, #e5e7eb);
  background: var(--sadaa-surface-alt, #fbfdfe);
}

.sadaa-modal__heading {
  min-width: 0;
  flex: 1 1 auto;
}

.sadaa-modal__title {
  margin: 0;
  color: var(--sadaa-text, #111827);
  font-size: var(--sadaa-font-size-base, 16px);
  font-weight: var(--sadaa-font-weight-medium, 500);
  line-height: 1.5;
}

.sadaa-modal__subtitle {
  margin: 3px 0 0;
  color: var(--sadaa-muted, #6b7280);
  font-size: var(--sadaa-font-size-xs, 12px);
  line-height: 1.7;
}

.sadaa-modal__close {
  width: 34px;
  height: 34px;
  min-width: 34px;
  flex: 0 0 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--sadaa-line-2, #d1d5db);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface, #ffffff);
  color: var(--sadaa-text-2, #4b5563);
  cursor: pointer;
  transition:
    color var(--sadaa-transition-fast, .15s ease),
    border-color var(--sadaa-transition-fast, .15s ease),
    background-color var(--sadaa-transition-fast, .15s ease);
}

.sadaa-modal__close:hover,
.sadaa-modal__close:focus-visible {
  border-color: rgba(var(--sadaa-primary-rgb), .32);
  background: rgba(var(--sadaa-primary-rgb), .10);
  color: var(--sadaa-primary-dark);
  outline: none;
}

.sadaa-modal__close:focus-visible {
  box-shadow: 0 0 0 3px var(--sadaa-focus);
}

.sadaa-modal__header-actions {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.sadaa-modal__icon-action {
  width: 34px;
  height: 34px;
  min-width: 34px;
  flex: 0 0 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--sadaa-line-2, #d1d5db);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface, #ffffff);
  color: var(--sadaa-primary);
  cursor: pointer;
  transition:
    color var(--sadaa-transition-fast, .15s ease),
    border-color var(--sadaa-transition-fast, .15s ease),
    background-color var(--sadaa-transition-fast, .15s ease),
    box-shadow var(--sadaa-transition-fast, .15s ease);
}

.sadaa-modal__icon-action:hover,
.sadaa-modal__icon-action:focus-visible {
  border-color: rgba(var(--sadaa-primary-rgb), .34);
  background: rgba(var(--sadaa-primary-rgb), .11);
  color: var(--sadaa-primary-dark);
  outline: none;
}

.sadaa-modal__icon-action:focus-visible {
  box-shadow: 0 0 0 3px var(--sadaa-focus);
}

.sadaa-modal__body {
  min-height: 0;
  flex: 1 1 auto;
  overflow: auto;
  overscroll-behavior: contain;
  padding: var(--sadaa-space-4, 16px);
  background: var(--sadaa-surface, #ffffff);
}

.sadaa-modal__footer {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--sadaa-space-2, 8px);
  padding: 13px var(--sadaa-space-4, 16px);
  border-top: 1px solid var(--sadaa-line, #e5e7eb);
  background: var(--sadaa-surface, #ffffff);
}

@media (max-width: 600px) {
  .sadaa-modal--sheet-mobile {
    align-items: flex-end;
    padding: 10px;
  }

  .sadaa-modal--sheet-mobile .sadaa-modal__dialog {
    width: 100%;
    max-height: calc(100dvh - 20px);
  }

  .sadaa-modal__footer--split-mobile {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .sadaa-modal__footer--split-mobile > .sadaa-btn,
  .sadaa-modal__footer--split-mobile > button,
  .sadaa-modal__footer--split-mobile > a {
    width: 100%;
  }
}


/* =========================================================
   Modals / Dialogs — v2 editor layouts
   تخطيط مركزي للنوافذ الكبيرة ذات النموذج + لوحة جانبية.
   ========================================================= */
.sadaa-modal.show {
  display: flex;
}

.sadaa-modal--backdrop-self {
  background: rgba(17, 24, 39, .52);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.sadaa-modal__dialog--editor {
  width: min(890px, 100%);
}

.sadaa-modal__header--decorated {
  background:
    radial-gradient(circle at 10% 115%, rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .08) 0, rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .08) 74px, transparent 76px),
    linear-gradient(180deg, var(--sadaa-surface-alt, #fbfcfe) 0%, var(--sadaa-tint-3, #f7f9fc) 100%);
}

.sadaa-modal__title-wrap {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

.sadaa-modal__title-icon {
  width: 38px;
  height: 38px;
  min-width: 38px;
  flex: 0 0 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--sadaa-line-2, #d9e2f0);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface, #ffffff);
  color: var(--sadaa-primary);
  font-size: 15px;
}

.sadaa-modal__form {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

.sadaa-modal__body--split {
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 238px;
  gap: 0;
  min-height: 380px;
  overflow: auto;
}

.sadaa-modal__main {
  min-width: 0;
  padding: 18px;
}

.sadaa-modal__aside {
  min-width: 0;
  padding: 18px;
  border-inline-start: 1px solid var(--sadaa-line, #e7edf3);
  background: var(--sadaa-surface-alt, #fbfcfe);
}

.sadaa-modal__aside-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--sadaa-text-2, #374151);
  font-size: var(--sadaa-font-size-sm, 13px);
  font-weight: var(--sadaa-font-weight-medium, 500);
}

.sadaa-modal__aside-title i,
.sadaa-modal__aside-title svg {
  color: var(--sadaa-primary);
}

.sadaa-choice--panel {
  min-height: var(--sadaa-control-lg, 46px);
  box-sizing: border-box;
  padding: 9px 12px;
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-field, 8px);
  background: var(--sadaa-surface-alt, #fbfdfe);
}

@media (max-width: 760px) {
  .sadaa-modal--sheet-mobile.sadaa-modal--backdrop-self {
    align-items: flex-end;
    padding: 8px;
  }

  .sadaa-modal--sheet-mobile .sadaa-modal__dialog--editor {
    width: 100%;
    max-height: calc(100dvh - 16px);
    border-radius: var(--sadaa-radius-lg, 12px) var(--sadaa-radius-lg, 12px) 0 0;
  }

  .sadaa-modal__form {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

.sadaa-modal__body--split {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .sadaa-modal__body--split .sadaa-modal__aside {
    order: -1;
    padding: 14px;
    border-inline-start: 0;
    border-bottom: 1px solid var(--sadaa-line, #e7edf3);
  }

  .sadaa-modal__body--split .sadaa-modal__main {
    padding: 14px;
  }

  .sadaa-modal__body--split .sadaa-form-grid--2 {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .sadaa-modal__body--split .sadaa-field--full {
    grid-column: auto;
  }
}

/* =========================================================
   Modals / Dialogs — v2.1 editor refinement
   تقسيم أوضح للنماذج الكبيرة + رسائل الحفظ داخل النافذة.
   ========================================================= */
.sadaa-modal__feedback {
  flex: 0 0 auto;
  padding: 14px 18px 0;
  background: var(--sadaa-surface, #ffffff);
}

.sadaa-modal__feedback[hidden] {
  display: none !important;
}

.sadaa-modal__feedback .sadaa-alert {
  margin: 0;
}

.sadaa-form-section {
  margin: 0 0 20px;
  padding: 0 0 20px;
  border-bottom: 1px solid var(--sadaa-line, #e5e7eb);
}

.sadaa-form-section--last {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.sadaa-form-section__head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 14px;
}

.sadaa-form-section__icon {
  width: 30px;
  height: 30px;
  min-width: 30px;
  flex: 0 0 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(var(--sadaa-primary-rgb), .18);
  border-radius: var(--sadaa-radius-md, 8px);
  background: rgba(var(--sadaa-primary-rgb), .08);
  color: var(--sadaa-primary);
  font-size: 12px;
}

.sadaa-form-section__title {
  margin: 0;
  color: var(--sadaa-text, #111827);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}

.sadaa-form-section__description {
  margin: 2px 0 0;
  color: var(--sadaa-muted, #6b7280);
  font-size: 11px;
  line-height: 1.7;
}

.sadaa-modal__dialog--editor .sadaa-modal__main {
  padding: 20px;
}

.sadaa-modal__dialog--editor .sadaa-modal__aside {
  padding: 20px;
}

.sadaa-modal__dialog--editor .sadaa-form-grid {
  gap: 14px;
}

.sadaa-modal__dialog--editor .sadaa-choice--panel {
  background: var(--sadaa-surface, #ffffff);
}

@media (max-width: 760px) {
  .sadaa-modal__feedback {
    padding: 12px 14px 0;
  }

  .sadaa-form-section {
    margin-bottom: 16px;
    padding-bottom: 16px;
  }

  .sadaa-form-section__head {
    margin-bottom: 12px;
  }

  .sadaa-modal__dialog--editor .sadaa-modal__main,
  .sadaa-modal__dialog--editor .sadaa-modal__aside {
    padding: 14px;
  }
}

/* Store editor: compact text area for a better vertical balance. */
.sadaa-modal__dialog--editor .sadaa-textarea {
  min-height: 120px;
}


/* =========================================================
   Store editor refinements — v2.3
   ========================================================= */
/* Chevron واضح ومثبت لنافذة تعديل المتجر، بدون تغيير القوائم المعتمدة سابقاً. */
.sadaa-select-shell--modal::after {
  width: 16px;
  height: 16px;
  inset-inline-end: 14px;
  top: 50%;
  border: 0;
  background-color: var(--sadaa-muted, #6b7280);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m7 10 5 5 5-5' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m7 10 5 5 5-5' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
  transform: translateY(-50%);
}

.sadaa-select-shell--modal:focus-within::after {
  background-color: var(--sadaa-primary);
}

.sadaa-select-shell--modal .sadaa-select {
  padding-inline-end: 44px;
}

/* التصنيف وخيار التمييز يظهران بنفس الإيقاع والارتفاع. */
.directory-form-check--modal {
  width: 100%;
  min-height: var(--sadaa-control-lg, 46px);
  box-sizing: border-box;
  align-items: center;
  justify-content: flex-start;
  padding: 9px 13px;
}

.directory-form-check--modal .sadaa-checkbox {
  margin-top: 0;
}


/* =========================================================
   Store editor refinements — v2.4 final visual alignment
   ========================================================= */
/* تقليل المسافة الرأسية بين مسمى الحقل وعنصر الإدخال داخل محرر المتجر. */
.sadaa-modal__dialog--editor .sadaa-field {
  gap: 3px;
}

.sadaa-modal__dialog--editor .sadaa-label {
  line-height: 1.4;
}

/* توحيد سهم التصنيف مع المثلث المقلوب المستخدم في القوائم الأخرى. */
.sadaa-select-shell--modal::after {
  width: 0;
  height: 0;
  inset-inline-end: 15px;
  top: 50%;
  border: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid var(--sadaa-muted, #6b7280);
  background: none;
  -webkit-mask: none;
          mask: none;
  transform: translateY(-25%);
}

.sadaa-select-shell--modal:focus-within::after {
  background: none;
  border-top-color: var(--sadaa-primary);
}

/* تثبيت التصنيف وخيار التمييز على نفس خط الارتفاع تماماً. */
.sadaa-modal__dialog--editor .sadaa-select-shell--modal .sadaa-select,
.sadaa-modal__dialog--editor .directory-form-check--modal {
  height: var(--sadaa-control-lg, 46px);
  min-height: var(--sadaa-control-lg, 46px);
}

.sadaa-modal__dialog--editor .directory-form-check--modal {
  margin: 0;
  align-self: start;
  display: flex;
}

/* =========================================================
   Modals / Dialogs — v3 Welcome / Promotional modal
   نافذة مركزية للمحتوى الترحيبي أو الترويجي ذي الصورة العلوية.
   ========================================================= */
.sadaa-modal--welcome {
  padding: 16px;
  background: rgba(15, 23, 42, .46);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.sadaa-modal__dialog--welcome {
  width: min(520px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  border-color: rgba(15, 23, 42, .06);
  border-radius: var(--sadaa-radius-xl, 16px);
  box-shadow: 0 24px 70px rgba(15, 23, 42, .26);
  transform: translateY(10px) scale(.985);
  transition: transform var(--sadaa-transition, .20s ease);
}

.sadaa-modal--welcome.is-open .sadaa-modal__dialog--welcome {
  transform: translateY(0) scale(1);
}

.sadaa-modal__hero {
  position: relative;
  flex: 0 0 auto;
  height: 168px;
  overflow: hidden;
  background: var(--sadaa-tint, #eef8fb);
}

.sadaa-modal__hero::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 68px;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(255,255,255,0), var(--sadaa-surface, #fff) 100%);
}

.sadaa-modal__hero-visual,
.sadaa-modal__hero-visual img {
  width: 100%;
  height: 100%;
}

.sadaa-modal__hero-visual img {
  display: block;
  object-fit: cover;
  object-position: center 46%;
  filter: saturate(1.02) contrast(1.02);
}

.sadaa-modal__close--hero {
  position: absolute;
  z-index: 3;
  top: 12px;
  left: 12px;
  border-color: rgba(255,255,255,.48);
  background: rgba(255,255,255,.82);
  box-shadow: 0 6px 16px rgba(15,23,42,.10);
}

.sadaa-modal__close--hero:hover,
.sadaa-modal__close--hero:focus-visible {
  background: var(--sadaa-surface, #fff);
  transform: translateY(-1px);
}

.sadaa-modal__body--welcome {
  padding: 20px 28px 26px;
  overflow: auto;
  text-align: center;
}

.sadaa-modal__welcome-title {
  margin: 0 0 9px;
  color: var(--sadaa-text, #111827);
  font-family: 'Baloo Bhaijaan 2', var(--site-font-family), sans-serif !important;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.85;
}

.sadaa-modal__welcome-message {
  max-width: 420px;
  margin: 0 auto;
  color: var(--sadaa-muted, #6b7280);
  font-size: 14px;
  line-height: 1.95;
}

.sadaa-modal__detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.sadaa-modal__detail {
  min-width: 0;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 9px 10px;
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface-alt, #fbfdfe);
  color: var(--sadaa-text-2, #374151);
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}

.sadaa-modal__detail > i {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  background: rgba(var(--sadaa-primary-rgb), .10);
  color: var(--sadaa-primary);
  font-size: 11px;
}

.sadaa-modal__note {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 7px;
  margin: 13px 0 0;
  color: var(--sadaa-muted, #6b7280);
  font-size: 12px;
  line-height: 1.8;
  text-align: center;
}

.sadaa-modal__note > i {
  margin-top: 3px;
  color: var(--sadaa-primary);
}

.sadaa-modal__welcome-actions {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.sadaa-modal__welcome-action {
  min-width: 210px;
  box-shadow: 0 10px 20px rgba(var(--sadaa-primary-rgb), .18);
}

body.trial-welcome-open {
  overflow: hidden;
}

@media (max-width: 640px) {
  .sadaa-modal--welcome {
    padding: 12px;
  }

  .sadaa-modal__dialog--welcome {
    width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px);
  }

  .sadaa-modal__hero {
    height: 138px;
  }

  .sadaa-modal__body--welcome {
    padding: 20px 18px 22px;
  }

  .sadaa-modal__welcome-title {
    font-size: 18px;
    line-height: 1.9;
  }

  .sadaa-modal__welcome-message {
    font-size: 13px;
  }

  .sadaa-modal__detail-grid {
    grid-template-columns: 1fr;
  }

  .sadaa-modal__welcome-action {
    width: 100%;
    min-width: 0;
  }
}


/* =========================================================
   Sadaa Design System — Tooltips v1
   تلميحات موحّدة للأيقونات والعناصر الصغيرة.
   ========================================================= */
.sadaa-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  vertical-align: middle;
  outline: none;
}

.sadaa-tooltip__content {
  position: absolute;
  z-index: var(--sadaa-z-tooltip, 1200);
  width: max-content;
  max-width: min(240px, calc(100vw - 32px));
  padding: 7px 10px;
  border: 1px solid rgba(var(--sadaa-shadow-rgb), .18);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-text, #163247);
  color: #fff;
  box-shadow: 0 10px 26px rgba(var(--sadaa-shadow-rgb), .18);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.65;
  text-align: center;
  white-space: normal;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px) scale(.98);
  transition:
    opacity var(--sadaa-transition-fast, .15s ease),
    transform var(--sadaa-transition-fast, .15s ease),
    visibility var(--sadaa-transition-fast, .15s ease);
}

.sadaa-tooltip__content::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  background: inherit;
  transform: rotate(45deg);
}

.sadaa-tooltip--top > .sadaa-tooltip__content {
  inset-block-end: calc(100% + 10px);
  left: 50%;
  right: auto;
  transform: translateX(-50%) translateY(4px) scale(.98);
}

.sadaa-tooltip--top > .sadaa-tooltip__content::after {
  inset-block-start: calc(100% - 4px);
  left: 50%;
  right: auto;
  margin-left: -4px;
}

.sadaa-tooltip--bottom > .sadaa-tooltip__content {
  inset-block-start: calc(100% + 10px);
  left: 50%;
  right: auto;
  transform: translateX(-50%) translateY(-4px) scale(.98);
}

.sadaa-tooltip--bottom > .sadaa-tooltip__content::after {
  inset-block-end: calc(100% - 4px);
  left: 50%;
  right: auto;
  margin-left: -4px;
}

.sadaa-tooltip:hover > .sadaa-tooltip__content,
.sadaa-tooltip:focus-visible > .sadaa-tooltip__content,
.sadaa-tooltip:focus-within > .sadaa-tooltip__content {
  opacity: 1;
  visibility: visible;
}

.sadaa-tooltip--top:hover > .sadaa-tooltip__content,
.sadaa-tooltip--top:focus-visible > .sadaa-tooltip__content,
.sadaa-tooltip--top:focus-within > .sadaa-tooltip__content {
  transform: translateX(-50%) translateY(0) scale(1);
}

.sadaa-tooltip--bottom:hover > .sadaa-tooltip__content,
.sadaa-tooltip--bottom:focus-visible > .sadaa-tooltip__content,
.sadaa-tooltip--bottom:focus-within > .sadaa-tooltip__content {
  transform: translateX(-50%) translateY(0) scale(1);
}

.sadaa-tooltip:focus-visible {
  border-radius: var(--sadaa-radius-sm, 6px);
  box-shadow: 0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb),.13));
}

@media (hover: none) {
  .sadaa-tooltip__content {
    transition-duration: 0s;
  }
}


/* =========================================================
   Sadaa Design System — Drawer v1
   لوحة جانبية مركزية قابلة لإعادة الاستخدام للتنقل والفلاتر وغيرها.
   ========================================================= */
.sadaa-drawer-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface, #fff);
  color: var(--sadaa-text, #111827);
  cursor: pointer;
  font: inherit;
  transition:
    background-color var(--sadaa-transition-fast, .18s ease),
    border-color var(--sadaa-transition-fast, .18s ease),
    color var(--sadaa-transition-fast, .18s ease),
    transform var(--sadaa-transition-fast, .18s ease);
}

/* Edge Trigger: زر فتح جانبي قابل لإعادة الاستخدام خارج الهيدر */
.sadaa-drawer-trigger--edge {
  position: fixed;
  z-index: var(--sadaa-drawer-trigger-z, 8100);
  top: var(--sadaa-drawer-edge-top, 96px);
  min-width: 86px;
  height: 44px;
  padding: 0 13px;
  gap: 8px;
  border-color: rgba(var(--sadaa-primary-rgb), .24);
  background: var(--sadaa-primary);
  color: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .16);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  opacity: .96;
}

.sadaa-drawer-trigger--edge-start {
  inset-inline-start: 0;
  border-start-start-radius: 0;
  border-end-start-radius: 0;
  border-start-end-radius: 10px;
  border-end-end-radius: 10px;
  border-inline-start: 0;
}

.sadaa-drawer-trigger--edge i {
  font-size: 15px;
}

.sadaa-drawer-trigger--edge:hover,
.sadaa-drawer-trigger--edge[aria-expanded="true"] {
  background: var(--sadaa-primary-dark, var(--sadaa-primary));
  border-color: rgba(var(--sadaa-primary-rgb), .34);
  color: #fff;
  opacity: 1;
  transform: translateX(-2px);
}

.sadaa-drawer-trigger__label {
  display: inline-block;
  white-space: nowrap;
}

body.sadaa-drawer-open .sadaa-drawer-trigger--edge {
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 600px) {
  .sadaa-drawer-trigger--edge {
    min-width: 46px;
    width: 46px;
    height: 44px;
    padding: 0;
    gap: 0;
  }

  .sadaa-drawer-trigger--edge .sadaa-drawer-trigger__label {
    display: none;
  }
}

.sadaa-drawer-trigger:focus-visible,
.sadaa-drawer__close:focus-visible,
.sadaa-drawer__item:focus-visible {
  outline: 3px solid var(--sadaa-focus, rgba(var(--sadaa-primary-rgb), .18));
  outline-offset: 2px;
}

.sadaa-drawer__backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--sadaa-drawer-backdrop-z, 8200);
  background: rgba(10, 15, 25, .46);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity var(--sadaa-transition-base, .22s ease),
    visibility var(--sadaa-transition-base, .22s ease);
}

.sadaa-drawer__backdrop.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.sadaa-drawer {
  position: fixed;
  inset-block: 0;
  inset-inline-start: 0;
  z-index: var(--sadaa-drawer-z, 8300);
  width: min(var(--sadaa-drawer-width, 360px), var(--sadaa-drawer-max-vw, 88vw));
  max-width: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  direction: rtl;
  background: var(--sadaa-surface, #fff);
  border-inline-end: 1px solid var(--sadaa-line, #e5e7eb);
  box-shadow: -18px 0 46px rgba(15, 23, 42, .18);
  transform: translateX(104%);
  visibility: hidden;
  transition:
    transform var(--sadaa-transition-base, .24s ease),
    visibility var(--sadaa-transition-base, .24s ease);
}

.sadaa-drawer.is-open {
  transform: translateX(0);
  visibility: visible;
}

.sadaa-drawer__header {
  min-height: var(--sadaa-drawer-header-height, 82px);
  padding: var(--sadaa-drawer-header-padding, 16px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sadaa-space-3, 12px);
  flex: 0 0 auto;
  border-bottom: 1px solid var(--sadaa-line, #e5e7eb);
  background: linear-gradient(
    135deg,
    rgba(var(--sadaa-primary-rgb), .10),
    rgba(var(--sadaa-primary-rgb), .03)
  );
}

.sadaa-drawer__heading {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}

.sadaa-drawer__heading-icon {
  width: 40px;
  height: 40px;
  min-width: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(var(--sadaa-primary-rgb), .16);
  border-radius: var(--sadaa-radius-md, 9px);
  color: var(--sadaa-primary);
  background: rgba(var(--sadaa-primary-rgb), .10);
}

.sadaa-drawer__heading-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.sadaa-drawer__title {
  color: var(--sadaa-text, #111827);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
}

.sadaa-drawer__subtitle {
  color: var(--sadaa-muted, #6b7280);
  font-size: 11.5px;
  line-height: 1.45;
}

.sadaa-drawer__close {
  width: 38px;
  min-width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  background: var(--sadaa-surface, #fff);
  color: var(--sadaa-text, #111827);
  cursor: pointer;
  transition:
    border-color var(--sadaa-transition-fast, .18s ease),
    background-color var(--sadaa-transition-fast, .18s ease),
    color var(--sadaa-transition-fast, .18s ease);
}

.sadaa-drawer__close:hover {
  color: var(--sadaa-primary);
  border-color: rgba(var(--sadaa-primary-rgb), .26);
  background: rgba(var(--sadaa-primary-rgb), .06);
}

.sadaa-drawer__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: var(--sadaa-drawer-body-padding, 12px);
  overscroll-behavior: contain;
}

.sadaa-drawer__nav {
  display: flex;
  flex-direction: column;
  gap: var(--sadaa-drawer-nav-gap, 5px);
}

.sadaa-drawer__item {
  min-height: 48px;
  width: 100%;
  padding: 7px 9px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: var(--sadaa-radius-md, 8px);
  color: var(--sadaa-text, #1f2937);
  background: transparent;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  transition:
    background-color var(--sadaa-transition-fast, .18s ease),
    border-color var(--sadaa-transition-fast, .18s ease),
    color var(--sadaa-transition-fast, .18s ease),
    transform var(--sadaa-transition-fast, .18s ease);
}

.sadaa-drawer__item:hover,
.sadaa-drawer__item:focus-visible {
  color: var(--sadaa-primary);
  background: rgba(var(--sadaa-primary-rgb), .07);
  border-color: rgba(var(--sadaa-primary-rgb), .13);
}

.sadaa-drawer__item.is-active {
  color: var(--sadaa-primary);
  background: rgba(var(--sadaa-primary-rgb), .10);
  border-color: rgba(var(--sadaa-primary-rgb), .18);
}

.sadaa-drawer__item-icon {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--sadaa-radius-md, 8px);
  color: var(--sadaa-primary);
  background: rgba(var(--sadaa-primary-rgb), .07);
}

.sadaa-drawer__item.is-active .sadaa-drawer__item-icon {
  color: #fff;
  background: var(--sadaa-primary);
}

.sadaa-drawer__item-chevron {
  justify-self: end;
  color: var(--sadaa-muted, #94a3b8);
  font-size: 10px;
}

.sadaa-drawer__footer {
  flex: 0 0 auto;
  padding: 13px 16px;
  border-top: 1px solid var(--sadaa-line, #e5e7eb);
  color: var(--sadaa-muted, #6b7280);
  background: rgba(var(--sadaa-primary-rgb), .025);
  font-size: 11.5px;
}

.sadaa-drawer__footer-content {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

body.sadaa-drawer-open {
  overflow: hidden !important;
  touch-action: none;
}

@media (max-width: 768px) {
  .sadaa-drawer {
    --sadaa-drawer-width: 340px;
    --sadaa-drawer-max-vw: 91vw;
    --sadaa-drawer-header-height: 76px;
    --sadaa-drawer-header-padding: 13px 12px;
    --sadaa-drawer-body-padding: 10px;
  }

  .sadaa-drawer__item {
    min-height: 46px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sadaa-drawer,
  .sadaa-drawer__backdrop,
  .sadaa-drawer-trigger,
  .sadaa-drawer__item {
    transition: none !important;
  }
}

/* =========================================================
   Sadaa Design System — Drawer Nav Panel v1.1
   Navigation drawer variant aligned with the accepted
   admin/member sidebar language. Reuses sadaa-nav-* directly.
   ========================================================= */
.sadaa-drawer--nav-panel {
  --sadaa-drawer-width: 320px;
  --sadaa-drawer-max-vw: 92vw;
  background: var(--sadaa-surface, #fff);
  border-inline-end: 1px solid var(--sadaa-line, #e5e7eb);
  box-shadow: -18px 0 46px rgba(15, 23, 42, .18);
}

.sadaa-drawer--nav-panel .sadaa-drawer__header {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 126px;
  padding: 20px 16px 18px;
  align-items: flex-start;
  color: #fff;
  border-bottom: 0;
  background: var(--sadaa-admin-primary, var(--sadaa-primary));
}

.sadaa-drawer--nav-panel .sadaa-drawer__header::before,
.sadaa-drawer--nav-panel .sadaa-drawer__header::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  pointer-events: none;
}

.sadaa-drawer--nav-panel .sadaa-drawer__header::before {
  width: 150px;
  height: 150px;
  inset-inline-start: -64px;
  top: -82px;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow:
    0 0 0 28px rgba(255,255,255,.045),
    0 0 0 58px rgba(255,255,255,.025);
}

.sadaa-drawer--nav-panel .sadaa-drawer__header::after {
  width: 90px;
  height: 90px;
  inset-inline-end: -32px;
  bottom: -48px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.10);
}

.sadaa-drawer--nav-panel .sadaa-drawer__heading {
  position: relative;
  z-index: 1;
  align-items: center;
  gap: 11px;
  padding-top: 2px;
}

.sadaa-drawer--nav-panel .sadaa-drawer__heading-icon {
  width: 42px;
  min-width: 42px;
  height: 42px;
  color: #fff;
  background: rgba(var(--sadaa-admin-dark-rgb, var(--sadaa-primary-rgb)), .17);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 7px;
  font-size: 17px;
}

.sadaa-drawer--nav-panel .sadaa-drawer__heading-copy {
  gap: 3px;
}

.sadaa-drawer--nav-panel .sadaa-drawer__title {
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.55;
}

.sadaa-drawer--nav-panel .sadaa-drawer__subtitle {
  color: rgba(255,255,255,.78);
  font-size: 12px;
  line-height: 1.65;
}

.sadaa-drawer--nav-panel .sadaa-drawer__close {
  position: relative;
  z-index: 2;
  width: 38px;
  min-width: 38px;
  height: 38px;
  color: #fff;
  background: rgba(var(--sadaa-admin-dark-rgb, var(--sadaa-primary-rgb)), .18);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 7px;
}

.sadaa-drawer--nav-panel .sadaa-drawer__close:hover {
  color: #fff;
  background: rgba(var(--sadaa-admin-dark-rgb, var(--sadaa-primary-rgb)), .28);
  border-color: rgba(255,255,255,.38);
}

.sadaa-drawer--nav-panel .sadaa-drawer__body {
  padding: 12px 10px;
  background: var(--sadaa-surface, #fff);
}

.sadaa-drawer--nav-panel .sadaa-nav-stack {
  gap: 2px;
}

.sadaa-drawer--nav-panel .sadaa-nav-item {
  min-height: 44px;
  padding: 7px 9px;
  font-size: 14px;
}

.sadaa-drawer--nav-panel .sadaa-nav-item__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sadaa-drawer--nav-panel .sadaa-drawer__footer {
  padding: 11px 14px;
  color: var(--sadaa-muted, #6b7280);
  background: #f8fafc;
  border-top: 1px solid var(--sadaa-line, #e5e7eb);
  font-size: 11.5px;
}

@media (max-width: 768px) {
  .sadaa-drawer--nav-panel {
    --sadaa-drawer-width: 320px;
    --sadaa-drawer-max-vw: 94vw;
  }

  .sadaa-drawer--nav-panel .sadaa-drawer__header {
    min-height: 112px;
    padding: 17px 14px 15px;
  }

  .sadaa-drawer--nav-panel .sadaa-drawer__heading-icon {
    width: 38px;
    min-width: 38px;
    height: 38px;
    font-size: 15px;
  }

  .sadaa-drawer--nav-panel .sadaa-drawer__title {
    font-size: 17px;
  }

  .sadaa-drawer--nav-panel .sadaa-drawer__body {
    padding: 10px;
  }

  .sadaa-drawer--nav-panel .sadaa-nav-stack {
    gap: 1px;
  }

  .sadaa-drawer--nav-panel .sadaa-nav-item {
    min-height: 42px;
    padding: 6px 8px;
    font-size: 13.5px;
  }
}

/* =========================================================
   Sadaa Design System — Popovers v1
   Reusable anchored surfaces for compact information/actions.
   ========================================================= */
.sadaa-popover-anchor {
  position: relative;
}

.sadaa-popover {
  position: absolute;
  z-index: 6000;
  width: min(320px, calc(100vw - 24px));
  margin: 0;
  padding: var(--sadaa-space-2, 8px);
  color: var(--sadaa-text, #172033);
  background: var(--sadaa-surface, #fff);
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  box-shadow: var(--sadaa-shadow-xl, 0 14px 34px rgba(15,23,42,.20));
  overflow: visible;
  box-sizing: border-box;
}

.sadaa-popover--sm {
  width: 258px;
  min-width: 258px;
}

.sadaa-popover--arrow::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -6px;
  right: 18px;
  width: 11px;
  height: 11px;
  border-top: 1px solid var(--sadaa-line, #e5e7eb);
  border-right: 1px solid var(--sadaa-line, #e5e7eb);
  background: var(--sadaa-surface, #fff);
  transform: rotate(-45deg);
  box-sizing: border-box;
}

.sadaa-popover__header {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 7px 11px;
  border-bottom: 1px solid var(--sadaa-line-2, #edf0f3);
}

.sadaa-popover__header-icon {
  width: 34px;
  min-width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--sadaa-primary);
  background: rgba(var(--sadaa-primary-rgb), .08);
  border: 1px solid rgba(var(--sadaa-primary-rgb), .16);
  border-radius: var(--sadaa-radius-sm, 6px);
}

.sadaa-popover__header-icon i {
  margin: 0;
  font-size: 15px;
  line-height: 1;
}

.sadaa-popover__heading {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sadaa-popover__title {
  color: var(--sadaa-text, #172033);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.6;
}

.sadaa-popover__subtitle {
  color: var(--sadaa-muted, #7b8494);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.6;
}

.sadaa-popover__list {
  padding-top: 5px;
}

.sadaa-popover__item {
  width: 100%;
  min-height: 43px;
  margin: 0;
  padding: 6px 7px;
  border: 0;
  border-bottom: 1px solid var(--sadaa-line-2, #f0f2f4);
  border-radius: 0;
  background: var(--sadaa-surface, #fff);
  color: var(--sadaa-text-2, #334155);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  font: inherit;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.5;
  text-align: start;
  cursor: pointer;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
  transition: background-color .16s ease, color .16s ease;
}

.sadaa-popover__item:last-child {
  border-bottom: 0;
}

.sadaa-popover__item:hover,
.sadaa-popover__item:focus-visible {
  background: rgba(var(--sadaa-primary-rgb), .055);
  color: var(--sadaa-text, #111827);
  outline: none;
}

.sadaa-popover__item > i,
.sadaa-popover__item-icon {
  width: 30px;
  min-width: 30px;
  height: 30px;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: var(--sadaa-radius-sm, 6px);
  font-size: 14px;
  line-height: 1;
}

.sadaa-popover__item > span {
  flex: 1;
  min-width: 0;
}

.sadaa-popover__body {
  padding: var(--sadaa-space-2, 8px);
}

.sadaa-popover__footer {
  display: flex;
  align-items: center;
  gap: var(--sadaa-space-2, 8px);
  padding: var(--sadaa-space-2, 8px);
  border-top: 1px solid var(--sadaa-line-2, #edf0f3);
}

@media (max-width: 480px) {
  .sadaa-popover--sm {
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sadaa-popover,
  .sadaa-popover__item {
    transition: none !important;
  }
}

/* =========================================================
   Flash Notifications — v1.1
   رسائل العمليات المؤقتة على مستوى الصفحة/التطبيق.
   موضع موحد: أعلى يمين الشاشة على سطح المكتب، وأعلى الشاشة على الجوال.
   مبنية فوق نفس لغة ألوان sadaa-alert مع سلوك مستقل غير حاجز للمحتوى.
   ========================================================= */
.sadaa-flash-region {
  position: fixed;
  top: max(18px, env(safe-area-inset-top));
  right: max(18px, env(safe-area-inset-right));
  z-index: var(--sadaa-z-toast, 12000);
  width: min(420px, calc(100vw - 36px));
  display: grid;
  gap: 9px;
  pointer-events: none;
}

.sadaa-flash {
  --sadaa-flash-bg: var(--sadaa-surface, #fff);
  --sadaa-flash-border: var(--sadaa-line, #e5e7eb);
  --sadaa-flash-color: var(--sadaa-text, #111827);
  --sadaa-flash-icon-bg: var(--sadaa-tint-2, #f3f4f6);

  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
  padding: 12px 13px;
  border: 1px solid var(--sadaa-flash-border);
  border-radius: var(--sadaa-radius-md, 9px);
  background: var(--sadaa-flash-bg);
  color: var(--sadaa-flash-color);
  box-shadow: var(--sadaa-shadow-lg, 0 14px 34px rgba(17,24,39,.16));
  font-family: inherit;
  font-size: 13px;
  line-height: 1.75;
  text-align: start;
  opacity: 0;
  transform: translateY(-9px) scale(.985);
  transition:
    opacity var(--sadaa-transition-fast, 160ms ease),
    transform var(--sadaa-transition-fast, 160ms ease);
  pointer-events: auto;
}

.sadaa-flash.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.sadaa-flash.is-leaving {
  opacity: 0;
  transform: translateY(-6px) scale(.985);
  pointer-events: none;
}

.sadaa-flash__icon {
  width: 30px;
  height: 30px;
  margin-top: 0;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  background: var(--sadaa-flash-icon-bg);
  color: inherit;
  font-size: 15px;
}

.sadaa-flash__body {
  min-width: 0;
  padding-top: 0;
}

.sadaa-flash__title {
  display: block;
  margin-bottom: 1px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.55;
}

.sadaa-flash__message {
  min-width: 0;
  overflow-wrap: anywhere;
}

.sadaa-flash__close {
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: currentColor;
  opacity: .58;
  cursor: pointer;
  transition:
    opacity var(--sadaa-transition-fast, 160ms ease),
    background-color var(--sadaa-transition-fast, 160ms ease);
}

.sadaa-flash__close:hover,
.sadaa-flash__close:focus-visible {
  opacity: 1;
  background: rgba(255,255,255,.58);
  outline: none;
}

.sadaa-flash--success {
  --sadaa-flash-bg: #ecfdf3;
  --sadaa-flash-border: #bbf7d0;
  --sadaa-flash-color: #166534;
  --sadaa-flash-icon-bg: #dcfce7;
}

.sadaa-flash--error {
  --sadaa-flash-bg: #fff1f2;
  --sadaa-flash-border: #fecdd3;
  --sadaa-flash-color: #9f1239;
  --sadaa-flash-icon-bg: #ffe4e6;
}

.sadaa-flash--warning {
  --sadaa-flash-bg: #fff8f1;
  --sadaa-flash-border: #fed7aa;
  --sadaa-flash-color: #9a3412;
  --sadaa-flash-icon-bg: #ffedd5;
}

.sadaa-flash--info {
  --sadaa-flash-bg: #f4f9fd;
  --sadaa-flash-border: var(--sadaa-admin-soft-line, #cfe3f3);
  --sadaa-flash-color: #285477;
  --sadaa-flash-icon-bg: #e8f3fb;
}

[data-sadaa-flash] {
  display: none !important;
}

@media (max-width: 640px) {
  .sadaa-flash-region {
    top: max(12px, env(safe-area-inset-top));
    right: max(12px, env(safe-area-inset-right));
    left: max(12px, env(safe-area-inset-left));
    width: auto;
  }

  .sadaa-flash {
    padding: 11px 12px;
    gap: 9px;
    border-radius: var(--sadaa-radius-md, 9px);
    font-size: 12.5px;
  }

  .sadaa-flash__icon {
    width: 28px;
    height: 28px;
    font-size: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sadaa-flash {
    transition: none;
  }
}


/* =========================================================
   Date / Time / Flatpickr — v1.0
   مكوّن موحد لحقول التاريخ والتقويم المنبثق.
   - sadaa-date-control: غلاف الحقل + الأيقونة.
   - sadaa-calendar: الشكل الأساسي لتقويم Flatpickr.
   - variants: admin / booking / member.
   لا يغيّر منطق minDate/maxDate أو ربط البداية بالنهاية؛ هذه تبقى مسؤولية الصفحة.
   ========================================================= */
.sadaa-date-control {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

.sadaa-date-control__input {
  width: 100% !important;
  padding-left: 44px !important;
  cursor: pointer;
  caret-color: var(--sadaa-primary);
}

.sadaa-date-control__icon {
  position: absolute !important;
  left: 15px !important;
  right: auto !important;
  top: 50% !important;
  z-index: 2;
  transform: translateY(-50%) !important;
  color: var(--sadaa-muted, #6b7280) !important;
  font-size: 14px !important;
  line-height: 1 !important;
  pointer-events: none !important;
  transition: color var(--sadaa-transition-fast, 160ms ease);
}

.sadaa-date-control:hover .sadaa-date-control__input:not(:disabled),
.sadaa-date-control__input:hover:not(:disabled) {
  border-color: var(--sadaa-line-3, #cbd5e1) !important;
}

.sadaa-date-control.is-calendar-open .sadaa-date-control__input,
.sadaa-date-control__input:focus {
  border-color: var(--sadaa-primary) !important;
  background: var(--sadaa-surface, #fff) !important;
  box-shadow: 0 0 0 3px rgba(var(--sadaa-primary-rgb), .11) !important;
  outline: none !important;
}

.sadaa-date-control.is-calendar-open .sadaa-date-control__icon,
.sadaa-date-control:focus-within .sadaa-date-control__icon {
  color: var(--sadaa-primary) !important;
}

.sadaa-date-control--admin .sadaa-date-control__input {
  caret-color: var(--sadaa-admin-primary, var(--sadaa-primary));
}

.sadaa-date-control--admin.is-calendar-open .sadaa-date-control__input,
.sadaa-date-control--admin .sadaa-date-control__input:focus {
  border-color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  box-shadow: 0 0 0 3px rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .11) !important;
}

.sadaa-date-control--admin.is-calendar-open .sadaa-date-control__icon,
.sadaa-date-control--admin:focus-within .sadaa-date-control__icon {
  color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
}

.sadaa-date-control__input:disabled,
.sadaa-date-control__input[aria-disabled="true"] {
  cursor: not-allowed;
}

.sadaa-date-control:has(.sadaa-date-control__input:disabled) .sadaa-date-control__icon {
  opacity: .5;
}

/* Calendar variables */
.flatpickr-calendar.sadaa-calendar {
  --sadaa-calendar-primary: var(--sadaa-primary);
  --sadaa-calendar-dark: var(--sadaa-primary-dark);
  --sadaa-calendar-primary-rgb: var(--sadaa-primary-rgb);
  --sadaa-calendar-header-bg: linear-gradient(135deg, var(--sadaa-primary), var(--sadaa-accent));
  --sadaa-calendar-selected-bg: var(--sadaa-calendar-header-bg);
  --sadaa-calendar-week-bg: var(--sadaa-tint-3, #f8fafc);
  --sadaa-calendar-week-line: var(--sadaa-line-2, #e5e7eb);
  --sadaa-calendar-hover-bg: var(--sadaa-tint-3, #f8fafc);
  --sadaa-calendar-hover-line: var(--sadaa-line-2, #e5e7eb);
}

.flatpickr-calendar.sadaa-calendar--admin {
  --sadaa-calendar-primary: var(--sadaa-admin-primary, var(--sadaa-primary));
  --sadaa-calendar-dark: var(--sadaa-admin-hover, var(--sadaa-primary-dark));
  --sadaa-calendar-primary-rgb: var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb));
  --sadaa-calendar-header-bg: var(--sadaa-admin-brand-gradient, var(--sadaa-admin-primary));
  --sadaa-calendar-selected-bg: var(--sadaa-admin-brand-gradient, var(--sadaa-admin-primary));
  --sadaa-calendar-week-bg: var(--sadaa-admin-soft, #f8fafc);
  --sadaa-calendar-week-line: var(--sadaa-admin-line, #e5e7eb);
  --sadaa-calendar-hover-bg: var(--sadaa-admin-soft, #f8fafc);
  --sadaa-calendar-hover-line: var(--sadaa-admin-soft-line, #cbd5e1);
}

.flatpickr-calendar.sadaa-calendar--booking {
  --sadaa-calendar-primary: var(--ad-primary, var(--sadaa-primary));
  --sadaa-calendar-dark: var(--ad-primary-dark, var(--sadaa-primary-dark));
  --sadaa-calendar-primary-rgb: var(--sadaa-primary-rgb);
  --sadaa-calendar-header-bg: linear-gradient(135deg, var(--ad-primary, var(--sadaa-primary)), var(--ad-accent, var(--sadaa-accent)));
  --sadaa-calendar-selected-bg: var(--sadaa-calendar-header-bg);
}

.flatpickr-calendar.sadaa-calendar--member {
  --sadaa-calendar-primary: var(--sadaa-primary);
  --sadaa-calendar-dark: var(--sadaa-primary-dark);
  --sadaa-calendar-primary-rgb: var(--sadaa-primary-rgb);
  --sadaa-calendar-header-bg: var(--sadaa-primary);
  --sadaa-calendar-selected-bg: var(--sadaa-primary);
}

/*
 * نكرر كلاس sadaa-calendar في محدد الجذر عمداً لرفع الخصوصية فوق
 * Themes القديمة أو CSS المحلي، حتى يبقى المصدر المركزي هو المرجع النهائي.
 */
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar * {
  box-sizing: border-box;
  font-family: var(--sadaa-font-family, var(--site-font-family, Tahoma, Arial, sans-serif)) !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar {
  width: 320px !important;
  min-width: 320px !important;
  direction: rtl !important;
  text-align: center !important;
  overflow: hidden !important;
  margin-top: 8px !important;
  padding: 0 !important;
  background: var(--sadaa-surface, #fff) !important;
  border: 1px solid var(--sadaa-line, #e5e7eb) !important;
  border-radius: 9px !important;
  box-shadow: 0 22px 55px rgba(17,24,39,.16) !important;
  color: var(--sadaa-text, #111827) !important;
  font-size: 13px !important;
  z-index: 99999 !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar::before,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar::after {
  display: none !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar.open {
  animation: sadaaCalendarOpen .17s ease-out both;
}

@keyframes sadaaCalendarOpen {
  from { opacity: 0; transform: translateY(-5px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-months {
  position: relative !important;
  width: 100% !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 9px 44px !important;
  align-items: center !important;
  background: var(--sadaa-calendar-header-bg) !important;
  border: 0 !important;
  color: #fff !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-month {
  height: 40px !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  color: #fff !important;
  fill: #fff !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month {
  position: static !important;
  width: 100% !important;
  height: 40px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  direction: rtl !important;
  background: transparent !important;
  border: 0 !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month .cur-month {
  margin: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-weight: 500 !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month .flatpickr-monthDropdown-months,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month .flatpickr-monthDropdown-months:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month .flatpickr-monthDropdown-months:focus {
  min-width: 102px !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 10px 0 28px !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 6px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.10)) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 30px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: pointer !important;
  text-align: center !important;
  text-align-last: center !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month .flatpickr-monthDropdown-months option {
  color: #374151 !important;
  background: #fff !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month .numInputWrapper {
  width: 66px !important;
  height: 32px !important;
  background: transparent !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month input.cur-year {
  width: 100% !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 7px !important;
  background: rgba(255,255,255,.13) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 6px !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  text-align: center !important;
  box-shadow: none !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month input.cur-year:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-current-month input.cur-year:focus {
  background: rgba(255,255,255,.20) !important;
  border-color: rgba(255,255,255,.38) !important;
  box-shadow: none !important;
  outline: none !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .numInputWrapper span {
  display: none !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-prev-month,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-next-month {
  position: absolute !important;
  top: 9px !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(255,255,255,.20) !important;
  border-radius: 7px !important;
  background: rgba(255,255,255,.11) !important;
  color: #fff !important;
  fill: #fff !important;
  z-index: 5 !important;
  transition: background-color .16s ease, border-color .16s ease !important;
}

/* RTL: السابق بصرياً يسار، التالي يمين — مطابق للسلوك المعتمد حالياً. */
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-prev-month {
  left: 9px !important;
  right: auto !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-next-month {
  right: 9px !important;
  left: auto !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-prev-month:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-next-month:hover {
  background: rgba(255,255,255,.21) !important;
  border-color: rgba(255,255,255,.34) !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-prev-month svg,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-next-month svg {
  display: none !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-prev-month::before,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-next-month::before {
  display: block !important;
  color: currentColor !important;
  font-size: 22px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  transform: translateY(-1px) !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-prev-month::before { content: "›"; }
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-next-month::before { content: "‹"; }

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-innerContainer,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-rContainer {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  direction: rtl !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-weekdays {
  width: 100% !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 4px 14px 0 !important;
  background: var(--sadaa-calendar-week-bg) !important;
  border-bottom: 1px solid var(--sadaa-calendar-week-line) !important;
  direction: rtl !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-weekdaycontainer {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0,1fr)) !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--sadaa-calendar-week-bg) !important;
  direction: rtl !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar span.flatpickr-weekday {
  width: auto !important;
  max-width: none !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--sadaa-calendar-week-bg) !important;
  color: var(--sadaa-muted, #6b7280) !important;
  font-size: 11px !important;
  line-height: 34px !important;
  font-weight: 500 !important;
  text-align: center !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-days {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 8px 14px 10px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  direction: rtl !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .dayContainer {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0,1fr)) !important;
  gap: 2px 0 !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-items: center !important;
  align-items: center !important;
  direction: rtl !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day {
  width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  color: #374151 !important;
  font-size: 12.5px !important;
  line-height: 32px !important;
  font-weight: 400 !important;
  text-align: center !important;
  transition: color .14s ease, background-color .14s ease, border-color .14s ease !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day:focus {
  background: var(--sadaa-calendar-hover-bg) !important;
  border-color: var(--sadaa-calendar-hover-line) !important;
  color: var(--sadaa-calendar-dark) !important;
  outline: none !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.today {
  background: #fff !important;
  border-color: var(--sadaa-calendar-primary) !important;
  color: var(--sadaa-calendar-dark) !important;
  font-weight: 500 !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.today:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.today:focus {
  background: var(--sadaa-calendar-primary) !important;
  border-color: var(--sadaa-calendar-primary) !important;
  color: #fff !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.selected,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.startRange,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.endRange,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.selected:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.startRange:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.endRange:hover {
  background: var(--sadaa-calendar-selected-bg) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 6px 14px rgba(var(--sadaa-calendar-primary-rgb), .22) !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.prevMonthDay,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.nextMonthDay {
  color: #b7bdc8 !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.flatpickr-disabled,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.flatpickr-disabled:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.notAllowed,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day.notAllowed:hover {
  background: transparent !important;
  border-color: transparent !important;
  color: #d1d5db !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day:focus-visible,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-prev-month:focus-visible,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-next-month:focus-visible {
  outline: 2px solid rgba(var(--sadaa-calendar-primary-rgb), .30) !important;
  outline-offset: 2px !important;
}

/* Time picker — جاهز للاستخدام مع enableTime بدون إنشاء Theme مستقل. */
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-time {
  height: 48px !important;
  max-height: 48px !important;
  border-top: 1px solid var(--sadaa-line, #e5e7eb) !important;
  background: #fff !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-time input,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-time .flatpickr-am-pm,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-time .flatpickr-time-separator {
  color: var(--sadaa-text, #111827) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-time input:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-time input:focus,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-time .flatpickr-am-pm:hover,
body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-time .flatpickr-am-pm:focus {
  background: var(--sadaa-calendar-hover-bg) !important;
  outline: none !important;
}

@media (max-width: 420px) {
  body .flatpickr-calendar.sadaa-calendar.sadaa-calendar {
    width: min(320px, calc(100vw - 24px)) !important;
    min-width: 0 !important;
  }

  body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-weekdays {
    padding-inline: 12px !important;
  }

  body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-days {
    padding: 7px 12px 9px !important;
  }

  body .flatpickr-calendar.sadaa-calendar.sadaa-calendar .flatpickr-day {
    width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    line-height: 30px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body .flatpickr-calendar.sadaa-calendar.sadaa-calendar.open {
    animation: none !important;
  }
}

/* =========================================================
   File Upload / Media Inputs System — v1.0
   مكوّنات مركزية لرفع الملفات والصور ومعاينة الوسائط.
   يدعم ثلاثة أنماط:
   1) sadaa-file-native  : input[type=file] عادي.
   2) sadaa-file-control : حقل مخصص مع زر + اسم ملف + إزالة.
   3) sadaa-upload-zone  : منطقة سحب/إفلات ومعاينة للصور/الفيديو.
   ========================================================= */

/* ---------- Native file input ---------- */
.sadaa-file-native.sadaa-file-native {
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--sadaa-control-lg, 46px) !important;
  box-sizing: border-box !important;
  padding: 5px 6px !important;
  border: 1px solid var(--sadaa-line, #e5e7eb) !important;
  border-radius: var(--sadaa-radius-field, 8px) !important;
  background: var(--sadaa-surface, #fff) !important;
  color: var(--sadaa-text-2, #374151) !important;
  font-family: inherit !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
  outline: none !important;
  box-shadow: none !important;
  transition:
    border-color var(--sadaa-transition-base, 180ms ease),
    box-shadow var(--sadaa-transition-base, 180ms ease),
    background-color var(--sadaa-transition-base, 180ms ease) !important;
}

.sadaa-file-native.sadaa-file-native:hover:not(:disabled) {
  border-color: var(--sadaa-line-3, #cbd5e1) !important;
}

.sadaa-file-native.sadaa-file-native:focus,
.sadaa-file-native.sadaa-file-native:focus-visible {
  border-color: var(--sadaa-primary) !important;
  box-shadow: 0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb), .13)) !important;
  outline: none !important;
}

.sadaa-file-native.sadaa-file-native:disabled {
  cursor: not-allowed !important;
  opacity: .64 !important;
  background: var(--sadaa-tint-3, #f8fafc) !important;
}

.sadaa-file-native.sadaa-file-native::file-selector-button {
  min-height: 34px !important;
  margin: 0 0 0 9px !important;
  padding: 6px 11px !important;
  border: 1px solid var(--sadaa-line-2, #d1d5db) !important;
  border-radius: 6px !important;
  background: var(--sadaa-tint-3, #f8fafc) !important;
  color: var(--sadaa-primary-dark) !important;
  font: inherit !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition:
    border-color var(--sadaa-transition-base, 180ms ease),
    background-color var(--sadaa-transition-base, 180ms ease),
    color var(--sadaa-transition-base, 180ms ease) !important;
}

.sadaa-file-native.sadaa-file-native:hover:not(:disabled)::file-selector-button {
  border-color: var(--sadaa-line-3, #cbd5e1) !important;
  background: var(--sadaa-tint, #f4f9fb) !important;
  color: var(--sadaa-primary) !important;
}

.sadaa-file-native--admin.sadaa-file-native--admin:focus,
.sadaa-file-native--admin.sadaa-file-native--admin:focus-visible {
  border-color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  box-shadow: 0 0 0 3px rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .10) !important;
}

.sadaa-file-native--admin.sadaa-file-native--admin::file-selector-button {
  border-color: var(--sadaa-admin-soft-line, var(--sadaa-line-2, #d1d5db)) !important;
  background: var(--sadaa-admin-soft, var(--sadaa-tint-3, #f8fafc)) !important;
  color: var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
}

/* ---------- Compact custom file control ---------- */
.sadaa-file-control.sadaa-file-control {
  --sadaa-file-control-height: 46px;
  position: relative !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--sadaa-file-control-height) !important;
  height: var(--sadaa-file-control-height) !important;
  box-sizing: border-box !important;
  padding: 5px 6px !important;
  overflow: hidden !important;
  border: 1px solid var(--sadaa-line, #e5e7eb) !important;
  border-radius: var(--sadaa-radius-field, 8px) !important;
  background: var(--sadaa-surface, #fff) !important;
  box-shadow: 0 1px 0 rgba(17,24,39,.02) !important;
  transition:
    border-color var(--sadaa-transition-base, 180ms ease),
    box-shadow var(--sadaa-transition-base, 180ms ease),
    background-color var(--sadaa-transition-base, 180ms ease) !important;
}

.sadaa-file-control--lg.sadaa-file-control--lg {
  --sadaa-file-control-height: 52px;
}

.sadaa-file-control.sadaa-file-control:hover {
  border-color: var(--sadaa-line-3, #cbd5e1) !important;
}

.sadaa-file-control.sadaa-file-control:focus-within {
  border-color: var(--sadaa-primary) !important;
  box-shadow: 0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb), .13)) !important;
}

.sadaa-file-control.sadaa-file-control .sadaa-file-input,
.sadaa-upload-zone.sadaa-upload-zone .sadaa-file-input,
.sadaa-file-input.sadaa-file-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
}

.sadaa-file-control.sadaa-file-control .sadaa-file-trigger {
  position: static !important;
  z-index: 1 !important;
  width: auto !important;
  max-width: none !important;
  min-height: calc(var(--sadaa-file-control-height) - 10px) !important;
  height: calc(var(--sadaa-file-control-height) - 10px) !important;
  margin: 0 !important;
  padding: 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  border: 1px solid var(--sadaa-line-2, #d1d5db) !important;
  border-radius: 6px !important;
  background: var(--sadaa-tint-3, #f8fafc) !important;
  color: var(--sadaa-primary-dark) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition:
    border-color var(--sadaa-transition-base, 180ms ease),
    background-color var(--sadaa-transition-base, 180ms ease),
    color var(--sadaa-transition-base, 180ms ease) !important;
}

.sadaa-file-control.sadaa-file-control .sadaa-file-trigger:hover {
  border-color: var(--sadaa-line-3, #cbd5e1) !important;
  background: var(--sadaa-tint, #f4f9fb) !important;
  color: var(--sadaa-primary) !important;
}

.sadaa-file-control.sadaa-file-control .sadaa-file-name {
  position: static !important;
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--sadaa-muted, #6b7280) !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  text-align: start !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sadaa-file-control.sadaa-file-control.has-file .sadaa-file-name {
  padding: 0 !important;
  color: var(--sadaa-text-2, #374151) !important;
}

.sadaa-file-control.sadaa-file-control .sadaa-file-remove {
  position: static !important;
  z-index: 1 !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--sadaa-line, #e5e7eb) !important;
  border-radius: 6px !important;
  background: var(--sadaa-surface, #fff) !important;
  color: var(--sadaa-muted, #6b7280) !important;
  cursor: pointer !important;
}

.sadaa-file-control.sadaa-file-control .sadaa-file-remove:hover {
  border-color: #fecaca !important;
  background: #fff7f7 !important;
  color: var(--sadaa-danger, #b42318) !important;
}

.sadaa-file-control.sadaa-file-control .sadaa-file-remove:focus-visible {
  outline: none !important;
  border-color: var(--sadaa-primary) !important;
  box-shadow: 0 0 0 3px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb), .13)) !important;
}

.sadaa-file-control.sadaa-file-control .sadaa-file-remove[hidden] {
  display: none !important;
}

/* ---------- Drag & drop / media upload zone ---------- */
.sadaa-upload-zone.sadaa-upload-zone.sadaa-upload-zone {
  --sadaa-upload-zone-min-height: 166px;
  --sadaa-upload-zone-padding: 16px;
  position: relative !important;
  min-width: 0 !important;
  min-height: var(--sadaa-upload-zone-min-height) !important;
  box-sizing: border-box !important;
  padding: var(--sadaa-upload-zone-padding) !important;
  border: 1.5px dashed var(--sadaa-line-3, #cbd5e1) !important;
  border-radius: var(--sadaa-radius-lg, 10px) !important;
  background: linear-gradient(180deg, var(--sadaa-surface, #fff), var(--sadaa-tint-3, #f8fafc)) !important;
  color: var(--sadaa-text-2, #374151) !important;
  cursor: pointer !important;
  outline: none !important;
  transition:
    border-color var(--sadaa-transition-base, 180ms ease),
    background-color var(--sadaa-transition-base, 180ms ease),
    box-shadow var(--sadaa-transition-base, 180ms ease),
    transform var(--sadaa-transition-base, 180ms ease) !important;
}

.sadaa-upload-zone--media.sadaa-upload-zone--media {
  --sadaa-upload-zone-min-height: 206px;
  --sadaa-upload-zone-padding: 22px;
}

.sadaa-upload-zone--compact.sadaa-upload-zone--compact {
  --sadaa-upload-zone-min-height: 166px;
  --sadaa-upload-zone-padding: 16px;
}

.sadaa-upload-zone--image.sadaa-upload-zone--image {
  --sadaa-upload-zone-min-height: 255px;
  --sadaa-upload-zone-padding: 12px;
}

.sadaa-upload-zone.sadaa-upload-zone.sadaa-upload-zone:hover,
.sadaa-upload-zone.sadaa-upload-zone.sadaa-upload-zone.is-dragging,
.sadaa-upload-zone.sadaa-upload-zone.sadaa-upload-zone:focus-visible,
.sadaa-upload-zone.sadaa-upload-zone.sadaa-upload-zone:focus-within {
  border-color: var(--sadaa-primary) !important;
  background: var(--sadaa-tint-3, #f8fafc) !important;
  box-shadow: 0 0 0 4px var(--sadaa-focus, rgba(var(--sadaa-primary-rgb), .10)) !important;
}

.sadaa-upload-zone--admin.sadaa-upload-zone--admin:hover,
.sadaa-upload-zone--admin.sadaa-upload-zone--admin.is-dragging,
.sadaa-upload-zone--admin.sadaa-upload-zone--admin:focus-visible,
.sadaa-upload-zone--admin.sadaa-upload-zone--admin:focus-within {
  border-color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  background: var(--sadaa-admin-soft, var(--sadaa-tint-3, #f8fafc)) !important;
  box-shadow: 0 0 0 4px rgba(var(--sadaa-admin-primary-rgb, var(--sadaa-primary-rgb)), .10) !important;
}

.sadaa-upload-zone.sadaa-upload-zone.sadaa-upload-zone.is-dragging {
  transform: translateY(-1px) !important;
}

.sadaa-upload-zone.sadaa-upload-zone.sadaa-upload-zone.is-invalid-field,
.sadaa-upload-zone.sadaa-upload-zone.sadaa-upload-zone[aria-invalid="true"] {
  border-color: var(--sadaa-danger, #b42318) !important;
  background: #fff8f8 !important;
  box-shadow: 0 0 0 3px rgba(180,35,24,.10) !important;
}

.sadaa-upload-zone__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  text-align: center;
}

.sadaa-upload-zone__icon {
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--sadaa-line-2, #d1d5db);
  border-radius: var(--sadaa-radius-field, 8px);
  background: var(--sadaa-tint-2, #eef7fa);
  color: var(--sadaa-primary);
  font-size: 21px;
}

.sadaa-upload-zone__title {
  color: var(--sadaa-text, #111827);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.75;
}

.sadaa-upload-zone__note,
.sadaa-upload-help {
  color: var(--sadaa-muted, #6b7280);
  font-size: 12px;
  line-height: 1.8;
}

.sadaa-upload-preview {
  width: 100%;
  min-width: 0;
}

.sadaa-upload-preview[hidden] {
  display: none !important;
}

.sadaa-upload-preview__media {
  overflow: hidden;
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-field, 8px);
  background: var(--sadaa-tint-3, #f8fafc);
}

.sadaa-upload-preview__media img,
.sadaa-upload-preview__media video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.sadaa-upload-preview__info {
  min-width: 0;
}

.sadaa-upload-preview__name {
  overflow: hidden;
  color: var(--sadaa-text, #111827);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.7;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sadaa-upload-preview__meta {
  color: var(--sadaa-muted, #6b7280);
  font-size: 11.5px;
  line-height: 1.75;
}

.sadaa-upload-preview__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}

.sadaa-upload-action.sadaa-upload-action {
  min-height: 36px !important;
  padding: 7px 10px !important;
  border: 1px solid var(--sadaa-line-2, #d1d5db) !important;
  border-radius: 7px !important;
  background: var(--sadaa-surface, #fff) !important;
  color: var(--sadaa-text-2, #374151) !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  cursor: pointer !important;
  transition:
    border-color var(--sadaa-transition-base, 180ms ease),
    background-color var(--sadaa-transition-base, 180ms ease),
    color var(--sadaa-transition-base, 180ms ease) !important;
}

.sadaa-upload-action.sadaa-upload-action:hover,
.sadaa-upload-action.sadaa-upload-action:focus-visible {
  border-color: var(--sadaa-primary) !important;
  background: var(--sadaa-tint-3, #f8fafc) !important;
  color: var(--sadaa-primary-dark) !important;
  outline: none !important;
}

.sadaa-upload-action--danger.sadaa-upload-action--danger:hover,
.sadaa-upload-action--danger.sadaa-upload-action--danger:focus-visible {
  border-color: #fecaca !important;
  background: #fff7f7 !important;
  color: var(--sadaa-danger, #b42318) !important;
}

@media (max-width: 720px) {
  .sadaa-file-control.sadaa-file-control {
    gap: 6px !important;
  }

  .sadaa-file-control.sadaa-file-control .sadaa-file-trigger {
    padding-inline: 10px !important;
  }

  .sadaa-upload-zone--media.sadaa-upload-zone--media,
  .sadaa-upload-zone--compact.sadaa-upload-zone--compact {
    --sadaa-upload-zone-padding: 14px;
  }

  .sadaa-upload-zone--image.sadaa-upload-zone--image {
    --sadaa-upload-zone-min-height: 0px;
    --sadaa-upload-zone-padding: 10px;
  }
}

/* =========================================================
   Async / Loading States — v1.0
   حالات التحميل والأخطاء المؤقتة ومنع الصلاحية.
   ========================================================= */
.sadaa-async-host--loading {
  display: grid !important;
  place-items: center;
  align-content: center;
}

.sadaa-async-state {
  --sadaa-async-tone: var(--sadaa-primary);
  --sadaa-async-soft: var(--sadaa-tint-3, #f8fafc);
  width: min(100%, 520px);
  min-width: 0;
  min-height: 120px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 26px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  background: var(--sadaa-surface, #fff);
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  color: var(--sadaa-muted, #6b7280);
  font-family: inherit;
}

.sadaa-async-state__icon,
.sadaa-async-state__spinner {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  box-sizing: border-box;
}

.sadaa-async-state__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--sadaa-async-soft);
  color: var(--sadaa-async-tone);
  font-size: 15px;
}

.sadaa-async-state__spinner {
  border: 3px solid var(--sadaa-line, #e5e7eb);
  border-top-color: var(--sadaa-async-tone);
  border-radius: 50%;
  animation: sadaa-async-spin .75s linear infinite;
}

.sadaa-async-state__title {
  margin: 0;
  color: var(--sadaa-text, #111827);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.7;
}

.sadaa-async-state__message {
  margin: 0;
  color: var(--sadaa-muted, #6b7280);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
}

.sadaa-async-state--loading {
  --sadaa-async-tone: var(--sadaa-admin-primary, var(--sadaa-primary));
}

.sadaa-async-state--error {
  --sadaa-async-tone: #b42318;
  --sadaa-async-soft: #fff1f0;
  border-color: #f3c7c3;
}

.sadaa-async-state--locked {
  --sadaa-async-tone: #475467;
  --sadaa-async-soft: #f2f4f7;
}

.sadaa-async-state--inline {
  width: 100%;
  min-height: 100px;
  border-color: transparent;
  background: transparent;
}

/* توافق رجعي لأي مسار قديم لم يُرحّل بعد. */
.loading-message {
  box-sizing: border-box;
  margin: 0;
  padding: 28px 20px;
  background: var(--sadaa-surface, #fff);
  border: 1px solid var(--sadaa-line, #e5e7eb);
  border-radius: var(--sadaa-radius-md, 8px);
  color: var(--sadaa-muted, #6b7280);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
}

@keyframes sadaa-async-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .sadaa-async-state__spinner {
    animation-duration: 1.5s;
  }
}

@media (max-width: 640px) {
  .sadaa-async-state {
    width: 100%;
    min-height: 108px;
    padding: 22px 16px;
  }
}

/* =========================================================
   Accordion / Collapsible Sections — v1.0
   أقسام الفتح والإغلاق المركزية في صدى المتاجر
   تعتمد على <details>/<summary> للحفاظ على الوصول بدون JavaScript.
   ========================================================= */
.sadaa-accordion {
  --sadaa-accordion-accent: var(--sadaa-primary);
  --sadaa-accordion-border: var(--sadaa-line, #e5e7eb);
  --sadaa-accordion-soft: var(--sadaa-surface-alt, #fafafa);
  --sadaa-accordion-bg: var(--sadaa-surface, #fff);
  --sadaa-accordion-radius: var(--sadaa-radius-md, 8px);

  margin: 0;
  overflow: hidden;
  border: 1px solid var(--sadaa-accordion-border);
  border-radius: var(--sadaa-accordion-radius);
  background: var(--sadaa-accordion-bg);
  color: var(--sadaa-text, #111827);
}

.sadaa-accordion--admin {
  --sadaa-accordion-accent: var(--sadaa-admin-primary, var(--sadaa-primary));
  --sadaa-accordion-border: var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb));
  --sadaa-accordion-soft: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #fafafa));
}

.sadaa-accordion__summary {
  min-width: 0;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  box-sizing: border-box;
  list-style: none;
  border-bottom: 1px solid transparent;
  background: var(--sadaa-accordion-bg);
  color: var(--sadaa-text-2, #374151);
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition:
    background-color var(--sadaa-transition-fast, 160ms ease),
    border-color var(--sadaa-transition-fast, 160ms ease),
    color var(--sadaa-transition-fast, 160ms ease);
}

.sadaa-accordion__summary::-webkit-details-marker {
  display: none;
}

.sadaa-accordion__summary::marker {
  content: "";
}

.sadaa-accordion__summary:hover {
  background: var(--sadaa-accordion-soft);
}

.sadaa-accordion__summary:focus-visible {
  outline: 3px solid var(--sadaa-focus, rgba(var(--sadaa-primary-rgb), .14));
  outline-offset: -3px;
}

.sadaa-accordion[open] > .sadaa-accordion__summary {
  border-bottom-color: var(--sadaa-accordion-border);
  background: var(--sadaa-accordion-soft);
}

.sadaa-accordion__title {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.7;
}

.sadaa-accordion__title > i,
.sadaa-accordion__title > svg {
  flex: 0 0 auto;
  color: var(--sadaa-accordion-accent);
}

.sadaa-accordion__side {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.sadaa-accordion__meta {
  min-height: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 8px;
  border: 1px solid color-mix(in srgb, var(--sadaa-accordion-accent) 22%, var(--sadaa-accordion-border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--sadaa-accordion-accent) 7%, #fff);
  color: color-mix(in srgb, var(--sadaa-accordion-accent) 82%, #111827);
  font-size: 11.5px;
  line-height: 1.3;
  white-space: nowrap;
}

.sadaa-accordion__chevron {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  position: relative;
  display: grid;
  place-items: center;
  padding: 0;
  line-height: 1;
  box-sizing: border-box;
  border: 1px solid var(--sadaa-accordion-border);
  border-radius: 6px;
  background: var(--sadaa-accordion-bg);
  color: var(--sadaa-muted, #6b7280);
  transition:
    transform var(--sadaa-transition-fast, 160ms ease),
    color var(--sadaa-transition-fast, 160ms ease),
    border-color var(--sadaa-transition-fast, 160ms ease);
}

.sadaa-accordion__chevron::before {
  content: "";
  width: 7px;
  height: 7px;
  border-inline-end: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transform-origin: center;
}

/* Optical centering for the closed chevron: the < shape needs a tiny
   physical shift to look visually centered inside its square button. */
.sadaa-accordion:not([open]) > .sadaa-accordion__summary .sadaa-accordion__chevron::before {
  position: relative;
  left: 1px;
}

.sadaa-accordion[open] > .sadaa-accordion__summary .sadaa-accordion__chevron {
  border-color: color-mix(in srgb, var(--sadaa-accordion-accent) 28%, var(--sadaa-accordion-border));
  color: var(--sadaa-accordion-accent);
}

.sadaa-accordion[open] > .sadaa-accordion__summary .sadaa-accordion__chevron::before {
  transform: rotate(-45deg);
}

.sadaa-accordion__body {
  min-width: 0;
  padding: 12px;
  background: var(--sadaa-accordion-bg);
}

.sadaa-accordion__body--flush {
  padding: 0;
}

/* داخل بطاقة موجودة مسبقاً: بدون إطار أو زوايا إضافية. */
.sadaa-accordion--flush {
  border-inline: 0;
  border-bottom: 0;
  border-radius: 0;
}

/* نسخة أصغر للمجموعات المتداخلة. */
.sadaa-accordion--compact > .sadaa-accordion__summary {
  min-height: 44px;
  padding: 8px 10px;
}

.sadaa-accordion--compact .sadaa-accordion__title {
  font-size: 13px;
}

.sadaa-accordion--compact .sadaa-accordion__chevron {
  width: 24px;
  height: 24px;
  flex-basis: 24px;
  border-radius: 5px;
}

.sadaa-accordion--compact .sadaa-accordion__meta {
  min-height: 23px;
  padding-inline: 7px;
  font-size: 11px;
}

@media (max-width: 640px) {
  .sadaa-accordion__summary {
    min-height: 46px;
    padding: 9px 10px;
  }

  .sadaa-accordion__title {
    font-size: 13px;
  }

  .sadaa-accordion__chevron {
    width: 26px;
    height: 26px;
    flex-basis: 26px;
  }
}


/* =========================================================
   Section / Panel Headers — v1.0
   رؤوس الأقسام الداخلية: عنوان + وصف + أيقونة/عداد.
   ========================================================= */
.sadaa-section-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-width:0;
  padding:14px 16px;
  border-bottom:1px solid var(--sadaa-line, #e5e7eb);
  background:var(--sadaa-surface, #fff);
}
.sadaa-section-head--admin { border-bottom-color:var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)); }
.sadaa-section-head--soft { background:var(--sadaa-surface-alt, #f8fafc); }
.sadaa-section-head--roomy {
  padding:20px 22px;
  flex-wrap:wrap;
  background:linear-gradient(180deg, #fff, var(--sadaa-surface-alt, #fbfbfd));
}
.sadaa-section-head.sadaa-section-head--inline {
  display:block;
  margin:0 0 12px;
  padding:0 0 12px;
  border:0;
  border-bottom:1px solid var(--sadaa-line, #e5e7eb);
  background:transparent;
}
.sadaa-section-head__main { display:flex; align-items:flex-start; gap:10px; min-width:0; }
.sadaa-section-head__copy { min-width:0; }
.sadaa-section-head__icon {
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border:1px solid var(--sadaa-line, #e5e7eb);
  border-radius:7px;
  background:var(--sadaa-surface-alt, #f8fafc);
  color:var(--sadaa-primary);
  font-size:14px;
}
.sadaa-section-head .sadaa-section-head__title {
  margin:0;
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--sadaa-text, #111827);
  font-size:15px;
  font-weight:500;
  line-height:1.6;
}
.sadaa-section-head--roomy .sadaa-section-head__title { font-size:18px; font-weight:600; }
.sadaa-section-head .sadaa-section-head__description {
  margin:3px 0 0;
  color:var(--sadaa-text-muted, #6b7280);
  font-size:12px;
  line-height:1.75;
}
.sadaa-section-head--roomy .sadaa-section-head__description { font-size:13px; line-height:1.8; }
.sadaa-section-head__meta {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:30px;
  padding:5px 9px;
  border:1px solid var(--sadaa-line, #e5e7eb);
  border-radius:7px;
  background:var(--sadaa-surface-alt, #f8fafc);
  color:var(--sadaa-text-muted, #475569);
  font-size:12px;
  white-space:nowrap;
}
.sadaa-section-head--admin .sadaa-section-head__icon { color:var(--sadaa-admin-primary, var(--sadaa-primary)); }
@media (max-width:640px) {
  .sadaa-section-head { align-items:flex-start; padding:12px; }
  .sadaa-section-head--roomy { padding:16px; }
  .sadaa-section-head__meta { min-height:28px; }
}


/* =========================================================
   Tablet Disclosure Headers — v1.2
   نفس فكرة رأس Accordion المدمج (مثل "صلاحيات المشرف"):
   صف خفيف + عنوان في جهة + سهم داخل زر مربع مستقل في الجهة المقابلة.
   الرأس الرمادي يمتد حتى حواف المنطقة، مع خط سفلي يفصله بصرياً عن المحتوى.
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {
  .sadaa-tablet-disclosure > .sadaa-tablet-disclosure__summary {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin: 0 !important;
    width: 100% !important;
    padding: 8px 10px !important;
    box-sizing: border-box !important;
    list-style: none !important;
    border: 0 !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 7px 7px 0 0 !important;
    background: var(--sadaa-admin-soft, #f7f8fa) !important;
    color: var(--sadaa-admin-text, var(--sadaa-text-2, #374151)) !important;
    cursor: pointer !important;
    user-select: none !important;
    -webkit-tap-highlight-color: transparent;
    transition: background-color var(--sadaa-transition-fast, 160ms ease),
                border-color var(--sadaa-transition-fast, 160ms ease);
  }

  .sadaa-tablet-disclosure > .sadaa-tablet-disclosure__summary::-webkit-details-marker {
    display: none !important;
  }

  .sadaa-tablet-disclosure > .sadaa-tablet-disclosure__summary::marker {
    content: "" !important;
  }

  /* لا نستخدم أي سهم مرسوم محلياً؛ السهم الوحيد هو مكوّن Accordion المركزي. */
  .sadaa-tablet-disclosure > .sadaa-tablet-disclosure__summary::after {
    content: none !important;
    display: none !important;
  }

  .sadaa-tablet-disclosure > .sadaa-tablet-disclosure__summary:hover,
  .sadaa-tablet-disclosure[open] > .sadaa-tablet-disclosure__summary {
    background: var(--sadaa-admin-soft, #f7f8fa) !important;
  }

  .sadaa-tablet-disclosure > .sadaa-tablet-disclosure__summary:focus-visible {
    outline: 3px solid var(--sadaa-admin-focus, var(--sadaa-focus, rgba(127, 70, 164, .14))) !important;
    outline-offset: -3px !important;
  }

  .sadaa-tablet-disclosure__title {
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    color: inherit !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    line-height: 1.7 !important;
  }

  .sadaa-tablet-disclosure__title > i,
  .sadaa-tablet-disclosure__title > svg {
    flex: 0 0 auto !important;
    color: var(--sadaa-accordion-accent, var(--sadaa-admin-primary, var(--sadaa-primary))) !important;
  }

  /* نفس زر السهم المربع الموجود في صف صلاحيات المشرف. */
  .sadaa-tablet-disclosure__chevron {
    width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 6px !important;
    background: #fff !important;
    color: var(--sadaa-muted, #6b7280) !important;
    line-height: 1 !important;
  }

  .sadaa-tablet-disclosure:not([open]) > .sadaa-tablet-disclosure__summary .sadaa-tablet-disclosure__chevron::before {
    position: relative;
    left: 1px;
    transform: rotate(45deg) !important;
  }

  .sadaa-tablet-disclosure[open] > .sadaa-tablet-disclosure__summary .sadaa-tablet-disclosure__chevron {
    border-color: color-mix(in srgb, var(--sadaa-admin-primary, var(--sadaa-primary)) 28%, var(--sadaa-admin-line, #e5e7eb)) !important;
    color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  }

  .sadaa-tablet-disclosure[open] > .sadaa-tablet-disclosure__summary .sadaa-tablet-disclosure__chevron::before {
    position: static;
    transform: rotate(-45deg) !important;
  }
}

/* =========================================================
   Tablet Search & Filter Controls — v1.4
   نظام موحّد لمناطق البحث والفلاتر والترتيب داخل لوحة التحكم على التابلت.
   يحافظ على نفس التنسيق المعتمد: حقل رئيسي + أزرار واضحة بارتفاع موحّد،
   مع شبكات فلاتر وترتيب قابلة لإعادة الاستخدام بين التبويبات.
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {
  .sadaa-tablet-disclosure__body {
    min-width: 0 !important;
    width: 100% !important;
    padding-top: 10px !important;
    box-sizing: border-box !important;
  }

  .sadaa-tablet-tools-stack {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .sadaa-tablet-tools-split {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .sadaa-tablet-search-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 132px 108px !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-wrap: nowrap !important;
  }

  .sadaa-tablet-search-row--one-action {
    grid-template-columns: minmax(0, 1fr) 132px !important;
  }

  .sadaa-tablet-search-row--with-filter {
    grid-template-columns: minmax(0, 1fr) minmax(125px, 160px) 112px 100px !important;
  }

  .sadaa-tablet-search-field {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    grid-column: auto !important;
    flex: none !important;
    flex-basis: auto !important;
  }

  .sadaa-tablet-search-field input,
  .sadaa-tablet-search-field select,
  .sadaa-tablet-search-row input,
  .sadaa-tablet-search-row select {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .sadaa-tablet-search-row > button,
  .sadaa-tablet-search-row > a,
  .sadaa-tablet-search-actions > button,
  .sadaa-tablet-search-actions > a {
    min-width: 0 !important;
    min-height: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }

  .sadaa-tablet-search-row > button,
  .sadaa-tablet-search-row > a {
    width: 100% !important;
  }

  .sadaa-tablet-search-actions {
    display: grid !important;
    grid-template-columns: repeat(2, auto) !important;
    align-items: center !important;
    gap: 7px !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .sadaa-tablet-search-actions > button,
  .sadaa-tablet-search-actions > a {
    width: auto !important;
    min-width: 86px !important;
  }

  .sadaa-tablet-filter-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .sadaa-tablet-filter-grid {
    display: grid !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .sadaa-tablet-filter-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .sadaa-tablet-filter-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .sadaa-tablet-filter-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }

  .sadaa-tablet-filter-grid > * {
    min-width: 0 !important;
  }

  .sadaa-tablet-filter-control,
  .sadaa-tablet-filter-control select,
  select.sadaa-tablet-filter-control,
  input.sadaa-tablet-filter-control {
    min-height: 40px !important;
    height: 40px !important;
    font-size: 12.5px !important;
    box-sizing: border-box !important;
  }

  .sadaa-tablet-filter-toolbar {
    display: grid !important;
    grid-template-columns: minmax(170px, 1.7fr) repeat(3, minmax(100px, 1fr)) auto auto !important;
    align-items: center !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .sadaa-tablet-filter-toolbar .sadaa-tablet-filter-label {
    display: none !important;
  }

  .sadaa-tablet-filter-toolbar > button,
  .sadaa-tablet-filter-toolbar > a {
    width: auto !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: 40px !important;
    padding-inline: 10px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }

  .sadaa-tablet-sort-group {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .sadaa-tablet-sort-inline {
    display: grid !important;
    grid-template-columns: auto minmax(176px, auto) !important;
    align-items: center !important;
    gap: 7px !important;
    width: auto !important;
    min-width: 0 !important;
  }

  .sadaa-tablet-sort-button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }

  .sadaa-tablet-action-grid {
    display: grid !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .sadaa-tablet-action-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .sadaa-tablet-action-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

  .sadaa-tablet-action-grid > button,
  .sadaa-tablet-action-grid > a {
    width: 100% !important;
    min-width: 0 !important;
  }

  .sadaa-tablet-grid-full {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  .sadaa-tablet-controls-row {
    display: grid !important;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* خارج نطاق التابلت: بعض الـ details ليست Accordion فعلياً، بل غلاف responsive فقط. */
@media (max-width: 720px), (min-width: 1101px) {
  .sadaa-tablet-disclosure--summary-only-tablet > .sadaa-tablet-disclosure__summary {
    display: none !important;
    pointer-events: none !important;
  }

  .sadaa-tablet-disclosure--summary-only-tablet:not([open]) > .sadaa-tablet-disclosure__body {
    display: block !important;
  }

  .sadaa-tablet-disclosure--body-contents-outside > .sadaa-tablet-disclosure__summary {
    display: none !important;
    pointer-events: none !important;
  }

  .sadaa-tablet-disclosure--body-contents-outside > .sadaa-tablet-disclosure__body,
  .sadaa-tablet-disclosure--body-contents-outside:not([open]) > .sadaa-tablet-disclosure__body {
    display: contents !important;
  }

  .sadaa-tablet-disclosure--contents-outside {
    display: contents !important;
  }

  .sadaa-tablet-disclosure--contents-outside > .sadaa-tablet-disclosure__summary {
    display: none !important;
    pointer-events: none !important;
  }

  .sadaa-tablet-disclosure--contents-outside > .sadaa-tablet-disclosure__body,
  .sadaa-tablet-disclosure--contents-outside:not([open]) > .sadaa-tablet-disclosure__body {
    display: contents !important;
  }

  .sadaa-tablet-disclosure--static-outside > .sadaa-tablet-disclosure__summary {
    pointer-events: none !important;
  }

  .sadaa-tablet-disclosure--static-outside:not([open]) > .sadaa-tablet-disclosure__body {
    display: block !important;
  }
}

/* =========================================================
   Admin Containers Authority — v1.2 — TABLET ONLY
   المرجع النهائي لحاويات البطاقات + البحث + الفلاتر على التابلت.
   النطاق: 721px–1100px فقط.
   أي تنسيق محلي سابق لهذه الأسطح يتم تجاوزه هنا لضمان التطابق بين التبويبات.
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {
  .sadaa-admin-card,
  .sadaa-admin-stat-card {
    box-sizing: border-box !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    background: var(--sadaa-surface, #fff) !important;
  }

  .sadaa-admin-card {
    box-shadow: 0 8px 22px rgba(var(--sadaa-admin-dark-rgb, var(--sadaa-shadow-rgb, 17,24,39)), .045) !important;
  }

  .sadaa-admin-card--flat,
  .sadaa-admin-stat-card {
    box-shadow: none !important;
  }

  .sadaa-admin-stat-card,
  .sadaa-admin-list-shell,
  .sadaa-admin-stats-grid,
  .sadaa-tablet-records-shell,
  .sadaa-tablet-records-stack {
    min-width: 0 !important;
  }

  /* الأغلفة البنيوية لا ترسم سطحاً إضافياً؛ السطح الحقيقي للقائمة هو records-shell. */
  .sadaa-admin-list-shell,
  html body #tabContent .sadaa-admin-list-shell {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  /* ---------------------------------------------------------
     Search / Filter container — مصدر واحد لكل التبويبات
     --------------------------------------------------------- */
  .sadaa-admin-tools-card,
  html body #tabContent .sadaa-admin-tools-card {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    background: var(--sadaa-surface, #fff) !important;
    color: var(--sadaa-admin-text, var(--sadaa-text, #111827)) !important;
    box-shadow: none !important;
  }

  .sadaa-admin-tools-card:last-child,
  html body #tabContent .sadaa-admin-tools-card:last-child {
    margin-bottom: 0 !important;
  }

  .sadaa-admin-tools-card > .sadaa-tablet-disclosure__summary,
  html body #tabContent .sadaa-admin-tools-card > .sadaa-tablet-disclosure__summary {
    width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 9px 14px !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 7px 7px 0 0 !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow: none !important;
  }

  .sadaa-admin-tools-card > .sadaa-tablet-disclosure__body,
  html body #tabContent .sadaa-admin-tools-card > .sadaa-tablet-disclosure__body {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 12px !important;
    box-sizing: border-box !important;
    background: var(--sadaa-surface, #fff) !important;
  }

  .sadaa-admin-tools-card .sadaa-tablet-disclosure__title,
  html body #tabContent .sadaa-admin-tools-card .sadaa-tablet-disclosure__title {
    margin: 0 !important;
  }

  /* ---------------------------------------------------------
     Cards-list container — نفس الحد والخلفية والمسافة في كل القوائم
     --------------------------------------------------------- */
  .sadaa-tablet-records-shell,
  html body #tabContent .sadaa-tablet-records-shell {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow: none !important;
  }

  .sadaa-tablet-records-stack,
  html body #tabContent .sadaa-tablet-records-stack {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
  }

  /* بطاقات السجلات داخل الحاوية الموحدة. */
  .sadaa-tablet-records-shell .sadaa-admin-record-card,
  html body #tabContent .sadaa-tablet-records-shell .sadaa-admin-record-card {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-top: 3px solid var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  /* الحالات الفارغة تملأ نفس الحاوية بدون إنشاء سطح ثانٍ. */
  .sadaa-tablet-records-shell .sadaa-empty-state,
  .sadaa-tablet-records-shell .orders-grid-row.empty,
  .sadaa-tablet-records-shell .finance-empty-row,
  html body #tabContent .sadaa-tablet-records-shell .sadaa-empty-state,
  html body #tabContent .sadaa-tablet-records-shell .orders-grid-row.empty,
  html body #tabContent .sadaa-tablet-records-shell .finance-empty-row {
    margin: 0 !important;
    border-radius: 7px !important;
  }
}

/* =========================================================
   Tablet Containers — Quick Corrections v1.3
   ملاحظات 2026-09-25
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* ---------------------------------------------------------
     المستخدمون:
     إزالة الغلاف البنيوي الخفي المباشر خلف البطاقات، مع إبقاء
     حاوية السجلات الموحدة هي السطح الوحيد للقائمة.
     --------------------------------------------------------- */
  html body #tabContent .users-tab-soft .users-list-wrap.sadaa-tablet-records-shell {
    display: grid !important;
    gap: 10px !important;
  }

  html body #tabContent .users-tab-soft .users-list.sadaa-tablet-records-stack {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* ---------------------------------------------------------
     المشرفون:
     الاعتماد على الحاوية الخلفية فقط وإلغاء السطح المباشر خلف
     البطاقات، مع زوايا موحدة للحاوية الخلفية.
     --------------------------------------------------------- */
  html body #tabContent .moderators-tab .moderators-panel.sadaa-admin-list-shell {
    padding: 10px !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .moderators-tab .moderators-panel .sadaa-tablet-records-shell {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body #tabContent .moderators-tab .moderators-grid.sadaa-tablet-records-stack {
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  /* ---------------------------------------------------------
     أكواد الخصم:
     إزالة الغلاف البنيوي الخفي المباشر خلف البطاقات.
     --------------------------------------------------------- */
  html body #tabContent .coupons-tab-ui .mc-list-wrap.sadaa-tablet-records-shell {
    display: grid !important;
    gap: 10px !important;
  }

  html body #tabContent .coupons-tab-ui .mc-list.sadaa-tablet-records-stack {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* إلغاء الحد البنفسجي أعلى بطاقات أكواد الخصم. */
  html body #tabContent .coupons-tab-ui .mc-list-wrap .mc-row.sadaa-admin-record-card {
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  /* ---------------------------------------------------------
     الرسائل البريدية:
     إلغاء الحد البنفسجي أعلى بطاقات السجلات.
     --------------------------------------------------------- */
  html body #tabContent .newsletter-admin .newsletter-table-wrap
  .newsletter-table tbody tr.sadaa-admin-record-card {
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  /* ---------------------------------------------------------
     تقرير الطلبات:
     إزالة الحاوية الخارجية خلف منطقتي البحث والفلاتر نهائياً
     بصرياً، والإبقاء على المنطقتين المستقلتين فقط.
     --------------------------------------------------------- */
  html body #tabContent .finance-tab .finance-filter-card,
  html body #tabContent .finance-tab .finance-filter-card.sadaa-admin-list-shell,
  html body #tabContent .finance-tab .finance-filter-card.sadaa-admin-card {
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .finance-tab .finance-filter-grid {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* إلغاء الحد البنفسجي أعلى بطاقات تقرير الطلبات. */
  html body #tabContent .finance-tab .finance-table-wrap
  .finance-order-row.sadaa-admin-record-card {
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }
}

/* =========================================================
   Tablet Refinements — Round 4 — 2026-09-25
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* المشرفون: إزالة الحاوية الخلفية والإبقاء على البحث وحاوية البطاقات. */
  html body #tabContent .moderators-tab .moderators-panel.sadaa-admin-list-shell {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .moderators-tab .moderators-panel .sadaa-tablet-records-shell {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 10px !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .moderators-tab .moderators-grid.sadaa-tablet-records-stack {
    gap: 10px !important;
  }

  html body #tabContent .moderators-tab .moderators-save-bar {
    position: static !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 10px 12px !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    background: var(--sadaa-surface, #fff) !important;
    box-shadow: none !important;
  }

  html body #tabContent .moderators-tab .moderators-save-bar .moderators-muted {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html body #tabContent .moderators-tab .moderators-save-bar button,
  html body #tabContent .moderators-tab .moderators-save-bar .moderators-btn {
    width: auto !important;
    min-width: 200px !important;
    min-height: 42px !important;
    padding: 8px 16px !important;
    justify-self: start !important;
    border-radius: 7px !important;
    white-space: nowrap !important;
  }

  /* العروض: إبقاء حاوية "قائمة العروض" وإزالة السطح الداخلي الإضافي. */
  html body #tabContent .offers-tab-ui .offers-current-card-body
  .offers-table-wrap.sadaa-tablet-records-shell {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .offers-tab-ui .offers-current-card-body
  .offers-table tbody.sadaa-tablet-records-stack {
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  html body #tabContent .offers-tab-ui .offers-status {
    min-width: 64px !important;
    min-height: 26px !important;
    padding: 4px 9px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    gap: 0 !important;
    white-space: nowrap !important;
  }

  html body #tabContent .offers-tab-ui .offers-status::before {
    content: none !important;
    display: none !important;
  }

  html body #tabContent .offers-tab-ui .offers-status.is-active {
    background: #ecfdf3 !important;
    color: #166534 !important;
    border-color: #bbf7d0 !important;
  }

  html body #tabContent .offers-tab-ui .offers-status.is-expired {
    background: #fffbeb !important;
    color: #92400e !important;
    border-color: #fde68a !important;
  }

  html body #tabContent .offers-tab-ui .offers-status:not(.is-active):not(.is-expired) {
    background: var(--sadaa-admin-soft, #f3f4f6) !important;
    color: var(--sadaa-admin-dark) !important;
    border-color: var(--sadaa-admin-soft-line, #d1d5db) !important;
  }

  /* الرسائل البريدية: إعادة الفواصل الداخلية في البطاقة الأخيرة. */
  html body #tabContent .newsletter-admin .newsletter-table
  tbody tr:last-child > td:not(:last-child) {
    border-bottom: 1px solid #eef0f3 !important;
  }

  html body #tabContent .newsletter-admin .newsletter-table
  tbody tr:last-child > td:last-child {
    border-bottom: 0 !important;
  }

  /* تقرير الطلبات: إزالة الحاوية الخلفية والإبقاء على الحاوية المباشرة للبطاقات. */
  html body #tabContent .finance-tab .finance-table-card.sadaa-admin-card {
    margin-bottom: 14px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .finance-tab
  .finance-table-wrap.sadaa-tablet-records-shell {
    width: 100% !important;
    margin: 0 !important;
    padding: 10px !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .finance-tab
  .finance-table-wrap > .finance-pagination {
    width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 10px 0 0 !important;
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    justify-content: center !important;
  }
}

/* =========================================================
   Tablet Refinements — Round 5 — 2026-09-26
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* =======================================================
     أكواد الخصم
     إزالة الخط أسفل صف "تاريخ النهاية" داخل بطاقة الكوبون.
     ======================================================= */
  html body #tabContent .coupons-tab-ui
  .mc-row.sadaa-admin-record-card
  > .mc-cell[data-label="تاريخ النهاية"] {
    border-bottom: 0 !important;
  }

  /* =======================================================
     المشرفون
     إزالة الحاوية الخلفية العامة نهائياً والإبقاء فقط على
     حاوية السجلات المباشرة خلف بطاقات المشرفين.
     ======================================================= */
  html body #tabContent .moderators-tab
  > .moderators-panel.sadaa-admin-list-shell {
    display: contents !important;
  }

  html body #tabContent .moderators-tab
  .sadaa-tablet-records-shell {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 10px !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow: none !important;
  }

  /* إزالة الحد البنفسجي العام أعلى بطاقة المشرف.
     هذا الحد كان قادماً من sadaa-admin-record-card ويظهر كتداخل
     مع الزوايا العلوية للبطاقة ورأسها البنفسجي. */
  html body #tabContent .moderators-tab
  .moderator-card.sadaa-admin-record-card {
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: var(--sadaa-radius-md, 8px) !important;
    overflow: hidden !important;
  }

  /* رأس البطاقة يلتصق مباشرة بأعلى البطاقة ويأخذ نفس الزوايا
     بدون وجود شريط أو فراغ بصري إضافي فوقه. */
  html body #tabContent .moderators-tab
  .moderator-card > .moderator-card-head {
    margin: 0 !important;
    border-radius: 0 !important;
  }
}

/* =========================================================
   Tablet Refinements — Round 6 — 2026-09-26
   إزالة الحاوية البيضاء الخلفية في تبويب المشرفين.
   السبب: قاعدة form العامة القديمة في dashboard.css.
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {
  html body #tabContent .moderators-tab #moderatorsPermissionsForm {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

/* =========================================================
   Mobile Admin Design System Alignment — v1.0 — 2026-09-26
   نقل الشكل المعتمد على التابلت إلى شاشات الجوال مع تكييف
   الأبعاد والتخطيط للشاشات <= 720px.
   ========================================================= */
@media (max-width: 720px) {

  /* ---------------------------------------------------------
     Cards / surfaces — نفس لغة التابلت مع مقاسات جوال
     --------------------------------------------------------- */
  html body #tabContent .sadaa-admin-card,
  html body #tabContent .sadaa-admin-stat-card {
    box-sizing: border-box !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 8px !important;
    background: var(--sadaa-surface, #fff) !important;
  }

  html body #tabContent .sadaa-admin-card {
    box-shadow: 0 6px 18px rgba(var(--sadaa-admin-dark-rgb, var(--sadaa-shadow-rgb, 17,24,39)), .035) !important;
  }

  html body #tabContent .sadaa-admin-card--flat,
  html body #tabContent .sadaa-admin-stat-card {
    box-shadow: none !important;
  }

  /* الأغلفة البنيوية لا ترسم سطحاً إضافياً. */
  html body #tabContent .sadaa-admin-list-shell {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  /* ---------------------------------------------------------
     Search / Filters container — نفس الشكل المعتمد في التابلت
     --------------------------------------------------------- */
  html body #tabContent .sadaa-admin-tools-card {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 9px !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 8px !important;
    background: var(--sadaa-surface, #fff) !important;
    color: var(--sadaa-admin-text, var(--sadaa-text, #111827)) !important;
    box-shadow: none !important;
  }

  html body #tabContent .sadaa-admin-tools-card:last-child {
    margin-bottom: 0 !important;
  }

  /* خارج التابلت كان summary مخفياً؛ على الجوال نعيد نفس رأس التابلت. */
  html body #tabContent .sadaa-admin-tools-card.sadaa-tablet-disclosure,
  html body #tabContent .sadaa-admin-tools-card.sadaa-tablet-disclosure--contents-outside {
    display: block !important;
  }

  html body #tabContent .sadaa-admin-tools-card > .sadaa-tablet-disclosure__summary {
    width: 100% !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    box-sizing: border-box !important;
    list-style: none !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    border: 0 !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 7px 7px 0 0 !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    color: var(--sadaa-admin-text, var(--sadaa-text-2, #374151)) !important;
    box-shadow: none !important;
  }

  html body #tabContent .sadaa-admin-tools-card > .sadaa-tablet-disclosure__summary::-webkit-details-marker {
    display: none !important;
  }

  html body #tabContent .sadaa-admin-tools-card > .sadaa-tablet-disclosure__summary::marker,
  html body #tabContent .sadaa-admin-tools-card > .sadaa-tablet-disclosure__summary::after {
    content: "" !important;
    display: none !important;
  }

  html body #tabContent .sadaa-admin-tools-card .sadaa-tablet-disclosure__title {
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 0 !important;
    color: inherit !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.6 !important;
  }

  html body #tabContent .sadaa-admin-tools-card .sadaa-tablet-disclosure__title > i,
  html body #tabContent .sadaa-admin-tools-card .sadaa-tablet-disclosure__title > svg {
    flex: 0 0 auto !important;
    color: var(--sadaa-accordion-accent, var(--sadaa-admin-primary, var(--sadaa-primary))) !important;
  }

  html body #tabContent .sadaa-admin-tools-card .sadaa-tablet-disclosure__chevron {
    width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 6px !important;
    background: #fff !important;
    color: var(--sadaa-muted, #6b7280) !important;
    box-sizing: border-box !important;
    line-height: 1 !important;
  }

  html body #tabContent .sadaa-admin-tools-card.sadaa-tablet-disclosure:not([open])
  > .sadaa-tablet-disclosure__summary .sadaa-tablet-disclosure__chevron::before {
    position: relative !important;
    left: 1px !important;
    transform: rotate(45deg) !important;
  }

  html body #tabContent .sadaa-admin-tools-card.sadaa-tablet-disclosure[open]
  > .sadaa-tablet-disclosure__summary .sadaa-tablet-disclosure__chevron {
    border-color: color-mix(in srgb, var(--sadaa-admin-primary, var(--sadaa-primary)) 28%, var(--sadaa-admin-line, #e5e7eb)) !important;
    color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  }

  html body #tabContent .sadaa-admin-tools-card.sadaa-tablet-disclosure[open]
  > .sadaa-tablet-disclosure__summary .sadaa-tablet-disclosure__chevron::before {
    position: static !important;
    transform: rotate(-45deg) !important;
  }

  /* إلغاء قاعدة outside القديمة التي كانت تُظهر الجسم دائماً على الجوال. */
  html body #tabContent .sadaa-admin-tools-card.sadaa-tablet-disclosure:not([open])
  > .sadaa-tablet-disclosure__body {
    display: none !important;
  }

  html body #tabContent .sadaa-admin-tools-card.sadaa-tablet-disclosure[open]
  > .sadaa-tablet-disclosure__body {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    background: var(--sadaa-surface, #fff) !important;
  }

  /* ---------------------------------------------------------
     Search / Filters internal layout
     --------------------------------------------------------- */
  html body #tabContent .sadaa-tablet-tools-stack,
  html body #tabContent .sadaa-tablet-tools-split {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html body #tabContent .sadaa-tablet-search-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body #tabContent .sadaa-tablet-search-row .sadaa-tablet-search-field,
  html body #tabContent .sadaa-tablet-search-row--with-filter .sadaa-tablet-search-field {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  html body #tabContent .sadaa-tablet-search-row input,
  html body #tabContent .sadaa-tablet-search-row select,
  html body #tabContent .sadaa-tablet-search-field input,
  html body #tabContent .sadaa-tablet-search-field select {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  html body #tabContent .sadaa-tablet-search-row > button,
  html body #tabContent .sadaa-tablet-search-row > a,
  html body #tabContent .sadaa-tablet-search-actions > button,
  html body #tabContent .sadaa-tablet-search-actions > a {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 7px 10px !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
  }

  html body #tabContent .sadaa-tablet-search-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html body #tabContent .sadaa-tablet-filter-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html body #tabContent .sadaa-tablet-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  html body #tabContent .sadaa-tablet-filter-grid--3 > :last-child:nth-child(odd),
  html body #tabContent .sadaa-tablet-filter-grid--4 > :last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
  }

  html body #tabContent .sadaa-tablet-filter-grid > *,
  html body #tabContent .sadaa-tablet-filter-control {
    min-width: 0 !important;
  }

  html body #tabContent .sadaa-tablet-filter-control,
  html body #tabContent .sadaa-tablet-filter-control select,
  html body #tabContent select.sadaa-tablet-filter-control,
  html body #tabContent input.sadaa-tablet-filter-control {
    width: 100% !important;
    min-height: 40px !important;
    height: 40px !important;
    box-sizing: border-box !important;
    font-size: 12.5px !important;
  }

  html body #tabContent .sadaa-tablet-filter-toolbar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    align-items: end !important;
    margin: 0 !important;
  }

  html body #tabContent .sadaa-tablet-filter-toolbar .sadaa-tablet-search-field {
    grid-column: 1 / -1 !important;
  }

  html body #tabContent .sadaa-tablet-filter-toolbar > button,
  html body #tabContent .sadaa-tablet-filter-toolbar > a {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 7px 9px !important;
  }

  html body #tabContent .sadaa-tablet-sort-inline {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .sadaa-tablet-sort-inline .sadaa-tablet-filter-label,
  html body #tabContent .sadaa-tablet-sort-label {
    display: none !important;
  }

  html body #tabContent .sadaa-tablet-sort-group {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .sadaa-tablet-sort-button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 7px 9px !important;
  }

  html body #tabContent .sadaa-tablet-action-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .sadaa-tablet-action-grid--3 > :last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
  }

  html body #tabContent .sadaa-tablet-action-grid > button,
  html body #tabContent .sadaa-tablet-action-grid > a {
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .sadaa-tablet-grid-full {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  /* ---------------------------------------------------------
     Records list container
     --------------------------------------------------------- */
  html body #tabContent .sadaa-tablet-records-shell {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 8px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 8px !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow: none !important;
  }

  html body #tabContent .sadaa-tablet-records-stack {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
  }

  html body #tabContent .sadaa-tablet-records-shell .sadaa-admin-record-card {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-top: 3px solid var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  /* ---------------------------------------------------------
     المستخدمون — إزالة الغلاف الداخلي الخفي
     --------------------------------------------------------- */
  html body #tabContent .users-tab-soft .users-list-wrap.sadaa-tablet-records-shell {
    display: grid !important;
    gap: 8px !important;
  }

  html body #tabContent .users-tab-soft .users-list.sadaa-tablet-records-stack {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body #tabContent .users-tab-soft .users-filter-selects {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body #tabContent .users-tab-soft .users-filter-select-wrap select {
    text-align: right !important;
    text-align-last: right !important;
  }

  /* ---------------------------------------------------------
     المشرفون — نفس البنية النهائية المعتمدة في التابلت
     --------------------------------------------------------- */
  html body #tabContent .moderators-tab > .moderators-panel.sadaa-admin-list-shell {
    display: contents !important;
  }

  html body #tabContent .moderators-tab #moderatorsPermissionsForm {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body #tabContent .moderators-tab .sadaa-tablet-records-shell {
    padding: 8px !important;
  }

  html body #tabContent .moderators-tab .moderator-card.sadaa-admin-record-card {
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
  }

  html body #tabContent .moderators-tab .moderator-card > .moderator-card-head {
    margin: 0 !important;
    border-radius: 0 !important;
  }

  html body #tabContent .moderators-tab .moderators-search-form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .moderators-tab .moderators-search-field {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .moderators-tab .moderators-sort-inline {
    width: 100% !important;
    justify-self: stretch !important;
  }

  html body #tabContent .moderators-tab .moderators-sort-group {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 7px !important;
  }

  html body #tabContent .moderators-tab .moderators-save-bar {
    position: static !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 8px 0 0 !important;
    padding: 9px !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 8px !important;
    background: var(--sadaa-surface, #fff) !important;
    box-shadow: none !important;
  }

  html body #tabContent .moderators-tab .moderators-save-bar .moderators-muted {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    font-size: 11.5px !important;
  }

  html body #tabContent .moderators-tab .moderators-save-bar button,
  html body #tabContent .moderators-tab .moderators-save-bar .moderators-btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    margin: 0 !important;
  }

  /* ---------------------------------------------------------
     الكوبونات — إزالة الغلاف الداخلي والحد البنفسجي
     --------------------------------------------------------- */
  html body #tabContent .coupons-tab-ui .mc-list-wrap.sadaa-tablet-records-shell {
    display: grid !important;
    gap: 8px !important;
  }

  html body #tabContent .coupons-tab-ui .mc-list.sadaa-tablet-records-stack {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body #tabContent .coupons-tab-ui .mc-list-wrap .mc-row.sadaa-admin-record-card {
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  html body #tabContent .coupons-tab-ui
  .mc-row.sadaa-admin-record-card > .mc-cell[data-label="تاريخ النهاية"] {
    border-bottom: 0 !important;
  }

  /* ---------------------------------------------------------
     الرسائل البريدية
     --------------------------------------------------------- */
  html body #tabContent .newsletter-admin .newsletter-admin-stats,
  html body #tabContent .newsletter-admin-stats {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  html body #tabContent .newsletter-admin .newsletter-table-wrap
  .newsletter-table tbody tr.sadaa-admin-record-card {
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  html body #tabContent .newsletter-admin .newsletter-table
  tbody tr:last-child > td:not(:last-child) {
    border-bottom: 1px solid #eef0f3 !important;
  }

  html body #tabContent .newsletter-admin .newsletter-table
  tbody tr:last-child > td:last-child {
    border-bottom: 0 !important;
  }

  /* ---------------------------------------------------------
     تقرير الطلبات
     --------------------------------------------------------- */
  html body #tabContent .finance-tab .finance-filter-card,
  html body #tabContent .finance-tab .finance-filter-card.sadaa-admin-list-shell,
  html body #tabContent .finance-tab .finance-filter-card.sadaa-admin-card,
  html body #tabContent .finance-tab .finance-filter-grid,
  html body #tabContent .finance-tab .finance-table-card.sadaa-admin-card {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .finance-tab .finance-filter-card {
    margin: 0 0 10px !important;
  }

  html body #tabContent .finance-tab .finance-table-wrap.sadaa-tablet-records-shell {
    width: 100% !important;
    margin: 0 !important;
    padding: 8px !important;
  }

  html body #tabContent .finance-tab .finance-table-wrap
  .finance-order-row.sadaa-admin-record-card {
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  html body #tabContent .finance-tab .finance-table-wrap > .finance-pagination {
    width: 100% !important;
    margin: 8px 0 0 !important;
    padding: 8px 0 0 !important;
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
  }

  /* ---------------------------------------------------------
     العروض
     --------------------------------------------------------- */
  html body #tabContent .offers-tab-ui .offers-current-card-body
  .offers-table-wrap.sadaa-tablet-records-shell {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .offers-tab-ui .offers-current-card-body
  .offers-table tbody.sadaa-tablet-records-stack {
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  html body #tabContent .offers-tab-ui .offers-status {
    min-width: 60px !important;
    min-height: 25px !important;
    padding: 3px 8px !important;
    border-radius: 6px !important;
    font-size: 11.5px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    gap: 0 !important;
    white-space: nowrap !important;
  }

  html body #tabContent .offers-tab-ui .offers-status::before {
    content: none !important;
    display: none !important;
  }

  html body #tabContent .offers-tab-ui .offers-status.is-active {
    background: #ecfdf3 !important;
    color: #166534 !important;
    border-color: #bbf7d0 !important;
  }

  html body #tabContent .offers-tab-ui .offers-status.is-expired {
    background: #fffbeb !important;
    color: #92400e !important;
    border-color: #fde68a !important;
  }

  html body #tabContent .offers-tab-ui .offers-status:not(.is-active):not(.is-expired) {
    background: var(--sadaa-admin-soft, #f3f4f6) !important;
    color: var(--sadaa-admin-dark) !important;
    border-color: var(--sadaa-admin-soft-line, #d1d5db) !important;
  }

  html body #tabContent .offers-tab-ui .offers-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  /* ---------------------------------------------------------
     دليل المتاجر
     --------------------------------------------------------- */
  html body #tabContent .directory-tab-soft .directory-unified-toolbar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
  }

  html body #tabContent .directory-tab-soft .directory-unified-toolbar .directory-search-field {
    grid-column: 1 / -1 !important;
  }

  html body #tabContent .directory-tab-soft .directory-toolbar-filter:nth-of-type(4) {
    grid-column: 1 / -1 !important;
  }

  html body #tabContent .directory-tab-soft .directory-toolbar-search,
  html body #tabContent .directory-tab-soft .directory-toolbar-clear {
    width: 100% !important;
    min-width: 0 !important;
  }

  /* ---------------------------------------------------------
     البلاغات — الإجراءات الجماعية لا تتمدد بشكل مشوه
     --------------------------------------------------------- */
  html body #tabContent .reports-tab-ui .reports-filter-bar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
  }

  html body #tabContent .reports-tab-ui .reports-filter,
  html body #tabContent .reports-tab-ui .reports-bulk-action-btn {
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .reports-tab-ui .reports-bulk-actions,
  html body #tabContent .reports-tab-ui .reports-actions-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
  }

  /* ---------------------------------------------------------
     الطلبات — تثبيت تفاصيل البطاقة المعتمدة في التابلت
     --------------------------------------------------------- */
  html body #tabContent .orders-tab-ui .orders-panel.sadaa-admin-list-shell {
    padding: 0 !important;
    background: transparent !important;
  }

  html body #tabContent .orders-tab-ui .orders-grid.sadaa-tablet-records-stack {
    padding: 0 !important;
  }

  html body #tabContent .orders-tab-ui .orders-grid-row.sadaa-admin-record-card {
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  html body #tabContent .orders-tab-ui .orders-grid-row
  .orders-grid-cell[data-label="المدة"] {
    border-bottom: 0 !important;
  }

  html body #tabContent .orders-tab-ui .orders-grid-row
  .orders-grid-cell:first-child {
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  html body #tabContent .orders-tab-ui
  .orders-search-card > .sadaa-tablet-disclosure__summary {
    padding-inline: 10px !important;
  }
}

/* الشاشات الأصغر: عمود واحد للحقول الطويلة حتى لا تنضغط. */
@media (max-width: 480px) {
  html body #tabContent .sadaa-admin-tools-card > .sadaa-tablet-disclosure__summary {
    min-height: 42px !important;
    padding: 7px 9px !important;
  }

  html body #tabContent .sadaa-admin-tools-card.sadaa-tablet-disclosure[open]
  > .sadaa-tablet-disclosure__body {
    padding: 8px !important;
  }

  html body #tabContent .sadaa-tablet-filter-grid,
  html body #tabContent .sadaa-tablet-filter-toolbar {
    grid-template-columns: 1fr !important;
  }

  html body #tabContent .sadaa-tablet-filter-grid > *,
  html body #tabContent .sadaa-tablet-filter-grid--3 > :last-child,
  html body #tabContent .sadaa-tablet-filter-grid--4 > :last-child,
  html body #tabContent .sadaa-tablet-filter-toolbar > * {
    grid-column: 1 !important;
  }

  html body #tabContent .offers-tab-ui .offers-form-grid {
    grid-template-columns: 1fr !important;
  }

  html body #tabContent .directory-tab-soft .directory-unified-toolbar {
    grid-template-columns: 1fr !important;
  }

  html body #tabContent .directory-tab-soft .directory-unified-toolbar > * {
    grid-column: 1 !important;
  }

  html body #tabContent .users-tab-soft .users-filter-selects {
    grid-template-columns: 1fr !important;
  }

  html body #tabContent .reports-tab-ui .reports-filter-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body #tabContent .sadaa-tablet-records-shell {
    padding: 7px !important;
    gap: 7px !important;
  }

  html body #tabContent .sadaa-tablet-records-stack {
    gap: 7px !important;
  }
}

/* =========================================================
   Mobile Refinements — Round 1 — 2026-09-26
   النطاق: الجوال فقط حتى 720px
   ========================================================= */
@media (max-width: 720px) {

  /* =======================================================
     الكوبونات
     توحيد ألوان ملخص حالات الكوبونات بلغة بصرية واحدة.
     ======================================================= */
  html body #tabContent .coupons-tab-ui .coupon-status-chip,
  html body #tabContent .coupons-tab-ui .coupon-status-chip.is-active,
  html body #tabContent .coupons-tab-ui .coupon-status-chip.is-disabled,
  html body #tabContent .coupons-tab-ui .coupon-status-chip.is-pending,
  html body #tabContent .coupons-tab-ui .coupon-status-chip.is-expired,
  html body #tabContent .coupons-tab-ui .coupon-status-chip.is-used-up {
    background: var(--sadaa-admin-soft, var(--sadaa-tint, #f5f7f9)) !important;
    color: var(--sadaa-admin-dark, var(--sadaa-primary-dark)) !important;
    border-color: var(--sadaa-admin-soft-line, var(--sadaa-line-2, #e2e8f0)) !important;
  }

  html body #tabContent .coupons-tab-ui .coupon-status-chip > i {
    color: var(--sadaa-admin-primary, var(--sadaa-primary)) !important;
  }

  /* =======================================================
     الرسائل البريدية
     حقل البحث وزر البحث في صف واحد متوازن.
     ======================================================= */
  html body #tabContent .newsletter-admin .newsletter-search {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 92px !important;
    gap: 7px !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .newsletter-admin .newsletter-search-field,
  html body #tabContent .newsletter-admin .newsletter-search .sadaa-tablet-search-field {
    grid-column: auto !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .newsletter-admin .newsletter-search > button {
    grid-column: auto !important;
    width: 92px !important;
    min-width: 92px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding-inline: 10px !important;
    white-space: nowrap !important;
  }

  /* =======================================================
     تقرير الطلبات
     دمج رأس "قائمة الطلبات" وحاوية البطاقات في سطح واحد.
     ======================================================= */
  html body #tabContent .finance-tab .finance-table-card.sadaa-admin-card {
    display: block !important;
    width: 100% !important;
    margin: 0 0 10px !important;
    padding: 8px !important;
    border: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 8px !important;
    background: var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  html body #tabContent .finance-tab .finance-table-card > .finance-card-head {
    width: calc(100% + 16px) !important;
    min-height: 42px !important;
    margin: -8px -8px 8px !important;
    padding: 8px 10px !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius: 7px 7px 0 0 !important;
    background: var(--sadaa-surface, #fff) !important;
    box-sizing: border-box !important;
  }

  html body #tabContent .finance-tab
  .finance-table-card > .finance-table-wrap.sadaa-tablet-records-shell {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body #tabContent .finance-tab
  .finance-table-card .finance-orders-table tbody.sadaa-tablet-records-stack {
    gap: 8px !important;
  }

  html body #tabContent .finance-tab
  .finance-table-card .finance-table-wrap > .finance-pagination {
    margin-top: 8px !important;
    padding-top: 8px !important;
  }

  /* =======================================================
     البلاغات
     شبكة فلاتر كاملة العرض ومتوازنة مع أبعاد الجوال.
     ======================================================= */
  html body #tabContent .reports-tab-ui .reports-tablet-disclosure-body {
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .reports-tab-ui .reports-filter-bar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
    align-items: stretch !important;
    justify-items: stretch !important;
  }

  html body #tabContent .reports-tab-ui .reports-filter {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 6px 7px !important;
    gap: 5px !important;
    border-radius: 7px !important;
    font-size: 11.5px !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }

  html body #tabContent .reports-tab-ui .reports-filter > span {
    min-width: 20px !important;
    min-height: 20px !important;
    padding: 1px 6px !important;
    font-size: 11px !important;
  }

  /* الفلتر الخامس يملأ الصف الأخير بدل ترك نصف صف فارغ. */
  html body #tabContent .reports-tab-ui .reports-filter-bar
  > .reports-filter:nth-of-type(5) {
    grid-column: 1 / -1 !important;
  }

  html body #tabContent .reports-tab-ui .reports-bulk-toolbar {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 2px 0 0 !important;
    padding: 7px 0 0 !important;
  }

  html body #tabContent .reports-tab-ui .reports-bulk-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body #tabContent .reports-tab-ui .reports-bulk-action-btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 6px 7px !important;
    font-size: 11.5px !important;
  }

  html body #tabContent .reports-tab-ui
  .reports-bulk-action-btn:last-child {
    grid-column: 1 / -1 !important;
  }
}

/* أضيق شاشات الجوال */
@media (max-width: 380px) {
  html body #tabContent .newsletter-admin .newsletter-search {
    grid-template-columns: minmax(0, 1fr) 82px !important;
  }

  html body #tabContent .newsletter-admin .newsletter-search > button {
    width: 82px !important;
    min-width: 82px !important;
    padding-inline: 7px !important;
    font-size: 11.5px !important;
  }

  html body #tabContent .reports-tab-ui .reports-filter,
  html body #tabContent .reports-tab-ui .reports-bulk-action-btn {
    font-size: 11px !important;
    padding-inline: 5px !important;
  }
}

/* =========================================================
   Mobile Typography = Tablet — v1 — 2026-09-26
   النطاق: الجوال فقط حتى 720px
   الهدف: مطابقة أحجام الخطوط المعتمدة في نسخة التابلت
   بدون تغيير أي حاوية أو توزيع أو أبعاد.
   ========================================================= */
@media (max-width: 720px) {

  /* ---------------------------------------------------------
     الأساس المركزي
     --------------------------------------------------------- */
  html body #tabContent {
    font-size: 14px !important;
  }

  html body #tabContent .sadaa-input,
  html body #tabContent .sadaa-select,
  html body #tabContent .sadaa-textarea {
    font-size: 14px !important;
  }

  html body #tabContent .sadaa-input--toolbar,
  html body #tabContent .sadaa-select--toolbar {
    font-size: 13.5px !important;
  }

  html body #tabContent .sadaa-btn {
    font-size: 14px !important;
  }

  /* ---------------------------------------------------------
     الهيرو / رؤوس الصفحات المركزية
     مطابق لقيم التابلت: 20 / 13 / 16
     --------------------------------------------------------- */
  html body #tabContent .sadaa-page-header--admin .sadaa-page-header__icon {
    font-size: 16px !important;
  }

  html body #tabContent .sadaa-page-header--admin .sadaa-page-header__title {
    font-size: 20px !important;
    line-height: 1.5 !important;
  }

  html body #tabContent .sadaa-page-header--admin .sadaa-page-header__description {
    font-size: 13px !important;
    line-height: 1.8 !important;
  }

  html body #tabContent .sadaa-page-header--admin .sadaa-page-header__meta {
    font-size: 13px !important;
  }

  /* ---------------------------------------------------------
     البحث والفلاتر
     --------------------------------------------------------- */
  html body #tabContent .sadaa-tablet-disclosure__title,
  html body #tabContent .sadaa-admin-tools-card .sadaa-tablet-disclosure__title {
    font-size: 13.5px !important;
  }

  html body #tabContent .sadaa-tablet-filter-control,
  html body #tabContent .sadaa-tablet-filter-control select,
  html body #tabContent select.sadaa-tablet-filter-control,
  html body #tabContent input.sadaa-tablet-filter-control {
    font-size: 12.5px !important;
  }

  html body #tabContent .sadaa-tablet-search-row input,
  html body #tabContent .sadaa-tablet-search-row select,
  html body #tabContent .sadaa-tablet-search-field input,
  html body #tabContent .sadaa-tablet-search-field select {
    font-size: 13.5px !important;
  }

  /* ---------------------------------------------------------
     الحالات + الصفحات + التبويبات
     --------------------------------------------------------- */
  html body #tabContent .sadaa-status {
    font-size: 12px !important;
  }

  html body #tabContent .sadaa-status--refund-failed,
  html body #tabContent .sadaa-status--compact {
    font-size: 11px !important;
  }

  html body #tabContent .sadaa-pagination__item,
  html body #tabContent .sadaa-pagination__gap {
    font-size: 12.5px !important;
  }

  html body #tabContent .sadaa-tab {
    font-size: 13px !important;
  }

  html body #tabContent .sadaa-admin-record-card {
    font-size: 13.5px !important;
  }

  /* =======================================================
     المستخدمون — نفس Typography التابلت
     ======================================================= */
  html body #tabContent .users-tab-soft .users-page-icon {
    font-size: 14px !important;
  }

  html body #tabContent .users-tab-soft .users-page-title h2 {
    font-size: 18px !important;
  }

  html body #tabContent .users-tab-soft .users-page-title p {
    font-size: 12.5px !important;
  }

  html body #tabContent .users-tab-soft .users-search-field input {
    font-size: 14px !important;
  }

  html body #tabContent .users-tab-soft .search-btn,
  html body #tabContent .users-tab-soft .users-filter-select-wrap select {
    font-size: 13.5px !important;
  }

  html body #tabContent .users-tab-soft .btn-tag {
    font-size: 12.5px !important;
  }

  html body #tabContent .users-tab-soft .users-row,
  html body #tabContent .users-tab-soft .users-cell {
    font-size: 13.5px !important;
  }

  html body #tabContent .users-tab-soft .users-cell::before {
    font-size: 12px !important;
  }

  html body #tabContent .users-tab-soft .user-name-text {
    font-size: 14px !important;
  }

  html body #tabContent .users-tab-soft .role-badge,
  html body #tabContent .users-tab-soft .status-badge {
    font-size: 12px !important;
  }

  /* =======================================================
     الطلبات
     ======================================================= */
  html body #tabContent .orders-tab-ui .orders-header-icon {
    font-size: 14px !important;
  }

  html body #tabContent .orders-tab-ui .orders-clean-header h2 {
    font-size: 17px !important;
  }

  html body #tabContent .orders-tab-ui .orders-clean-header p {
    font-size: 12px !important;
  }

  html body #tabContent .orders-tab-ui .orders-section-title {
    font-size: 13px !important;
  }

  html body #tabContent .orders-tab-ui .orders-search-field input,
  html body #tabContent .orders-tab-ui .search-btn {
    font-size: 12px !important;
  }

  html body #tabContent .orders-tab-ui .btn-tag,
  html body #tabContent .orders-tab-ui .action-toolbar button {
    font-size: 12.5px !important;
  }

  html body #tabContent .orders-tab-ui .orders-grid-cell {
    font-size: 13.5px !important;
  }

  html body #tabContent .orders-tab-ui .orders-grid-cell::before {
    font-size: 12.5px !important;
  }

  html body #tabContent .orders-tab-ui .orders-id-pill {
    font-size: 12.5px !important;
  }

  html body #tabContent .orders-tab-ui
  .orders-grid-cell[data-label="الحالة"] .sadaa-status {
    font-size: 12px !important;
  }

  html body #tabContent .orders-tab-ui .orders-row-actions-toggle,
  html body #tabContent .orders-tab-ui .orders-row-action-item {
    font-size: 12px !important;
  }

  /* =======================================================
     دليل المتاجر
     ======================================================= */
  html body #tabContent .directory-tab-soft .directory-page-icon {
    font-size: 14px !important;
  }

  html body #tabContent .directory-tab-soft .directory-page-title h2 {
    font-size: 18px !important;
  }

  html body #tabContent .directory-tab-soft .directory-page-title p {
    font-size: 12.5px !important;
  }

  html body #tabContent .directory-tab-soft .directory-page-meta {
    font-size: 12px !important;
  }

  html body #tabContent .directory-tab-soft .directory-section-title {
    font-size: 13px !important;
  }

  html body #tabContent .directory-tab-soft .directory-search-field input {
    font-size: 12px !important;
  }

  html body #tabContent .directory-tab-soft .directory-search-form .directory-btn,
  html body #tabContent .directory-tab-soft .directory-filter-select {
    font-size: 13.5px !important;
  }

  html body #tabContent .directory-tab-soft .directory-filter-tag,
  html body #tabContent .directory-tab-soft .directory-filter-controls .directory-btn {
    font-size: 13px !important;
  }

  html body #tabContent .directory-tab-soft .directory-toolbar-filter label {
    font-size: 12px !important;
  }

  html body #tabContent .directory-tab-soft .directory-cell {
    font-size: 13.5px !important;
  }

  html body #tabContent .directory-tab-soft .directory-cell::before {
    font-size: 12px !important;
  }

  html body #tabContent .directory-tab-soft .directory-store-name {
    font-size: 14px !important;
  }

  html body #tabContent .directory-tab-soft .directory-owner-email,
  html body #tabContent .directory-tab-soft .directory-category,
  html body #tabContent .directory-tab-soft .directory-status {
    font-size: 12px !important;
  }

  /* =======================================================
     البلاغات
     ======================================================= */
  html body #tabContent .reports-tab-ui .reports-header-icon {
    font-size: 14px !important;
  }

  html body #tabContent .reports-tab-ui .reports-clean-header h2 {
    font-size: 18px !important;
  }

  html body #tabContent .reports-tab-ui .reports-clean-header p {
    font-size: 12.5px !important;
  }

  html body #tabContent .reports-tab-ui .reports-search-field input,
  html body #tabContent .reports-tab-ui .reports-status-field select {
    font-size: 14px !important;
  }

  html body #tabContent .reports-tab-ui .reports-row,
  html body #tabContent .reports-tab-ui .reports-cell {
    font-size: 13.5px !important;
  }

  html body #tabContent .reports-tab-ui .reports-cell::before {
    font-size: 12px !important;
  }

  html body #tabContent .reports-tab-ui .report-ad-id {
    font-size: 14px !important;
  }

  html body #tabContent .reports-tab-ui .reports-cell small,
  html body #tabContent .reports-tab-ui .report-ad-meta,
  html body #tabContent .reports-tab-ui .report-date span {
    font-size: 12.5px !important;
  }

  html body #tabContent .reports-tab-ui .report-badge {
    font-size: 12px !important;
  }

  html body #tabContent .reports-tab-ui .reports-filter,
  html body #tabContent .reports-tab-ui .reports-bulk-action-btn {
    font-size: 13px !important;
  }

  html body #tabContent .reports-tab-ui .reports-filter span {
    font-size: 12px !important;
  }

  /* =======================================================
     الكوبونات
     ======================================================= */
  html body #tabContent .coupons-tab-ui .coupons-page-icon {
    font-size: 14px !important;
  }

  html body #tabContent .coupons-tab-ui .coupons-page-title h2 {
    font-size: 17px !important;
  }

  html body #tabContent .coupons-tab-ui .coupons-page-title p,
  html body #tabContent .coupons-tab-ui .coupons-page-meta,
  html body #tabContent .coupons-tab-ui .coupons-header-add-btn {
    font-size: 12px !important;
  }

  html body #tabContent .coupons-tab-ui .coupons-section-title {
    font-size: 13.5px !important;
  }

  html body #tabContent .coupons-tab-ui .coupon-status-chip,
  html body #tabContent .coupons-tab-ui .mc-btn {
    font-size: 12.5px !important;
  }

  html body #tabContent .coupons-tab-ui .mc-cell {
    font-size: 14px !important;
  }

  html body #tabContent .coupons-tab-ui .mc-cell::before {
    font-size: 13px !important;
  }

  html body #tabContent .coupons-tab-ui .coupon-id-pill,
  html body #tabContent .coupons-tab-ui .coupon-status {
    font-size: 13px !important;
  }

  html body #tabContent .coupons-tab-ui .coupon-code-cell {
    font-size: 14px !important;
  }

  /* =======================================================
     تقرير الطلبات
     ======================================================= */
  html body #tabContent .finance-tab .finance-summary-icon {
    font-size: 12px !important;
  }

  html body #tabContent .finance-tab .finance-summary-label {
    font-size: 11.5px !important;
  }

  html body #tabContent .finance-tab .finance-summary-value {
    font-size: 17px !important;
  }

  html body #tabContent .finance-tab .finance-orders-table td {
    font-size: 14px !important;
  }

  html body #tabContent .finance-tab .finance-orders-table td::before {
    font-size: 13px !important;
  }

  html body #tabContent .finance-tab .finance-order-main strong,
  html body #tabContent .finance-tab .finance-date-stack strong {
    font-size: 14px !important;
  }

  html body #tabContent .finance-tab .finance-order-main span,
  html body #tabContent .finance-tab .finance-date-stack span {
    font-size: 12.5px !important;
  }

  /* =======================================================
     المشرفون
     ======================================================= */
  html body #tabContent .moderators-tab .moderators-page-icon {
    font-size: 14px !important;
  }

  html body #tabContent .moderators-tab .moderators-page-title h2 {
    font-size: 18px !important;
  }

  html body #tabContent .moderators-tab .moderators-page-title p {
    font-size: 12.5px !important;
  }

  html body #tabContent .moderators-tab .moderators-search-field input,
  html body #tabContent .moderators-tab .moderator-name {
    font-size: 14px !important;
  }

  html body #tabContent .moderators-tab .moderator-meta,
  html body #tabContent .moderators-tab .moderators-muted {
    font-size: 12.5px !important;
  }

  html body #tabContent .moderators-tab .permission-item {
    font-size: 13px !important;
  }

  /* =======================================================
     الرسائل البريدية
     ======================================================= */
  html body #tabContent .newsletter-admin .newsletter-admin-hero h1 {
    font-size: 21px !important;
  }

  html body #tabContent .newsletter-admin .newsletter-admin-hero p {
    font-size: 13px !important;
  }

  html body #tabContent .newsletter-admin .newsletter-filter {
    font-size: 12px !important;
  }

  html body #tabContent .newsletter-admin .newsletter-table td {
    font-size: 13px !important;
  }

  html body #tabContent .newsletter-admin .newsletter-table td::before {
    font-size: 12px !important;
  }

  html body #tabContent .newsletter-admin .newsletter-stat-label {
    font-size: 11.5px !important;
  }

  html body #tabContent .newsletter-admin .newsletter-stat-value {
    font-size: 18px !important;
  }

  /* =======================================================
     العروض
     ======================================================= */
  html body #tabContent .offers-tab-ui .offers-page-icon {
    font-size: 16px !important;
  }

  html body #tabContent .offers-tab-ui .offers-page-title h2 {
    font-size: 20px !important;
  }

  html body #tabContent .offers-tab-ui .offers-page-title p {
    font-size: 13px !important;
  }

  html body #tabContent .offers-tab-ui .offers-status {
    font-size: 12px !important;
  }

  html body #tabContent .offers-tab-ui .offers-table td::before {
    font-size: 12px !important;
  }

  html body #tabContent .offers-tab-ui .offers-title-name {
    font-size: 13px !important;
  }

  /* =======================================================
     الإعدادات
     ======================================================= */
  html body #tabContent .settings-tab-ui .settings-page-icon {
    font-size: 14px !important;
  }

  html body #tabContent .settings-tab-ui .settings-page-title h2 {
    font-size: 17px !important;
  }

  html body #tabContent .settings-tab-ui .settings-page-title p,
  html body #tabContent .settings-tab-ui .settings-page-meta {
    font-size: 12px !important;
  }

  html body #tabContent .settings-tab-ui .settings-section-title {
    font-size: 13px !important;
  }

  html body #tabContent .settings-tab-ui .settings-content-card button,
  html body #tabContent .settings-tab-ui .settings-content-card input[type="submit"],
  html body #tabContent .settings-tab-ui .settings-content-card .btn,
  html body #tabContent .settings-tab-ui .settings-content-card .button,
  html body #tabContent .settings-tab-ui .settings-content-card a.button {
    font-size: 12.5px !important;
  }
}

/* =========================================================
   Member Dashboard — Tablet Authority v1 — 2026-09-26
   النطاق: 721px–1100px فقط
   ========================================================= */
@media (min-width:721px) and (max-width:1100px){

  html body #tabContent .member-tab-page-header,
  html body #tabContent .member-tab-page-header.sadaa-page-header--member{
    width:100% !important;
    min-height:0 !important;
    margin:0 0 12px !important;
    padding:18px 20px !important;
    border-radius:8px !important;
  }

  html body #tabContent .member-tab-page-header.sadaa-page-header--member{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:14px !important;
  }

  html body #tabContent .member-tab-page-header .sadaa-page-header__main,
  html body #tabContent .member-tab-page-header .sadaa-page-header__actions{
    min-width:0 !important;
  }

  html body #tabContent .member-tab-page-header .sadaa-page-header__actions{
    flex:0 0 auto !important;
  }

  html body #tabContent .sadaa-card--workspace,
  html body #tabContent .stats-content-panel,
  html body #tabContent .account-settings-content-panel{
    border-radius:8px !important;
  }

  html body #tabContent .sadaa-card--workspace{
    padding:12px !important;
  }

  html body #tabContent .sadaa-card--subsection{
    border-radius:8px !important;
  }

  html body #tabContent .stats-page .member-stats-filter-form{
    grid-template-columns:minmax(220px,.9fr) minmax(0,1.1fr) !important;
    gap:10px !important;
  }

  html body #tabContent .stats-page .kpis{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  html body #tabContent .stats-page .store-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  html body #tabContent .stats-page .stats-filter-card,
  html body #tabContent .stats-page .stats-panel{
    padding:13px !important;
  }

  html body #tabContent .member-records-page .member-records-filters{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    padding:10px !important;
  }

  html body #tabContent .member-records-page .member-records-search-wrap{
    grid-column:1 / -1 !important;
    width:100% !important;
  }

  html body #tabContent .member-records-page .member-records-filter-actions{
    grid-column:1 / -1 !important;
    display:flex !important;
    justify-content:flex-start !important;
    gap:var(--sadaa-filter-actions-gap) !important;
  }

  html body #tabContent .member-records-page .member-records-list{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    padding:10px !important;
    border:1px solid var(--sadaa-line,#e5e7eb) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface-alt,#f8fafc) !important;
  }

  html body #tabContent .member-stores-page .member-stores-summary{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:9px !important;
  }

  html body #tabContent .member-stores-page .member-store-card-head{
    grid-template-columns:88px minmax(0,1fr) !important;
    gap:12px !important;
  }

  html body #tabContent .member-stores-page .member-store-logo-shell{
    width:88px !important;
    height:88px !important;
  }

  html body #tabContent .member-stores-page .member-store-feature-state{
    grid-column:1 / -1 !important;
  }

  html body #tabContent .member-stores-page .member-store-card-footer{
    align-items:flex-start !important;
    flex-direction:column !important;
    gap:10px !important;
  }

  html body #tabContent .member-stores-page .member-store-actions{
    width:100% !important;
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }

  html body #tabContent .member-invoices-page .invoices-stats{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  html body #tabContent .member-invoices-page .invoice-stat-card:last-child{
    grid-column:1 / -1 !important;
  }

  html body #tabContent .member-invoices-page .invoices-toolbar{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    padding:9px !important;
  }

  html body #tabContent .member-invoices-page .invoices-search-wrap,
  html body #tabContent .member-invoices-page .invoices-filter-count{
    grid-column:1 / -1 !important;
  }

  html body #tabContent .member-invoices-page .invoices-list{
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    overflow:visible !important;
  }

  html body #tabContent .member-invoices-page .invoices-table tbody{
    display:grid !important;
    gap:9px !important;
  }

  html body #tabContent .member-invoices-page .invoices-table tbody tr{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:0 14px !important;
    padding:12px !important;
    border:1px solid var(--sadaa-line,#e5e7eb) !important;
    border-top:2px solid var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
    border-radius:8px !important;
    background:#fff !important;
  }

  html body #tabContent .account-settings-content-panel,
  html body #tabContent .settings-wrapper .account-settings-content-panel{
    padding:12px !important;
    border-radius:8px !important;
  }

  html body #tabContent .sadaa-pagination,
  html body #tabContent .invoices-pagination,
  html body #tabContent .member-records-pagination{
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:5px !important;
  }
}

/* =========================================================
   Member Dashboard — Content Structure & Tablet Refinements v2
   2026-09-26
   ========================================================= */

/* إحصائيات الإعلانات والمتاجر: فصل منطقة الاختيار عن بقية المحتوى — جميع الشاشات */
html body #tabContent .stats-page .stats-content-panel{
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

html body #tabContent .stats-page .stats-selection-shell{
  width:100% !important;
  min-width:0 !important;
  margin:0 0 12px !important;
  padding:10px !important;
  border:1px solid var(--sadaa-line,#e5e7eb) !important;
  border-radius:8px !important;
  background:var(--sadaa-surface,#fff) !important;
  box-shadow:none !important;
}

html body #tabContent .stats-page .stats-selection-shell > .stats-filter-card{
  margin:0 !important;
}

html body #tabContent .stats-page .store-stats-selection-shell .store-stats-head{
  margin-bottom:10px !important;
}

/* على سطح المكتب فقط تبقى مناطق البحث بدون رأس Disclosure ظاهر.
   الجوال والتابلت يستخدمان الآن نفس آلية Disclosure المركزية. */
@media (min-width:1101px){
  html body #tabContent .member-tablet-tools > .member-tablet-tools-summary{
    display:none !important;
    pointer-events:none !important;
  }
  html body #tabContent .member-tablet-tools > .member-tablet-tools-body,
  html body #tabContent .member-tablet-tools:not([open]) > .member-tablet-tools-body{
    display:contents !important;
  }
  html body #tabContent .member-tablet-tools{
    display:contents !important;
  }
}

@media (min-width:721px) and (max-width:1100px){
  /* -------------------------------------------------------
     الرأس المركزي لمناطق البحث والفلاتر — مطابق للمدير
     ------------------------------------------------------- */
  html body #tabContent .member-tablet-tools{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 0 10px !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-tablet-tools > .member-tablet-tools-summary{
    min-height:44px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    width:100% !important;
    margin:0 !important;
    padding:8px 10px !important;
    list-style:none !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:7px 7px 0 0 !important;
    background:var(--sadaa-admin-soft,#f7f8fa) !important;
    cursor:pointer !important;
  }

  html body #tabContent .member-tablet-tools > .member-tablet-tools-summary::-webkit-details-marker{
    display:none !important;
  }

  html body #tabContent .member-tablet-tools > .member-tablet-tools-body{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:9px !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body #tabContent .member-tablet-tools:not([open]) > .member-tablet-tools-body{
    display:none !important;
  }

  /* -------------------------------------------------------
     إعلاناتي
     ------------------------------------------------------- */
  html body #tabContent .member-records-page .member-records-filters{
    display:grid !important;
    grid-template-columns:minmax(190px,1.3fr) minmax(125px,.8fr) minmax(120px,.75fr) minmax(150px,.8fr) !important;
    gap:7px !important;
    align-items:center !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page .member-records-search-wrap{
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-select,
  html body #tabContent .member-records-page .member-records-search-input{
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-actions{
    grid-column:auto !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:var(--sadaa-filter-actions-gap) !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-submit,
  html body #tabContent .member-records-page .member-records-filter-clear{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-actions > :only-child{
    grid-column:1 / -1 !important;
  }

  /* الغلاف الخلفي البنيوي يُلغى، وحاوية البطاقات فقط تبقى مرئية. */
  html body #tabContent .member-records-page .member-records-form{
    width:100% !important;
    max-width:none !important;
    margin:0 0 12px !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page .member-records-toolbar{
    margin:0 0 8px !important;
  }

  html body #tabContent .member-records-page .member-records-list{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:9px !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:9px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page .member-record-row{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  /* -------------------------------------------------------
     متاجري
     ------------------------------------------------------- */
  html body #tabContent .member-stores-page .member-stores-list-shell{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:9px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-stores-page .member-stores-grid{
    gap:9px !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body #tabContent .member-stores-page .member-store-card:not(.is-featured) .member-store-feature-state{
    display:none !important;
  }

  /* -------------------------------------------------------
     فواتيري — البحث والفلاتر في صف واحد
     ------------------------------------------------------- */
  html body #tabContent .member-invoices-page .invoices-toolbar{
    display:grid !important;
    grid-template-columns:minmax(190px,1.3fr) minmax(120px,.75fr) minmax(120px,.75fr) 88px 76px !important;
    gap:7px !important;
    align-items:center !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-invoices-page .invoices-search-wrap{
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-invoices-page .invoices-toolbar-btn,
  html body #tabContent .member-invoices-page .invoices-toolbar-reset,
  html body #tabContent .member-invoices-page .invoices-filter-select,
  html body #tabContent .member-invoices-page .invoices-search-input{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body #tabContent .member-invoices-page .invoices-filter-count{
    grid-column:1 / -1 !important;
    margin:2px 0 0 !important;
  }

  /* حاوية واحدة خلف بطاقات الفواتير والترقيم. */
  html body #tabContent .member-invoices-page .invoices-records-shell{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:9px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-invoices-page .invoices-list{
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body #tabContent .member-invoices-page .invoices-table tbody{
    gap:9px !important;
  }

  html body #tabContent .member-invoices-page .invoices-table tbody tr{
    gap:0 !important;
    padding:12px 13px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-top:2px solid var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
    border-radius:8px !important;
    background:#fff !important;
  }

  /* الصف العلوي: رقم الفاتورة والمبلغ. */
  html body #tabContent .member-invoices-page .invoice-no-cell,
  html body #tabContent .member-invoices-page .invoice-amount-cell{
    min-height:54px !important;
    padding:7px 0 9px !important;
    align-items:flex-start !important;
    justify-content:center !important;
  }

  /* بقية الصفوف: Label يمين / Value يسار، بمحاذاة ثابتة. */
  html body #tabContent .member-invoices-page .invoice-type-cell,
  html body #tabContent .member-invoices-page .invoice-details-cell,
  html body #tabContent .member-invoices-page .invoice-date-cell{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:14px !important;
    min-height:44px !important;
    padding:7px 0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-type-cell::before,
  html body #tabContent .member-invoices-page .invoice-details-cell::before,
  html body #tabContent .member-invoices-page .invoice-date-cell::before{
    flex:0 0 96px !important;
    margin:0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-type-pill,
  html body #tabContent .member-invoices-page .invoice-dims-pill,
  html body #tabContent .member-invoices-page .invoice-date{
    min-width:0 !important;
    margin-inline-start:auto !important;
    text-align:left !important;
  }

  html body #tabContent .member-invoices-page .invoice-action-cell{
    padding-top:9px !important;
  }

  html body #tabContent .member-invoices-page .invoices-pagination{
    width:100% !important;
    margin:9px 0 0 !important;
    padding:9px 0 0 !important;
    border-top:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
  }
}

/* =========================================================
   Member Ads — Tablet top row alignment — 2026-09-26
   النطاق: التابلت فقط 721px–1100px
   نفس منطق بطاقات الطلبات في لوحة المدير.
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* شريط التحديد الجماعي أصبح جزءاً من حاوية البطاقات نفسها. */
  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 8px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar .member-records-toolbar-inner {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  /* أول صف في البطاقة: تحديد + رقم الإعلان + الحالة + الإجراءات. */
  html body #tabContent .member-records-page .member-record-row {
    display: grid !important;
    grid-template-columns: 26px minmax(0, 1fr) auto 34px !important;
    column-gap: 8px !important;
    row-gap: 0 !important;
    align-items: center !important;
  }

  /* كل البيانات العادية تبدأ أسفل الصف الأول بعرض كامل. */
  html body #tabContent .member-records-page .member-record-row
  > .member-record-cell:not(.member-record-select-cell):not(.member-record-id):not(.member-record-status-cell):not(.member-record-actions) {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  /* مربع التحديد. */
  html body #tabContent .member-records-page .member-record-select-cell {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-height: 38px !important;
    padding: 0 0 8px !important;
    justify-content: flex-start !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  /* رقم الإعلان. */
  html body #tabContent .member-records-page .member-record-id {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-height: 38px !important;
    padding: 0 0 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    text-align: right !important;
    font-weight: 500 !important;
  }

  /* شارة الحالة. */
  html body #tabContent .member-records-page .member-record-status-cell {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: auto !important;
    min-height: 38px !important;
    padding: 0 0 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  html body #tabContent .member-records-page .member-record-status-cell
  .member-record-status-stack {
    align-items: flex-end !important;
    justify-content: center !important;
  }

  /* زر الثلاث نقاط. */
  html body #tabContent .member-records-page .member-record-actions {
    grid-column: 4 !important;
    grid-row: 1 !important;
    width: 34px !important;
    min-width: 34px !important;
    min-height: 38px !important;
    padding: 0 0 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    border-bottom: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

  html body #tabContent .member-records-page .member-record-menu-toggle {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    margin: 0 !important;
  }

  /* لا نعرض الكلمات: تحديد / الإعلان / الحالة في الصف الأول. */
  html body #tabContent .member-records-page .member-record-select-cell::before,
  html body #tabContent .member-records-page .member-record-id::before,
  html body #tabContent .member-records-page .member-record-status-cell::before,
  html body #tabContent .member-records-page .member-record-actions::before {
    content: none !important;
    display: none !important;
  }

  /* أول حقل بعد الصف العلوي يبدأ بمسافة بسيطة. */
  html body #tabContent .member-records-page .member-record-row
  > .member-record-cell:not(.member-record-select-cell):not(.member-record-id):not(.member-record-status-cell):not(.member-record-actions):first-of-type {
    margin-top: 0 !important;
  }
}

/* =========================================================
   Member Ads — Tablet top row polish — 2026-09-26
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* إزالة الحدود المنفصلة من عناصر الصف الأول. */
  html body #tabContent .member-records-page .member-record-select-cell,
  html body #tabContent .member-records-page .member-record-id,
  html body #tabContent .member-records-page .member-record-status-cell,
  html body #tabContent .member-records-page .member-record-actions {
    border-bottom: 0 !important;
  }

  /* إنشاء فاصل واحد متصل أسفل الصف الأول بالكامل. */
  html body #tabContent .member-records-page .member-record-row
  > .member-record-cell[data-label="نوع الإعلان"] {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin-top: 0 !important;
    padding-top: 8px !important;
    border-top: 1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
  }

}

/* =========================================================
   Member Stores — Tablet compact pills — 2026-09-28
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {
  html body #tabContent .member-stores-page .member-store-pill {
    min-height: 22px !important;
    padding: 2px 6px !important;
    gap: 4px !important;
    border-radius: 5px !important;
    font-size: 11.5px !important;
    line-height: 1.35 !important;
  }

  html body #tabContent .member-stores-page .member-store-pill i {
    font-size: 10.5px !important;
  }
}

/* =========================================================
   Member Stores — Tablet actions menu — 2026-09-28
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */

/* القائمة الجديدة مخفية افتراضياً خارج التابلت. */
.member-store-action-menu{
  display:none;
}

@media (min-width: 721px) and (max-width: 1100px) {

  /* إخفاء صف الأزرار القديم على التابلت فقط. */
  html body #tabContent .member-stores-page .member-store-actions{
    display:none !important;
  }

  /* إبقاء الفوتر في صف واحد: التاريخ + زر الإجراءات. */
  html body #tabContent .member-stores-page .member-store-card-footer{
    position:relative !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    overflow:visible !important;
  }

  html body #tabContent .member-stores-page .member-store-card{
    overflow:visible !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu{
    position:relative !important;
    display:block !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-toggle{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    display:grid !important;
    place-items:center !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line, var(--sadaa-line, #d1d5db)) !important;
    border-radius:7px !important;
    background:#fff !important;
    color:#4b5563 !important;
    cursor:pointer !important;
    list-style:none !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-toggle::-webkit-details-marker{
    display:none !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-toggle::marker{
    content:"" !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-toggle:hover{
    border-color:var(--member-brand-line) !important;
    background:var(--member-brand-soft) !important;
    color:var(--member-brand-dark) !important;
  }

  html body #tabContent .member-stores-page .member-store-action-dropdown{
    position:absolute !important;
    inset-inline-end:0 !important;
    bottom:calc(100% + 7px) !important;
    z-index:40 !important;
    min-width:190px !important;
    padding:5px !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu:not([open])
  > .member-store-action-dropdown{
    display:none !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu[open]
  > .member-store-action-dropdown{
    display:grid !important;
    gap:2px !important;
  }

  html body #tabContent .member-stores-page .member-store-action-item{
    width:100% !important;
    min-height:36px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    padding:7px 9px !important;
    border:0 !important;
    border-radius:6px !important;
    background:transparent !important;
    color:#374151 !important;
    text-decoration:none !important;
    text-align:right !important;
    white-space:nowrap !important;
    cursor:pointer !important;
  }

  html body #tabContent .member-stores-page .member-store-action-item:hover{
    background:var(--member-brand-soft) !important;
    color:var(--member-brand-dark) !important;
  }

  html body #tabContent .member-stores-page .member-store-action-item.is-disabled,
  html body #tabContent .member-stores-page .member-store-action-item:disabled{
    opacity:.5 !important;
    cursor:not-allowed !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-form{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
  }
}

/* =========================================================
   Member Invoices — Tablet card alignment polish — 2026-09-28
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* البطاقة: عمود رئيسي واسع + عمود صغير لزر العرض في الصف الأخير. */
  html body #tabContent .member-invoices-page .invoices-table tbody tr{
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:0 12px !important;
  }

  /* رقم الفاتورة: صف كامل، العنوان يمين والقيمة في الجهة المقابلة. */
  html body #tabContent .member-invoices-page .invoice-no-cell{
    grid-column:1 / -1 !important;
    grid-row:auto !important;
    width:100% !important;
    min-height:44px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:14px !important;
    padding:7px 0 !important;
    border-bottom:1px solid #eef0f3 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-no-cell::before{
    flex:0 0 96px !important;
    margin:0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-no{
    min-width:0 !important;
    margin-inline-start:auto !important;
    justify-content:flex-end !important;
    text-align:left !important;
  }

  /* المبلغ: صف مستقل كامل بنفس محاذاة رقم الفاتورة. */
  html body #tabContent .member-invoices-page .invoice-amount-cell{
    grid-column:1 / -1 !important;
    grid-row:auto !important;
    width:100% !important;
    min-height:44px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:14px !important;
    padding:7px 0 !important;
    border-bottom:1px solid #eef0f3 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-amount-cell::before{
    flex:0 0 96px !important;
    margin:0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-amount{
    min-width:0 !important;
    margin-inline-start:auto !important;
    justify-content:flex-end !important;
    text-align:left !important;
  }

  /* نوع الخدمة والتفاصيل يبقيان صفوفاً كاملة. */
  html body #tabContent .member-invoices-page .invoice-type-cell,
  html body #tabContent .member-invoices-page .invoice-details-cell{
    grid-column:1 / -1 !important;
  }

  /* الصف الأخير: تاريخ الإنشاء + زر عرض الفاتورة. */
  html body #tabContent .member-invoices-page .invoice-date-cell{
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
    min-height:42px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:7px 0 !important;
    border-bottom:0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-date-cell::before{
    flex:0 0 96px !important;
    margin:0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-date{
    min-width:0 !important;
    margin-inline-start:auto !important;
    text-align:left !important;
    white-space:nowrap !important;
  }

  html body #tabContent .member-invoices-page .invoice-action-cell{
    grid-column:2 !important;
    align-self:center !important;
    width:auto !important;
    min-width:0 !important;
    padding:7px 0 7px 0 !important;
    border-bottom:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
  }

  html body #tabContent .member-invoices-page .invoice-action-cell::before{
    display:none !important;
  }

  html body #tabContent .member-invoices-page .invoice-view-btn{
    width:auto !important;
    min-width:118px !important;
    min-height:34px !important;
    padding:6px 10px !important;
    margin:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    white-space:nowrap !important;
  }
}

/* =========================================================
   Member Invoices — Tablet invoice number final alignment
   2026-09-28
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* عنوان رقم الفاتورة بنفس لون عناوين بقية الحقول. */
  html body #tabContent .member-invoices-page .invoice-no-cell::before{
    color:var(--invoice-muted,#6b7280) !important;
  }

  /* الرقم إلى الجهة المقابلة فعلياً.
     نستخدم margin-right لأن العنصر نفسه direction:ltr. */
  html body #tabContent .member-invoices-page .invoice-no{
    margin:0 0 0 auto !important;
    margin-right:auto !important;
    margin-left:0 !important;
    color:var(--invoice-text,#111827) !important;
    text-align:left !important;
  }
}

/* =========================================================
   Member Invoices — Tablet amount color polish — 2026-09-28
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* عنوان "المبلغ" بنفس لون عناوين بقية الحقول. */
  html body #tabContent .member-invoices-page .invoice-amount-cell::before{
    color:var(--invoice-muted,#6b7280) !important;
  }

  /* قيمة المبلغ + رمز العملة باللون الأحمر. */
  html body #tabContent .member-invoices-page .invoice-amount,
  html body #tabContent .member-invoices-page .invoice-amount .sar-value,
  html body #tabContent .member-invoices-page .invoice-amount .sar-symbol{
    color:#b91c1c !important;
  }

  html body #tabContent .member-invoices-page .invoice-amount .sar-symbol{
    background-color:currentColor !important;
  }
}

/* =========================================================
   Member Invoices — Tablet search field width — 2026-09-28
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width: 721px) and (max-width: 1100px) {

  /* الحالة العادية: لا يوجد زر "مسح". */
  html body #tabContent .member-invoices-page .invoices-toolbar{
    grid-template-columns:
      minmax(280px, 2fr)
      minmax(110px, .72fr)
      minmax(110px, .72fr)
      88px !important;
  }

  /* عند ظهور زر "مسح" نضيف عموداً خامساً بدون خنق حقل البحث. */
  html body #tabContent .member-invoices-page .invoices-toolbar:has(.invoices-toolbar-reset){
    grid-template-columns:
      minmax(250px, 1.8fr)
      minmax(105px, .68fr)
      minmax(105px, .68fr)
      88px
      76px !important;
  }

  html body #tabContent .member-invoices-page .invoices-search-wrap{
    min-width:0 !important;
    width:100% !important;
  }

  html body #tabContent .member-invoices-page .invoices-search-input{
    width:100% !important;
    min-width:0 !important;
  }
}

/* =========================================================
   Member Dashboard — Mobile mirrors approved Tablet UI
   2026-09-28
   النطاق: جميع شاشات الجوال حتى 720px
   المبدأ:
   - نفس البنية والشكل المعتمد في التابلت.
   - التغيير فقط في المسافات والعروض وتوزيع الأعمدة.
   - لا تغيير لأحجام الخطوط في هذه الطبقة.
   ========================================================= */
@media (max-width:720px){

  /* =======================================================
     الهيكل العام والهيدر
     ======================================================= */
  html body #tabContent .member-tab-page-header,
  html body #tabContent .member-tab-page-header.sadaa-page-header--member{
    width:100% !important;
    min-height:0 !important;
    margin:0 0 10px !important;
    padding:14px !important;
    border-radius:8px !important;
  }

  html body #tabContent .member-tab-page-header.sadaa-page-header--member{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
  }

  html body #tabContent .member-tab-page-header .sadaa-page-header__main{
    min-width:0 !important;
    flex:1 1 auto !important;
  }

  html body #tabContent .member-tab-page-header .sadaa-page-header__actions{
    min-width:0 !important;
    flex:0 0 auto !important;
  }

  html body #tabContent .sadaa-card--workspace{
    padding:9px !important;
    border-radius:8px !important;
  }

  html body #tabContent .sadaa-card--subsection,
  html body #tabContent .stats-content-panel,
  html body #tabContent .account-settings-content-panel{
    border-radius:8px !important;
  }

  /* =======================================================
     إحصائيات الإعلانات والمتاجر
     ======================================================= */
  html body #tabContent .stats-page .stats-selection-shell{
    margin-bottom:9px !important;
    padding:8px !important;
  }

  html body #tabContent .stats-page .member-stats-filter-form{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  html body #tabContent .stats-page .kpis,
  html body #tabContent .stats-page .store-kpis{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
  }

  html body #tabContent .stats-page .stats-filter-card,
  html body #tabContent .stats-page .stats-panel{
    padding:9px !important;
  }

  /* =======================================================
     رأس البحث والفلاتر — نفس نسخة التابلت
     ======================================================= */
  html body #tabContent .member-tablet-tools{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 0 9px !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-tablet-tools > .member-tablet-tools-summary{
    min-height:44px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    width:100% !important;
    margin:0 !important;
    padding:8px 10px !important;
    list-style:none !important;
    pointer-events:auto !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:7px 7px 0 0 !important;
    background:var(--sadaa-admin-soft,#f7f8fa) !important;
    cursor:pointer !important;
  }

  html body #tabContent .member-tablet-tools > .member-tablet-tools-summary::-webkit-details-marker{
    display:none !important;
  }

  html body #tabContent .member-tablet-tools > .member-tablet-tools-body,
  html body #tabContent .member-tablet-tools[open] > .member-tablet-tools-body{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:8px !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body #tabContent .member-tablet-tools:not([open]) > .member-tablet-tools-body{
    display:none !important;
  }

  /* =======================================================
     إعلاناتي
     ======================================================= */
  html body #tabContent .member-records-page .member-records-filters{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
    align-items:center !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page .member-records-search-wrap{
    grid-column:1 / -1 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-select,
  html body #tabContent .member-records-page .member-records-search-input{
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-actions{
    grid-column:1 / -1 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:var(--sadaa-filter-actions-gap) !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-submit,
  html body #tabContent .member-records-page .member-records-filter-clear{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-actions > :only-child{
    grid-column:1 / -1 !important;
  }

  /* الحاوية البنيوية الخارجية شفافة، وحاوية البطاقات وحدها مرئية. */
  html body #tabContent .member-records-page .member-records-form{
    width:100% !important;
    max-width:none !important;
    margin:0 0 10px !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page .member-records-list{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:7px !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:7px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar{
    grid-column:1 / -1 !important;
    width:100% !important;
    margin:0 !important;
    padding:0 0 7px !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar .member-records-toolbar-inner{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
  }

  /* نفس الصف الأول المعتمد في التابلت. */
  html body #tabContent .member-records-page .member-record-row{
    display:grid !important;
    grid-template-columns:24px minmax(0,1fr) auto 32px !important;
    column-gap:7px !important;
    row-gap:0 !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body #tabContent .member-records-page .member-record-row
  > .member-record-cell:not(.member-record-select-cell):not(.member-record-id):not(.member-record-status-cell):not(.member-record-actions){
    grid-column:1 / -1 !important;
    width:100% !important;
  }

  html body #tabContent .member-records-page .member-record-select-cell{
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
    min-height:36px !important;
    padding:0 0 7px !important;
    justify-content:flex-start !important;
    border-bottom:0 !important;
  }

  html body #tabContent .member-records-page .member-record-id{
    grid-column:2 !important;
    grid-row:1 !important;
    width:100% !important;
    min-height:36px !important;
    padding:0 0 7px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    border-bottom:0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-records-page .member-record-status-cell{
    grid-column:3 !important;
    grid-row:1 !important;
    width:auto !important;
    min-height:36px !important;
    padding:0 0 7px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    border-bottom:0 !important;
  }

  html body #tabContent .member-records-page .member-record-actions{
    grid-column:4 !important;
    grid-row:1 !important;
    width:32px !important;
    min-width:32px !important;
    min-height:36px !important;
    padding:0 0 7px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    border-bottom:0 !important;
  }

  html body #tabContent .member-records-page .member-record-menu-toggle{
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    margin:0 !important;
  }

  html body #tabContent .member-records-page .member-record-select-cell::before,
  html body #tabContent .member-records-page .member-record-id::before,
  html body #tabContent .member-records-page .member-record-status-cell::before,
  html body #tabContent .member-records-page .member-record-actions::before{
    content:none !important;
    display:none !important;
  }

  /* فاصل واحد متصل بعد الصف الأول. */
  html body #tabContent .member-records-page .member-record-row
  > .member-record-cell[data-label="نوع الإعلان"]{
    grid-column:1 / -1 !important;
    width:100% !important;
    margin-top:0 !important;
    padding-top:7px !important;
    border-top:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
  }

  /* =======================================================
     متاجري
     ======================================================= */
  html body #tabContent .member-stores-page .member-stores-list-shell{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:7px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-stores-page .member-stores-grid{
    gap:7px !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body #tabContent .member-stores-page .member-stores-summary{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
  }

  html body #tabContent .member-stores-page .member-store-card-head{
    grid-template-columns:76px minmax(0,1fr) !important;
    gap:9px !important;
    padding:11px 12px !important;
  }

  html body #tabContent .member-stores-page .member-store-logo-shell{
    width:76px !important;
    height:76px !important;
  }

  html body #tabContent .member-stores-page .member-store-feature-state{
    grid-column:1 / -1 !important;
  }

  html body #tabContent .member-stores-page
  .member-store-card:not(.is-featured) .member-store-feature-state{
    display:none !important;
  }

  /* نفس الشارات المصغرة المعتمدة في التابلت. */
  html body #tabContent .member-stores-page .member-store-pill{
    min-height:22px !important;
    padding:2px 6px !important;
    gap:4px !important;
    border-radius:5px !important;
    line-height:1.35 !important;
  }

  /* نفس قائمة الثلاث نقاط بدلاً من الأزرار. */
  html body #tabContent .member-stores-page .member-store-actions{
    display:none !important;
  }

  html body #tabContent .member-stores-page .member-store-card{
    overflow:visible !important;
  }

  html body #tabContent .member-stores-page .member-store-card-footer{
    position:relative !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
    padding:9px 11px !important;
    overflow:visible !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu{
    position:relative !important;
    display:block !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-toggle{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    display:grid !important;
    place-items:center !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#d1d5db)) !important;
    border-radius:7px !important;
    background:#fff !important;
    color:#4b5563 !important;
    cursor:pointer !important;
    list-style:none !important;
  }

  html body #tabContent .member-stores-page .member-store-action-dropdown{
    position:absolute !important;
    inset-inline-end:0 !important;
    bottom:calc(100% + 7px) !important;
    z-index:40 !important;
    width:min(190px,calc(100vw - 36px)) !important;
    min-width:0 !important;
    padding:5px !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu:not([open])
  > .member-store-action-dropdown{
    display:none !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu[open]
  > .member-store-action-dropdown{
    display:grid !important;
    gap:2px !important;
  }

  html body #tabContent .member-stores-page .member-store-action-item{
    width:100% !important;
    min-height:36px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    padding:7px 9px !important;
    border:0 !important;
    border-radius:6px !important;
    background:transparent !important;
    text-decoration:none !important;
    text-align:right !important;
    white-space:nowrap !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-form{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
  }

  /* =======================================================
     فواتيري
     ======================================================= */
  html body #tabContent .member-invoices-page .invoices-stats{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
  }

  html body #tabContent .member-invoices-page .invoice-stat-card:last-child{
    grid-column:1 / -1 !important;
  }

  html body #tabContent .member-invoices-page .invoices-toolbar{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
    align-items:center !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-invoices-page .invoices-search-wrap,
  html body #tabContent .member-invoices-page .invoices-filter-count{
    grid-column:1 / -1 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-invoices-page .invoices-toolbar-btn,
  html body #tabContent .member-invoices-page .invoices-toolbar-reset,
  html body #tabContent .member-invoices-page .invoices-filter-select,
  html body #tabContent .member-invoices-page .invoices-search-input{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body #tabContent .member-invoices-page .invoices-records-shell{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:7px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-invoices-page .invoices-list{
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body #tabContent .member-invoices-page .invoices-table tbody{
    display:grid !important;
    gap:7px !important;
  }

  html body #tabContent .member-invoices-page .invoices-table tbody tr{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:0 8px !important;
    padding:9px 10px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-top:2px solid var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
    border-radius:8px !important;
    background:#fff !important;
  }

  /* رقم الفاتورة والمبلغ: كل واحد في صف مستقل. */
  html body #tabContent .member-invoices-page .invoice-no-cell,
  html body #tabContent .member-invoices-page .invoice-amount-cell{
    grid-column:1 / -1 !important;
    width:100% !important;
    min-height:42px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    padding:6px 0 !important;
    border-bottom:1px solid #eef0f3 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-no-cell::before,
  html body #tabContent .member-invoices-page .invoice-amount-cell::before{
    flex:0 0 88px !important;
    margin:0 !important;
    text-align:right !important;
    color:var(--invoice-muted,#6b7280) !important;
  }

  html body #tabContent .member-invoices-page .invoice-no,
  html body #tabContent .member-invoices-page .invoice-amount{
    min-width:0 !important;
    margin-right:auto !important;
    margin-left:0 !important;
    justify-content:flex-end !important;
    text-align:left !important;
  }

  html body #tabContent .member-invoices-page .invoice-no{
    color:var(--invoice-text,#111827) !important;
  }

  html body #tabContent .member-invoices-page .invoice-amount,
  html body #tabContent .member-invoices-page .invoice-amount .sar-value,
  html body #tabContent .member-invoices-page .invoice-amount .sar-symbol{
    color:#b91c1c !important;
  }

  html body #tabContent .member-invoices-page .invoice-amount .sar-symbol{
    background-color:currentColor !important;
  }

  html body #tabContent .member-invoices-page .invoice-type-cell,
  html body #tabContent .member-invoices-page .invoice-details-cell{
    grid-column:1 / -1 !important;
  }

  html body #tabContent .member-invoices-page .invoice-type-cell,
  html body #tabContent .member-invoices-page .invoice-details-cell,
  html body #tabContent .member-invoices-page .invoice-date-cell{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    min-height:40px !important;
    padding:6px 0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-type-cell::before,
  html body #tabContent .member-invoices-page .invoice-details-cell::before,
  html body #tabContent .member-invoices-page .invoice-date-cell::before{
    flex:0 0 88px !important;
    margin:0 !important;
    text-align:right !important;
  }

  html body #tabContent .member-invoices-page .invoice-type-pill,
  html body #tabContent .member-invoices-page .invoice-dims-pill,
  html body #tabContent .member-invoices-page .invoice-date{
    min-width:0 !important;
    margin-inline-start:auto !important;
    text-align:left !important;
  }

  /* تاريخ الإنشاء + زر عرض الفاتورة في صف واحد. */
  html body #tabContent .member-invoices-page .invoice-date-cell{
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
    border-bottom:0 !important;
  }

  html body #tabContent .member-invoices-page .invoice-action-cell{
    grid-column:2 !important;
    align-self:center !important;
    width:auto !important;
    min-width:0 !important;
    padding:6px 0 !important;
    border-bottom:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
  }

  html body #tabContent .member-invoices-page .invoice-action-cell::before{
    display:none !important;
  }

  html body #tabContent .member-invoices-page .invoice-view-btn{
    width:auto !important;
    min-width:96px !important;
    min-height:34px !important;
    padding:6px 8px !important;
    margin:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px !important;
    white-space:nowrap !important;
  }

  html body #tabContent .member-invoices-page .invoices-pagination,
  html body #tabContent .member-records-page .member-records-pagination,
  html body #tabContent .sadaa-pagination{
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:5px !important;
  }

  html body #tabContent .member-invoices-page .invoices-pagination{
    width:100% !important;
    margin:8px 0 0 !important;
    padding:8px 0 0 !important;
    border-top:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
  }

  /* =======================================================
     إعدادات الحساب
     ======================================================= */
  html body #tabContent .account-settings-content-panel,
  html body #tabContent .settings-wrapper .account-settings-content-panel{
    padding:9px !important;
    border-radius:8px !important;
  }
}

/* شاشات الجوال الأصغر: تعديل التوزيع فقط، بدون تغيير الخط. */
@media (max-width:420px){

  html body #tabContent .member-tab-page-header.sadaa-page-header--member{
    align-items:flex-start !important;
  }

  html body #tabContent .stats-page .kpis,
  html body #tabContent .stats-page .store-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
  }

  html body #tabContent .member-records-page .member-records-filters,
  html body #tabContent .member-invoices-page .invoices-toolbar{
    gap:6px !important;
  }

  html body #tabContent .member-stores-page .member-store-card-head{
    grid-template-columns:68px minmax(0,1fr) !important;
    gap:8px !important;
    padding:10px !important;
  }

  html body #tabContent .member-stores-page .member-store-logo-shell{
    width:68px !important;
    height:68px !important;
  }

  html body #tabContent .member-stores-page .member-store-card-footer{
    padding-inline:9px !important;
  }

  html body #tabContent .member-invoices-page .invoice-no-cell::before,
  html body #tabContent .member-invoices-page .invoice-amount-cell::before,
  html body #tabContent .member-invoices-page .invoice-type-cell::before,
  html body #tabContent .member-invoices-page .invoice-details-cell::before,
  html body #tabContent .member-invoices-page .invoice-date-cell::before{
    flex-basis:78px !important;
  }

  html body #tabContent .member-invoices-page .invoice-view-btn{
    min-width:88px !important;
    padding-inline:7px !important;
  }
}

@media (max-width:350px){

  html body #tabContent .member-records-page .member-record-row{
    grid-template-columns:22px minmax(0,1fr) auto 30px !important;
    column-gap:5px !important;
  }

  html body #tabContent .member-stores-page .member-stores-summary{
    grid-template-columns:1fr !important;
  }

  html body #tabContent .member-invoices-page .invoice-no-cell::before,
  html body #tabContent .member-invoices-page .invoice-amount-cell::before,
  html body #tabContent .member-invoices-page .invoice-type-cell::before,
  html body #tabContent .member-invoices-page .invoice-details-cell::before,
  html body #tabContent .member-invoices-page .invoice-date-cell::before{
    flex-basis:72px !important;
  }

  html body #tabContent .member-invoices-page .invoice-view-btn{
    min-width:82px !important;
  }
}

/* =========================================================
   Member Ads — Mobile search/filter mirror of Tablet
   2026-09-28
   النطاق: الجوال فقط حتى 720px
   ========================================================= */
@media (max-width:720px){

  /* نفس حاوية التابلت حرفياً من ناحية الشكل. */
  html body #tabContent .member-records-page .member-tablet-tools{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 0 10px !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
  }

  /* رأس المنطقة مطابق للتابلت: عنوان + أيقونة + سهم داخل مربع. */
  html body #tabContent .member-records-page
  .member-tablet-tools > .member-tablet-tools-summary{
    min-height:44px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    width:100% !important;
    margin:0 !important;
    padding:8px 10px !important;
    list-style:none !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:7px 7px 0 0 !important;
    background:var(--sadaa-admin-soft,#f7f8fa) !important;
    color:var(--sadaa-admin-text,var(--sadaa-text-2,#374151)) !important;
    box-shadow:none !important;
    cursor:pointer !important;
  }

  html body #tabContent .member-records-page
  .member-tablet-tools-summary .sadaa-tablet-disclosure__title{
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;
    min-width:0 !important;
    margin:0 !important;
    color:inherit !important;
  }

  html body #tabContent .member-records-page
  .member-tablet-tools-summary .sadaa-tablet-disclosure__title > i{
    color:var(--sadaa-primary) !important;
  }

  html body #tabContent .member-records-page
  .member-tablet-tools-summary .sadaa-tablet-disclosure__chevron{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    flex:0 0 28px !important;
    display:grid !important;
    place-items:center !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:6px !important;
    background:#fff !important;
    color:var(--sadaa-primary) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page
  .member-tablet-tools > .member-tablet-tools-body{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:9px !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  /* توزيع الجوال: نفس العناصر، مع التكييف الضروري للعرض فقط. */
  html body #tabContent .member-records-page .member-records-filters{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page .member-records-search-wrap{
    grid-column:1 / -1 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-select{
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-records-page .member-records-filter-actions{
    grid-column:1 / -1 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:var(--sadaa-filter-actions-gap) !important;
    width:100% !important;
    min-width:0 !important;
  }

  /* زر التطبيق يستخدم لون الزر الأساسي المركزي، لا اللون المحلي الثابت. */
  html body #tabContent .member-records-page .member-records-filter-submit{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    border-color:var(--sadaa-primary) !important;
    background:var(--sadaa-primary) !important;
    color:#fff !important;
  }

  html body #tabContent .member-records-page .member-records-filter-submit:hover,
  html body #tabContent .member-records-page .member-records-filter-submit:focus-visible{
    border-color:var(--sadaa-primary-dark) !important;
    background:var(--sadaa-primary-dark) !important;
    color:#fff !important;
  }

  html body #tabContent .member-records-page .member-records-filter-clear{
    width:100% !important;
    min-width:0 !important;
  }
}

/* =========================================================
   Member Ads — Tablet primary button color — 2026-09-28
   النطاق: التابلت فقط 721px–1100px
   ========================================================= */
@media (min-width:721px) and (max-width:1100px){

  html body #tabContent .member-records-page .member-records-filter-submit{
    border-color:var(--sadaa-primary) !important;
    background:var(--sadaa-primary) !important;
    color:#fff !important;
  }

  html body #tabContent .member-records-page .member-records-filter-submit:hover,
  html body #tabContent .member-records-page .member-records-filter-submit:focus-visible{
    border-color:var(--sadaa-primary-dark) !important;
    background:var(--sadaa-primary-dark) !important;
    color:#fff !important;
  }
}

/* =========================================================
   Member Dashboard — Disclosure chevron logic v3
   2026-09-28
   التابلت + الجوال
   مغلق = لليسار
   مفتوح = للأسفل
   ========================================================= */
@media (max-width:1100px){

  /* مغلق: سهم لليسار. */
  html body #tabContent details.member-tablet-tools:not([open])
  > summary.member-tablet-tools-summary
  .sadaa-tablet-disclosure__chevron::before{
    position:static !important;
    left:auto !important;
    top:auto !important;
    transform:rotate(45deg) !important;
    transform-origin:center !important;
    transition:transform 160ms ease !important;
  }

  /* مفتوح: سهم للأسفل.
     في RTL ومع border-inline-end تكون الزاوية -45deg هي الاتجاه السفلي بصرياً. */
  html body #tabContent details.member-tablet-tools[open]
  > summary.member-tablet-tools-summary
  .sadaa-tablet-disclosure__chevron::before{
    position:static !important;
    left:auto !important;
    top:auto !important;
    transform:rotate(-45deg) !important;
    transform-origin:center !important;
  }
}

/* =========================================================
   Sadaa Interaction Stability — Pointer / Touch Flash Guard v2
   2026-09-28

   النطاق:
   - سطح المكتب
   - التابلت
   - الجوال

   الهدف:
   منع الوميض الناتج عن النقر/اللمس، مع الإبقاء على
   focus-visible عند التنقل بلوحة المفاتيح.
   ========================================================= */

/* ---------------------------------------------------------
   1) إلغاء Tap Highlight على جميع المكونات التفاعلية.
   --------------------------------------------------------- */
html body .member-dashboard-wrapper a,
html body .member-dashboard-wrapper button,
html body .member-dashboard-wrapper summary,
html body .member-dashboard-wrapper label[for],
html body .member-dashboard-wrapper input,
html body .member-dashboard-wrapper select,
html body .member-dashboard-wrapper textarea,
html body .member-dashboard-wrapper [role="button"],
html body .member-dashboard-wrapper [tabindex],

html body .sadaa-btn,
html body .sadaa-menu-trigger,
html body .sadaa-pagination__item,
html body .sadaa-accordion__summary,
html body .sadaa-tablet-disclosure__summary,
html body .sadaa-checkbox,
html body .sadaa-radio,
html body .sadaa-switch,
html body .sadaa-date-control__input,

html body .flatpickr-calendar.sadaa-calendar a,
html body .flatpickr-calendar.sadaa-calendar button,
html body .flatpickr-calendar.sadaa-calendar input,
html body .flatpickr-calendar.sadaa-calendar select,
html body .flatpickr-calendar.sadaa-calendar .flatpickr-day,
html body .flatpickr-calendar.sadaa-calendar .flatpickr-prev-month,
html body .flatpickr-calendar.sadaa-calendar .flatpickr-next-month{
  -webkit-tap-highlight-color:transparent !important;
}

/* العناصر التي تعمل كأزرار تستجيب مباشرة بدون تأخير لمس. */
html body .member-dashboard-wrapper a,
html body .member-dashboard-wrapper button,
html body .member-dashboard-wrapper summary,
html body .member-dashboard-wrapper label[for],
html body .member-dashboard-wrapper [role="button"],
html body .sadaa-btn,
html body .sadaa-menu-trigger,
html body .sadaa-pagination__item,
html body .sadaa-accordion__summary,
html body .sadaa-tablet-disclosure__summary{
  touch-action:manipulation;
}

/* ---------------------------------------------------------
   2) النقر/اللمس لا يُظهر Focus بصرياً مؤقتاً.
      Focus لوحة المفاتيح يبقى عبر :focus-visible.
   --------------------------------------------------------- */
html body .member-dashboard-wrapper a:focus:not(:focus-visible),
html body .member-dashboard-wrapper button:focus:not(:focus-visible),
html body .member-dashboard-wrapper summary:focus:not(:focus-visible),
html body .member-dashboard-wrapper [role="button"]:focus:not(:focus-visible),
html body .member-dashboard-wrapper [tabindex]:focus:not(:focus-visible),

html body .sadaa-btn:focus:not(:focus-visible),
html body .sadaa-menu-trigger:focus:not(:focus-visible),
html body .sadaa-pagination__item:focus:not(:focus-visible),
html body .sadaa-accordion__summary:focus:not(:focus-visible),
html body .sadaa-tablet-disclosure__summary:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* ---------------------------------------------------------
   3) الحقول والقوائم المنسدلة المركزية:
      إزالة حلقة Focus الناتجة من النقر فقط.
   --------------------------------------------------------- */
html body .sadaa-input:focus:not(:focus-visible),
html body .sadaa-textarea:focus:not(:focus-visible),
html body .sadaa-select:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  border-color:var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
  background:var(--sadaa-surface,#fff) !important;
  transition:none !important;
}

/* المحافظة على حدود الخطأ/النجاح عند النقر. */
html body .sadaa-field.is-error .sadaa-input:focus:not(:focus-visible),
html body .sadaa-field.is-error .sadaa-textarea:focus:not(:focus-visible),
html body .sadaa-field.is-error .sadaa-select:focus:not(:focus-visible),
html body .sadaa-input.is-error:focus:not(:focus-visible),
html body .sadaa-textarea.is-error:focus:not(:focus-visible),
html body .sadaa-select.is-error:focus:not(:focus-visible),
html body .sadaa-input[aria-invalid="true"]:focus:not(:focus-visible),
html body .sadaa-textarea[aria-invalid="true"]:focus:not(:focus-visible),
html body .sadaa-select[aria-invalid="true"]:focus:not(:focus-visible){
  border-color:var(--sadaa-danger,#b42318) !important;
  box-shadow:none !important;
}

html body .sadaa-field.is-success .sadaa-input:focus:not(:focus-visible),
html body .sadaa-field.is-success .sadaa-textarea:focus:not(:focus-visible),
html body .sadaa-field.is-success .sadaa-select:focus:not(:focus-visible),
html body .sadaa-input.is-success:focus:not(:focus-visible),
html body .sadaa-textarea.is-success:focus:not(:focus-visible),
html body .sadaa-select.is-success:focus:not(:focus-visible){
  border-color:var(--sadaa-success,#067647) !important;
  box-shadow:none !important;
}

/* ---------------------------------------------------------
   4) حقول لوحة العضو المحلية التي كانت تستخدم :focus مباشرة.
   --------------------------------------------------------- */
html body .member-dashboard-wrapper .member-records-search-input:focus:not(:focus-visible),
html body .member-dashboard-wrapper .member-records-filter-select:focus:not(:focus-visible){
  border-color:#d9dee6 !important;
  box-shadow:none !important;
  outline:none !important;
  transition:none !important;
}

html body .member-dashboard-wrapper .invoices-search-input:focus:not(:focus-visible),
html body .member-dashboard-wrapper .invoices-filter-select:focus:not(:focus-visible){
  border-color:var(--invoice-border,#d1d5db) !important;
  background:#fff !important;
  box-shadow:none !important;
  outline:none !important;
  transition:none !important;
}

html body .member-dashboard-wrapper .member-stats-select-wrap select:focus:not(:focus-visible){
  border-color:#cbd5e1 !important;
  box-shadow:none !important;
  outline:none !important;
  transition:none !important;
}

/* أي عنصر نموذج محلي آخر داخل لوحة العضو. */
html body .member-dashboard-wrapper input:focus:not(:focus-visible),
html body .member-dashboard-wrapper select:focus:not(:focus-visible),
html body .member-dashboard-wrapper textarea:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* ---------------------------------------------------------
   5) Checkbox / Radio:
      تغيير الحالة يبقى فورياً، بدون حلقة Focus أو Transition.
   --------------------------------------------------------- */
html body .sadaa-checkbox:focus:not(:focus-visible),
html body .sadaa-radio:focus:not(:focus-visible),
html body .member-dashboard-wrapper input[type="checkbox"]:focus:not(:focus-visible),
html body .member-dashboard-wrapper input[type="radio"]:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* Switch */
html body .sadaa-switch__input:focus:not(:focus-visible) + .sadaa-switch__track,
html body .sadaa-switch--button:focus:not(:focus-visible) > .sadaa-switch__track{
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* ---------------------------------------------------------
   6) Select Shell:
      السهم لا يغيّر لونه للحظة عند النقر.
   --------------------------------------------------------- */
html body .sadaa-select-shell:has(.sadaa-select:focus:not(:focus-visible))::after{
  border-right-color:var(--sadaa-admin-muted,var(--sadaa-muted,#6b7280)) !important;
  border-bottom-color:var(--sadaa-admin-muted,var(--sadaa-muted,#6b7280)) !important;
  transition:none !important;
}

html body .sadaa-select-shell--modal:has(.sadaa-select:focus:not(:focus-visible))::after{
  background:none !important;
  border-top-color:var(--sadaa-muted,#6b7280) !important;
  transition:none !important;
}

/* ---------------------------------------------------------
   7) Date controls:
      عند فتح التقويم بالماوس/اللمس لا تظهر حلقة أو قفزة لونية.
   --------------------------------------------------------- */
html body .sadaa-date-control__input:focus:not(:focus-visible),
html body .sadaa-date-control.is-calendar-open:has(.sadaa-date-control__input:focus:not(:focus-visible))
.sadaa-date-control__input{
  outline:none !important;
  box-shadow:none !important;
  border-color:var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
  transition:none !important;
}

html body .sadaa-date-control:has(.sadaa-date-control__input:focus:not(:focus-visible))
.sadaa-date-control__icon,
html body .sadaa-date-control.is-calendar-open:has(.sadaa-date-control__input:focus:not(:focus-visible))
.sadaa-date-control__icon{
  color:var(--sadaa-muted,#6b7280) !important;
  transition:none !important;
}

/* ---------------------------------------------------------
   8) Flatpickr:
      منع الوميض عند الأيام، الأسهم، السنة، والوقت.
   --------------------------------------------------------- */
html body .flatpickr-calendar.sadaa-calendar .flatpickr-day:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

html body .flatpickr-calendar.sadaa-calendar
.flatpickr-day:focus:not(:focus-visible):not(.selected):not(.startRange):not(.endRange):not(.inRange):not(.today){
  background:transparent !important;
  border-color:transparent !important;
  color:#374151 !important;
}

html body .flatpickr-calendar.sadaa-calendar
.flatpickr-day.today:focus:not(:focus-visible){
  background:#fff !important;
  border-color:var(--sadaa-calendar-primary) !important;
  color:var(--sadaa-calendar-dark) !important;
}

html body .flatpickr-calendar.sadaa-calendar
.flatpickr-current-month input.cur-year:focus:not(:focus-visible){
  background:rgba(255,255,255,.13) !important;
  border-color:rgba(255,255,255,.22) !important;
  box-shadow:none !important;
  outline:none !important;
  transition:none !important;
}

html body .flatpickr-calendar.sadaa-calendar
.flatpickr-current-month .flatpickr-monthDropdown-months:focus:not(:focus-visible){
  box-shadow:none !important;
  outline:none !important;
  transition:none !important;
}

html body .flatpickr-calendar.sadaa-calendar
.flatpickr-time input:focus:not(:focus-visible),
html body .flatpickr-calendar.sadaa-calendar
.flatpickr-time .flatpickr-am-pm:focus:not(:focus-visible){
  background:#fff !important;
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

html body .flatpickr-calendar.sadaa-calendar
.flatpickr-prev-month:focus:not(:focus-visible),
html body .flatpickr-calendar.sadaa-calendar
.flatpickr-next-month:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* ---------------------------------------------------------
   9) أثناء Pointer Focus نوقف Transition المؤقت فقط.
      Hover الطبيعي يعود بمجرد زوال Focus.
   --------------------------------------------------------- */
html body .member-dashboard-wrapper
:is(a,button,summary,input,select,textarea,[role="button"],[tabindex]):focus:not(:focus-visible),
html body
:is(.sadaa-btn,.sadaa-menu-trigger,.sadaa-pagination__item,.sadaa-checkbox,.sadaa-radio,.sadaa-date-control__input):focus:not(:focus-visible){
  transition:none !important;
}

/* =========================================================
   Member Ads — Select All plain control — 2026-09-28
   جميع الشاشات
   إزالة مظهر الزر المحيط بـ "تحديد الكل".
   ========================================================= */
html body #tabContent .member-records-page .member-records-check-all{
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:7px !important;
  min-height:0 !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:inherit !important;
  cursor:pointer !important;
  -webkit-tap-highlight-color:transparent !important;
  transition:none !important;
}

html body #tabContent .member-records-page
.member-records-check-all:hover,
html body #tabContent .member-records-page
.member-records-check-all:focus-within{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
}

/* مربع التحديد نفسه يبقى بسيطاً وواضحاً بدون أي غلاف إضافي. */
html body #tabContent .member-records-page .member-records-check-all-input{
  margin:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  outline:none !important;
  -webkit-tap-highlight-color:transparent !important;
}

/* =========================================================
   Member Dashboard — Mobile polish round 2 — 2026-09-28
   فواتيري + إعلاناتي + متاجري
   ========================================================= */

/* ---------------------------------------------------------
   فواتيري — الجوال 375px فأعلى
   رأس البحث والفلاتر مطابق لبقية مناطق البحث.
   --------------------------------------------------------- */
@media (min-width:375px) and (max-width:720px){

  html body #tabContent .member-invoices-page
  .member-tablet-tools > .member-tablet-tools-summary{
    min-height:44px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    width:100% !important;
    margin:0 !important;
    padding:8px 10px !important;
    direction:rtl !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:7px 7px 0 0 !important;
    background:var(--sadaa-admin-soft,#f7f8fa) !important;
    color:var(--sadaa-admin-text,var(--sadaa-text-2,#374151)) !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-invoices-page
  .member-tablet-tools-summary .sadaa-tablet-disclosure__title{
    flex:1 1 auto !important;
    min-width:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:7px !important;
    margin:0 !important;
    white-space:nowrap !important;
    color:inherit !important;
  }

  html body #tabContent .member-invoices-page
  .member-tablet-tools-summary .sadaa-tablet-disclosure__title > i{
    flex:0 0 auto !important;
    width:15px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
    color:var(--sadaa-primary) !important;
  }

  html body #tabContent .member-invoices-page
  .member-tablet-tools-summary .sadaa-tablet-disclosure__chevron{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    flex:0 0 28px !important;
    display:grid !important;
    place-items:center !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:6px !important;
    background:#fff !important;
    color:var(--sadaa-primary) !important;
    box-shadow:none !important;
  }

  /* مغلق = لليسار. */
  html body #tabContent .member-invoices-page
  details.member-tablet-tools:not([open])
  > summary.member-tablet-tools-summary
  .sadaa-tablet-disclosure__chevron::before{
    position:static !important;
    left:auto !important;
    transform:rotate(45deg) !important;
    transform-origin:center !important;
  }

  /* مفتوح = للأسفل. */
  html body #tabContent .member-invoices-page
  details.member-tablet-tools[open]
  > summary.member-tablet-tools-summary
  .sadaa-tablet-disclosure__chevron::before{
    position:static !important;
    left:auto !important;
    transform:rotate(-45deg) !important;
    transform-origin:center !important;
  }
}

/* ---------------------------------------------------------
   فواتيري — الجوال + التابلت
   توسيط ملخص النتائج تحت أزرار تطبيق / مسح.
   --------------------------------------------------------- */
@media (max-width:1100px){
  html body #tabContent .member-invoices-page .invoices-filter-count{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px 18px !important;
    width:100% !important;
    margin:2px 0 0 !important;
    padding-top:2px !important;
    text-align:center !important;
    flex-wrap:wrap !important;
  }

  html body #tabContent .member-invoices-page .invoices-filter-count > span{
    flex:0 1 auto !important;
    margin:0 !important;
    text-align:center !important;
  }
}

/* ---------------------------------------------------------
   إعلاناتي — الجوال 375px فأعلى
   فصل أزرار تطبيق / مسح وضبط محاذاة محتوى البطاقة.
   --------------------------------------------------------- */
@media (min-width:375px) and (max-width:720px){
  html body #tabContent .member-records-page .member-records-filter-actions{
    gap:var(--sadaa-filter-actions-gap) !important;
  }

  html body #tabContent .member-records-page .member-records-filter-submit,
  html body #tabContent .member-records-page .member-records-filter-clear{
    margin:0 !important;
  }

  /* محاذاة رأس/قيمة كل صف في منتصف ارتفاع الصف. */
  html body #tabContent .member-records-page .member-record-cell{
    min-height:38px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding-top:6px !important;
    padding-bottom:6px !important;
    line-height:1.55 !important;
  }

  html body #tabContent .member-records-page .member-record-cell::before{
    align-self:center !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    line-height:1.55 !important;
  }

  html body #tabContent .member-records-page .member-record-cell > *{
    align-self:center !important;
  }

  /* لا نغيّر صف الرأس الأول الذي له توزيع مستقل. */
  html body #tabContent .member-records-page .member-record-select-cell,
  html body #tabContent .member-records-page .member-record-id,
  html body #tabContent .member-records-page .member-record-status-cell,
  html body #tabContent .member-records-page .member-record-actions{
    min-height:36px !important;
    padding-top:0 !important;
    padding-bottom:7px !important;
  }
}

/* ---------------------------------------------------------
   متاجري — الجوال 375px فأعلى
   أول بطاقتين في صف، والثالثة بعرض الصف كاملاً.
   --------------------------------------------------------- */
@media (min-width:375px) and (max-width:720px){
  html body #tabContent .member-stores-page .member-stores-summary{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
    width:100% !important;
    margin-bottom:12px !important;
  }

  html body #tabContent .member-stores-page
  .member-stores-summary > .member-stores-summary-card{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body #tabContent .member-stores-page
  .member-stores-summary > .member-stores-summary-card:last-child{
    grid-column:1 / -1 !important;
  }
}

/* =========================================================
   Member Invoices — Mobile action row wrapper v4
   2026-09-28
   النطاق: الجوال 375px–720px

   بدون "مسح": تطبيق بعرض كامل.
   مع "مسح": تطبيق + مسح في نفس الصف بالتساوي.
   الحل يعتمد على حاوية مستقلة للأزرار ولا يتأثر
   بتوزيع Grid الخارجي للبحث والفلاتر.
   ========================================================= */

/* خارج الجوال تبقى الحاوية شفافة تخطيطياً حتى لا تغيّر
   توزيع التابلت وسطح المكتب المعتمد. */
html body #tabContent .member-invoices-page .invoices-toolbar-actions{
  display:contents;
}

@media (min-width:375px) and (max-width:720px){

  html body #tabContent .member-invoices-page
  form.invoices-toolbar{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-invoices-page
  form.invoices-toolbar > .invoices-search-wrap{
    grid-column:1 / -1 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body #tabContent .member-invoices-page
  form.invoices-toolbar > .invoices-filter-select{
    width:100% !important;
    min-width:0 !important;
  }

  /* حاوية الأزرار نفسها تشغل صفاً كاملاً. */
  html body #tabContent .member-invoices-page
  form.invoices-toolbar > .invoices-toolbar-actions{
    grid-column:1 / -1 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:var(--sadaa-filter-actions-gap) !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* عند ظهور "مسح" يتحول صف الأزرار إلى نصفين متساويين. */
  html body #tabContent .member-invoices-page
  form.invoices-toolbar > .invoices-toolbar-actions.has-reset{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  html body #tabContent .member-invoices-page
  .invoices-toolbar-actions > .invoices-toolbar-btn,
  html body #tabContent .member-invoices-page
  .invoices-toolbar-actions > .invoices-toolbar-reset{
    grid-column:auto !important;
    grid-row:auto !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    justify-self:stretch !important;
  }

  html body #tabContent .member-invoices-page
  form.invoices-toolbar > .invoices-filter-count{
    grid-column:1 / -1 !important;
    width:100% !important;
    min-width:0 !important;
  }
}

/* =========================================================
   Sadaa Filters — Central action spacing
   2026-09-29

   المصدر المركزي الوحيد للمسافة بين أزرار
   "تطبيق / مسح" في مناطق البحث والفلاتر.
   ========================================================= */
:root{
  --sadaa-filter-actions-gap:10px;
}

/* الحاويات الحالية/الموحّدة في لوحة العضو */
html body #tabContent .member-records-page .member-records-filter-actions,
html body #tabContent .member-invoices-page .invoices-toolbar-actions,
html body #tabContent .member-stores-page .member-stores-filter-actions,
html body #tabContent .member-stores-page .member-stores-toolbar-actions,
html body #tabContent .member-stores-page .stores-filter-actions,
html body #tabContent .member-stores-page .stores-toolbar-actions,
html body #tabContent .sadaa-filter-actions{
  gap:var(--sadaa-filter-actions-gap) !important;
}

/* =========================================================
   Member Dashboard — Wide Tablet Sidebar Layout
   2026-09-29
   النطاق: 901px–1100px (يشمل 1024px)
   الهدف:
   - إلغاء زر "القائمة الرئيسية".
   - إظهار القائمة كعمود جانبي دائم بجانب محتوى التبويب.
   - الإبقاء على Drawer للجوال و768px كما هو.
   ========================================================= */
@media (min-width:901px) and (max-width:1100px){

  :root{
    --member-wide-tablet-sidebar-width:265px;
    --member-wide-tablet-layout-gap:12px;
  }

  /* إذا تم تكبير الشاشة بينما الـ Drawer مفتوح نعيد تمرير الصفحة الطبيعي. */
  html body.member-dashboard-drawer-open{
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }

  /* الحاوية الرئيسية تصبح عمود قائمة + محتوى، مثل سطح المكتب ولكن بمقاس تابلت. */
  html body .dashboard-wrapper.member-dashboard-wrapper{
    display:flex !important;
    flex-direction:row !important;
    align-items:flex-start !important;
    gap:var(--member-wide-tablet-layout-gap) !important;
    width:min(1430px, calc(100% - 20px)) !important;
    max-width:1430px !important;
    margin:14px auto 28px !important;
    padding:0 !important;
    direction:rtl !important;
  }

  /* إلغاء شريط "القائمة الرئيسية" في التابلت العريض. */
  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-dashboard-mobile-toggle{
    display:none !important;
    width:0 !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }

  /* القائمة تعود من Drawer إلى عمود جانبي ثابت داخل نفس Layout. */
  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack{
    position:sticky !important;
    top:82px !important;
    right:auto !important;
    left:auto !important;
    z-index:20 !important;
    display:flex !important;
    flex:0 0 var(--member-wide-tablet-sidebar-width) !important;
    flex-direction:column !important;
    gap:10px !important;
    width:var(--member-wide-tablet-sidebar-width) !important;
    max-width:var(--member-wide-tablet-sidebar-width) !important;
    height:auto !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
    background:transparent !important;
    border-radius:0 !important;
    box-shadow:none !important;
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:none !important;
    overscroll-behavior:auto !important;
  }

  /* وجود class فتح الـ Drawer لا يغيّر شكل العمود في 1024px. */
  html body .dashboard-wrapper.member-dashboard-wrapper.mobile-tabs-open
  > .member-sidebar-stack{
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }

  /* لا Backdrop ولا زر إغلاق لأن القائمة أصبحت ظاهرة دائماً. */
  html body .dashboard-wrapper.member-dashboard-wrapper
  .member-sidebar-backdrop,
  html body .dashboard-wrapper.member-dashboard-wrapper
  .member-sidebar-close{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }

  /* رأس القائمة يعود لبطاقة عادية بدل رأس Drawer. */
  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-head{
    position:relative !important;
    top:auto !important;
    z-index:1 !important;
    flex:0 0 auto !important;
    min-height:84px !important;
    margin:0 !important;
    padding:14px !important;
    border-radius:8px !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-row{
    width:100% !important;
    min-width:0 !important;
    gap:9px !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-icon{
    width:38px !important;
    min-width:38px !important;
    height:38px !important;
    flex-basis:38px !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-title{
    font-size:15px !important;
    line-height:1.55 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .sidebar{
    width:100% !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:10px !important;
    border-radius:8px !important;
  }

  /* البطاقة البصرية أسفل القائمة الجانبية في التابلت العريض. */
  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-visual{
    display:flex !important;
    width:100% !important;
    min-width:0 !important;
    min-height:310px !important;
    margin:30px 0 0 !important;
    padding:16px 14px !important;
    flex:0 0 auto !important;
    border-radius:8px !important;
    box-sizing:border-box !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-visual .member-visual-art{
    width:100% !important;
    min-height:190px !important;
    margin:0 auto 10px !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-visual .member-visual-screen{
    inset:24px 10px auto 10px !important;
    min-height:122px !important;
    padding:13px !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-visual .member-visual-card{
    width:48px !important;
    height:48px !important;
    border-radius:9px !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-visual .member-visual-title{
    font-size:14px !important;
    line-height:1.7 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-sidebar-visual .member-visual-text{
    font-size:12px !important;
    line-height:1.8 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .member-trial-card{
    width:100% !important;
    flex:0 0 auto !important;
    margin:0 !important;
    border-radius:8px !important;
  }

  /* جميع التبويبات تشارك نفس عمود المحتوى بجانب القائمة. */
  html body .dashboard-wrapper.member-dashboard-wrapper
  > .content-area{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  > .content-area > #tabContent,
  html body .dashboard-wrapper.member-dashboard-wrapper
  > .content-area .member-tab-panel{
    width:100% !important;
    min-width:0 !important;
  }
}

/* =========================================================
   Member Dashboard — Laptop 1440 polish
   2026-09-29
   النطاق: 1101px–1600px
   ========================================================= */
@media (min-width:1101px) and (max-width:1600px){

  /* =======================================================
     إعلاناتي — إبعاد "تحديد الكل" والحذف عن طرف الحاوية
     ======================================================= */
  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar
  .member-records-toolbar-inner{
    padding-inline:12px !important;
  }

  /* =======================================================
     متاجري — شارات أصغر مثل التابلت
     ======================================================= */
  html body #tabContent .member-stores-page .member-store-pill{
    min-height:22px !important;
    padding:2px 6px !important;
    gap:4px !important;
    border-radius:5px !important;
    font-size:11.5px !important;
    line-height:1.35 !important;
  }

  html body #tabContent .member-stores-page .member-store-pill i{
    font-size:10.5px !important;
  }

  /* المتجر العادي لا يعرض حالة التمييز؛ المميز فقط يحتفظ بها. */
  html body #tabContent .member-stores-page
  .member-store-card:not(.is-featured) .member-store-feature-state{
    display:none !important;
  }

  /* =======================================================
     متاجري — قائمة الثلاث نقاط بدل أزرار الإجراءات
     ======================================================= */
  html body #tabContent .member-stores-page .member-store-actions{
    display:none !important;
  }

  html body #tabContent .member-stores-page .member-store-card{
    overflow:visible !important;
  }

  html body #tabContent .member-stores-page .member-store-card-footer{
    position:relative !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    overflow:visible !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu{
    position:relative !important;
    display:block !important;
    flex:0 0 auto !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-toggle{
    width:32px !important;
    min-width:32px !important;
    height:32px !important;
    display:grid !important;
    place-items:center !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#d1d5db)) !important;
    border-radius:7px !important;
    background:#fff !important;
    color:#4b5563 !important;
    cursor:pointer !important;
    list-style:none !important;
  }

  html body #tabContent .member-stores-page
  .member-store-action-menu-toggle::-webkit-details-marker{
    display:none !important;
  }

  html body #tabContent .member-stores-page
  .member-store-action-menu-toggle::marker{
    content:"" !important;
  }

  html body #tabContent .member-stores-page
  .member-store-action-menu-toggle:hover{
    border-color:var(--member-brand-line) !important;
    background:var(--member-brand-soft) !important;
    color:var(--member-brand-dark) !important;
  }

  html body #tabContent .member-stores-page .member-store-action-dropdown{
    position:absolute !important;
    inset-inline-end:0 !important;
    bottom:calc(100% + 7px) !important;
    z-index:60 !important;
    min-width:190px !important;
    padding:5px !important;
  }

  html body #tabContent .member-stores-page
  .member-store-action-menu:not([open]) > .member-store-action-dropdown{
    display:none !important;
  }

  html body #tabContent .member-stores-page
  .member-store-action-menu[open] > .member-store-action-dropdown{
    display:grid !important;
    gap:2px !important;
  }

  html body #tabContent .member-stores-page .member-store-action-item{
    width:100% !important;
    min-height:36px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    padding:7px 9px !important;
    border:0 !important;
    border-radius:6px !important;
    background:transparent !important;
    color:#374151 !important;
    text-decoration:none !important;
    text-align:right !important;
    white-space:nowrap !important;
    cursor:pointer !important;
  }

  html body #tabContent .member-stores-page .member-store-action-item:hover{
    background:var(--member-brand-soft) !important;
    color:var(--member-brand-dark) !important;
  }

  html body #tabContent .member-stores-page
  .member-store-action-item.is-disabled,
  html body #tabContent .member-stores-page
  .member-store-action-item:disabled{
    opacity:.5 !important;
    cursor:not-allowed !important;
  }

  html body #tabContent .member-stores-page .member-store-action-menu-form{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
  }
}

/* =========================================================
   Member Ads — Laptop bulk actions column alignment
   2026-09-29
   النطاق: 1101px–1600px
   يطابق شريط التحديد الجماعي مع أعمدة الجدول نفسها.
   ========================================================= */
@media (min-width:1101px) and (max-width:1600px){

  /* نفس padding صفوف الجدول بالضبط. */
  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar
  .member-records-toolbar-inner{
    padding-inline:12px !important;
  }

  /* نفس شبكة رأس/صفوف الإعلانات: أول عمود للتحديد وآخر عمود للإجراءات. */
  html body #tabContent .member-records-page
  .member-records-select-actions{
    display:grid !important;
    grid-template-columns:
      58px
      105px
      100px
      110px
      minmax(150px,1.2fr)
      110px
      minmax(110px,1fr)
      130px
      86px !important;
    column-gap:8px !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
  }

  /*
   * "تحديد الكل":
   * checkbox في مركز العمود الأول نفسه الذي يحتوي checkboxes الصفوف،
   * والنص يستفيد من العمود الثاني بدون تحريك checkbox عن محوره.
   */
  html body #tabContent .member-records-page
  .member-records-selection-side{
    grid-column:1 / span 4 !important;
    display:grid !important;
    grid-template-columns:58px 105px 100px 110px !important;
    column-gap:8px !important;
    align-items:center !important;
    width:auto !important;
    min-width:0 !important;
    justify-self:stretch !important;
  }

  html body #tabContent .member-records-page
  .member-records-check-all{
    grid-column:1 / span 2 !important;
    display:grid !important;
    grid-template-columns:58px 105px !important;
    column-gap:8px !important;
    align-items:center !important;
    justify-content:stretch !important;
    width:171px !important;
    min-width:171px !important;
    min-height:36px !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #tabContent .member-records-page
  .member-records-check-all-input{
    grid-column:1 !important;
    justify-self:center !important;
    align-self:center !important;
    margin:0 !important;
  }

  /* عداد العناصر المحددة يبدأ بعد عمودي التحديد/الإعلان. */
  html body #tabContent .member-records-page
  .member-records-selected-count{
    grid-column:3 / span 2 !important;
    justify-self:start !important;
    align-self:center !important;
    margin:0 !important;
  }

  /* الحذف في مركز عمود الإجراءات نفسه الذي يحتوي أزرار الثلاث نقاط. */
  html body #tabContent .member-records-page
  .member-records-bulk-delete-btn{
    grid-column:9 !important;
    justify-self:center !important;
    align-self:center !important;
    margin:0 !important;
  }
}

/* =========================================================
   Member Ads — Laptop bulk toolbar outside list container
   2026-09-29
   النطاق: 1101px–1600px
   ========================================================= */
@media (min-width:1101px) and (max-width:1600px){

  html body #tabContent .member-records-page
  .member-records-list{
    position:relative !important;
    margin-top:52px !important;
    overflow:visible !important;
  }

  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar{
    position:absolute !important;
    top:-52px !important;
    inset-inline:0 !important;
    width:100% !important;
    height:42px !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    z-index:2 !important;
  }

  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar
  .member-records-toolbar-inner{
    width:100% !important;
    height:42px !important;
    margin:0 !important;
    padding-inline:12px !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
}

/* =========================================================
   Member Ads — Laptop bulk toolbar bordered card
   2026-09-29
   النطاق: 1101px–1600px
   ========================================================= */
@media (min-width:1101px) and (max-width:1600px){

  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar{
    height:auto !important;
    min-height:44px !important;
    padding:0 !important;
    background:#fff !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    box-shadow:none !important;
    box-sizing:border-box !important;
  }

  html body #tabContent .member-records-page
  .member-records-list > .member-records-toolbar
  .member-records-toolbar-inner{
    min-height:42px !important;
    border-radius:inherit !important;
    background:transparent !important;
  }
}

/* =========================================================
   Member Dashboard — Central primary action color
   2026-09-29
   المصدر المركزي لألوان أزرار الإجراءات الأساسية.
   ========================================================= */
html body .member-dashboard-wrapper,
html body #tabContent{
  --member-action-primary:
    var(--sadaa-admin-primary, var(--sadaa-primary));
  --member-action-primary-hover:
    var(--sadaa-admin-hover, var(--sadaa-primary-dark));
}

/* أزرار "تطبيق" والإجراءات الأساسية داخل لوحة العضو */
html body #tabContent .member-records-page .member-records-filter-submit,
html body #tabContent .member-invoices-page .invoices-toolbar-btn,
html body .member-dashboard-wrapper .sadaa-btn--primary{
  background:var(--member-action-primary) !important;
  border-color:var(--member-action-primary) !important;
  color:#fff !important;
}

/* Hover / Focus */
html body #tabContent .member-records-page .member-records-filter-submit:hover,
html body #tabContent .member-records-page .member-records-filter-submit:focus-visible,
html body #tabContent .member-invoices-page .invoices-toolbar-btn:hover,
html body #tabContent .member-invoices-page .invoices-toolbar-btn:focus-visible,
html body .member-dashboard-wrapper .sadaa-btn--primary:hover,
html body .member-dashboard-wrapper .sadaa-btn--primary:focus-visible{
  background:var(--member-action-primary-hover) !important;
  border-color:var(--member-action-primary-hover) !important;
  color:#fff !important;
}

/* =========================================================
   Admin Dashboard — Wide Tablet Sidebar Layout
   2026-09-29
   النطاق: 901px–1100px (يشمل 1024px)

   - إلغاء زر "القائمة الرئيسية".
   - إظهار القائمة الرئيسية كعمود جانبي دائم.
   - الحفاظ على Drawer للجوال و768px كما هو.
   ========================================================= */
@media (min-width:901px) and (max-width:1100px){

  :root{
    --admin-wide-tablet-sidebar-width:265px;
    --admin-wide-tablet-layout-gap:12px;
  }

  html body.dashboard-drawer-open{
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }

  html body .dashboard-wrapper{
    display:flex !important;
    flex-direction:row !important;
    align-items:flex-start !important;
    gap:var(--admin-wide-tablet-layout-gap) !important;
    width:min(1430px, calc(100% - 20px)) !important;
    max-width:1430px !important;
    margin:14px auto 28px !important;
    padding:0 !important;
    direction:rtl !important;
  }

  /* شريط "القائمة الرئيسية" غير مطلوب في التابلت العريض. */
  html body .dashboard-wrapper
  > .dashboard-mobile-tabs-toggle{
    display:none !important;
    width:0 !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }

  /* تحويل Drawer إلى عمود جانبي ثابت. */
  html body .dashboard-wrapper
  > .sidebar{
    position:sticky !important;
    top:14px !important;
    right:auto !important;
    left:auto !important;
    z-index:20 !important;

    display:block !important;
    flex:0 0 var(--admin-wide-tablet-sidebar-width) !important;
    width:var(--admin-wide-tablet-sidebar-width) !important;
    max-width:var(--admin-wide-tablet-sidebar-width) !important;

    height:auto !important;
    max-height:calc(100dvh - 28px) !important;
    margin:0 !important;
    padding:0 10px 12px !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;

    background:#fff !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    box-shadow:0 12px 30px rgba(var(--sadaa-admin-dark-rgb),.055) !important;

    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:none !important;
    overscroll-behavior:contain !important;
  }

  html body .dashboard-wrapper.mobile-tabs-open
  > .sidebar{
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }

  /* لا Backdrop ولا زر إغلاق في القائمة الدائمة. */
  html body .dashboard-wrapper
  > .dashboard-sidebar-backdrop,
  html body .dashboard-wrapper
  .dashboard-sidebar-close{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }

  /* رأس القائمة يعود من هيئة Drawer إلى بطاقة جانبية طبيعية. */
  html body .dashboard-wrapper
  .dashboard-sidebar-head{
    position:relative !important;
    top:auto !important;
    z-index:1 !important;
    min-height:112px !important;
    margin:0 -10px 12px !important;
    padding:17px 14px 15px !important;
    border-radius:7px 7px 0 0 !important;
  }

  html body .dashboard-wrapper
  .dashboard-sidebar-title-row{
    gap:9px !important;
  }

  html body .dashboard-wrapper
  .dashboard-sidebar-title-icon{
    width:38px !important;
    min-width:38px !important;
    height:38px !important;
  }

  html body .dashboard-wrapper
  .dashboard-sidebar-title{
    font-size:16px !important;
  }

  html body .dashboard-wrapper
  .dashboard-sidebar-subtitle{
    font-size:11.5px !important;
    line-height:1.6 !important;
  }

  html body .dashboard-wrapper
  .dashboard-sidebar-user{
    max-width:100% !important;
    font-size:11.5px !important;
  }

  html body .dashboard-wrapper
  .dashboard-sidebar-nav{
    padding-bottom:8px !important;
  }

  /* جميع التبويبات تستخدم نفس عمود المحتوى بجانب القائمة. */
  html body .dashboard-wrapper
  > .content-area{
    flex:1 1 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .dashboard-wrapper
  > .content-area > #tabContent{
    width:100% !important;
    min-width:0 !important;
  }

  /* روابط التنقل العلوية غير لازمة مع وجود القائمة الجانبية. */
  html body .dashboard-page-nav{
    display:none !important;
  }
}

/* =========================================================
   Admin Dashboard — Interaction Stability / Flash Guard
   2026-09-29
   النطاق: جميع المقاسات
   يمنع وميض النقر/اللمس مع الحفاظ على focus-visible.
   ========================================================= */

/* 1) إلغاء Tap Highlight على جميع العناصر التفاعلية داخل لوحة المدير. */
html body .dashboard-wrapper a,
html body .dashboard-wrapper button,
html body .dashboard-wrapper summary,
html body .dashboard-wrapper label[for],
html body .dashboard-wrapper input,
html body .dashboard-wrapper select,
html body .dashboard-wrapper textarea,
html body .dashboard-wrapper [role="button"],
html body .dashboard-wrapper [tabindex],
html body .dashboard-wrapper .sadaa-menu-trigger,
html body .dashboard-wrapper .sadaa-pagination__item,
html body .dashboard-wrapper .sadaa-accordion__summary,
html body .dashboard-wrapper .sadaa-tablet-disclosure__summary,
html body .dashboard-wrapper .sadaa-checkbox,
html body .dashboard-wrapper .sadaa-radio,
html body .dashboard-wrapper .sadaa-switch,
html body .dashboard-wrapper .sadaa-date-control__input{
  -webkit-tap-highlight-color:transparent !important;
}

/* 2) العناصر القابلة للنقر تستجيب مباشرة بدون تأخير لمس. */
html body .dashboard-wrapper a,
html body .dashboard-wrapper button,
html body .dashboard-wrapper summary,
html body .dashboard-wrapper label[for],
html body .dashboard-wrapper [role="button"],
html body .dashboard-wrapper .sadaa-menu-trigger,
html body .dashboard-wrapper .sadaa-pagination__item,
html body .dashboard-wrapper .sadaa-accordion__summary,
html body .dashboard-wrapper .sadaa-tablet-disclosure__summary{
  touch-action:manipulation;
}

/* 3) النقر بالماوس/اللمس لا يولد Focus مؤقتاً بصرياً. */
html body .dashboard-wrapper a:focus:not(:focus-visible),
html body .dashboard-wrapper button:focus:not(:focus-visible),
html body .dashboard-wrapper summary:focus:not(:focus-visible),
html body .dashboard-wrapper [role="button"]:focus:not(:focus-visible),
html body .dashboard-wrapper [tabindex]:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* 4) الحقول والقوائم المنسدلة المحلية داخل المدير. */
html body .dashboard-wrapper input:focus:not(:focus-visible),
html body .dashboard-wrapper select:focus:not(:focus-visible),
html body .dashboard-wrapper textarea:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* 5) Checkbox / Radio داخل المدير. */
html body .dashboard-wrapper input[type="checkbox"]:focus:not(:focus-visible),
html body .dashboard-wrapper input[type="radio"]:focus:not(:focus-visible),
html body .dashboard-wrapper .sadaa-checkbox:focus:not(:focus-visible),
html body .dashboard-wrapper .sadaa-radio:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* 6) Switch. */
html body .dashboard-wrapper
.sadaa-switch__input:focus:not(:focus-visible) + .sadaa-switch__track,
html body .dashboard-wrapper
.sadaa-switch--button:focus:not(:focus-visible) > .sadaa-switch__track{
  outline:none !important;
  box-shadow:none !important;
  transition:none !important;
}

/* 7) Select shell: لا يتغير لون السهم لحظياً عند النقر. */
html body .dashboard-wrapper
.sadaa-select-shell:has(.sadaa-select:focus:not(:focus-visible))::after{
  border-right-color:var(--sadaa-admin-muted,var(--sadaa-muted,#6b7280)) !important;
  border-bottom-color:var(--sadaa-admin-muted,var(--sadaa-muted,#6b7280)) !important;
  transition:none !important;
}

/* 8) حقول التاريخ داخل لوحة المدير. */
html body .dashboard-wrapper
.sadaa-date-control__input:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
  border-color:var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
  transition:none !important;
}

html body .dashboard-wrapper
.sadaa-date-control:has(.sadaa-date-control__input:focus:not(:focus-visible))
.sadaa-date-control__icon{
  color:var(--sadaa-admin-muted,var(--sadaa-muted,#6b7280)) !important;
  transition:none !important;
}

/* 9) أثناء Pointer Focus نوقف Transition المؤقت فقط. */
html body .dashboard-wrapper
:is(a,button,summary,input,select,textarea,[role="button"],[tabindex]):focus:not(:focus-visible){
  transition:none !important;
}

/* =========================================================
   Admin Dashboard — Wide Tablet Sidebar Normal Flow
   2026-09-29
   النطاق: 901px–1100px

   العمود جزء طبيعي من الصفحة مثل محتوى التبويب:
   لا Fixed ولا Sticky، ولا يتبع الشاشة أثناء التمرير.
   ========================================================= */
@media (min-width:901px) and (max-width:1100px){

  html body .dashboard-wrapper::before{
    content:none !important;
    display:none !important;
  }

  html body .dashboard-wrapper
  > .sidebar{
    position:static !important;
    top:auto !important;
    right:auto !important;
    left:auto !important;

    flex:0 0 var(--admin-wide-tablet-sidebar-width,265px) !important;
    width:var(--admin-wide-tablet-sidebar-width,265px) !important;
    max-width:var(--admin-wide-tablet-sidebar-width,265px) !important;

    height:auto !important;
    max-height:none !important;

    margin:0 !important;
    overflow:visible !important;

    z-index:auto !important;
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:none !important;
  }

  html body .dashboard-wrapper
  > .content-area{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
  }
}

/* =========================================================
   Admin Orders — 1024px full content alignment
   2026-09-30
   النطاق: 901px–1100px

   توحيد الحواف الجانبية لـ:
   - البحث
   - الفلاتر
   - حاوية البطاقات
   ========================================================= */
@media (min-width:901px) and (max-width:1100px){

  /* إزالة الحشوة الخارجية التي كانت تضيق كل أقسام الطلبات. */
  html body #tabContent .orders-tab-ui .orders-panel{
    width:100% !important;
    max-width:none !important;
    margin-inline:0 !important;
    padding-inline:0 !important;
    box-sizing:border-box !important;
  }

  /* البحث والفلاتر يصلان لنفس حدود عمود المحتوى. */
  html body #tabContent .orders-tab-ui .orders-search-card,
  html body #tabContent .orders-tab-ui .orders-controls-card{
    width:100% !important;
    max-width:none !important;
    margin-inline:0 !important;
    box-sizing:border-box !important;
  }

  /* حاوية قائمة الطلبات بنفس العرض تماماً. */
  html body #tabContent .orders-tab-ui .orders-list-card{
    width:100% !important;
    max-width:none !important;
    margin-inline:0 !important;
    padding-inline:0 !important;
    box-sizing:border-box !important;
  }

  /* إزالة الـ inset الإضافي داخل شبكة البطاقات فقط. */
  html body #tabContent .orders-tab-ui .orders-grid{
    width:100% !important;
    max-width:none !important;
    margin-inline:0 !important;
    padding-inline:0 !important;
    box-sizing:border-box !important;
  }
}

/* =========================================================
   Admin Design System — Unified Tab Hero
   2026-09-30

   المصدر المركزي الوحيد لهيرو تبويبات لوحة المدير:
   المسافات، المقاسات، الألوان، الأيقونة، العنوان والوصف.
   ========================================================= */

/* جميع الشاشات */
html body #tabContent .sadaa-page-header--admin{
  position:relative !important;
  width:100% !important;
  min-width:0 !important;
  min-height:82px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;

  margin:0 0 14px !important;
  padding:18px 20px !important;

  overflow:hidden !important;
  box-sizing:border-box !important;

  border:0 !important;
  border-radius:8px !important;
  background:var(--sadaa-admin-hero-gradient) !important;
  color:#fff !important;
  box-shadow:none !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__inner{
  width:100% !important;
  min-width:0 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__main{
  min-width:0 !important;
  flex:1 1 auto !important;

  display:flex !important;
  align-items:center !important;
  gap:12px !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__icon{
  flex:0 0 42px !important;
  width:42px !important;
  min-width:42px !important;
  height:42px !important;
  min-height:42px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  border:1px solid rgba(255,255,255,.24) !important;
  border-radius:8px !important;
  background:rgba(255,255,255,.14) !important;
  color:#fff !important;
  box-shadow:none !important;

  font-size:17px !important;
  line-height:1 !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__content{
  min-width:0 !important;
  flex:1 1 auto !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__eyebrow{
  display:none !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__title{
  margin:0 !important;
  color:#fff !important;
  font-size:18px !important;
  font-weight:600 !important;
  line-height:1.45 !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__description{
  margin:3px 0 0 !important;
  color:rgba(255,255,255,.94) !important;
  font-size:12.5px !important;
  font-weight:400 !important;
  line-height:1.65 !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__actions{
  min-width:0 !important;
  flex:0 0 auto !important;

  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
}

html body #tabContent .sadaa-page-header--admin
.sadaa-page-header__meta{
  min-height:34px !important;
  padding:6px 10px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;

  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:7px !important;
  background:rgba(255,255,255,.12) !important;
  color:#fff !important;
}

/* التابلت العريض — 1024px */
@media (min-width:901px) and (max-width:1100px){

  html body #tabContent .sadaa-page-header--admin{
    min-height:82px !important;
    margin-bottom:14px !important;
    padding:16px 18px !important;
    gap:12px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__inner{
    gap:12px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__main{
    gap:10px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__icon{
    flex-basis:38px !important;
    width:38px !important;
    min-width:38px !important;
    height:38px !important;
    min-height:38px !important;
    font-size:15px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__title{
    font-size:17px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__description{
    font-size:12px !important;
  }

  /* في التابلت تبقى الـ Actions مضغوطة أو مخفية حسب النظام الموحد. */
  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__actions{
    gap:7px !important;
  }
}

/* التابلت 768 والجوال */
@media (max-width:900px){

  html body #tabContent .sadaa-page-header--admin{
    min-height:74px !important;
    margin-bottom:14px !important;
    padding:14px !important;
    gap:10px !important;
    border-radius:8px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__inner{
    align-items:center !important;
    gap:10px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__main{
    gap:9px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__icon{
    flex-basis:34px !important;
    width:34px !important;
    min-width:34px !important;
    height:34px !important;
    min-height:34px !important;
    border-radius:7px !important;
    font-size:14px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__title{
    font-size:17px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__description{
    margin-top:2px !important;
    font-size:12px !important;
    line-height:1.6 !important;
  }
}

@media (max-width:480px){

  html body #tabContent .sadaa-page-header--admin{
    min-height:70px !important;
    padding:12px !important;
    margin-bottom:14px !important;
    border-radius:7px !important;
  }

  html body #tabContent .sadaa-page-header--admin
  .sadaa-page-header__description{
    font-size:11.5px !important;
  }
}

/* =========================================================
   Admin Design System — Workspace spacing
   2026-09-30

   الهيرو يحتفظ بمسافته الخارجية = 14px.
   مساحة العمل تحتفظ بالحماية الرأسية فقط حتى يبقى عرضها
   مطابقاً لعرض الهيرو. الحماية الجانبية لبطاقات السجلات
   تُدار داخل حاوية السجلات نفسها دون تصغير عرضها الخارجي.
   ========================================================= */
:root{
  --sadaa-admin-workspace-gutter:12px;
}

html body .dashboard-wrapper:not(.member-dashboard-wrapper)
#tabContent .sadaa-card--workspace{
  width:100% !important;
  max-width:none !important;
  margin-inline:0 !important;
  padding:
    var(--sadaa-admin-workspace-gutter)
    0
    var(--sadaa-admin-workspace-gutter)
    !important;
  box-sizing:border-box !important;
}

/* التباعد الخارجي المركزي بين الهيرو وما يليه. */
html body .dashboard-wrapper:not(.member-dashboard-wrapper)
#tabContent .sadaa-page-header--admin{
  margin-bottom:14px !important;
}

/* =========================================================
   Admin Dashboard — Initial Load Paint Guard
   2026-09-30

   عند F5 ننتظر window.onload كالمعتاد، ثم نجلب العمود ومحتوى التبويب معاً.
   تبقى الواجهة مخفية أثناء الجلب الأول وتظهر كوحدة واحدة بعد اكتمالهما.
   ========================================================= */
html body .dashboard-wrapper.dashboard-initializing{
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

html body .dashboard-wrapper.dashboard-initial-ready{
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

/* بدون Animation حتى لا يتحول علاج الوميض إلى Fade جديد. */
html body .dashboard-wrapper.dashboard-initializing,
html body .dashboard-wrapper.dashboard-initial-ready{
  transition:none !important;
}

/* =========================================================
   Admin Design System — Unified Card Content Typography
   2026-09-30

   المقاس المركزي لمحتوى بطاقات لوحة المدير:
   الجوال + التابلت + اللابتوب = 13px

   لا يشمل:
   - عناوين البطاقات
   - الشارات والحالات
   - الأزرار
   - الأيقونات
   ========================================================= */
:root{
  --sadaa-admin-card-content-font-size:13px;
}

@media (max-width:1600px){

  /* البطاقات والسجلات المركزية في لوحة المدير */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .sadaa-admin-record-card,

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .sadaa-tablet-records-shell .sadaa-admin-record-card,

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .sadaa-admin-card,

  /* محتوى خلايا البطاقات بعد تحويل الجداول إلى Cards */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .sadaa-admin-record-card
  :is(
    .orders-grid-cell,
    .users-grid-cell,
    .reports-grid-cell,
    .moderator-cell,
    .mc-cell,
    .report-cell,
    .directory-cell,
    .newsletter-cell,
    .finance-cell
  ),

  /* عناصر النص/القيم العامة داخل البطاقات */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .sadaa-admin-record-card
  :is(
    .card-value,
    .record-value,
    .record-text,
    .item-value,
    .item-text,
    .meta-value,
    .meta-text
  ){
    font-size:var(--sadaa-admin-card-content-font-size) !important;
  }

  /*
   * بعض التبويبات تستخدم بطاقات محلية بدون class مركزي كامل.
   * نوحد محتوى الصفوف/الخلايا فيها أيضاً.
   */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  :is(
    .orders-grid-row,
    .users-card,
    .moderator-card,
    .reports-card,
    .mc-row,
    .finance-order-row,
    .directory-store-card,
    .newsletter-card
  ){
    font-size:var(--sadaa-admin-card-content-font-size) !important;
  }

  /* لا نسمح للقاعدة العامة بتغيير الهرم البصري للعناوين والشارات والأزرار. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  :is(
    .sadaa-admin-record-card,
    .orders-grid-row,
    .users-card,
    .moderator-card,
    .reports-card,
    .mc-row,
    .finance-order-row,
    .directory-store-card,
    .newsletter-card
  )
  :is(
    h1,h2,h3,h4,h5,h6,
    .sadaa-status,
    .badge,
    [class*="badge"],
    [class*="status"],
    button,
    .sadaa-btn,
    .sadaa-menu-trigger,
    .sadaa-pagination__item
  ){
    font-size:revert;
  }
}

/* =========================================================
   Admin Design System — Tablet record shell side gutter
   2026-09-30
   النطاق: 901px–1100px

   الحاوية الخارجية تبقى 100% مثل الهيرو.
   الفراغ الجانبي يُطبّق داخل سطح السجلات فقط دون تصغير
   حدود منطقة البحث أو الفلاتر أو الحاوية نفسها.
   ========================================================= */
@media (min-width:901px) and (max-width:1100px){

  /* جميع المناطق الرئيسية تبقى بنفس حدود الهيرو. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  :is(
    .sadaa-admin-tools-card,
    .orders-search-card,
    .orders-controls-card,
    .orders-list-card,
    .sadaa-tablet-records-shell
  ){
    width:100% !important;
    max-width:none !important;
    margin-inline:0 !important;
    box-sizing:border-box !important;
  }

  /*
   * حاوية السجلات نفسها لا تُصغّر؛ الفراغ يكون داخلياً
   * فقط حيث يوجد سطح حقيقي يحتضن بطاقات السجلات.
   */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  :is(
    .sadaa-tablet-records-shell,
    .orders-list-card
  ){
    padding-inline:var(--sadaa-admin-workspace-gutter,12px) !important;
  }

  /* الـ stack يملأ المساحة الداخلية المتاحة بدون inset إضافي. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  :is(
    .sadaa-tablet-records-stack,
    .orders-grid
  ){
    width:100% !important;
    max-width:none !important;
    margin-inline:0 !important;
    box-sizing:border-box !important;
  }

  /* الطلبات: البحث والفلاتر لا يأخذان أي تضييق أفقي إضافي. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  :is(
    .orders-search-card,
    .orders-controls-card
  ){
    padding-inline:0 !important;
  }
}

/* =========================================================
   Admin Design System — Desktop / Laptop Structural Repairs
   2026-09-30
   النطاق: 1101px فأعلى

   إصلاحات موحّدة للبنية المرئية في:
   الطلبات، المستخدمين، المشرفين، الكوبونات، العروض،
   الرسائل البريدية، وتقرير الطلبات.
   ========================================================= */
:root{
  --sadaa-admin-desktop-shell-gutter:12px;
}

@media (min-width:1101px){

  /* -------------------------------------------------------
     الطلبات
     - البحث والفلاتر خارج حاوية الجدول.
     - الجدول داخل حاوية مستقلة مع فراغ آمن من الجانبين.
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  > .orders-panel.sadaa-card--workspace.sadaa-admin-list-shell{
    display:contents !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  :is(.orders-search-card,.orders-controls-card){
    width:100% !important;
    max-width:none !important;
    margin-inline:0 !important;
    box-sizing:border-box !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui .orders-list-card{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:var(--sadaa-admin-desktop-shell-gutter) !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui .orders-list-card > .orders-grid{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    overflow:hidden !important;
  }

  /* -------------------------------------------------------
     المستخدمون
     - حاوية حقيقية خلف الجدول.
     - الجدول كسطح أبيض مستقل داخلها.
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-list-wrap.sadaa-tablet-records-shell{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:var(--sadaa-admin-desktop-shell-gutter) !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-list-wrap > .users-list{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    overflow:hidden !important;
  }

  /* -------------------------------------------------------
     المشرفون
     - إزالة الحاوية العامة التي تجمع البحث مع السجلات.
     - البحث يبقى بطاقة مستقلة، والسجلات تبقى ببنيتها الحالية.
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab
  > .moderators-panel.sadaa-admin-list-shell{
    display:contents !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderators-search-sort-section{
    width:100% !important;
    max-width:none !important;
    margin:0 0 12px !important;
    box-sizing:border-box !important;
  }

  /* -------------------------------------------------------
     الكوبونات
     - إظهار الحاوية الخلفية للجدول بوضوح.
     - السطح الداخلي مستقل ولا يلامس الحاوية.
     - توحيد ألوان كل شارات الحالات بلغة هوية واحدة.
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .coupons-tab-ui .mc-list-wrap.sadaa-tablet-records-shell{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:var(--sadaa-admin-desktop-shell-gutter) !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .coupons-tab-ui .mc-list-wrap > .mc-list{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    overflow:hidden !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .coupons-tab-ui
  :is(
    .coupon-status,
    .coupon-status.is-active,
    .coupon-status.is-disabled,
    .coupon-status.is-pending,
    .coupon-status.is-expired,
    .coupon-status.is-used-up,
    .coupon-status-chip,
    .coupon-status-chip.is-active,
    .coupon-status-chip.is-disabled,
    .coupon-status-chip.is-pending,
    .coupon-status-chip.is-expired,
    .coupon-status-chip.is-used-up
  ){
    background:var(--sadaa-admin-soft,#f7f4f9) !important;
    color:var(--sadaa-admin-dark) !important;
    border-color:var(--sadaa-admin-soft-line,#dfd4e5) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .coupons-tab-ui .coupon-status-chip i{
    color:var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
  }

  /* -------------------------------------------------------
     العروض الحالية
     - فراغ داخلي بين بطاقة/جدول العرض والحاوية المحيطة.
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .offers-tab-ui .offers-current-card-body.sadaa-accordion__body--flush{
    padding:var(--sadaa-admin-desktop-shell-gutter) !important;
    box-sizing:border-box !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .offers-tab-ui .offers-current-card-body .offers-table-wrap{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    overflow:hidden !important;
  }

  /* -------------------------------------------------------
     الرسائل البريدية
     - إعادة بناء منطقة البحث/الفلاتر كسطح نظيف متماسك.
     - جدول الرسائل داخل حاوية واضحة.
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin .newsletter-tools.sadaa-admin-tools-card{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 0 10px !important;
    padding:var(--sadaa-admin-desktop-shell-gutter) !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin .newsletter-tools
  > .newsletter-tablet-disclosure-summary{
    display:none !important;
    pointer-events:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin .newsletter-tablet-disclosure-body{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin .newsletter-filters{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,auto)) !important;
    justify-content:start !important;
    gap:7px !important;
    width:100% !important;
    margin:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin .newsletter-search{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:8px !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin .newsletter-search-field{
    width:100% !important;
    min-width:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin .newsletter-table-wrap.sadaa-tablet-records-shell{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:var(--sadaa-admin-desktop-shell-gutter) !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin .newsletter-table{
    width:100% !important;
    margin:0 !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    border-collapse:separate !important;
    border-spacing:0 !important;
    background:var(--sadaa-surface,#fff) !important;
    overflow:hidden !important;
  }

  /* -------------------------------------------------------
     تقرير الطلبات — الفلاتر
     - استعادة توزيع Desktop الطبيعي بعيداً عن تخطيط التابلت.
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-filter-card{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 0 14px !important;
    padding:0 !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-filter-card > .finance-card-head{
    display:flex !important;
    width:100% !important;
    min-height:44px !important;
    margin:0 !important;
    padding:9px 12px !important;
    box-sizing:border-box !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:0 !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-filter-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:var(--sadaa-admin-desktop-shell-gutter) !important;
    box-sizing:border-box !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-tablet-disclosure{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-tablet-disclosure
  > .finance-tablet-disclosure-summary{
    display:none !important;
    pointer-events:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-search-row{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:end !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-search-row .finance-field.search-field{
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-search-row .finance-filter-actions{
    grid-column:auto !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(88px,auto)) !important;
    align-self:end !important;
    gap:7px !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-date-filter-row{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    align-items:end !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-date-filter-row > .finance-field{
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  :is(.finance-date-wrapper,.finance-select-shell,.finance-date-input,.finance-select-shell select){
    width:100% !important;
    min-width:0 !important;
  }

  /* الترقيم أصبح خارج الجدول وخارج حاوية الجدول في الـ HTML. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab > .finance-pagination{
    width:100% !important;
    margin:10px 0 14px !important;
    padding:0 !important;
    border:0 !important;
    justify-content:center !important;
    box-sizing:border-box !important;
  }
}

/* بعد نقل Pagination تقرير الطلبات خارج الحاوية:
   نحافظ على تنسيقه المركزي أيضاً في التابلت والجوال. */
@media (max-width:1100px){
  html body #tabContent .finance-tab > .finance-pagination{
    width:100% !important;
    margin:8px 0 10px !important;
    padding:0 !important;
    border:0 !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap:5px !important;
  }
}

/* =========================================================
   Admin Users — Desktop / Laptop table structure repair
   2026-09-30
   النطاق: 1101px فأعلى

   أول ثلاث خلايا في صف المستخدم موجودة داخل
   .users-card-head-main لأغراض التابلت/الجوال.
   على سطح المكتب يجب أن يصبح هذا الغلاف display:contents
   حتى تعود الخلايا العشر عناصر Grid مباشرة مثل رأس الجدول.
   ========================================================= */
@media (min-width:1101px){

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-list-wrap.sadaa-tablet-records-shell{
    display:block !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-list{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* المفتاح الحقيقي لإصلاح انهيار الأعمدة. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-card-head-main{
    display:contents !important;
  }

  /* نفس شبكة الأعمدة للرأس ولكل صف. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft
  :is(.users-header,.users-row){
    display:grid !important;
    grid-template-columns:
      44px
      34px
      minmax(145px,1fr)
      minmax(220px,1.42fr)
      minmax(118px,.82fr)
      88px
      minmax(132px,.92fr)
      92px
      112px
      54px
      !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-header{
    min-height:46px !important;
    padding:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-row{
    min-height:60px !important;
    padding:0 !important;
    border-top:0 !important;
    border-right:0 !important;
    border-left:0 !important;
    border-radius:0 !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-row:last-child{
    border-bottom:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-cell{
    min-width:0 !important;
    padding:10px 10px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    border-bottom:0 !important;
    box-sizing:border-box !important;
  }

  /* تسميات البطاقات لا تظهر إطلاقاً في وضع الجدول. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-cell::before{
    display:none !important;
    content:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft
  :is(.users-select-cell,.users-note-cell,.users-actions-cell,.users-actions-head){
    overflow:visible !important;
    text-overflow:clip !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft
  :is(.users-role-cell,.users-verification-cell,.users-status-cell,.users-date-cell){
    display:block !important;
    text-align:center !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-email-cell{
    text-align:center !important;
  }
}

/* =========================================================
   Admin Reports — Desktop / Laptop real table shell
   2026-09-30
   النطاق: 1101px فأعلى

   Wrapper فعلي مستقل خلف جدول البلاغات.
   pagination يبقى خارج الحاوية مثل بقية التبويبات.
   ========================================================= */

/* على التابلت والجوال لا نغيّر البنية البصرية الحالية. */
html body .dashboard-wrapper:not(.member-dashboard-wrapper)
#tabContent .reports-tab-ui .reports-table-shell{
  display:contents;
}

@media (min-width:1101px){

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .reports-tab-ui .reports-table-shell{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:12px !important;
    box-sizing:border-box !important;

    border:1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-admin-soft, var(--sadaa-surface-alt, #f8fafc)) !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  /* الطبقة البيضاء الداخلية للجدول. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .reports-tab-ui .reports-table-shell
  > .reports-list-card{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;

    border:1px solid var(--sadaa-admin-line, var(--sadaa-line, #e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface, #fff) !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .reports-tab-ui .reports-table-shell
  .reports-table{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    border-radius:8px !important;
    overflow:visible !important;
    box-sizing:border-box !important;
  }

  /* Pagination يظل خارج الـ shell ولا يلتصق به. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .reports-tab-ui
  .reports-table-shell + .reports-pagination{
    margin-top:12px !important;
  }
}

/* =========================================================
   Admin Moderators — Desktop / Laptop container radius
   2026-09-30
   النطاق: 1101px فأعلى

   توحيد زوايا الحاوية الخلفية لبطاقات المشرفين.
   ========================================================= */
@media (min-width:1101px){

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab
  .sadaa-tablet-records-shell{
    border-radius:8px !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }
}

/* =========================================================
   Admin Orders — Desktop / Laptop status badge refinement
   2026-09-30
   النطاق: 1101px فأعلى

   تحسين راحة شارات الحالة داخل عمود الحالة بدون تغيير
   ألوان الحالات أو بنية الجدول.
   ========================================================= */
@media (min-width:1101px){

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  .orders-grid-cell[data-label="الحالة"]{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:0 !important;
    padding-inline:10px !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  .orders-grid-cell[data-label="الحالة"]
  :is(
    .orders-status,
    .order-status,
    .status-badge,
    .status-pill,
    .badge,
    [class*="status"]
  ){
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px !important;

    min-width:72px !important;
    min-height:34px !important;
    padding:6px 10px !important;

    border-radius:7px !important;
    box-sizing:border-box !important;

    line-height:1.35 !important;
    text-align:center !important;
    white-space:nowrap !important;
  }

  /* الحالات ذات النص الأطول تحتاج مساحة إضافية بسيطة. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  .orders-grid-cell[data-label="الحالة"]
  :is(
    .status-payment_failed,
    .status-payment_expired,
    .status-refunded,
    .status-refund,
    .status-expired,
    [class*="payment"],
    [class*="refund"]
  ){
    min-width:94px !important;
    padding-inline:12px !important;
  }
}

/* =========================================================
   Admin Orders — Desktop / Laptop column vertical alignment
   2026-09-30
   النطاق: 1101px فأعلى

   توحيد المحاذاة العمودية لرأس الجدول وصفوف الطلبات،
   مع إبقاء عمود الإجراءات بلا عنوان نصي.
   ========================================================= */
@media (min-width:1101px){

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  :is(.orders-grid-header,.orders-grid-row){
    align-items:stretch !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  :is(.orders-grid-header,.orders-grid-row)
  > .orders-grid-cell{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:0 !important;
    min-height:100% !important;
    box-sizing:border-box !important;
    vertical-align:middle !important;
  }

  /* اسم المعلن: توحيد محاذاة العنوان والقيم مع بقية أعمدة الجدول. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  .orders-grid-row
  > .orders-grid-cell[data-label="اسم المعلن"]{
    justify-content:center !important;
    text-align:center !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  .orders-grid-header
  > .orders-grid-cell:nth-child(3){
    justify-content:center !important;
    text-align:center !important;
  }

  /* عمود الإجراءات يتوسط زر الثلاث نقاط فقط. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  :is(.orders-actions-cell,.orders-actions-head){
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    vertical-align:middle !important;
  }

  /* احتياط: لا يظهر عنوان "إجراءات" في رأس العمود حتى لو بقي في HTML قديم. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui .orders-actions-head{
    font-size:0 !important;
    color:transparent !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui .orders-actions-head > *{
    font-size:initial !important;
    color:inherit !important;
  }

  /* الشارات والأزرار داخل الخلايا تتمركز عمودياً بدون التأثير على ألوانها. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .orders-tab-ui
  .orders-grid-cell
  :is(
    .sadaa-status,
    .status-badge,
    .status-pill,
    .orders-id-pill,
    .orders-row-actions-toggle
  ){
    align-self:center !important;
    margin-block:auto !important;
  }
}

/* =========================================================
   Admin Design System — Desktop / Laptop Search & Filter Disclosure
   2026-09-30
   النطاق: 1101px فأعلى

   تعميم نفس مكوّن البحث/الفلاتر القابل للفتح والإغلاق
   المعتمد في التابلت والجوال على اللابتوب وسطح المكتب.
   ========================================================= */
@media (min-width:1101px){

  :root{
    --sadaa-admin-tools-summary-height:46px;
    --sadaa-admin-tools-body-padding:12px;
  }

  /* -------------------------------------------------------
     الحاوية المركزية
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure[class*="sadaa-tablet-disclosure--"]{
    position:relative !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 0 10px !important;
    padding:0 !important;
    box-sizing:border-box !important;

    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }

  /* -------------------------------------------------------
     الرأس: نفس التابلت والجوال
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure[class*="sadaa-tablet-disclosure--"]
  > summary.sadaa-tablet-disclosure__summary{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;

    width:100% !important;
    min-height:var(--sadaa-admin-tools-summary-height) !important;
    margin:0 !important;
    padding:9px 14px !important;
    box-sizing:border-box !important;

    list-style:none !important;
    pointer-events:auto !important;
    cursor:pointer !important;

    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:7px 7px 0 0 !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    color:var(--sadaa-admin-text,var(--sadaa-text-2,#374151)) !important;
    box-shadow:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure
  > summary.sadaa-tablet-disclosure__summary::-webkit-details-marker{
    display:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure
  > summary.sadaa-tablet-disclosure__summary::marker{
    content:"" !important;
    display:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure
  .sadaa-tablet-disclosure__title{
    min-width:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;
    margin:0 !important;
    color:inherit !important;
    font-size:13px !important;
    font-weight:500 !important;
    line-height:1.6 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure
  .sadaa-tablet-disclosure__title
  > :is(i,svg){
    flex:0 0 auto !important;
    color:var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
  }

  /* -------------------------------------------------------
     سهم الفتح والإغلاق
     مغلق = لليسار / مفتوح = للأسفل
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure
  .sadaa-tablet-disclosure__chevron{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    flex:0 0 28px !important;

    display:grid !important;
    place-items:center !important;

    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;

    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:6px !important;
    background:#fff !important;
    color:var(--sadaa-muted,#6b7280) !important;
    box-shadow:none !important;
    line-height:1 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure:not([open])
  > summary.sadaa-tablet-disclosure__summary
  .sadaa-tablet-disclosure__chevron::before{
    position:static !important;
    left:auto !important;
    top:auto !important;
    transform:rotate(45deg) !important;
    transform-origin:center !important;
    transition:transform 160ms ease !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure[open]
  > summary.sadaa-tablet-disclosure__summary
  .sadaa-tablet-disclosure__chevron{
    border-color:color-mix(
      in srgb,
      var(--sadaa-admin-primary,var(--sadaa-primary)) 28%,
      var(--sadaa-admin-line,#e5e7eb)
    ) !important;
    color:var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure[open]
  > summary.sadaa-tablet-disclosure__summary
  .sadaa-tablet-disclosure__chevron::before{
    position:static !important;
    left:auto !important;
    top:auto !important;
    transform:rotate(-45deg) !important;
    transform-origin:center !important;
    transition:transform 160ms ease !important;
  }

  /* -------------------------------------------------------
     الجسم: إلغاء سلوك outside القديم على سطح المكتب
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure:not([open])
  > .sadaa-tablet-disclosure__body{
    display:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure[open]
  > .sadaa-tablet-disclosure__body{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    padding:var(--sadaa-admin-tools-body-padding) !important;
    box-sizing:border-box !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  /* استعادة نوع Layout الداخلي لكل تبويب بعد إلغاء display:contents القديم. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  details.sadaa-admin-tools-card[open]
  > .finance-search-row{
    display:grid !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  details.sadaa-admin-tools-card[open]
  > .finance-date-filter-row{
    display:grid !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .newsletter-admin
  details.sadaa-admin-tools-card[open]
  > .newsletter-tablet-disclosure-body{
    display:grid !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  :is(
    .orders-tab-ui,
    .reports-tab-ui,
    .users-tab-soft,
    .moderators-tab,
    .coupons-tab-ui,
    .directory-tab-soft
  )
  details.sadaa-admin-tools-card[open]
  > .sadaa-tablet-disclosure__body{
    display:block !important;
  }

  /* عند الإغلاق تختفي الحدود السفلية للرأس بشكل أنظف. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  details.sadaa-admin-tools-card.sadaa-tablet-disclosure:not([open])
  > summary.sadaa-tablet-disclosure__summary{
    border-bottom:0 !important;
    border-radius:7px !important;
  }
}

/* =========================================================
   Admin Desktop / Laptop — Remove outer Search/Filter shells
   2026-09-30
   النطاق: 1101px فأعلى

   التبويبان:
   - إدارة المتاجر
   - تقرير الطلبات

   نحافظ على بطاقات details/summary المستقلة، ونزيل فقط
   الـ wrapper الخارجي الذي كان يرسم حاوية إضافية خلفها.
   ========================================================= */
@media (min-width:1101px){

  /* -------------------------------------------------------
     إدارة المتاجر
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .directory-tab-soft
  :is(
    .directory-unified-toolbar,
    .directory-toolbar-shell,
    .directory-tools-shell,
    .directory-filter-card,
    .directory-search-filter-wrap
  ){
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  /* إذا كان الـ wrapper يحمل class من النظام العام فلا يرسم سطحاً إضافياً. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .directory-tab-soft
  :is(
    .directory-unified-toolbar,
    .directory-toolbar-shell,
    .directory-tools-shell,
    .directory-filter-card,
    .directory-search-filter-wrap
  ).sadaa-admin-list-shell,
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .directory-tab-soft
  :is(
    .directory-unified-toolbar,
    .directory-toolbar-shell,
    .directory-tools-shell,
    .directory-filter-card,
    .directory-search-filter-wrap
  ).sadaa-admin-card{
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  /* -------------------------------------------------------
     تقرير الطلبات
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  :is(
    .finance-filter-card,
    .finance-filter-grid,
    .finance-filter-shell,
    .finance-tools-shell
  ){
    width:100% !important;
    max-width:none !important;
    margin:0 0 10px !important;
    padding:0 !important;

    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  :is(
    .finance-filter-card,
    .finance-filter-grid,
    .finance-filter-shell,
    .finance-tools-shell
  ).sadaa-admin-list-shell,
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  :is(
    .finance-filter-card,
    .finance-filter-grid,
    .finance-filter-shell,
    .finance-tools-shell
  ).sadaa-admin-card{
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  /* بطاقات البحث/الفلاتر نفسها تبقى كما هي ومفتوحة/مغلقة بشكل مستقل. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent
  :is(.directory-tab-soft,.finance-tab)
  details.sadaa-admin-tools-card{
    width:100% !important;
    max-width:none !important;
  }
}

/* =========================================================
   Admin Desktop / Laptop — Exact outer filter shell cleanup
   2026-09-30
   النطاق: 1101px فأعلى

   إدارة المتاجر:
   إزالة .directory-filters-panel الفعلية.

   تقرير الطلبات:
   إزالة الرأس الخارجي .finance-card-head
   وتحويل .finance-filter-card إلى غلاف بنيوي غير مرئي.
   ========================================================= */
@media (min-width:1101px){

  /* -------------------------------------------------------
     إدارة المتاجر — إزالة الحاوية الخارجية الفعلية
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .directory-tab-soft
  > .directory-filters-panel.sadaa-admin-list-shell{
    display:contents !important;
  }

  /* -------------------------------------------------------
     تقرير الطلبات — إزالة الرأس الخارجي الزائد
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  > .finance-filter-card
  > .finance-card-head{
    display:none !important;
  }

  /* الحاوية الخارجية تصبح بنيوية فقط؛ بطاقات details تبقى مستقلة. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  > .finance-filter-card{
    display:contents !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab
  > .finance-filter-card
  > .finance-filter-grid{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
}

/* =========================================================
   Responsive Disclosure — Public / Shared
   2026-10-01

   مكوّن مركزي عام لمناطق البحث والفلاتر في الصفحات العامة،
   بنفس لغة الفتح/الإغلاق المعتمدة في لوحات المدير والعضو.
   ========================================================= */
@media (max-width:1100px){

  html body details.sadaa-responsive-disclosure{
    position:relative !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-line,#e5e7eb) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }

  html body details.sadaa-responsive-disclosure
  > summary.sadaa-responsive-disclosure__summary{
    width:100% !important;
    min-height:44px !important;
    margin:0 !important;
    padding:8px 10px !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    list-style:none !important;
    cursor:pointer !important;
    user-select:none !important;
    -webkit-tap-highlight-color:transparent !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-line,#e5e7eb) !important;
    border-radius:7px 7px 0 0 !important;
    background:var(--sadaa-surface-alt,#f7f8fa) !important;
    color:var(--sadaa-text-2,#374151) !important;
    box-shadow:none !important;
  }

  html body details.sadaa-responsive-disclosure
  > summary.sadaa-responsive-disclosure__summary::-webkit-details-marker{
    display:none !important;
  }

  html body details.sadaa-responsive-disclosure
  > summary.sadaa-responsive-disclosure__summary::marker{
    content:"" !important;
  }

  html body .sadaa-responsive-disclosure__title{
    min-width:0 !important;
    margin:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:8px !important;
    color:inherit !important;
    font-size:13.5px !important;
    font-weight:500 !important;
    line-height:1.7 !important;
  }

  html body .sadaa-responsive-disclosure__title > :is(i,svg){
    flex:0 0 auto !important;
    color:var(--sadaa-primary) !important;
  }

  html body .sadaa-responsive-disclosure__chevron{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    flex:0 0 28px !important;
    display:grid !important;
    place-items:center !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-line,#e5e7eb) !important;
    border-radius:6px !important;
    background:#fff !important;
    color:var(--sadaa-muted,#6b7280) !important;
    line-height:1 !important;
  }

  html body .sadaa-responsive-disclosure__chevron::before{
    content:"" !important;
    width:7px !important;
    height:7px !important;
    box-sizing:border-box !important;
    border-inline-end:1.5px solid currentColor !important;
    border-bottom:1.5px solid currentColor !important;
    transform-origin:center !important;
    transition:transform 160ms ease !important;
  }

  html body details.sadaa-responsive-disclosure:not([open])
  > summary .sadaa-responsive-disclosure__chevron::before{
    transform:rotate(45deg) !important;
  }

  html body details.sadaa-responsive-disclosure[open]
  > summary .sadaa-responsive-disclosure__chevron{
    color:var(--sadaa-primary) !important;
  }

  html body details.sadaa-responsive-disclosure[open]
  > summary .sadaa-responsive-disclosure__chevron::before{
    transform:rotate(-45deg) !important;
  }

  html body details.sadaa-responsive-disclosure:not([open])
  > .sadaa-responsive-disclosure__body{
    display:none !important;
  }

  html body details.sadaa-responsive-disclosure[open]
  > .sadaa-responsive-disclosure__body{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:12px !important;
    box-sizing:border-box !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body details.sadaa-responsive-disclosure:not([open])
  > summary.sadaa-responsive-disclosure__summary{
    border-bottom:0 !important;
    border-radius:7px !important;
  }
}

/* =========================================================
   Store Directory — Tablet / Mobile Search & Cards Separation
   2026-10-01
   النطاق: <=1100px
   ========================================================= */
@media (max-width:1100px){

  html body .stores-directory-shell .stores-directory-layout{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .stores-directory-shell .stores-directory-layout::before{
    content:none !important;
    display:none !important;
  }

  html body .stores-directory-shell
  :is(.stores-directory-unified-head,.stores-directory-filter-disclosure,.stores-content-panel){
    grid-column:1 / -1 !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell
  details.stores-directory-filter-disclosure.stores-sidebar{
    display:block !important;
    padding:0 !important;
    gap:0 !important;
    border-radius:8px !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  > .stores-directory-filter-body{
    padding:12px !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-section + .stores-filter-section{
    margin-top:12px !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-actions{
    margin-top:12px !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-side-visual{
    display:none !important;
  }

  html body .stores-directory-shell
  .store-content.stores-content-panel{
    display:block !important;
    padding:12px !important;
    border:1px solid var(--sadaa-line,#e5e7eb) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .stores-directory-shell
  .stores-content-panel #storeContainer{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .stores-directory-shell .stores-mobile-controls{
    display:none !important;
  }
}

/* سطح المكتب يبقى بنفس تخطيطه الحالي. */
@media (min-width:1101px){

  html body .stores-directory-shell
  details.stores-directory-filter-disclosure
  > summary.sadaa-responsive-disclosure__summary{
    display:none !important;
  }

  html body .stores-directory-shell
  details.stores-directory-filter-disclosure
  > .stores-directory-filter-body{
    display:contents !important;
  }
}

/* =========================================================
   Store Directory — Interaction Stability / Flash Guard
   2026-10-01
   جميع الشاشات

   إزالة وميض/Highlight النقر من عناصر دليل المتاجر مع
   الإبقاء على focus-visible الحقيقي لمستخدمي الكيبورد.
   ========================================================= */
html body:has(.stores-directory-shell)
:is(
  a,
  button,
  summary,
  label,
  input,
  select,
  textarea,
  [role="button"],
  [tabindex],
  .store-card,
  .like-btn,
  .visit-button,
  .stores-filter-submit,
  .stores-filter-reset,
  .stores-directory-nav-link,
  .back-to-top
){
  -webkit-tap-highlight-color:transparent !important;
}

html body:has(.stores-directory-shell)
:is(
  a,
  button,
  summary,
  [role="button"],
  .like-btn,
  .visit-button,
  .stores-filter-submit,
  .stores-filter-reset,
  .stores-directory-nav-link,
  .back-to-top
){
  touch-action:manipulation !important;
}

html body:has(.stores-directory-shell)
:is(
  a,
  button,
  summary,
  input,
  select,
  textarea,
  [role="button"],
  [tabindex],
  .like-btn,
  .visit-button,
  .stores-filter-submit,
  .stores-filter-reset,
  .stores-directory-nav-link,
  .back-to-top
):focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
}

/* لا نلغي مؤشر الوصول عند التنقل بالكيبورد. */
html body:has(.stores-directory-shell)
:is(
  a,
  button,
  summary,
  input,
  select,
  textarea,
  [role="button"],
  [tabindex]
):focus-visible{
  outline:2px solid color-mix(
    in srgb,
    var(--sadaa-primary) 58%,
    transparent
  ) !important;
  outline-offset:2px !important;
}

/* على أجهزة اللمس لا يبقى Hover البطاقة عالقاً بعد النقر. */
@media (hover:none){
  html body .stores-directory-shell .store-card:hover{
    transform:none !important;
  }
}

/* =========================================================
   Store Directory — View Modes / Stable Card Actions v2
   2026-10-01

   - سطح المكتب: list-view مدمج وطبيعي، grid-view بطاقات.
   - التابلت 768–1100: تفعيل القائمة/الشبكة فعلياً.
   - تثبيت الأزرار أسفل البطاقة في grid-view فقط.
   - الجوال الصغير يبقى على تخطيطه الحالي.
   ========================================================= */
:root{
  --sadaa-store-card-description-lines:3;
}

/* ---------------------------------------------------------
   قواعد مشتركة آمنة
   --------------------------------------------------------- */
html body .stores-directory-shell
.stores-content-panel
.store-card{
  min-width:0 !important;
  box-sizing:border-box !important;
}

html body .stores-directory-shell
.stores-content-panel
.store-card .store-info{
  min-width:0 !important;
  box-sizing:border-box !important;
}

html body .stores-directory-shell
.stores-content-panel
.store-card .store-footer{
  min-width:0 !important;
  box-sizing:border-box !important;
}

/* =========================================================
   سطح المكتب — 1101px فأعلى
   ========================================================= */
@media (min-width:1101px){

  /* وضع القائمة: بطاقة أفقية مدمجة، بدون تمدد رأسي مصطنع. */
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view{
    display:block !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  :is(.stores-featured-zone,.stores-group-grid){
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .stores-featured-zone{
    margin-bottom:12px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-card{
    display:grid !important;
    grid-template-columns:96px minmax(0,1fr) minmax(220px,260px) !important;
    align-items:center !important;
    gap:18px !important;

    width:100% !important;
    height:auto !important;
    min-height:132px !important;
    aspect-ratio:auto !important;
    margin:0 !important;
    padding:16px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-logo{
    width:82px !important;
    height:82px !important;
    min-width:82px !important;
    flex:none !important;
    margin:0 auto !important;
    padding:8px !important;
    transform:none !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-info{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    flex:none !important;
    overflow:visible !important;
    text-align:right !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-info h2{
    justify-content:flex-start !important;
    text-align:right !important;
    margin:0 0 5px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-info p{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    width:100% !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    overflow:hidden !important;
    text-align:right !important;
    line-height:1.75 !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-footer{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    align-items:center !important;
    gap:8px !important;
    width:100% !important;
    margin:0 !important;
    align-self:center !important;
  }

  /* وضع الشبكة فقط: الأزرار مثبتة أسفل البطاقة. */
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-card{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    height:100% !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-card .store-info{
    display:flex !important;
    flex-direction:column !important;
    flex:1 1 auto !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-card .store-info p{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:3 !important;
    overflow:hidden !important;
    min-height:5.1em !important;
    max-height:5.1em !important;
    line-height:1.7 !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-card .store-footer{
    align-self:stretch !important;
    width:100% !important;
    margin-top:auto !important;
  }
}

/* =========================================================
   التابلت — 768px إلى 1100px
   ========================================================= */
@media (min-width:768px) and (max-width:1100px){

  /* إظهار زر التبديل الذي كانت القواعد المحلية تخفيه. */
  html body .stores-directory-shell
  .stores-directory-unified-head
  .view-toggle{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }

  /* -------------------------------------------------------
     البحث والفلاتر: حقل البحث + الترتيب + الزرين في صف واحد
     ------------------------------------------------------- */
  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card{
    display:grid !important;
    grid-template-columns:
      minmax(220px,1.7fr)
      minmax(150px,.95fr)
      minmax(122px,.72fr)
      minmax(122px,.72fr)
      !important;
    align-items:end !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(.stores-filter-section-search,.stores-filter-section-sort){
    min-width:0 !important;
    margin:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-section + .stores-filter-section{
    margin-top:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card
  :is(.sadaa-input,.sadaa-select-shell,.sadaa-select){
    width:100% !important;
    min-width:0 !important;
  }

  /* نجعل الزرين عنصرين مستقلين في نفس Grid. */
  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-actions{
    display:contents !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(.stores-filter-submit,.stores-filter-reset){
    width:100% !important;
    min-width:0 !important;
    height:44px !important;
    min-height:44px !important;
    margin:0 !important;
    padding-inline:9px !important;
    white-space:nowrap !important;
  }

  /* -------------------------------------------------------
     وضع القائمة — بطاقة أفقية مدمجة
     ------------------------------------------------------- */
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view{
    display:block !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  :is(.stores-featured-zone,.stores-group-grid){
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .stores-featured-zone{
    margin-bottom:10px !important;
    padding:10px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-card{
    display:grid !important;
    grid-template-columns:88px minmax(0,1fr) minmax(200px,240px) !important;
    align-items:center !important;
    gap:14px !important;

    width:100% !important;
    height:auto !important;
    min-height:122px !important;
    aspect-ratio:auto !important;
    margin:0 !important;
    padding:14px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-logo{
    width:78px !important;
    height:78px !important;
    min-width:78px !important;
    flex:none !important;
    margin:0 auto !important;
    padding:7px !important;
    transform:none !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-info{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    flex:none !important;
    overflow:visible !important;
    text-align:right !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-info h2{
    justify-content:flex-start !important;
    text-align:right !important;
    margin:0 0 4px !important;
    font-size:14.5px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-info p{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;

    width:100% !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;

    font-size:12px !important;
    line-height:1.7 !important;
    text-align:right !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-footer{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    align-items:center !important;
    gap:7px !important;
    width:100% !important;
    margin:0 !important;
    align-self:center !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  :is(.like-btn,.visit-button){
    min-height:40px !important;
    height:40px !important;
    font-size:12px !important;
  }

  /* -------------------------------------------------------
     وضع الشبكة — 2 أعمدة عند 768/900، و3 عند 901/1100
     ------------------------------------------------------- */
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view{
    display:block !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  :is(.stores-featured-zone,.stores-group-grid){
    display:grid !important;
    gap:12px !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .stores-featured-zone{
    margin-bottom:12px !important;
    padding:10px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-card{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;

    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:1 / 1 !important;
    margin:0 !important;
    padding:14px 12px 12px !important;
    gap:8px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-logo{
    width:76px !important;
    height:76px !important;
    min-width:76px !important;
    flex:0 0 76px !important;
    margin:0 auto !important;
    padding:7px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-info{
    display:flex !important;
    flex-direction:column !important;
    flex:1 1 auto !important;
    width:100% !important;
    min-width:0 !important;
    text-align:center !important;
    overflow:hidden !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-info h2{
    justify-content:center !important;
    margin:0 0 4px !important;
    font-size:14px !important;
    text-align:center !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-info p{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;

    width:100% !important;
    min-height:3.4em !important;
    max-height:3.4em !important;
    margin:0 !important;

    font-size:11.75px !important;
    line-height:1.7 !important;
    text-align:center !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-footer{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    align-items:center !important;
    gap:6px !important;

    flex:0 0 auto !important;
    align-self:stretch !important;
    width:100% !important;
    margin-top:auto !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  :is(.like-btn,.visit-button){
    min-height:38px !important;
    height:38px !important;
    padding-inline:7px !important;
    font-size:11.75px !important;
  }
}

/* 768–900: شبكتان */
@media (min-width:768px) and (max-width:900px){
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  :is(.stores-featured-grid,.stores-regular-grid){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* 901–1100: ثلاث شبكات لتقليل ضخامة البطاقات في 1024 */
@media (min-width:901px) and (max-width:1100px){
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  :is(.stores-featured-grid,.stores-regular-grid){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* الجوال الأصغر من 768 يبقى على التصميم المتجاوب الموجود. */
@media (max-width:767px){
  html body .stores-directory-shell
  .stores-directory-unified-head
  .view-toggle{
    display:none !important;
  }
}

/* =========================================================
   Store Directory — Final Responsive Layout Round
   2026-10-01

   768px / 1024px / Laptop & Desktop
   ========================================================= */

/* ---------------------------------------------------------
   هوية تفاعل بطاقات المتاجر
   العادي = رمادي متوسط
   المميز = بنفسجي
   --------------------------------------------------------- */
html body .stores-directory-shell
.stores-content-panel .store-card{
  border-color:var(--sadaa-line,#e5e7eb) !important;
}

html body .stores-directory-shell
.stores-content-panel .store-card:not(.featured):hover,
html body .stores-directory-shell
.stores-content-panel .store-card:not(.featured):focus-within,
html body .stores-directory-shell
.stores-content-panel .store-card:not(.featured):active{
  border-color:#9ca3af !important;
  box-shadow:0 8px 20px rgba(17,24,39,.08) !important;
}

html body .stores-directory-shell
.stores-content-panel .store-card.featured:hover,
html body .stores-directory-shell
.stores-content-panel .store-card.featured:focus-within,
html body .stores-directory-shell
.stores-content-panel .store-card.featured:active{
  border-color:var(--sadaa-primary) !important;
}

/* ---------------------------------------------------------
   أزرار طريقة العرض — بدون حاوية خلفية
   --------------------------------------------------------- */
@media (min-width:768px){
  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle{
    display:flex !important;
    align-items:center !important;
    gap:6px !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle button{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;

    display:grid !important;
    place-items:center !important;

    border:1px solid rgba(255,255,255,.26) !important;
    border-radius:7px !important;
    background:rgba(255,255,255,.10) !important;
    color:#fff !important;
    box-shadow:none !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle button.active{
    border-color:#fff !important;
    background:#fff !important;
    color:var(--sadaa-primary) !important;
  }
}

/* =========================================================
   1024px — 901..1100
   ========================================================= */
@media (min-width:901px) and (max-width:1100px){

  /* الهيرو:
     النص يمين — النتائج والعرض يسار — الروابط تحت أدوات العرض. */
  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:auto auto !important;
    column-gap:22px !important;
    row-gap:9px !important;
    align-items:start !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-text{
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-tools{
    grid-column:2 !important;
    grid-row:1 !important;

    width:auto !important;
    min-width:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-nav{
    grid-column:2 !important;
    grid-row:2 !important;

    width:auto !important;
    min-width:0 !important;
    margin:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-nav .stores-directory-nav-link,
  html body .stores-directory-shell
  .stores-results-count{
    min-height:40px !important;
    height:40px !important;
    box-sizing:border-box !important;
  }

  /* البحث / الترتيب / النوع / الزرين في صف واحد. */
  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card{
    display:grid !important;
    grid-template-columns:
      minmax(250px,1.8fr)
      minmax(150px,1fr)
      minmax(150px,1fr)
      minmax(112px,.72fr)
      minmax(112px,.72fr)
      !important;
    align-items:end !important;
    gap:10px !important;

    width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(
    .stores-filter-section-search,
    .stores-filter-section-sort,
    .stores-filter-section-type
  ){
    min-width:0 !important;
    margin:0 !important;
    grid-column:auto !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-section + .stores-filter-section{
    margin-top:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-actions{
    display:contents !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(.stores-filter-submit,.stores-filter-reset){
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
    height:44px !important;
    min-height:44px !important;
    margin:0 !important;
    padding-inline:8px !important;
    white-space:nowrap !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(.sadaa-input,.sadaa-select-shell,.sadaa-select){
    width:100% !important;
    min-width:0 !important;
  }

  /* Grid 1024: 3 بطاقات، لكن بمحتوى أكبر ومريح. */
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  :is(.stores-featured-grid,.stores-regular-grid){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:12px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view .store-card{
    aspect-ratio:auto !important;
    min-height:292px !important;
    padding:17px 14px 14px !important;
    gap:10px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view .store-logo{
    width:98px !important;
    height:98px !important;
    min-width:98px !important;
    flex:0 0 98px !important;
    padding:9px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view .store-info h2{
    font-size:16px !important;
    line-height:1.55 !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view .store-info p{
    font-size:12.75px !important;
    line-height:1.75 !important;
    min-height:3.5em !important;
    max-height:3.5em !important;
  }
}

/* =========================================================
   768px — 768..900
   ========================================================= */
@media (min-width:768px) and (max-width:900px){

  /* الهيرو:
     العنوان في الأعلى، ثم روابط التنقل + النتائج + العرض في صف واحد. */
  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:auto auto !important;
    column-gap:8px !important;
    row-gap:10px !important;
    align-items:start !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-text{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-nav{
    grid-column:1 !important;
    grid-row:2 !important;

    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    align-items:center !important;
    gap:8px !important;

    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-tools{
    grid-column:2 !important;
    grid-row:2 !important;

    display:flex !important;
    align-items:center !important;
    gap:7px !important;

    width:auto !important;
    min-width:0 !important;
  }

  /* جميع عناصر الهيرو السفلية بنفس الارتفاع. */
  html body .stores-directory-shell
  :is(
    .stores-directory-head-nav .stores-directory-nav-link,
    .stores-results-count
  ){
    min-height:42px !important;
    height:42px !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle button{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
  }

  /* البحث / الترتيب / النوع / الزرين في صف واحد بدون انكسار. */
  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card{
    display:grid !important;
    grid-template-columns:
      minmax(180px,1.5fr)
      minmax(112px,.9fr)
      minmax(112px,.9fr)
      minmax(102px,.72fr)
      minmax(102px,.72fr)
      !important;
    align-items:end !important;
    gap:8px !important;

    width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(
    .stores-filter-section-search,
    .stores-filter-section-sort,
    .stores-filter-section-type
  ){
    min-width:0 !important;
    margin:0 !important;
    grid-column:auto !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-section + .stores-filter-section{
    margin-top:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card .sadaa-label{
    white-space:nowrap !important;
    font-size:12px !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-actions{
    display:contents !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(.stores-filter-submit,.stores-filter-reset){
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
    height:44px !important;
    min-height:44px !important;
    margin:0 !important;
    padding-inline:7px !important;
    font-size:12px !important;
    white-space:nowrap !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(.sadaa-input,.sadaa-select-shell,.sadaa-select){
    width:100% !important;
    min-width:0 !important;
  }

  /* Grid 768: بطاقتان أكبر ومحتوى أكثر وضوحاً. */
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  :is(.stores-featured-grid,.stores-regular-grid){
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view .store-card{
    aspect-ratio:auto !important;
    min-height:312px !important;
    padding:18px 15px 15px !important;
    gap:11px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view .store-logo{
    width:108px !important;
    height:108px !important;
    min-width:108px !important;
    flex:0 0 108px !important;
    padding:10px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view .store-info h2{
    font-size:17px !important;
    line-height:1.55 !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view .store-info p{
    font-size:13.25px !important;
    line-height:1.75 !important;
    min-height:3.5em !important;
    max-height:3.5em !important;
  }
}

/* =========================================================
   Laptop 1440 + Desktop — 1101px فأعلى
   ========================================================= */
@media (min-width:1101px){

  /* الهيرو:
     النتائج + العرض في الجهة المقابلة،
     وروابط الهيرو تحتها مباشرة. */
  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-rows:auto auto !important;
    column-gap:28px !important;
    row-gap:9px !important;
    align-items:start !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-text{
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-tools{
    grid-column:2 !important;
    grid-row:1 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;

    width:auto !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-nav{
    grid-column:2 !important;
    grid-row:2 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;

    width:auto !important;
    margin:0 !important;
  }

  /* محاذاة اسم المتجر في Grid. */
  html body .stores-directory-shell
  .store-list.grid-view .store-info h2,
  html body .stores-directory-shell
  .store-list.grid-view .store-title-text{
    width:100% !important;
    justify-content:center !important;
    text-align:center !important;
  }

  /* إزالة الحاوية العامة خلف كل البطاقات. */
  html body .stores-directory-shell
  .store-content.stores-content-panel{
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  /* المتجر المميز فقط داخل حاوية مستقلة. */
  html body .stores-directory-shell
  .store-list .stores-featured-zone{
    display:block !important;
    width:100% !important;
    margin:0 0 14px !important;
    padding:12px !important;

    border:1px solid rgba(var(--sadaa-primary-rgb),.20) !important;
    border-radius:10px !important;
    background:rgba(var(--sadaa-primary-rgb),.028) !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.75) !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell
  .store-list.list-view .stores-featured-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
  }

  html body .stores-directory-shell
  .store-list.grid-view .stores-featured-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:14px !important;
  }

  /* المتاجر العادية بدون أي حاوية خلفية. */
  html body .stores-directory-shell
  .store-list .stores-regular-grid{
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body .stores-directory-shell
  .store-list.list-view .stores-regular-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
  }

  html body .stores-directory-shell
  .store-list.grid-view .stores-regular-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:14px !important;
  }
}

/* الجوال يبقى على تخطيطه الحالي بدون تغيير. */
@media (max-width:767px){
  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle{
    display:none !important;
  }
}

/* =========================================================
   Store Directory — Final Detail Repairs
   2026-10-01
   - 768 hero stacking
   - tablet label cleanup
   - featured badge/logo clearance
   - desktop grid structure repair
   ========================================================= */

/* =========================================================
   Tablet 768–1100 — remove field labels
   ========================================================= */
@media (min-width:768px) and (max-width:1100px){

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card
  > .stores-filter-section
  > .sadaa-label{
    display:none !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card{
    align-items:center !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(
    .stores-filter-section-search,
    .stores-filter-section-sort,
    .stores-filter-section-type
  ){
    align-self:center !important;
  }

  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  :is(
    .sadaa-input,
    .sadaa-select-shell,
    .sadaa-select,
    .stores-filter-submit,
    .stores-filter-reset
  ){
    height:44px !important;
    min-height:44px !important;
    box-sizing:border-box !important;
  }
}

/* =========================================================
   768px — results/view row, nav directly below
   ========================================================= */
@media (min-width:768px) and (max-width:900px){

  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto auto !important;
    row-gap:8px !important;
    align-items:start !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-text{
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-tools{
    grid-column:1 !important;
    grid-row:2 !important;
    justify-self:end !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:7px !important;

    width:max-content !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-nav{
    grid-column:1 !important;
    grid-row:3 !important;
    justify-self:end !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:7px !important;

    width:max-content !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  html body .stores-directory-shell
  :is(
    .stores-results-count,
    .stores-directory-head-nav .stores-directory-nav-link
  ){
    height:42px !important;
    min-height:42px !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head
  .view-toggle button{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
  }

  /* List: keep featured triangle clear of the logo. */
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-card.featured
  .store-logo{
    transform:translateX(-16px) !important;
  }
}

/* =========================================================
   Desktop / Laptop — fix distorted Grid cards
   ========================================================= */
@media (min-width:1101px){

  /*
   * The two group wrappers must NOT be two columns of store-list.
   * Each group occupies the full available width first.
   */
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  > :is(.stores-featured-zone,.stores-regular-grid){
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .stores-featured-grid,
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .stores-regular-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    align-items:stretch !important;
    gap:14px !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-card{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;

    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:305px !important;
    aspect-ratio:auto !important;

    padding:18px 16px 15px !important;
    gap:10px !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-logo{
    width:94px !important;
    height:94px !important;
    min-width:94px !important;
    flex:0 0 94px !important;
    margin:0 auto !important;
    padding:8px !important;
    transform:none !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-info{
    display:flex !important;
    flex-direction:column !important;
    flex:1 1 auto !important;

    width:100% !important;
    min-width:0 !important;
    text-align:center !important;
    overflow:hidden !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-info h2,
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-title-text{
    width:100% !important;
    justify-content:center !important;
    text-align:center !important;
    font-size:16px !important;
    line-height:1.55 !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-info p{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:3 !important;

    width:100% !important;
    min-height:5.1em !important;
    max-height:5.1em !important;
    margin:0 !important;
    overflow:hidden !important;

    font-size:12.75px !important;
    line-height:1.7 !important;
    text-align:center !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.grid-view
  .store-footer{
    flex:0 0 auto !important;
    align-self:stretch !important;

    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    align-items:center !important;
    gap:8px !important;

    width:100% !important;
    margin-top:auto !important;
  }
}

/* =========================================================
   Store Directory — Hero Stack + Unified Filter Typography
   2026-10-01
   ========================================================= */
:root{
  --sadaa-store-filter-control-font-size:12px;
  --sadaa-store-hero-control-width:150px;
}

/* توحيد نصوص الحقول والقوائم والأزرار في جميع الشاشات. */
html body .stores-directory-shell
.stores-directory-filter-disclosure
:is(.sadaa-input,.sadaa-select,.stores-filter-submit,.stores-filter-reset){
  font-size:var(--sadaa-store-filter-control-font-size) !important;
  line-height:1.35 !important;
}

html body .stores-directory-shell
.stores-directory-filter-disclosure
.sadaa-input::placeholder{
  font-size:var(--sadaa-store-filter-control-font-size) !important;
}

html body .stores-directory-shell
.stores-directory-filter-disclosure
.sadaa-select option{
  font-size:var(--sadaa-store-filter-control-font-size) !important;
}

/* إبعاد شعار المتجر المميز عن شارة الركن في وضع القائمة. */
@media (min-width:768px){
  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-card.featured
  .store-logo{
    transform:translateX(-18px) !important;
  }
}

/* =========================================================
   1440 + Desktop
   الرئيسية > استكشف > عدد النتائج > القائمة/الشبكة
   ========================================================= */
@media (min-width:1101px){
  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) var(--sadaa-store-hero-control-width) !important;
    grid-template-rows:auto auto !important;
    column-gap:28px !important;
    row-gap:7px !important;
    align-items:start !important;
  }

  html body .stores-directory-shell .stores-directory-head-text{
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    min-width:0 !important;
    width:100% !important;
  }

  html body .stores-directory-shell .stores-directory-head-nav{
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:7px !important;
    width:var(--sadaa-store-hero-control-width) !important;
    margin:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-nav .stores-directory-nav-link{
    width:100% !important;
    min-width:0 !important;
    height:40px !important;
    min-height:40px !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell .stores-directory-head-tools{
    grid-column:2 !important;
    grid-row:2 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:7px !important;
    width:var(--sadaa-store-hero-control-width) !important;
    margin:0 !important;
  }

  html body .stores-directory-shell .stores-results-count{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:40px !important;
    min-height:40px !important;
    margin:0 !important;
    box-sizing:border-box !important;
    white-space:nowrap !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle button{
    width:100% !important;
    min-width:0 !important;
    height:40px !important;
    min-height:40px !important;
  }
}

/* =========================================================
   768 + 1024 Tablet
   الرئيسية > استكشف > القائمة/الشبكة
   بدون عدد النتائج
   ========================================================= */
@media (min-width:768px) and (max-width:1100px){
  html body .stores-directory-shell .stores-results-count{
    display:none !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) var(--sadaa-store-hero-control-width) !important;
    grid-template-rows:auto auto !important;
    column-gap:18px !important;
    row-gap:7px !important;
    align-items:start !important;
  }

  html body .stores-directory-shell .stores-directory-head-text{
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell .stores-directory-head-nav{
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:7px !important;
    width:var(--sadaa-store-hero-control-width) !important;
    margin:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-nav .stores-directory-nav-link{
    width:100% !important;
    min-width:0 !important;
    height:40px !important;
    min-height:40px !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell .stores-directory-head-tools{
    grid-column:2 !important;
    grid-row:2 !important;
    display:block !important;
    width:var(--sadaa-store-hero-control-width) !important;
    margin:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head .view-toggle button{
    width:100% !important;
    min-width:0 !important;
    height:40px !important;
    min-height:40px !important;
  }
}

/* 768: توسيع حقل نوع المتجر مع الحفاظ على صف واحد. */
@media (min-width:768px) and (max-width:900px){
  html body .stores-directory-shell
  .stores-directory-filter-disclosure .stores-filter-card{
    grid-template-columns:
      minmax(170px,1.35fr)
      minmax(108px,.82fr)
      minmax(145px,1.08fr)
      minmax(96px,.70fr)
      minmax(96px,.70fr)
      !important;
    gap:8px !important;
  }
}

/* =========================================================
   Mobile 320–425
   لا نتائج، الرئيسية + استكشف بجانب بعض
   ========================================================= */
@media (min-width:320px) and (max-width:425px){
  html body .stores-directory-shell .stores-results-count{
    display:none !important;
  }

  html body .stores-directory-shell .stores-directory-head-tools{
    display:none !important;
  }

  html body .stores-directory-shell .stores-directory-unified-head{
    display:block !important;
  }

  html body .stores-directory-shell .stores-directory-head-nav{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:7px !important;
    width:100% !important;
    max-width:none !important;
    margin:12px 0 0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-nav .stores-directory-nav-link{
    width:100% !important;
    min-width:0 !important;
    height:42px !important;
    min-height:42px !important;
    margin:0 !important;
    padding-inline:7px !important;
    box-sizing:border-box !important;
    white-space:nowrap !important;
  }
}

/* =========================================================
   Store Directory — Hero Actions Rebuild + List Alignment
   2026-10-02

   Wrapper واحد يمنع تشوه توزيع أدوات الهيرو بين المقاسات.
   ========================================================= */
:root{
  --stores-hero-control-h:40px;
  --stores-hero-action-w:138px;
  --stores-filter-text-size:12px;
}

/* ---------------------------------------------------------
   Shared filter typography
   --------------------------------------------------------- */
html body .stores-directory-shell
.stores-directory-filter-disclosure
:is(
  .sadaa-input,
  .sadaa-select,
  .stores-filter-submit,
  .stores-filter-reset
){
  font-size:var(--stores-filter-text-size) !important;
  line-height:1.35 !important;
}

html body .stores-directory-shell
.stores-directory-filter-disclosure
.sadaa-input::placeholder{
  font-size:var(--stores-filter-text-size) !important;
}

/* ---------------------------------------------------------
   Shared hero actions
   --------------------------------------------------------- */
html body .stores-directory-shell
.stores-directory-hero-actions{
  position:relative !important;
  z-index:2 !important;
  box-sizing:border-box !important;
}

html body .stores-directory-shell
.stores-directory-hero-actions
:is(.stores-directory-nav-link,.stores-results-count){
  height:var(--stores-hero-control-h) !important;
  min-height:var(--stores-hero-control-h) !important;
  box-sizing:border-box !important;
  margin:0 !important;
}

html body .stores-directory-shell
.stores-directory-hero-actions
.view-toggle{
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

html body .stores-directory-shell
.stores-directory-hero-actions
.view-toggle button{
  height:var(--stores-hero-control-h) !important;
  min-height:var(--stores-hero-control-h) !important;
  margin:0 !important;
  box-sizing:border-box !important;
}

/* =========================================================
   1440 + Desktop
   الرئيسية | النتائج
   استكشف   | القائمة/الشبكة
   ========================================================= */
@media (min-width:1101px){

  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:28px !important;
    min-height:170px !important;
    padding:24px 30px !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-text{
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-hero-actions{
    grid-column:2 !important;
    grid-row:1 !important;

    display:grid !important;
    grid-template-columns:var(--stores-hero-action-w) var(--stores-hero-action-w) !important;
    grid-template-rows:var(--stores-hero-control-h) var(--stores-hero-control-h) !important;
    gap:7px !important;

    width:auto !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell .stores-hero-home{
    grid-column:1 !important;
    grid-row:1 !important;
  }

  html body .stores-directory-shell .stores-hero-results{
    grid-column:2 !important;
    grid-row:1 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    padding-inline:8px !important;
    white-space:nowrap !important;
  }

  html body .stores-directory-shell .stores-hero-explore{
    grid-column:1 !important;
    grid-row:2 !important;
  }

  html body .stores-directory-shell .stores-hero-view-toggle{
    grid-column:2 !important;
    grid-row:2 !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-hero-view-toggle button{
    width:100% !important;
    min-width:0 !important;
  }
}

/* =========================================================
   Tablet 768–1100
   الرئيسية
   استكشف
   القائمة / الشبكة
   ========================================================= */
@media (min-width:768px) and (max-width:1100px){

  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) var(--stores-hero-action-w) !important;
    align-items:center !important;
    gap:18px !important;

    min-height:178px !important;
    padding:20px 22px !important;
  }

  html body .stores-directory-shell
  .stores-directory-head-text{
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
  }

  html body .stores-directory-shell
  .stores-directory-hero-actions{
    grid-column:2 !important;
    grid-row:1 !important;

    display:grid !important;
    grid-template-columns:var(--stores-hero-action-w) !important;
    grid-template-rows:
      var(--stores-hero-control-h)
      var(--stores-hero-control-h)
      var(--stores-hero-control-h)
      !important;
    gap:7px !important;

    width:var(--stores-hero-action-w) !important;
    min-width:0 !important;
    align-self:center !important;
  }

  html body .stores-directory-shell .stores-hero-home{
    grid-column:1 !important;
    grid-row:1 !important;
  }

  html body .stores-directory-shell .stores-hero-explore{
    grid-column:1 !important;
    grid-row:2 !important;
  }

  html body .stores-directory-shell .stores-hero-results{
    display:none !important;
  }

  html body .stores-directory-shell .stores-hero-view-toggle{
    grid-column:1 !important;
    grid-row:3 !important;

    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
    width:100% !important;
  }

  html body .stores-directory-shell
  .stores-hero-view-toggle button{
    width:100% !important;
    min-width:0 !important;
  }
}

/* =========================================================
   768 refinement
   ========================================================= */
@media (min-width:768px) and (max-width:900px){

  :root{
    --stores-hero-action-w:126px;
  }

  html body .stores-directory-shell
  .stores-directory-unified-head{
    gap:14px !important;
    padding:18px !important;
  }

  /* نوع المتجر يأخذ مساحة أكبر داخل صف الفلاتر. */
  html body .stores-directory-shell
  .stores-directory-filter-disclosure
  .stores-filter-card{
    grid-template-columns:
      minmax(165px,1.28fr)
      minmax(105px,.80fr)
      minmax(148px,1.05fr)
      minmax(94px,.68fr)
      minmax(94px,.68fr)
      !important;
  }
}

/* =========================================================
   Mobile 320–425
   الرئيسية + استكشف بجانب بعض
   ========================================================= */
@media (min-width:320px) and (max-width:425px){

  html body .stores-directory-shell
  .stores-directory-unified-head{
    display:block !important;
    min-height:0 !important;
    padding:18px 12px !important;
  }

  html body .stores-directory-shell
  .stores-directory-hero-actions{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:7px !important;

    width:100% !important;
    margin-top:12px !important;
  }

  html body .stores-directory-shell
  .stores-hero-home{
    grid-column:1 !important;
    grid-row:1 !important;
  }

  html body .stores-directory-shell
  .stores-hero-explore{
    grid-column:2 !important;
    grid-row:1 !important;
  }

  html body .stores-directory-shell
  :is(.stores-hero-results,.stores-hero-view-toggle){
    display:none !important;
  }

  html body .stores-directory-shell
  .stores-directory-hero-actions
  .stores-directory-nav-link{
    width:100% !important;
    min-width:0 !important;
    padding-inline:7px !important;
    white-space:nowrap !important;
  }
}

/* =========================================================
   List cards — unified logo / title / description alignment
   768px فأعلى

   نفس الإزاحة للمميز والعادي، مع فراغ آمن عن شارة التميز.
   ========================================================= */
@media (min-width:768px){

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-card{
    column-gap:22px !important;
    padding-inline-start:34px !important;
    box-sizing:border-box !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-logo{
    margin-inline:0 !important;
    transform:none !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-info{
    padding-inline-start:4px !important;
    transform:none !important;
  }
}

/* 1024: تخطيط متوازن للمميز والعادي. */
@media (min-width:901px) and (max-width:1100px){

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-card{
    grid-template-columns:92px minmax(0,1fr) minmax(190px,220px) !important;
    min-height:128px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-logo{
    width:82px !important;
    height:82px !important;
    min-width:82px !important;
  }
}

/* Desktop: regular + featured share the same visual axis. */
@media (min-width:1101px){

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-card{
    grid-template-columns:96px minmax(0,1fr) minmax(220px,250px) !important;
    min-height:132px !important;
    padding-inline-start:38px !important;
  }

  html body .stores-directory-shell
  .stores-content-panel
  .store-list.list-view
  .store-logo{
    width:84px !important;
    height:84px !important;
    min-width:84px !important;
  }
}


/* =========================================================
   Sadaa Brand System 2026 — Unified identity pass
   صدى المتاجر — طبقة الصقل الشامل

   الهدف:
   - لغة بصرية واحدة للواجهة العامة ولوحتي العضو والمدير.
   - الاعتماد على Tokens الحالية بدل إضافة ملف CSS مركزي جديد.
   - لا تغيّر منطق الصفحات أو بنية البيانات.
   ========================================================= */

html{
  accent-color:var(--sadaa-primary);
  -webkit-text-size-adjust:100%;
}

body{
  color:var(--sadaa-text,#211827);
  background:var(--sadaa-page-bg,#F8F6F9);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

::selection{
  color:#fff;
  background:rgba(var(--sadaa-primary-rgb),.78);
}

:where(a,button,input,select,textarea,summary,[role="button"],[tabindex]){
  -webkit-tap-highlight-color:transparent;
}

:where(a,button,input,select,textarea,summary,[role="button"]):focus-visible{
  outline:3px solid var(--sadaa-focus,rgba(var(--sadaa-primary-rgb),.18));
  outline-offset:2px;
}

/* ---------- Header / global navigation ---------- */
html body .main-header{
  background:var(--sadaa-header-bg,var(--sadaa-brand-gradient)) !important;
  border-bottom:1px solid rgba(255,255,255,.14) !important;
  box-shadow:0 1px 0 rgba(42,24,48,.05),0 8px 28px rgba(42,24,48,.08) !important;
}

.main-header .header-inner{
  width:min(var(--sadaa-container-max,1450px),calc(100% - 32px)) !important;
  margin-inline:auto !important;
  padding-inline:4px !important;
  gap:12px !important;
}

.main-header .logo-link{
  border-radius:var(--sadaa-radius-md,10px);
}

.main-header .btn-account,
.main-header .site-share-button,
.main-header .btn-store-directory,
.main-header .btn-add-ad{
  min-height:44px !important;
  border-radius:var(--sadaa-radius-md,10px) !important;
  font-weight:600 !important;
  box-shadow:none !important;
  transition:background-color var(--sadaa-transition-base),border-color var(--sadaa-transition-base),color var(--sadaa-transition-base),transform var(--sadaa-transition-base),box-shadow var(--sadaa-transition-base) !important;
}

.main-header .btn-account,
.main-header .site-share-button{
  background:rgba(255,255,255,.08) !important;
  border-color:rgba(255,255,255,.34) !important;
  color:#fff !important;
}

.main-header .btn-account:hover,
.main-header .btn-account:focus-visible,
.main-header .site-share-button:hover,
.main-header .site-share-button:focus-visible{
  background:rgba(255,255,255,.16) !important;
  border-color:rgba(255,255,255,.55) !important;
}

.main-header .btn-store-directory{
  background:rgba(43,24,50,.30) !important;
  border-color:rgba(255,255,255,.20) !important;
  color:#fff !important;
}

.main-header .btn-store-directory:hover,
.main-header .btn-store-directory:focus-visible{
  background:rgba(43,24,50,.44) !important;
  border-color:rgba(255,255,255,.34) !important;
  color:#fff !important;
}

.main-header .btn-add-ad{
  background:#fff !important;
  border:1px solid rgba(255,255,255,.92) !important;
  color:var(--sadaa-primary-dark) !important;
  padding-inline:18px !important;
}

.main-header .btn-add-ad:hover,
.main-header .btn-add-ad:focus-visible{
  background:#fff !important;
  border-color:#fff !important;
  color:var(--sadaa-primary) !important;
  transform:translateY(-1px);
  box-shadow:0 8px 22px rgba(42,24,48,.16) !important;
}

.main-header .dropdown-menu,
.main-header .site-share-menu{
  border:1px solid var(--sadaa-line,#E9E2EB) !important;
  border-radius:var(--sadaa-radius-card,16px) !important;
  background:rgba(255,255,255,.985) !important;
  box-shadow:var(--sadaa-shadow-lg) !important;
  overflow:hidden;
}

.main-header .dropdown-item,
.main-header .site-share-item{
  min-height:44px;
  border-radius:var(--sadaa-radius-md,10px) !important;
  margin:2px 6px;
  transition:background-color var(--sadaa-transition-fast),color var(--sadaa-transition-fast) !important;
}

/* ---------- Buttons ---------- */
.sadaa-btn{
  border-radius:var(--sadaa-radius-button,10px);
  font-weight:600;
  letter-spacing:0;
}

.sadaa-btn--primary,
.sadaa-btn.sadaa-btn--admin-primary{
  box-shadow:0 5px 14px rgba(var(--sadaa-primary-rgb),.16) !important;
}

.sadaa-btn--primary:hover:not(:disabled),
.sadaa-btn.sadaa-btn--admin-primary:hover:not(:disabled):not([aria-disabled="true"]){
  box-shadow:0 8px 20px rgba(var(--sadaa-primary-rgb),.20) !important;
  transform:translateY(-1px);
}

/* ---------- Forms ---------- */
.sadaa-input,
.sadaa-select,
.sadaa-textarea,
.sadaa-date-control__input,
:where(.auth-input,.form-control):not([type="checkbox"]):not([type="radio"]){
  border-radius:var(--sadaa-radius-field,10px) !important;
}

.sadaa-input,
.sadaa-select,
.sadaa-textarea,
.sadaa-date-control,
.auth-input{
  border-color:var(--sadaa-line,#E9E2EB) !important;
  background:var(--sadaa-surface,#fff) !important;
  box-shadow:inset 0 1px 0 rgba(33,24,39,.015);
}

.sadaa-input:hover,
.sadaa-select:hover,
.sadaa-textarea:hover,
.auth-input:hover{
  border-color:var(--sadaa-line-3,#CDB9D6) !important;
}

.sadaa-input:focus,
.sadaa-select:focus,
.sadaa-textarea:focus,
.auth-input:focus{
  border-color:var(--sadaa-primary) !important;
  box-shadow:var(--sadaa-shadow-focus) !important;
}

/* ---------- Shared disclosures / filters ---------- */
.sadaa-responsive-disclosure,
.sadaa-filter-panel,
.sadaa-search-panel{
  border:1px solid var(--sadaa-line,#E9E2EB) !important;
  border-radius:var(--sadaa-radius-card,16px) !important;
  background:var(--sadaa-surface,#fff) !important;
  box-shadow:var(--sadaa-shadow-xs) !important;
  overflow:hidden;
}

.sadaa-responsive-disclosure__summary{
  min-height:52px;
  background:var(--sadaa-tint-3,#FBF8FC) !important;
  border-bottom-color:var(--sadaa-line,#E9E2EB) !important;
}

.sadaa-responsive-disclosure__chevron{
  border-radius:var(--sadaa-radius-md,10px) !important;
  border-color:var(--sadaa-line-2,#E1D5E6) !important;
  background:#fff !important;
  color:var(--sadaa-primary) !important;
}

/* ---------- Admin + member workspace shell ---------- */
.dashboard-wrapper,
.dashboard-wrapper.member-dashboard-wrapper,
.member-dashboard-wrapper{
  gap:22px !important;
  color:var(--sadaa-admin-text,var(--sadaa-text,#302437));
}

.dashboard-wrapper .sidebar,
.member-dashboard-wrapper .sidebar{
  background:var(--sadaa-surface,#fff) !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:var(--sadaa-radius-panel,20px) !important;
  box-shadow:var(--sadaa-shadow-sm) !important;
  overflow:hidden;
}

.dashboard-sidebar-head,
.member-sidebar-head{
  background:var(--sadaa-admin-sidebar-head-bg,var(--sadaa-primary)) !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.dashboard-sidebar-nav,
.member-sidebar-nav{
  padding:10px !important;
}

.sadaa-nav-stack{
  gap:4px !important;
}

.sadaa-nav-item,
.dashboard-sidebar-nav button,
.member-sidebar-nav button{
  min-height:44px;
  border-radius:var(--sadaa-radius-md,10px) !important;
  border-color:transparent !important;
  color:var(--sadaa-admin-text,var(--sadaa-text-2,#4B3C50)) !important;
  background:transparent !important;
  transition:background-color var(--sadaa-transition-fast),color var(--sadaa-transition-fast),transform var(--sadaa-transition-fast) !important;
}

.sadaa-nav-item:hover,
.dashboard-sidebar-nav button:hover,
.member-sidebar-nav button:hover{
  background:var(--sadaa-admin-soft,var(--sadaa-tint,#F8F2FA)) !important;
  color:var(--sadaa-admin-dark,var(--sadaa-primary-dark)) !important;
}

.sadaa-nav-item.active,
.dashboard-sidebar-nav button.active,
.member-sidebar-nav button.active{
  color:var(--sadaa-admin-dark,var(--sadaa-primary-dark)) !important;
  background:rgba(var(--sadaa-admin-primary-rgb,var(--sadaa-primary-rgb)),.105) !important;
  box-shadow:inset -3px 0 0 var(--sadaa-admin-primary,var(--sadaa-primary));
}

.dashboard-wrapper .content-area,
.member-dashboard-wrapper .content-area{
  min-width:0;
}

/* ---------- Full-width dashboard app shell (desktop) ---------- */
@media (min-width:1101px){
  html body .dashboard-wrapper:not(.member-dashboard-wrapper){
    width:100% !important;
    max-width:none !important;
    min-height:calc(100dvh - var(--sadaa-header-height,70px));
    margin:0 !important;
    padding:0 !important;
    gap:0 !important;
    align-items:stretch !important;
    background:var(--sadaa-page-bg,#f8f6f9);
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) > .sidebar{
    width:272px !important;
    flex:0 0 272px !important;
    position:relative !important;
    align-self:stretch !important;
    top:auto !important;
    height:auto !important;
    max-height:none !important;
    min-height:100% !important;
    padding:0 12px 24px !important;
    overflow-x:hidden !important;
    overflow-y:visible !important;
    border:0 !important;
    border-inline-end:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) > .content-area{
    width:auto !important;
    max-width:none !important;
    min-height:calc(100dvh - var(--sadaa-header-height,70px));
    padding:24px clamp(18px,2.15vw,34px) 42px !important;
    background:var(--sadaa-page-bg,#f8f6f9) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper{
    width:100% !important;
    max-width:none !important;
    min-height:calc(100dvh - var(--sadaa-header-height,70px));
    margin:0 !important;
    padding:0 !important;
    gap:0 !important;
    align-items:stretch !important;
    background:var(--sadaa-page-bg,#f8f6f9);
  }

  html body .dashboard-wrapper.member-dashboard-wrapper > .member-sidebar-stack{
    width:272px !important;
    flex:0 0 272px !important;
    position:relative !important;
    align-self:stretch !important;
    top:auto !important;
    height:auto !important;
    max-height:none !important;
    min-height:100% !important;
    margin:0 !important;
    padding:0 12px 24px !important;
    gap:12px !important;
    overflow-x:hidden !important;
    overflow-y:visible !important;
    background:var(--sadaa-surface,#fff) !important;
    border:0 !important;
    border-inline-end:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper .member-sidebar-head{
    min-height:108px !important;
    margin:0 -12px !important;
    border-radius:0 !important;
    flex:0 0 auto !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper .sidebar{
    width:100% !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area{
    width:auto !important;
    max-width:none !important;
    min-height:calc(100dvh - var(--sadaa-header-height,70px));
    padding:24px clamp(18px,2.15vw,34px) 42px !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:var(--sadaa-page-bg,#f8f6f9) !important;
  }
}

/* Shared admin/member page heroes */
:where(
  .users-page-header,.orders-page-header,.orders-clean-header,
  .reports-page-header,.reports-clean-header,.finance-page-header,
  .newsletter-admin-hero,.site-presence-hero,.clean-page-header,
  .member-tab-page-header,.account-settings-page-header
){
  border-radius:var(--sadaa-radius-panel,20px) !important;
  box-shadow:0 12px 30px rgba(var(--sadaa-admin-primary-rgb,var(--sadaa-primary-rgb)),.12) !important;
  overflow:hidden;
}

/* Shared content surfaces */
:where(
  .users-cards-wrapper,.orders-cards-wrapper,.reports-cards-wrapper,
  .finance-card,.newsletter-admin-card,.site-presence-card,
  .account-settings-content-panel,.member-form-shell,
  .store-add-panel,.ad-submit-panel
){
  border-color:var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:var(--sadaa-radius-card,16px) !important;
  background:var(--sadaa-surface,#fff) !important;
  box-shadow:var(--sadaa-shadow-xs) !important;
}

/* Popovers, menus, cards */
.sadaa-popover,
.sadaa-menu,
.sadaa-modal__dialog{
  border-color:var(--sadaa-line,#E9E2EB) !important;
  border-radius:var(--sadaa-radius-card,16px) !important;
  box-shadow:var(--sadaa-shadow-lg) !important;
}

.sadaa-modal__dialog{
  overflow:hidden;
}

/* Authentication surfaces */
.auth-page{
  background:
    radial-gradient(circle at 8% 8%,rgba(var(--sadaa-accent-rgb),.07),transparent 28%),
    radial-gradient(circle at 92% 92%,rgba(var(--sadaa-primary-rgb),.08),transparent 30%),
    var(--sadaa-auth-bg,var(--sadaa-page-bg,#F8F6F9)) !important;
}

.auth-shell{
  border:1px solid var(--sadaa-line,#E9E2EB) !important;
  border-radius:24px !important;
  box-shadow:0 24px 70px rgba(var(--sadaa-shadow-rgb,42,24,48),.11) !important;
  overflow:hidden;
}

.auth-brand{
  background:var(--sadaa-auth-brand-surface,var(--sadaa-brand-gradient)) !important;
}

.auth-form-panel{
  background:#fff !important;
}

.auth-heading-icon{
  border-radius:var(--sadaa-radius-card,16px) !important;
}

.auth-submit{
  border-radius:var(--sadaa-radius-md,10px) !important;
  font-weight:700 !important;
}

/* Store directory cards */
.stores-directory-shell .store-card,
.stores-directory-shell .stores-filter-card,
.stores-directory-shell .stores-content-panel{
  border-color:var(--sadaa-line,#E9E2EB) !important;
  border-radius:var(--sadaa-radius-card,16px) !important;
}

.stores-directory-shell .store-card{
  box-shadow:var(--sadaa-shadow-xs) !important;
  transition:transform var(--sadaa-transition-base),box-shadow var(--sadaa-transition-base),border-color var(--sadaa-transition-base) !important;
}

.stores-directory-shell .store-card:hover{
  transform:translateY(-2px);
  border-color:var(--sadaa-line-2,#E1D5E6) !important;
  box-shadow:var(--sadaa-shadow-md) !important;
}

/* Compact interaction feedback, without the mobile tap flash. */
@media (hover:hover){
  :where(.sadaa-btn,.sadaa-nav-item,.dropdown-item,.site-share-item,.store-card){
    will-change:transform;
  }
}

@media (max-width:1100px){
  .main-header .header-inner{
    width:calc(100% - 20px) !important;
  }

  .dashboard-wrapper .sidebar,
  .member-dashboard-wrapper .sidebar{
    border-radius:0 !important;
    box-shadow:0 18px 54px rgba(31,22,36,.16) !important;
  }
}

@media (max-width:480px){
  .main-header .header-inner{
    width:calc(100% - 14px) !important;
  }

  .auth-shell{
    border-radius:18px !important;
  }
}

/* شعار صدى أحادي اللون: أبيض فوق أسطح العلامة الداكنة/المتدرجة. */
.main-header .logo-link img,
.auth-brand .auth-logo img{
  filter:brightness(0) invert(1);
}

/* Dashboard shell must meet the global footer with no visual gap on desktop. */
@media (min-width:1101px){
  html body > .dashboard-wrapper ~ .main-footer{
    margin-top:0 !important;
  }
}

/* Dashboard sidebar: keep the first navigation item 25px below the header on desktop. */
@media (min-width:1101px){
  html body .dashboard-wrapper:not(.member-dashboard-wrapper) .dashboard-sidebar-nav,
  html body .dashboard-wrapper.member-dashboard-wrapper .member-sidebar-nav{
    padding-top:25px !important;
  }
}


/* sadaa-member-fluid-workspace-v1-20261002
   لوحة العضو تستخدم كامل مساحة العمل مثل لوحة المدير على سطح المكتب. */
@media (min-width:1101px){
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area{
    flex:1 1 auto !important;
    width:calc(100% - 272px) !important;
    max-width:none !important;
    min-width:0 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent,
  html body .dashboard-wrapper.member-dashboard-wrapper .member-tab-panel{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent > .stats-page,
  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent > .member-records-page,
  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent > .member-stores-page,
  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent > .member-invoices-page,
  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent > .account-settings-tab-page{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin-inline:0 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent > .stats-page{
    margin-top:0 !important;
    margin-bottom:22px !important;
  }
}


/* =========================================================
   Dashboard visual polish — 2026-10-02
   - Workspace contrast for all admin/member tabs.
   - Moderator cards container modernized on desktop.
   - Member Ads fills the fluid workspace without inner max-width distortion.
   - Member Stores badges stay compact on all desktop widths.
   ========================================================= */
@media (min-width:1101px){
  /* Workspace: clearly distinct from white cards and pale table headers. */
  html body .dashboard-wrapper,
  html body .dashboard-wrapper:not(.member-dashboard-wrapper),
  html body .dashboard-wrapper.member-dashboard-wrapper,
  html body .dashboard-wrapper:not(.member-dashboard-wrapper) > .content-area,
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area{
    background:var(--sadaa-admin-workspace-bg,#F1EEF3) !important;
  }

  html body .dashboard-wrapper #tabContent{
    background:transparent !important;
  }

  /* -------------------------------------------------------
     المشرفون — حاوية البطاقات والبطاقات نفسها
     ------------------------------------------------------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab
  #moderatorsPermissionsForm > .sadaa-tablet-records-shell{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:14px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-radius:14px !important;
    background:var(--sadaa-surface-alt,#FDFBFD) !important;
    box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035) !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderators-grid{
    gap:12px !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderator-card{
    overflow:hidden !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-top:3px solid var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
    border-radius:12px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:0 2px 8px rgba(var(--sadaa-shadow-rgb,17,24,39),.045) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderator-card-head{
    padding:14px 16px !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderator-name{
    color:#fff !important;
    font-weight:700 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderator-meta{
    color:rgba(255,255,255,.86) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderator-meta i{
    color:var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
    opacity:.72 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderators-save-bar{
    position:static !important;
    margin-top:12px !important;
    padding:11px 13px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-radius:12px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.03) !important;
  }

  /* -------------------------------------------------------
     إدارة الإعلان / إعلاناتي — إزالة التضييق الداخلي القديم
     ------------------------------------------------------- */
  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page
  :is(
    .back-row,
    .ads-heading-inner,
    .member-tablet-tools,
    .member-tablet-tools-body,
    .member-records-filters,
    .member-records-form,
    .member-records-list
  ){
    width:100% !important;
    max-width:none !important;
    margin-inline:0 !important;
    box-sizing:border-box !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-tablet-tools{
    margin:0 0 14px !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-radius:12px !important;
    background:var(--sadaa-surface,#fff) !important;
    overflow:hidden !important;
    box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-tablet-tools-body{
    padding:12px 14px !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-records-filters{
    margin:0 !important;
    padding:0 !important;
    grid-template-columns:minmax(280px,1fr) 190px 175px auto !important;
    gap:9px !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-records-form{
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    overflow:visible !important;
    box-shadow:none !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-records-list{
    margin:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-radius:12px !important;
    background:var(--sadaa-surface,#fff) !important;
    overflow:hidden !important;
    box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-records-toolbar{
    min-height:50px !important;
    margin:0 !important;
    padding:8px 14px !important;
    display:flex !important;
    align-items:center !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-radius:0 !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-records-toolbar-inner{
    width:100% !important;
    padding:0 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-records-check-all{
    min-height:34px !important;
    padding:5px 2px !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    color:var(--sadaa-admin-text,var(--sadaa-text-2,#4B3C50)) !important;
    font-weight:500 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-records-bulk-delete-btn{
    width:34px !important;
    height:34px !important;
    border-radius:8px !important;
    background:var(--sadaa-surface-alt,#FDFBFD) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-record-head{
    min-height:47px !important;
    padding:11px 14px !important;
    background:var(--sadaa-tint-3,#FBF8FC) !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    color:var(--sadaa-admin-text,var(--sadaa-text-2,#4B3C50)) !important;
    font-weight:600 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-record-row{
    padding:12px 14px !important;
    background:var(--sadaa-surface,#fff) !important;
    border-bottom-color:var(--sadaa-line,#E9E2EB) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page .member-record-row:hover{
    background:var(--sadaa-tint-3,#FBF8FC) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-records-page
  :is(.member-records-search-input,.member-records-filter-select):focus{
    border-color:var(--sadaa-primary) !important;
    box-shadow:0 0 0 3px rgba(var(--sadaa-primary-rgb),.08) !important;
  }

  /* -------------------------------------------------------
     متاجري — الشارات أصغر على كل مقاسات سطح المكتب.
     ------------------------------------------------------- */
  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-stores-page .member-store-pill{
    min-height:22px !important;
    padding:2px 6px !important;
    gap:4px !important;
    border-radius:5px !important;
    font-size:11.5px !important;
    line-height:1.35 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper
  #tabContent .member-stores-page .member-store-pill i{
    font-size:10.5px !important;
  }
}


/* =========================================================
   Dashboard header — final source-of-truth overrides
   Loaded after header-style.php so generic header rules cannot restore
   the old share button or separator.
   ========================================================= */
@media (min-width:1101px){
  html body .main-header.sadaa-dashboard-header .header-inner,
  html body .main-header.sadaa-dashboard-header .header-section,
  html body .main-header.sadaa-dashboard-header .header-section.header-left,
  html body .main-header.sadaa-dashboard-header .header-section.header-right,
  html body .main-header.sadaa-dashboard-header .logo-container,
  html body .main-header.sadaa-dashboard-header .logo-link{
    border-inline-start:0 !important;
    border-inline-end:0 !important;
    border-left:0 !important;
    border-right:0 !important;
    outline:0 !important;
    box-shadow:none !important;
  }

  html body .main-header.sadaa-dashboard-header .header-section.header-left::before,
  html body .main-header.sadaa-dashboard-header .header-section.header-left::after,
  html body .main-header.sadaa-dashboard-header .header-section.header-right::before,
  html body .main-header.sadaa-dashboard-header .header-section.header-right::after{
    content:none !important;
    display:none !important;
  }

  html body .main-header.sadaa-dashboard-header .btn-add-ad,
  html body .main-header.sadaa-dashboard-header .btn-account{
    height:49px !important;
    min-height:49px !important;
  }

  html body .main-header.sadaa-dashboard-header .btn-add-ad{
    min-width:126px !important;
    padding:0 18px !important;
    margin:0 !important;
    border-radius:10px !important;
    line-height:1 !important;
  }

  html body .main-header.sadaa-dashboard-header .btn-account{
    min-width:128px !important;
    padding:0 18px !important;
    margin:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    line-height:1 !important;
  }

  html body .main-header.sadaa-dashboard-header .btn-account > p{
    margin:0 !important;
    padding:0 !important;
    height:auto !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    line-height:1 !important;
    transform:none !important;
  }

  html body .main-header.sadaa-dashboard-header .btn-account > .fa-caret-down{
    margin:0 !important;
    line-height:1 !important;
    align-self:center !important;
  }

  html body .main-header.sadaa-dashboard-header .site-share{
    width:24px !important;
    min-width:24px !important;
    height:24px !important;
    margin:0 2px !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body .main-header.sadaa-dashboard-header .site-share-button{
    width:24px !important;
    min-width:24px !important;
    height:24px !important;
    min-height:24px !important;
    margin:0 !important;
    padding:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:0 !important;
    border-radius:0 !important;
    outline:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#fff !important;
  }

  html body .main-header.sadaa-dashboard-header .site-share-button i{
    margin:0 !important;
    padding:0 !important;
    font-size:14px !important;
    line-height:1 !important;
  }

  html body .main-header.sadaa-dashboard-header .site-share-button:hover,
  html body .main-header.sadaa-dashboard-header .site-share-button:focus-visible,
  html body .main-header.sadaa-dashboard-header .site-share-button[aria-expanded="true"]{
    border:0 !important;
    outline:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:#fff !important;
    opacity:.78 !important;
    transform:none !important;
  }
}

/* =========================================================
   Member dashboard — remove the true outer workspace shell
   320px–1024px — 2026-10-03
   Keep the inner search/filter/cards/pagination surfaces intact.
   ========================================================= */
@media (min-width:320px) and (max-width:1024px){
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell{
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
}

/* =========================================================
   Dashboard sidebars — remove the inner vertical divider at 1024px
   901px–1024px only. Keep the outer card edges intact.
   ========================================================= */
@media (min-width:901px) and (max-width:1024px){
  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack .sidebar,
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  > .sidebar{
    border-inline-end:0 !important;
    border-left:0 !important;
  }
}

/* =========================================================
   Member dashboard — remove actual left divider on wide tablet
   901px–1024px only — 2026-10-03
   In RTL, border-inline-end on member-sidebar-stack renders on the left.
   ========================================================= */
@media (min-width:901px) and (max-width:1024px){
  html body .dashboard-wrapper.member-dashboard-wrapper
  > .member-sidebar-stack{
    border-inline-end:0 !important;
    border-left:0 !important;
  }
}

/* =========================================================
   Member dashboard — hard-stop outer visual shell on tablet/mobile
   320px–1024px. Structural wrappers stay, visual container disappears.
   ========================================================= */
@media (min-width:320px) and (max-width:1024px){
  html body .dashboard-wrapper.member-dashboard-wrapper,
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell,
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell > #tabContent,
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell > #tabContent > .member-tab-panel{
    background:transparent !important;
    background-image:none !important;
    border:0 !important;
    box-shadow:none !important;
    outline:0 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell{
    border-radius:0 !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell::before,
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell::after,
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell > #tabContent::before,
  html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell > #tabContent::after{
    display:none !important;
    content:none !important;
  }
}

/* =========================================================
   Member dashboard — remove outer visual shell on ALL screens
   2026-10-03
   Keep wrappers structurally for layout; remove only their visual surface.
   ========================================================= */
html body .dashboard-wrapper.member-dashboard-wrapper,
html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell,
html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell > #tabContent,
html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell > #tabContent > .member-tab-panel{
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  outline:0 !important;
}

html body .dashboard-wrapper.member-dashboard-wrapper::before,
html body .dashboard-wrapper.member-dashboard-wrapper::after,
html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell::before,
html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell::after,
html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell > #tabContent::before,
html body .dashboard-wrapper.member-dashboard-wrapper > .content-area.member-form-shell > #tabContent::after{
  display:none !important;
  content:none !important;
}

/* =========================================================
   Store Directory — group surfaces final cascade fix
   2026-10-04
   الغلاف العام شفاف، والمميزة والعادية فقط هما الحاويتان المرئيتان.
   ========================================================= */
html body .stores-directory-shell .store-content.stores-content-panel,
html body .stores-directory-shell .stores-content-panel {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body .stores-directory-shell .stores-content-panel #storeContainer,
html body .stores-directory-shell #storeContainer.store-list {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* الحاوية الأولى: المتاجر المميزة. */
html body .stores-directory-shell #storeContainer .stores-featured-zone {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin: 0 0 18px !important;
  padding: 14px !important;
  border: 1px solid rgba(var(--sadaa-primary-rgb), .22) !important;
  border-radius: var(--sadaa-radius-card, 16px) !important;
  background: rgba(var(--sadaa-primary-rgb), .035) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.72) !important;
}

/* الحاوية الثانية: المتاجر العادية — ظاهرة على جميع المقاسات بما فيها 1440+ والديسكتوب. */
html body .stores-directory-shell #storeContainer .stores-regular-grid {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 14px !important;
  border: 1px solid var(--sadaa-line, #e5e7eb) !important;
  border-radius: var(--sadaa-radius-card, 16px) !important;
  background: var(--sadaa-surface, #fff) !important;
  box-shadow: 0 6px 18px rgba(var(--sadaa-shadow-rgb), .035) !important;
}

@media (max-width:640px) {
  html body .stores-directory-shell #storeContainer .stores-featured-zone,
  html body .stores-directory-shell #storeContainer .stores-regular-grid {
    padding: 10px !important;
  }
}

/* =========================================================
   Admin Desktop — remove remaining outer list/table shells
   2026-10-04
   Scope: desktop/laptop app shell only (1101px+)
   Targets: reports, users, moderators, finance report.
   Keep the actual table/cards as the only visible surface.
   ========================================================= */
@media (min-width:1101px){
  /* البلاغات: إزالة الصندوق الخلفي الخارجي، والإبقاء على الجدول نفسه. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .reports-tab-ui .reports-table-shell{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .reports-tab-ui .reports-table-shell > .reports-list-card{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }

  /* المستخدمون: إزالة الغلاف الخلفي وترك .users-list كسطح الجدول الوحيد. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-list-wrap.sadaa-tablet-records-shell{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .users-tab-soft .users-list-wrap > .users-list{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    overflow:hidden !important;
  }

  /* المشرفون: بطاقات المشرفين مباشرة بدون سطح جماعي خلفها. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab > .moderators-panel.sadaa-admin-list-shell{
    display:contents !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab #moderatorsPermissionsForm{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab #moderatorsPermissionsForm > .sadaa-tablet-records-shell{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .moderators-tab .moderators-grid{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
  }

  /* تقرير الطلبات: إزالة بطاقة الغلاف، مع إبقاء رأس القائمة والجدول مستقلين. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-table-card.sadaa-admin-card{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 0 14px !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-table-card > .finance-card-head{
    width:100% !important;
    min-height:44px !important;
    margin:0 0 8px !important;
    padding:10px 14px !important;
    box-sizing:border-box !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-table-card > .finance-table-wrap.sadaa-tablet-records-shell{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    overflow:auto !important;
  }
}

/* =========================================================
   Admin Desktop Tables — unified geometry & border weight
   2026-10-04
   Scope: desktop/laptop app shell only (1101px+)
   ========================================================= */
@media (min-width:1101px){
  html body .dashboard-wrapper:not(.member-dashboard-wrapper){
    --sadaa-admin-table-head-height:48px;
    --sadaa-admin-table-row-height:58px;
    --sadaa-admin-table-cell-py:10px;
    --sadaa-admin-table-border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));
    --sadaa-admin-table-row-line:1px solid var(--sadaa-line-soft,#eef1f5);
  }

  /* Grid/div based admin tables — unified header height. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .orders-tab-ui .orders-grid-header,
    .reports-tab-ui .reports-row.header,
    .users-tab-soft .users-header,
    .directory-tab-soft .directory-header,
    .coupons-tab-ui .mc-header
  ){
    min-height:var(--sadaa-admin-table-head-height) !important;
    height:var(--sadaa-admin-table-head-height) !important;
    box-sizing:border-box !important;
    align-items:center !important;
    border-bottom:var(--sadaa-admin-table-border) !important;
  }

  /* Grid/div based admin tables — unified body row rhythm. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .orders-tab-ui .orders-grid-row,
    .reports-tab-ui .reports-row:not(.header),
    .users-tab-soft .users-row,
    .directory-tab-soft .directory-row,
    .coupons-tab-ui .mc-row
  ){
    min-height:var(--sadaa-admin-table-row-height) !important;
    box-sizing:border-box !important;
    align-items:center !important;
    border-bottom:var(--sadaa-admin-table-row-line) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .orders-tab-ui .orders-grid-cell,
    .reports-tab-ui .reports-cell,
    .users-tab-soft .users-cell,
    .directory-tab-soft .directory-cell,
    .coupons-tab-ui .mc-cell
  ){
    padding-top:var(--sadaa-admin-table-cell-py) !important;
    padding-bottom:var(--sadaa-admin-table-cell-py) !important;
    line-height:1.55 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .orders-tab-ui .orders-grid-row:last-child,
    .reports-tab-ui .reports-row:last-child,
    .users-tab-soft .users-row:last-child,
    .directory-tab-soft .directory-row:last-child,
    .coupons-tab-ui .mc-row:last-child
  ){
    border-bottom:0 !important;
  }

  /* Native tables — same header/row heights as grid tables. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .newsletter-admin .newsletter-table,
    .finance-tab .finance-orders-table,
    table.sadaa-data-table
  ) thead tr{
    height:var(--sadaa-admin-table-head-height) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .newsletter-admin .newsletter-table,
    .finance-tab .finance-orders-table,
    table.sadaa-data-table
  ) tbody tr{
    height:var(--sadaa-admin-table-row-height) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .newsletter-admin .newsletter-table,
    .finance-tab .finance-orders-table,
    table.sadaa-data-table
  ) :is(th,td){
    padding-top:var(--sadaa-admin-table-cell-py) !important;
    padding-bottom:var(--sadaa-admin-table-cell-py) !important;
    line-height:1.55 !important;
    vertical-align:middle !important;
    border-top:0 !important;
    border-inline:0 !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .newsletter-admin .newsletter-table,
    .finance-tab .finance-orders-table,
    table.sadaa-data-table
  ) th{
    border-bottom:var(--sadaa-admin-table-border) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .newsletter-admin .newsletter-table,
    .finance-tab .finance-orders-table,
    table.sadaa-data-table
  ) td{
    border-bottom:var(--sadaa-admin-table-row-line) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .newsletter-admin .newsletter-table,
    .finance-tab .finance-orders-table,
    table.sadaa-data-table
  ) tbody tr:last-child td{
    border-bottom:0 !important;
  }

  /* Finance report: one single 1px outer boundary, never a double/thick frame. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-table-card > .finance-table-wrap.sadaa-tablet-records-shell{
    border:var(--sadaa-admin-table-border) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
    outline:0 !important;
    padding:0 !important;
    overflow:auto !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper)
  #tabContent .finance-tab .finance-orders-table{
    width:100% !important;
    margin:0 !important;
    border:0 !important;
    outline:0 !important;
    box-shadow:none !important;
    border-collapse:collapse !important;
    border-spacing:0 !important;
    background:var(--sadaa-surface,#fff) !important;
  }
}


/* =========================================================
   Admin Tablet Hero Alignment — V2
   2026-10-04
   768px–1024px only
   - icon + title/description stay on one aligned row
   - actions/meta live on a second row aligned with the text column
   - special handling for Reports, Finance and Directory Settings
   ========================================================= */
@media (min-width:768px) and (max-width:1024px){
  /* Shared admin heroes whose root itself is the layout container. */
  html body #tabContent
  :is(
    .users-page-header.sadaa-page-header--admin,
    .directory-page-header.sadaa-page-header--admin,
    .moderators-page-header.sadaa-page-header--admin,
    .coupons-page-header.sadaa-page-header--admin,
    .offers-page-header.sadaa-page-header--admin,
    .settings-page-header.sadaa-page-header--admin
  ){
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    align-items:start !important;
    justify-items:stretch !important;
    gap:10px !important;
    min-height:124px !important;
    padding:16px 18px !important;
  }

  html body #tabContent
  :is(
    .users-page-header,
    .directory-page-header,
    .moderators-page-header,
    .coupons-page-header,
    .settings-page-header
  )
  :is(
    .users-page-title,
    .directory-page-title,
    .moderators-page-title,
    .coupons-page-title,
    .settings-page-title
  ),
  html body #tabContent .offers-page-header .offers-page-title{
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:36px minmax(0,1fr) !important;
    align-items:center !important;
    gap:10px !important;
    margin:0 !important;
    text-align:right !important;
  }

  html body #tabContent
  :is(
    .users-page-header,
    .directory-page-header,
    .moderators-page-header,
    .coupons-page-header,
    .offers-page-header,
    .settings-page-header
  )
  .sadaa-page-header__icon{
    width:36px !important;
    min-width:36px !important;
    height:36px !important;
    min-height:36px !important;
    flex-basis:36px !important;
    font-size:14px !important;
    align-self:center !important;
  }

  html body #tabContent
  :is(
    .users-page-header,
    .directory-page-header,
    .moderators-page-header,
    .coupons-page-header,
    .offers-page-header,
    .settings-page-header
  )
  .sadaa-page-header__content{
    min-width:0 !important;
    width:100% !important;
    text-align:right !important;
  }

  /* Keep all action groups compact and align them with the text column,
     not with the icon edge. */
  html body #tabContent
  :is(
    .users-page-header .users-page-actions,
    .directory-page-header .directory-page-actions,
    .moderators-page-header .moderators-page-actions,
    .coupons-page-header .coupons-page-actions,
    .settings-page-header .settings-page-actions
  ){
    grid-row:2 !important;
    width:100% !important;
    min-width:0 !important;
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    margin:0 !important;
    padding:0 46px 0 0 !important;
    align-self:start !important;
  }

  html body #tabContent
  :is(
    .users-page-header .users-page-actions,
    .directory-page-header .directory-page-actions,
    .moderators-page-header .moderators-page-actions,
    .coupons-page-header .coupons-page-actions,
    .settings-page-header .settings-page-actions
  ) > *{
    margin:0 !important;
    width:auto !important;
    min-width:0 !important;
  }

  /* Offers uses a direct meta chip instead of an actions wrapper. */
  html body #tabContent .offers-page-header .offers-page-meta{
    grid-row:2 !important;
    justify-self:start !important;
    align-self:start !important;
    width:max-content !important;
    max-width:calc(100% - 46px) !important;
    margin:0 46px 0 0 !important;
  }

  /* Reports markup has icon/content as direct hero children. */
  html body #tabContent .reports-tab-ui .reports-clean-header.sadaa-page-header--admin{
    display:grid !important;
    grid-template-columns:36px minmax(0,1fr) !important;
    grid-template-rows:auto !important;
    align-items:center !important;
    gap:10px !important;
    min-height:106px !important;
    padding:16px 18px !important;
    text-align:right !important;
  }

  html body #tabContent .reports-tab-ui .reports-clean-header .reports-header-icon{
    grid-column:1 !important;
    grid-row:1 !important;
    width:36px !important;
    min-width:36px !important;
    height:36px !important;
    min-height:36px !important;
    margin:0 !important;
    align-self:center !important;
  }

  html body #tabContent .reports-tab-ui .reports-clean-header .reports-header-content{
    grid-column:2 !important;
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    text-align:right !important;
  }

  /* Finance / Order Report has a real inner wrapper. */
  html body #tabContent .finance-tab .finance-head.sadaa-page-header--admin{
    display:block !important;
    min-height:124px !important;
    padding:16px 18px !important;
  }

  html body #tabContent .finance-tab .finance-head > .sadaa-page-header__inner{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    align-items:start !important;
    gap:10px !important;
  }

  html body #tabContent .finance-tab .finance-head .finance-head-main{
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:36px minmax(0,1fr) !important;
    align-items:center !important;
    gap:10px !important;
    margin:0 !important;
  }

  html body #tabContent .finance-tab .finance-head .sadaa-page-header__icon{
    width:36px !important;
    min-width:36px !important;
    height:36px !important;
    min-height:36px !important;
    flex-basis:36px !important;
    font-size:14px !important;
  }

  html body #tabContent .finance-tab .finance-head .sadaa-page-header__actions{
    grid-row:2 !important;
    width:100% !important;
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    margin:0 !important;
    padding:0 46px 0 0 !important;
  }

  html body #tabContent .finance-tab .finance-head .finance-head-meta{
    width:max-content !important;
    max-width:100% !important;
    margin:0 !important;
    align-self:auto !important;
  }

  /* Store Directory settings is loaded as a nested async view and has
     its own hero markup. Keep it on the same tablet rhythm. */
  html body #tabContent .directory-settings-tab .directory-settings-hero{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    align-items:start !important;
    gap:10px !important;
    min-height:124px !important;
    padding:16px 18px !important;
  }

  html body #tabContent .directory-settings-tab .directory-settings-title{
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:36px minmax(0,1fr) !important;
    align-items:center !important;
    gap:10px !important;
    margin:0 !important;
    text-align:right !important;
  }

  html body #tabContent .directory-settings-tab .directory-settings-icon{
    width:36px !important;
    min-width:36px !important;
    height:36px !important;
    min-height:36px !important;
  }

  html body #tabContent .directory-settings-tab .directory-settings-back{
    grid-row:2 !important;
    justify-self:start !important;
    align-self:start !important;
    width:auto !important;
    min-width:160px !important;
    margin:0 46px 0 0 !important;
  }
}

/* Moderators cards — all screens */
html body #tabContent .moderators-tab .moderator-card,
html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent .moderators-tab .moderator-card{
  border-top:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
}

html body #tabContent .moderators-tab .moderator-card-head,
html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent .moderators-tab .moderator-card-head{
  background:var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
  border-bottom:1px solid rgba(70,58,78,.16) !important;
}

html body #tabContent .moderators-tab .moderator-name,
html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent .moderators-tab .moderator-name{
  color:#fff !important;
}

html body #tabContent .moderators-tab .moderator-meta,
html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent .moderators-tab .moderator-meta{
  color:rgba(255,255,255,.86) !important;
}

html body #tabContent .moderators-tab .moderator-meta i,
html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent .moderators-tab .moderator-meta i{
  color:var(--sadaa-admin-primary,var(--sadaa-primary)) !important;
  opacity:.82 !important;
}

html body #tabContent .moderators-tab .moderator-permissions-window,
html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent .moderators-tab .moderator-permissions-window{
  border-top:0 !important;
}

html body #tabContent .moderators-tab .moderator-permissions-window > .sadaa-accordion__summary,
html body #tabContent .moderators-tab .moderator-permissions-window > .moderator-permissions-window-summary,
html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent .moderators-tab .moderator-permissions-window > .sadaa-accordion__summary,
html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent .moderators-tab .moderator-permissions-window > .moderator-permissions-window-summary{
  border-top:0 !important;
  box-shadow:none !important;
}

/* =========================================================
   Dashboard Cards Typography — unified non-desktop scale
   2026-10-04
   Scope: Admin + Member dashboards, <= 1600px.
   Card/record body text + badges/statuses = 13px.
   Page/hero headings and large KPI values intentionally keep
   their existing hierarchy.
   ========================================================= */
:root{
  --sadaa-dashboard-card-text-size:13px;
}

@media (max-width:1600px){
  /* ---------- Admin record/card body text ---------- */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .sadaa-admin-record-card,
    .orders-grid-row,
    .users-row,
    .reports-row,
    .mc-row,
    .finance-order-row,
    .directory-store-card,
    .newsletter-card,
    .moderator-card,
    .offers-table tbody tr
  ){
    font-size:var(--sadaa-dashboard-card-text-size) !important;
  }

  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .orders-grid-cell,
    .users-cell,
    .user-name-text,
    .reports-cell,
    .report-ad-id,
    .report-ad-meta,
    .report-date span,
    .mc-cell,
    .coupon-code-cell,
    .coupon-id-pill,
    .finance-orders-table td,
    .finance-order-main strong,
    .finance-order-main span,
    .finance-date-stack strong,
    .finance-date-stack span,
    .directory-cell,
    .directory-store-name,
    .directory-owner-email,
    .directory-category,
    .newsletter-table td,
    .offers-title-name,
    .moderator-name,
    .moderator-meta,
    .permission-item
  ){
    font-size:var(--sadaa-dashboard-card-text-size) !important;
  }

  /* Labels generated inside card/tablet-card cells follow the same scale. */
  html body .dashboard-wrapper:not(.member-dashboard-wrapper) #tabContent
  :is(
    .orders-grid-cell,
    .users-cell,
    .reports-cell,
    .mc-cell,
    .finance-orders-table td,
    .directory-cell,
    .newsletter-table td,
    .offers-table td
  )::before{
    font-size:var(--sadaa-dashboard-card-text-size) !important;
  }

  /* ---------- Member record/card body text ---------- */
  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent
  :is(
    .member-record-row,
    .member-store-card,
    .member-stores-summary-card,
    .invoices-table tbody tr,
    .invoice-stat-card
  ){
    font-size:var(--sadaa-dashboard-card-text-size) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent
  :is(
    .member-record-cell,
    .member-record-id,
    .member-record-status-stack,
    .member-store-card-head,
    .member-store-card-footer,
    .member-store-feature-state,
    .member-store-pill,
    .invoice-no-cell,
    .invoice-amount-cell,
    .invoice-type-cell,
    .invoice-details-cell,
    .invoice-date-cell,
    .invoice-no,
    .invoice-amount,
    .invoice-type-pill,
    .invoice-dims-pill,
    .invoice-date
  ){
    font-size:var(--sadaa-dashboard-card-text-size) !important;
  }

  html body .dashboard-wrapper.member-dashboard-wrapper #tabContent
  :is(
    .member-record-cell,
    .invoice-no-cell,
    .invoice-amount-cell,
    .invoice-type-cell,
    .invoice-details-cell,
    .invoice-date-cell
  )::before{
    font-size:var(--sadaa-dashboard-card-text-size) !important;
  }

  /* ---------- Shared dashboard badges / statuses ---------- */
  html body .dashboard-wrapper #tabContent
  :is(
    .sadaa-status,
    .sadaa-status--compact,
    .sadaa-status--refund-failed,
    .status-badge,
    .status-pill,
    .order-status,
    .orders-status,
    .report-badge,
    .role-badge,
    .directory-status,
    .offers-status,
    .coupon-status,
    .coupon-status-chip,
    .member-store-pill,
    .invoice-type-pill,
    .invoice-dims-pill,
    .sadaa-badge,
    .sadaa-badge--brand,
    .sadaa-badge--danger,
    .sadaa-badge--info,
    .sadaa-badge--neutral,
    .sadaa-badge--success,
    .sadaa-badge--warning
  ){
    font-size:var(--sadaa-dashboard-card-text-size) !important;
    line-height:1.35 !important;
  }

  /* Metric cards: labels/notes follow 13px; large KPI values stay unchanged. */
  html body .dashboard-wrapper #tabContent
  :is(
    .sadaa-metric-card__label,
    .sadaa-metric-card__note,
    .finance-summary-label,
    .newsletter-stat-label
  ){
    font-size:var(--sadaa-dashboard-card-text-size) !important;
  }
}

/* =========================================================
   Dashboard Hero Layering — consolidated source of truth
   2026-10-04

   Layer order on every admin/member dashboard hero:
   0) hero background
   1) decorative ::before / ::after
   2) real hero content
   3) icon tile and its glyph

   Local tab files must not redefine this stacking order.
   ========================================================= */
html body :is(
  .sadaa-page-header,
  .users-page-header,
  .orders-page-header,
  .orders-clean-header,
  .reports-page-header,
  .reports-clean-header,
  .finance-page-header,
  .finance-head,
  .newsletter-admin-hero,
  .site-presence-hero,
  .clean-page-header,
  .directory-page-header,
  .moderators-page-header,
  .coupons-page-header,
  .offers-page-header,
  .settings-page-header,
  .member-tab-page-header,
  .account-settings-page-header,
  .invoices-page-header,
  .member-records-page-header,
  .stats-hero
){
  position:relative !important;
  isolation:isolate !important;
  z-index:0 !important;
  overflow:hidden !important;
}

html body :is(
  .sadaa-page-header,
  .users-page-header,
  .orders-page-header,
  .orders-clean-header,
  .reports-page-header,
  .reports-clean-header,
  .finance-page-header,
  .finance-head,
  .newsletter-admin-hero,
  .site-presence-hero,
  .clean-page-header,
  .directory-page-header,
  .moderators-page-header,
  .coupons-page-header,
  .offers-page-header,
  .settings-page-header,
  .member-tab-page-header,
  .account-settings-page-header,
  .invoices-page-header,
  .member-records-page-header,
  .stats-hero
)::before,
html body :is(
  .sadaa-page-header,
  .users-page-header,
  .orders-page-header,
  .orders-clean-header,
  .reports-page-header,
  .reports-clean-header,
  .finance-page-header,
  .finance-head,
  .newsletter-admin-hero,
  .site-presence-hero,
  .clean-page-header,
  .directory-page-header,
  .moderators-page-header,
  .coupons-page-header,
  .offers-page-header,
  .settings-page-header,
  .member-tab-page-header,
  .account-settings-page-header,
  .invoices-page-header,
  .member-records-page-header,
  .stats-hero
)::after{
  z-index:-1 !important;
  pointer-events:none !important;
}

html body :is(
  .sadaa-page-header,
  .users-page-header,
  .orders-page-header,
  .orders-clean-header,
  .reports-page-header,
  .reports-clean-header,
  .finance-page-header,
  .finance-head,
  .newsletter-admin-hero,
  .site-presence-hero,
  .clean-page-header,
  .directory-page-header,
  .moderators-page-header,
  .coupons-page-header,
  .offers-page-header,
  .settings-page-header,
  .member-tab-page-header,
  .account-settings-page-header,
  .invoices-page-header,
  .member-records-page-header,
  .stats-hero
) > *{
  position:relative !important;
  z-index:1 !important;
}

/* Shared/nested content structures also remain above ornaments. */
html body :is(
  .sadaa-page-header__inner,
  .sadaa-page-header__main,
  .sadaa-page-header__content,
  .sadaa-page-header__actions,
  .sadaa-page-header__meta,
  .users-page-title,
  .orders-header-content,
  .reports-header-content,
  .directory-page-title,
  .moderators-page-title,
  .coupons-page-title,
  .offers-page-title,
  .settings-page-title,
  .site-presence-hero-main,
  .site-presence-hero-meta,
  .newsletter-admin-hero-content,
  .member-records-page-title,
  .member-records-page-actions,
  .stats-hero-content,
  .account-settings-page-title,
  .account-settings-page-meta
){
  position:relative !important;
  z-index:2 !important;
}

/* Opaque icon tile: same visual family as the old translucent tile,
   but decorative circles can no longer show through it. */
html body :is(
  .sadaa-page-header,
  .users-page-header,
  .orders-page-header,
  .orders-clean-header,
  .reports-page-header,
  .reports-clean-header,
  .finance-page-header,
  .finance-head,
  .newsletter-admin-hero,
  .site-presence-hero,
  .clean-page-header,
  .directory-page-header,
  .moderators-page-header,
  .coupons-page-header,
  .offers-page-header,
  .settings-page-header,
  .member-tab-page-header,
  .account-settings-page-header,
  .invoices-page-header,
  .member-records-page-header,
  .stats-hero
) :is(
  .sadaa-page-header__icon,
  .users-page-icon,
  .orders-header-icon,
  .reports-header-icon,
  .finance-head-icon,
  .newsletter-admin-icon,
  .site-presence-hero-icon,
  .directory-page-icon,
  .moderators-page-icon,
  .coupons-page-icon,
  .offers-page-icon,
  .settings-page-icon,
  .member-records-page-icon,
  .invoices-page-icon,
  .member-stores-head-icon,
  .stats-hero-icon,
  .account-settings-page-icon
){
  position:relative !important;
  z-index:3 !important;
  isolation:isolate !important;
  opacity:1 !important;
  background:var(--sadaa-primary,#493059) !important;
  background:color-mix(in srgb,var(--sadaa-primary,#493059) 86%,white 14%) !important;
  border-color:rgba(255,255,255,.28) !important;
  box-shadow:none !important;
  background-clip:padding-box !important;
}

html body :is(
  .sadaa-page-header__icon,
  .users-page-icon,
  .orders-header-icon,
  .reports-header-icon,
  .finance-head-icon,
  .newsletter-admin-icon,
  .site-presence-hero-icon,
  .directory-page-icon,
  .moderators-page-icon,
  .coupons-page-icon,
  .offers-page-icon,
  .settings-page-icon,
  .member-records-page-icon,
  .invoices-page-icon,
  .member-stores-head-icon,
  .stats-hero-icon,
  .account-settings-page-icon
)::before,
html body :is(
  .sadaa-page-header__icon,
  .users-page-icon,
  .orders-header-icon,
  .reports-header-icon,
  .finance-head-icon,
  .newsletter-admin-icon,
  .site-presence-hero-icon,
  .directory-page-icon,
  .moderators-page-icon,
  .coupons-page-icon,
  .offers-page-icon,
  .settings-page-icon,
  .member-records-page-icon,
  .invoices-page-icon,
  .member-stores-head-icon,
  .stats-hero-icon,
  .account-settings-page-icon
)::after{
  content:none !important;
  display:none !important;
}

html body :is(
  .sadaa-page-header__icon,
  .users-page-icon,
  .orders-header-icon,
  .reports-header-icon,
  .finance-head-icon,
  .newsletter-admin-icon,
  .site-presence-hero-icon,
  .directory-page-icon,
  .moderators-page-icon,
  .coupons-page-icon,
  .offers-page-icon,
  .settings-page-icon,
  .member-records-page-icon,
  .invoices-page-icon,
  .member-stores-head-icon,
  .stats-hero-icon,
  .account-settings-page-icon
) > *{
  position:relative !important;
  z-index:1 !important;
}

/* =========================================================
   Hero ornaments / icon stacking — ROOT FIX 2026-10-04
   Single source of truth after visual red diagnostic.
   ========================================================= */
html body #tabContent :is(
  .sadaa-page-header,
  .users-page-header,.orders-page-header,.orders-clean-header,
  .reports-page-header,.reports-clean-header,.finance-page-header,.finance-head,
  .newsletter-admin-hero,.site-presence-hero,.clean-page-header,
  .directory-page-header,.moderators-page-header,.coupons-page-header,
  .offers-page-header,.settings-page-header,.member-tab-page-header,
  .account-settings-page-header,.invoices-page-header,
  .member-records-page-header,.stats-hero
){
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
}

html body #tabContent :is(
  .sadaa-page-header,
  .users-page-header,.orders-page-header,.orders-clean-header,
  .reports-page-header,.reports-clean-header,.finance-page-header,.finance-head,
  .newsletter-admin-hero,.site-presence-hero,.clean-page-header,
  .directory-page-header,.moderators-page-header,.coupons-page-header,
  .offers-page-header,.settings-page-header,.member-tab-page-header,
  .account-settings-page-header,.invoices-page-header,
  .member-records-page-header,.stats-hero
)::before,
html body #tabContent :is(
  .sadaa-page-header,
  .users-page-header,.orders-page-header,.orders-clean-header,
  .reports-page-header,.reports-clean-header,.finance-page-header,.finance-head,
  .newsletter-admin-hero,.site-presence-hero,.clean-page-header,
  .directory-page-header,.moderators-page-header,.coupons-page-header,
  .offers-page-header,.settings-page-header,.member-tab-page-header,
  .account-settings-page-header,.invoices-page-header,
  .member-records-page-header,.stats-hero
)::after{
  z-index:0 !important;
  pointer-events:none !important;
}

html body #tabContent :is(
  .sadaa-page-header,
  .users-page-header,.orders-page-header,.orders-clean-header,
  .reports-page-header,.reports-clean-header,.finance-page-header,.finance-head,
  .newsletter-admin-hero,.site-presence-hero,.clean-page-header,
  .directory-page-header,.moderators-page-header,.coupons-page-header,
  .offers-page-header,.settings-page-header,.member-tab-page-header,
  .account-settings-page-header,.invoices-page-header,
  .member-records-page-header,.stats-hero
) > *{
  position:relative !important;
  z-index:2 !important;
}

html body #tabContent :is(
  .sadaa-page-header,
  .users-page-header,.orders-page-header,.orders-clean-header,
  .reports-page-header,.reports-clean-header,.finance-page-header,.finance-head,
  .newsletter-admin-hero,.site-presence-hero,.clean-page-header,
  .directory-page-header,.moderators-page-header,.coupons-page-header,
  .offers-page-header,.settings-page-header,.member-tab-page-header,
  .account-settings-page-header,.invoices-page-header,
  .member-records-page-header,.stats-hero
) :is(
  .sadaa-page-header__icon,
  .users-page-icon,.orders-header-icon,.reports-header-icon,.finance-head-icon,
  .newsletter-admin-icon,.site-presence-hero-icon,.directory-page-icon,
  .moderators-page-icon,.coupons-page-icon,.offers-page-icon,.settings-page-icon,
  .member-records-page-icon,.invoices-page-icon,.member-stores-head-icon,
  .stats-hero-icon,.account-settings-page-icon
){
  position:relative !important;
  z-index:4 !important;
  isolation:isolate !important;
  opacity:1 !important;
  /* opaque equivalent of the former white .18 overlay on the classic purple */
  background:#6a5577 !important;
  background:color-mix(in srgb,var(--sadaa-primary,#493059) 82%,white 18%) !important;
  border-color:rgba(255,255,255,.28) !important;
  box-shadow:none !important;
}

html body #tabContent :is(
  .sadaa-page-header__icon,
  .users-page-icon,.orders-header-icon,.reports-header-icon,.finance-head-icon,
  .newsletter-admin-icon,.site-presence-hero-icon,.directory-page-icon,
  .moderators-page-icon,.coupons-page-icon,.offers-page-icon,.settings-page-icon,
  .member-records-page-icon,.invoices-page-icon,.member-stores-head-icon,
  .stats-hero-icon,.account-settings-page-icon
)::before,
html body #tabContent :is(
  .sadaa-page-header__icon,
  .users-page-icon,.orders-header-icon,.reports-header-icon,.finance-head-icon,
  .newsletter-admin-icon,.site-presence-hero-icon,.directory-page-icon,
  .moderators-page-icon,.coupons-page-icon,.offers-page-icon,.settings-page-icon,
  .member-records-page-icon,.invoices-page-icon,.member-stores-head-icon,
  .stats-hero-icon,.account-settings-page-icon
)::after{
  content:none !important;
  display:none !important;
}

html body #tabContent :is(
  .sadaa-page-header__icon,
  .users-page-icon,.orders-header-icon,.reports-header-icon,.finance-head-icon,
  .newsletter-admin-icon,.site-presence-hero-icon,.directory-page-icon,
  .moderators-page-icon,.coupons-page-icon,.offers-page-icon,.settings-page-icon,
  .member-records-page-icon,.invoices-page-icon,.member-stores-head-icon,
  .stats-hero-icon,.account-settings-page-icon
) > *{
  position:relative !important;
  z-index:1 !important;
}

/* =========================================================
   Header account menu — alignment & spacing correction
   2026-10-05
   Resolves the generic dropdown-item margins colliding with
   the premium account menu's 100% row width.
   ========================================================= */
html body .main-header #advertiserDropdown.dropdown-menu{
  box-sizing:border-box !important;
  padding:8px !important;
  overflow:visible !important;
}

html body .main-header #advertiserDropdown .dropdown-item{
  width:100% !important;
  max-width:100% !important;
  min-height:46px !important;
  margin:0 !important;
  padding:7px 9px !important;
  gap:10px !important;
  box-sizing:border-box !important;
  align-items:center !important;
  justify-content:flex-start !important;
}

html body .main-header #advertiserDropdown .dropdown-item > i{
  flex:0 0 32px !important;
  width:32px !important;
  min-width:32px !important;
  height:32px !important;
  margin:0 !important;
  padding:0 !important;
  align-self:center !important;
}

html body .main-header #advertiserDropdown .dropdown-item > span{
  flex:1 1 auto !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  text-align:right !important;
  line-height:1.6 !important;
}

/* Desktop/tablet: center the menu under the Account button and
   keep the pointer on the same visual axis. */
@media (min-width:769px){
  html body .main-header .dropdown:has(> #accountMenuButton){
    position:relative !important;
  }

  html body .main-header #advertiserDropdown.dropdown-menu{
    left:50% !important;
    right:auto !important;
    margin:0 !important;
    transform:translateX(-50%) !important;
  }

  html body .main-header #advertiserDropdown.dropdown-menu::after{
    left:50% !important;
    right:auto !important;
    margin-left:-6px !important;
  }
}

/* Mobile keeps the existing inward-safe positioning, while rows
   retain the same clean spacing/alignment. */
@media (max-width:768px){
  html body .main-header #advertiserDropdown.dropdown-menu{
    left:0 !important;
    right:auto !important;
    transform:none !important;
    padding:8px !important;
  }

  html body .main-header #advertiserDropdown .dropdown-item{
    min-height:45px !important;
    padding:6px 8px !important;
    gap:9px !important;
  }

  html body .main-header #advertiserDropdown .dropdown-item > i{
    flex-basis:31px !important;
    width:31px !important;
    min-width:31px !important;
    height:31px !important;
  }
}

/* =========================================================
   SETTINGS — Unified Admin/Member Component Adapter v13
   2026-10-07

   القاعدة: لا هوية مستقلة لإعدادات الموقع.
   تستخدم الصفحة نفس مكونات لوحة المدير/العضو، وما يلي فقط
   يضبط توزيع العناصر الخاصة بوظيفة الإعدادات.
   ========================================================= */
html body #tabContent .settings-tab-ui{
  width:100%;
  min-width:0;
  color:var(--sadaa-admin-text,var(--sadaa-text,#111827));
}

/* Hero: sadaa-page-header--admin هو المرجع المركزي الوحيد. */
html body #tabContent .settings-tab-ui .settings-page-header{
  margin-bottom:14px!important;
}
@media (min-width:1200px){
  html body #tabContent .settings-tab-ui .settings-page-header .sadaa-page-header__main,
  html body #tabContent .settings-tab-ui .settings-page-header .sadaa-page-header__content{
    width:100%!important;
    max-width:none!important;
  }
  html body #tabContent .settings-tab-ui .settings-page-header .sadaa-page-header__description{
    max-width:none!important;
    white-space:nowrap!important;
  }
}

/* التبويبات الداخلية: نفس sadaa-tabs مع كثافة مناسبة لعددها الكبير. */
html body #tabContent .settings-tab-ui .settings-nav-card.sadaa-card{
  margin:0 0 14px;
  padding:8px;
  border-radius:var(--sadaa-radius-md,8px);
  background:var(--sadaa-surface,#fff);
}
html body #tabContent .settings-tab-ui .settings-subnav.sadaa-tabs{
  grid-template-columns:repeat(auto-fit,minmax(104px,1fr));
  gap:6px;
}
html body #tabContent .settings-tab-ui .settings-subnav .sadaa-tab{
  min-height:36px;
  padding:7px 9px;
  font-size:13px;
}
html body #tabContent .settings-tab-ui .settings-content-card{
  min-width:0;
}
html body #tabContent .settings-tab-ui .settings-readonly-note{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 14px;
  padding:10px 12px;
  border:1px solid #ead9a5;
  border-radius:var(--sadaa-radius-md,8px);
  background:#fff9e8;
  color:#705b1b;
  font-size:13px;
  line-height:1.7;
}
html body #tabContent .settings-tab-ui[data-readonly="1"] .settings-content-card form{
  pointer-events:none;
  opacity:.72;
}

/* Controls: نفس أبعاد وFocus نظام النماذج المركزي. */
html body #tabContent .settings-tab-ui :is(
  input[type="text"],input[type="number"],input[type="email"],input[type="url"],input[type="password"],select,textarea
){
  width:100%;
  min-width:0;
  min-height:42px;
  box-sizing:border-box;
  padding:8px 11px;
  border:1px solid var(--sadaa-line,#e5e7eb);
  border-radius:var(--sadaa-radius-field,8px);
  background:var(--sadaa-surface,#fff);
  color:var(--sadaa-text,#111827);
  font:inherit;
  font-size:var(--sadaa-font-size-md,14px);
  outline:none;
}
html body #tabContent .settings-tab-ui textarea{min-height:88px;resize:vertical}
html body #tabContent .settings-tab-ui :is(input,select,textarea):focus{
  border-color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
  box-shadow:0 0 0 3px var(--sadaa-focus,rgba(var(--sadaa-primary-rgb),.12));
}
html body #tabContent .settings-tab-ui input[type="checkbox"]{
  accent-color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
}
html body #tabContent .settings-tab-ui :is(.settings-field,.trial-ads-settings-field,.store-feature-pricing-card__field) > label,
html body #tabContent .settings-tab-ui .payment-ad-control label{
  display:block;
  margin:0 0 6px;
  color:var(--sadaa-text,#111827);
  font-size:13px;
  font-weight:500;
  line-height:1.6;
}
html body #tabContent .settings-tab-ui :is(.settings-help-text,small,.home-hero-font-setting__note){
  color:var(--sadaa-muted,#6b7280);
  font-size:12px;
  line-height:1.7;
}

/* الحقول: عنوان أوضح وخط أساس موحد للصفوف الثنائية. */
html body #tabContent .settings-tab-ui :is(.settings-field,.trial-ads-settings-field,.store-feature-pricing-card__field) > label,
html body #tabContent .settings-tab-ui .payment-ad-control label{
  font-size:14px;
  font-weight:600;
}
html body #tabContent .settings-tab-ui .settings-form-grid--2{align-items:start}
html body #tabContent .settings-tab-ui .settings-form-grid--2 > .settings-field:not(.settings-field--full){
  display:grid;
  grid-template-rows:minmax(24px,auto) 42px auto;
  align-content:start;
  row-gap:6px;
}
html body #tabContent .settings-tab-ui .settings-form-grid--2 > .settings-field:not(.settings-field--full) > label{margin:0;align-self:end}
html body #tabContent .settings-tab-ui .settings-form-grid--2 > .settings-field:not(.settings-field--full) > :is(select,input[type="text"],input[type="number"]){height:42px;min-height:42px}
html body #tabContent .settings-tab-ui .settings-form-grid--2 > .settings-field:not(.settings-field--full) > :is(.settings-help-text,.home-hero-font-setting__note,small){margin:0;align-self:start}

/* الرئيسية: غلاف محتوى هادئ بنفس لغة أغلفة بطاقات الإدارة. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section.sadaa-card{
  border-color:var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9));
}

/* =========================================================
   Standard settings cards = sadaa-card + sadaa-section-head
   ========================================================= */
html body #tabContent .settings-tab-ui .settings-form-section.sadaa-card,
html body #tabContent .settings-tab-ui .settings-side-form.sadaa-card{
  margin:0 0 14px;
  padding:0;
  overflow:hidden;
  border-radius:var(--sadaa-radius-md,8px);
  background:var(--sadaa-surface,#fff);
}
html body #tabContent .settings-tab-ui .settings-form-section__head.sadaa-section-head,
html body #tabContent .settings-tab-ui .settings-form-card-head.sadaa-section-head{
  margin:0;
  border-radius:0;
  background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc));
}
html body #tabContent .settings-tab-ui .settings-form-section__head .settings-intro-title,
html body #tabContent .settings-tab-ui .settings-form-card-head .settings-intro-title{
  margin:0;
  font-size:15px;
  font-weight:600;
  line-height:1.55;
}
html body #tabContent .settings-tab-ui .settings-form-section__head .settings-intro-copy,
html body #tabContent .settings-tab-ui .settings-form-card-head .settings-intro-copy{
  margin:3px 0 0;
  color:var(--sadaa-muted,#6b7280);
  font-size:12px;
  line-height:1.75;
}
html body #tabContent .settings-tab-ui .settings-form-grid{
  padding:16px;
  gap:14px;
}
html body #tabContent .settings-tab-ui .settings-form-grid--2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
html body #tabContent .settings-tab-ui .settings-form-grid--compact{
  grid-template-columns:minmax(0,560px);
}
html body #tabContent .settings-tab-ui .settings-field--full{grid-column:1/-1}
html body #tabContent .settings-tab-ui .settings-form-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-top:1px solid var(--sadaa-line,#e5e7eb);
  background:var(--sadaa-surface-alt,#f8fafc);
}
html body #tabContent .settings-tab-ui form.settings-ajax-form > .settings-form-actions:last-child{
  margin:0;
}
html body #tabContent .settings-tab-ui .sadaa-file-native--admin{
  width:100%;
  max-width:none;
  min-height:42px;
}

/* =========================================================
   Settings inset panels — same visual direction as VAT box
   ========================================================= */
html body #tabContent .settings-tab-ui .settings-inner-box,
html body #tabContent .settings-tab-ui .settings-form-section > .settings-form-grid,
html body #tabContent .settings-tab-ui .settings-side-form:not(.settings-vat-form) > .settings-form-grid{
  min-width:0;
  box-sizing:border-box;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));
  border-radius:10px;
  background:var(--sadaa-surface,#fff);
  box-shadow:none;
}
html body #tabContent .settings-tab-ui .settings-form-section > .settings-form-grid,
html body #tabContent .settings-tab-ui .settings-side-form:not(.settings-vat-form) > .settings-form-grid{
  margin:14px 16px;
  padding:14px;
}
html body #tabContent .settings-tab-ui .layout-filter-form.settings-inner-box{
  margin:14px 16px;
  padding:14px;
}
html body #tabContent .settings-tab-ui .layout-selection-row{
  margin:14px 16px 10px;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));
  border-radius:10px;
  background:var(--sadaa-surface,#fff);
}
html body #tabContent .settings-tab-ui .layout-grid{
  margin:0 16px 14px;
  overflow:hidden;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));
  border-radius:10px;
  background:var(--sadaa-surface,#fff);
}
html body #tabContent .settings-tab-ui .layout-check-card .sadaa-checkbox{margin:1px 0 0}
html body #tabContent .settings-tab-ui .banner-pricing-equation__body.settings-inner-box,
html body #tabContent .settings-tab-ui .pricing-rates-section__body.settings-inner-box,
html body #tabContent .settings-tab-ui .payment-mode-card__body.settings-inner-box{
  margin:14px 16px;
  padding:14px;
}
html body #tabContent .settings-tab-ui .store-feature-pricing-card__grid.settings-inner-box,
html body #tabContent .settings-tab-ui .trial-ads-settings-body.settings-inner-box,
html body #tabContent .settings-tab-ui .category-visibility-body.settings-inner-box,
html body #tabContent .settings-tab-ui .payment-ad-control__body.settings-inner-box{
  margin:0;
  padding:14px;
}
html body #tabContent .settings-tab-ui .trial-ads-settings-body,
html body #tabContent .settings-tab-ui .category-visibility-body{
  margin-bottom:14px!important;
}
html body #tabContent .settings-tab-ui .trial-ads-settings-body .trial-ads-settings-check:first-child{
  padding-top:0;
}
html body #tabContent .settings-tab-ui .trial-ads-settings-check .sadaa-checkbox{margin:0}
html body #tabContent .settings-tab-ui .category-visibility-body .category-strip-setting{padding-top:0}
html body #tabContent .settings-tab-ui .payment-ad-control__body{margin:12px!important;padding:12px!important}
html body #tabContent .settings-tab-ui .payment-ad-control__actions{
  display:flex;
  justify-content:flex-end;
  padding:0 12px 12px;
}
html body #tabContent .settings-tab-ui .payment-ad-control__actions .sadaa-btn{margin:0}
html body #tabContent .settings-tab-ui .prune-confirm-label .sadaa-checkbox{margin:3px 0 0;flex:0 0 auto}

/* =========================================================
   Layout tab — same cards/section heads, only functional grid remains.
   ========================================================= */
html body #tabContent .settings-tab-ui .layout-tools{display:grid;gap:14px}
html body #tabContent .settings-tab-ui .layout-card.sadaa-card{
  padding:0;
  overflow:hidden;
  border-radius:var(--sadaa-radius-md,8px);
}
html body #tabContent .settings-tab-ui .layout-card__title.sadaa-section-head,
html body #tabContent .settings-tab-ui .layout-form-heading.sadaa-section-head{
  margin:0;
  border-radius:0;
  background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc));
}
html body #tabContent .settings-tab-ui .layout-card__title{
  justify-content:flex-start;
  font-size:14px;
  font-weight:600;
}
html body #tabContent .settings-tab-ui .layout-card__title i{color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496))}
html body #tabContent .settings-tab-ui .layout-filter-form{
  display:grid;
  grid-template-columns:180px minmax(260px,520px);
  gap:12px;
  align-items:center;
  padding:16px;
}
html body #tabContent .settings-tab-ui .layout-filter-form label{
  margin:0;
  font-size:13px;
  font-weight:500;
}
html body #tabContent .settings-tab-ui .layout-form-heading h3{margin:0;font-size:15px;font-weight:600}
html body #tabContent .settings-tab-ui .layout-form-heading p{margin:3px 0 0;color:var(--sadaa-muted,#6b7280);font-size:12px;line-height:1.7}
html body #tabContent .settings-tab-ui .layout-form-heading > span{
  flex:0 0 auto;
  min-height:28px;
  padding:4px 8px;
  border:1px solid var(--sadaa-line,#e5e7eb);
  border-radius:7px;
  background:var(--sadaa-surface,#fff);
  color:var(--sadaa-muted,#6b7280);
  font-size:11.5px;
}
html body #tabContent .settings-tab-ui .layout-selection-row{
  display:grid;
  grid-template-columns:minmax(360px,1.45fr) minmax(250px,1fr) minmax(250px,1fr);
  gap:10px;
  align-items:stretch;
  padding:14px 16px;
  border-bottom:1px solid var(--sadaa-line,#e5e7eb);
}
html body #tabContent .settings-tab-ui .layout-field--wide{min-width:0;padding:0;border:0}
html body #tabContent .settings-tab-ui .layout-field--wide label{display:block;margin:0 0 6px;font-size:14px;font-weight:600}
html body #tabContent .settings-tab-ui .layout-select-wrap{min-width:0}
html body #tabContent .settings-tab-ui .layout-select-wrap select{width:100%}
html body #tabContent .settings-tab-ui .layout-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  padding:14px 16px;
  border-bottom:1px solid var(--sadaa-line,#e5e7eb);
}
html body #tabContent .settings-tab-ui .layout-check-card{
  display:flex;
  align-items:flex-start;
  gap:9px;
  min-width:0;
  min-height:68px;
  padding:10px 12px;
  border:1px solid var(--sadaa-line,#e5e7eb);
  border-radius:8px;
  background:var(--sadaa-surface,#fff);
  cursor:pointer;
}
html body #tabContent .settings-tab-ui .layout-selection-row .layout-check-card{align-self:end}
html body #tabContent .settings-tab-ui .layout-check-card:hover{background:var(--sadaa-surface-alt,#f8fafc)}
html body #tabContent .settings-tab-ui .layout-check-card strong{display:block;font-size:12.5px;font-weight:600}
html body #tabContent .settings-tab-ui .layout-check-card small{margin-top:2px}
html body #tabContent .settings-tab-ui .layout-empty-state{
  margin:16px;
  padding:22px 16px;
  text-align:center;
  border:1px dashed var(--sadaa-line-2,#d1d5db);
  border-radius:8px;
  background:var(--sadaa-surface-alt,#f8fafc);
  color:var(--sadaa-muted,#6b7280);
}
html body #tabContent .settings-tab-ui .layout-empty-state i{display:block;margin-bottom:7px;font-size:20px;color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496))}
html body #tabContent .settings-tab-ui .layout-empty-state strong{display:block;color:var(--sadaa-text,#111827);font-size:14px}
html body #tabContent .settings-tab-ui .layout-empty-state p{margin:3px 0 0;font-size:12px}
html body #tabContent .settings-tab-ui .layout-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
html body #tabContent .settings-tab-ui .layout-grid .layout-field{
  min-width:0;
  padding:14px 16px;
  border-inline-start:1px solid var(--sadaa-line,#e5e7eb);
}
html body #tabContent .settings-tab-ui .layout-grid .layout-field:first-child{border-inline-start:0}
html body #tabContent .settings-tab-ui .layout-grid .layout-field label{display:block;margin-bottom:6px;font-size:12.5px;font-weight:500}
html body #tabContent .settings-tab-ui .layout-input-with-unit{display:flex;direction:ltr}
html body #tabContent .settings-tab-ui .layout-input-with-unit input{border-radius:7px 0 0 7px;text-align:center}
html body #tabContent .settings-tab-ui .layout-input-with-unit span{
  display:flex;align-items:center;justify-content:center;min-width:42px;
  border:1px solid var(--sadaa-line,#e5e7eb);border-left:0;border-radius:0 7px 7px 0;
  background:var(--sadaa-surface-alt,#f8fafc);color:var(--sadaa-muted,#6b7280);font-size:11.5px;
}
html body #tabContent .settings-tab-ui .layout-actions{
  display:flex;justify-content:flex-end;padding:12px 16px;border-top:1px solid var(--sadaa-line,#e5e7eb);background:var(--sadaa-surface-alt,#f8fafc)
}

/* =========================================================
   Banner distribution — same data-surface language as admin tables.
   ========================================================= */
html body #tabContent .settings-tab-ui .manage-layout-header.sadaa-section-head{
  margin:0 0 10px;
  border:1px solid var(--sadaa-line,#e5e7eb);
  border-radius:var(--sadaa-radius-md,8px);
  background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc));
}
html body #tabContent .settings-tab-ui .manage-layout-header__copy h3{margin:0;font-size:15px;font-weight:600}
html body #tabContent .settings-tab-ui .manage-layout-header__copy p{margin:3px 0 0;color:var(--sadaa-muted,#6b7280);font-size:12px;line-height:1.7}
html body #tabContent .settings-tab-ui .settings-table-shell{
  margin:0;
  padding:14px;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9));
  border-radius:14px;
  background:var(--sadaa-surface-alt,#FDFBFD);
  box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035);
}
html body #tabContent .settings-tab-ui .positions-table-surface{overflow:hidden;border-radius:10px}
html body #tabContent .settings-tab-ui .settings-positions-table{width:100%;table-layout:fixed}
html body #tabContent .settings-tab-ui .settings-positions-table th{
  padding:12px 14px;
  background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc));
  color:var(--sadaa-admin-dark,var(--sadaa-text-2,#374151));
  font-size:13px;
  font-weight:600;
  text-align:center;
}
html body #tabContent .settings-tab-ui .settings-positions-table th:first-child{width:34%;text-align:right}
html body #tabContent .settings-tab-ui .settings-positions-table td{padding:9px 14px;font-size:13px;text-align:center}
html body #tabContent .settings-tab-ui .settings-positions-table td:first-child{text-align:right;font-weight:500}
html body #tabContent .settings-tab-ui .settings-positions-table input{
  width:118px;
  min-height:36px;
  padding:6px 8px;
  border-color:var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));
  text-align:center;
}
html body #tabContent .settings-tab-ui .settings-positions-table tbody tr:hover{background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#fbfdff))}
html body #tabContent .settings-tab-ui .positions-table-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 2px 0;
}
html body #tabContent .settings-tab-ui .manage-layout-stem-help{
  margin:0;
  padding:0;
  border:0;
  color:var(--sadaa-muted,#6b7280);
  font-size:12px;
  line-height:1.7;
}
html body #tabContent .settings-tab-ui .positions-table-footer .sadaa-btn{flex:0 0 auto}
html body #tabContent .settings-tab-ui .prune-layout-form{
  margin-top:14px;padding:16px;border:1px solid var(--sadaa-danger-line,#fecaca);border-radius:var(--sadaa-radius-md,8px);background:var(--sadaa-danger-soft,#fff7f7)
}
html body #tabContent .settings-tab-ui .prune-select-label{display:block;margin-bottom:6px;font-size:13px;font-weight:500}
html body #tabContent .settings-tab-ui .prune-warning-box{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:10px}
html body #tabContent .settings-tab-ui .prune-confirm-label{display:flex;align-items:flex-start;gap:8px;color:var(--sadaa-danger,#b42318);font-size:12.5px;line-height:1.7}

/* =========================================================
   Pricing / payment / trial / categories
   كل البطاقات تستخدم نفس border/radius/surface المركزية.
   ========================================================= */
html body #tabContent .settings-tab-ui .settings-page-lead{
  margin:0 0 10px;
}
html body #tabContent .settings-tab-ui .settings-page-lead h3{margin:0;font-size:17px;font-weight:600}
html body #tabContent .settings-tab-ui .settings-page-lead p{margin:3px 0 0;color:var(--sadaa-muted,#6b7280);font-size:12.5px;line-height:1.75}
html body #tabContent .settings-tab-ui :is(.banner-pricing-equation,.pricing-rates-section,.store-feature-pricing-card,.trial-ads-settings-card,.category-visibility-card,.payment-mode-card,.payment-ad-control){
  margin:0 0 14px;
  padding:0;
  overflow:hidden;
  border-radius:var(--sadaa-radius-md,8px);
}
html body #tabContent .settings-tab-ui :is(.banner-pricing-equation__head,.pricing-rates-section__head,.store-feature-pricing-card__head,.trial-ads-settings-card__head,.category-visibility-card__head,.payment-mode-card__head){
  padding:14px 16px;
  border-bottom:1px solid var(--sadaa-line,#e5e7eb);
  background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc));
}
html body #tabContent .settings-tab-ui :is(.banner-pricing-equation__title,.pricing-rates-section__title,.store-feature-pricing-card__title,.trial-ads-settings-card__title,.category-visibility-card__title,.payment-mode-card__head h3){
  margin:0;font-size:15px;font-weight:600;line-height:1.55
}
html body #tabContent .settings-tab-ui :is(.banner-pricing-equation__intro,.pricing-rates-section__note,.store-feature-pricing-card__note,.trial-ads-settings-card__note,.category-visibility-card__note,.payment-mode-card__description){
  margin:3px 0 0;color:var(--sadaa-muted,#6b7280);font-size:12px;line-height:1.7
}
html body #tabContent .settings-tab-ui .banner-pricing-equation__body{padding:14px 16px}
html body #tabContent .settings-tab-ui .banner-pricing-equation__formula{padding:10px 12px;border:1px solid var(--sadaa-line,#e5e7eb);border-radius:7px;background:var(--sadaa-surface-alt,#f8fafc);font-size:12.5px}
html body #tabContent .settings-tab-ui .banner-pricing-equation__steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:10px;border:1px solid var(--sadaa-line,#e5e7eb);border-radius:7px;overflow:hidden}
html body #tabContent .settings-tab-ui .banner-pricing-equation__step{padding:10px 12px;border-inline-start:1px solid var(--sadaa-line,#e5e7eb);font-size:11.5px}
html body #tabContent .settings-tab-ui .banner-pricing-equation__step:first-child{border-inline-start:0}
html body #tabContent .settings-tab-ui .banner-pricing-equation__step-number{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-bottom:6px;border-radius:50%;background:var(--sadaa-admin-soft,#f8f2fa);color:var(--sadaa-admin-primary,#7C5496);font-size:11px;font-weight:600}
html body #tabContent .settings-tab-ui .banner-pricing-equation__step strong,
html body #tabContent .settings-tab-ui .banner-pricing-equation__step span:not(.banner-pricing-equation__step-number){display:block;margin-top:2px}
html body #tabContent .settings-tab-ui .banner-pricing-equation__example{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:10px;border:1px solid var(--sadaa-line,#e5e7eb);border-radius:7px;overflow:hidden}
html body #tabContent .settings-tab-ui .banner-pricing-equation__example-card{padding:9px 12px;border-inline-start:1px solid var(--sadaa-line,#e5e7eb)}
html body #tabContent .settings-tab-ui .banner-pricing-equation__example-card:first-child{border-inline-start:0}
html body #tabContent .settings-tab-ui .banner-pricing-equation__example-label{display:block;color:var(--sadaa-muted,#6b7280);font-size:11px}
html body #tabContent .settings-tab-ui .banner-pricing-equation__example-value{display:block;margin-top:2px;font-size:12.5px;font-weight:600}
html body #tabContent .settings-tab-ui .banner-pricing-equation__note{margin:10px 0 0;color:var(--sadaa-muted,#6b7280);font-size:11.5px;line-height:1.7}
html body #tabContent .settings-tab-ui .pricing-rates-section__body,
html body #tabContent .settings-tab-ui .store-feature-pricing-card > form,
html body #tabContent .settings-tab-ui .trial-ads-settings-card > form,
html body #tabContent .settings-tab-ui .category-visibility-card > form{padding:16px}
html body #tabContent .settings-tab-ui .pricing-rate-grid,
html body #tabContent .settings-tab-ui .store-feature-pricing-card__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
html body #tabContent .settings-tab-ui .banner-pricing-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}
html body #tabContent .settings-tab-ui .banner-pricing-form .form-group{margin:0}
html body #tabContent .settings-tab-ui .banner-pricing-form label{display:block;margin-bottom:6px;font-size:13px;font-weight:500}
html body #tabContent .settings-tab-ui .store-feature-pricing-card__actions,
html body #tabContent .settings-tab-ui .trial-ads-settings-footer,
html body #tabContent .settings-tab-ui .category-visibility-footer{display:flex;align-items:center;justify-content:space-between;flex-direction:row-reverse;gap:12px;margin:14px -16px -16px;padding:12px 16px;border-top:1px solid var(--sadaa-line,#e5e7eb);background:var(--sadaa-surface-alt,#f8fafc)}
html body #tabContent .settings-tab-ui :is(.store-feature-pricing-card__tax-note,.trial-ads-settings-hint,.category-visibility-hint){color:var(--sadaa-muted,#6b7280);font-size:11.5px;line-height:1.65}

/* Payment */
html body #tabContent .settings-tab-ui .payment-gateway-settings > h2{display:none}
html body #tabContent .settings-tab-ui .payment-mode-card{padding:0;overflow:hidden}
html body #tabContent .settings-tab-ui .payment-mode-card__head{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:14px 16px;border-bottom:1px solid var(--sadaa-line,#e5e7eb);
  background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc));
}
html body #tabContent .settings-tab-ui .payment-mode-card__head-main{display:flex;align-items:center;gap:12px;min-width:0}
html body #tabContent .settings-tab-ui .payment-mode-card__head-icon{flex:0 0 40px;width:40px;height:40px}
html body #tabContent .settings-tab-ui .payment-mode-card__head-main>div{min-width:0}
html body #tabContent .settings-tab-ui .payment-mode-card__eyebrow{display:block;margin:0 0 2px;color:var(--sadaa-muted,#6b7280);font-size:11px;font-weight:500}
html body #tabContent .settings-tab-ui .payment-mode-card__head h3{margin:0;font-size:15px;font-weight:600;line-height:1.55}
html body #tabContent .settings-tab-ui .payment-mode-card__head-copy{margin:3px 0 0;color:var(--sadaa-muted,#6b7280);font-size:11.5px;line-height:1.65}
html body #tabContent .settings-tab-ui .payment-mode-card__head-meta{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;flex:0 0 auto}
html body #tabContent .settings-tab-ui .payment-provider-chip,
html body #tabContent .settings-tab-ui .payment-mode-status{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:5px 9px;border:1px solid var(--sadaa-admin-soft-line,var(--sadaa-line,#e5e7eb));border-radius:999px;background:var(--sadaa-surface,#fff);color:var(--sadaa-text-2,#374151);font-size:11.5px;font-weight:600;white-space:nowrap}
html body #tabContent .settings-tab-ui .payment-mode-status.is-sandbox{color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));background:var(--sadaa-admin-soft,#f8f2fa)}
html body #tabContent .settings-tab-ui .payment-mode-status.is-live{color:var(--sadaa-success,#067647);background:#f0fdf4;border-color:#bbf7d0}
html body #tabContent .settings-tab-ui .payment-mode-card__body{padding:16px}
html body #tabContent .settings-tab-ui .payment-mode-health{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0;margin:0}
html body #tabContent .settings-tab-ui .payment-mode-health__item{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border:1px solid var(--sadaa-line,#e5e7eb);border-radius:8px;background:var(--sadaa-surface,#fff)}
html body #tabContent .settings-tab-ui .payment-mode-health__icon{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:8px;background:var(--sadaa-surface-alt,#f8fafc);color:var(--sadaa-muted,#6b7280)}
html body #tabContent .settings-tab-ui .payment-mode-health__item.is-ready .payment-mode-health__icon{background:#f0fdf4;color:var(--sadaa-success,#067647)}
html body #tabContent .settings-tab-ui .payment-mode-health__item.is-missing .payment-mode-health__icon{background:#fff8eb;color:#9a6700}
html body #tabContent .settings-tab-ui .payment-mode-health__item>div{display:grid;gap:1px;min-width:0}
html body #tabContent .settings-tab-ui .payment-mode-health__item small{margin:0;color:var(--sadaa-muted,#6b7280);font-size:10.5px}
html body #tabContent .settings-tab-ui .payment-mode-health__item strong{font-size:12px;font-weight:600;color:var(--sadaa-text,#111827)}
html body #tabContent .settings-tab-ui .payment-mode-switch-panel{display:grid;grid-template-columns:minmax(190px,.42fr) minmax(0,1fr);gap:14px;align-items:center;margin-top:12px;padding:12px;border:1px solid var(--sadaa-line,#e5e7eb);border-radius:8px;background:var(--sadaa-surface-alt,#f8fafc)}
html body #tabContent .settings-tab-ui .payment-mode-switch-panel__copy{display:grid;gap:3px;align-content:center}
html body #tabContent .settings-tab-ui .payment-mode-switch-panel__copy strong{font-size:12.5px;font-weight:600}
html body #tabContent .settings-tab-ui .payment-mode-switch-panel__copy span{color:var(--sadaa-muted,#6b7280);font-size:11px;line-height:1.6}
html body #tabContent .settings-tab-ui .payment-mode-switch-form{padding:0;margin:0}
html body #tabContent .settings-tab-ui .payment-mode-switch-wrap{display:flex;align-items:center;justify-content:center;gap:14px;margin:0;padding:8px 10px;border:0;border-radius:7px;background:var(--sadaa-surface,#fff)}
html body #tabContent .settings-tab-ui .payment-mode-switch-label{display:grid;gap:1px;min-width:70px;text-align:center;font-size:11.5px;font-weight:600}
html body #tabContent .settings-tab-ui .payment-mode-switch-label small{margin:0;font-size:10px;font-weight:400}
html body #tabContent .settings-tab-ui .payment-mode-switch-lock-note{display:flex;align-items:center;gap:7px;margin:8px 0 0;padding:7px 9px;border-radius:7px;background:#fff8eb;color:#765b17;font-size:10.8px;line-height:1.55}
html body #tabContent .settings-tab-ui .geidea-test-card-box{margin:12px 0 0;padding:0;border:1px solid var(--sadaa-line,#e5e7eb);border-radius:8px;background:var(--sadaa-surface,#fff);overflow:hidden}
html body #tabContent .settings-tab-ui .geidea-test-card-head{display:flex;align-items:center;gap:10px;padding:11px 12px;border-bottom:1px solid var(--sadaa-line,#e5e7eb);background:var(--sadaa-surface-alt,#f8fafc)}
html body #tabContent .settings-tab-ui .geidea-test-card-icon{flex:0 0 34px;width:34px;height:34px}
html body #tabContent .settings-tab-ui .geidea-test-card-head>div{display:grid;gap:1px;min-width:0}
html body #tabContent .settings-tab-ui .geidea-test-card-eyebrow{display:block;color:var(--sadaa-muted,#6b7280);font-size:10.5px}
html body #tabContent .settings-tab-ui .geidea-test-card-head strong{font-size:12.5px;font-weight:600;line-height:1.55}
html body #tabContent .settings-tab-ui .geidea-test-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:0;margin:0}
html body #tabContent .settings-tab-ui .geidea-test-card-item{padding:10px 12px;border:0;border-inline-start:1px solid var(--sadaa-line,#e5e7eb);border-radius:0;background:var(--sadaa-surface,#fff);text-align:center}
html body #tabContent .settings-tab-ui .geidea-test-card-item:first-child{border-inline-start:0}
html body #tabContent .settings-tab-ui .geidea-test-card-item span{display:block;color:var(--sadaa-muted,#6b7280);font-size:10.5px}
html body #tabContent .settings-tab-ui .geidea-test-card-item code,
html body #tabContent .settings-tab-ui .geidea-test-card-item strong{display:block;margin-top:3px;font-size:11.5px;color:var(--sadaa-text,#111827)}
html body #tabContent .settings-tab-ui .geidea-test-card-note{display:flex;align-items:center;gap:6px;margin:0;padding:8px 12px;border-top:1px solid var(--sadaa-line,#e5e7eb);background:var(--sadaa-surface-alt,#f8fafc);color:var(--sadaa-muted,#6b7280);font-size:10.8px;line-height:1.55}
html body #tabContent .settings-tab-ui .payment-mode-note{display:flex;align-items:center;gap:7px;margin:12px 0 0;padding:8px 10px;border-radius:7px;background:var(--sadaa-surface-alt,#f8fafc);color:var(--sadaa-muted,#6b7280);font-size:11px;line-height:1.6}
html body #tabContent .settings-tab-ui .payment-mode-note.is-sandbox{background:var(--sadaa-admin-soft,#f8f2fa);color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496))}
html body #tabContent .settings-tab-ui .payment-mode-note.is-live{background:#fff4f3;color:var(--sadaa-danger,#b42318)}
html body #tabContent .settings-tab-ui .payment-ad-control{padding:0;overflow:hidden}
html body #tabContent .settings-tab-ui .payment-ad-control h3{margin:0;padding:14px 16px;border-bottom:1px solid var(--sadaa-line,#e5e7eb);background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc));font-size:15px;font-weight:600}
html body #tabContent .settings-tab-ui .payment-ad-control p{color:var(--sadaa-muted,#6b7280);font-size:12px;line-height:1.7}
html body #tabContent .settings-tab-ui .payment-ad-control .sadaa-btn{display:flex;width:max-content;margin-top:8px;margin-inline-start:auto;margin-inline-end:0}

/* VAT */
html body #tabContent .settings-tab-ui .vat-settings-box{margin:14px 16px 14px;border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));border-radius:10px;background:var(--sadaa-surface,#fff);overflow:hidden}
html body #tabContent .settings-tab-ui .vat-settings-box .vat-enable-row{display:flex;align-items:center;justify-content:flex-start;gap:9px;min-height:54px;padding:12px 14px;border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));background:var(--sadaa-surface,#fff);font-size:13px;font-weight:600;line-height:1.4}
html body #tabContent .settings-tab-ui .vat-settings-box .vat-enable-row .sadaa-checkbox{margin:0;align-self:center}
html body #tabContent .settings-tab-ui .vat-settings-box .vat-enable-row span{display:block;line-height:1.4}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-form-grid{padding:14px}

/* Trial */
html body #tabContent .settings-tab-ui .trial-ads-settings-check{display:flex;align-items:center;gap:8px;padding:10px 0;font-size:12.5px;font-weight:500}
html body #tabContent .settings-tab-ui .trial-ads-settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
html body #tabContent .settings-tab-ui .trial-ads-settings-field label{display:block;margin-bottom:6px;font-size:12.5px;font-weight:500}
html body #tabContent .settings-tab-ui .trial-ads-settings-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}

/* Categories = same compact data-management language. */
html body #tabContent .settings-tab-ui .category-strip-setting{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 0 10px;border-bottom:0}
html body #tabContent .settings-tab-ui .category-strip-setting__title{display:block;font-size:12.5px;font-weight:600}
html body #tabContent .settings-tab-ui .category-strip-setting__note{display:block;margin-top:2px;color:var(--sadaa-muted,#6b7280);font-size:11.5px;line-height:1.6}
html body #tabContent .settings-tab-ui .category-strip-setting__toggle{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:12px;font-weight:500}
html body #tabContent .settings-tab-ui .category-bulk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 0;padding:9px 10px;border:1px solid var(--sadaa-line,#e5e7eb);border-radius:8px;background:var(--sadaa-surface-alt,#f8fafc);box-shadow:none}
html body #tabContent .settings-tab-ui .category-bulk-toolbar__select-all{align-items:center;margin:0;font-size:12.5px;font-weight:600}
html body #tabContent .settings-tab-ui .category-bulk-toolbar__select-all .sadaa-checkbox{margin:0}
html body #tabContent .settings-tab-ui .category-bulk-toolbar__action{display:flex;align-items:center;gap:8px;min-width:min(100%,330px)}
html body #tabContent .settings-tab-ui .category-bulk-toolbar__action .sadaa-select-shell{flex:1 1 220px;min-width:0}
html body #tabContent .settings-tab-ui .category-bulk-toolbar__action .sadaa-btn{flex:0 0 auto;min-height:36px;padding:7px 12px}
html body #tabContent .settings-tab-ui .category-visibility-columns,
html body #tabContent .settings-tab-ui .category-visibility-item{display:grid;grid-template-columns:minmax(260px,1fr) minmax(180px,220px) 116px;gap:12px;align-items:center}
html body #tabContent .settings-tab-ui .category-visibility-columns{margin:8px -14px 0;padding:9px 14px;border-bottom:1px solid var(--sadaa-line,#e5e7eb);border-top:0;background:var(--sadaa-surface-alt,#f8fafc);font-size:11.5px;font-weight:600;color:var(--sadaa-text-2,#374151)}
html body #tabContent .settings-tab-ui .category-visibility-columns span:last-child{text-align:center}
html body #tabContent .settings-tab-ui .category-visibility-list{margin:0 -14px}
html body #tabContent .settings-tab-ui .category-visibility-item{padding:9px 14px;border-bottom:1px solid var(--sadaa-line,#e5e7eb)}
html body #tabContent .settings-tab-ui .category-visibility-item:last-child{border-bottom:0}
html body #tabContent .settings-tab-ui .category-visibility-item:hover{background:var(--sadaa-surface-alt,#f8fafc)}
html body #tabContent .settings-tab-ui .category-visibility-item__main,
html body #tabContent .settings-tab-ui .category-visibility-item__fields{display:contents}
html body #tabContent .settings-tab-ui .category-visibility-item__name-control{display:grid;grid-template-columns:18px 34px minmax(0,1fr);align-items:center;gap:9px;min-width:0}
html body #tabContent .settings-tab-ui .category-visibility-item__select{margin:0}
html body #tabContent .settings-tab-ui .category-visibility-item__icon-preview{display:flex;align-items:center;justify-content:center;flex:0 0 34px;width:34px;height:34px;border:1px solid var(--sadaa-admin-soft-line,#ded4e1);border-radius:7px;background:var(--sadaa-admin-soft,#f8f2fa);color:var(--sadaa-admin-primary,#7C5496);font-size:13px;overflow:hidden}
html body #tabContent .settings-tab-ui .category-visibility-item input[type="text"],
html body #tabContent .settings-tab-ui .category-visibility-item select{min-height:38px;padding:6px 9px;font-size:12.5px}
html body #tabContent .settings-tab-ui .category-visibility-item__toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;margin:0;padding:0 9px;border:1px solid var(--sadaa-line,#e5e7eb);border-radius:8px;background:var(--sadaa-surface,#fff);color:var(--sadaa-text-2,#374151);font-size:12px;font-weight:600;white-space:nowrap}
html body #tabContent .settings-tab-ui .category-visibility-item__toggle .sadaa-checkbox{margin:0}
html body #tabContent .settings-tab-ui .category-visibility-item__icon-preview i{display:block;line-height:1;font-size:13px;color:inherit;transform:translateY(-.5px)}
html body #tabContent .settings-tab-ui .category-visibility-item__toggle:has(.sadaa-checkbox:checked){border-color:var(--sadaa-admin-soft-line,#ded4e1);background:var(--sadaa-admin-soft,#f8f2fa);color:var(--sadaa-admin-primary,#7C5496)}
html body #tabContent .settings-tab-ui .sadaa-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Flash/alerts */
html body #tabContent .settings-tab-ui :is(.layout-alert,.settings-flash){margin:0 0 12px;padding:10px 12px;border-radius:8px;font-size:12.5px;line-height:1.65}

/* =========================================================
   Responsive: نفس فلسفة لوحة الإدارة — لا هوية موازية.
   ========================================================= */
@media (max-width:1100px){
  html body #tabContent .settings-tab-ui .settings-subnav.sadaa-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
  html body #tabContent .settings-tab-ui .layout-selection-row{grid-template-columns:1fr 1fr}
  html body #tabContent .settings-tab-ui .layout-selection-row .layout-field--wide{grid-column:1/-1}
  html body #tabContent .settings-tab-ui .layout-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  html body #tabContent .settings-tab-ui .layout-grid .layout-field:nth-child(odd){border-inline-start:0}
  html body #tabContent .settings-tab-ui .layout-grid .layout-field:nth-child(n+3){border-top:1px solid var(--sadaa-line,#e5e7eb)}
  html body #tabContent .settings-tab-ui .banner-pricing-equation__steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  html body #tabContent .settings-tab-ui .banner-pricing-equation__step:nth-child(odd){border-inline-start:0}
  html body #tabContent .settings-tab-ui .banner-pricing-equation__step:nth-child(n+3){border-top:1px solid var(--sadaa-line,#e5e7eb)}
}

@media (max-width:720px){
  html body #tabContent .settings-tab-ui .settings-inner-box,
  html body #tabContent .settings-tab-ui .settings-form-section > .settings-form-grid,
  html body #tabContent .settings-tab-ui .settings-side-form:not(.settings-vat-form) > .settings-form-grid,
  html body #tabContent .settings-tab-ui .layout-selection-row,
  html body #tabContent .settings-tab-ui .layout-grid{margin-inline:12px}
  html body #tabContent .settings-tab-ui .settings-nav-card.sadaa-card{padding:6px}
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
  html body #tabContent .settings-tab-ui .layout-selection-row{grid-template-columns:1fr;padding:12px}
  html body #tabContent .settings-tab-ui .layout-selection-row .layout-field--wide{grid-column:auto}
  html body #tabContent .settings-tab-ui .positions-table-footer{align-items:stretch;flex-direction:column}
  html body #tabContent .settings-tab-ui .positions-table-footer .sadaa-btn{width:100%}
  html body #tabContent .settings-tab-ui .settings-subnav.sadaa-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  html body #tabContent .settings-tab-ui .settings-form-grid--2,
  html body #tabContent .settings-tab-ui .pricing-rate-grid,
  html body #tabContent .settings-tab-ui .store-feature-pricing-card__grid,
  html body #tabContent .settings-tab-ui .trial-ads-settings-grid,
  html body #tabContent .settings-tab-ui .trial-ads-settings-checks,
  html body #tabContent .settings-tab-ui .banner-pricing-equation__steps,
  html body #tabContent .settings-tab-ui .banner-pricing-equation__example{grid-template-columns:1fr}
  html body #tabContent .settings-tab-ui .settings-field--full{grid-column:auto}
  html body #tabContent .settings-tab-ui .layout-filter-form{grid-template-columns:1fr;gap:7px}
  html body #tabContent .settings-tab-ui .layout-options,
  html body #tabContent .settings-tab-ui .layout-grid{grid-template-columns:1fr}
  html body #tabContent .settings-tab-ui .layout-grid .layout-field:nth-child(n){border-inline-start:0;border-top:1px solid var(--sadaa-line,#e5e7eb)}
  html body #tabContent .settings-tab-ui .layout-grid .layout-field:first-child{border-top:0}
  html body #tabContent .settings-tab-ui .banner-pricing-equation__step:nth-child(n),
  html body #tabContent .settings-tab-ui .banner-pricing-equation__example-card:nth-child(n){border-inline-start:0;border-top:1px solid var(--sadaa-line,#e5e7eb)}
  html body #tabContent .settings-tab-ui .banner-pricing-equation__step:first-child,
  html body #tabContent .settings-tab-ui .banner-pricing-equation__example-card:first-child{border-top:0}
  html body #tabContent .settings-tab-ui .banner-pricing-form{grid-template-columns:1fr}
  html body #tabContent .settings-tab-ui .banner-pricing-form .sadaa-btn{width:100%}
  html body #tabContent .settings-tab-ui :is(.store-feature-pricing-card__actions,.trial-ads-settings-footer,.category-visibility-footer,.category-strip-setting,.prune-warning-box){align-items:stretch;flex-direction:column}
  html body #tabContent .settings-tab-ui .category-visibility-columns{display:none}
  html body #tabContent .settings-tab-ui .category-visibility-item{grid-template-columns:1fr;gap:8px}
  html body #tabContent .settings-tab-ui .category-visibility-item__main,
  html body #tabContent .settings-tab-ui .category-visibility-item__fields{display:block}
  html body #tabContent .settings-tab-ui .category-visibility-item__field{margin-bottom:8px}
  html body #tabContent .settings-tab-ui .category-visibility-item__toggle{justify-content:flex-start}
  html body #tabContent .settings-tab-ui .settings-positions-table{display:block;overflow-x:auto;white-space:nowrap}
  html body #tabContent .settings-tab-ui .geidea-test-card-grid{grid-template-columns:1fr}
}


/* Settings payment/categories responsive refinements */
@media (max-width: 900px){
  html body #tabContent .settings-tab-ui .payment-mode-card__head{align-items:flex-start;flex-direction:column}
  html body #tabContent .settings-tab-ui .payment-mode-card__head-meta{justify-content:flex-start}
  html body #tabContent .settings-tab-ui .payment-mode-switch-panel{grid-template-columns:1fr}
}
@media (max-width: 720px){
  html body #tabContent .settings-tab-ui .payment-mode-health,
  html body #tabContent .settings-tab-ui .geidea-test-card-grid{grid-template-columns:1fr}
  html body #tabContent .settings-tab-ui .geidea-test-card-item{border-inline-start:0;border-top:1px solid var(--sadaa-line,#e5e7eb)}
  html body #tabContent .settings-tab-ui .geidea-test-card-item:first-child{border-top:0}
  html body #tabContent .settings-tab-ui .category-bulk-toolbar{align-items:stretch;flex-direction:column}
  html body #tabContent .settings-tab-ui .category-bulk-toolbar__action{width:100%;min-width:0}
}

/* =========================================================
   Settings responsive cards — 320px to 1440px
   التصنيفات / توزيع البنرات / حقول هيرو الرئيسية
   ========================================================= */
@media (min-width:320px) and (max-width:1440px){
  /* الرئيسية: الحقول النصية تتمدد رأسيًا بدل حصر النص في سطر ثابت. */
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-hero-textarea{
    display:block;
    width:100%;
    box-sizing:border-box;
    height:auto !important;
    min-height:64px !important;
    padding:10px 12px !important;
    line-height:1.85 !important;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
    resize:none;
    overflow:hidden;
    field-sizing:content;
  }
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-hero-textarea--description{
    min-height:82px !important;
  }

  /* التصنيفات: كل تصنيف بطاقة مستقلة ومكتفية بعناوين حقولها. */
  html body #tabContent .settings-tab-ui .category-visibility-columns{
    display:none !important;
  }
  html body #tabContent .settings-tab-ui .category-visibility-list{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    margin:12px 0 0 !important;
  }
  html body #tabContent .settings-tab-ui .category-visibility-item{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    margin:0 !important;
    padding:12px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:10px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.025);
  }
  html body #tabContent .settings-tab-ui .category-visibility-item__field{
    min-width:0;
    margin:0 !important;
  }
  html body #tabContent .settings-tab-ui .category-visibility-item__field::before,
  html body #tabContent .settings-tab-ui .category-visibility-item__toggle::before{
    content:attr(data-label);
    display:block;
    margin:0 0 6px;
    color:var(--sadaa-muted,#6b7280);
    font-size:11.5px;
    font-weight:600;
    line-height:1.5;
  }
  html body #tabContent .settings-tab-ui .category-visibility-item__name-control{
    width:100%;
  }
  html body #tabContent .settings-tab-ui .category-visibility-item__toggle{
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center !important;
    justify-content:start !important;
    column-gap:8px !important;
    row-gap:0 !important;
    min-height:0 !important;
    padding:9px 10px !important;
  }
  html body #tabContent .settings-tab-ui .category-visibility-item__toggle::before{
    grid-column:1/-1;
  }

  /* توزيع البنرات: تحويل صفوف الجدول إلى بطاقات مستقلة. */
  html body #tabContent .settings-tab-ui .positions-table-surface{
    overflow:visible !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table,
  html body #tabContent .settings-tab-ui .settings-positions-table tbody{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table tbody{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table tr:not([data-settings-row]){
    display:none !important;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row]{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    margin:0 !important;
    padding:12px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:10px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.025);
  }
  html body #tabContent .settings-tab-ui .settings-positions-table td{
    min-width:0 !important;
    box-sizing:border-box !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    text-align:inherit !important;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table td::before{
    content:attr(data-label);
    display:block;
    margin:0 0 6px;
    color:var(--sadaa-muted,#6b7280);
    font-size:11.5px;
    font-weight:600;
    line-height:1.5;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table td:first-child{
    color:var(--sadaa-text,#111827);
    font-weight:600;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table input[type="number"]{
    width:100% !important;
    max-width:none !important;
    box-sizing:border-box;
  }
}

@media (min-width:320px) and (max-width:1100px){
  html body #tabContent .settings-tab-ui .category-visibility-item,
  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row]{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
}

@media (min-width:1101px) and (max-width:1440px){
  html body #tabContent .settings-tab-ui .category-visibility-item{
    display:grid !important;
    grid-template-columns:minmax(320px,1.5fr) minmax(210px,.75fr) minmax(120px,.35fr) !important;
    gap:12px !important;
    align-items:end !important;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row]{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px 14px !important;
  }
}

/* =========================================================
   Settings responsive cards v41 — split header/body (320–1440)
   ========================================================= */
@media (min-width:320px) and (max-width:1440px){
  /* ---------------------------------------------------------
     التصنيفات: رأس البطاقة = التحديد + الأيقونة + اسم التصنيف
     --------------------------------------------------------- */
  html body #tabContent .settings-tab-ui .category-visibility-item{
    overflow:hidden !important;
    padding:0 !important;
  }

  html body #tabContent .settings-tab-ui .category-visibility-item__field:first-child{
    grid-column:1 / -1 !important;
    margin:0 !important;
    padding:11px 12px !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
  }

  html body #tabContent .settings-tab-ui .category-visibility-item__field:first-child::before{
    content:none !important;
    display:none !important;
  }

  html body #tabContent .settings-tab-ui .category-visibility-item__name-control{
    display:grid !important;
    grid-template-columns:18px 34px minmax(0,1fr) !important;
    align-items:center !important;
    gap:9px !important;
  }

  html body #tabContent .settings-tab-ui .category-visibility-item__field:first-child .category-visibility-item__title-input{
    min-height:34px !important;
    padding:5px 8px !important;
    border-color:transparent !important;
    background:transparent !important;
    box-shadow:none !important;
    color:var(--sadaa-text,#111827) !important;
    font-weight:700 !important;
  }

  html body #tabContent .settings-tab-ui .category-visibility-item__field:first-child .category-visibility-item__title-input:hover,
  html body #tabContent .settings-tab-ui .category-visibility-item__field:first-child .category-visibility-item__title-input:focus{
    border-color:var(--sadaa-admin-soft-line,var(--sadaa-line,#e5e7eb)) !important;
    background:var(--sadaa-surface,#fff) !important;
  }

  html body #tabContent .settings-tab-ui .category-visibility-item__field:not(:first-child),
  html body #tabContent .settings-tab-ui .category-visibility-item__toggle{
    margin:0 12px !important;
  }

  html body #tabContent .settings-tab-ui .category-visibility-item__field:not(:first-child){
    margin-top:11px !important;
  }

  html body #tabContent .settings-tab-ui .category-visibility-item__toggle{
    margin-top:0 !important;
    margin-bottom:12px !important;
  }

  /* ---------------------------------------------------------
     توزيع البنرات: رأس البطاقة = اسم التصنيف فقط
     --------------------------------------------------------- */
  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row]{
    overflow:hidden !important;
    padding:0 !important;
  }

  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row] > td:first-child{
    grid-column:1 / -1 !important;
    display:block !important;
    width:auto !important;
    margin:0 !important;
    padding:11px 12px !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    color:var(--sadaa-text,#111827) !important;
    font-size:13px !important;
    font-weight:700 !important;
    line-height:1.6 !important;
  }

  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row] > td:first-child::before{
    content:none !important;
    display:none !important;
  }

  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row] > td:not(:first-child){
    margin:0 12px !important;
  }

  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row] > td:nth-child(2){
    margin-top:11px !important;
  }

  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row] > td:last-of-type{
    margin-bottom:12px !important;
  }
}

@media (min-width:1101px) and (max-width:1440px){
  /* جسم بطاقة التصنيفات يبقى بعمودين بعد الرأس. */
  html body #tabContent .settings-tab-ui .category-visibility-item{
    grid-template-columns:minmax(220px,1fr) minmax(140px,.45fr) !important;
    gap:11px 12px !important;
  }
  html body #tabContent .settings-tab-ui .category-visibility-item__field:first-child{
    grid-column:1 / -1 !important;
  }

  /* جسم بطاقة توزيع البنرات عمودان بعد رأس التصنيف. */
  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row]{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:11px 14px !important;
  }
  html body #tabContent .settings-tab-ui .settings-positions-table tr[data-settings-row] > td:first-child{
    grid-column:1 / -1 !important;
  }
}

/* =========================================================
   Settings responsive refinements v42 — 320–1440
   توزيع البنرات + التصنيفات
   ========================================================= */
@media (min-width:320px) and (max-width:1440px){
  /* توزيع البنرات: حاوية واحدة، ورأس القسم جزء منها. */
  html body #tabContent .settings-tab-ui[data-sub="manage_layout"] .settings-content-card{
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="manage_layout"] .settings-table-shell{
    margin:0 !important;
    padding:0 12px 12px !important;
    overflow:hidden !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:12px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="manage_layout"] .settings-table-shell > .manage-layout-header{
    margin:0 -12px 12px !important;
    padding:14px 16px !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:0 !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
    box-shadow:none !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="manage_layout"] .positions-table-surface{
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  /* كل حقل داخل بطاقة توزيع البنرات: العنوان يمين والقيمة يسار. */
  html body #tabContent .settings-tab-ui[data-sub="manage_layout"] .settings-positions-table tr[data-settings-row] > td:not(:first-child){
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(105px,42%) !important;
    align-items:center !important;
    gap:10px !important;
    direction:rtl !important;
    min-height:44px !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="manage_layout"] .settings-positions-table tr[data-settings-row] > td:not(:first-child)::before{
    margin:0 !important;
    align-self:center !important;
    color:var(--sadaa-muted,#6b7280) !important;
    text-align:right !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="manage_layout"] .settings-positions-table tr[data-settings-row] > td:not(:first-child) > input[type="number"]{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    text-align:center !important;
  }

  /* التصنيفات: الحاوية نفسها تصبح رأسًا علويًا + جسم سفلي للبطاقات. */
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-body.settings-inner-box{
    padding:0 !important;
    overflow:hidden !important;
    border-radius:10px !important;
    background:var(--sadaa-surface,#fff) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:12px 16px !important;
    margin:0 !important;
    padding:14px 16px !important;
    border:0 !important;
    border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
    border-radius:0 !important;
    background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__title{
    color:var(--sadaa-text,#111827) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-bulk-toolbar{
    margin:12px 12px 0 !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-list{
    margin:12px !important;
  }

  /* زر إظهار/إخفاء بدل Checkbox التقليدي لشريط التصنيفات. */
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__toggle{
    position:relative !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:8px !important;
    margin:0 !important;
    padding:0 !important;
    cursor:pointer !important;
    white-space:nowrap !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-input{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    margin:-1px !important;
    padding:0 !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    clip-path:inset(50%) !important;
    white-space:nowrap !important;
    border:0 !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-track{
    position:relative !important;
    display:inline-block !important;
    width:44px !important;
    height:24px !important;
    flex:0 0 44px !important;
    border:1px solid var(--sadaa-line-2,#d1d5db) !important;
    border-radius:999px !important;
    background:var(--sadaa-tint-3,#f3f4f6) !important;
    transition:background-color .16s ease,border-color .16s ease !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-track::after{
    content:"" !important;
    position:absolute !important;
    top:3px !important;
    inset-inline-start:3px !important;
    width:16px !important;
    height:16px !important;
    border-radius:50% !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:0 1px 2px rgba(17,24,39,.18) !important;
    transition:transform .16s ease !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-input:checked + .category-strip-setting__switch-track{
    border-color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496)) !important;
    background:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496)) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-input:checked + .category-strip-setting__switch-track::after{
    transform:translateX(-20px) !important;
  }
  html[dir="ltr"] body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-input:checked + .category-strip-setting__switch-track::after{
    transform:translateX(20px) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-input:focus-visible + .category-strip-setting__switch-track{
    outline:none !important;
    box-shadow:0 0 0 3px var(--sadaa-focus,rgba(124,84,150,.13)) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-label::before{
    content:"إخفاء";
    color:var(--sadaa-muted,#6b7280);
    font-size:12px;
    font-weight:600;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-input:checked ~ .category-strip-setting__switch-label::before{
    content:"إظهار";
    color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
  }
}

/* 375–1440: مربع الظهور ينتقل إلى رأس بطاقة التصنيف بجانب الأيقونة. */
html body #tabContent .settings-tab-ui .category-visibility-item__header-visibility{
  display:none;
}
html body #tabContent .settings-tab-ui .category-visibility-item__mobile-switch{
  display:none;
}
@media (min-width:769px) and (max-width:1440px){
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__name-control{
    grid-template-columns:18px 34px 18px minmax(0,1fr) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__header-visibility{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:18px !important;
    height:18px !important;
    margin:0 !important;
    cursor:pointer !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__header-visibility .sadaa-checkbox{
    margin:0 !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__toggle{
    display:none !important;
  }
}

@media (min-width:320px) and (max-width:480px){
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting{
    grid-template-columns:1fr !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__toggle{
    justify-self:start !important;
  }
}

/* =========================================================
   Settings refinements v43 — trial / payment / VAT / pricing
   ========================================================= */

/* Central ON/OFF rows reused by settings tabs. */
html body #tabContent .settings-tab-ui .settings-switch-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  min-width:0;
  min-height:48px;
  box-sizing:border-box;
  margin:0 !important;
  padding:9px 11px !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));
  border-radius:8px;
  background:var(--sadaa-surface,#fff);
  color:var(--sadaa-text,#111827);
  font-size:12.5px;
  font-weight:600;
  line-height:1.55;
}
html body #tabContent .settings-tab-ui .settings-switch-row__label{
  flex:1 1 auto;
  min-width:0;
}
html body #tabContent .settings-tab-ui .settings-switch-row .sadaa-switch__track{
  flex:0 0 var(--sadaa-switch-width);
}
html body #tabContent .settings-tab-ui .settings-switch-row__state{
  flex:0 0 28px;
  min-width:28px;
  color:var(--sadaa-muted,#6b7280);
  font-size:10px;
  font-weight:700;
  direction:ltr;
  text-align:center;
}
html body #tabContent .settings-tab-ui .settings-switch-row__state::before{content:"OFF"}
html body #tabContent .settings-tab-ui .settings-switch-row:has(.sadaa-switch__input:checked) .settings-switch-row__state{
  color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
}
html body #tabContent .settings-tab-ui .settings-switch-row:has(.sadaa-switch__input:checked) .settings-switch-row__state::before{content:"ON"}

/* Trial ads: keep all three boolean controls together. */
html body #tabContent .settings-tab-ui .trial-ads-settings-switches{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:12px;
}
html body #tabContent .settings-tab-ui .trial-ads-settings-switches .settings-switch-row{
  min-height:58px;
}

/* Payment availability uses the same central switch instead of a select. */
html body #tabContent .settings-tab-ui .payment-ad-control .settings-switch-row{
  display:flex !important;
  margin:0 !important;
}
html body #tabContent .settings-tab-ui .payment-ad-control__body > p{
  margin:8px 0 0 !important;
}

/* VAT header = icon + clear title/copy group. */
html body #tabContent .settings-tab-ui .settings-vat-head{
  justify-content:flex-start !important;
  align-items:flex-start !important;
  gap:10px !important;
}
html body #tabContent .settings-tab-ui .settings-vat-head__icon{
  flex:0 0 34px;
}
html body #tabContent .settings-tab-ui .settings-vat-head__copy{
  flex:1 1 auto;
  min-width:0;
}
html body #tabContent .settings-tab-ui .settings-vat-head__copy .settings-intro-title,
html body #tabContent .settings-tab-ui .settings-vat-head__copy .settings-intro-copy{
  width:100%;
}
html body #tabContent .settings-tab-ui .vat-settings-box .vat-enable-row.settings-switch-row{
  min-height:54px;
  padding:11px 14px !important;
  border:0;
  border-bottom:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb));
  border-radius:0;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control{
  display:inline-flex;
  align-items:center;
  gap:7px;
  flex:0 0 auto;
  padding:5px 7px;
  border:1px solid var(--sadaa-line-2,#d1d5db);
  border-radius:8px;
  background:var(--sadaa-tint-3,#f3f4f6);
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control:has(.sadaa-switch__input:checked){
  border-color:var(--sadaa-admin-soft-line,#ded4e1);
  background:var(--sadaa-surface,#fff);
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control .sadaa-switch__track{
  border-color:var(--sadaa-line-3,#cbd5e1);
  background:#d1d5db;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control .sadaa-switch__input:checked + .sadaa-switch__track{
  border-color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
  background:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control .settings-switch-row__state{
  direction:rtl;
  min-width:34px;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control .settings-switch-row__state::before{content:"إخفاء"}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control:has(.sadaa-switch__input:checked) .settings-switch-row__state::before{content:"إظهار"}

/* 320–425: compact mobile treatment for trial, VAT and pricing. */
@media (min-width:320px) and (max-width:425px){
  /* Trial ads: switches stacked tightly and in the requested order. */
  html body #tabContent .settings-tab-ui .trial-ads-settings-switches{
    grid-template-columns:1fr !important;
    gap:6px !important;
    margin-top:9px !important;
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-switches .settings-switch-row{
    min-height:46px !important;
    padding:8px 9px !important;
    font-size:12px !important;
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-body.settings-inner-box{
    padding:10px !important;
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-grid{
    gap:9px !important;
  }

  /* VAT: title gets its own line; description sits clearly below it. */
  html body #tabContent .settings-tab-ui .settings-vat-head{
    display:grid !important;
    grid-template-columns:30px minmax(0,1fr) !important;
    align-items:start !important;
    gap:8px 9px !important;
  }
  html body #tabContent .settings-tab-ui .settings-vat-head__icon{
    width:30px !important;
    height:30px !important;
    flex-basis:30px !important;
    border-radius:7px !important;
    font-size:12px !important;
  }
  html body #tabContent .settings-tab-ui .settings-vat-head__copy{
    min-width:0;
  }
  html body #tabContent .settings-tab-ui .settings-vat-head__copy .settings-intro-title{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    font-size:15px !important;
    line-height:1.5 !important;
  }
  html body #tabContent .settings-tab-ui .settings-vat-head__copy .settings-intro-copy{
    display:block !important;
    width:100% !important;
    margin:4px 0 0 !important;
    font-size:11.5px !important;
    line-height:1.75 !important;
  }

  /* Pricing: remove dead vertical space from the two rate forms. */
  html body #tabContent .settings-tab-ui .pricing-rates-section__body.settings-inner-box{
    padding:10px !important;
  }
  html body #tabContent .settings-tab-ui .pricing-rate-grid{
    align-items:start !important;
    align-content:start !important;
    gap:9px !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-form{
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    gap:8px !important;
    align-items:stretch !important;
    align-content:start !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-form .form-group{
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-form label{
    margin:0 0 5px !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-form .sadaa-btn{
    margin:0 !important;
  }

  /* Pricing equation icon: compact, aligned and visually tied to the heading. */
  html body #tabContent .settings-tab-ui .banner-pricing-equation__head{
    display:grid !important;
    grid-template-columns:34px minmax(0,1fr) !important;
    align-items:start !important;
    gap:9px !important;
    padding:12px !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-equation__head > div{
    min-width:0 !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-equation__icon{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    margin:0 !important;
    border:1px solid var(--sadaa-admin-soft-line,var(--sadaa-line,#ded4e1)) !important;
    border-radius:8px !important;
    background:var(--sadaa-surface,#fff) !important;
    color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496)) !important;
    font-size:13px !important;
    box-shadow:none !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-equation__title{
    margin:0 !important;
    font-size:14px !important;
    line-height:1.55 !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-equation__intro{
    margin-top:3px !important;
    font-size:11.5px !important;
    line-height:1.7 !important;
  }
}

/* Payment environment: prevent overflow on the 320px viewport. */
@media (min-width:320px) and (max-width:340px){
  html body #tabContent .settings-tab-ui .payment-mode-switch-panel{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    padding:9px !important;
    gap:8px !important;
  }
  html body #tabContent .settings-tab-ui .payment-mode-switch-form{
    width:100% !important;
    min-width:0 !important;
  }
  html body #tabContent .settings-tab-ui .payment-mode-switch-wrap{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    gap:5px !important;
    padding:7px 5px !important;
  }
  html body #tabContent .settings-tab-ui .payment-mode-switch-label{
    min-width:0 !important;
    width:auto !important;
    font-size:10.5px !important;
    line-height:1.35 !important;
  }
  html body #tabContent .settings-tab-ui .payment-mode-switch-label small{
    font-size:9px !important;
  }
  html body #tabContent .settings-tab-ui .payment-mode-toggle.sadaa-switch--lg{
    --sadaa-switch-width:52px;
    --sadaa-switch-height:30px;
    --sadaa-switch-thumb:22px;
    --sadaa-switch-pad:4px;
    --sadaa-switch-travel:22px;
  }
  html body #tabContent .settings-tab-ui .payment-mode-switch-lock-note{
    min-width:0 !important;
    overflow-wrap:anywhere !important;
    padding:7px 8px !important;
    font-size:10px !important;
  }
}

/* =========================================================
   Settings visual v44 — icon unification + compact mobile heads
   ========================================================= */
html body #tabContent .settings-tab-ui .settings-card-head-main{
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-width:0;
  width:100%;
}
html body #tabContent .settings-tab-ui .settings-card-head-copy{
  flex:1 1 auto;
  min-width:0;
}
html body #tabContent .settings-tab-ui .settings-card-head-copy > :is(h2,h3,p),
html body #tabContent .settings-tab-ui .pricing-rates-section__head .settings-card-head-copy > :is(h3,p),
html body #tabContent .settings-tab-ui .store-feature-pricing-card__head .settings-card-head-copy > :is(h3,p),
html body #tabContent .settings-tab-ui .trial-ads-settings-card__head .settings-card-head-copy > :is(h2,p),
html body #tabContent .settings-tab-ui .category-visibility-card__head .settings-card-head-copy > :is(h2,p),
html body #tabContent .settings-tab-ui .manage-layout-header .settings-card-head-copy > :is(h3,p),
html body #tabContent .settings-tab-ui .layout-form-heading .settings-card-head-copy > :is(h3,p){
  width:100%;
}
html body #tabContent .settings-tab-ui :is(.settings-card-head-icon,.banner-pricing-equation__icon,.payment-mode-card__head-icon,.settings-vat-head__icon){
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  flex:0 0 38px;
  border:1px solid var(--sadaa-admin-soft-line,var(--sadaa-line,#ded4e1));
  border-radius:10px;
  background:var(--sadaa-surface,#fff);
  color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
  box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035);
  font-size:14px;
}
html body #tabContent .settings-tab-ui :is(.settings-card-head-icon,.banner-pricing-equation__icon,.payment-mode-card__head-icon,.settings-vat-head__icon) i{
  font-size:1em;
}
html body #tabContent .settings-tab-ui .banner-pricing-equation__head,
html body #tabContent .settings-tab-ui .pricing-rates-section__head,
html body #tabContent .settings-tab-ui .store-feature-pricing-card__head,
html body #tabContent .settings-tab-ui .trial-ads-settings-card__head,
html body #tabContent .settings-tab-ui .category-visibility-card__head{
  align-items:flex-start;
}
html body #tabContent .settings-tab-ui .store-feature-pricing-card__title,
html body #tabContent .settings-tab-ui .category-visibility-card__title,
html body #tabContent .settings-tab-ui .trial-ads-settings-card__title,
html body #tabContent .settings-tab-ui .pricing-rates-section__title,
html body #tabContent .settings-tab-ui .banner-pricing-equation__title{
  margin:0;
}
html body #tabContent .settings-tab-ui .settings-inline-heading{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
html body #tabContent .settings-tab-ui .settings-inline-heading__icon{
  display:inline-grid;
  place-items:center;
  width:30px;
  height:30px;
  flex:0 0 30px;
  border:1px solid var(--sadaa-admin-soft-line,var(--sadaa-line,#ded4e1));
  border-radius:8px;
  background:var(--sadaa-surface,#fff);
  color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
  box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.03);
  font-size:12px;
}
html body #tabContent .settings-tab-ui .settings-inline-heading__icon i{font-size:1em}
html body #tabContent .settings-tab-ui .category-strip-setting__heading{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
html body #tabContent .settings-tab-ui .category-strip-setting__text{
  min-width:0;
}
html body #tabContent .settings-tab-ui .payment-provider-chip,
html body #tabContent .settings-tab-ui .payment-mode-status{
  line-height:1;
}
html body #tabContent .settings-tab-ui .payment-ad-control h3 .settings-inline-heading{
  display:flex;
}
html body #tabContent .settings-tab-ui .payment-ad-control h3 .settings-inline-heading span:last-child{
  min-width:0;
}
html body #tabContent .settings-tab-ui .layout-form-heading .settings-card-head-main{
  flex:1 1 auto;
}
html body #tabContent .settings-tab-ui .manage-layout-header .settings-card-head-main{
  align-items:flex-start;
}
html body #tabContent .settings-tab-ui .manage-layout-header .settings-card-head-copy h3,
html body #tabContent .settings-tab-ui .layout-form-heading .settings-card-head-copy h3{
  margin:0;
  font-size:15px;
  font-weight:600;
  line-height:1.55;
}
html body #tabContent .settings-tab-ui .manage-layout-header .settings-card-head-copy p,
html body #tabContent .settings-tab-ui .layout-form-heading .settings-card-head-copy p{
  margin:3px 0 0;
  color:var(--sadaa-muted,#6b7280);
  font-size:12px;
  line-height:1.75;
}

@media (min-width:320px) and (max-width:425px){
  html body #tabContent .settings-tab-ui .settings-card-head-main,
  html body #tabContent .settings-tab-ui .payment-mode-card__head-main,
  html body #tabContent .settings-tab-ui .settings-vat-head{
    display:grid !important;
    grid-template-columns:32px minmax(0,1fr) !important;
    align-items:start !important;
    gap:8px 10px !important;
  }
  html body #tabContent .settings-tab-ui :is(.settings-card-head-icon,.banner-pricing-equation__icon,.payment-mode-card__head-icon,.settings-vat-head__icon){
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    flex-basis:32px !important;
    border-radius:9px !important;
    font-size:12px !important;
  }
  html body #tabContent .settings-tab-ui .settings-card-head-copy > :is(h2,h3,p),
  html body #tabContent .settings-tab-ui .payment-mode-card__head-main > div > :is(h3,p,span),
  html body #tabContent .settings-tab-ui .settings-vat-head__copy > :is(h2,p){
    display:block !important;
    width:100% !important;
  }
  html body #tabContent .settings-tab-ui .settings-card-head-copy > :is(h2,h3),
  html body #tabContent .settings-tab-ui .payment-mode-card__head-main > div > h3,
  html body #tabContent .settings-tab-ui .settings-vat-head__copy > h2{
    margin:0 !important;
    font-size:15px !important;
    line-height:1.55 !important;
  }
  html body #tabContent .settings-tab-ui .settings-card-head-copy > p,
  html body #tabContent .settings-tab-ui .payment-mode-card__head-main > div > p,
  html body #tabContent .settings-tab-ui .settings-vat-head__copy > p,
  html body #tabContent .settings-tab-ui .manage-layout-header .settings-card-head-copy p,
  html body #tabContent .settings-tab-ui .layout-form-heading .settings-card-head-copy p{
    margin:4px 0 0 !important;
    font-size:11.5px !important;
    line-height:1.75 !important;
  }
  html body #tabContent .settings-tab-ui .settings-form-card-head.sadaa-section-head,
  html body #tabContent .settings-tab-ui .settings-form-section__head.sadaa-section-head,
  html body #tabContent .settings-tab-ui .payment-mode-card__head,
  html body #tabContent .settings-tab-ui .manage-layout-header,
  html body #tabContent .settings-tab-ui .layout-form-heading{
    padding:12px !important;
  }
  html body #tabContent .settings-tab-ui .payment-mode-card__head-meta{
    width:100%;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:6px !important;
  }
  html body #tabContent .settings-tab-ui .payment-provider-chip,
  html body #tabContent .settings-tab-ui .payment-mode-status{
    min-height:32px !important;
    padding:6px 10px !important;
    font-size:11px !important;
  }
  html body #tabContent .settings-tab-ui .payment-ad-control h3{
    line-height:1.55 !important;
  }
  html body #tabContent .settings-tab-ui .category-strip-setting__heading{
    align-items:flex-start;
  }
}

/* v45 — Categories card bottom breathing room (375–1440) */
@media (min-width:375px) and (max-width:1440px){
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__field:not(:first-child){
    margin-bottom:12px !important;
  }
}


/* =========================================================
   Settings refinements v46 — general / manage-layout / payment / VAT / categories
   ========================================================= */
@media (min-width:320px) and (max-width:768px){
  /* Payment: badges begin on the same inline edge as the description copy. */
  html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-mode-card__head-meta{
    width:calc(100% - 42px) !important;
    margin-inline-start:42px !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:6px !important;
  }
}

@media (min-width:375px) and (max-width:768px){
  /* Category strip switch: bordered button, neutral gray while hidden. */
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__toggle{
    padding:5px 7px !important;
    border:1px solid var(--sadaa-line-2,#d1d5db) !important;
    border-radius:8px !important;
    background:var(--sadaa-tint-3,#f3f4f6) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__toggle:has(.category-strip-setting__switch-input:checked){
    border-color:var(--sadaa-admin-soft-line,#ded4e1) !important;
    background:var(--sadaa-surface,#fff) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-track{
    border-color:var(--sadaa-line-3,#cbd5e1) !important;
    background:#d1d5db !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-input:checked + .category-strip-setting__switch-track{
    border-color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496)) !important;
    background:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496)) !important;
  }

  /* Each category card: icon selector + ON/OFF visibility control share one row. */
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item{
    grid-template-columns:minmax(0,1fr) auto !important;
    column-gap:8px !important;
    row-gap:0 !important;
    align-items:stretch !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__field:first-child{
    grid-column:1 / -1 !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__name-control{
    grid-template-columns:18px 34px minmax(0,1fr) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__header-visibility{
    display:none !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__field:nth-child(2){
    grid-column:1 !important;
    margin-block:11px 12px !important;
    margin-inline-start:12px !important;
    margin-inline-end:0 !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch{
    --sadaa-switch-width:40px;
    --sadaa-switch-height:22px;
    --sadaa-switch-thumb:14px;
    --sadaa-switch-pad:3px;
    --sadaa-switch-travel:18px;
    grid-column:2 !important;
    display:inline-flex !important;
    align-self:end !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    margin-block:11px 12px !important;
    margin-inline-start:0 !important;
    margin-inline-end:12px !important;
    padding:7px 8px !important;
    border:1px solid var(--sadaa-line-2,#d1d5db) !important;
    border-radius:8px !important;
    background:var(--sadaa-tint-3,#f3f4f6) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch:has(.sadaa-switch__input:checked){
    border-color:var(--sadaa-admin-soft-line,#ded4e1) !important;
    background:var(--sadaa-surface,#fff) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch .sadaa-switch__track{
    border-color:var(--sadaa-line-3,#cbd5e1) !important;
    background:#d1d5db !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch .sadaa-switch__input:checked + .sadaa-switch__track{
    border-color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496)) !important;
    background:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496)) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch-state{
    min-width:34px;
    color:var(--sadaa-muted,#6b7280);
    font-size:10.5px;
    font-weight:700;
    line-height:1;
    text-align:center;
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch-state::before{content:"إخفاء"}
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch:has(.sadaa-switch__input:checked) .category-visibility-item__mobile-switch-state{
    color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496));
  }
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch:has(.sadaa-switch__input:checked) .category-visibility-item__mobile-switch-state::before{content:"إظهار"}
  html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__toggle{
    display:none !important;
  }
}

/* =========================================================
   Settings refinements v47 — precise corrections after V46
   ========================================================= */

/* General: keep the soft background container, remove only the inner white card shell. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
  padding:14px !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:14px !important;
  background:var(--sadaa-surface,#fff) !important;
  box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035) !important;
}
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section.sadaa-card{
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section__head.sadaa-section-head{
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:10px !important;
}
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section > .settings-form-grid{
  margin:12px 0 0 !important;
}

/* Payment: remove the accumulated outer whitespace around the availability panel. */
html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control__body.settings-inner-box{
  margin:8px !important;
  padding:8px !important;
}
html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control__actions{
  padding:0 8px 8px !important;
}
html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control .settings-switch-row{
  width:100% !important;
  box-sizing:border-box !important;
}

/* ON/OFF controls: give the state label and switch real breathing room. */
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control{
  min-width:104px !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:6px 10px !important;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control .settings-switch-row__state{
  min-width:38px !important;
  margin:0 !important;
}
html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__toggle{
  min-width:104px !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:6px 10px !important;
}
html body #tabContent .settings-tab-ui[data-sub="categories"] .category-strip-setting__switch-label{
  min-width:38px !important;
  margin:0 !important;
  text-align:center !important;
}
html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch{
  min-width:104px !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:6px 10px !important;
}
html body #tabContent .settings-tab-ui[data-sub="categories"] .category-visibility-item__mobile-switch-state{
  min-width:38px !important;
  margin:0 !important;
}

@media (max-width:720px){
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
    padding:10px !important;
    border-radius:12px !important;
    background:var(--sadaa-surface-alt,#FDFBFD) !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  }
}

/* =========================================================
   Settings refinements v48 — exact shell/spacing/switch fixes
   ========================================================= */

/* General: keep the rear soft container, remove the white inner content panel. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
  padding:14px !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:14px !important;
  background:var(--sadaa-surface-alt,#FDFBFD) !important;
  box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035) !important;
}
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section.sadaa-card{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section > .settings-form-grid{
  margin:12px 0 0 !important;
  padding:12px 0 0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Payment availability: restore inner padding, reduce only the outer horizontal gap. */
html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control__body.settings-inner-box{
  margin:12px 0 0 !important;
  padding:12px !important;
  border-inline:0 !important;
  border-radius:0 !important;
}
html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control__actions{
  padding:12px 12px 12px !important;
}

/* VAT switch: compact horizontal control with a clear state label and breathing room. */
html body #tabContent .settings-tab-ui .vat-settings-box .vat-enable-row.settings-switch-row{
  align-items:center !important;
  gap:14px !important;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control{
  --sadaa-switch-width:42px;
  --sadaa-switch-height:24px;
  --sadaa-switch-thumb:16px;
  --sadaa-switch-pad:3px;
  --sadaa-switch-travel:18px;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:nowrap !important;
  gap:9px !important;
  min-width:0 !important;
  min-height:36px !important;
  padding:5px 9px !important;
  border:1px solid var(--sadaa-line-2,#d1d5db) !important;
  border-radius:8px !important;
  background:var(--sadaa-tint-3,#f3f4f6) !important;
  box-sizing:border-box !important;
  white-space:nowrap !important;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control:has(.sadaa-switch__input:checked){
  border-color:var(--sadaa-admin-soft-line,#ded4e1) !important;
  background:var(--sadaa-surface,#fff) !important;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control .sadaa-switch__track{
  flex:0 0 var(--sadaa-switch-width) !important;
  margin:0 !important;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control .settings-switch-row__state{
  flex:0 0 auto !important;
  min-width:34px !important;
  margin:0 !important;
  color:var(--sadaa-muted,#6b7280) !important;
  font-size:10.5px !important;
  font-weight:700 !important;
  line-height:1 !important;
  text-align:center !important;
  white-space:nowrap !important;
}
html body #tabContent .settings-tab-ui .vat-settings-box .settings-switch-control:has(.sadaa-switch__input:checked) .settings-switch-row__state{
  color:var(--sadaa-admin-primary,var(--sadaa-primary,#7C5496)) !important;
}

@media (max-width:720px){
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
    padding:10px !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section > .settings-form-grid{
    margin-top:10px !important;
    padding-top:10px !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control__body.settings-inner-box{
    margin-top:10px !important;
    padding:12px !important;
  }
}

/* =========================================================
   Settings refinements v49 — exact general shell + payment outer gap
   ========================================================= */

/* General: remove the front content shell entirely; keep the dashboard rear container. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Payment availability: restore the original inner breathing room, reduce only the outer gap. */
html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control__body.settings-inner-box{
  margin:12px 8px 10px !important;
  padding:14px !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#e5e7eb)) !important;
  border-radius:10px !important;
  background:var(--sadaa-surface,#fff) !important;
  box-shadow:none !important;
}
html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control__actions{
  padding:0 8px 10px !important;
}

@media (max-width:720px){
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="payment_gateways"] .payment-ad-control__body.settings-inner-box{
    margin:10px 8px 10px !important;
    padding:14px !important;
  }
}

/* =========================================================
   Settings refinements v50 — remove the actual middle box on General
   ========================================================= */

/* Rear container: restore and keep it as the only visible shell. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
  padding:14px !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:14px !important;
  background:var(--sadaa-surface-alt,#FDFBFD) !important;
  box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035) !important;
}

/* Middle white card: remove its generated box entirely, not just its paint. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section.sadaa-card{
  display:contents !important;
}

/* Inner form grids stay transparent and borderless. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section > .settings-form-grid{
  margin:12px 0 0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Preserve visual separation between the two General sections after flattening the middle box. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section--divided > .settings-form-section__head{
  margin-top:14px !important;
}

@media (max-width:720px){
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-content-card{
    padding:10px !important;
    border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
    border-radius:12px !important;
    background:var(--sadaa-surface-alt,#FDFBFD) !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section > .settings-form-grid{
    margin-top:10px !important;
    padding:0 !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-form-section--divided > .settings-form-section__head{
    margin-top:12px !important;
  }
}

/* =========================================================
   Settings visual v51 — General shell replacement (structural)
   The General form replaces the former outer content wrapper.
   ========================================================= */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:14px !important;
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  margin:0 !important;
  padding:14px !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:14px !important;
  background:var(--sadaa-surface-alt,#FDFBFD) !important;
  box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035) !important;
}

/* The old white section boxes no longer act as shells; they are simple content groups. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell > .settings-form-section.sadaa-card{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}

/* Keep each section head as the visual separator, directly inside the new main shell. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell .settings-form-section__head.sadaa-section-head{
  margin:0 !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:10px !important;
  background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc)) !important;
}

/* The field layer remains transparent and borderless, directly under its section head. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell .settings-form-section > .settings-form-grid{
  margin:12px 0 0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell .settings-form-section--divided > .settings-form-section__head{
  margin-top:0 !important;
}

/* Actions belong to the replacement shell, without creating another full-width box. */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell > .settings-form-actions{
  margin:0 -14px -14px !important;
  padding:12px 14px !important;
  border-top:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  background:var(--sadaa-surface-alt,#FDFBFD) !important;
}

html body #tabContent .settings-tab-ui[data-readonly="1"][data-sub="general"] .settings-general-shell{
  pointer-events:none;
  opacity:.72;
}

@media (max-width:720px){
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell{
    gap:12px !important;
    padding:10px !important;
    border-radius:12px !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell .settings-form-section > .settings-form-grid{
    margin-top:10px !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell > .settings-form-actions{
    margin-inline:-10px !important;
    margin-bottom:-10px !important;
    padding:12px 10px !important;
  }
}

/* =========================================================
   Settings visual v53 — General shell white surface + clean corners
   ========================================================= */
html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell{
  background:#fff !important;
  border:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:14px !important;
  overflow:hidden !important;
  box-shadow:0 1px 2px rgba(var(--sadaa-shadow-rgb,17,24,39),.035) !important;
}

html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell > .settings-form-actions{
  margin:0 -14px -14px !important;
  padding:12px 14px !important;
  border-top:1px solid var(--sadaa-admin-line,var(--sadaa-line,#E6DDE9)) !important;
  border-radius:0 0 13px 13px !important;
  background:var(--sadaa-surface-alt,#FDFBFD) !important;
  box-sizing:border-box !important;
}

@media (max-width:720px){
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell{
    background:#fff !important;
    border-radius:12px !important;
    overflow:hidden !important;
  }
  html body #tabContent .settings-tab-ui[data-sub="general"] .settings-general-shell > .settings-form-actions{
    margin:0 -10px -10px !important;
    padding:12px 10px !important;
    border-radius:0 0 11px 11px !important;
  }
}

/* =========================================================
   V55 — 768–1024px refinements for Trial Ads + Pricing.
   ========================================================= */
@media (min-width:721px) and (max-width:1024px){
  /* Trial ads: switches on the right, fields on the left. */
  html body #tabContent .settings-tab-ui .trial-ads-settings-body.settings-inner-box{
    display:grid !important;
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr) !important;
    grid-template-areas:"fields switches" !important;
    gap:14px !important;
    align-items:start !important;
    padding:14px !important;
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-grid{
    grid-area:fields;
    grid-template-columns:1fr !important;
    gap:10px !important;
    margin:0 !important;
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-field{
    padding:12px 14px;
    border:1px solid var(--sadaa-line,#e5e7eb);
    border-radius:10px;
    background:var(--sadaa-surface,#fff);
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-field label{
    margin:0 0 7px !important;
    font-size:12.75px !important;
    line-height:1.55 !important;
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-switches{
    grid-area:switches;
    grid-template-columns:1fr !important;
    gap:10px !important;
    margin:0 !important;
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-switches .settings-switch-row{
    min-height:72px !important;
    padding:12px 14px !important;
    border:1px solid var(--sadaa-line,#e5e7eb) !important;
    border-radius:10px !important;
    background:var(--sadaa-surface,#fff) !important;
    box-shadow:none !important;
  }
  html body #tabContent .settings-tab-ui .trial-ads-settings-switches .settings-switch-row__label{
    line-height:1.6 !important;
  }

  /* Pricing rates: image card on the right, video card on the left. */
  html body #tabContent .settings-tab-ui .pricing-rates-section__body.settings-inner-box{
    padding:14px !important;
  }
  html body #tabContent .settings-tab-ui .pricing-rate-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-template-areas:"video image" !important;
    gap:12px !important;
    align-items:stretch !important;
  }
  html body #tabContent .settings-tab-ui .pricing-rate-grid > .banner-pricing-form:first-child{grid-area:image}
  html body #tabContent .settings-tab-ui .pricing-rate-grid > .banner-pricing-form:last-child{grid-area:video}
  html body #tabContent .settings-tab-ui .banner-pricing-form{
    grid-template-columns:1fr !important;
    gap:10px !important;
    align-items:start !important;
    padding:14px !important;
    border:1px solid var(--sadaa-line,#e5e7eb);
    border-radius:10px;
    background:var(--sadaa-surface,#fff);
    min-height:100%;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-form .form-group{
    margin:0 !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-form label{
    margin:0 0 7px !important;
    line-height:1.7 !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-form .sadaa-btn{
    width:100% !important;
    justify-content:center !important;
    margin:0 !important;
  }

  /* Pricing equation: tighten and anchor the icon more cleanly. */
  html body #tabContent .settings-tab-ui .banner-pricing-equation__head{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:12px !important;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-equation__head > div{
    flex:1 1 auto;
    min-width:0;
  }
  html body #tabContent .settings-tab-ui .banner-pricing-equation__icon{
    align-self:flex-start !important;
    margin:1px 0 0 !important;
  }
}

/* =========================================================
   V57 — Settings subnav breathing room at laptop / 1440px.
   11 tabs => 7 on the first row + 4 on the second row.
   ========================================================= */
@media (min-width:1101px) and (max-width:1440px){
  html body #tabContent .settings-tab-ui .settings-subnav.sadaa-tabs{
    grid-template-columns:repeat(7,minmax(0,1fr)) !important;
    gap:7px !important;
  }
  html body #tabContent .settings-tab-ui .settings-subnav .sadaa-tab{
    min-width:0 !important;
    padding-inline:10px !important;
  }
}

/* =========================================================
   Member / My Stores — Featured service info trigger + modal
   Page-scoped to avoid affecting any other member tab.
   ========================================================= */
body.sadaa-modal-open{overflow:hidden}
.member-stores-page .member-stores-feature-heading{
  display:inline-flex;
  align-items:center;
  gap:4px;
  vertical-align:middle;
}
.member-stores-page .member-stores-feature-info-trigger{
  width:14px;
  height:14px;
  min-width:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:1px solid #fdba74;
  border-radius:50%;
  background:#fff7ed;
  color:#ea580c;
  font-size:6px;
  line-height:1;
  cursor:pointer;
  transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease;
}
.member-stores-page .member-stores-feature-info-trigger:hover{
  border-color:#fb923c;
  background:#ffedd5;
  color:#c2410c;
}
.member-stores-page .member-stores-feature-info-trigger:focus-visible{
  outline:none;
  border-color:#f97316;
  box-shadow:0 0 0 2px rgba(249,115,22,.18);
}
.member-stores-page .member-stores-feature-info-trigger:active{transform:scale(.96)}
.member-stores-page .member-stores-feature-info-trigger i{margin:0;line-height:1}

.member-store-feature-info-modal .member-store-feature-info-heading{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.member-store-feature-info-modal .member-store-feature-info-icon{
  width:36px;
  height:36px;
  min-width:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #fdba74;
  border-radius:50%;
  background:#fff7ed;
  color:#ea580c;
  font-size:13px;
}
.member-store-feature-info-modal .member-store-feature-benefits{
  display:grid;
  gap:10px;
}
.member-store-feature-info-modal .member-store-feature-benefit{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:10px;
  align-items:start;
  padding:12px;
  border:1px solid var(--sadaa-line,#e5e7eb);
  border-radius:9px;
  background:var(--sadaa-surface,#fff);
}
.member-store-feature-info-modal .member-store-feature-benefit__icon{
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:rgba(var(--sadaa-primary-rgb),.08);
  color:var(--sadaa-primary,#7C5496);
  font-size:13px;
}
.member-store-feature-info-modal .member-store-feature-benefit strong{
  display:block;
  margin:0;
  color:var(--sadaa-text,#111827);
  font-size:13.5px;
  font-weight:600;
  line-height:1.65;
}
.member-store-feature-info-modal .member-store-feature-benefit p{
  margin:3px 0 0;
  color:var(--sadaa-muted,#6b7280);
  font-size:12px;
  line-height:1.8;
}
.member-store-feature-info-modal .member-store-feature-benefits-note{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin:12px 0 0;
  padding:10px 11px;
  border:1px solid var(--sadaa-admin-soft-line,var(--sadaa-line,#e5e7eb));
  border-radius:8px;
  background:var(--sadaa-admin-soft,var(--sadaa-surface-alt,#f8fafc));
  color:var(--sadaa-text-2,#4b5563);
  font-size:11.5px;
  line-height:1.75;
}
.member-store-feature-info-modal .member-store-feature-benefits-note > i{
  margin-top:4px;
  color:var(--sadaa-primary,#7C5496);
}

@media (max-width:600px){
  .member-stores-page .member-stores-feature-heading{gap:4px}
  .member-stores-page .member-stores-feature-info-trigger{
    width:14px;
    height:14px;
    min-width:14px;
    font-size:6px;
  }
  .member-store-feature-info-modal .sadaa-modal__dialog{
    border-radius:12px;
  }
  .member-store-feature-info-modal .member-store-feature-benefit{
    grid-template-columns:32px minmax(0,1fr);
    gap:9px;
    padding:11px;
  }
  .member-store-feature-info-modal .member-store-feature-benefit__icon{
    width:32px;
    height:32px;
    border-radius:8px;
    font-size:12px;
  }
}

/* SADAA V70 — home screen install (mobile/tablet; centralized components) */
.main-header .site-share-install[hidden],
.main-footer .sadaa-footer-install[hidden],
.sadaa-install-dialog[hidden] { display:none !important; }
.main-header .site-share-install i {
  color:var(--sadaa-primary,#7C5496);
  background:rgba(var(--sadaa-primary-rgb,124,84,150),.08);
  border-color:rgba(var(--sadaa-primary-rgb,124,84,150),.16);
}
.main-footer .footer-links nav button.sadaa-footer-install {
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:6px 18px 6px 8px;
  color:var(--footer-text,inherit);
  background:transparent;
  border:0;
  border-bottom:1px solid rgba(var(--sadaa-brand-deep-rgb,44,27,74),.065);
  font:inherit;
  font-size:14.5px;
  font-weight:400;
  line-height:1.7;
  text-align:right;
  cursor:pointer;
}
.main-footer .footer-links nav button.sadaa-footer-install:hover,
.main-footer .footer-links nav button.sadaa-footer-install:focus-visible {
  color:var(--sadaa-primary,#7C5496);
}
.sadaa-install-dialog {
  box-sizing:border-box;
  position:fixed;
  inset:0;
  margin:auto;
  width:min(92vw,420px);
  max-width:420px;
  max-height:calc(100dvh - 32px);
  padding:0;
  border:1px solid #e5e7eb;
  border-radius:16px;
  background:#fff;
  color:#1f2937;
  box-shadow:0 20px 60px rgba(15,23,42,.18);
  overflow:auto;
  font-family:var(--site-font-family,inherit);
}
.sadaa-install-dialog:not([open]) { display:none !important; }
.sadaa-install-dialog::backdrop { background:rgba(15,23,42,.53); }
.sadaa-install-dialog__inner {position:relative; padding:24px; text-align:center;}
.sadaa-install-dialog__close {
  position:absolute;
  inset-inline-start:12px;
  top:9px;
  width:36px;
  height:36px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#64748b;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.sadaa-install-dialog__close:hover {background:#f3f4f6;}
.sadaa-install-dialog__icon {width:66px; height:66px; border-radius:14px; object-fit:cover; display:block; margin:0 auto 12px;}
.sadaa-install-dialog h2 {font-size:19px; font-weight:700; line-height:1.6; margin:0 0 10px; color:#1f2937;}
.sadaa-install-dialog p {font-size:14.5px; line-height:2; margin:0 0 18px; color:#475569;}
/* V71: short RTL instructions for Huawei / Samsung / Apple and other devices */
.sadaa-install-dialog__steps {
  display:grid;
  gap:9px;
  margin:0 0 14px;
  padding:0 23px 0 0;
  text-align:right;
  font-size:14px;
  line-height:1.85;
  color:#334155;
}
.sadaa-install-dialog__steps li {padding-right:4px;}
.sadaa-install-dialog p.sadaa-install-dialog__note {
  margin:0 0 17px;
  padding:9px 11px;
  border-radius:8px;
  background:#f8fafc;
  color:#64748b;
  font-size:12.5px;
  line-height:1.8;
  text-align:right;
}
.sadaa-install-dialog__note[hidden] {display:none !important;}

.sadaa-install-dialog__ok {
  display:block;
  width:100%;
  min-height:44px;
  border:0;
  border-radius:8px;
  background:var(--sadaa-primary,#7C5496);
  color:#fff;
  font:inherit;
  font-weight:600;
  cursor:pointer;
}
.sadaa-install-dialog__ok:hover {filter:brightness(.94);}
@media(max-width:480px) {
  .sadaa-install-dialog__inner {padding:22px 18px 18px;}
  .sadaa-install-dialog h2 {font-size:17px;}
}