/* ============================================================
   Drones Hub — الهيدر الموحّد v3  (2026-09-23)
   القيم منقولة من هيدر الصفحة الرئيسية للـ Hub (index.html):
   Cairo · تبويبات 0.78rem/700 · خط ذهبي تحت التبويب النشط ·
   شعار 0.96rem/900 + سطر 0.7rem/600 · شارة «المنصة متاحة».
   ============================================================ */

/* ---------- 1) إظهار الهيدر الأصلي وإخفاء الشريط المختصر لطبقة 3D ---------- */
body.duae-unified-page > header:not(.duae-site-header){
  display:block !important; position:sticky !important;
  top:max(14px, env(safe-area-inset-top)); z-index:110 !important }
body.duae-unified-page > .duae-site-header,
body.duae-unified-page > .duae-mobile-menu{ display:none !important }

/* القائمة القديمة تبقى في HTML (روابط ثابتة) وتُستبدل بصرياً بـ .hubnav */
header:not(.duae-site-header) #nav{ display:none !important }
header .hend .ctabtn,
header .brandcaret{ display:none !important }

/* ---------- 2) الخط: Cairo كالرئيسية ---------- */
header:not(.duae-site-header),
header:not(.duae-site-header) button,
header:not(.duae-site-header) input,
.hubnav-panel{ font-family:"Cairo", system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif }

/* ---------- 3) الشعار بسطرين ---------- */
header #brandName{ display:grid !important; line-height:1.25; text-align:start }
header #brandName strong{ font-size:.96rem; font-weight:900; letter-spacing:.02em; color:#302f2c }
header #brandName small{ font-size:.7rem; font-weight:600; color:#605b53 }

/* ---------- 4) التبويبات ---------- */
.hubnav{ display:flex; align-items:center; gap:2px; margin-inline:auto; min-width:0 }
.hubnav-grp{ position:relative }
header .hubnav .hubnav-link{
  position:relative; display:inline-flex; align-items:center; gap:4px;
  padding:10px 12px; margin:0; border:0 !important; border-radius:12px !important;
  background:transparent !important; box-shadow:none !important; transform:none !important;
  color:#605b53 !important; font-family:inherit; font-size:.78rem !important; font-weight:700 !important;
  line-height:normal; white-space:nowrap; cursor:pointer; text-decoration:none;
  transition:color .18s ease, background .18s ease }
header .hubnav .hubnav-link::after{
  content:""; position:absolute; inset-inline:14px; inset-block-end:5px; height:1px;
  background:linear-gradient(90deg,transparent,#c0975b,transparent);
  transform:scaleX(0); transition:transform .18s ease }
header .hubnav .hubnav-link:hover,
header .hubnav .hubnav-link[aria-current="page"],
header .hubnav .hubnav-grp.is-current > .hubnav-link,
header .hubnav .hubnav-grp.is-open > .hubnav-link{ color:#302f2c !important; background:rgba(238,233,224,.055) !important }
header .hubnav .hubnav-link:hover::after,
header .hubnav .hubnav-link[aria-current="page"]::after,
header .hubnav .hubnav-grp.is-current > .hubnav-link::after,
header .hubnav .hubnav-grp.is-open > .hubnav-link::after{ transform:scaleX(1) }
header .hubnav .hubnav-link:focus-visible{ outline:2px solid #876130; outline-offset:2px }
.hubnav-btn i{ font-style:normal; font-size:.72em; opacity:.6 }

/* ---------- 5) القوائم المنسدلة ---------- */
.hubnav-drop{
  position:absolute; top:calc(100% + 12px); inset-inline-start:0; z-index:130;
  min-width:220px; padding:6px; display:none;
  background:#fffdf9; border:1px solid #d9d0c2; border-radius:14px;
  box-shadow:0 22px 54px rgba(75,65,51,.20) }
.hubnav-grp.is-open > .hubnav-drop{ display:block }
.hubnav-grp.is-open > .hubnav-drop.has-cols{ display:grid; grid-template-columns:repeat(2, minmax(190px, auto)); gap:2px 8px }
.hubnav-item{
  display:block; padding:.5rem .72rem; border-radius:10px; color:#302f2c; text-decoration:none;
  font-size:.84rem; font-weight:700; white-space:nowrap; line-height:1.45 }
.hubnav-item:hover,.hubnav-item:focus-visible{ background:rgba(192,151,91,.14); outline:none }
.hubnav-item[aria-current="page"]{ background:rgba(192,151,91,.22); box-shadow:inset 0 0 0 1px #c0975b }
.hubnav-item.is-sub{ padding-inline-start:1.35rem; font-size:.8rem; font-weight:600; color:#605b53 }
.hubnav-head{ display:block; padding:.5rem .72rem .15rem; font-size:.7rem; font-weight:800; color:#8a7a62 }

/* ---------- 6) شارة «المنصة متاحة» ---------- */
.hubnav-status{
  display:inline-flex; align-items:center; gap:8px; padding:8px 10px; color:#302f2c;
  background:rgba(48,108,76,.08); border:1px solid rgba(48,108,76,.2); border-radius:999px;
  font-size:.7rem; font-weight:800; white-space:nowrap }
.hubnav-status::before{
  content:""; width:7px; aspect-ratio:1; background:#306c4c; border-radius:50%;
  box-shadow:0 0 12px #306c4c; animation:hubpulse 1.8s ease-in-out infinite }
@keyframes hubpulse{ 50%{ opacity:.35 } }

/* ---------- 7) زر البحث: عدسة دائرية ---------- */
header .searchbtn{
  border-radius:50% !important; font-size:0 !important;
  background: var(--khw-search) center/44% 44% no-repeat,
    radial-gradient(circle at 33% 25%,#fffdf9 0%,#f3eee5 24%,#e6dfd2 56%,#a89a84 100%) !important;
  border:1px solid #c7bba9 !important;
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset, 0 -3px 8px rgba(75,65,51,.10) inset, 0 3px 8px rgba(75,65,51,.12) !important }

/* ---------- 8) الهاتف: زر قائمة + لوحة ---------- */
.hubnav-burger{
  display:none; width:44px; height:44px; flex:0 0 auto; padding:0; cursor:pointer;
  place-content:center; gap:4px; border-radius:50%;
  background:linear-gradient(#fffdf9,#f0e9dc); border:1px solid #c7bba9 }
.hubnav-burger span{ display:block; width:18px; height:2px; border-radius:2px; background:#3d352b; transition:transform .2s, opacity .2s }
.hubnav-burger.is-open span:nth-child(1){ transform:translateY(6px) rotate(45deg) }
.hubnav-burger.is-open span:nth-child(2){ opacity:0 }
.hubnav-burger.is-open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg) }
body.duae-unified-page > .hubnav-panel,
.hubnav-panel{
  position:fixed !important; z-index:140 !important; inset-inline:10px; top:84px;
  max-height:calc(100svh - 110px); overflow:auto; padding:8px; display:none;
  background:#fffdf9; border:1px solid #d9d0c2; border-radius:18px;
  box-shadow:0 22px 54px rgba(75,65,51,.22) }
body.duae-unified-page > .hubnav-panel.is-open,
.hubnav-panel.is-open{ display:block }
.hubnav-sec{ padding:4px 0; border-bottom:1px solid #eee7da }
.hubnav-sec:last-child{ border-bottom:0 }
.hubnav-sechead{ display:block; padding:.55rem .72rem .2rem; font-size:.78rem; font-weight:900; color:#7d5324 }
.hubnav-top{ font-weight:900 }

@media (max-width:1240px){ .hubnav-status{ display:none } }
@media (max-width:960px){
  .hubnav{ display:none }
  .hubnav-burger{ display:inline-grid }
}
@media (max-width:760px){
  body.duae-unified-page > header:not(.duae-site-header){ top:max(8px, env(safe-area-inset-top)) }
}
@media (max-width:520px){
  header #brandName small{ display:none }
  header #brandName strong{ font-size:.84rem }
}
@media (prefers-reduced-motion:reduce){ .hubnav-status::before{ animation:none } }

/* عناصر القوائم: محاذاة للبداية دائماً */
.hubnav-drop .hubnav-item,.hubnav-panel .hubnav-item{ text-align:start; border:0; box-shadow:none }
.hubnav-panel .hubnav-item[aria-current="page"],.hubnav-drop .hubnav-item[aria-current="page"]{ box-shadow:inset 0 0 0 1px #c0975b }
