/* Delicias Andrea · menú del día en línea.
   Colores del logo: rosa, blanco, amarillo de la flor, verde de la hoja y paja del sombrero.
   Pensado primero para celular. */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&family=Poppins:wght@400;500;600;700&family=Satisfy&display=swap');

:root{
  --rosa:#ff1f87; --rosa-2:#ff52a2; --rosa-osc:#d10d68; --rosa-suave:#ffe3ef; --rosa-fondo:#fff6fa;
  --tinta:#2e1623; --texto:#4b3441; --gris:#87707d; --gris-2:#b49fab; --linea:#f3d5e3; --blanco:#fff;
  --amarillo:#f1e532; --amarillo-osc:#a99e00; --hoja:#2f7d3a; --paja:#d6c682;
  --verde:#1fa855; --verde-2:#178a45; --rojo:#e0453a; --ambar:#c97a00;
  --r:18px; --sombra:0 14px 34px -20px rgba(209,13,104,.45);
  --script:'Satisfy', cursive; --titulo:'Montserrat','Poppins',Arial,sans-serif; --sans:'Poppins','Segoe UI',Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--sans);background:var(--rosa-fondo);color:var(--texto);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--titulo)}
.wrap{max-width:1100px;margin:0 auto;padding:0 16px}
.wrap-app{max-width:560px;margin:0 auto;padding:0 16px}
.script{font-family:var(--script);color:var(--rosa);font-weight:400}
.rosa{color:var(--rosa-osc)}
.muted{color:var(--gris)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[hidden]{display:none!important}

/* ---------- iconos (máscaras SVG) ---------- */
.ico{display:inline-block;width:20px;height:20px;background:currentColor;flex:none;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.i-wa{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 20l1.3-4A8 8 0 1112 20a8 8 0 01-4-1.1L4 20z'/%3E%3Cpath d='M9 9.5c0 3 2.5 5.5 5.5 5.5l1-1.5-2-1-1 .8a4 4 0 01-1.8-1.8l.8-1-1-2L9 9.5z' fill='black'/%3E%3C/svg%3E")}
.i-clock{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")}
.i-pin{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6-7-11a7 7 0 0114 0c0 5-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E")}
.i-cal{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15' rx='2'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E")}
.i-bag{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M5 8h14l-1 13H6L5 8z'/%3E%3Cpath d='M9 8V6a3 3 0 016 0v2'/%3E%3C/svg%3E")}
.i-arrow{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")}
.i-back{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 6l-6 6 6 6'/%3E%3C/svg%3E")}
.i-check{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.i-copy{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Crect x='8' y='8' width='12' height='12' rx='2'/%3E%3Cpath d='M16 8V5a1 1 0 00-1-1H5a1 1 0 00-1 1v10a1 1 0 001 1h3'/%3E%3C/svg%3E")}
.i-share{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='18' cy='5' r='2.5'/%3E%3Ccircle cx='6' cy='12' r='2.5'/%3E%3Ccircle cx='18' cy='19' r='2.5'/%3E%3Cpath d='M8.2 10.8l7.6-4.4M8.2 13.2l7.6 4.4'/%3E%3C/svg%3E")}
.i-plus{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E")}
.i-minus{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}
.i-edit{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16v4z'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E")}
.i-camera{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 8h3l2-3h6l2 3h3v11H4z'/%3E%3Ccircle cx='12' cy='13' r='3.5'/%3E%3C/svg%3E")}
.i-list{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M9 6h11M9 12h11M9 18h11'/%3E%3Ccircle cx='4.5' cy='6' r='1' fill='black'/%3E%3Ccircle cx='4.5' cy='12' r='1' fill='black'/%3E%3Ccircle cx='4.5' cy='18' r='1' fill='black'/%3E%3C/svg%3E")}
.i-lock{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 018 0v3'/%3E%3C/svg%3E")}
.i-info{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 11v5M12 8v.01'/%3E%3C/svg%3E")}
.i-download{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v12M7 11l5 5 5-5M4 20h16'/%3E%3C/svg%3E")}
.i-gear{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2.8l1.6 2.4 2.8-.7.6 2.8 2.6 1.3-1.1 2.6 1.1 2.6-2.6 1.3-.6 2.8-2.8-.7L12 21.2l-1.6-2.4-2.8.7-.6-2.8L4.4 15.4l1.1-2.6-1.1-2.6L7 8.9l.6-2.8 2.8.7z'/%3E%3C/svg%3E")}
.i-print{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M7 9V3h10v6M7 17H4v-7a1 1 0 011-1h14a1 1 0 011 1v7h-3'/%3E%3Crect x='7' y='14' width='10' height='7'/%3E%3C/svg%3E")}
.i-trash{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13'/%3E%3C/svg%3E")}
.i-x{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}
.i-salir{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h4a2 2 0 012 2v12a2 2 0 01-2 2h-4M10 16l-4-4 4-4M6 12h10'/%3E%3C/svg%3E")}

/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 24px;border-radius:40px;font-weight:600;font-size:15px;text-align:center;line-height:1.2;border:1.5px solid transparent;transition:filter .15s,transform .15s}
.btn:active{transform:translateY(1px)}
.btn:hover{filter:brightness(1.04)}
.btn-rosa{background:linear-gradient(180deg,var(--rosa-2),var(--rosa));color:#fff;box-shadow:0 12px 26px -14px rgba(255,31,135,.9)}
.btn-wa{background:var(--verde);color:#fff;box-shadow:0 12px 26px -14px rgba(31,168,85,.8)}
.btn-borde{border-color:var(--rosa);color:var(--rosa-osc);background:#fff}
.btn-gris{background:var(--rosa-suave);color:var(--rosa-osc)}
.btn-block{width:100%}
.btn-sm{min-height:40px;padding:8px 16px;font-size:13.5px}
.btn[disabled]{opacity:.5;pointer-events:none}

/* ---------- encabezado del cliente ---------- */
.top{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--linea)}
.top .wrap{display:flex;align-items:center;gap:12px;height:64px}
.marca{display:flex;align-items:center;gap:10px}
.marca img{width:44px;height:44px;border-radius:50%;box-shadow:0 4px 12px -6px rgba(209,13,104,.7)}
.marca span{font-family:var(--titulo);font-size:12px;font-weight:800;letter-spacing:2.4px;text-transform:uppercase;color:var(--tinta);line-height:1.05}
.marca span b{display:block;font-family:var(--script);font-size:25px;letter-spacing:0;text-transform:none;color:var(--rosa);font-weight:400}
.top .wa{margin-left:auto;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:30px;background:#effaf3;color:var(--verde-2);font-size:13px;font-weight:600;border:1px solid #cdeedb}
.top .wa .ico{width:18px;height:18px}

/* ---------- portada del menú ---------- */
.portada{text-align:center;padding:22px 0 8px;background:radial-gradient(ellipse at 50% 0,rgba(255,31,135,.16),transparent 70%)}
.portada .logo{width:min(250px,64vw);margin:0 auto;border-radius:50%;box-shadow:0 22px 40px -22px rgba(209,13,104,.8)}
.fecha{display:inline-block;max-width:100%;margin-top:16px;background:#fff;border:1px solid var(--linea);border-radius:30px;padding:8px 16px;font-size:13.5px;color:var(--tinta);box-shadow:var(--sombra)}
.fecha .ico{color:var(--rosa);width:17px;height:17px;vertical-align:-3px;margin-right:4px}
.fecha b{color:var(--rosa-osc);font-weight:600}
.estado{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 16px;margin:12px 0 4px;font-size:13px;color:var(--gris)}
.estado span{display:inline-flex;align-items:center;gap:6px}
.estado .ico{width:16px;height:16px;color:var(--rosa)}
.abierto{color:var(--verde-2)!important;font-weight:600}
.abierto:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--verde);box-shadow:0 0 0 4px rgba(31,168,85,.15)}
.cerrado{color:var(--gris)!important;font-weight:600}
.cerrado:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gris-2)}

/* ---------- categorías ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px;padding:14px 0 6px}
.chip{flex:none;height:38px;padding:0 16px;border-radius:30px;border:1px solid var(--linea);background:#fff;color:var(--texto);font-size:13.5px;display:inline-flex;align-items:center;gap:6px}
.chip.on{background:var(--rosa);border-color:var(--rosa);color:#fff;font-weight:600}
.chip i{font-style:normal;font-size:11.5px;opacity:.7}

/* ---------- tarjeta de plato del menú ---------- */
.titulo-sec{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px;margin:18px 0 10px}
.titulo-sec h2{font-size:20px;color:var(--tinta);font-weight:700}
.titulo-sec h2 .script{font-size:27px;margin-left:4px}
.titulo-sec small{color:var(--gris);font-size:12px}
.menu{display:grid;gap:12px}
.item{display:grid;grid-template-columns:100px 1fr;gap:14px;background:#fff;border:1px solid var(--linea);border-radius:var(--r);padding:10px;position:relative;box-shadow:0 8px 22px -20px rgba(209,13,104,.6)}
.item .foto{width:100px;height:100px;border-radius:14px;overflow:hidden;background:var(--rosa-suave)}
.item .foto img{width:100%;height:100%;object-fit:cover}
.item .info{display:flex;flex-direction:column;min-width:0}
.item h3{font-size:15.5px;font-weight:700;color:var(--tinta);line-height:1.25}
.item p{font-size:12.5px;color:var(--gris);margin-top:2px;line-height:1.4}
.item .pie{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:8px}
.precio{font-family:var(--titulo);font-size:19px;font-weight:800;color:var(--rosa-osc)}
.quedan{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--gris);margin-top:4px}
.quedan:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--verde)}
.quedan.pocas{color:var(--ambar);font-weight:600}
.quedan.pocas:before{background:#f0a500}
.quedan.nada{color:var(--rojo)}
.quedan.nada:before{background:var(--rojo)}
.item.agotado .foto img{filter:grayscale(1) opacity(.55)}
.item.agotado h3,.item.agotado .precio{color:var(--gris-2)}
.sello{position:absolute;top:16px;left:16px;background:var(--rojo);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:3px 8px;border-radius:6px}
.agregar{height:38px;padding:0 16px;white-space:nowrap;border-radius:30px;background:var(--rosa);color:#fff;font-weight:600;font-size:13.5px;display:inline-flex;align-items:center;gap:6px}
.agregar .ico{width:16px;height:16px}
.paso{display:inline-flex;align-items:center;background:var(--rosa-suave);border-radius:30px;height:38px}
.paso button{width:38px;height:38px;display:grid;place-items:center;color:var(--rosa-osc)}
.paso button .ico{width:16px;height:16px}
.paso b,.paso input{min-width:24px;width:34px;text-align:center;font-size:15px;color:var(--tinta);font-weight:600;background:none;border:0;outline:none;-moz-appearance:textfield}
.paso input::-webkit-outer-spin-button,.paso input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.paso.chico{height:34px}.paso.chico button{width:32px;height:34px}
form.poner{display:contents}
.cargando{opacity:.6;pointer-events:none}

/* ---------- barra inferior del pedido ---------- */
.barra-pedido{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(rgba(255,246,250,0),var(--rosa-fondo) 30%)}
.barra-pedido>a,.barra-pedido>button{display:flex;width:100%;align-items:center;gap:12px;max-width:560px;margin:0 auto;background:linear-gradient(180deg,var(--rosa-2),var(--rosa));color:#fff;border-radius:18px;padding:12px 16px;box-shadow:0 18px 40px -16px rgba(255,31,135,.7);text-align:left}
.barra-pedido .cuenta{width:34px;height:34px;border-radius:50%;background:#fff;color:var(--rosa-osc);display:grid;place-items:center;font-weight:700;font-size:14px;flex:none}
.barra-pedido .txt{line-height:1.2;font-size:13px}
.barra-pedido .txt b{display:block;font-size:15.5px}
.barra-pedido .total{margin-left:auto;font-weight:700;font-size:18px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.barra-pedido .enviar{background:var(--verde)!important;box-shadow:0 18px 40px -16px rgba(31,168,85,.7)!important}
.con-barra{padding-bottom:110px}

/* ---------- bloques informativos ---------- */
.caja{background:#fff;border:1px solid var(--linea);border-radius:var(--r);padding:18px;box-shadow:0 10px 26px -24px rgba(209,13,104,.6)}
.caja h3{font-size:16px;color:var(--tinta);margin-bottom:10px;font-weight:700}
.pasos-lista{list-style:none;display:grid;gap:12px}
.pasos-lista li{display:flex;gap:12px;align-items:flex-start;font-size:13.5px;color:var(--gris)}
.pasos-lista .n{width:28px;height:28px;border-radius:50%;background:var(--rosa);color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px;flex:none}
.pasos-lista b{display:block;color:var(--tinta);font-weight:600;font-size:14px}
.datos{display:grid;gap:10px;font-size:13.5px}
.datos div{display:flex;gap:10px;align-items:flex-start;color:var(--gris)}
.datos .ico{color:var(--rosa);width:18px;height:18px;margin-top:1px}
.datos b{color:var(--tinta);font-weight:600}
.datos a{color:var(--verde-2);font-weight:600}
.aviso{display:flex;gap:10px;align-items:flex-start;background:#fffbe0;border:1px dashed #e2d43a;border-radius:14px;padding:12px 14px;font-size:13px;color:var(--texto)}
.aviso .ico{color:var(--amarillo-osc);width:18px;height:18px;margin-top:1px}
.aviso.verde{background:#effaf3;border-color:#9fdcb8}
.aviso.verde .ico{color:var(--verde)}
.aviso.rosa{background:var(--rosa-suave);border-color:#f7a8cb}
.aviso.rosa .ico{color:var(--rosa)}
.aviso a{color:var(--rosa-osc);font-weight:600;text-decoration:underline}
.flash{margin:12px 0 0;border-radius:14px;padding:12px 14px;font-size:13.5px;font-weight:500;background:#effaf3;color:var(--verde-2);border:1px solid #bfe8cf}
.flash-error{background:#fff0ee;color:#b3261e;border-color:#f6c4bf}
.pie-sitio{text-align:center;color:var(--gris);font-size:12px;padding:26px 16px 30px;border-top:1px solid var(--linea);margin-top:26px;background:#fff}
.pie-sitio img{width:110px;margin:0 auto 10px;border-radius:50%}
.pie-sitio a{color:var(--verde-2);font-weight:600}

/* ---------- formulario del pedido ---------- */
.cabeza{display:flex;align-items:center;gap:12px;padding:16px 0 6px}
.volver{width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid var(--linea);display:grid;place-items:center;color:var(--rosa-osc);flex:none}
.cabeza h1{font-size:21px;color:var(--tinta);line-height:1.2}
.cabeza small{display:block;color:var(--gris);font-size:12.5px;font-weight:400;font-family:var(--sans)}
.linea-pedido{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px dashed var(--linea)}
.linea-pedido img{width:56px;height:56px;border-radius:12px;object-fit:cover}
.linea-pedido b{display:block;font-weight:600;color:var(--tinta);font-size:14.5px}
.linea-pedido small{color:var(--gris);font-size:12.5px}
.linea-pedido .der{text-align:right;display:grid;gap:6px;justify-items:end}
.linea-pedido .der strong{color:var(--rosa-osc);font-size:15px}
.totales{display:grid;gap:6px;padding:14px 0 4px;font-size:14px}
.totales div{display:flex;justify-content:space-between;color:var(--gris)}
.totales .total{color:var(--tinta);font-weight:600;font-size:17px;border-top:1px solid var(--linea);padding-top:10px;margin-top:4px}
.totales .total span:last-child{color:var(--rosa-osc);font-size:22px;font-family:var(--titulo);font-weight:800}
.campo{display:grid;gap:6px;margin-bottom:14px}
.campo label,.campo .etq{font-size:13px;color:var(--tinta);font-weight:600}
.campo label i,.campo .etq i{color:var(--rosa);font-style:normal}
.campo small{font-size:12px;color:var(--gris)}
.entrada{width:100%;height:50px;border-radius:12px;border:1px solid var(--linea);background:#fff;padding:0 14px;color:var(--tinta);outline:none}
.entrada::placeholder{color:var(--gris-2)}
.entrada:focus{border-color:var(--rosa);box-shadow:0 0 0 3px rgba(255,31,135,.12)}
textarea.entrada{height:84px;padding:12px 14px;resize:none}
.horas{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.hora{position:relative}
.hora input{position:absolute;opacity:0;pointer-events:none}
.hora span{height:44px;border-radius:12px;border:1px solid var(--linea);background:#fff;display:grid;place-items:center;font-size:13.5px;color:var(--texto);cursor:pointer}
.hora input:checked+span{background:var(--rosa);border-color:var(--rosa);color:#fff;font-weight:600}
.hora input:focus-visible+span{outline:2px solid var(--rosa-osc);outline-offset:2px}
.hora input:disabled+span{opacity:.4;text-decoration:line-through;cursor:default}
.vacio-caja{text-align:center;padding:30px 18px}
.vacio-caja .ico{width:46px;height:46px;color:var(--rosa);margin:0 auto 8px}

/* ---------- pedido enviado / WhatsApp ---------- */
.centro{text-align:center}
.ok-grande{width:86px;height:86px;border-radius:50%;margin:26px auto 14px;display:grid;place-items:center;background:#e3f7ea;box-shadow:0 0 0 10px rgba(31,168,85,.07);color:var(--verde)}
.ok-grande .ico{width:42px;height:42px}
.ok-grande.espera{background:#fff6d6;box-shadow:0 0 0 10px rgba(241,229,50,.18);color:var(--amarillo-osc)}
.centro h1{font-size:25px;color:var(--tinta);line-height:1.2}
.centro p{color:var(--gris);font-size:14px;margin-top:8px}
.codigo{display:inline-block;margin-top:14px;border:1.5px dashed var(--rosa);border-radius:14px;padding:8px 22px;background:#fff}
.codigo small{display:block;font-size:10.5px;letter-spacing:2px;text-transform:uppercase;color:var(--gris)}
.codigo b{font-family:var(--titulo);font-size:26px;color:var(--rosa-osc);letter-spacing:2px}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:4px 10px;border-radius:20px;background:#e3f7ea;color:var(--verde-2)}
.pill.gris{background:#f1eaee;color:var(--gris)}
.pill.ambar{background:#fff3cc;color:#8a6200}
.pill.rojo{background:#ffe5e2;color:#b3261e}
.pill.rosa{background:var(--rosa-suave);color:var(--rosa-osc)}
.chat{background:#efeae2;border-radius:18px;overflow:hidden;border:1px solid #e0d8cd;text-align:left}
.chat .cab{display:flex;align-items:center;gap:10px;background:#008069;padding:10px 12px;color:#fff;font-size:14px}
.chat .cab img{width:34px;height:34px;border-radius:50%;object-fit:cover;background:#fff}
.chat .cab small{display:block;font-size:11.5px;color:#d3efe9}
.chat .cuerpo{padding:12px;display:grid;gap:8px}
.burbuja{max-width:88%;border-radius:10px;padding:8px 10px 4px;font-size:13px;line-height:1.45;color:#111b21;white-space:pre-line;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.burbuja.yo{justify-self:end;background:#d9fdd3;border-top-right-radius:2px}
.burbuja.el{justify-self:start;background:#fff;border-top-left-radius:2px}
.burbuja .h{display:block;text-align:right;font-size:10.5px;color:#667781;margin-top:2px}
.burbuja b{font-weight:700}

/* ---------- panel de Andrea ---------- */
.app-top{display:flex;align-items:center;gap:12px;padding:14px 0;min-width:0}
.app-top .marca img{width:42px;height:42px}
.panel main.wrap-app{padding-top:8px}
.app-top .salir{margin-left:auto;display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 16px;border-radius:30px;background:#fff;border:1.5px solid var(--rosa);color:var(--rosa-osc);font-size:13.5px;font-weight:600;white-space:nowrap;flex:none}
.app-top .salir .ico{width:17px;height:17px}
.app-top .salir:active{background:var(--rosa-suave)}
.hola{font-size:22px;color:var(--tinta);margin:6px 0 2px}
.hola .script{font-size:32px}
.tarjeta-estado{background:linear-gradient(135deg,var(--rosa-2),var(--rosa-osc));color:#fff;border-radius:22px;padding:18px;margin:14px 0;box-shadow:0 20px 40px -24px rgba(209,13,104,.9)}
.tarjeta-estado .fila{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tarjeta-estado .fila b{font-family:var(--titulo);font-size:16px}
.tarjeta-estado .pill{background:rgba(255,255,255,.95);white-space:nowrap}
.cifras{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
.cifras div{background:rgba(255,255,255,.16);border-radius:12px;padding:10px;text-align:center}
.cifras b{display:block;font-family:var(--titulo);font-size:22px;color:#fff}
.cifras small{font-size:11.5px;color:rgba(255,255,255,.88)}
.tarjeta-estado .pedidos-hoy{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.28);font-size:13.5px}
.tarjeta-estado .pedidos-hoy a{font-weight:600;text-decoration:underline}
.acciones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.accion{background:#fff;border:1px solid var(--linea);border-radius:18px;padding:16px;display:grid;gap:8px;align-content:start;min-height:120px;box-shadow:0 10px 26px -24px rgba(209,13,104,.6)}
.accion .ic{width:42px;height:42px;border-radius:12px;background:var(--rosa-suave);display:grid;place-items:center;color:var(--rosa)}
.accion b{display:block;color:var(--tinta);font-size:14.5px;font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.accion small{display:block;color:var(--gris);font-size:12px;line-height:1.35}
.accion .num{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--rosa);color:#fff;font-size:12px;font-weight:700;margin-left:4px;vertical-align:1px}
.accion.grande{grid-column:1/-1;background:linear-gradient(180deg,var(--rosa-2),var(--rosa));border:0;color:#fff;grid-template-columns:auto 1fr auto;align-items:center;min-height:0;box-shadow:0 16px 30px -18px rgba(255,31,135,.9)}
.accion.grande .ic{background:rgba(255,255,255,.2);color:#fff}
.accion.grande b,.accion.grande small{color:#fff}
.fila-prod{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;padding:12px;background:#fff;border:1px solid var(--linea);border-radius:16px}
.fila-prod img{width:52px;height:52px;border-radius:12px;object-fit:cover}
.fila-prod b{display:block;color:var(--tinta);font-size:14.5px;font-weight:600;line-height:1.25}
.fila-prod small{color:var(--gris);font-size:12px}
.fila-prod .nombre{min-width:0}
.fila-prod .nombre a{display:block}
.fila-prod .nombre a:hover b{color:var(--rosa-osc)}
.fila-prod.off{background:#fbf6f8}
.fila-prod.off img,.fila-prod.off .nombre,.fila-prod.off .ajustes{opacity:.5}
.fila-prod .ajustes{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;border-top:1px dashed var(--linea);padding-top:10px;font-size:12.5px;color:var(--gris)}
.fila-prod .ajustes label{display:flex;align-items:center;gap:8px}
.precio-ed{display:inline-flex;align-items:center;background:var(--rosa-suave);border-radius:10px;padding:0 4px 0 10px;height:34px;color:var(--rosa-osc);font-weight:700}
.precio-ed input{width:58px;background:none;border:0;outline:none;color:var(--rosa-osc);font-weight:700;font-size:14px}
.switch{width:48px;height:28px;border-radius:20px;background:#eadde3;position:relative;flex:none;cursor:pointer}
.switch input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.switch:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:.2s;pointer-events:none}
.switch:has(input:checked){background:var(--verde)}
.switch:has(input:checked):after{left:23px}
.switch:has(input:focus-visible){outline:2px solid var(--rosa-osc);outline-offset:2px}
.lista-prod{display:grid;gap:10px}
.banda-copia{display:flex;align-items:center;gap:12px;background:#fffbe0;border:1px solid #eadf5c;border-radius:16px;padding:12px 14px;margin:12px 0}
.banda-copia .ico{color:var(--amarillo-osc);width:22px;height:22px}
.banda-copia b{color:var(--tinta);font-size:14px;display:block}
.banda-copia small{color:var(--gris);font-size:12px}
.barra-fija{position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(255,255,255,.96);border-top:1px solid var(--linea);padding:10px 16px calc(10px + env(safe-area-inset-bottom));backdrop-filter:blur(8px)}
.barra-fija .wrap-app{display:flex;gap:10px;align-items:center;padding:0}
.barra-fija .resumen{min-width:0;font-size:12px;color:var(--gris);line-height:1.3}
.barra-fija .resumen b{display:block;color:var(--tinta);font-size:14px}
.barra-fija .btn{margin-left:auto;white-space:nowrap;flex:none}
.subida{border:2px dashed #f4a6c9;border-radius:18px;background:#fff;height:220px;display:grid;place-items:center;text-align:center;color:var(--gris);font-size:13px;overflow:hidden;position:relative;cursor:pointer}
.subida img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.subida input{position:absolute;inset:0;opacity:0;cursor:pointer}
.subida .vacia .ico{width:40px;height:40px;color:var(--rosa);margin:0 auto 6px}
.subida .cambiar{position:absolute;right:10px;bottom:10px;background:rgba(46,22,35,.78);color:#fff;font-size:12.5px;border-radius:20px;padding:6px 12px;display:inline-flex;gap:6px;align-items:center;pointer-events:none}
.segmento{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));background:#fff;border:1px solid var(--linea);border-radius:12px;padding:4px;gap:4px}
.segmento label{position:relative}
.segmento input{position:absolute;opacity:0;pointer-events:none}
.segmento span{min-height:40px;padding:4px 6px;border-radius:9px;display:grid;place-items:center;text-align:center;font-size:13px;color:var(--gris);cursor:pointer;line-height:1.2}
.segmento input:checked+span{background:var(--rosa);color:#fff;font-weight:600}
.segmento input:focus-visible+span{outline:2px solid var(--rosa-osc)}
.enlace{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--linea);border-radius:14px;padding:6px 6px 6px 14px;font-size:14px;color:var(--tinta)}
.enlace span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qr-caja{background:#fff;border-radius:20px;padding:14px;width:min(250px,76vw);margin:6px auto 0;border:1px solid var(--linea)}
.qr-caja img,.qr-caja svg{display:block;width:100%;height:auto}
.pin{display:flex;justify-content:center;gap:12px;margin:18px 0}
.pin span{width:52px;height:60px;border-radius:14px;background:#fff;border:1.5px solid var(--linea);display:grid;place-items:center;font-size:30px;color:var(--rosa)}
.pin span.on{border-color:var(--rosa)}
.pin.error span{border-color:var(--rojo);animation:temblar .35s}
@keyframes temblar{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.teclado{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:300px;margin:0 auto}
.teclado button{height:58px;border-radius:16px;background:#fff;border:1px solid var(--linea);display:grid;place-items:center;font-size:22px;color:var(--tinta);font-weight:500}
.teclado button:active{background:var(--rosa-suave)}
.teclado .vacio{background:none;border:0}
.teclado .borrar{font-size:14px;color:var(--gris)}
.lista-pedidos{display:grid;gap:12px}
.ped{background:#fff;border:1px solid var(--linea);border-radius:18px;padding:14px;scroll-margin-top:20px}
.ped.cancelado{opacity:.6}
.ped .fila{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ped .num{font-family:var(--titulo);font-weight:800;color:var(--rosa-osc);font-size:17px}
.ped .quien{font-weight:600;color:var(--tinta)}
.ped .hora-r{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--tinta);font-weight:600}
.ped .hora-r .ico{width:16px;height:16px;color:var(--rosa)}
.ped ul{list-style:none;margin:10px 0;font-size:13.5px;display:grid;gap:3px}
.ped li{display:flex;justify-content:space-between;gap:8px}
.ped .nota{font-size:12.5px;color:var(--texto);background:var(--rosa-fondo);border-radius:10px;padding:8px 10px;margin-bottom:10px}
.ped .tot{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px dashed var(--linea);padding-top:10px;font-weight:700;color:var(--tinta)}
.ped .botones{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.ped .botones form{display:contents}
.ped .botones .btn{min-height:38px;padding:6px 14px;font-size:13px;flex:1}
.dias{display:flex;flex-wrap:wrap;gap:6px}
.dias label{position:relative}
.dias input{position:absolute;opacity:0}
.dias span{display:grid;place-items:center;min-width:46px;height:40px;border-radius:10px;border:1px solid var(--linea);background:#fff;font-size:13px;cursor:pointer}
.dias input:checked+span{background:var(--rosa);border-color:var(--rosa);color:#fff;font-weight:600}
.dos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.dos>*{min-width:0}
.sep{border:0;border-top:1px dashed var(--linea);margin:18px 0}
.navfecha{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0 14px}
.navfecha a{font-size:13px;color:var(--rosa-osc);font-weight:600}
.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:var(--tinta);color:#fff;font-size:13.5px;padding:10px 16px;border-radius:12px;z-index:60;max-width:90vw;box-shadow:0 10px 30px -10px rgba(0,0,0,.4)}

/* ---------- escritorio ---------- */
@media (min-width:760px){
  .menu{grid-template-columns:1fr 1fr}
  .item{grid-template-columns:124px 1fr}
  .item .foto{width:124px;height:124px}
  .portada{padding-top:30px}
}
@media (min-width:1080px){
  .menu{grid-template-columns:1fr 1fr 1fr}
  .info-dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
}
@media (max-width:360px){
  .item{grid-template-columns:84px 1fr;gap:10px}
  .item .foto{width:84px;height:84px}
  .horas{grid-template-columns:repeat(3,1fr)}
  .dos{grid-template-columns:minmax(0,1fr)}
  .app-top .marca span{font-size:10.5px;letter-spacing:1.6px}
  .app-top .marca span b{font-size:21px}
}
