/* رتّل — القائمةُ الجانبيّةُ الموحَّدةُ لكلِّ صفحاتِ المالك (js/owner-nav.js).
   كانت أنماطُها داخلَ <style> لوحةِ المالكِ وحدَها، وبقيّةُ الصفحاتِ بلا قائمة
   (رابطُ «رجوع» فقط). نُقلت هنا كما هي بصرياً (أبيض، روابطُ رماديّة، النشطُ
   مُظلَّلٌ بالفيروزيّ) لتحملها كلُّ صفحة. المقاساتُ من owner-design-tokens.css. */

#owner-sidebar.owner-sidebar {
  position: fixed; top: 0; bottom: 0; right: 0; z-index: 50;
  width: 268px; display: flex; flex-direction: column;
  background: #fff !important; color: #0f172a !important;
  border-left: 1px solid rgba(15,23,42,.08) !important;
  font-family: 'Tajawal', system-ui, sans-serif;
  transition: transform .25s ease;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
#owner-sidebar [data-owner-nav] { flex: 1; overflow-y: auto; padding: .5rem 0; margin: 0; }
#owner-sidebar .side-brand { display: flex; align-items: center; gap: .6rem; padding: 1.05rem 1.1rem; border-bottom: 1px solid rgba(15,23,42,.08); color: #0f172a !important; text-decoration: none; }
#owner-sidebar .side-brand-icon { width: 40px; height: 40px; border-radius: var(--r-lg, 16px); background: #047857; display: flex; align-items: center; justify-content: center; padding: 6px; color: #fff; font-weight: 900; flex: none; }
#owner-sidebar .side-brand-name { font-weight: 900; line-height: 1.2; margin: 0; }
#owner-sidebar .side-brand-sub { font-size: var(--fs-xs, 12px); color: #5b6878 !important; margin: 0; }
#owner-sidebar .side-group-label { padding: .95rem .95rem .3rem; margin: 0; font-size: var(--fs-2xs, 11px); font-weight: 800; letter-spacing: .06em; color: #5b6878 !important; }
#owner-sidebar .side-link { display: flex; align-items: center; gap: .7rem; margin: .12rem .5rem; padding: .62rem .78rem; border-radius: var(--r-lg, 16px); color: #475569 !important; font-weight: 700; font-size: var(--fs-md, 14px); text-decoration: none; transition: .15s; min-height: 42px; background: transparent; border: 0; font-family: inherit; cursor: pointer; }
#owner-sidebar .side-link svg { width: 19px; height: 19px; flex: none; color: #94a3b8 !important; }
#owner-sidebar .side-link:hover { background: rgba(13,148,136,.08); color: #0f172a !important; }
#owner-sidebar .side-link:focus-visible { outline: 2px solid #0f766e; outline-offset: 2px; }
#owner-sidebar .side-link.active { background: #e6f4f2; color: #115e59 !important; box-shadow: inset 0 0 0 1px rgba(13,148,136,.22); }
#owner-sidebar .side-link.active svg { color: #0d9488 !important; }
#owner-sidebar .side-foot { border-top: 1px solid rgba(15,23,42,.08); padding: .5rem; }
#owner-sidebar .side-logout { width: calc(100% - 1rem); text-align: right; color: #991b1b !important; background: #fdf2f2; }
#owner-sidebar .side-logout svg { color: #b91c1c !important; }

/* الصفحةُ تُفسح للقائمة على الشاشات العريضة. */
body.has-owner-nav { padding-right: 268px; }

.owner-scrim { position: fixed; inset: 0; background: rgba(2,7,6,.55); backdrop-filter: blur(2px); z-index: 40; opacity: 0; visibility: hidden; transition: .2s; }
.owner-scrim.show { opacity: 1; visibility: visible; }

/* مكانُ زرِّ القائمة في ترويسةِ كلِّ صفحة: لا يشغل حيّزاً حين يُخفى الزرّ. */
span[data-owner-nav-burger] { display: contents; }
.owner-nav-title { display: flex; align-items: center; gap: 10px; min-width: 0; }

.owner-burger { display: none; align-items: center; justify-content: center; width: 40px; height: 40px; flex: none; border-radius: var(--r-md, 12px); border: 1px solid rgba(15,23,42,.14); background: rgba(255,255,255,.92); color: #0f172a; cursor: pointer; padding: 0; }
.owner-burger:focus-visible { outline: 2px solid #0f766e; outline-offset: 2px; }
.owner-burger-float { position: fixed; top: 10px; right: 10px; z-index: 45; box-shadow: var(--e-2, 0 12px 28px rgba(15,23,42,.05)); }

@media (max-width: 1023px) {
  body.has-owner-nav { padding-right: 0; }
  #owner-sidebar.owner-sidebar { transform: translateX(100%); box-shadow: -24px 0 60px rgba(15,23,42,.25); }
  #owner-sidebar.owner-sidebar.open { transform: translateX(0); }
  .owner-burger { display: inline-flex; }
}

/* محرّرُ الصفحة ملءُ الشاشة: القائمةُ درجٌ يُفتح من زرِّ الشريطِ العلويّ على كلِّ عرض. */
#owner-sidebar.owner-sidebar.owner-sidebar--drawer { transform: translateX(100%); box-shadow: -24px 0 60px rgba(15,23,42,.25); }
#owner-sidebar.owner-sidebar.owner-sidebar--drawer.open { transform: translateX(0); }
.owner-burger.owner-burger--always { display: inline-flex; }

@media (prefers-reduced-motion: reduce) {
  #owner-sidebar.owner-sidebar, #owner-sidebar .side-link, .owner-scrim { transition: none !important; animation: none !important; }
}
