/* =========================================================
   RC31.13 — AJUSTE VISUAL DEL CARRITO WEB Y ESTADO DEL LOCAL
   1. Botón de cierre visible
   2. Jerarquía y colores del total
   3. Estado del local: abierto / por cerrar / cerrado
   4. Contraste del carrito vacío y acciones
========================================================= */

@media (min-width: 901px) {
    /* Panel claro y limpio en escritorio */
    #panelCarrito {
        color: #202124 !important;
        background: #f7f8fa !important;
    }

    .cabeceraCarrito {
        min-height: 76px !important;
        padding: 14px 18px !important;
        background: #ffffff !important;
        border-bottom: 1px solid #e7e9ee !important;
        box-shadow: 0 5px 18px rgba(15, 23, 42, .07) !important;
    }

    /* Flecha de cierre: visible con cualquier fondo */
    #cerrarCarrito {
        width: 44px !important;
        height: 44px !important;
        display: grid !important;
        place-items: center !important;
        border: 1px solid #d9dde5 !important;
        border-radius: 14px !important;
        background: #202124 !important;
        color: #ffffff !important;
        font-size: 25px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        box-shadow: 0 7px 18px rgba(15, 23, 42, .18) !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    #cerrarCarrito:hover {
        transform: translateX(-2px) !important;
        border-color: #e51d2a !important;
        background: #e51d2a !important;
    }

    .iconoTituloCarrito {
        color: #202124 !important;
    }

    .cabeceraCarrito h2,
    .textoTituloCarrito {
        color: #202124 !important;
    }

    #contenidoCarrito {
        color: #202124 !important;
        background: #f7f8fa !important;
    }

    /* Carrito vacío legible */
    .carritoVacio h3 {
        color: #202124 !important;
    }

    .carritoVacio > p {
        color: #69707d !important;
    }

    .tarjetaCatalogoCarrito {
        background: #202124 !important;
        color: #ffffff !important;
        border: 0 !important;
    }

    .tarjetaCatalogoCarrito strong,
    .tarjetaCatalogoCarrito small {
        color: #ffffff !important;
    }

    /* Pie y total: contraste profesional */
    #footerCarrito {
        padding: 16px 18px 20px !important;
        background: #ffffff !important;
        border-top: 1px solid #e5e7eb !important;
        box-shadow: 0 -8px 24px rgba(15, 23, 42, .08) !important;
    }

    .resumenTotalCarrito {
        margin-bottom: 14px !important;
        padding: 15px 16px !important;
        border: 1px solid #eceef2 !important;
        border-radius: 17px !important;
        background: linear-gradient(145deg, #ffffff, #f5f6f8) !important;
        box-shadow: 0 8px 22px rgba(15, 23, 42, .07) !important;
    }

    .etiquetaTotalCarrito {
        color: #69707d !important;
        font-size: 12px !important;
        font-weight: 800 !important;
    }

    #totalCarrito {
        color: #d51524 !important;
        font-size: 32px !important;
        font-weight: 950 !important;
        text-shadow: none !important;
    }

    #cantidadProductosCarrito {
        color: #737b87 !important;
        font-weight: 700 !important;
    }

    .iconoResumenCarrito {
        border: 1px solid #dfe5e9 !important;
        background: #eefbf3 !important;
        color: #138a49 !important;
    }

    #finalizarPedido {
        color: #ffffff !important;
        background: linear-gradient(135deg, #ed1c2e, #d40718) !important;
        border: 0 !important;
        box-shadow: 0 10px 24px rgba(213, 21, 36, .24) !important;
    }

    #finalizarPedido:disabled {
        color: #8b929d !important;
        background: #e9ebef !important;
        box-shadow: none !important;
        opacity: 1 !important;
    }
}

/* Estado del local: colores inequívocos en todos los tamaños */
.estadoLocalMenu.estadoAbierto {
    border-color: #27c864 !important;
    background: linear-gradient(135deg, #0c7b38, #0b9b48) !important;
    color: #ffffff !important;
    box-shadow: 0 7px 20px rgba(11, 155, 72, .28) !important;
}

.estadoLocalMenu.estadoPorCerrar {
    border-color: #f2a900 !important;
    background: linear-gradient(135deg, #9a6100, #d28b00) !important;
    color: #ffffff !important;
    box-shadow: 0 7px 20px rgba(210, 139, 0, .28) !important;
}

.estadoLocalMenu.estadoCerrado {
    border-color: #e22b38 !important;
    background: linear-gradient(135deg, #a3111f, #d4192b) !important;
    color: #ffffff !important;
    box-shadow: 0 7px 20px rgba(212, 25, 43, .26) !important;
}

.estadoLocalMenu .textoEstadoLocal strong,
.estadoLocalMenu .textoEstadoLocal small {
    color: #ffffff !important;
}

.estadoLocalMenu.estadoAbierto .puntoEstadoLocal {
    background: #46f47e !important;
    box-shadow: 0 0 0 5px rgba(70, 244, 126, .18), 0 0 14px rgba(70, 244, 126, .72) !important;
}

.estadoLocalMenu.estadoPorCerrar .puntoEstadoLocal {
    background: #ffc329 !important;
    box-shadow: 0 0 0 5px rgba(255, 195, 41, .19), 0 0 14px rgba(255, 195, 41, .7) !important;
}

.estadoLocalMenu.estadoCerrado .puntoEstadoLocal {
    background: #ff5966 !important;
    box-shadow: 0 0 0 5px rgba(255, 89, 102, .18), 0 0 14px rgba(255, 89, 102, .62) !important;
}

/* =========================================================
   RC31.14 — REDISEÑO INTEGRAL DEL CARRITO WEB
   Objetivo:
   - contraste alto en todas las funciones
   - controles visibles y coherentes
   - productos legibles
   - total y acciones con jerarquía profesional
========================================================= */

@media (min-width: 901px) {
    /* Contenido general del panel */
    #panelCarrito,
    #contenidoCarrito,
    #footerCarrito {
        color: #1f2937 !important;
    }

    #contenidoCarrito {
        padding: 18px !important;
        background: #f3f5f8 !important;
    }

    /* Tarjeta de producto del carrito */
    .itemCarrito {
        margin: 0 0 14px !important;
        overflow: hidden !important;
        border: 1px solid #e2e6ec !important;
        border-radius: 18px !important;
        background: #ffffff !important;
        box-shadow: 0 8px 22px rgba(15, 23, 42, .08) !important;
    }

    .cabeceraItemCarrito {
        padding: 12px 14px 0 !important;
    }

    .codigoItemCarrito {
        min-height: 25px !important;
        padding: 4px 9px !important;
        border: 1px solid #ffd45a !important;
        background: #fff7d9 !important;
        color: #9a6700 !important;
        font-size: 10px !important;
        font-weight: 900 !important;
    }

    .cuerpoItemCarrito {
        padding: 12px 14px 14px !important;
        align-items: center !important;
        gap: 12px !important;
    }

    .informacionItemCarrito h3 {
        margin: 0 0 7px !important;
        color: #17191d !important;
        font-size: 17px !important;
        font-weight: 900 !important;
        line-height: 1.25 !important;
    }

    .precioUnitarioCarrito {
        color: #6b7280 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    .precioUnitarioCarrito strong {
        color: #202124 !important;
        font-size: 14px !important;
        font-weight: 900 !important;
    }

    /* Detalles de variantes y sabores */
    .itemCarrito .detalleConfiguracionCarrito {
        margin: 10px 0 0 !important;
        padding: 10px 11px !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 12px !important;
        background: #f8fafc !important;
        color: #374151 !important;
    }

    .itemCarrito .detalleConfiguracionCarrito,
    .itemCarrito .detalleConfiguracionCarrito * {
        color: #374151 !important;
    }

    /* Selector de cantidad */
    .itemCarrito .controlesCantidad {
        min-width: 112px !important;
        padding: 4px !important;
        gap: 3px !important;
        border: 1px solid #dfe3e8 !important;
        border-radius: 999px !important;
        background: #f4f6f8 !important;
    }

    .itemCarrito .controlesCantidad button {
        width: 33px !important;
        height: 33px !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        color: #d51524 !important;
        font-size: 21px !important;
        font-weight: 900 !important;
        box-shadow: 0 2px 7px rgba(15, 23, 42, .08) !important;
    }

    .itemCarrito .controlesCantidad button:hover {
        background: #d51524 !important;
        color: #ffffff !important;
    }

    .itemCarrito .cantidadItemCarrito {
        color: #111827 !important;
        font-size: 16px !important;
        font-weight: 950 !important;
    }

    /* Eliminar producto */
    .cabeceraItemCarrito .eliminar {
        border: 1px solid #ffc7cc !important;
        background: #fff1f2 !important;
        color: #cf1525 !important;
    }

    .cabeceraItemCarrito .eliminar:hover {
        border-color: #d51524 !important;
        background: #d51524 !important;
        color: #ffffff !important;
    }

    /* Subtotal */
    .subtotal {
        padding: 12px 14px !important;
        border-top: 1px solid #e5e7eb !important;
        background: #f8fafc !important;
        color: #6b7280 !important;
        font-size: 12px !important;
        font-weight: 800 !important;
    }

    .subtotal strong {
        color: #d51524 !important;
        font-size: 18px !important;
        font-weight: 950 !important;
    }

    /* Total final */
    .resumenTotalCarrito {
        border-color: #e3e7ec !important;
        background: #ffffff !important;
    }

    #totalCarrito {
        color: #d51524 !important;
    }

    /* Botón principal */
    #finalizarPedido {
        min-height: 52px !important;
        border-radius: 14px !important;
        color: #ffffff !important;
        background: linear-gradient(135deg, #ef1b2d, #c90d1d) !important;
        font-weight: 950 !important;
        box-shadow: 0 10px 24px rgba(213, 21, 36, .25) !important;
    }

    #finalizarPedido:hover:not(:disabled) {
        transform: translateY(-1px) !important;
        filter: brightness(1.03) !important;
    }

    #finalizarPedido:disabled {
        color: #8b929d !important;
        background: #e5e7eb !important;
        cursor: not-allowed !important;
    }
}
