/* cdm-system.css — capa de overrides para tienda (despues de style.css) */

/* Amplía container en tienda desktop para ocupar más pantalla */
@media (min-width: 1200px) {
    body.cdm-ancho .container {
        max-width: 1440px;
    }
}
@media (min-width: 1600px) {
    body.cdm-ancho .container {
        max-width: calc(100% - 60px);
    }
}

/* Cards de tienda se adaptan al espacio disponible */
@media (min-width: 1200px) {
    body.cdm-ancho #tienda-productos-grid .col-lg-3 {
        flex: 0 0 25%;
        max-width: 25%;
    }
}
@media (min-width: 1600px) {
    body.cdm-ancho #tienda-productos-grid .col-lg-3 {
        flex: 0 0 20%;
        max-width: 20%;
    }
}

/* Slider de ofertas se extiende al ancho completo del bloque oscuro */
body.cdm-ancho .tx-collection .product__discount__slider .owl-item {
    padding: 0 8px;
}

/* ===== Boton volver arriba ===== */
.cdm-to-top {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 900;
    width: 46px;
    height: 46px;
    border: none;
    border-radius: 50%;
    background: var(--color-secundario);
    color: #ffffff;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(20, 20, 20, 0.22);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity .25s ease, transform .25s ease, visibility .25s ease,
                background-color .25s ease, box-shadow .25s ease;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cdm-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.cdm-to-top:hover,
.cdm-to-top:focus-visible {
    background: var(--color-principal);
    color: #ffffff;
    box-shadow: 0 8px 22px rgba(20, 20, 20, 0.3);
    outline: none;
}

body.dark .cdm-to-top { background: var(--color-secundario); }
body.dark .cdm-to-top:hover { background: var(--color-principal); }

@media (prefers-reduced-motion: reduce) {
    .cdm-to-top { transition: none; }
}
