Huellas Verdes — Pedido Quincenal
@import url(‘https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,600;1,9..144,300&family=DM+Sans:wght@400;500&display=swap’);
:root {
–verde-bosque: #2D5016;
–verde-musgo: #4A7C2F;
–verde-lima: #8DB94A;
–crema: #F7F3EA;
–crema-oscura: #EDE5D0;
–tierra: #8B5E3C;
–arcilla: #C4733A;
–texto: #1E1E1E;
–texto-suave: #5A5A4A;
–blanco: #FFFFFF;
–sombra: rgba(45,80,22,0.12);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: ‘DM Sans’, sans-serif;
background: var(–crema);
color: var(–texto);
min-height: 100vh;
}
header {
background: var(–verde-bosque);
position: sticky;
top: 0;
z-index: 100;
box-shadow: 0 2px 12px rgba(0,0,0,0.2);
}
.header-top {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 16px;
}
.logo { display: flex; align-items: center; gap: 10px; }
.logo-icon {
width: 44px; height: 44px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
}
.logo-text {
font-family: ‘Fraunces’, serif;
font-size: 1.2rem;
font-weight: 600;
color: var(–crema);
line-height: 1;
}
.logo-sub {
font-family: ‘DM Sans’, sans-serif;
font-size: 0.6rem;
color: var(–verde-lima);
letter-spacing: 0.1em;
text-transform: uppercase;
display: block;
margin-top: 2px;
}
.carrito-btn {
background: var(–arcilla);
border: none;
border-radius: 24px;
padding: 8px 14px;
color: white;
font-family: ‘DM Sans’, sans-serif;
font-size: 0.85rem;
font-weight: 500;
cursor: pointer;
display: flex;
align-items: center;
gap: 6px;
transition: background 0.2s;
flex-shrink: 0;
}
.carrito-btn:hover { background: #b5632d; }
.carrito-count {
background: white;
color: var(–arcilla);
border-radius: 50%;
width: 20px; height: 20px;
font-size: 0.75rem;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
}
.quincena-banner {
background: linear-gradient(135deg, var(–verde-musgo), var(–verde-bosque));
padding: 8px 16px;
text-align: center;
font-size: 0.78rem;
color: var(–crema-oscura);
letter-spacing: 0.05em;
}
.nombre-section {
background: var(–blanco);
padding: 16px;
border-bottom: 2px solid var(–crema-oscura);
}
.nombre-section h2 {
font-family: ‘Fraunces’, serif;
font-size: 1.05rem;
font-weight: 300;
color: var(–verde-bosque);
margin-bottom: 8px;
}
.nombre-input {
width: 100%;
padding: 12px 16px;
border: 2px solid var(–crema-oscura);
border-radius: 10px;
font-family: ‘DM Sans’, sans-serif;
font-size: 1rem;
background: var(–crema);
color: var(–texto);
transition: border-color 0.2s;
outline: none;
}
.nombre-input:focus { border-color: var(–verde-musgo); background: white; }
.nombre-input.error { border-color: #c0392b; background: #fff5f5; }
.categorias-nav {
background: var(–blanco);
padding: 10px 12px;
overflow-x: auto;
display: flex;
gap: 8px;
border-bottom: 1px solid var(–crema-oscura);
scrollbar-width: none;
position: sticky;
top: 64px;
z-index: 50;
}
.categorias-nav::-webkit-scrollbar { display: none; }
.cat-pill {
flex-shrink: 0;
padding: 6px 12px;
border-radius: 20px;
border: 2px solid var(–crema-oscura);
background: transparent;
font-family: ‘DM Sans’, sans-serif;
font-size: 0.78rem;
font-weight: 500;
color: var(–texto-suave);
cursor: pointer;
transition: all 0.2s;
white-space: nowrap;
}
.cat-pill:hover { border-color: var(–verde-musgo); color: var(–verde-musgo); }
.cat-pill.active { background: var(–verde-bosque); border-color: var(–verde-bosque); color: white; }
.productos-main {
padding: 12px;
max-width: 700px;
margin: 0 auto;
}
.categoria-header {
display: flex;
align-items: center;
gap: 10px;
margin: 20px 0 10px;
padding-bottom: 6px;
border-bottom: 2px solid var(–crema-oscura);
}
.categoria-header:first-of-type { margin-top: 6px; }
.cat-emoji { font-size: 1.3rem; }
.cat-nombre {
font-family: ‘Fraunces’, serif;
font-size: 1.1rem;
font-weight: 600;
color: var(–verde-bosque);
}
.cat-count {
font-size: 0.72rem;
color: var(–texto-suave);
margin-left: auto;
background: var(–crema-oscura);
padding: 2px 8px;
border-radius: 12px;
}
.productos-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 8px;
}
@media (max-width: 480px) {
.productos-grid { grid-template-columns: repeat(2, 1fr); gap: 6px; }
}
.producto-card {
background: var(–blanco);
border-radius: 12px;
padding: 10px 8px 8px;
box-shadow: 0 1px 4px var(–sombra);
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
transition: box-shadow 0.2s;
border: 2px solid transparent;
text-align: center;
}
.producto-card:hover { box-shadow: 0 4px 14px var(–sombra); }
.producto-card.en-carrito { border-color: var(–verde-lima); background: #f8fdf3; }
.producto-info { width: 100%; }
.producto-nombre {
font-size: 0.8rem;
font-weight: 500;
color: var(–texto);
line-height: 1.25;
min-height: 2.5em;
display: flex;
align-items: center;
justify-content: center;
}
.producto-detalle { font-size: 0.68rem; color: var(–texto-suave); margin-top: 2px; }
.producto-productor { font-size: 0.65rem; color: var(–arcilla); font-weight: 500; margin-top: 1px; }
.producto-precio {
font-family: ‘Fraunces’, serif;
font-size: 0.95rem;
font-weight: 600;
color: var(–verde-bosque);
white-space: nowrap;
}
.cantidad-control {
display: flex;
align-items: center;
width: 100%;
justify-content: center;
}
.qty-btn {
width: 30px; height: 30px;
border: 2px solid var(–crema-oscura);
background: var(–crema);
color: var(–verde-bosque);
font-size: 1.1rem;
font-weight: 700;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.15s;
line-height: 1;
flex-shrink: 0;
}
.qty-btn.minus { border-radius: 8px 0 0 8px; }
.qty-btn.plus { border-radius: 0 8px 8px 0; border-left: none; }
.qty-btn:hover { background: var(–crema-oscura); }
.qty-btn:active { transform: scale(0.92); }
.qty-display {
width: 38px; height: 30px;
border: 2px solid var(–crema-oscura);
border-left: none; border-right: none;
background: white;
text-align: center;
font-family: ‘DM Sans’, sans-serif;
font-size: 0.88rem;
font-weight: 500;
color: var(–texto);
display: flex;
align-items: center;
justify-content: center;
}
.hidden { display: none; }
.carrito-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0,0,0,0.5);
z-index: 200;
backdrop-filter: blur(2px);
}
.carrito-overlay.visible { display: block; }
.carrito-panel {
position: fixed;
right: 0; top: 0; bottom: 0;
width: min(420px, 100vw);
background: var(–blanco);
z-index: 201;
display: flex;
flex-direction: column;
transform: translateX(100%);
transition: transform 0.3s ease;
box-shadow: -4px 0 24px rgba(0,0,0,0.2);
}
.carrito-panel.visible { transform: translateX(0); }
.carrito-header {
background: var(–verde-bosque);
padding: 18px 20px;
color: white;
display: flex;
justify-content: space-between;
align-items: center;
}
.carrito-header h2 { font-family: ‘Fraunces’, serif; font-weight: 300; font-size: 1.25rem; }
.cerrar-btn {
background: none; border: none;
color: white; font-size: 1.5rem;
cursor: pointer; padding: 4px; line-height: 1;
}
.carrito-items { flex: 1; overflow-y: auto; padding: 14px; }
.carrito-item {
padding: 10px 0;
border-bottom: 1px solid var(–crema-oscura);
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 8px;
}
.carrito-item-nombre { font-size: 0.86rem; font-weight: 500; flex: 1; }
.carrito-item-meta { font-size: 0.73rem; color: var(–texto-suave); margin-top: 2px; }
.carrito-item-precio {
font-family: ‘Fraunces’, serif;
font-weight: 600;
color: var(–verde-bosque);
font-size: 0.92rem;
white-space: nowrap;
}
.carrito-vacio { text-align: center; padding: 40px 20px; color: var(–texto-suave); }
.carrito-vacio span { font-size: 2.5rem; display: block; margin-bottom: 12px; }
.carrito-footer {
padding: 16px;
background: var(–crema);
border-top: 2px solid var(–crema-oscura);
}
.carrito-total {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 12px;
}
.carrito-total span { font-size: 0.88rem; color: var(–texto-suave); }
.carrito-total strong {
font-family: ‘Fraunces’, serif;
font-size: 1.35rem;
color: var(–verde-bosque);
}
.comentario-section { margin-bottom: 12px; }
.comentario-section label {
display: block;
font-size: 0.82rem;
font-weight: 500;
color: var(–texto-suave);
margin-bottom: 6px;
}
.comentario-input {
width: 100%;
padding: 10px 12px;
border: 2px solid var(–crema-oscura);
border-radius: 8px;
font-family: ‘DM Sans’, sans-serif;
font-size: 0.88rem;
background: white;
color: var(–texto);
resize: vertical;
min-height: 60px;
outline: none;
transition: border-color 0.2s;
}
.comentario-input:focus { border-color: var(–verde-musgo); }
.enviar-btn {
width: 100%;
padding: 15px;
background: var(–arcilla);
color: white;
border: none;
border-radius: 12px;
font-family: ‘DM Sans’, sans-serif;
font-size: 1rem;
font-weight: 500;
cursor: pointer;
transition: background 0.2s;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
}
.enviar-btn:hover { background: #b5632d; }
.enviar-btn:disabled { opacity: 0.65; cursor: not-allowed; }
.modal-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0,0,0,0.6);
z-index: 300;
align-items: center;
justify-content: center;
}
.modal-overlay.visible { display: flex; }
.modal-box {
background: white;
border-radius: 20px;
padding: 36px 28px;
max-width: 320px;
width: 90%;
text-align: center;
box-shadow: 0 8px 40px rgba(0,0,0,0.25);
}
.modal-icon { font-size: 3rem; margin-bottom: 12px; }
.modal-box h2 {
font-family: ‘Fraunces’, serif;
font-size: 1.4rem;
color: var(–verde-bosque);
margin-bottom: 10px;
}
.modal-box p { font-size: 0.9rem; color: var(–texto-suave); margin-bottom: 20px; line-height: 1.5; }
.modal-btn {
background: var(–verde-musgo);
color: white;
border: none;
border-radius: 10px;
padding: 12px 28px;
font-family: ‘DM Sans’, sans-serif;
font-size: 1rem;
font-weight: 500;
cursor: pointer;
}
.modal-btn:hover { background: var(–verde-bosque); }
footer {
text-align: center;
padding: 24px 16px;
font-size: 0.78rem;
color: var(–texto-suave);
border-top: 1px solid var(–crema-oscura);
margin-top: 20px;
}
.spinner {
width: 18px; height: 18px;
border: 2px solid rgba(255,255,255,0.4);
border-top-color: white;
border-radius: 50%;
animation: spin 0.7s linear infinite;
display: inline-block;
}
@keyframes spin { to { transform: rotate(360deg); } }
¿Quién hace este pedido?
🥬Aún no has agregado nada.
¡Explora la oferta!
🌱
¡Pedido enviado!
Tu pedido ha sido registrado. ¡Nos vemos en la próxima distribución!
// ============================================================
// ⚙️ URL DEL SCRIPT — ya configurada, no tocar
// ============================================================
const GOOGLE_SCRIPT_URL = ‘https://script.google.com/macros/s/AKfycbzaojcr2rAB7yeaxwfa70pkbRflr8XWqFxOtBKJVbWRnV6JJ9EdOel-j5RwNMOoX00/exec’;
// ============================================================
// 📦 PRODUCTOS
// Categorías: unidad | kilo | hojas | sabrosos | fruta | andrea | otros | huevos | paltas
// paso: 1 = de uno en uno, 0.5 = de medio en medio kilo
// ============================================================
const PRODUCTOS = [
// VERDURAS POR UNIDAD (paso 1)
{ id: 1, cat: ‘unidad’, paso: 1, nombre: ‘Apio’, precio: 1666, unidad: ‘unidad’, productor: ‘Andrea’ },
{ id: 2, cat: ‘unidad’, paso: 1, nombre: ‘Apio papa’, precio: 1904, unidad: ‘unidad’, productor: ‘Andrea’ },
{ id: 3, cat: ‘unidad’, paso: 1, nombre: ‘Betarraga’, precio: 1547, unidad: ‘atado’, productor: ‘Andrea’ },
{ id: 4, cat: ‘unidad’, paso: 1, nombre: ‘Coliflor’, precio: 1785, unidad: ‘unidad’, productor: ‘Gonzalo’ },
{ id: 5, cat: ‘unidad’, paso: 1, nombre: ‘Colirábano morado/blanco tierno’, precio: 1190, unidad: ‘unidad’, productor: ‘Andrea’ },
{ id: 6, cat: ‘unidad’, paso: 1, nombre: ‘Nabo’, precio: 833, unidad: ‘unidad’, productor: ‘Cholitas’ },
{ id: 7, cat: ‘unidad’, paso: 1, nombre: ‘Pimiento rojo’, precio: 476, unidad: ‘unidad’, productor: ‘Gonzalo’ },
{ id: 8, cat: ‘unidad’, paso: 1, nombre: ‘Pimiento verde’, precio: 476, unidad: ‘unidad’, productor: ‘Gonzalo’ },
{ id: 9, cat: ‘unidad’, paso: 1, nombre: ‘Puerro’, precio: 595, unidad: ‘unidad’, productor: ‘Andrea’ },
{ id: 10, cat: ‘unidad’, paso: 1, nombre: ‘Rabanito’, precio: 1190, unidad: ‘atado’, productor: ‘Cholitas’ },
{ id: 11, cat: ‘unidad’, paso: 1, nombre: ‘Rábano Nero Tondo’, precio: 2975, unidad: ‘atado ½ kg (2 un)’, productor: ‘Tamara’ },
{ id: 12, cat: ‘unidad’, paso: 1, nombre: ‘Rábano Wasabi’, precio: 2975, unidad: ‘atado ½ kg (2 un)’, productor: ‘Tamara’ },
{ id: 13, cat: ‘unidad’, paso: 1, nombre: ‘Ruibarbo’, precio: 8925, unidad: ‘atado ½ kg’, productor: ‘Tamara’ },
{ id: 14, cat: ‘unidad’, paso: 1, nombre: ‘Zapallo Camote trozo’, precio: 1904, unidad: ‘kilo’, productor: ‘Andrea’ },
// VERDURAS POR KILO (paso 0.5)
{ id: 15, cat: ‘kilo’, paso: 0.5, nombre: ‘Apio papa’, precio: 9520, unidad: ‘kilo’, productor: ‘Tamara’ },
{ id: 16, cat: ‘kilo’, paso: 0.5, nombre: ‘Apio Tango’, precio: 6545, unidad: ‘kilo’, productor: ‘Tamara’ },
{ id: 17, cat: ‘kilo’, paso: 0.5, nombre: ‘Papa’, precio: 1904, unidad: ‘kilo’, productor: ‘Andrea’ },
{ id: 18, cat: ‘kilo’, paso: 0.5, nombre: ‘Tomate herencia colores’, precio: 4165, unidad: ‘kilo’, productor: ‘Pato Pro’ },
{ id: 19, cat: ‘kilo’, paso: 0.5, nombre: ‘Tomate negro Black Beauty’, precio: 4165, unidad: ‘kilo’, productor: ‘Pato Pro’ },
{ id: 20, cat: ‘kilo’, paso: 0.5, nombre: ‘Tomate rojo criollo’, precio: 4165, unidad: ‘kilo’, productor: ‘Pato Pro’ },
{ id: 21, cat: ‘kilo’, paso: 0.5, nombre: ‘Tomate rosado’, precio: 4165, unidad: ‘kilo’, productor: ‘Pato Pro’ },
{ id: 22, cat: ‘kilo’, paso: 0.5, nombre: ‘Topinambur’, precio: 5355, unidad: ‘kilo’, productor: ‘Pato Pro’ },
{ id: 23, cat: ‘kilo’, paso: 0.5, nombre: ‘Topinambur’, precio: 9520, unidad: ‘kilo’, productor: ‘Tamara’ },
{ id: 24, cat: ‘kilo’, paso: 0.5, nombre: ‘Zanahorias’, precio: 2368, unidad: ‘kilo’, productor: ‘Cholitas’ },
// HOJAS (paso 1)
{ id: 25, cat: ‘hojas’, paso: 1, nombre: ‘Acelga color’, precio: 1785, unidad: ‘atado 400 gr’, productor: ‘Pato Pro’ },
{ id: 26, cat: ‘hojas’, paso: 1, nombre: ‘Acelga mix’, precio: 3570, unidad: ‘atado 500 gr’, productor: ‘Tamara’ },
{ id: 27, cat: ‘hojas’, paso: 1, nombre: ‘Achicoria crespa’, precio: 952, unidad: ‘unidad’, productor: ‘Andrea’ },
{ id: 28, cat: ‘hojas’, paso: 1, nombre: ‘Kale crespo colores’, precio: 1785, unidad: ‘bolsa 250 gr’, productor: ‘Pato Pro’ },
{ id: 29, cat: ‘hojas’, paso: 1, nombre: ‘Kale Darkibor’, precio: 2142, unidad: ‘porción 300 gr’, productor: ‘Tamara’ },
{ id: 30, cat: ‘hojas’, paso: 1, nombre: ‘Kale Lacinato’, precio: 2142, unidad: ‘porción 300 gr’, productor: ‘Tamara’ },
{ id: 31, cat: ‘hojas’, paso: 1, nombre: ‘Kale Redbor’, precio: 2142, unidad: ‘porción 300 gr’, productor: ‘Tamara’ },
{ id: 32, cat: ‘hojas’, paso: 1, nombre: ‘Kale Toscano’, precio: 1785, unidad: ‘porción 250 gr’, productor: ‘Pato Pro’ },
{ id: 33, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga Bambi’, precio: 1785, unidad: ‘unidad’, productor: ‘Tamara’ },
{ id: 34, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga costina’, precio: 952, unidad: ‘unidad’, productor: ‘Pato Pro’ },
{ id: 35, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga española morada’, precio: 714, unidad: ‘unidad’, productor: ‘Gonzalo’ },
{ id: 36, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga española verde’, precio: 714, unidad: ‘unidad’, productor: ‘Gonzalo’ },
{ id: 37, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga marina morada’, precio: 714, unidad: ‘unidad’, productor: ‘Gonzalo’ },
{ id: 38, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga marina verde’, precio: 714, unidad: ‘unidad’, productor: ‘Gonzalo’ },
{ id: 39, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga marina verde’, precio: 952, unidad: ‘unidad’, productor: ‘Pato Pro’ },
{ id: 40, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga sorpresa’, precio: 774, unidad: ‘unidad’, productor: ‘Andrea’ },
{ id: 41, cat: ‘hojas’, paso: 1, nombre: ‘Lechuga Volcana’, precio: 1785, unidad: ‘unidad’, productor: ‘Tamara’ },
{ id: 42, cat: ‘hojas’, paso: 1, nombre: ‘Mix de hojas’, precio: 1428, unidad: ‘porción 100 gr’, productor: ‘Andrea’ },
{ id: 43, cat: ‘hojas’, paso: 1, nombre: ‘Mix de hojas’, precio: 5355, unidad: ‘porción 300 gr’, productor: ‘Tamara’ },
// OTROS SABROSOS (paso 1)
{ id: 44, cat: ‘sabrosos’, paso: 1, nombre: ‘Ají variedad sorpresa’, precio: 238, unidad: ‘unidad’, productor: ‘Andrea’ },
{ id: 45, cat: ‘sabrosos’, paso: 1, nombre: ‘Ajo’, precio: 536, unidad: ‘unidad’, productor: ‘Andrea’ },
{ id: 46, cat: ‘sabrosos’, paso: 1, nombre: ‘Ajo chilote’, precio: 1190, unidad: ‘unidad’, productor: ‘Tamara’ },
{ id: 47, cat: ‘sabrosos’, paso: 1, nombre: ‘Cebolla’, precio: 1190, unidad: ‘kilo’, productor: ‘Andrea’ },
{ id: 48, cat: ‘sabrosos’, paso: 1, nombre: ‘Cebolla’, precio: 1428, unidad: ‘kilo’, productor: ‘Gonzalo’ },
{ id: 49, cat: ‘sabrosos’, paso: 1, nombre: ‘Cebolla unidad’, precio: 286, unidad: ‘unidad ~200 gr’, productor: ‘Gonzalo’ },
{ id: 50, cat: ‘sabrosos’, paso: 1, nombre: ‘Cebollín’, precio: 464, unidad: ‘unidad’, productor: ‘Cholitas’ },
{ id: 51, cat: ‘sabrosos’, paso: 1, nombre: ‘Lemongrass / Hierba Luisa’, precio: 1785, unidad: ‘atado’, productor: ‘Cholitas’ },
{ id: 52, cat: ‘sabrosos’, paso: 1, nombre: ‘Matico’, precio: 1785, unidad: ‘atado’, productor: ‘Cholitas’ },
{ id: 53, cat: ‘sabrosos’, paso: 1, nombre: ‘Melisa’, precio: 1666, unidad: ‘atado’, productor: ‘Cholitas’ },
{ id: 54, cat: ‘sabrosos’, paso: 1, nombre: ‘Menta’, precio: 1547, unidad: ‘atado’, productor: ‘Cholitas’ },
{ id: 55, cat: ‘sabrosos’, paso: 1, nombre: ‘Menta’, precio: 595, unidad: ‘atado’, productor: ‘Pato Pro’ },
{ id: 56, cat: ‘sabrosos’, paso: 1, nombre: ‘Menta negra’, precio: 2678, unidad: ‘ramo 150 gr’, productor: ‘Tamara’ },
{ id: 57, cat: ‘sabrosos’, paso: 1, nombre: ‘Orégano’, precio: 952, unidad: ‘paquete’, productor: ‘Pato Pro’ },
{ id: 58, cat: ‘sabrosos’, paso: 1, nombre: ‘Perejil’, precio: 1071, unidad: ‘atado’, productor: ‘Andrea’ },
{ id: 59, cat: ‘sabrosos’, paso: 1, nombre: ‘Perejil crespo’, precio: 2142, unidad: ‘ramo 150 gr’, productor: ‘Tamara’ },
{ id: 60, cat: ‘sabrosos’, paso: 1, nombre: ‘Perejil liso’, precio: 2142, unidad: ‘ramo 150 gr’, productor: ‘Tamara’ },
{ id: 61, cat: ‘sabrosos’, paso: 1, nombre: ‘Romero’, precio: 952, unidad: ‘paquete’, productor: ‘Pato Pro’ },
{ id: 62, cat: ‘sabrosos’, paso: 1, nombre: ‘Ruda’, precio: 1785, unidad: ‘atado’, productor: ‘Cholitas’ },
{ id: 63, cat: ‘sabrosos’, paso: 1, nombre: ‘Salvia’, precio: 1785, unidad: ‘atado’, productor: ‘Cholitas’ },
// FRUTA (paso 0.5)
{ id: 64, cat: ‘fruta’, paso: 0.5, nombre: ‘Caqui’, precio: 2261, unidad: ‘kilo’, productor: ‘Andrea’ },
{ id: 65, cat: ‘fruta’, paso: 0.5, nombre: ‘Kiwi’, precio: 2368, unidad: ‘kilo’, productor: ‘Cholitas’ },
{ id: 66, cat: ‘fruta’, paso: 0.5, nombre: ‘Limón’, precio: 714, unidad: ‘kilo’, productor: ‘Gonzalo’ },
{ id: 67, cat: ‘fruta’, paso: 0.5, nombre: ‘Manzana roja’, precio: 2142, unidad: ‘kilo’, productor: ‘Cholitas’ },
{ id: 68, cat: ‘fruta’, paso: 0.5, nombre: ‘Manzana verde’, precio: 2023, unidad: ‘kilo’, productor: ‘Cholitas’ },
{ id: 69, cat: ‘fruta’, paso: 0.5, nombre: ‘Membrillo’, precio: 1666, unidad: ‘kilo’, productor: ‘Andrea’ },
{ id: 70, cat: ‘fruta’, paso: 0.5, nombre: ‘Naranjas’, precio: 2368, unidad: ‘kilo’, productor: ‘Cholitas’ },
{ id: 71, cat: ‘fruta’, paso: 0.5, nombre: ‘Uva Red sin pepas’, precio: 2142, unidad: ‘kilo’, productor: ‘Andrea’ },
// ENVASADOS ANDREA (paso 1)
{ id: 72, cat: ‘andrea’, paso: 1, nombre: ‘Jugo de tomate con sal de mar’, precio: 1904, unidad: ‘botella 250 ml’, productor: ‘Andrea’ },
{ id: 73, cat: ‘andrea’, paso: 1, nombre: ‘Jugo de uva (sin azúcar añadida)’, precio: 1904, unidad: ‘botella 250 ml’, productor: ‘Andrea’ },
{ id: 74, cat: ‘andrea’, paso: 1, nombre: ‘Jugo frutilla (sin azúcar añadida)’, precio: 1904, unidad: ‘botella 250 ml’, productor: ‘Andrea’ },
{ id: 75, cat: ‘andrea’, paso: 1, nombre: ‘Jugo uva/frutilla (sin azúcar añadida)’, precio: 1904, unidad: ‘botella 250 ml’, productor: ‘Andrea’ },
{ id: 76, cat: ‘andrea’, paso: 1, nombre: ‘Mermelada de damasco (25% azúcar org.)’, precio: 5355, unidad: ‘frasco 450 gr’, productor: ‘Andrea’ },
{ id: 77, cat: ‘andrea’, paso: 1, nombre: ‘Mermelada de frutilla (25% azúcar org.)’, precio: 5355, unidad: ‘frasco 450 gr’, productor: ‘Andrea’ },
{ id: 78, cat: ‘andrea’, paso: 1, nombre: ‘Mermelada de membrillo’, precio: 5355, unidad: ‘frasco 450 gr’, productor: ‘Andrea’ },
{ id: 79, cat: ‘andrea’, paso: 1, nombre: ‘Mermelada frutilla/damasco (25% azúcar org.)’, precio: 5355, unidad: ‘frasco 450 gr’, productor: ‘Andrea’ },
{ id: 80, cat: ‘andrea’, paso: 1, nombre: ‘Néctar de damasco (con azúcar org.)’, precio: 1904, unidad: ‘botella 250 ml’, productor: ‘Andrea’ },
{ id: 81, cat: ‘andrea’, paso: 1, nombre: ‘Néctar de membrillo (con azúcar org.)’, precio: 1904, unidad: ‘botella 250 ml’, productor: ‘Andrea’ },
{ id: 82, cat: ‘andrea’, paso: 1, nombre: ‘Néctar frutilla (con azúcar org.)’, precio: 1904, unidad: ‘botella 250 ml’, productor: ‘Andrea’ },
{ id: 83, cat: ‘andrea’, paso: 1, nombre: ‘Salsa Tomate (pulpa sin sal ni pepas)’, precio: 4165, unidad: ‘frasco 450 gr’, productor: ‘Andrea’ },
{ id: 84, cat: ‘andrea’, paso: 1, nombre: ‘Salsa Tomate (pulpa sin sal ni pepas)’, precio: 5355, unidad: ‘frasco 650 gr’, productor: ‘Andrea’ },
// OTROS ENVASADOS (paso 1)
{ id: 85, cat: ‘otros’, paso: 1, nombre: ‘Queso fresco de vaca’, precio: 5950, unidad: ‘pieza 500 gr’, productor: ‘Pato Pro’ },
{ id: 86, cat: ‘otros’, paso: 1, nombre: ‘Miel de pradera’, precio: 10710, unidad: ‘kilo’, productor: ‘Pato Pro’ },
{ id: 87, cat: ‘otros’, paso: 1, nombre: ‘Miel en panal’, precio: 5712, unidad: ‘porción 200 gr’, productor: ‘Pato Pro’ },
// HUEVOS (paso 1)
{ id: 88, cat: ‘huevos’, paso: 1, nombre: ‘Huevos’, precio: 2200, unidad: ‘ficha 6 unids’, productor: ‘Bravial’ },
// PALTAS (paso 0.5)
{ id: 89, cat: ‘paltas’, paso: 0.5, nombre: ‘Palta Hass’, precio: 4000, unidad: ‘kilo’, productor: ‘Gabriela’ },
{ id: 90, cat: ‘paltas’, paso: 0.5, nombre: ‘Palta Negra DLC’, precio: 3200, unidad: ‘kilo’, productor: ‘Juanjo’ },
];
const CATEGORIAS = [
{ id: ‘unidad’, nombre: ‘Verduras por unidad’, emoji: ‘🥦’ },
{ id: ‘kilo’, nombre: ‘Verduras por kilo’, emoji: ‘⚖️’ },
{ id: ‘hojas’, nombre: ‘Hojas’, emoji: ‘🌿’ },
{ id: ‘sabrosos’,nombre: ‘Otros sabrosos’, emoji: ‘🧄’ },
{ id: ‘fruta’, nombre: ‘Fruta’, emoji: ‘🍎’ },
{ id: ‘andrea’, nombre: ‘Envasados Andrea’, emoji: ‘🫙’ },
{ id: ‘otros’, nombre: ‘Otros envasados’, emoji: ‘🍯’ },
{ id: ‘huevos’, nombre: ‘Huevos’, emoji: ‘🥚’ },
{ id: ‘paltas’, nombre: ‘Paltas’, emoji: ‘🥑’ },
];
const cantidades = {};
let catActiva = ‘todas’;
function formatNum(n) {
// Muestra 0.5 como “0,5” y enteros sin decimales
return n % 1 === 0 ? String(n) : String(n).replace(‘.’, ‘,’);
}
function formatPrecio(n) {
return ‘$’ + Math.round(n).toLocaleString(‘es-CL’);
}
function renderProductos() {
const main = document.getElementById(‘productos-main’);
main.innerHTML = ”;
CATEGORIAS.forEach(cat => {
const prods = PRODUCTOS.filter(p => p.cat === cat.id);
if (prods.length === 0) return;
const section = document.createElement(‘div’);
section.className = ‘categoria-section’;
section.dataset.cat = cat.id;
section.innerHTML = `
`;
const grid = document.createElement(‘div’);
grid.className = ‘productos-grid’;
prods.forEach(prod => {
const qty = cantidades[prod.id] || 0;
const card = document.createElement(‘div’);
card.className = `producto-card${qty > 0 ? ‘ en-carrito’ : ”}`;
card.id = `card-${prod.id}`;
card.innerHTML = `
${prod.nombre}
${prod.unidad}
🌱 ${prod.productor}
${formatPrecio(prod.precio)}
`;
grid.appendChild(card);
});
section.appendChild(grid);
main.appendChild(section);
});
aplicarFiltro();
}
function cambiarQty(id, delta) {
const prod = PRODUCTOS.find(p => p.id === id);
const paso = prod.paso || 1;
const actual = cantidades[id] || 0;
const nuevo = Math.round(Math.max(0, actual + delta * paso) * 10) / 10;
cantidades[id] = nuevo;
document.getElementById(`qty-${id}`).textContent = formatNum(nuevo);
const card = document.getElementById(`card-${id}`);
card.classList.toggle(‘en-carrito’, nuevo > 0);
actualizarContadorCarrito();
}
function actualizarContadorCarrito() {
const total = Object.values(cantidades).filter(v => v > 0).length;
document.getElementById(‘carrito-count’).textContent = total;
}
function filtrarCat(cat, btn) {
catActiva = cat;
document.querySelectorAll(‘.cat-pill’).forEach(b => b.classList.remove(‘active’));
btn.classList.add(‘active’);
aplicarFiltro();
}
function aplicarFiltro() {
document.querySelectorAll(‘.categoria-section’).forEach(sec => {
if (catActiva === ‘todas’ || sec.dataset.cat === catActiva) {
sec.classList.remove(‘hidden’);
} else {
sec.classList.add(‘hidden’);
}
});
}
function abrirCarrito() {
renderCarrito();
document.getElementById(‘carrito-overlay’).classList.add(‘visible’);
document.getElementById(‘carrito-panel’).classList.add(‘visible’);
document.body.style.overflow = ‘hidden’;
}
function cerrarCarrito() {
document.getElementById(‘carrito-overlay’).classList.remove(‘visible’);
document.getElementById(‘carrito-panel’).classList.remove(‘visible’);
document.body.style.overflow = ”;
}
function renderCarrito() {
const items = PRODUCTOS.filter(p => (cantidades[p.id] || 0) > 0);
const el = document.getElementById(‘carrito-items’);
if (items.length === 0) {
el.innerHTML = `
🥬Aún no has agregado nada.
¡Explora la oferta!
`;
document.getElementById(‘carrito-total’).textContent = ‘$0’;
return;
}
let total = 0;
el.innerHTML = ”;
items.forEach(p => {
const qty = cantidades[p.id];
const sub = p.precio * qty;
total += sub;
const div = document.createElement(‘div’);
div.className = ‘carrito-item’;
div.innerHTML = `
${p.nombre}
${formatNum(qty)} × ${p.unidad} · ${p.productor}
${formatPrecio(sub)}
`;
el.appendChild(div);
});
document.getElementById(‘carrito-total’).textContent = formatPrecio(total);
}
async function enviarPedido() {
const rut = document.getElementById(‘nombre-socio’).value.trim();
if (!rut) {
cerrarCarrito();
const input = document.getElementById(‘nombre-socio’);
input.classList.add(‘error’);
input.focus();
input.scrollIntoView({ behavior: ‘smooth’, block: ‘center’ });
return;
}
const items = PRODUCTOS.filter(p => (cantidades[p.id] || 0) > 0);
if (items.length === 0) {
alert(‘Agrega al menos un producto antes de enviar.’);
return;
}
const btn = document.getElementById(‘enviar-btn’);
btn.disabled = true;
btn.innerHTML = ‘
Enviando…’;
const filaProductos = {};
PRODUCTOS.forEach(p => {
filaProductos[p.nombre + ‘ (‘ + p.unidad + ‘) – ‘ + p.productor] = cantidades[p.id] || 0;
});
const comentario = document.getElementById(‘comentario-pedido’).value.trim();
const pedido = {
rut,
fecha: new Date().toLocaleString(‘es-CL’),
comentario,
productos: filaProductos,
};
try {
await fetch(GOOGLE_SCRIPT_URL, {
method: ‘POST’,
mode: ‘no-cors’,
body: JSON.stringify(pedido),
});
mostrarExito(rut);
} catch (e) {
alert(‘Hubo un error al enviar. Por favor intenta de nuevo.’);
btn.disabled = false;
btn.innerHTML = ‘Enviar mi pedido 🌿’;
}
}
function mostrarExito(rut) {
cerrarCarrito();
document.getElementById(‘modal-texto’).textContent =
`¡Gracias! El pedido de ${rut} fue registrado. Nos vemos en la próxima distribución. 🌿`;
document.getElementById(‘modal-exito’).classList.add(‘visible’);
Object.keys(cantidades).forEach(k => delete cantidades[k]);
renderProductos();
actualizarContadorCarrito();
document.getElementById(‘nombre-socio’).value = ”;
document.getElementById(‘comentario-pedido’).value = ”;
const btn = document.getElementById(‘enviar-btn’);
btn.disabled = false;
btn.innerHTML = ‘Enviar mi pedido 🌿’;
}
function cerrarModal() {
document.getElementById(‘modal-exito’).classList.remove(‘visible’);
}
renderProductos();
