/* ================================================================ منصة نصيح — header pieces (SaaS installations only) */
.sa-wrap{position:relative;display:flex;align-items:center;gap:10px;padding-inline-start:14px;border-inline-start:1px solid var(--line,#DDEBFA)}
.sa-wrap svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sa-bell{position:relative;width:40px;height:40px;border-radius:12px;border:1px solid #DDEBFA;background:#fff;display:grid;place-items:center;cursor:pointer;color:#1F5FAE}
.sa-bell:hover{border-color:#1F5FAE}
.sa-bell svg{width:20px;height:20px}
.sa-bell em{position:absolute;top:-6px;left:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#D2453B;color:#fff;font:700 11px/16px Tahoma,sans-serif;font-style:normal;border:2px solid #fff;text-align:center}
.sa-user{display:flex;align-items:center;gap:8px;border:0;background:none;cursor:pointer;padding:2px;border-radius:12px;text-align:right;color:#0B2A6B}
.sa-user:hover{background:#F3F7FC}
.sa-user > span{width:36px;height:36px;flex:none;border-radius:50%;display:grid;place-items:center;background:#0A3B78;color:#fff;font-size:12px;font-weight:700}
.sa-user div{display:flex;flex-direction:column;line-height:1.3}.sa-user b{font-size:13px;white-space:nowrap}.sa-user small{font-size:11px;color:#6E83A6;white-space:nowrap}
.sa-pop{position:absolute;top:calc(100% + 10px);left:0;z-index:120;background:#fff;border:1px solid #E2EBF6;border-radius:16px;box-shadow:0 24px 50px -18px rgba(10,40,90,.4);overflow:hidden;font-family:'Plex Arabic',Tahoma,sans-serif;color:#0B2A6B}
.sa-notif{width:min(400px,calc(100vw - 32px))}
.sa-notif > header,.sa-notif > footer{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font-size:13px}
.sa-notif > footer{border-top:1px solid #EEF3FA;justify-content:center}
.sa-notif a{color:#0A74F0;text-decoration:none}
.sa-link{border:0;background:none;color:#0A74F0;font-size:12.5px;cursor:pointer;padding:0}
.sa-tabs{display:flex;gap:4px;padding:0 12px 8px}
.sa-tabs button{border:0;background:#F3F7FC;border-radius:999px;padding:4px 12px;font-size:12px;color:#4C6390;cursor:pointer}
.sa-tabs button.on{background:#0A3B78;color:#fff}
.sa-list{list-style:none;margin:0;padding:0;max-height:min(420px,60vh);overflow:auto}
.sa-list li{display:flex;gap:10px;padding:11px 16px;border-top:1px solid #EEF3FA;cursor:default}
.sa-list li.u{background:#F7FAFF;cursor:pointer}
.sa-list li.u b::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#1F6FEB;margin-inline-start:6px;vertical-align:middle}
.sa-list li > i{width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center;background:#EEF5FE;color:#1F6FEB}
.sa-list li > i svg{width:18px;height:18px}
.sa-list li.crit > i{background:#FDEEEC;color:#C53B3B}.sa-list li.warn > i{background:#FFF3DF;color:#B07200}.sa-list li.k-security > i{background:#EEF1F7;color:#3C5683}
.sa-list li div{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.sa-list li b{font-size:13px}.sa-list li span{font-size:12px;color:#6E83A6;line-height:1.55}.sa-list li em{font-style:normal;font-size:11px;color:#9FB0C8}
.sa-list .sa-empty{justify-content:center;color:#9FB0C8;font-size:13px;padding:24px}
.sa-menu{width:260px;padding:8px}
.sa-mh{display:flex;flex-direction:column;padding:8px 10px 10px;border-bottom:1px solid #EEF3FA;margin-bottom:6px}.sa-mh b{font-size:14px}.sa-mh small{font-size:11.5px;color:#6E83A6}
.sa-usage{display:flex;flex-direction:column;gap:3px;padding:8px 10px;margin-bottom:6px;border-radius:10px;background:#F6F9FD;font-size:12px;color:#6E83A6}
.sa-usage b{font-size:14px;color:#0B2A6B}.sa-usage i{display:block;height:6px;border-radius:999px;background:#E3EAF4;overflow:hidden}.sa-usage u{display:block;height:100%;background:#1F6FEB;border-radius:999px}
.sa-warn{font-size:12px;padding:7px 10px;margin-bottom:6px;border-radius:10px;background:#FFF6E6;color:#8A5A00}
.sa-menu a,.sa-menu button{display:flex;align-items:center;gap:10px;width:100%;height:40px;padding:0 10px;border:0;background:none;border-radius:10px;font:inherit;font-size:13px;color:#0B2A6B;cursor:pointer;text-decoration:none}
.sa-menu a:hover,.sa-menu button:hover{background:#F3F7FC}
.sa-menu svg{width:18px;height:18px;color:#3C5683}
.sa-menu button[data-sa="logout"]{color:#B42F28}.sa-menu button[data-sa="logout"] svg{color:#B42F28}
@media (max-width:800px){ .sa-user div{display:none} .sa-wrap{padding-inline-start:8px} }