/* appheader.css — الهيدر الموحّد لكل صفحات النظام (نفس هوية صفحة المجموعات).
   مستقل بذاته: يعرّف ظلال احتياطية ولا يعتمد على ds-core.css.
   الأنماط مبنية على .apphead / .navseg / .hicons لتتغلّب على قواعد header القديمة العامة. */
:root{
  --sh-1:0 1px 2px rgba(15,23,42,.05);
  --sh-2:0 1px 2px rgba(15,23,42,.04), 0 8px 22px -12px rgba(30,41,99,.16);
  --sh-3:0 2px 4px rgba(15,23,42,.05), 0 18px 44px -16px rgba(30,41,99,.24);
}
/* إعادة ضبط أي قاعدة header عامة قديمة */
header.apphead{display:block; margin:0; border:0; min-height:0}
.apphead{position:sticky; top:0; z-index:30; background:color-mix(in srgb,var(--surface,#fff) 88%,transparent); backdrop-filter:saturate(180%) blur(10px); color:var(--ink,#1a2233); border-bottom:1px solid var(--line,#e6e9ef); box-shadow:var(--sh-1)}
.apphead-in{max-width:1280px; margin:0 auto; padding:6px 18px; display:flex; align-items:center; gap:14px}
.apphead .appbrand{display:flex; align-items:center; gap:10px; min-width:0; flex:0 0 auto}
.apphead .appbrand .pagemark{width:34px; height:34px; min-width:34px; border-radius:10px; background:linear-gradient(140deg,var(--accent,#4f46e5),var(--accent-2,#7c3aed)); color:#fff; display:grid; place-items:center; font-weight:800; font-size:16px; line-height:1; flex:0 0 auto; box-shadow:var(--sh-1)}
.apphead .appbrand b{font-size:15px; font-weight:800; letter-spacing:-.01em; display:block; line-height:1.15; white-space:nowrap; color:var(--ink,#1a2233)}
.apphead .appbrand span{font-size:11px; color:var(--muted,#7a8399)}

.apphead .navseg{display:inline-flex; gap:2px; background:var(--surface-2,#f6f8fd); border:1px solid var(--line,#e6e9ef); border-radius:999px; padding:3px; margin:0 auto; flex:0 1 auto; min-width:0; flex-wrap:wrap}
.apphead .navseg a{display:inline-flex; align-items:center; position:relative; font-size:12px; font-weight:600; color:var(--muted,#7a8399); text-decoration:none; padding:7px 9px; border-radius:999px; transition:.16s var(--ease,ease); white-space:nowrap}
.apphead .navseg a svg{width:16px; height:16px; flex:0 0 auto}
.apphead .navseg a .nl{white-space:nowrap; overflow:hidden}
.apphead .navseg a.active{background:var(--accent,#4f46e5); color:#fff; box-shadow:var(--sh-1)}
.apphead .navseg a.active .nl{max-width:140px; opacity:1; margin-inline-start:7px}
.apphead .navseg a:not(.active) .nl{position:absolute; top:calc(100% + 7px); left:50%; transform:translateX(-50%) translateY(-4px); background:var(--ink,#1a2233); color:var(--bg,#fff); font-size:11px; font-weight:700; line-height:1.2; padding:5px 9px; border-radius:8px; opacity:0; pointer-events:none; transition:opacity .14s var(--ease,ease), transform .14s var(--ease,ease); z-index:40; box-shadow:var(--sh-2)}
.apphead .navseg a:not(.active) .nl::after{content:""; position:absolute; bottom:100%; left:50%; transform:translateX(-50%); border:5px solid transparent; border-bottom-color:var(--ink,#1a2233)}
.apphead .navseg a:not(.active):hover{background:color-mix(in srgb,var(--accent,#4f46e5) 10%,transparent); color:var(--accent,#4f46e5)}
.apphead .navseg a:not(.active):hover .nl{opacity:1; transform:translateX(-50%) translateY(0)}

.apphead .headclock{display:inline-flex; align-items:center; gap:8px; padding:5px 11px; border-radius:12px; border:1px solid var(--line,#e6e9ef); background:var(--surface-2,#f6f8fd); flex:0 0 auto; color:var(--muted,#7a8399)}
.apphead .headclock svg{width:17px; height:17px; color:var(--accent,#4f46e5); flex:0 0 auto}
.apphead .headclock .hc-txt{display:flex; flex-direction:column; line-height:1.12; gap:3px}
.apphead .headclock .hc-time{font-size:13px; font-weight:800; color:var(--ink,#1a2233); font-variant-numeric:tabular-nums; letter-spacing:.02em}
.apphead .headclock .hc-date{font-size:10px; color:var(--muted,#7a8399); font-variant-numeric:tabular-nums}

.apphead .hicons{display:inline-flex; align-items:center; gap:6px; flex:0 0 auto; flex-wrap:nowrap}
.apphead .hicon{width:36px; height:36px; border-radius:11px; border:1px solid var(--line,#e6e9ef); background:var(--surface-2,#f6f8fd); color:var(--muted,#7a8399); cursor:pointer; display:grid; place-items:center; transition:.16s var(--ease,ease); font-size:15px; padding:0}
.apphead .hicon:hover{color:var(--accent,#4f46e5); border-color:var(--accent,#4f46e5); background:var(--surface,#fff); transform:translateY(-1px); box-shadow:var(--sh-1)}
.apphead .hicon svg{width:18px; height:18px}
.apphead .hicon.danger:hover{color:var(--danger,#d64545); border-color:var(--danger,#d64545); background:color-mix(in srgb,var(--danger,#d64545) 8%,var(--surface,#fff))}

@media(max-width:900px){
  .apphead .headclock{display:none}
  .apphead .navseg{order:3; flex:1 1 100%; justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; margin-top:6px}
}