body, html{
    padding: 0;
    margin: 0;
}

/* ===========================================================
   Banner de cookies - Ofimood
   Actualizado 14/08/2026:
   - z-index anadido: el banner no lo tenia y quedaba por debajo
     del CTA flotante (.float-cta usa z-index 9900).
   - Los tres botones (Aceptar todas / Rechazar todas / Ver
     Cookies) pasan a ser IDENTICOS en color, forma, tamano y
     tipografia. Antes "Aceptar todas" tenia fondo blanco y los
     otros dos el mismo color que el banner, lo que privilegiaba
     visualmente la aceptacion (la AEPD exige igual prominencia).
   =========================================================== */

.cookies-wrapper {
    font-family: 'Open Sans', sans-serif;
    position: fixed;
    bottom: 0;
    left: 0;
    background-color: rgba(51,48,49,0.9);
    padding: 0.5rem 2rem 0.5rem 2rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    z-index: 9950;
}

.color-svg{
    
  fill: white; /* Cambia "red" por el color que desees */ 

}

.cookies-text-detail{
    text-align: center;
}

.cookies-preferences-wrapper{
    min-width: 9rem;
    display: none;
    flex-direction: column;
}

.label-toggle{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}


.label-toggle .toggle-input {
    opacity: 0;
    width: 0;
    height: 0;
}


.toggle-slider {
    width: 2rem;
    height: 1rem;
    position: relative;
    cursor: pointer;
    background-color: rgba(0,0,0,0.8);
    -webkit-transition: .4s;
    transition: .4s;
}

.toggle-slider:before {
    position: absolute;
    content: "";
    height: 1rem;
    width: 1rem;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

.toggle-input:after {
    background-color: rgba(0,0,0,0.3);
}

.toggle-input:checked + .toggle-slider {
    width: 2rem;
    background-color: rgba(46, 204, 113);
}

.toggle-input:checked + .toggle-slider:before {
    -webkit-transform: translateX(1rem);
    -ms-transform: translateX(1rem);
    transform: translateX(1rem);
}



.toggle-slider.round {
    border-radius: 1rem;
}

.toggle-slider.round:before {
    width: 1rem;
    border-radius: 50%;
}


.cookies-text {
    color: white;
    margin: 0.5rem;
    line-height: 1rem;
    text-align: center;
}

.cookies-text a {
    text-decoration: none;
    color: white;
}

/* --- Botones: los tres exactamente iguales ---------------
   Relleno translucido claro sobre el banner oscuro. No se usa
   el mismo tono del banner porque los botones quedarian
   invisibles, ni blanco solido porque destaca demasiado.
   --------------------------------------------------------- */
.cookies-btn {
    background-color: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.38);
    width: 10rem;
    margin: 0.5rem;
    line-height: 0.1rem;
    border-radius: 7rem;
    padding: 1rem;
    transition: background-color .18s ease, border-color .18s ease;
}

.cookies-btn2 {
    background-color: rgb(51,48,49);
    border-radius: 7rem;
    padding: 5px;
    border: 0px;
}

.cookies-btn:hover, .cookies-btn:focus, .cookies-btn:active {
    background-color: rgba(255,255,255,0.24);
    border-color: rgba(255,255,255,0.75);
    cursor: pointer;
}

.cookies-btn2:hover, .cookies-btn2:focus, .cookies-btn2:active {
    background-color: rgba(255,255,255,0.7);
    cursor: pointer;
}

/* Foco visible para navegacion por teclado */
.cookies-btn:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
}

/* .cookies-btn-main ya no diferencia "Aceptar todas": hereda
   el estilo comun de .cookies-btn. Se conserva la clase vacia
   para no romper el HTML ni el JS existentes. */
.cookies-btn-main {
    background-color: rgba(255,255,255,0.12);
}

.cookies-btn-main:hover, .cookies-btn-main:focus, .cookies-btn-main:active {
    background-color: rgba(255,255,255,0.24);
}

.cookie-btn-text {
    font-weight: bold;
    color: #ffffff;
	margin-bottom: 1em;
    margin-top: 1em;
	font-size:13px;
}

/* Mismo color de texto que el resto de botones */
.accept-all-btn-text{
    color: #ffffff;
}


@media (min-width: 425px) {
    .cookies-wrapper {
        width: 100%;
    }
}

@media (min-width: 1000px) {
    .cookies-wrapper{
        flex-direction: row;
        width: 100%;
    }

    .cookies-btn {
        margin: 0 0.5rem 0 0.5rem;
    }
}