/**
* Theme Name:        avanam-cosmika
* Theme URI:         https://templatemela.com/
* Template:          avanam
* Author:            TemplateMela
* Author URI:        #
* Description:       This is a child theme of Avanam, generated by TemplateMela.
* Version:           1.0.2
* License:           GNU General Public License v3.0 (or later)
* License URI:       https://www.gnu.org/licenses/gpl-3.0.html
* Text Domain:       avanam-cosmika
* Requires at least: 6.2
* Tested up to:      6.6
* Requires PHP:      7.4
* Tags: translation-ready, two-columns, right-sidebar, left-sidebar, footer-widgets, blog, custom-logo, custom-background, custom-menu, rtl-language-support, editor-style, threaded-comments, custom-colors, featured-images, wide-blocks, full-width-template, theme-options, e-commerce

*/

.wrap_after_button {
	display: none !important;
}

.entry-hero-container-inner {
	background: #ebd4ca7d !important;
}

.site-bottom-footer-inner-wrap {
	padding-bottom: 30px !important;
}
/* --- Hacer visibles los campos (Inputs y Textarea) --- */
.wpcf7-text, 
.wpcf7-textarea {
    width: 100% !important;
    padding: 12px 16px !important;
    font-size: 15px !important;
    color: #2d2d2d !important;
    background-color: #f9f9f9 !important; /* Fondo gris claro */
    border: 1px solid #cccccc !important; /* Borde gris definido */
    border-radius: 6px !important;        /* Esquinas suavizadas */
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
}

/* Efecto cuando el usuario hace clic para escribir */
.wpcf7-text:focus, 
.wpcf7-textarea:focus {
    background-color: #ffffff !important;
    border-color: #000000 !important; /* Borde negro al escribir */
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05) !important;
}

/* --- Hacer visible y estilizar el Botón --- */
.wpcf7-submit {
    display: inline-block !important;
    width: auto !important;
    padding: 14px 35px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    color: #ffffff !important;
    background-color: #000000 !important; /* Botón negro sólido */
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;
}

/* Efecto al pasar el mouse sobre el botón */
.wpcf7-submit:hover {
    background-color: #2d2d2d !important; /* Se aclara al pasar el cursor */
}

.link_category_product img {
	width: 337px !important;
	height: 360px !important;
}

@media screen and (max-width: 767px) {
  .link_category_product img {
    height: 180px !important;
    width: 100% !important;
  }
}

/* Estilos para inputs de texto y selectores de país/región con !important */
.woocommerce-checkout .input-text, 
.woocommerce-checkout select.country_to_state {
    width: 100% !important;
    padding: 12px 15px !important;
    border: 1px solid #ccc !important;
    border-radius: 6px !important;
    background-color: #fff !important;
    font-size: 15px !important;
    color: #333 !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    outline: none !important;
}

/* Efecto focus al hacer clic en inputs y selectores */
.woocommerce-checkout .input-text:focus, 
.woocommerce-checkout select.country_to_state:focus {
    border-color: #111 !important;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1) !important;
}

/* Estilo elegante para el botón de Realizar el Pedido */
.woocommerce-checkout button#place_order {
    display: inline-block !important;
    width: 100% !important;
    padding: 15px 20px !important;
    background-color: #111 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease, transform 0.1s ease !important;
}

/* Efecto hover al pasar el mouse por encima del botón */
.woocommerce-checkout button#place_order:hover {
    background-color: #333 !important;
}

/* Efecto active al presionar el botón */
.woocommerce-checkout button#place_order:active {
    transform: scale(0.98) !important;
}

/* Custom styling for the single add to cart button */
.single_add_to_cart_button {
  /* Define your border & hover background color here */
  --button-color: #2b2b2b; 
  
  /* Initial State */
  background-color: transparent !important;
  color: var(--button-color) !important;
  border: 2px solid var(--button-color) !important;
  cursor: pointer;
  transition: all 0.3s ease; /* Smooth transition for hover effect */
}

/* Hover and Active (Click) State */
.single_add_to_cart_button:hover,
.single_add_to_cart_button:active,
.single_add_to_cart_button:focus {
  background-color: var(--button-color) !important;
  color: #ffffff !important; /* Text turns white when filled */
  border-color: var(--button-color) !important;
}

.splide__arrow {
	padding: 6px !important;
    box-sizing: content-box !important;
}

.site-main-header-inner-wrap .header-html:has(.dgwt-wcas-search-wrapp), .base-search-icon-wrap {
	display: none !important;
}

.bt_checkout_coupon button {
  background-color: #000000 !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 12px 24px !important;
  border: none !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  transition: all 0.2s ease-in-out !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}

/* Hover & Focus Effects */
.bt_checkout_coupon button:hover {
  background-color: #333333 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.bt_checkout_coupon button:active {
  transform: translateY(0) !important;
}

.bt_checkout_coupon button:focus {
  outline: 2px solid #000000 !important;
  outline-offset: 2px !important;
}

.giveaway-image-container > div {
	height: 100% !important;
}

.giveaway-text-container *:is(p, li) {
	color: black !important;
}

@media screen and (max-width: 767px) {
  .giveaway-text-container *:is(p, li) {
    font-size: 1rem !important;
  }
}

.giveaway-text-container .elementor-icon-list-text *:is(b, span) {
	color: #0066CC !important;
}