/* =====================================================
   ANELTA — APP SHELL (assets/css/app-shell.css)
   Estilos partilhados por TODAS as páginas da app:
   tokens de design, topbar, drawer, dropdown de
   utilizador e bottom-nav. Incluir uma única vez em
   cada página, a seguir aos estilos base do body.
===================================================== */

:root{
  --g:#7C0A24;
  --g2:#9B1030;
  --gl:#fdf2f4;
  --gb:#f0c4cc;
  --gold:#B8872E;
  --gold-l:#f0c96a;
  --ink:#1C1917;
  --smoke:#F5F3F0;
  --muted:#78716C;
  --card:#ffffff;
  --border:rgba(0,0,0,.08);
  --rb:12px;
  --rl:18px;
  --nav-h:60px;
  --top-h:56px;
  --ff-d:'Sora', system-ui, sans-serif;
  --ff-b:'DM Sans', system-ui, sans-serif;
  --safe-b:env(safe-area-inset-bottom, 0px);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-tap-highlight-color:transparent;}
body{
  font-family:var(--ff-b);background:var(--smoke);color:var(--ink);
  font-size:14px;line-height:1.55;overflow-x:hidden;
  padding-bottom:calc(var(--nav-h) + var(--safe-b) + 16px);
}
a{text-decoration:none;color:inherit;}
img{display:block;max-width:100%;}
button{font-family:var(--ff-b);cursor:pointer;border:none;background:none;}

.topbar{
  position:sticky;top:0;z-index:200;height:var(--top-h);
  background:var(--card);border-bottom:1px solid var(--border);
  display:flex;align-items:center;padding:0 16px;gap:10px;
}
.topbar-logo{
  display:flex;align-items:center;gap:7px;
  font-family:var(--ff-d);font-size:1.05rem;font-weight:700;color:var(--ink);
}
.topbar-logo-mark{
  width:28px;height:28px;border-radius:8px;background:var(--g);
  display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;
}
.topbar-logo-mark img{width:100%;height:100%;object-fit:contain;}
.topbar-logo-mark svg{width:14px;height:14px;fill:#fff;}
.topbar-logo em{color:var(--g);font-style:normal;}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:6px;}
.tb-ico{
  width:36px;height:36px;border-radius:10px;
  background:var(--smoke);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;
  color:var(--muted);font-size:15px;position:relative;cursor:pointer;
  transition:background .15s,transform .15s;
}
.tb-ico:active{background:var(--gl);transform:scale(.93);}
.notif-dot{
  position:absolute;top:7px;right:7px;width:6px;height:6px;border-radius:50%;
  background:#ef4444;border:1.5px solid var(--card);
}
.tb-av{
  width:34px;height:34px;border-radius:50%;background:var(--g);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-d);font-size:.82rem;font-weight:600;cursor:pointer;
  transition:transform .15s;
}
.tb-av:active{transform:scale(.92);}

.drawer-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.45);
  z-index:300;opacity:0;pointer-events:none;transition:opacity .25s;
}
.drawer-overlay.open{opacity:1;pointer-events:all;}
.drawer{
  position:fixed;top:0;left:0;bottom:0;width:min(280px,85vw);
  background:var(--ink);z-index:301;display:flex;flex-direction:column;
  transform:translateX(-100%);
  transition:transform .28s cubic-bezier(.25,.46,.45,.94);
  overflow-y:auto;
}
.drawer.open{transform:translateX(0);}
.drawer::-webkit-scrollbar{width:0;}
.dr-logo{
  padding:18px 16px 14px;border-bottom:1px solid rgba(255,255,255,.07);
  display:flex;align-items:center;gap:8px;
}
.dr-logo-mark{
  width:28px;height:28px;border-radius:8px;background:var(--g);
  display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;
}
.dr-logo-mark img{width:100%;height:100%;object-fit:contain;}
.dr-logo-mark svg{width:14px;height:14px;fill:#fff;}
.dr-logo-text{font-family:var(--ff-d);font-size:.95rem;font-weight:700;color:#fff;letter-spacing:.03em;}
.dr-logo-text em{color:var(--gold-l);font-style:normal;}
.dr-close{
  margin-left:auto;width:30px;height:30px;border-radius:8px;
  background:rgba(255,255,255,.07);
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.6);font-size:14px;cursor:pointer;
}
.dr-user{
  margin:12px 12px 8px;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09);border-radius:10px;
  padding:11px 12px;display:flex;align-items:center;gap:9px;
}
.dr-av{
  width:34px;height:34px;border-radius:50%;background:var(--g);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-d);font-size:.85rem;font-weight:600;color:#fff;flex-shrink:0;
}
.dr-name{font-size:.8rem;font-weight:500;color:#e7e5e4;line-height:1.2;}
.dr-role{font-size:.7rem;color:rgba(255,255,255,.4);margin-top:1px;}
.dr-nav{padding:4px 8px;flex:1;}
.dr-group{
  font-size:.62rem;font-weight:600;color:rgba(255,255,255,.3);
  text-transform:uppercase;letter-spacing:.1em;padding:12px 8px 4px;
}
.dr-link{
  display:flex;align-items:center;gap:9px;
  padding:9px 10px;border-radius:9px;
  color:rgba(255,255,255,.5);font-size:.82rem;font-weight:400;
  margin-bottom:1px;cursor:pointer;
  transition:background .15s,color .15s;
}
.dr-link i{font-size:15px;min-width:16px;}
.dr-link:hover,.dr-link:active{background:rgba(255,255,255,.07);color:rgba(255,255,255,.85);}
.dr-link.act{background:var(--g);color:#fff;font-weight:500;}
.dr-badge{
  margin-left:auto;font-size:.62rem;background:rgba(255,255,255,.15);color:#fff;
  padding:1px 7px;border-radius:20px;
}
.dr-link.act .dr-badge{background:rgba(255,255,255,.25);}
.dr-link.highlight{color:var(--gold-l);background:rgba(184,135,46,.15);}
.dr-foot{padding:10px;border-top:1px solid rgba(255,255,255,.07);}
.dr-foot-link{
  display:flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:8px;
  color:rgba(255,255,255,.4);font-size:.8rem;cursor:pointer;
  transition:background .15s,color .15s;
}
.dr-foot-link:active{background:rgba(255,255,255,.07);color:rgba(255,255,255,.75);}
.dr-foot-link.danger:active{color:#f87171;}
.dr-foot-link i{font-size:14px;}

.dd-wrap{position:relative;}
.dd-menu{
  position:absolute;top:calc(100% + 8px);right:0;
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--rb);min-width:200px;z-index:500;
  display:none;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.dd-menu.open{display:block;animation:dd-in .18s ease both;}
@keyframes dd-in{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:translateY(0);}}
.dd-info{padding:11px 13px;border-bottom:1px solid var(--border);}
.dd-info strong{display:block;font-size:.84rem;font-weight:500;}
.dd-info small{font-size:.73rem;color:var(--muted);}
.dd-link{
  display:flex;align-items:center;gap:8px;
  padding:10px 13px;font-size:.82rem;color:var(--ink);
  border-bottom:1px solid var(--border);cursor:pointer;
}
.dd-link:last-child{border:none;}
.dd-link:active{background:var(--gl);}
.dd-link i{font-size:14px;color:var(--muted);}
.dd-link.danger{color:#ef4444;}
.dd-link.danger i{color:#ef4444;}

.bottom-nav{
  position:fixed;bottom:0;left:0;right:0;
  height:calc(var(--nav-h) + var(--safe-b));
  background:var(--card);border-top:1px solid var(--border);
  display:flex;align-items:flex-start;padding-top:6px;
  z-index:200;padding-bottom:var(--safe-b);
}
.bn-item{
  flex:1;display:flex;flex-direction:column;align-items:center;
  gap:3px;cursor:pointer;color:var(--muted);
  font-size:.65rem;font-weight:500;transition:color .15s,transform .15s;
  padding:4px 0;position:relative;
}
.bn-item:active{transform:scale(.92);}
.bn-item i{font-size:20px;}
.bn-item.act{color:var(--g);}
.bn-dot{
  position:absolute;top:2px;right:calc(50% - 14px);
  width:6px;height:6px;border-radius:50%;
  background:#ef4444;border:1.5px solid var(--card);
}

.page{padding:16px 14px 0;display:flex;flex-direction:column;gap:16px;}
.empty{padding:36px 16px;text-align:center;color:var(--muted);font-size:.83rem;}
.empty i{font-size:32px;margin-bottom:10px;display:block;opacity:.35;}
.empty strong{display:block;color:var(--ink);margin-bottom:4px;font-size:.88rem;}

@media(min-width:600px){.page{padding:18px 18px 0;}}
@media(min-width:992px){
  body{padding-bottom:0;}
  .bottom-nav{display:none;}
  .page{max-width:900px;margin:0 auto;padding:28px 24px 48px;}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}