/* ===========================================================================
   Meniul „Aplicații” — v1. SURSA: dentequip-panou/web/meniu-aplicatii.css
   Copie identică în fiecare aplicație. Toate clasele încep cu „mapl-”, ca să nu
   se bată cu stilurile aplicației gazdă. Pe telefon (lat ≤ 640 px) și pe ecrane
   scunde (telefon întors, înalt ≤ 500 px) lista coboară de sus, pe toată lățimea,
   cu ✕, și se derulează în ea însăși — doar din CSS, fără poziționare calculată în JS.
   Butonul are 36 px pe ecran mare și 42 px sub 641 px (țintă pentru deget). O
   aplicație îl poate schimba cu --mapl-inaltime, pusă în PROPRIA ei foaie pe
   containerul meniului (ex. .topbar .right{--mapl-inaltime:29px}), ca butonul să
   încapă în bara ei fără s-o îngroașe. Evaluare rezervă aceeași înălțime în Tailwind
   (src/app/admin/(panel)/layout.tsx): dacă se schimbă aici, se schimbă și acolo.
   Textul are ≥ 4,5:1 pe fundalul lui real (alb, rând sub cursor, rând curent pe
   tinta --cs), pictogramele și săgețile ≥ 3:1: banca verificari/test_meniu.py
   măsoară fiecare pereche. Textul secundar (titlu, adrese, săgeți, ✕) are un
   singur gri, --mapl-soft.
   =========================================================================== */
.mapl{position:relative;display:inline-flex;vertical-align:top;font-size:14px;line-height:1.4;
  --mapl-ink:#1e2a3a;--mapl-soft:#5b6b82;--mapl-border:#e3e8f0;--mapl-teal:#0e7881;--mapl-teal-s:#e3f4f5}
.mapl,.mapl *{box-sizing:border-box}
.mapl [hidden]{display:none !important}
.mapl svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mapl .mapl-btn{display:inline-flex;align-items:center;gap:8px;width:auto;height:auto;min-height:var(--mapl-inaltime,36px);margin:0;padding:0 13px;border-radius:10px;
  border:1px solid var(--mapl-border);background:#fff;color:var(--mapl-ink);font:inherit;font-size:13.5px;font-weight:600;
  line-height:1.2;cursor:pointer;box-shadow:none;white-space:nowrap}
.mapl .mapl-btn:hover,.mapl .mapl-btn[aria-expanded="true"]{border-color:var(--mapl-teal);background:var(--mapl-teal-s);color:var(--mapl-teal)}
.mapl.mapl-intunecat .mapl-btn{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.22);color:#fff}
.mapl.mapl-intunecat .mapl-btn:hover,.mapl.mapl-intunecat .mapl-btn[aria-expanded="true"]{background:rgba(255,255,255,.19);border-color:rgba(255,255,255,.4);color:#fff}
.mapl .mapl-btn:focus-visible,.mapl .mapl-el:focus-visible,.mapl .mapl-x:focus-visible{outline:2px solid var(--mapl-teal);outline-offset:2px}
.mapl.mapl-intunecat .mapl-btn:focus-visible{outline-color:#fff}
.mapl .mapl-fundal{position:fixed;inset:0;background:rgba(15,34,48,.28);z-index:9998}
.mapl .mapl-lista{position:absolute;top:calc(100% + 8px);right:0;left:auto;width:318px;max-height:calc(100vh - 90px);overflow:auto;
  padding:8px;background:#fff;border:1px solid var(--mapl-border);border-radius:16px;z-index:9999;text-align:left;color:var(--mapl-ink);
  box-shadow:0 2px 6px rgba(16,30,54,.08),0 24px 60px rgba(16,30,54,.16)}
.mapl.mapl-la-stanga .mapl-lista{left:0;right:auto}
.mapl .mapl-cap{display:flex;align-items:center;justify-content:space-between;padding:6px 6px 6px 10px}
.mapl .mapl-titlu{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mapl-soft)}
.mapl .mapl-x{display:none;margin:0;padding:8px;border:0;border-radius:10px;background:none;color:var(--mapl-soft);cursor:pointer}
.mapl .mapl-el{--c:var(--mapl-teal);--cs:var(--mapl-teal-s);display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:11px;
  color:var(--mapl-ink);text-decoration:none}
.mapl .mapl-el:hover{background:#f8fafc}
.mapl .mapl-el.mapl-aici{background:var(--cs)}
.mapl .mapl-ic{width:36px;height:36px;border-radius:10px;background:var(--cs);color:var(--c);display:grid;place-items:center;flex:none}
.mapl .mapl-txt{display:flex;flex-direction:column;min-width:0}
.mapl .mapl-txt b{font-size:14.5px;font-weight:650;color:var(--mapl-ink)}
.mapl .mapl-txt small{font-size:12px;color:var(--mapl-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mapl .mapl-aici-et{margin-left:auto;font-size:11.5px;font-weight:700;color:var(--c);white-space:nowrap}
.mapl .mapl-sag{margin-left:auto;color:var(--mapl-soft)}
.mapl .mapl-sag svg{width:16px;height:16px}
.mapl .mapl-sep{height:1px;margin:6px 8px;background:var(--mapl-border)}
.mapl .mapl-panou{--c:#334155;--cs:#eef1f6}
.mapl .mapl-service{--c:#0e7881;--cs:#e3f4f5}
.mapl .mapl-contracte{--c:#2461e7;--cs:#e8effd}
.mapl .mapl-studenti{--c:#c2410c;--cs:#fdeee4}
.mapl .mapl-evaluare{--c:#7c3aed;--cs:#f1ebfe}
@media (max-width:640px){
  .mapl .mapl-btn{min-height:42px;padding:9px 11px}
  .mapl .mapl-btn-text{display:none}
}
/* foaia de sus: și pe ecrane scunde (telefon întors, 844×390). Lista de desktop atârnă sub buton și are `max-height` din
   înălțimea ferestrei, dar CSS nu știe cât de jos stă butonul, deci iese pe sub ecran; foaia, prinsă de sus, încape mereu. */
@media (max-width:640px),(max-height:500px){
  .mapl .mapl-lista,.mapl.mapl-la-stanga .mapl-lista{position:fixed;top:0;left:0;right:0;width:auto;max-height:100vh;max-height:100dvh;
    border-top:0;border-radius:0 0 18px 18px;padding:8px 10px 14px}
  .mapl .mapl-x{display:grid;place-items:center;min-width:42px;min-height:42px}
  .mapl .mapl-el{min-height:52px;padding:11px 10px}
}