/* Ajustes para el móvil en todas las pantallas: nada se mueve de lado, menú abajo al alcance del pulgar y tablas en tarjetas */

/* Las casillas ocultas (filtros, interruptores) heredaban width:100% y empujaban la página de lado */
input[type=checkbox],input[type=radio]{width:auto}
body{overflow-x:clip}
a,button,label,summary{-webkit-tap-highlight-color:transparent}

/* ---------- Personal: menú fijo abajo con iconos ---------- */
.menu-personal{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:2px;max-width:560px;margin:0 auto;padding:6px 6px calc(6px + env(safe-area-inset-bottom));overflow:visible;
  background:#fffdf9f0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid #e8dfd0;box-shadow:0 -6px 20px #0000000d}
.menu-personal a{flex:1 1 0;min-width:0;display:grid;justify-items:center;gap:3px;padding:5px 0 3px;border-radius:12px;background:none;color:#8a7a6a;font-size:.68rem;font-weight:600;line-height:1.1}
.menu-personal a svg{width:42px;height:28px;padding:3px 10px;border-radius:99px;box-sizing:border-box;transition:background .15s}
.menu-personal a span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-personal a[aria-current]{background:none;color:var(--tinta);font-weight:700}
.menu-personal a[aria-current] svg{background:var(--acento);color:#2a1f17}
.menu-personal a:active svg{background:#0000000f}
.menu-personal .globo{position:absolute;margin:-2px 0 0 14px;top:4px;left:50%}
.menu-personal a{position:relative}
main.estrecho:has(>.menu-personal){padding-bottom:calc(100px + env(safe-area-inset-bottom))}

/* ---------- Panel: barra de abajo en el móvil ---------- */
.app-abajo{display:none}
@media (max-width:900px){
  .app-abajo{position:fixed;left:0;right:0;bottom:0;z-index:25;display:flex;padding:6px 6px calc(6px + env(safe-area-inset-bottom));
    background:#2a1f17f5;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 -6px 24px #0000002e}
  .app-abajo a,.app-abajo button{flex:1 1 0;min-width:0;display:grid;justify-items:center;gap:3px;padding:5px 0 3px;border:0;background:none;color:#b9a68e;
    font:600 .68rem/1.1 Inter,sans-serif;text-decoration:none;cursor:pointer}
  .app-abajo svg{width:42px;height:28px;padding:3px 10px;border-radius:99px;box-sizing:border-box}
  .app-abajo .activo{color:#fff}
  .app-abajo .activo svg{background:#cf933240;color:var(--acento)}
  .app-contenido.ancho{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  /* Pantallas con su propio botón fijo abajo (pedido a un proveedor): ahí manda ese botón */
  body:has(.chat-pie,.pm-carrito-boton) .app-abajo{display:none}
  body:has(.chat-pie,.pm-carrito-boton) .app-contenido.ancho{padding-bottom:56px}
  .cq-aviso{bottom:calc(84px + env(safe-area-inset-bottom))}
  /* El menú lateral, por encima de la barra y con su botón de salir siempre a la vista */
  .app-lado{padding-bottom:calc(18px + env(safe-area-inset-bottom))}
  .app-nav a{padding-top:11px;padding-bottom:11px}
}

/* ---------- Tablas en tarjetas (las marca movil.js cuando no caben) ---------- */
@media (max-width:700px){
  table.en-tarjetas,table.en-tarjetas tbody,table.en-tarjetas tfoot,table.en-tarjetas tr,table.en-tarjetas td{display:block;width:auto}
  table.en-tarjetas thead{display:none}
  table.en-tarjetas tr{display:grid;grid-template-columns:1fr 1fr;column-gap:18px;padding:12px 14px;border-bottom:1px solid #eee4d6}
  table.en-tarjetas tr:last-child{border-bottom:0}
  table.en-tarjetas td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:3px 0!important;border:0!important;text-align:right;white-space:normal;min-width:0;background:none!important}
  table.en-tarjetas td::before{content:attr(data-titulo);flex:0 0 auto;max-width:55%;text-align:left;color:var(--suave,#8a7a6a);font-size:.8rem;font-weight:500;text-transform:none;letter-spacing:0}
  table.en-tarjetas td:first-child{grid-column:1/-1;display:block;text-align:left;font-size:1rem;font-weight:700;padding-bottom:6px!important}
  table.en-tarjetas td:first-child::before{display:none}
  table.en-tarjetas td:empty{display:none}
  table.en-tarjetas td>form,table.en-tarjetas td>.acciones{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
}

/* ---------- Día en detalle: cada tarea en dos líneas (tarea arriba, quién y hora debajo, foto a la derecha) ---------- */
@media (max-width:700px){
  table.dia-tareas,.dia-tareas tbody,.dia-tareas tr.bloque-fila,.dia-tareas tr.bloque-fila td{display:block}
  .dia-tareas tr:not(.bloque-fila){display:grid;grid-template-columns:22px minmax(0,1fr) auto;column-gap:10px;align-items:center;padding:10px 12px;border-bottom:1px solid #f0e9dd}
  .dia-tareas tr:not(.bloque-fila) td{padding:0;border:0;background:none!important;width:auto}
  .dia-tareas tr:not(.bloque-fila):nth-child(even){background:#faf5ec}
  .dia-tareas tr.hecha:not(.no-falta):not(.bloque-fila){background:#eef8f0}
  .dia-tareas tr.dudosa:not(.bloque-fila){background:#fff6e6}
  .dia-tareas tr.no-falta:not(.bloque-fila){background:#eef3fb}
  .dia-tareas td.d-num{grid-column:1;grid-row:1}
  .dia-tareas tr:not(.bloque-fila) td:nth-child(2){grid-column:2;grid-row:1}
  .dia-tareas td.d-quien{grid-column:2;grid-row:2;margin-top:4px;font-size:.85rem}
  .dia-tareas td.d-foto{grid-column:3;grid-row:1/3}
  .dia-tareas td.d-foto:empty{display:none}
  .dia-tareas .d-foto img{width:52px;height:52px}
}

/* ---------- Cuadrante: dos días a la vista y el dedo pasa de día en día ---------- */
@media (max-width:700px){
  .cq:not(.v-persona) .cq-fila{grid-template-columns:repeat(7,calc((100vw - 34px) / 2));min-width:0}
  .cq:not(.v-persona) .cq-rejilla{scroll-snap-type:x mandatory;max-height:calc(100dvh - 250px)}
  .cq:not(.v-persona) .cq-fila>*{scroll-snap-align:start}
  /* El nombre de la zona se queda a la vista aunque se deslicen los días */
  .cq:not(.v-persona) .cq-seccion{width:max-content;min-width:100%}
  .cq:not(.v-persona) .cq-sec-cab{position:sticky;left:0;width:calc(100vw - 34px);z-index:2}
}

/* ---------- Ajustes sueltos ---------- */
@media (max-width:600px){
  /* Filtros de fechas (Control, Puntos…): las dos fechas y el botón en una sola fila */
  .filtro>label{flex:1 1 120px;min-width:0}.filtro input{min-width:0;padding-left:9px;padding-right:6px}.filtro>.boton{flex:0 0 auto}
  /* Personas: el nombre se ve entero y el interruptor no se come el ancho */
  .eq-tarjeta{grid-template-columns:auto 1fr;gap:6px 12px;padding:14px}
  .eq-tarjeta .interruptor{grid-column:2;justify-self:start;flex-direction:row;font-size:.85rem}
  /* Botones y enlaces de acción con sitio para el dedo */
  .boton,button.boton,a.boton{min-height:44px}
  .enlace-editar{padding:8px 4px}
}

/* ---------- Personal: «Pedir» y «Más» ---------- */
.tarjeta-pedir{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin:22px 0 8px;padding:16px 18px;border-radius:16px;background:#fff;border:1px solid #eee4d6;color:var(--tinta);text-decoration:none;box-shadow:0 2px 10px #0000000a}
.tarjeta-pedir>span:first-child{font-size:1.6rem}.tarjeta-pedir small{color:#8a7a6a}.tarjeta-pedir>span:last-child{font-size:1.5rem;color:#b9a68e}
.pedido-buscar{display:block;margin:12px 0 8px}
#pedido-texto{white-space:pre-wrap}
.ped b,.mis-pedidos li>span:first-child{white-space:pre-line}
.mis-pedidos{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mis-pedidos li{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid #eee4d6}
.mis-pedidos li small{color:#8a7a6a}
.mis-pedidos li.hecho,.mis-pedidos li.descartado{opacity:.6}
.mas-lista{display:grid;margin:8px 0 22px;border-radius:16px;overflow:hidden;background:#fff;border:1px solid #eee4d6}
.mas-fila{display:grid;grid-template-columns:34px 1fr auto auto;align-items:center;gap:10px;min-height:56px;padding:6px 16px;border-bottom:1px solid #f0e9dd;color:var(--tinta);text-decoration:none;font-weight:600}
.mas-fila:last-child{border-bottom:0}
.mas-fila:active{background:#faf5ec}
.mas-icono{font-size:1.3rem;text-align:center}
.mas-flecha{font-size:1.4rem;color:#b9a68e}
.mas-fila .globo{position:static;margin:0}
.mas-fila.apagada{color:#a89884;grid-template-columns:34px 1fr auto}
.centro{text-align:center}
.mis-pedidos .chip.ped-pendiente{background:#fde8c8;color:#7a4a00}.mis-pedidos .chip.ped-pedido{background:#dbe9fb;color:#1f4a86}.mis-pedidos .chip.ped-hecho{background:#d9f2df;color:#1d5b2a}