/*

 Theme Name:   Baussecosmetics

 Theme URI:    https://baussecosmetics.com/

 Description:  Tema personalizado para la tienda Bausse Cosmetics.

 Author:       Bausse Cosmetics

 Author URI:   https://baussecosmetics.com/

 Template:     lilac-beauty

 Version:      1.0.0

 Text Domain:  baussecosmetics

*/

/* Definir la fuente Century Gothic - Normal */
@font-face {
    font-family: 'Century Gothic';
    src: url('fonts/centurygothic.ttf') format('truetype'); /* Ruta para la versión normal */
    font-weight: normal;
    font-style: normal;
}

/* Definir la fuente Century Gothic - Bold */
@font-face {
    font-family: 'Century Gothic';
    src: url('fonts/centurygothic_bold.ttf') format('truetype'); /* Ruta para la versión en negritas */
    font-weight: bold;
    font-style: normal;
}

/* Estilo para cambiar el color del texto del enlace dentro de wdt-animation-text */
.wdt-animation-text a {
    color: #ffffff; /* Blanco */
    font-family: 'Century Gothic', sans-serif;
    font-weight: normal; /* Usa la versión bold */
}

/* Opcional: Cambiar el color al pasar el ratón (hover) */
.wdt-animation-text a:hover {
    /*color: #f138b0; /* Amarillo claro para hover */
    font-family: 'Century Gothic', sans-serif;
    font-weight: normal; /* Mantener bold en hover */
}


/* Aplicar Century Gothic al texto del menú principal */
.wdt-header-menu .wdt-primary-nav li a {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; /* Usa la versión bold */
}

/* Aplicar Century Gothic a los span dentro de los enlaces del menú */
.wdt-header-menu .wdt-primary-nav li a span {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; /* Usa la versión bold */
}

/* Opcional: Estilos para submenús */
.wdt-header-menu .sub-menu li a,
.wdt-header-menu .sub-menu li a span {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; /* Usa la versión bold */
}

:root {
    --wdtLinkHoverColor: #E4157E !important; /* Igual al color base */
}
/* Opcional: Hover para el menú */
.wdt-header-menu .wdt-primary-nav li a:hover,
.wdt-header-menu .sub-menu li a:hover {
    color: #E4157E !important;
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; /* Mantener bold en hover */
}

/* Encabezados */
h1, h2 {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; 
}

h3, h4, h5, h6, .h7 {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; 
}

/* Color para el título del producto */
.product-title h5 a {
    color: #E4157E !important;
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; 
}

/* Estrellas de los productos */
.product-rating-wrapper .star-rating:before,
.product-rating-wrapper .star-rating span:before {
    color: #f138b0 !important; 
}

/* Aplicar Century Gothic al título principal (h1) */
.main-title-section-wrapper .main-title-section h1 {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; 
    color: #E4157E;
}

/* Aplicar Century Gothic a los enlaces del breadcrumb */
.main-title-section-wrapper .breadcrumb a {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; 
}

/* Aplicar Century Gothic al elemento actual del breadcrumb (span) */
.main-title-section-wrapper .breadcrumb .current {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; 
}

/* Opcional: Hover para los enlaces del breadcrumb */
.main-title-section-wrapper .breadcrumb a:hover {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold; /* Mantener bold en hover */
    color: #E4157E; /* Color personalizado para hover, igual que tu estilo anterior */
}

.main-title-section-wrapper .breadcrumb-default-delimiter:before {
    background-color: #f263bf !important;
}

.single_add_to_cart_button.button.alt {
    color: #000 !important; /* Negro */
}

.single_add_to_cart_button.button.alt:hover {
    color: #fff !important; /* Blanco al pasar el mouse */
}

.elementor-widget-container p {
    font-family: 'Century Gothic', sans-serif;
    /*font-weight: bold;*/
}

.elementor-icon-list-items {
    font-family: 'Century Gothic', sans-serif;
    font-weight: bold;
}

.elementor-element-1c7e6e9 .elementor-icon-list-text {
    font-family: 'Century Gothic', sans-serif;
}

.wishlist_table .add_to_cart_button:hover {
    color: #f263bf !important; 
    text-decoration: underline; 
}

/* Ajustar el contenedor de los labels */
.woocommerce ul[class*="wdt-custom-product-style-"].products.product-label-boxed:not(.wdt-custom-product-style-1) li.product .product-labels {
    position: absolute;
    top: 1rem;
    left: 1rem;
    right: auto;
    z-index: 1;
}

/* Estilos para el badge (aplicado a todos los badges dentro de .product-labels) */
.woocommerce ul.products.product-label-boxed li.product .product-labels > span {
    padding: 0.35rem 0.75rem;
    font-size: 0.5rem;
    background: #E4157E; /* Fondo negro como en la referencia */
    color: #fff;
    text-transform: uppercase;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 70px;
    height: 1.4rem;
}

/* Estilos específicos para .out-of-stock (por si necesitas sobrescribir algo solo para este badge) */
.woocommerce ul[class*="wdt-custom-product-style-"].products.product-label-boxed:not(.wdt-custom-product-style-1) li.product .product-labels span.out-of-stock {
    padding: 0.35rem 0.75rem;
    font-size: 0.5rem;
    background: #E4157E;
    color: #fff;
    text-transform: uppercase;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 70px;
    height: 1.4rem;
}

/* Estilos para el span interno (aplicado a todos los spans dentro de badges) */
.woocommerce ul.products.product-label-boxed li.product .product-labels > span > span {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0;
}

/* Asegurarse de que los contenedores permitan el posicionamiento absoluto */
.woocommerce.single-product div.images,
.woocommerce-product-gallery {
    position: relative !important;
}

/* Estilos para el badge out-of-stock en la página del producto */
.woocommerce.single-product div.images span.out-of-stock,
.woocommerce-product-gallery span.out-of-stock {
    position: absolute !important;
    top: 1rem !important;
    left: 1rem !important;
    right: auto !important;
    z-index: 1 !important;
    padding: 0.35rem 0.75rem !important;
    font-size: 0.5rem !important;
    background: #E4157E !important;
    color: #fff !important;
    text-transform: uppercase !important;
    border-radius: 5px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-width: 70px !important;
    height: 1.4rem !important;
}

/* Ajustar el tamaño del texto dentro del badge */
.woocommerce.single-product div.images span.out-of-stock > span,
.woocommerce-product-gallery span.out-of-stock > span {
    height: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    margin: 0 !important;
    font-size: 0.625rem !important; /* Aumentamos el tamaño del texto */
}

.select2-container--default .select2-results .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results .select2-results__option--highlighted[aria-selected] {
    color: #ffffff !important; /* o color: white; */
}
  
  

/* Cambiar color del enlace (a) al hacer hover */
.suggested-product-list .suggested-product-data .suggested-product-content a:hover {
    color: #E4157E; 
}

.woocommerce div#review_form_wrapper #respond .form-submit input[type="submit"] {
    color: #000000 !important; /* Negro por defecto */
}

.woocommerce div#review_form_wrapper #respond .form-submit input[type="submit"]:hover {
    color: #FFFFFF !important; /* Blanco en hover */
}
/*
.elementor-section[data-id="0028237"] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1001; 
    
}


.elementor-section[data-id="0870556"] {
    position: fixed;
    top: 32px; 
    left: 0;
    width: 100%;
    z-index: 1000; 
    
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}*/

/* por defecto, ocultar la seccion movil y mostrar la de escritorio */
.header-desktop {
    display: block !important;
    /*background-color: rgb(0, 255, 21) !important;*/
}

.header-mobile {
    display: none !important;
    /*background-color: yellow !important; */
}

/* moviles (hasta 767px en cualquier orientacion) */
@media (max-width: 767px) {
    .header-desktop {
        display: none !important;
    }

    .header-mobile {
        display: block !important;
    }
}

/* tablets (768px a 1024px) - Ajuste para iPad */
@media (min-width: 768px) and (max-width: 1024px) {
    /* en orientacion retrato (iPad en vertical) */
    @media (orientation: portrait) {
        .header-desktop {
            display: none !important;
        }

        .header-mobile {
            display: block !important;
        }
    }

    /* en orientacion paisaje (iPad en horizontal) */
    @media (orientation: landscape) {
        .header-desktop {
            display: block !important;
        }

        .header-mobile {
            display: none !important;
        }
    }
}


/* escritorios (mas de 1024px) */
@media (min-width: 1025px) {
    .header-desktop {
        display: block !important;
    }

    .header-mobile {
        display: none !important;
    }
}


/* Solo color de texto negro para botones WooCommerce */
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button {
    color: #000 !important;
}
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce input.button:hover {
    color: #fff !important;
}

/* Estilo normal: texto negro */
#add_payment_method .cart-collaterals .shipping-calculator-button,
.woocommerce-cart .cart-collaterals .shipping-calculator-button,
.woocommerce-checkout .cart-collaterals .shipping-calculator-button {
    color: #000 !important;
    background-color: #E4157E; /* o el color base que uses */
    transition: background-color 0.3s, color 0.3s;
}

/* Hover: fondo rosa (#f138b0) y texto blanco */
#add_payment_method .cart-collaterals .shipping-calculator-button:hover,
.woocommerce-cart .cart-collaterals .shipping-calculator-button:hover,
.woocommerce-checkout .cart-collaterals .shipping-calculator-button:hover {
    background-color: #f138b0 !important;
    color: #fff !important;
}


/* Estado normal: texto negro */
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button {
    color: #000 !important;
    transition: background-color 0.3s, color 0.3s; /* transición suave */
}

/* Hover: fondo rosa, texto blanco */
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce input.button:hover {
    background-color: #f138b0 !important;
    color: #fff !important;
}

.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated select {
    border-color: #e4157e !important;
}


.lost_password a:hover {
  color: #e4157e !important; 
}

.woocommerce-privacy-policy-link:hover {
  color: #e4157e; /* Cambia a tu color deseado */
}


/* Estilo base para el botón de Contact Form 7 */
.wpcf7-form-control.wpcf7-submit {
    background-color: #e4157e; /* Rosa principal de Bausse para el fondo */
    color: #fff; /* Texto blanco */
    transition: all 0.3s ease; /* Transición suave para el hover */
}

/* Estilo en hover */
.wpcf7-form-control.wpcf7-submit:hover {
    background-color: #f138b0 !important; /* Fondo rosa más claro en hover, como en WooCommerce */
    color: #fff !important; /* Texto blanco */
    border-color: #f138b0; /* Borde ajustado al color de hover */
}

/* Estilo para campos validados (opcional, para coherencia con WooCommerce) */
.wpcf7-form input:focus,
.wpcf7-form textarea:focus {
    border-color: #e4157e !important; /* Borde rosa al enfocar, como los campos validados de WooCommerce */
}


.woocommerce-orders-table__cell-order-actions {
    text-align: center;
}

.woocommerce-orders-table__cell-order-actions a {
    display: inline-block !important;
    margin: 5px 4px !important;
    padding: 6px 12px !important;
    font-size: 14px;
    border-radius: 6px;
    /*background-color: #e4157e !important;
    color: #fff !important;*/
    text-decoration: none !important;
    white-space: nowrap;
    max-width: 100px !important;
}

/* ================================
   Botón "Volver al inicio" 404 Page
   Tema Child: personalización
   ================================ */

/* Mantener texto blanco en normal y hover */
a.wdt-button.filled.small {
    color: #ffffff !important; /* Texto blanco */
    /*background-color: #000000; /* Fondo negro (puedes cambiar) */
    border: none;              /* Sin borde */
}

a.wdt-button.filled.small:hover {
    color: #ffffff !important;  /* Texto sigue blanco */
    /*background-color: #333333;  /* Fondo ligeramente más claro al pasar el mouse */
    cursor: pointer;             /* Manita al pasar el mouse */
}

/* =============================================
   Texto de todos los botones siempre blanco
   Incluye botones WooCommerce y generales
   ============================================= */

button,
input[type="button"],
input[type="submit"],
a.button,
a.added_to_cart,
.woocommerce-cart .cart-collaterals .shipping-calculator-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    color: #ffffff !important;  /* Texto blanco */
}

/* Botón "Añadir al carrito" */
.woocommerce div.product .wdt-product-summary .product-buttons-wrapper .wc_btn_inline .button.alt {
    color: #ffffff !important; /* texto blanco */
}

/* Enlace "Agregar a wishlist" */
.woocommerce div.product .wdt-product-summary .product-button.style-simple .yith-wcwl-add-to-wishlist a {
    color: #ffffff !important;
}


/* =============================================
   Campos de formulario WooCommerce - estilo Bausse
   ============================================= */

/* Borde rosa en inputs y selects inválidos */
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select {
    border-color: #e4157a !important; /* borde rosa Bausse */
}

/* Label rosa para campos inválidos */
.woocommerce form .form-row.woocommerce-invalid label {
    color: #e4157a !important; /* texto rosa Bausse */
}

/* Asterisco rosa para campos obligatorios */
.woocommerce form .form-row .required {
    color: #e4157a !important; /* asterisco rosa Bausse */
}

/* botones de producto - version equilibrada */
a.wdt-button.button.add_to_cart_button,
a.button.product_type_variable,
a.button.product_type_simple,
a.button.product_type_grouped,
a.button.product_type_external {
  width: auto !important;
  max-width: 100%;
  display: inline-block;
  white-space: nowrap;
  text-align: center;
  padding: 10px 22px; 
  font-size: 14px;
  line-height: 1.2;
  border-radius: 6px;
  transition: all 0.2s ease-in-out;
}

/* tablets (espaciado un poco mas compacto) */
@media (max-width: 1024px) {
  a.wdt-button.button.add_to_cart_button,
  a.button.product_type_variable,
  a.button.product_type_simple,
  a.button.product_type_grouped,
  a.button.product_type_external {
    font-size: 13.5px;
    padding: 9px 20px;
    max-width: 240px; 
  }
}

/* moviles (ajuste para no romper texto ni deformar) */
@media (max-width: 768px) {
  a.wdt-button.button.add_to_cart_button,
  a.button.product_type_variable,
  a.button.product_type_simple,
  a.button.product_type_grouped,
  a.button.product_type_external {
    font-size: 13px;
    padding: 8px 18px;
    max-width: 220px;
  }
}



/* === BOTÓN "HAZ CLIC AQUÍ PARA INTRODUCIR TU CÓDIGO" - SOLO COLOR === */
a.showcoupon {
    color: #ffffff !important;
    background-color: #E4157E !important;
    transition: background-color 0.3s ease !important;
}
a.showcoupon,
.showcoupon {
    box-shadow: none !important;
}

a.showcoupon:hover {
    background-color: #f138b0 !important; /* Fondo rosa más claro en hover, como en WooCommerce */
    color: #fff !important; /* Texto blanco */
    border-color: #f138b0;
}

a#submit-payment {
  display: block;
  margin: 30px auto;
  text-align: center;
  width: fit-content;
}
.mobile-menu ul li.menu-item:hover > a,
.mobile-menu ul li.current-menu-ancestor > a {
  color: #ffffff !important;
}

/* Oculta el icono del corazón de YITH en wishlist */
.single_add_to_wishlist #yith-wcwl-icon-heart-outline,
.single_add_to_wishlist .yith-wcwl-icon-svg {
    display: none !important;
}

/* Solo para móviles pequeños */
@media only screen and (max-width: 1280px) { 
    .woocommerce table.shop_table tbody td .quantity .qty,
    .woocommerce-page table.shop_table tbody td .quantity .qty,
    .woocommerce table.shop_table.cart tbody td .quantity .qty,
    .woocommerce-page table.shop_table.cart tbody td .quantity .qty {
        width: 70px;       
    }
}