/* =========================
   /assets/css/menu.css
   Tab/portal: MENU (público)
   ========================= */

/* Tema menu (fondo rojo, texto blanco; el póster es blanco con texto rojo) */
/* =========================
   Tema MENU (público)
   Fondo blanco, texto rojo
   ========================= */

html.theme-menu,
body.theme-menu{
  min-height: 100%;
  background: var(--menu-bg) !important;     /* blanco */
  background-color: var(--menu-bg) !important;
  color: var(--menu-fg);                     /* rojo */
}

/* Logo y navegación */
body.theme-menu .madonna-logo-wrap{
  color: var(--menu-fg);
}

body.theme-menu .tabs{
  color: var(--menu-fg);
}

body.theme-menu .tab-btn{
  border-color: var(--menu-fg);
  color: var(--menu-fg);
}

body.theme-menu .tab-btn[aria-selected="true"]{
  background: var(--menu-fg);
  color: var(--menu-bg);
}

/* Shell del portal público (full width) */
body.theme-menu .info-shell{
  max-width:none;
  width:100%;
  min-height:100vh;
  margin:0;
}

/* =========================
   MENÚ — POSTER LOOK
   (full-width container)
   ========================= */

.menu-poster{
  background:var(--menu-bg);
  color:var(--menu-fg);

  /* full-width */
  width:100%;
  max-width:none;
  margin:0;
  padding:64px 52px 46px;
}

@media (max-width: 720px){
  .menu-poster{ padding: 28px 16px 26px; }
}

/* Title + divider */
.menu-poster .menu-title{
  font-family:"Bebas Neue",system-ui,sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:60px;
  margin:0;
  line-height:1;
}
@media (max-width: 720px){
  .menu-poster .menu-title{ font-size:44px; }
}

.menu-poster .menu-divider.thick{
  height:6px;
  background:currentColor;
  margin:16px 0 26px;
  border-radius:3px;
}

/* Grid de 2 columnas */
.menu-poster .menu-slices-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:88px;
  row-gap:14px;
  align-items:start;
}
@media (max-width: 980px){
  .menu-poster .menu-slices-grid{
    grid-template-columns:1fr;
    column-gap:0;
  }
}

/* Item en bloque (precio debajo) */
.menu-poster .menu-item{
  margin:0 0 12px;
  break-inside:avoid;
  page-break-inside:avoid;
}
.menu-poster .menu-item-name{
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:16px;
  line-height:1.1;
}
.menu-poster .menu-item-desc{
  margin-top:6px;
  font-size:13px;
  line-height:1.25;
  opacity:.85;
}
.menu-poster .menu-item-price{
  margin-top:7px;
  font-weight:400;
  letter-spacing:.10em;
  font-size:14px;
  opacity:.95;
}
.menu-poster .emoji-line{
  margin-top:6px;
  opacity:.65;
  font-size:13px;
}

/* Badges (póster) */
.menu-poster .menu-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:18px 0 10px;
}
.menu-poster .badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid currentColor;
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:transparent;
}

/* SOLD OUT */
.menu-poster .menu-item.is-sold-out{ opacity:.45; }
.menu-poster .menu-item.is-sold-out .menu-item-name{ text-decoration:line-through; }
.menu-poster .menu-item.is-sold-out .menu-item-price{ position:relative; }
.menu-poster .menu-item.is-sold-out .menu-item-price::after{
  content:"SOLD OUT";
  margin-left:10px;
  font-size:11px;
  letter-spacing:.12em;
  border:1px solid currentColor;
  padding:2px 6px;
  border-radius:6px;
}

/* Subcolumnas con divisor vertical */
.menu-poster .subcols{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:64px;
  position:relative;
}
@media (max-width: 720px){
  .menu-poster .subcols{
    grid-template-columns:1fr;
    column-gap:0;
  }
}
.menu-poster .subcols.has-vdiv::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  width:2px;
  background:currentColor;
  transform:translateX(-1px);
}
@media (max-width: 720px){
  .menu-poster .subcols.has-vdiv::before{ display:none; }
}

/* Badge de subsección */
.menu-poster .sub-badge{
  display:inline-block;
  background:var(--menu-fg);
  color:var(--menu-bg);
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:12px;
  padding:8px 12px;
  border-radius:999px;
  margin:18px 0 10px;
}