/* الجوال: عناصر اللوحة الجانبية مخفية — الشعار في الشريط العلوي والاسم في التذييل */
@media (max-width: 999px) {
  .adm-brand, .adm-owner { display: none !important; }
}
/* إدلال برو — تخطيط لوحة التحكم على الشاشات العريضة.
   الخدمات ثابتة في اليمين، والمحتوى يُعرض في اليسار.
   كل ما دون 1000px يبقى كما هو تمامًا — لا يمسّ الجوال. */

@media (min-width: 1000px) {

  /* يوسّع صفحة الإدارة وحدها دون غيرها */
  body:has(.adm-shell) main { max-width: min(1980px, 98vw) !important; }

  .adm-shell {
    gap: 26px !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
  }

  /* ───── الشريط الجانبي (يمين) ───── */
  .adm-side {
    flex: 0 0 268px;
    width: 268px !important;
    min-width: 268px !important;
    background: rgba(255,255,255,.055);
    border-color: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 16px;
    padding: 18px 14px !important;
    gap: 5px !important;
    align-self: flex-start;
    position: sticky;
    top: 16px;
    box-shadow: 0 14px 40px rgba(0,0,0,.45);
    border-left: 2px solid var(--accent, rgba(255,255,255,.18));
  }

  .adm-brand {
    text-align: center;
    padding: 2px 6px 16px;
    border-bottom: 1px solid rgba(255,255,255,.12);
    margin-bottom: 14px;
  }
  .adm-brand .b-elm { height: 42px; width: auto; display: block; margin: 0 auto 18px; }
  .adm-brand .b-edl { height: 58px; width: auto; display: block; margin: 0 auto 9px; }
  .adm-brand .b-reg { display: block; font-size: 12.5px; color: var(--accent, #9dc5ff); line-height: 1.6; font-weight: 600; }

  /* أزرار الخدمات */
  .adm-side .btn {
    text-align: right !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    padding: 11px 13px !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    color: rgba(255,255,255,.86) !important;
    width: 100%;
    transition: background .14s, border-color .14s;
  }
  .adm-side .btn:hover {
    background: rgba(255,255,255,.09) !important;
    border-color: rgba(255,255,255,.14) !important;
  }
  /* زر الدعم يبقى مميّزًا */
  .adm-side a.btn[href="support.php"] {
    background: rgba(180,83,9,.26) !important;
    border-color: rgba(245,158,11,.42) !important;
    color: #fcd9a0 !important;
    margin-top: 8px;
  }
  .adm-side a.btn[href="support.php"]:hover { background: rgba(180,83,9,.42) !important; }

  /* اسم المالك — أسفل القائمة دائمًا */
  .adm-owner {
    margin-top: 16px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.12);
    text-align: center;
  }
  .adm-owner span {
    display: block; font-size: 12.5px; letter-spacing: 1px;
    color: var(--accent, #c9a227); font-weight: 700; margin-bottom: 8px;
  }
  .adm-owner b { display: block; font-size: 22px; color: #fff; font-weight: 800; line-height: 1.5; }
  .adm-owner i {
    display: block; font-style: normal; font-size: 14px; font-weight: 600;
    letter-spacing: 1.4px; color: rgba(255,255,255,.78); margin-top: 6px;
  }

  /* ───── منطقة العرض (يسار) ───── */
  .adm-main { min-width: 0 !important; }

  /* عنوان القسم المفتوح يصير ترويسة لا زرًا */
  .adm-main .admin-tab-d > summary {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 2px solid rgba(255,255,255,.14) !important;
    border-radius: 0 !important;
    padding: 0 0 12px !important;
    margin: 0 0 18px !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    display: block !important;
    width: 100%;
    cursor: default;
  }
  /* الأقسام المغلقة تختفي — الاختيار من اليمين */
  .adm-main .admin-tab-d:not([open]) { display: none; }

  .adm-main .admin-tab-d[open] {
    background: rgba(0,0,0,.22);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 16px;
    padding: 22px 24px;
    box-shadow: 0 10px 34px rgba(0,0,0,.28);
  }
  .adm-main .admin-section-body { margin-top: 0 !important; }

  /* شريط الأدوات العلوي */
  .admin-row[style*="repeat(auto-fit,minmax(160px,1fr))"] {
    display: flex !important;
    gap: 9px !important;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .admin-row[style*="repeat(auto-fit,minmax(160px,1fr))"] .btn {
    font-size: 13.5px !important;
    padding: 9px 15px !important;
  }

  /* نماذج أوسع تستفيد من المساحة */
  .adm-main .admin-row { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important; }
  .adm-main .violations { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
  .adm-main .violations > article { margin-bottom: 0 !important; }
}

/* شاشات واسعة جدًا: ثلاثة أعمدة للبطاقات */
@media (min-width: 1500px) {
  .adm-main .violations { grid-template-columns: 1fr 1fr 1fr; }
}

@media (min-width: 1000px) {
  
  .adm-side .btn.adm-on {
    background: rgba(255,255,255,.17) !important;
    border-color: rgba(255,255,255,.34) !important;
    color: #fff !important;
    box-shadow: inset -3px 0 0 var(--accent, #5E9CFF);
  }
  /* بطاقة تفعيل الإشعارات لا تزاحم اللوحة على اللابتوب */
  body:has(.adm-shell) #pushCard { padding: 12px 16px !important; }
  body:has(.adm-shell) #pushCard h3 { margin-bottom: 6px !important; font-size: 16px !important; }
}

/* في وضع الإدارة على اللابتوب: تُضغط البطاقات العلوية ليبدأ الدashboard أعلى */
@media (min-width: 1000px) {
  body:has(.adm-shell) .card.head { padding: 12px 18px !important; margin-bottom: 12px !important; }
  body:has(.adm-shell) .card.head > p:first-of-type { display: none; }
  body:has(.adm-shell) .card.head .tabbar { margin: 0 !important; }
  body:has(.adm-shell) #pushCard { margin-bottom: 12px !important; }
  body:has(.adm-shell) section.card:has(.adm-shell) { padding-top: 18px !important; }
}

/* مجموعة الروابط الخارجية أسفل الخدمات */
.adm-links { display: flex; flex-direction: column; gap: 8px; }
@media (min-width: 1000px) {
  .adm-links {
    gap: 5px; margin-top: 10px; padding-top: 12px;
    border-top: 1px solid rgba(255,255,255,.12);
  }
  .adm-links .btn { text-align: right !important; }
}

/* استثمار المساحة على الشاشات العريضة */
@media (min-width: 1400px) {
  .adm-side { flex: 0 0 300px; width: 300px !important; min-width: 300px !important; }
  .adm-main .admin-tab-d[open] { padding: 26px 30px; }
  .adm-main table { width: 100% !important; }
  .adm-main .field { font-size: 15.5px; }
}