.naranja {
    color: #EF9E56;
}

.marron {
    color: #8A6248;
}

#retiros-envios {
    background-color: rgb(255, 254, 251);
}

.retira {
    color: #EF9E56;
    font-weight: 600;
    font-size: 1.9rem;
    letter-spacing: 0.08em;
    margin-top: 30rem;
}

h2 {
    margin-bottom: 1.5rem;
    font-weight: 300;
    font-style: light;
}


/* INFORMACIÓN*/

.retiros-envios-slide {
    padding-top: calc(var(--navbar-height) + 2rem) !important;
}

.fondo-card-env-retir {
    padding: 1.5rem 1.5rem 0.7rem 1.5rem;
    margin: 0.7rem 0.6rem;
}

.icono-envios {
    font-size: 1.7rem;
}

.titulo-fondo-card-env-retir {
    font-size: 1.1rem;
    font-weight: 400;
}

.ubi-fondo-card-env-retir-2 {
    color: #EF9E56;
    opacity: 75%;
    font-size: 0.8rem;
}

.boton-fondo-card-env-retir {
    background-color: #8A6248;
    color: #ffffff;
    font-size: 0.589rem;
}

.boton-google-fondo-card-env-retir {
    font-size: 0.589rem;
    border: 0.0625rem solid #8A6248;
    background-color: transparent;
    color: #8A6248;
}

.texto-collapse {
    font-size: 0.8rem;
}

.li-fondo-card-env-retir {
    font-size: 0.7rem;
}

.tiempo-estimado {
    color: rgb(146, 142, 142);
    font-size: 0.7rem;
}

.alert-cotizamos-wsp {
    font-size: 0.8rem;
    margin: 0rem 2rem 1rem 2rem;
}

.dudas-wsp {
    margin-top: 1.5rem;
}


/* ======================================================
   BOTONES SECUNDARIOS
====================================================== */

.botones-secundarios {
    font-size: 0.8rem;
    padding: 0.75rem 1.5rem;

    border: 1px solid #8A6248;
    border-radius: 0.75rem;

    background-color: #8A6248;
    color: #FDF7EF;

    transition:
        background-color 0.25s ease,
        color 0.25s ease,
        opacity 0.25s ease;
}

.botones-secundarios:hover {
    color: #8A6248;
    background-color: transparent;
    border-color: #8A6248;
    transform: translateY(-0.08rem);
    box-shadow: 0 0.45rem 1.15rem rgba(138, 98, 72, 0.16);
}

.botones-secundarios:disabled {
    opacity: 0.6;
    cursor: wait;
}


/* ======================================================
   SLIDER DE RETIROS Y ENVÍOS
====================================================== */

.retiros-envios-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}


/*
 * Su altura será actualizada por JavaScript según la altura
 * real del slide que se está mostrando.
 */
.retiros-envios-track {
    display: flex;
    width: 100%;

    overflow-x: auto;
    overflow-y: hidden;

    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;

    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;

    transition: height 0.12s ease-out;
}

.retiros-envios-track::-webkit-scrollbar {
    display: none;
}

.retiros-envios-slide {
    flex: 0 0 100%;
    width: 100%;
    min-width: 100%;

    scroll-snap-align: start;
    scroll-snap-stop: always;
}

/* ======================================================
   CONTROLES DEL SLIDER
====================================================== */

/*
 * Estado inicial: RETIROS sin horarios abiertos.
 * Los indicadores suben para aprovechar el espacio vacío.
 */
.retiros-envios-controles {
    position: relative;
    margin-top: -8rem !important;
    margin-bottom: 4rem;
    transition: margin-top 0.08s linear;
}


/*
 * ENVÍOS:
 * los indicadores siempre quedan debajo de todo el contenido.
 */
.retiros-envios-slider.mostrando-envios
.retiros-envios-controles {
    margin-top: 2rem !important;
}


/*
 * RETIROS con algún horario abierto:
 * el contenido desplegado empuja los indicadores hacia abajo.
 */
.retiros-envios-slider.collapse-abierto
.retiros-envios-controles {
    margin-top: 1rem !important;
}

/* ======================================================
   INDICADORES CIRCULARES
====================================================== */

.retiros-envios-indicador {
    width: 0.75rem;
    height: 0.75rem;

    padding: 0;
    margin: 0;

    border: 1px solid #8A6248;
    border-radius: 50%;

    background-color: transparent;

    transition:
        background-color 0.15s ease,
        transform 0.15s ease,
        box-shadow 0.15s ease;
}

.retiros-envios-indicador.activo {
    background-color: #8A6248;
    transform: scale(1.2);
    box-shadow: 0 0 0 0.25rem rgba(138, 98, 72, 0.14);
}


/* ======================================================
   FLECHAS DEL SLIDER
====================================================== */

.retiros-envios-flecha {
    width: 2.55rem;
    height: 2.55rem;

    padding: 0;

    color: #8A6248;
    background-color: white;

    border: 1px solid rgba(138, 98, 72, 0.25);
}

.retiros-envios-flecha:disabled {
    opacity: 0.35;
}


/* ======================================================
   MÉTODOS DE PAGO
====================================================== */

.nombre-met-pago {
    font-size: 0.8rem;
}

.aclaracion-met-pago {
    font-size: 0.6rem;
}


/* ======================================================
   CELULARES UN POCO MÁS GRANDES
====================================================== */

@media (min-width: 389px) {

    .boton-fondo-card-env-retir {
        font-size: 0.7rem;
    }

    .boton-google-fondo-card-env-retir {
        font-size: 0.7rem;
    }

    .li-fondo-card-env-retir {
        font-size: 0.8rem;
    }
}


/* ======================================================
   TABLETS
====================================================== */

@media (min-width: 768px) {

    .li-fondo-card-env-retir {
        font-size: 0.7rem;
    }

    .tiempo-estimado {
        font-size: 0.8rem;
    }

    .alert-cotizamos-wsp {
        font-size: 0.8rem;
        margin: 0rem 5rem 1rem 5rem;
        text-align: center;
    }

    .dudas-wsp {
        margin-top: 2rem;
    }
}


@media (min-width: 820px) {

    .retiros-envios-slide {
        padding-top: calc(var(--navbar-height) + 3rem) !important;
    }

    .retira {
        font-size: 2.1rem;
    }

    h2 {
        font-size: 1.9rem;
    }

    .titulo-fondo-card-env-retir {
        font-size: 1.3rem;
    }

    .ubi-fondo-card-env-retir-2 {
        font-size: 0.988rem;
    }

    .boton-fondo-card-env-retir {
        font-size: 0.8rem;
    }

    .boton-google-fondo-card-env-retir {
        font-size: 0.8rem;
    }

    .alert-cotizamos-wsp {
        font-size: 1rem;
        margin: 0rem 2rem 1rem 2rem;
        text-align: center;
    }

    .dudas-wsp {
        margin-top: 2rem;
        font-size: 1.2rem;
    }

    .btn-contacate-wsp {
        font-size: 1rem;
    }
}


/* ======================================================
   CELULARES Y TABLETS
====================================================== */

@media (max-width: 991.98px) {

}


/* ======================================================
   NOTEBOOKS PEQUEÑAS
====================================================== */

@media (min-width: 992px) {

    .retiros-envios-slide {
        padding-top: calc(var(--navbar-height) + 4rem) !important;
    }

    .titulo-fondo-card-env-retir {
        font-size: 1rem;
    }

    .ubi-fondo-card-env-retir-2 {
        font-size: 0.9rem;
    }

    .alert-cotizamos-wsp {
        margin: 0rem 9rem 1rem 9rem;
    }

    .dudas-wsp {
        margin-top: 3rem;
        font-size: 1.1rem;
    }

    .btn-contacate-wsp {
        font-size: 1rem;
    }
}


/* ======================================================
   ESCRITORIOS CHICOS
====================================================== */

@media (min-width: 1200px) {

    .retiros-envios-slide {
        padding-top: calc(var(--navbar-height) + 5rem) !important;
    }

    #retiros-envios {
        margin: 7rem 8rem 2rem 8rem;
    }

    .icono-envios {
        font-size: 1.8rem;
    }

    .titulo-fondo-card-env-retir {
        font-size: 1rem;
    }

    .boton-fondo-card-env-retir {
        font-size: 0.9rem;
    }

    .boton-google-fondo-card-env-retir {
        font-size: 0.9rem;
    }

    .li-fondo-card-env-retir {
        font-size: 0.9rem;
    }

    .tiempo-estimado {
        margin-top: -0.4rem;
    }
}


@media (min-width: 1400px) {

    .alert-cotizamos-wsp {
        margin: 0rem 15rem 1rem 15rem;
    }
}


/* ======================================================
   ESCRITORIOS COMUNES
====================================================== */

@media (min-width: 1600px) {

    #retiros-envios {
        margin: 7rem 17rem 2rem 17rem;
    }

    .titulo-fondo-card-env-retir {
        font-size: 1.3rem;
    }

    .ubi-fondo-card-env-retir-2 {
        font-size: 1rem;
    }

    .boton-fondo-card-env-retir {
        font-size: 1rem;
    }

    .boton-google-fondo-card-env-retir {
        font-size: 1rem;
    }

    .tiempo-estimado {
        font-size: 1rem;
        margin-top: 0rem;
    }

    .alert-cotizamos-wsp {
        margin: 0rem 12rem 1rem 12rem;
    }
}


/* ======================================================
   PANTALLAS MUY GRANDES
====================================================== */

@media (min-width: 1600px) {

    .retiros-envios-slide {
        padding-top: calc(var(--navbar-height) + 6rem) !important;
    }

    #retiros-envios {
        margin-top: 9rem;
    }

    .fondo-card-env-retir {
        padding: 2rem 2rem 1rem 2rem;
    }

    .icono-envios {
        font-size: 2rem;
    }

    .ubi-fondo-card-env-retir-2 {
        margin-top: 1rem;
    }

    .titulo-fondo-card-env-retir {
        font-size: 1.6rem;
    }

    .li-fondo-card-env-retir {
        font-size: 1rem;
    }

    .dudas-wsp {
        font-size: 1.4rem;
    }

    .btn-contacate-wsp {
        margin-top: 0.4rem;
        font-size: 1.3rem;
    }

    .alert-cotizamos-wsp {
        font-size: 1.3rem;
        margin: 1rem 14rem 1rem 14rem;
    }
}