/* ============================================================
   Notify — sistema global de mensagens (toast topo)
   Tipos: success | error | info | warn | confirm
============================================================ */

#notify-root{
  position:fixed;top:18px;left:0;right:0;z-index:9999;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  pointer-events:none;padding:0 14px;
}

.notify{
  pointer-events:auto;
  min-width:280px;max-width:460px;width:auto;
  display:flex;align-items:flex-start;gap:12px;
  padding:13px 16px;border-radius:14px;
  background:rgba(20,20,40,.92);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  color:#f5f5ff;font:500 13.5px/1.4 'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  box-shadow:0 18px 50px -18px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.04) inset;
  transform:translateY(-18px);opacity:0;
  animation:notifyIn .35s cubic-bezier(.2,.8,.2,1) forwards;
  position:relative;overflow:hidden;
}
.notify.leaving{animation:notifyOut .28s ease forwards}

@keyframes notifyIn{to{transform:none;opacity:1}}
@keyframes notifyOut{to{transform:translateY(-16px);opacity:0}}

.notify::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:var(--nf-accent,#8b5cf6);
}
.notify .nf-ic{
  flex-shrink:0;width:20px;height:20px;color:var(--nf-accent,#8b5cf6);
  margin-top:1px;
}
.notify .nf-ic svg{width:20px;height:20px}
.notify .nf-body{flex:1;min-width:0}
.notify .nf-title{font-weight:600;font-size:13.5px;margin-bottom:2px}
.notify .nf-msg{color:#d4d4e8;font-size:13px}
.notify .nf-close{
  flex-shrink:0;background:transparent;border:none;color:#9ca3af;
  cursor:pointer;padding:2px;border-radius:6px;line-height:0;
  transition:color .2s,background .2s;
}
.notify .nf-close:hover{color:#fff;background:rgba(255,255,255,.08)}
.notify .nf-close svg{width:14px;height:14px}

.notify .nf-bar{
  position:absolute;left:0;right:0;bottom:0;height:2px;
  background:var(--nf-accent,#8b5cf6);
  transform-origin:left center;animation:nfBar linear forwards;
  opacity:.7;
}
@keyframes nfBar{from{transform:scaleX(1)}to{transform:scaleX(0)}}

/* tipos */
.notify.success{--nf-accent:#10b981}
.notify.error  {--nf-accent:#f43f5e}
.notify.info   {--nf-accent:#06b6d4}
.notify.warn   {--nf-accent:#f59e0b}
.notify.confirm{--nf-accent:#8b5cf6}

/* confirm (sim/não) */
.notify.confirm{flex-direction:column;align-items:stretch;min-width:320px}
.notify.confirm .nf-row{display:flex;align-items:flex-start;gap:12px}
.notify.confirm .nf-actions{
  display:flex;justify-content:flex-end;gap:8px;margin-top:12px;
}
.notify .nf-btn{
  border:none;cursor:pointer;padding:8px 16px;border-radius:9px;
  font:600 12.5px 'Inter',system-ui,sans-serif;letter-spacing:.02em;
  transition:transform .15s,opacity .2s,background .2s;
}
.notify .nf-btn:hover{transform:translateY(-1px)}
.notify .nf-btn.no{background:rgba(255,255,255,.08);color:#e5e7eb}
.notify .nf-btn.no:hover{background:rgba(255,255,255,.14)}
.notify .nf-btn.yes{background:linear-gradient(135deg,#8b5cf6,#06b6d4);color:#fff}
.notify .nf-btn.yes.danger{background:linear-gradient(135deg,#f43f5e,#e11d48)}

@media (max-width:480px){
  #notify-root{top:12px}
  .notify{min-width:0;width:100%;max-width:100%}
  .notify.confirm{min-width:0}
}
