/* ============================================================
   Carrito de Venta — rediseño verde institucional
   Tokens: verde #006C52 / hover #00563f / tinte #f4faf7
   ============================================================ */

#modalCarrito .modal-body { background: #f6f6f8; padding: 16px; }
@media (max-width: 575px) { #modalCarrito .modal-body { padding: 12px; } }

/* ---- Tarjetas de seccion ---- */
.tarjeta-pedido {
    background: #fff; border-radius: 18px; box-shadow: 0 4px 18px rgba(0,0,0,.06);
    padding: 18px 16px; margin-bottom: 14px;
}
.titulo-seccion {
    display: flex; align-items: center; gap: 8px;
    font-weight: 700; font-size: 1.05rem; color: #222; margin-bottom: 14px;
}
.titulo-seccion .material-symbols-outlined,
.titulo-seccion .material-icons { color: #006C52; font-size: 22px; }

/* ---- Labels y helpers ---- */
#modalCarrito .form-label { font-weight: 600; font-size: .95rem; color: #444; margin-bottom: 6px; }
.helper-pedido { display: block; font-weight: 500; font-size: .84rem; color: #888; margin-top: 6px; }

/* ---- Inputs ---- */
#modalCarrito .input-pedido,
#modalCarrito input.form-control, #modalCarrito select.form-select, #modalCarrito textarea.form-control {
    font-size: 1.02rem; padding: 12px 15px; border-radius: 14px;
    border: 2px solid #ddd; font-weight: 500; min-height: 50px; box-shadow: none;
}
#modalCarrito textarea.form-control { min-height: 0; }
#modalCarrito input.form-control:focus, #modalCarrito select.form-select:focus, #modalCarrito textarea.form-control:focus {
    outline: none; border-color: #006C52; box-shadow: 0 0 0 4px rgba(0,108,82,.12);
}
#modalCarrito .is-invalid { border-color: #c62828 !important; }

/* ---- Control segmentado (entrega / pago) ---- */
.seg-grupo { display: flex; gap: 8px; width: 100%; }
.seg-opcion {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    min-height: 60px; padding: 10px 8px; border-radius: 14px; cursor: pointer;
    background: #fff; border: 2px solid #ddd; color: #444;
    font-weight: 600; font-size: .93rem; text-align: center; transition: all .12s;
    margin-bottom: 0;
}
.seg-opcion .material-symbols-outlined { font-size: 24px; color: #888; transition: color .12s; }
.seg-opcion:hover { border-color: #006C52; background: #f4faf7; color: #333; }
.btn-check:checked + .seg-opcion {
    background: #006C52; border-color: #006C52; color: #fff; font-weight: 700;
}
.btn-check:checked + .seg-opcion .material-symbols-outlined { color: #fff; }
.btn-check:focus-visible + .seg-opcion { box-shadow: 0 0 0 4px rgba(0,108,82,.12); }

/* ---- Boton mapa / secundarios anchos ---- */
.btn-pedido-secundario {
    display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
    background: #fff; border: 2px solid #ddd; color: #444; font-weight: 600;
    padding: 12px; font-size: .98rem; border-radius: 14px; margin-top: 8px; transition: all .12s;
}
.btn-pedido-secundario:hover { border-color: #006C52; background: #f4faf7; color: #333; }
.btn-pedido-secundario .material-symbols-outlined { color: #006C52; font-size: 22px; }

/* ---- Productos del carrito ---- */
#ulCarrito .list-group-item, #ulSD .list-group-item { border: 0; border-bottom: 1px solid #f0f0f0; padding: 12px 2px; }
#ulCarrito .list-group-item:last-child { border-bottom: 0; }
.btn-item-editar, .btn-item-borrar {
    width: 44px; height: 44px; border-radius: 12px; background: #fff;
    display: flex; align-items: center; justify-content: center; padding: 0; flex-shrink: 0;
}
.btn-item-editar { border: 2px solid #cfe3d9; color: #006C52; }
.btn-item-editar:hover { background: #f4faf7; border-color: #006C52; color: #006C52; }
.btn-item-borrar { border: 2px solid #f0d3d3; color: #c62828; }
.btn-item-borrar:hover { background: #fdecea; border-color: #c62828; color: #c62828; }
.pill-precio {
    border: 1.5px solid #ddd; border-radius: 20px; padding: 6px 13px;
    font-weight: 700; color: #222; font-size: .95rem; white-space: nowrap;
}
.chip-extra { background: #e8f7ee; color: #1e7c43; border-radius: 20px; padding: 4px 11px; font-size: .82rem; font-weight: 600; }
.chip-sin   { background: #fdecea; color: #c62828; border-radius: 20px; padding: 4px 11px; font-size: .82rem; font-weight: 600; }

/* ---- Tarjetas "Un ultimo antojo" ---- */
.antojo-card {
    background: #fff; border: 1.5px solid #eee; border-radius: 16px; overflow: hidden;
    height: 100%; display: flex; flex-direction: column;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.antojo-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0,0,0,.10); border-color: #d8ebe3; }
.antojo-img-wrap { height: 130px; overflow: hidden; }
.antojo-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; display: block; }
.antojo-card:hover .antojo-img-wrap img { transform: scale(1.05); }
.antojo-body { padding: 10px 12px 12px 12px; display: flex; flex-direction: column; flex: 1; }
.antojo-nombre {
    font-weight: 600; font-size: .88rem; color: #333; line-height: 1.25; margin-bottom: 8px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.2em;
}
.antojo-fila { display: flex; align-items: center; justify-content: space-between; margin-top: auto; }
.antojo-precio { font-weight: 800; font-size: 1.08rem; color: #006C52; }
.antojo-btn {
    width: 42px; height: 42px; border-radius: 50%; border: none; flex-shrink: 0;
    background: #006C52; color: #fff; display: flex; align-items: center; justify-content: center;
    transition: background .12s, transform .1s; padding: 0;
}
.antojo-btn:hover { background: #00563f; }
.antojo-btn:active { transform: scale(.92); }
.antojo-btn .material-icons { font-size: 24px; }

/* precio "Desde $X" para productos con varios tamaños */
.antojo-precio-desde { font-weight: 500; font-size: .8rem; color: #888; line-height: 1.1; }
.antojo-precio-desde b { display: block; font-weight: 800; font-size: 1.05rem; color: #006C52; }

/* boton "Elegir tamaño" */
.antojo-btn-tam {
    display: flex; align-items: center; justify-content: center; gap: 5px;
    border: 2px solid #006C52; color: #006C52; background: #fff; font-weight: 700;
    border-radius: 20px; padding: 8px 12px; font-size: .82rem; white-space: nowrap;
    transition: all .12s;
}
.antojo-btn-tam:hover { background: #006C52; color: #fff; }
.antojo-btn-tam .material-icons { font-size: 17px; }

/* ---- Filas de producto en listados de categoria ---- */
.prod-row {
    display: flex; background: #fff; border: 1.5px solid #eee; border-radius: 16px;
    overflow: hidden; height: 100%;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.prod-row:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,.10); border-color: #d8ebe3; }
.prod-row-img { width: 116px; flex-shrink: 0; overflow: hidden; }
.prod-row-img img { width: 100%; height: 100%; object-fit: cover; display: block; min-height: 116px; }
.prod-row-body {
    flex: 1; display: flex; flex-direction: column; justify-content: space-between;
    padding: 12px 14px; min-width: 0;
}
.prod-row-nombre { font-weight: 700; font-size: .95rem; color: #333; line-height: 1.25; }
.prod-row-desc {
    font-weight: 500; font-size: .82rem; color: #999; margin-top: 3px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.prod-row-body .antojo-fila { margin-top: 8px; }

/* ---- Footer ---- */
#modalCarrito .modal-footer {
    background: #fff; border-top: 1px solid #eee;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) 16px;
    display: block;
}
.footer-pedido { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.footer-total-etiqueta { font-weight: 600; font-size: .95rem; color: #666; }
.footer-total-monto { font-weight: 800; font-size: 1.5rem; color: #006C52; }
.btn-enviar-pedido {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: #006C52; border: none; color: #fff; font-weight: 700;
    padding: 14px 26px; font-size: 1.1rem; border-radius: 14px; min-height: 52px; transition: background .12s;
}
.btn-enviar-pedido:hover { background: #00563f; color: #fff; }
.btn-enviar-pedido:disabled { background: #9fc9bc; }
.link-seguir {
    color: #888; font-weight: 600; font-size: .95rem; text-decoration: none;
    background: none; border: none; padding: 10px;
}
.link-seguir:hover { color: #555; text-decoration: underline; }

@media (max-width: 767px) {
    .footer-pedido { flex-direction: column; align-items: stretch; gap: 8px; }
    .footer-linea-total { display: flex; justify-content: space-between; align-items: center; }
    .btn-enviar-pedido { width: 100%; }
    .link-seguir { width: 100%; text-align: center; }
}
@media (min-width: 768px) {
    .footer-linea-total { display: flex; align-items: baseline; gap: 10px; }
    .footer-acciones { display: flex; align-items: center; gap: 8px; }
}


/* ---- Fila horizontal "Lo mas pedido" ---- */
.fila-scroll {
    display: flex; gap: 10px; overflow-x: auto; padding: 2px 2px 12px 2px; margin-bottom: 8px;
    -webkit-overflow-scrolling: touch; scrollbar-width: thin;
}
.fila-scroll-item { flex: 0 0 170px; }
.fila-scroll .antojo-img-wrap { height: 110px; }
.fila-scroll .antojo-nombre small { color: #999; font-weight: 500; }

/* ---- Stepper de cantidad en el carrito ---- */
.stepper-cantidad { display: inline-flex; align-items: center; gap: 0; border: 1.5px solid #ddd; border-radius: 12px; overflow: hidden; margin: 4px 0 2px 0; }
.stepper-btn {
    width: 40px; height: 36px; border: none; background: #f6f8f7; color: #006C52;
    font-size: 1.25rem; font-weight: 800; line-height: 1; padding: 0;
}
.stepper-btn:hover { background: #006C52; color: #fff; }
.stepper-num { min-width: 40px; text-align: center; font-weight: 800; color: #222; font-size: 1rem; }