/**
* Theme Name: YITH Proteo Child
* Description: This is a child theme of YITH Proteo, generated by YITH_Proteo_Wizard.
* Author: <a href="https://yithemes.com">YITH</a>
* Template: yith-proteo
* Version: 1.2.3
*/
/* Estilos personalizados para correos de WooCommerce */


/* Cambiar el estilo de la fuente en los correos de WooCommerce */

/* Tamaño y tipo de fuente para los encabezados */
body .woocommerce-email h2 {
    font-size: 24px; /* Tamaño de la fuente */
    font-family: 'Belleza', sans-serif; /* Tipo de fuente */
    font-weight: bold; /* Peso de la fuente */
}

/* Tamaño y tipo de fuente para el contenido */
body .woocommerce-email p {
    font-size: 16px; /* Tamaño de la fuente */
    font-family: 'Belleza', sans-serif; /* Tipo de fuente */
    line-height: 1.6; /* Espaciado entre líneas */
}
/* Cambiar el logo en la página "Mi cuenta" de WooCommerce */
.woocommerce-account .woocommerce-MyAccount-content img {
    content: url('https://srv1231-files.hstgr.io/438e3633e54393fd/files/public_html/wp-content/themes/yith-proteo-child/images/logo.jpg');
    max-width: 100px; /* Ajusta el tamaño máximo según sea necesario */
    height: auto; /* Mantener la proporción */
}
/* Estilos CSS para el shortcode personalizado */
.custom-registration-login-form {
    font-family: Belleza, sans-serif; /* Cambiar la fuente */
    font-size: 16px; /* Cambiar el tamaño de la fuente */
    color: #fff; /* Cambiar el color del texto */
    background-color:#000; /* Cambiar el color de fondo */
    padding: 20px; /* Agregar espacio alrededor del formulario */
    border: 1px solid #ccc; /* Añadir borde alrededor del formulario */
}

.custom-registration-login-form h2 {
    font-size: 24px; /* Cambiar tamaño de la fuente del título */
    color: #555; /* Cambiar color del título */
    margin-bottom: 10px; /* Añadir espacio inferior al título */
}

.custom-registration-login-form p {
    margin-bottom: 15px; /* Añadir espacio inferior al texto */
}

.custom-registration-login-form input[type="text"],
.custom-registration-login-form input[type="email"],
.custom-registration-login-form input[type="password"] {
    width: 100%; /* Ajustar el ancho de los campos de entrada */
    padding: 10px; /* Añadir espacio dentro de los campos de entrada */
    margin-bottom: 10px; /* Añadir espacio inferior a los campos de entrada */
    border: 1px solid #ccc; /* Añadir borde a los campos de entrada */
}

.custom-registration-login-form button {
    background-color:#000; /* Cambiar color de fondo del botón */
    color: #fff; /* Cambiar color del texto del botón */
    padding: 10px 20px; /* Añadir espacio dentro del botón */
    border: none; /* Eliminar borde del botón */
    cursor: pointer; /* Cambiar cursor al pasar sobre el botón */
    font-size: 16px; /* Cambiar tamaño de la fuente del botón */
}

.custom-registration-login-form button:hover {
    background-color: #005e8c; /* Cambiar color de fondo del botón al pasar el cursor */
}
@import url('https://fonts.googleapis.com/css2?family=Belleza&display=swap');

.woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-content,
.woocommerce-MyAccount-navigation ul li a,
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content p {
    font-family: 'Belleza', sans-serif;
}
/* Ocultar el logo del ojo en la página "Mi cuenta" */
.woocommerce-account .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--privacy-policy {
    display: none;
}
input[type="color"].your-custom-class {
    border: 2px solid transparent; /* Borde transparente por defecto */
    background-color: #ffffff; /* Fondo blanco */
    width: 40px; /* Ajusta el tamaño según sea necesario */
    height: 40px; /* Ajusta el tamaño según sea necesario */
    border-radius: 50%; /* Mantiene el selector redondo */
}

/* Aplicar borde negro cuando el color seleccionado es blanco */
input[type="color"].your-custom-class[value="#ffffff"]:focus {
    border: 2px solid black; /* Borde negro de 2px */
}

/* Aplicar borde negro también al hover */
input[type="color"].your-custom-class[value="#ffffff"]:hover {
    border: 2px solid black; /* Borde negro de 2px en hover */
}

/* Añadir fondo gris oscuro al hover para destacar */
input[type="color"].your-custom-class:hover {
    background-color: rgba(220, 220, 220, 0.5); /* Fondo gris claro con opacidad al pasar el mouse */
}
.sin-espacio {
    margin-top: 0 !important;
    padding-top: 0 !important;
}