﻿/* ===== Global Header (RTL-friendly, sticky) ===== */
.gh{
  position: sticky; top: 0; z-index: 1000;
  display:flex; align-items:center; gap:10px;
  padding:10px 12px; background:#fff; border-bottom:1px solid #e5e7eb;
}

/* Brand (logo + name) */
.gh__brand{display:inline-flex; align-items:center; gap:8px; text-decoration:none; color:inherit; font-weight:700; letter-spacing:.2px}
.gh__logo{font-size:1.05rem}
.gh__name{font-size:1rem}

/* Primary nav sits NEXT to brand (start side in RTL) */
.gh__nav{display:flex; align-items:center; gap:8px; margin-inline-start:12px; flex-wrap:wrap}

/* Push actions block to FAR-LEFT (end side in RTL) */
.gh__actions{display:flex; align-items:center; gap:8px; margin-inline-start:auto}

/* Links with icon + label */
.gh__link{
  display:inline-flex; align-items:center; gap:6px;
  padding:.35rem .7rem; border:1px solid #e5e7eb; border-radius:9999px;
  background:#fff; text-decoration:none; color:inherit; line-height:1;
}
.gh__link:hover{background:#f8fafc; border-color:#d1d5db}
.gh__link--muted{opacity:.6; cursor:not-allowed}
.gh__divider{display:inline-block; width:1px; height:20px; background:#e5e7eb; margin:0 6px}

/* Icon buttons / avatar */
.gh__iconbtn{
  position:relative; background:#fff; border:1px solid #e5e7eb; border-radius:10px; padding:.3rem .45rem; line-height:1;
}
.gh__badge{
  position:absolute; inset-inline-start:-4px; top:-4px;
  display:inline-flex; align-items:center; justify-content:center;
  min-width:16px; height:16px; padding:0 4px; border-radius:9999px;
  background:#ef4444; color:#fff; font-size:.7rem
}
.gh__avatar{
  width:30px; height:30px; border-radius:9999px; border:1px solid #e5e7eb; background:#fff;
  display:inline-flex; align-items:center; justify-content:center
}
.gh__avatar__init{font-size:.85rem; opacity:.85}

/* Dropdowns */
.gh__dropdown{position:relative}
.gh__menu{
  position:absolute; inset-inline-end:0; top:calc(100% + 6px);
  min-width:220px; background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.08); display:none; overflow:hidden
}
.gh__menu.show{display:block}
.gh__menu__header{padding:8px 10px; font-weight:700; border-bottom:1px solid #f0f2f4; background:#fafbfc}
.gh__menu__body{max-height:260px; overflow:auto}
.gh__menu__footer{padding:8px; border-top:1px solid #f0f2f4; text-align:center}
.gh__menu__item{display:block; padding:8px 10px; text-decoration:none; color:inherit}
.gh__menu__item:hover{background:#f8fafc}
.gh__empty{padding:14px; text-align:center; color:#6b7280}

/* Mobile */
@media (max-width:768px){
  .gh{flex-wrap:wrap}
  .gh__nav{margin-inline-start:0}
  .gh__nav .gh__link span{display:none}     /* تظهر الأيقونة فقط لضيق المساحة */
}
