/* Menue: opciones de vista y de tema en el pie derecho de la portada.
   Contacto original vuelve arriba junto al logotipo. */
body .hero .hero-integrated-main .hero-copy .menue-cover-footer {
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:15px 0 0!important;
  padding:0!important;
  position:relative!important;
  z-index:4!important;
}
body .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials,
body[data-plan="pro"] .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials {
  margin:0!important;
  flex:0 1 auto!important;
  min-width:0!important;
  max-width:calc(100% - 101px)!important;
  align-self:center!important;
}
body .hero .hero-integrated-main .menue-cover-actions {
  display:flex!important;
  flex-direction:row!important;
  flex:0 0 auto!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:11px!important;
  margin:0 0 0 auto!important;
  padding:0!important;
  min-width:0!important;
  align-self:center!important;
}
body .hero .hero-integrated-main .menue-cover-actions:empty{display:none!important}
/* Ambos controles tienen exactamente la misma geometría y comportamiento. */
body .hero .hero-integrated-main .menue-cover-actions > .menue-layout-toggle,
body .hero .hero-integrated-main .menue-cover-actions > .menue-theme-toggle {
  display:grid!important;
  place-items:center!important;
  position:static!important;
  inset:auto!important;
  transform:none!important;
  flex:0 0 40px!important;
  order:0!important;
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  max-width:40px!important;
  min-height:40px!important;
  max-height:40px!important;
  padding:0!important;
  margin:0!important;
  align-self:center!important;
  border-radius:50%!important;
  background:color-mix(in srgb,var(--md-header-ink) 7%,var(--md-header-color))!important;
  border:1px solid color-mix(in srgb,var(--md-header-ink) 24%,transparent)!important;
  color:var(--md-header-accent)!important;
  cursor:pointer!important;
  box-shadow:none!important;
  -webkit-tap-highlight-color:transparent!important;
  z-index:2!important;
}
body .hero .hero-integrated-main .menue-cover-actions > button svg {
  display:block!important;
  width:21px!important;height:21px!important;
  fill:none!important;stroke:currentColor!important;
  stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important;
}
body .hero .hero-integrated-main .menue-cover-actions > button:hover {
  border-color:var(--md-header-accent)!important;
}
body .hero .hero-integrated-main .menue-cover-actions > button:focus-visible {
  outline:3px solid var(--md-header-accent)!important;
  outline-offset:3px!important;
}
@media(max-width:700px) {
  body .hero .hero-integrated-main .hero-copy .menue-cover-footer{gap:8px!important;margin-top:13px!important}
  body .hero .hero-integrated-main .menue-cover-actions{gap:8px!important}
  body .hero .hero-integrated-main .menue-cover-actions > .menue-layout-toggle,
  body .hero .hero-integrated-main .menue-cover-actions > .menue-theme-toggle {
    flex-basis:37px!important;width:37px!important;height:37px!important;
    min-width:37px!important;max-width:37px!important;
    min-height:37px!important;max-height:37px!important;
  }
  body .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials,
  body[data-plan="pro"] .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials {
    max-width:calc(100% - 87px)!important;
  }
}
@media(max-width:370px){
  body .hero .hero-integrated-main .menue-cover-actions{gap:5px!important}
  body .hero .hero-integrated-main .menue-cover-actions > .menue-layout-toggle,
  body .hero .hero-integrated-main .menue-cover-actions > .menue-theme-toggle {
    flex-basis:34px!important;width:34px!important;height:34px!important;
    min-width:34px!important;max-width:34px!important;
    min-height:34px!important;max-height:34px!important;
  }
  body .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials,
  body[data-plan="pro"] .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials{
    max-width:calc(100% - 74px)!important;
  }
}

/* V2 · Alinear al margen derecho los datos superiores del restaurante.
   Tras mover sol/luna y grilla/carrusel a la franja inferior, el encabezado
   no debe reservar dos columnas vacías a la derecha de la información. */
@media (min-width:1151px){
  body .hero .hero-integrated-top{
    grid-template-columns:minmax(0,1fr) max-content!important;
  }
  body .hero .hero-integrated-top > .brand{
    grid-column:1!important;
    grid-row:1!important;
  }
  body .hero .hero-integrated-top > .hero-info-stack{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    margin-left:auto!important;
    max-width:min(100%,760px)!important;
    width:auto!important;
  }
}
@media (min-width:801px) and (max-width:1150px){
  body .hero .hero-integrated-top > .hero-info-stack{
    justify-self:end!important;
    margin-left:auto!important;
  }
}

/* V3 · Los dos conmutadores mantienen su función y muestran un nombre visible. */
body .hero .hero-integrated-main .menue-cover-actions > .menue-layout-toggle,
body .hero .hero-integrated-main .menue-cover-actions > .menue-theme-toggle {
  display:inline-flex!important;
  flex:0 0 auto!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  width:auto!important;
  min-width:76px!important;
  max-width:none!important;
  height:40px!important;
  min-height:40px!important;
  max-height:40px!important;
  padding:0 11px!important;
  border-radius:999px!important;
  font-family:inherit!important;
  font-size:12px!important;
  font-weight:750!important;
  white-space:nowrap!important;
}
body .hero .hero-integrated-main .menue-cover-actions > .menue-layout-toggle::after{content:"Vista";}
body .hero .hero-integrated-main .menue-cover-actions > .menue-theme-toggle::after{content:"Luz";}
body .hero .hero-integrated-main .menue-cover-actions > button svg{
  flex:0 0 19px!important;
  width:19px!important;
  height:19px!important;
}
/* Las redes usan el espacio restante y, si son muchas, se pueden desplazar sin pisar los controles. */
body .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials,
body[data-plan="pro"] .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials {
  flex:1 1 auto!important;
  max-width:none!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none;
}
body .hero .hero-integrated-main .hero-copy .menue-cover-footer .venue-socials::-webkit-scrollbar{display:none;}

/* El botón (i) de información va al último borde del encabezado móvil.
   Se elimina la tercera columna que pertenecía al botón sol/luna ahora situado abajo. */
@media(max-width:800px){
  body .hero .hero-integrated-top{
    grid-template-columns:minmax(0,1fr) 40px!important;
    column-gap:8px!important;
  }
  body .hero .hero-integrated-top > .menue-info-trigger{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    margin-left:auto!important;
  }
  body .hero .hero-integrated-top > .hero-info-stack{
    grid-column:1 / -1!important;
    grid-row:2!important;
  }
  body .hero .hero-integrated-main .menue-cover-actions > .menue-layout-toggle,
  body .hero .hero-integrated-main .menue-cover-actions > .menue-theme-toggle{
    min-width:68px!important;
    width:auto!important;
    max-width:none!important;
    height:37px!important;
    min-height:37px!important;
    max-height:37px!important;
    padding:0 8px!important;
    gap:4px!important;
    font-size:11px!important;
  }
  body .hero .hero-integrated-main .menue-cover-actions > button svg{
    width:17px!important;height:17px!important;flex-basis:17px!important;
  }
}
@media(max-width:370px){
  body .hero .hero-integrated-main .menue-cover-actions > .menue-layout-toggle,
  body .hero .hero-integrated-main .menue-cover-actions > .menue-theme-toggle{
    min-width:62px!important;
    height:35px!important;min-height:35px!important;max-height:35px!important;
    gap:3px!important;padding:0 6px!important;
    font-size:10px!important;
  }
  body .hero .hero-integrated-main .menue-cover-actions{gap:5px!important;}
}