/* Menu lateral do PAINEL do profissional (2026-10-04) — um arquivo só pras 10
   páginas do painel (antes cada uma carregava uma cópia do mesmo CSS simples).
   Marca fixa do Meu Protocolo (azul -> verde), igual ao e-mail e à landing:
   o painel nunca segue o preset de cor do aluno. Variáveis das páginas com
   fallback, porque nem toda página define todas. Bump o ?v= do <link> a cada
   mudança (a CDN segura o mesmo nome por horas). */

.drawer-overlay{position:fixed;inset:0;z-index:400;background:rgba(15,20,28,.5);display:none;opacity:0;transition:opacity .25s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.drawer-overlay.show{display:block;opacity:1}

.side-drawer{position:fixed;top:0;right:0;bottom:0;width:86%;max-width:320px;z-index:401;display:flex;flex-direction:column;overflow:hidden;
  background:var(--bg,#F8F9FA);border-radius:24px 0 0 24px;box-shadow:-14px 0 40px rgba(15,20,28,.28);
  transform:translateX(105%);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.side-drawer.show{transform:translateX(0)}

/* Cabeçalho de marca: quem está logado + plano */
.drawer-head{position:relative;flex-shrink:0;overflow:hidden;color:#fff;
  padding:calc(env(safe-area-inset-top) + 20px) 18px 20px;
  background:linear-gradient(135deg,var(--primary,#2D6BE4),var(--accent,#1E8C64))}
.drawer-head::before{content:'';position:absolute;right:-50px;top:-60px;width:190px;height:190px;border-radius:50%;background:rgba(255,255,255,.12)}
.drawer-head::after{content:'';position:absolute;right:30px;bottom:-70px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.08)}
.drawer-close{position:absolute;z-index:2;top:calc(env(safe-area-inset-top) + 12px);right:12px;width:32px;height:32px;border-radius:50%;border:none;background:rgba(255,255,255,.18);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;font-size:0}
.drawer-close svg{width:16px;height:16px}
.drawer-close:active{background:rgba(255,255,255,.3)}
.dh-profile{position:relative;z-index:1;display:flex;align-items:center;gap:13px;padding-right:38px}
.dh-avatar{width:52px;height:52px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:800;color:#fff;background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.55);text-transform:uppercase}
.dh-txt{min-width:0}
.dh-name{font-size:16.5px;font-weight:800;line-height:1.25;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dh-plan{display:inline-block;margin-top:5px;font-size:11px;font-weight:700;letter-spacing:.2px;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.2);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dh-plan:empty{display:none}

.drawer-scroll{flex:1;overflow-y:auto;padding:16px 12px 8px;-webkit-overflow-scrolling:touch}

/* Troca de modo: mesmo lugar e mesmo destaque nos dois sentidos */
.drawer-mode{display:flex;align-items:center;gap:12px;width:100%;padding:13px 14px;margin:0 0 6px;border-radius:16px;
  background:linear-gradient(135deg,var(--primary,#2D6BE4),var(--primary-dim,#1E4FB0));color:#fff;text-decoration:none;
  box-shadow:0 10px 22px -12px rgba(45,107,228,.75);font-family:var(--font,inherit);cursor:pointer;border:none;text-align:left}
.drawer-mode:active{transform:scale(.985)}
.drawer-mode .dm-ico{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.drawer-mode .dm-ico svg{width:19px;height:19px}
.drawer-mode .dm-txt{flex:1;min-width:0}
.drawer-mode .dm-t{display:block;font-size:14px;font-weight:800;line-height:1.2}
.drawer-mode .dm-s{display:block;font-size:11.5px;opacity:.82;margin-top:2px}
.drawer-mode .dm-arrow{width:18px;height:18px;flex-shrink:0;opacity:.9}

.drawer-sec-label{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:1.2px;color:var(--faint,#94A0AF);margin:16px 10px 6px}
.drawer-nav{display:flex;flex-direction:column;gap:3px;padding:0}

.drawer-item{position:relative;display:flex;align-items:center;gap:12px;width:100%;background:none;border:none;padding:9px 10px;border-radius:14px;
  font-family:var(--font,inherit);font-size:14px;font-weight:600;color:var(--text,#1E2A3A);cursor:pointer;text-align:left;text-decoration:none;transition:background .15s ease}
.drawer-item:active{background:var(--card,#fff)}
.drawer-item .di-ico{width:36px;height:36px;border-radius:11px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  background:var(--card,#fff);color:var(--muted,#63707F);box-shadow:0 1px 2px rgba(20,30,45,.06);border:1px solid var(--card-border,rgba(20,30,45,.05))}
.drawer-item .di-ico svg{width:18px;height:18px}
.drawer-item.active{background:var(--card,#fff);color:var(--primary,#2D6BE4);box-shadow:0 1px 2px rgba(20,30,45,.04),0 8px 18px -12px rgba(20,30,45,.18)}
.drawer-item.active::before{content:'';position:absolute;left:-12px;top:50%;width:4px;height:22px;margin-top:-11px;border-radius:0 4px 4px 0;background:var(--primary,#2D6BE4)}
.drawer-item.active .di-ico{background:linear-gradient(135deg,var(--primary,#2D6BE4),var(--primary-dim,#1E4FB0));color:#fff;border-color:transparent;box-shadow:0 6px 14px -6px rgba(45,107,228,.7)}

.drawer-foot{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 14px calc(env(safe-area-inset-bottom) + 14px);border-top:1px solid var(--line,#E9EBEF);background:var(--card,#fff)}
.drawer-logout{display:flex;align-items:center;gap:9px;background:none;border:none;padding:8px 10px;margin-left:-6px;border-radius:12px;font-family:var(--font,inherit);font-size:14px;font-weight:700;color:var(--danger,#C0392B);cursor:pointer}
.drawer-logout svg{width:18px;height:18px}
.drawer-logout:active{background:rgba(192,57,43,.08)}
.drawer-brand{font-size:11px;font-weight:700;letter-spacing:.3px;color:var(--faint,#94A0AF)}
