/*
 * Barra in alto di X-Dress, uguale in tutte le pagine (home, informative, account, forum, Social, Store, Marketplace):
 * logo in fondo a sinistra (con eventuale etichetta di sezione), voci in fondo a destra.
 * Il blocco account (Accedi, nome + avatar, menu) ha lo stile in /assets/account-bar.js.
 */
.xsb{position:sticky;top:0;z-index:30;background:#fff;border-bottom:3px solid #cc00ff;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;margin:0;min-height:62px;box-sizing:border-box;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.5}
.xsb *{box-sizing:border-box}
.xsb-brand{display:flex;align-items:baseline;gap:12px;flex:none;text-decoration:none!important}
.xsb-brand img{height:38px;width:auto;display:block;margin:0;border:0;max-width:none}
/* etichetta di sezione sulla stessa linea di base della scritta del logo (lettere minuscole a ~87% dell'altezza dell'immagine) */
.xsb-brand span{display:block;line-height:1;font-size:18px;font-weight:800;color:#8a00b0;padding-left:12px;border-left:2px solid #f0d0fa;position:relative;top:-5px}
.xsb-nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end;margin:0;padding:0}
.xsb .acct{display:inline-flex;gap:6px;align-items:center}
.xsb-nav a{text-decoration:none!important;color:#222;background:none;padding:8px 16px;border-radius:999px;font-weight:700;font-size:15px;line-height:1.2;display:inline-flex;gap:7px;align-items:center;white-space:nowrap}
.xsb-nav a i{font-style:normal;font-size:15px;line-height:1}
.xsb-nav a:hover{background:#fbf3ff;color:#8a00b0}
.xsb-nav a.active,.xsb-nav a[aria-current=page]{background:#b800e6;color:#fff}
.xsb .xdab a.xdab-me{padding:6px 6px 6px 14px;border-radius:999px;font-weight:700;font-size:15px;color:#8a00b0}
.xsb .xdab a.xdab-me:hover{background:#fbf3ff}
/* telefono: logo a sinistra, avatar e menu ☰ a destra; le voci stanno nel pannello che si apre dal menu */
.xsb-burger{display:none;flex-direction:column;justify-content:center;gap:4px;width:42px;height:42px;border:0;border-radius:12px;background:none;cursor:pointer;padding:0 10px}
.xsb-burger span{display:block;height:2.5px;border-radius:2px;background:#8a00b0;transition:transform .2s,opacity .2s}
.xsb.xsb-open .xsb-burger span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.xsb.xsb-open .xsb-burger span:nth-child(2){opacity:0}
.xsb.xsb-open .xsb-burger span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.xsb-panel{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:3px solid #cc00ff;box-shadow:0 14px 30px rgba(60,0,80,.18);padding:8px 10px 12px;flex-direction:column;gap:2px;z-index:40;max-height:calc(100vh - 70px);overflow-y:auto}
.xsb.xsb-open .xsb-panel{display:flex}
.xsb-panel a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;color:#222;text-decoration:none!important;font-weight:700;font-size:16px;line-height:1.2}
.xsb-panel a i{font-style:normal;width:24px;text-align:center;font-size:18px}
.xsb-panel a:hover{background:#fbf3ff;color:#8a00b0}
.xsb-panel a.active,.xsb-panel a[aria-current=page]{background:#b800e6;color:#fff}
.xsb-panel .notif-count,.xsb-panel .dm-count,.xsb-panel .mod-count{margin-left:auto}
@media (max-width:760px){
  .xsb{flex-wrap:nowrap;justify-content:space-between;padding:6px 10px 6px 14px;gap:8px}
  .xsb-nav{flex-wrap:nowrap;gap:2px}
  .xsb-nav > a:not(.keep-mobile),.xsb .acct > a:not(.xdab-login){display:none}
  .xsb .xdab-name{display:none}
  .xsb .xdab a.xdab-me{padding:4px}
  .xsb .xdab a.xdab-login{padding:6px 14px}
  .xsb-burger{display:inline-flex}
}
@media (max-width:370px){
  .xsb-brand img{height:32px}
  .xsb-brand span{font-size:16px;top:-4px;padding-left:9px}
  .xsb-brand{gap:9px}
}
