/* Cambiar color del checkbox de RS Contact en JA Purity */
.rscontact-form input[type="checkbox"],
.rscontact-container input[type="checkbox"] {
    accent-color: #007bff !important; /* Reemplaza por el color hexadecimal de tu marca */
}
/* Contenedor del checkbox */
.checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    margin-bottom: 8px;
}

/* Ocultar el checkbox por defecto del navegador */
.checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Crear el nuevo diseño del checkbox personalizado (un cuadro vacío) */
.checkbox span::before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid #cccccc; /* Color del borde original */
    border-radius: 4px;       /* Bordes redondeados */
    margin-right: 8px;
    vertical-align: middle;
    transition: all 0.2s ease;
    background-color: #ffffff;
}

/* Cambios visuales cuando el checkbox está seleccionado (Checked) */
.checkbox input[type="checkbox"]:checked + span::before {
    background-color: #007bff; /* Color de fondo (ej. azul) */
    border-color: #007bff;     /* Color del borde seleccionado */
}

/* Dibujar la marca de verificación (el "check" o palomita) */
.checkbox input[type="checkbox"]:checked + span::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 3px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}