/* ============================================================
   VADE MECUM GT — estilos da camada de acesso e anotações
   Prefixo .vmg- para não colidir com o CSS dos módulos.
   ============================================================ */

/* ---------- barra de status ---------- */
.vmg-bar{
  position:sticky; top:0; z-index:9999;
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap;
  padding:.45rem 1rem;
  background:linear-gradient(135deg,#0a0d12,#1a1224);
  border-bottom:1px solid rgba(200,150,60,.3);
  font-family:'Segoe UI',system-ui,-apple-system,sans-serif;
  font-size:12.5px; color:rgba(255,255,255,.72);
  box-shadow:0 2px 14px rgba(0,0,0,.22);
}
.vmg-bar-l,.vmg-bar-r{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}

.vmg-badge{
  font-size:10px; font-weight:700; letter-spacing:1.1px;
  padding:.16rem .6rem; border-radius:999px; white-space:nowrap;
}
.vmg-b-gold{background:rgba(200,150,60,.16);color:#e4b86a;border:1px solid rgba(200,150,60,.5)}
.vmg-b-free{background:rgba(39,96,160,.18);color:#8fb8e8;border:1px solid rgba(39,96,160,.5)}
.vmg-b-vis {background:rgba(255,255,255,.07);color:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.16)}

.vmg-who{font-weight:600;color:rgba(255,255,255,.85)}
.vmg-hint{color:rgba(255,255,255,.45);font-size:12px}

.vmg-link{
  color:rgba(255,255,255,.7); text-decoration:none;
  padding:.28rem .7rem; border-radius:6px;
  border:1px solid rgba(255,255,255,.18); font-size:11.5px;
}
.vmg-link:hover{background:rgba(255,255,255,.08);color:#fff}

.vmg-cta{
  background:linear-gradient(135deg,#9a6e1e,#c8963c);
  color:#fff !important; text-decoration:none;
  padding:.3rem .82rem; border-radius:6px;
  font-size:11.5px; font-weight:700; letter-spacing:.4px;
  box-shadow:0 2px 10px rgba(200,150,60,.32);
  white-space:nowrap;
}
.vmg-cta:hover{filter:brightness(1.12)}

@media(max-width:620px){
  .vmg-bar{font-size:11.5px;padding:.4rem .7rem}
  .vmg-hint{display:none}
}

/* ---------- cadeado nos cards pagos ---------- */
.vmg-locked{position:relative}
.vmg-locked::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  background:rgba(10,13,18,.05); pointer-events:none;
}
.vmg-lock{
  position:absolute; top:.6rem; right:.6rem; z-index:2;
  background:linear-gradient(135deg,#1a1224,#0a0d12);
  color:#e4b86a; border:1px solid rgba(200,150,60,.55);
  font-size:10px; font-weight:700; letter-spacing:.5px;
  padding:.2rem .55rem; border-radius:999px; white-space:nowrap;
  box-shadow:0 2px 8px rgba(0,0,0,.25);
}

/* ---------- editor de anotações ---------- */
.member-editor.vmg-on{
  min-height:96px; cursor:text;
  border:1.5px solid rgba(200,150,60,.42) !important;
  border-radius:8px; padding:.7rem .85rem;
  background:#fffdf7; color:#1d1d1d;
  transition:border-color .18s, box-shadow .18s;
  outline:none;
}
html[data-theme="dark"] .member-editor.vmg-on{background:#1a1c22;color:#e8e6e0}

.member-editor.vmg-on:focus{
  border-color:#c8963c !important;
  box-shadow:0 0 0 3px rgba(200,150,60,.16);
}
.member-editor.vmg-on:empty::before{
  content:attr(data-placeholder);
  color:#a8a29a; font-style:italic; pointer-events:none;
}
.member-editor.vmg-dirty{border-color:#b45209 !important}
.member-editor.vmg-saving{opacity:.72}
.member-editor.vmg-saved{
  border-color:#1a7f37 !important;
  box-shadow:0 0 0 3px rgba(26,127,55,.14);
}

.member-toolbar.vmg-off{opacity:.34;pointer-events:none;filter:grayscale(1)}

/* ---------- status da anotação ---------- */
.member-status.vmg-status-ok{
  color:#1a7f37; font-size:11.5px; margin-top:.45rem;
}
.member-status.vmg-status-lock{
  background:rgba(200,150,60,.09);
  border:1px solid rgba(200,150,60,.3);
  border-radius:7px; padding:.55rem .8rem;
  font-size:12.5px; line-height:1.5; margin-top:.5rem;
}
.member-status.vmg-status-lock a{
  color:#9a6e1e; font-weight:700; text-decoration:underline;
}
html[data-theme="dark"] .member-status.vmg-status-lock a{color:#e4b86a}

/* marca artigos que já têm anotação */
details.vmg-tem-nota > summary{position:relative}
details.vmg-tem-nota > summary::after{
  content:'●'; color:#c8963c; font-size:11px; margin-left:.4rem;
}

/* ---------- toast ---------- */
.vmg-toast{
  position:fixed; bottom:22px; left:50%;
  transform:translate(-50%,26px);
  background:#0a0d12; color:#e8e6e0;
  border:1px solid rgba(200,150,60,.45);
  border-left:3px solid #c8963c;
  padding:.65rem 1.15rem; border-radius:9px;
  font-family:'Segoe UI',system-ui,sans-serif; font-size:13px;
  box-shadow:0 8px 30px rgba(0,0,0,.35);
  opacity:0; pointer-events:none; z-index:10000;
  transition:opacity .22s, transform .22s;
}
.vmg-toast.show{opacity:1;transform:translate(-50%,0)}
.vmg-toast.err{border-left-color:#b03048;border-color:rgba(176,48,72,.5)}