/*--------------------------------------------------------------
# header.css — Tikito Tattoo — Sidebar esquerda (nav-side-bar)
# Usado por: includes/header.php + index.php (embutido)
--------------------------------------------------------------*/
.layout-shell{
  position:relative;width:100%;
}
.layout-shell .page-wrap{
  max-width:1280px;margin:0 auto;
}
.nav-side-bar{
  width:230px;
  display:flex;flex-direction:column;
  position:absolute;left:48px;top:20px;
  opacity:0;
  animation:navSideIn .65s .15s var(--ease) forwards;
  z-index:350;
}
@keyframes navSideIn{
  from{opacity:0;transform:translateX(-24px)}
  to{opacity:1;transform:translateX(0)}
}
.nav-side-bar .nav-logo-outside{
  height:92px;width:auto;margin:0 auto 20px;display:block;
}
.nav-side-panel{
  width:100%;
  background:rgba(201,169,97,.05);
  border:1.5px solid rgba(201,169,97,.22);
  border-radius:16px;
  padding:10px;
  display:flex;flex-direction:column;gap:2px;
}
.nav-side-panel-user{
  display:flex;align-items:center;gap:10px;
  padding:10px 10px 12px;
  font-size:.85rem;font-weight:700;color:#fff;
}
.nav-side-panel-login{
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:11px;border-radius:10px;margin-bottom:4px;
  background:rgba(201,169,97,.1);border:1.5px solid rgba(201,169,97,.3);
  color:var(--gold-light);font-weight:700;font-size:.82rem;
  text-decoration:none;transition:.25s;
}
.nav-side-panel-login:hover{background:var(--gold);color:#000;border-color:var(--gold)}
.nav-side-panel-divider{
  height:1px;margin:8px 4px;
  background:linear-gradient(90deg,transparent,rgba(201,169,97,.25),transparent);
}
.nav-side-link{
  display:flex;align-items:center;gap:12px;width:100%;text-align:left;
  padding:11px 12px;border-radius:10px;
  color:rgba(255,255,255,.68);text-decoration:none;
  font-weight:600;font-size:.85rem;letter-spacing:.2px;
  transition:all .25s var(--ease);
  background:none;border:none;cursor:pointer;font-family:inherit;
}
.nav-side-link i{font-size:.85rem;color:var(--gold);width:18px;text-align:center;flex-shrink:0}
.nav-side-link:hover{color:var(--gold-light);background:rgba(201,169,97,.1)}
.nav-side-link.active{color:var(--gold);background:rgba(201,169,97,.1)}
.nav-side-link-danger{color:#ff6b6b}
.nav-side-link-danger i{color:#ff6b6b}
.nav-side-link-danger:hover{background:rgba(255,107,107,.08);color:#ff6b6b}
.nav-side-link-icon{
  width:18px;height:18px;object-fit:contain;flex-shrink:0;
}
.nav-side-link-vzion{
  color:rgba(255,255,255,.68);
  border:1.5px dashed rgba(201,169,97,.4);
  margin-top:4px;
}
.nav-side-link-vzion:hover{
  color:var(--gold-light);
  background:rgba(201,169,97,.08);
  border-color:var(--gold);
}

/* ─── BLOCO DE DESTAQUE V-ZION — fora do menu, espaço próprio ─── */
.nav-vzion-promo{
  width:100%;margin-top:14px;
  background:linear-gradient(160deg,rgba(201,169,97,.09),rgba(201,169,97,.02));
  border:1.5px solid rgba(201,169,97,.26);
  border-radius:16px;
  padding:22px 16px 18px;
  display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:8px;position:relative;overflow:hidden;
  transition:border-color .3s;
}
.nav-vzion-promo:hover{border-color:rgba(201,169,97,.5)}
.nav-vzion-promo::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 50% 0%,rgba(201,169,97,.14),transparent 65%);
  pointer-events:none;
}
.nav-vzion-promo-logo{
  width:68px;height:68px;object-fit:contain;position:relative;z-index:1;
  filter:drop-shadow(0 4px 16px rgba(201,169,97,.4));margin-bottom:2px;
}
.nav-vzion-promo-title{
  font-family:var(--ff-display);font-size:1.05rem;letter-spacing:3px;
  color:#fff;position:relative;z-index:1;
}
.nav-vzion-promo-sub{
  font-size:.6rem;letter-spacing:2px;text-transform:uppercase;
  color:var(--gold-light);position:relative;z-index:1;
}
.nav-vzion-promo-desc{
  font-size:.72rem;color:rgba(255,255,255,.45);line-height:1.55;
  position:relative;z-index:1;margin-top:2px;
}
.nav-vzion-promo-btn{
  margin-top:6px;display:inline-flex;align-items:center;gap:7px;
  padding:9px 18px;border-radius:999px;
  background:rgba(201,169,97,.1);border:1.5px solid rgba(201,169,97,.35);
  color:var(--gold-light);font-size:.74rem;font-weight:700;
  text-decoration:none;transition:.25s;position:relative;z-index:1;
}
.nav-vzion-promo-btn:hover{background:var(--gold);color:#000;border-color:var(--gold)}
.nav-vzion-promo-btn i{font-size:.68rem}

@media(max-width:960px){
  .nav-side-bar{display:none}
}