/* Plugin Menu semanal (ganchos/vista.php + js/menu_semanal.js). Movil (contenedor < 600 px): un dia por fila; tablet y
   escritorio angosto: carrusel horizontal de dias con flechas (data-carrusel); escritorio ancho (>= 1100 px): 7 columnas. */
body.v-plugin-menu_semanal .shell { grid-template-columns:minmax(0,1fr) !important; grid-template-areas:"main" !important; }
body.v-plugin-menu_semanal .shell.con-grupo { grid-template-areas:"grupo" "main" !important; grid-template-rows:none !important; }
body.v-plugin-menu_semanal .shell > .rail { display:none !important; }
#menuSemanalRaiz { container-type:inline-size; }
#menuSemanalRaiz .shead { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
#menuSemanalRaiz .shead h2 { display:flex; align-items:center; gap:8px; margin:0; }
#menuSemanalRaiz .btn, #modalMenuPlatillo .btn { min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.menu-intro { margin:6px 0 12px; color:var(--soft); font-size:14px; }
.menu-aviso { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:14px 16px; border:1px dashed var(--line); border-radius:16px; background:var(--card); }
.menu-aviso p { margin:0; flex:1 1 220px; }
.menu-aviso .ic { width:28px; height:28px; }
.menu-semanas { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 12px; }
.menu-semanas h3 { margin:0; font-size:16px; flex:1 1 0; min-width:0; text-align:center; justify-content:center; }
.menu-semanas .iconbtn { min-width:44px; min-height:44px; }
/* Dias: el id gana a las reglas genericas del carrusel (.carrusel-h > [data-carrusel]). Cada dia se detiene al inicio
   al deslizar; el padding deja ver el borde y el anillo de foco del dia de hoy. */
#menuDias { display:flex; gap:10px; align-items:stretch; padding:2px; scroll-snap-type:x mandatory; scroll-padding-inline:2px; }
#menuDias > .menu-dia { flex:0 0 clamp(230px, 40cqi, 300px); min-width:0; scroll-snap-align:start; }
@container (max-width:599px){
  #menuDias { flex-direction:column; overflow:visible; scroll-snap-type:none; }
  #menuDias > .menu-dia { flex:none; }
}
@container (min-width:1100px){
  #menuDias { display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); overflow:visible; scroll-snap-type:none; }
}
.menu-dia { display:flex; flex-direction:column; gap:6px; padding:12px; border:1px solid var(--line); border-radius:18px; background:var(--card); }
.menu-dia.es-hoy { border-color:var(--red); box-shadow:0 0 0 1px var(--red); }
.menu-dia h4 { display:flex; align-items:baseline; justify-content:space-between; margin:0 0 2px; font-size:15px; }
.menu-dia h4 small { color:var(--soft); font-weight:500; margin-left:auto; }
.menu-dia h4 { align-items:center; gap:6px; }
.menu-hoy-marca { padding:1px 8px; border-radius:999px; background:color-mix(in srgb, var(--red) 14%, var(--card)); color:var(--ink); font-size:11px; font-weight:700; line-height:1.6; }
.menu-lugar { display:flex; align-items:center; gap:6px; min-height:44px; padding:4px 0; border-top:1px solid var(--line); }
.menu-tiempo { display:inline-flex; align-items:center; gap:4px; flex:0 0 92px; color:var(--soft); font-size:13px; }
/* 7 columnas: el tiempo comparte renglon con su boton (+ o quitar) y el platillo usa todo el ancho debajo. */
@container (min-width:1100px){
  .menu-lugar { flex-wrap:wrap; row-gap:0; }
  .menu-tiempo { flex:1 1 auto; }
  .menu-lugar > .menu-platillo { order:3; flex:1 1 100%; padding:2px 4px 4px; }
}
.menu-tiempo .ic { width:16px; height:16px; }
.menu-platillo, .menu-agregar { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; flex:1; min-width:0; min-height:44px; padding:4px 8px; border:0; border-radius:10px; background:none; color:var(--ink); font:inherit; text-align:left; cursor:pointer; }
.menu-platillo b { font-size:14px; line-height:1.25; overflow-wrap:break-word; hyphens:auto; }
.menu-platillo small { color:var(--soft); font-size:12px; }
.menu-platillo:hover { background:color-mix(in srgb, var(--ink) 5%, var(--card)); }
/* Lugar vacio: boton "+" de 44 px bien visible (v.36, pedido de Victor): color del tema, borde solido y fondo tenue,
   contraste >= 3:1 del borde y del "+" contra la tarjeta (WCAG 1.4.11). El "+" se dibuja con currentColor para seguir
   el color del tema; el nombre completo va en aria-label ("Agregar desayuno del lunes") y title. */
.menu-agregar { flex:0 0 44px; width:44px; height:44px; margin-left:auto; padding:0; align-items:center; justify-content:center; color:var(--red); border:2px solid color-mix(in srgb, var(--red) 85%, var(--card)); background:color-mix(in srgb, var(--red) 7%, var(--card)); transition:background .15s ease, color .15s ease; }
.menu-agregar:hover, .menu-agregar:focus-visible { background:var(--red); color:var(--card); border-color:var(--red); }
.menu-mas { display:block; width:18px; height:18px; background:linear-gradient(currentColor, currentColor) center / 18px 2.5px no-repeat, linear-gradient(currentColor, currentColor) center / 2.5px 18px no-repeat; border-radius:2px; }
@media (forced-colors: active){ .menu-agregar { border-color:ButtonText; } .menu-mas { background:none; } .menu-mas::before { content:"+"; font-size:22px; line-height:18px; color:ButtonText; } }
.menu-platillo:focus-visible, .menu-agregar:focus-visible, .menu-receta:focus-visible { outline:2px solid var(--red); outline-offset:2px; }
.menu-lugar.no-disponible b { text-decoration:line-through; color:var(--soft); }
.menu-lugar .iconbtn { min-width:44px; min-height:44px; flex:none; }
.menu-super { margin:16px 0 0; padding:16px; }
.menu-super-cabeza { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.menu-super-cabeza h3 { display:flex; align-items:center; gap:8px; margin:0; font-size:17px; }
.menu-lista { display:grid; grid-template-columns:minmax(0,1fr); gap:2px 16px; margin:10px 0 0; padding:0; list-style:none; }
@container (min-width:700px){ .menu-lista { grid-template-columns:repeat(2, minmax(0,1fr)); } }
.menu-check { display:flex; align-items:flex-start; gap:10px; min-height:44px; padding:6px 0; cursor:pointer; }
.menu-check input { width:22px; height:22px; margin:2px 0 0; flex:none; accent-color:var(--red); }
.menu-check span { display:flex; flex-direction:column; line-height:1.35; }
.menu-check small { color:var(--soft); font-size:12px; }
.menu-check input:checked + span { text-decoration:line-through; color:var(--soft); }
.menu-vacio { color:var(--soft); }
.menu-modal { width:min(560px, 100%); }
.menu-recetas { display:flex; flex-direction:column; gap:6px; max-height:38vh; overflow:auto; margin:0 0 12px; padding:2px; }
.menu-receta { display:flex; align-items:center; gap:8px; min-height:44px; padding:6px 12px; border:1px solid var(--line); border-radius:12px; background:var(--card); color:var(--ink); font:inherit; text-align:left; cursor:pointer; }
.menu-receta span { flex:1; min-width:0; }
.menu-receta small { color:var(--soft); }
.menu-receta .ic { width:18px; height:18px; }
.menu-receta[aria-checked="true"] { border-color:var(--red); background:color-mix(in srgb, var(--red) 10%, var(--card)); font-weight:700; }