/* ============================================================
   EBRIUS RESTAURANT — Stile menu pubblico
   Modificabile dal backoffice: Admin → Stile CSS
   ============================================================ */

/* ---- RESET & BASE ---- */
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{
  background:var(--c-bg);
  color:var(--c-cream);
  font-family:'Poppins',sans-serif;
  font-size:15px;
  line-height:1.55;
  min-height:100vh;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

/* ---- HEADER ---- */
.header{
  background:var(--c-primary);
  padding:.75rem 1.2rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky;
  top:0;
  z-index:100;
}
.header-logo img{max-height:44px;width:auto;}
.header-logo-text h1{color:#fff;font-size:18px;font-weight:600;letter-spacing:4px;text-transform:uppercase;}
.header-logo-text p{color:rgba(255,255,255,.5);font-size:9px;letter-spacing:3px;text-transform:uppercase;}
.header-social{display:flex;gap:8px;align-items:center;}
.header-social a{
  width:32px;height:32px;border-radius:50%;
  background:rgba(255,255,255,.15);
  display:flex;align-items:center;justify-content:center;
  transition:background .2s;
}
.header-social a:hover{background:rgba(255,255,255,.28);}
.header-social svg{width:15px;height:15px;}

/* ---- LANG SWITCHER ---- */
.lang-switcher-compact{display:flex;align-items:center;gap:3px;margin-right:6px;}
.lsc-btn{color:rgba(255,255,255,.5);font-size:11px;font-weight:600;letter-spacing:.5px;padding:4px 6px;border-radius:4px;text-decoration:none;transition:all .18s;}
.lsc-btn:hover{color:#fff;background:rgba(255,255,255,.12);}
.lsc-btn.active{color:#fff;background:rgba(255,255,255,.2);}

/* ---- NAV SEZIONI ---- */
.nav-sezioni{
  display:flex;
  background:rgba(0,0,0,.35);
  border-bottom:1px solid var(--c-border);
  overflow-x:auto;
  scrollbar-width:none;
  justify-content:center;
}
.nav-sezioni::-webkit-scrollbar{display:none;}
.nav-sez-btn{
  background:none;border:none;
  color:var(--c-muted);
  font-family:'Poppins',sans-serif;
  font-size:12px;font-weight:500;
  letter-spacing:1.6px;text-transform:uppercase;
  padding:.85rem 1.4rem;
  cursor:pointer;
  border-bottom:2px solid transparent;
  white-space:nowrap;
  transition:color .2s,border-color .2s;
}
.nav-sez-btn.active,.nav-sez-btn:hover{
  color:#fff;
  border-bottom-color:var(--c-primary);
}

/* ---- SEZIONE ---- */
.sezione{display:none;padding-bottom:3rem;}
.sezione.active{display:block;}

/* ---- NAV CATEGORIE — stile editoriale, no pillole ---- */
.nav-cat-wrap{
  background:rgba(0,0,0,.18);
  border-bottom:1px solid var(--c-border);
  overflow:hidden;
}
.nav-cat{
  display:flex;
  gap:0;
  overflow-x:auto;
  scrollbar-width:none;
  padding:.5rem 1.2rem .4rem;
}
.nav-cat::-webkit-scrollbar{display:none;}
.nav-cat-btn{
  background:transparent;
  border:none;
  border-radius:0;
  color:var(--c-cream);
  opacity:.55;
  font-family:'Poppins',sans-serif;
  font-size:12px;font-weight:500;
  letter-spacing:1.2px;
  text-transform:uppercase;
  padding:.7rem .1rem;
  margin-right:1.4rem;
  cursor:pointer;
  white-space:nowrap;
  border-bottom:1px solid transparent;
  transition:all .25s ease;
  flex-shrink:0;
}
.nav-cat-btn:hover{opacity:.85;}
.nav-cat-btn.active{
  opacity:1;
  font-weight:600;
  background:transparent;
  color:var(--c-cream);
  border-bottom-color:var(--c-cream);
}
.nav-cat-btn:last-child{margin-right:0;}

/* ---- CATEGORIE ---- */
.cat-block{display:none;}
.cat-block.active{display:block;}
.cat-header{padding:1rem 1.2rem .5rem;}
.cat-img{width:100%;max-height:160px;object-fit:cover;border-radius:8px;margin-bottom:.5rem;}
.cat-title{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-size:26px;
  color:var(--c-cream);
  margin-bottom:.2rem;
}
.cat-desc{font-size:13px;color:var(--c-desc);line-height:1.6;}

/* ---- PIATTI ---- */
.piatti{padding:0 1.2rem;}
.piatto{
  display:flex;align-items:flex-start;gap:.85rem;
  padding:1.1rem 0;
  border-bottom:1px solid var(--c-border);
  position:relative;
}
.piatto:last-child{border-bottom:none;}
.piatto-body{flex:1;min-width:0;}
.piatto-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;}
.piatto-nome{
  font-size:15px;font-weight:600;
  text-transform:uppercase;
  letter-spacing:.4px;
  color:var(--c-cream);
  line-height:1.3;
}
.piatto-price{
  font-size:16px;font-weight:700;
  color:#fff;white-space:nowrap;
  flex-shrink:0;
}
.piatto-desc{
  font-size:13px;
  color:var(--c-cream);
  opacity:.85;
  margin-top:.4rem;
  line-height:1.55;
}
.piatto-img{
  width:78px;height:78px;
  border-radius:8px;
  object-fit:cover;
  flex-shrink:0;
}

/* ---- PIATTO EVIDENZIATO / CHEF ---- */
.piatto.is-chef,
.vino.is-chef{
  position:relative;
  padding-left:14px;
}
.piatto.is-chef::before,
.vino.is-chef::before{
  content:"";
  position:absolute;
  left:0;
  top:18px;
  bottom:18px;
  width:2px;
  background:linear-gradient(180deg, var(--c-cream) 0%, rgba(232,223,200,.15) 100%);
  border-radius:2px;
}
.badge-chef{
  display:inline-flex;align-items:center;gap:3px;
  margin-left:8px;
  padding:2px 8px 2px 7px;
  background:var(--c-cream);
  color:var(--c-bg);
  border-radius:10px;
  font-family:'Poppins',sans-serif;
  font-size:9.5px;font-weight:700;
  letter-spacing:1.2px;
  text-transform:uppercase;
  vertical-align:middle;
  line-height:1.5;
}
.badge-chef::before{
  content:"★";
  font-size:10px;
  letter-spacing:0;
}

/* ---- VINI ---- */
.piatti .vino{padding:.9rem 0;border-bottom:1px solid var(--c-border);}
.piatti .vino:last-child{border-bottom:none;}
.vino-row{display:flex;align-items:center;gap:.4rem;}
.vino-nome{font-size:15px;font-weight:600;color:var(--c-cream);flex-shrink:0;}
.vino-dots{flex:1;border-bottom:1px dotted rgba(255,255,255,.25);min-width:12px;height:1px;}
.vino-price,.vino-prezzo{font-size:16px;font-weight:700;color:#fff;white-space:nowrap;flex-shrink:0;}
.vino-desc{font-size:13px;color:var(--c-cream);opacity:.85;margin-top:4px;line-height:1.55;}

/* ---- ALLERGENI SU RIGA DEDICATA (sotto la descrizione) ---- */
.piatto-allergeni-row{
  display:flex;align-items:center;flex-wrap:wrap;gap:7px;
  margin-top:.7rem;
}
.piatto-allergeni-row .alg-label{
  font-size:11px;font-weight:600;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:var(--c-cream);
  opacity:.55;
  margin-right:3px;
  font-family:'Poppins',sans-serif;
}
.piatto-allergeni-row .alg-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;
  background:rgba(232,223,200,.22);
  color:var(--c-cream);
  border-radius:50%;
  font-size:12px;font-weight:700;line-height:1;
  font-family:'Poppins',sans-serif;
  cursor:default;
}

/* ---- LEGENDA ALLERGENI IN FONDO ---- */
.allergeni-wrap{
  margin:2rem 1.2rem;
  padding:1.2rem 1.4rem;
  background:rgba(0,0,0,.22);
  border:1px solid var(--c-border);
  border-radius:10px;
}
.allergeni-title{
  font-size:11px;font-weight:700;
  letter-spacing:2.5px;text-transform:uppercase;
  color:var(--c-cream);
  opacity:.9;
  margin-bottom:1rem;
}
.allergeni-list{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  gap:.55rem .9rem;
  margin-bottom:1rem;
}
.allergeni-item{
  font-size:13px;
  color:var(--c-cream);
  opacity:.92;
  display:flex;align-items:center;gap:8px;
}
.allergeni-item .alg-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;
  background:var(--c-cream);
  color:var(--c-bg);
  border-radius:50%;
  font-size:12px;font-weight:700;line-height:1;
  flex-shrink:0;
}
.allergeni-note{
  font-size:12px;
  color:var(--c-cream);
  opacity:.6;
  line-height:1.6;
  border-top:1px solid var(--c-border);
  padding-top:.9rem;
  font-style:italic;
}

/* ---- FOOTER ---- */
.footer{
  padding:1.5rem 1.2rem;
  text-align:center;
  border-top:1px solid var(--c-border);
  margin-top:1rem;
}
.footer-social{display:flex;justify-content:center;gap:12px;margin-bottom:.75rem;}
.footer-social a{
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  font-size:0;
  transition:background .2s;
}
.footer-social a:hover{background:rgba(255,255,255,.2);}
.footer-social a svg{width:16px;height:16px;color:#fff;flex-shrink:0;}
.footer-copy{font-size:10px;color:var(--c-muted);line-height:1.8;}
.footer-divider{display:none;}
.footer-credit{font-size:10px;color:rgba(255,255,255,.2);margin-top:.25rem;}
.footer-credit a{color:rgba(255,255,255,.35);}

/* ============================================================
   DESKTOP — Media query SEMPRE in fondo
   per garantire override sulle regole base
   ============================================================ */
@media(min-width:768px){
  .header{padding:.75rem 2.5rem;}

  .nav-cat,
  .cat-header,
  .piatti,
  .vini-list,
  .footer,
  .allergeni-wrap{
    max-width:820px;
    margin-left:auto;
    margin-right:auto;
  }

  .nav-cat{
    padding-left:2.5rem;
    padding-right:2.5rem;
  }
  .cat-header{
    padding-left:2.5rem;
    padding-right:2.5rem;
  }
  .piatti{
    padding-left:2.5rem;
    padding-right:2.5rem;
  }
  .footer{
    padding-left:2.5rem;
    padding-right:2.5rem;
  }
  .allergeni-wrap{
    margin-top:2rem;
    margin-bottom:2rem;
    padding-left:2.5rem;
    padding-right:2.5rem;
  }
}