/**
Theme Name: Gomax
Theme URI: https://gomax.themeasy.co
Author: Themeasy
Author URI: https://themeasy.co
Description: GOMAX is a WooCommerce theme expertly designed for Fashion Clothing Stores. With its captivating design and intuitive interface, GOMAX easily adapts to various other industries, including Sporting Goods, Furniture, Pet Supplies, Electronics, and Auto Parts. This theme is meticulously optimized for both speed and search engines, ensuring your store not only looks great but also performs exceptionally. Crafted with a focus on driving conversions, GOMAX is your ultimate tool for turning visitors into loyal customers.
Tags: flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready, wide-blocks, full-width-template, sticky-post, microformats, custom-background, editor-style, footer-widgets, grid-layout, portfolio, blog, e-commerce, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-header, post-formats
Version: 1.0.7
Requires at least: 5.8
Tested up to: 5.8
Requires PHP: 7.4
Text Domain: gomax
Domain Path: /languages
License: GPLv3
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/

/*----------------------------------------------

[Content Index]

1. Color
2. Typography

----------------------------------------------*/

/*----------------------------------------------
1. Color
----------------------------------------------*/

/* #region Color */

:root {

	/* Primary */
	--themeasy-primary-color: #3772ff;
	--themeasy-primary-10-color: #3772ff1a;
	--themeasy-primary-15-color: #3772ff26;
	--themeasy-primary-25-color: #3772ff40;
	--themeasy-primary-50-color: #3772ff80;
	--themeasy-primary-75-color: #3772ffbf;

	/* Secondary */
	--themeasy-secondary-color: #ff006e;
	--themeasy-secondary-10-color: #ff006e1a;
	--themeasy-secondary-15-color: #ff006e26;
	--themeasy-secondary-25-color: #ff006e40;
	--themeasy-secondary-50-color: #ff006e80;
	--themeasy-secondary-75-color: #ff006ebf;

	/* Auxiliary */
	--themeasy-accent-color: #cddcff;
	--themeasy-info-color: #0077b6;
	--themeasy-success-color: #38a3a5;
	--themeasy-danger-color: #e63946;

	/* Black & White */
	--themeasy-black-color: #151515;
	--themeasy-white-color: #ffffff;

	/* Background */
	--themeasy-primary-bg-color: var(--themeasy-white-color);
	--themeasy-secondary-bg-color: #f3f4f7;

	/* Border */
	--themeasy-primary-border-color: #e9e9f2;
	--themeasy-secondary-border-color: var(--themeasy-black-color);

	/* Text */
	--themeasy-primary-text-color: #495057;
	--themeasy-secondary-text-color: var(--themeasy-black-color);

	/* Button */
	--themeasy-primary-button-color: var(--themeasy-black-color);
	--themeasy-secondary-button-color: var(--themeasy-white-color);
}

::selection {
  color: var(--themeasy-white-color);
  background: var(--themeasy-primary-color);
}

/* #endregion Color */

/* #region Dark Mode */

:root .dark-mode {

	/* Background */
	--themeasy-primary-bg-color: var(--themeasy-black-color);
	--themeasy-secondary-bg-color: #2c2e33;

	/* Border */
	--themeasy-primary-border-color: #2c2e33;
	--themeasy-secondary-border-color: var(--themeasy-white-color);

	/* Text */
	--themeasy-primary-text-color: #a9aec3;
	--themeasy-secondary-text-color: var(--themeasy-white-color);

	/* Button */
	--themeasy-primary-button-color: var(--themeasy-white-color);
	--themeasy-secondary-button-color: var(--themeasy-black-color);
}

.dark-mode {
	background-color: var(--themeasy-primary-bg-color);
	color: var(--themeasy-primary-text-color);
}

@media (max-width: 991px) {

  :root .dark-mode-mobile {
  
    /* Background */
    --themeasy-primary-bg-color: var(--themeasy-black-color);
    --themeasy-secondary-bg-color: #2c2e33;
  
    /* Border */
    --themeasy-primary-border-color: #2c2e33;
    --themeasy-secondary-border-color: var(--themeasy-white-color);
  
    /* Text */
    --themeasy-primary-text-color: #a9aec3;
    --themeasy-secondary-text-color: var(--themeasy-white-color);
  
    /* Button */
    --themeasy-primary-button-color: var(--themeasy-white-color);
    --themeasy-secondary-button-color: var(--themeasy-black-color);
  }

	.dark-mode-mobile {
		background-color: var(--themeasy-primary-bg-color);
	  color: var(--themeasy-primary-text-color);
	}
}

/* #endregion Dark Mode */

/*----------------------------------------------
2. Typography
----------------------------------------------*/

/* #region Typography */

:root {
	--themeasy-primary-font: 'Lato', sans-serif;
	--themeasy-secondary-font: 'NeueHaas', sans-serif;
	--themeasy-text-font-size: 1rem;
	--themeasy-text-font-weight: 400;
	--themeasy-text-heading-font-weight: 600;
	--themeasy-text-button-font-weight: 600;
	--themeasy-text-bold-font-weight: 700;
}

/* Roboto */
@font-face {
  font-family: 'Roboto';
  src: local('Roboto'), url('assets/fonts/presets/Roboto-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  src: local('Roboto'), url('assets/fonts/presets/Roboto-Normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  src: local('Roboto'), url('assets/fonts/presets/Roboto-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  src: local('Roboto'), url('assets/fonts/presets/Roboto-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  src: local('Roboto'), url('assets/fonts/presets/Roboto-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* Lato */
@font-face {
  font-family: 'Lato';
  src: local('Lato'), url('assets/fonts/presets/Lato-Thin.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lato';
  src: local('Lato'), url('assets/fonts/presets/Lato-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lato';
  src: local('Lato'), url('assets/fonts/presets/Lato-Normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lato';
  src: local('Lato'), url('assets/fonts/presets/Lato-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lato';
  src: local('Lato'), url('assets/fonts/presets/Lato-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* NeueHaas */
@font-face {
  font-family: 'NeueHaas';
  src: url('assets/fonts/presets/NeueHaas-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'NeueHaas';
  src: url('assets/fonts/presets/NeueHaas-Normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'NeueHaas';
  src: url('assets/fonts/presets/NeueHaas-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'NeueHaas';
  src: url('assets/fonts/presets/NeueHaas-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'NeueHaas';
  src: url('assets/fonts/presets/NeueHaas-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* Circular */
@font-face {
  font-family: 'Circular';
  src: url('assets/fonts/presets/Circular-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Circular';
  src: url('assets/fonts/presets/Circular-Normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Circular';
  src: url('assets/fonts/presets/Circular-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Circular';
  src: url('assets/fonts/presets/Circular-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Circular';
  src: url('assets/fonts/presets/Circular-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* Larken */
@font-face {
  font-family: 'Larken';
  src: url('assets/fonts/presets/Larken-Thin.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Larken';
  src: url('assets/fonts/presets/Larken-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Larken';
  src: url('assets/fonts/presets/Larken-Normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Larken';
  src: url('assets/fonts/presets/Larken-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Larken';
  src: url('assets/fonts/presets/Larken-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Larken';
  src: url('assets/fonts/presets/Larken-Extra-Bold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Larken';
  src: url('assets/fonts/presets/Larken-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* #endregion Typography */




/* Update 2025 */
.product-summary-wrapper .product-details .title {
  color: #ffffff !important;
}

p {
  color: #ffffff;
}

.breadcrumb-nav.mb-3 {
  display: none !important;
}

.title.entry-title {
  display: none !important;
}

.woocommerce .add_to_cart_button,
.woocommerce .card.product .button {
  color: #000000 !important;
}

table {
    border: none !important;
}

tbody, td, tfoot, th, thead, tr {
    margin-bottom: 3px;
    border-bottom: solid 1px;
}

.woosw-popup .woosw-popup-inner .woosw-popup-content .woosw-popup-content-mid {
  background-color: #222222 !important;
}

.button .button-text {
  color: #000000 !important;
}

/* Colors pages text */
.elementor-22870 .elementor-element.elementor-element-d347f0a > .elementor-widget-container p,
.elementor-22870 .elementor-element.elementor-element-d347f0a > .elementor-widget-container p~h1,
.elementor-22870 .elementor-element.elementor-element-d347f0a > .elementor-widget-container p~h2,
.elementor-22870 .elementor-element.elementor-element-d347f0a > .elementor-widget-container p~h3,
.elementor-22870 .elementor-element.elementor-element-d347f0a > .elementor-widget-container p~h4,
.elementor-22870 .elementor-element.elementor-element-d347f0a > .elementor-widget-container p~h5,
.elementor-22870 .elementor-element.elementor-element-d347f0a > .elementor-widget-container p~h6 {
  color: #000000 !important;
  text-shadow: none !important;
}

.elementor-22881 .elementor-element.elementor-element-eb983a4 > .elementor-widget-container p,
.elementor-22881 .elementor-element.elementor-element-eb983a4 > .elementor-widget-container p~h1,
.elementor-22881 .elementor-element.elementor-element-eb983a4 > .elementor-widget-container p~h2,
.elementor-22881 .elementor-element.elementor-element-eb983a4 > .elementor-widget-container p~h3,
.elementor-22881 .elementor-element.elementor-element-eb983a4 > .elementor-widget-container p~h4,
.elementor-22881 .elementor-element.elementor-element-eb983a4 > .elementor-widget-container p~h5,
.elementor-22881 .elementor-element.elementor-element-eb983a4 > .elementor-widget-container p~h6 {
  color: #000000 !important;
  text-shadow: none !important;
}

.elementor-22886 .elementor-element.elementor-element-ea1c7d8 > .elementor-widget-container p,
.elementor-22886 .elementor-element.elementor-element-ea1c7d8 > .elementor-widget-container p~h1,
.elementor-22886 .elementor-element.elementor-element-ea1c7d8 > .elementor-widget-container p~h2,
.elementor-22886 .elementor-element.elementor-element-ea1c7d8 > .elementor-widget-container p~h3,
.elementor-22886 .elementor-element.elementor-element-ea1c7d8 > .elementor-widget-container p~h4,
.elementor-22886 .elementor-element.elementor-element-ea1c7d8 > .elementor-widget-container p~h5,
.elementor-22886 .elementor-element.elementor-element-ea1c7d8 > .elementor-widget-container p~h6 {
  color: #000000 !important;
  text-shadow: none !important;
}

.elementor-22878 .elementor-element.elementor-element-a65cc05 > .elementor-widget-container p,
.elementor-22878 .elementor-element.elementor-element-a65cc05 > .elementor-widget-container p~h1,
.elementor-22878 .elementor-element.elementor-element-a65cc05 > .elementor-widget-container p~h2,
.elementor-22878 .elementor-element.elementor-element-a65cc05 > .elementor-widget-container p~h3,
.elementor-22878 .elementor-element.elementor-element-a65cc05 > .elementor-widget-container p~h4,
.elementor-22878 .elementor-element.elementor-element-a65cc05 > .elementor-widget-container p~h5,
.elementor-22878 .elementor-element.elementor-element-a65cc05 > .elementor-widget-container p~h6 {
  color: #000000 !important;
  text-shadow: none !important;
}

/* Text Form Profile */
.woocommerce-Input, 
.woocommerce-Input--text,
.input-text {
  color: #000000 !important;
}


/* Button config */
.button .button-text {
    color: #fff !important;
}

.elementor-9840 .elementor-element.elementor-element-3c615c9 .button .button-text, .elementor-9840 .elementor-element.elementor-element-3c615c9 .button .button-text > * {
    color: #000000 !important;
}

.elementor-9840 .elementor-element.elementor-element-773b3d4 .button .button-text, .elementor-9840 .elementor-element.elementor-element-773b3d4 .button .button-text > * {
    color: #000000 !important;
}

/* Menu scroll off*/
.navbar.scrolled-up {
  display: none !important;
}


.col-12 {
    flex: 0 0 auto;
    align-items: center;
    margin: auto;
    margin-top: 45px;
}

.navbar-right .button .button-text {
    color: #000 !important;
}


/* Borra cualquier línea blanca de ese bloque específico */
.elementor-element-b98cf4e,
.elementor-element-b98cf4e * {
  border: none !important;
  box-shadow: none !important;
}

.elementor-element-b98cf4e::before,
.elementor-element-b98cf4e::after,
.elementor-element-b98cf4e *::before,
.elementor-element-b98cf4e *::after {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  content: none !important;
  display: none !important;
}

/*autor post off*/ 
.byline, .author, .post-author, .meta-author, .author-name, .post-metadata {
  display: none !important;
}

/*Categories post tag*/
.single .post-intro-title>*, .single .post-intro-title .row>*>* {
       /*padding-top: 100px !important;*/
}


.post-categories {
  color: var(--themeasy-secondary-text-color) !important;
}

.post-categories * {
  color: #212529 !important;
  border-radius: 8px;
}

.sidebar-section.wp-sidebar.sticky-top {
  display: none !important;
}

/* Expande el contenido al 100% en los posts */
body.single-post .col-md-8 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

/*Color Tags*/
.badge .badge-text {
  color: #000000 !important;
}


/*Fondo productos cuadrado blanco*/
.product-image .image-wrapper {
  background-color: #fff !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}


#product-23541 .product-image .image-wrapper {
  background-color: #000000 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}


#product-23622 .product-image .image-wrapper {
  background-color: #000000 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

#product-23752 .product-image .image-wrapper {
  background-color: #000000 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

#product-23797 .product-image .image-wrapper {
  background-color: #000000 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

#product-23880 .product-image .image-wrapper {
  background-color: #000000 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

#product-23897 .product-image .image-wrapper {
  background-color: #000000 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

#product-23995 .product-image .image-wrapper {
  background-color: #000000 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.woocommerce .add_to_cart_button, .woocommerce .card.product .button {
    color: #ffffff !important;
  }


/* Fondo y bordes suaves */
#bbpress-forums {
  background-color: #0d0b11;
  border-radius: 15px;
  border: 1px solid #282230;
  padding: 20px;
  color: #e4d7ff;
  font-family: 'Georgia', serif;
}

/* Títulos de los foros */
#bbpress-forums .bbp-forum-title a {
  color: #c8a2ff;
  font-size: 1.2rem;
  font-weight: bold;
}

/* Descripción de los foros */
#bbpress-forums .bbp-forum-content {
  color: #a994c7;
  font-size: 0.95rem;
}

/* Encabezado de tabla */
#bbpress-forums .bbp-header,
#bbpress-forums .bbp-footer {
  background-color: #1c1825;
  color: #d3c1ff;
  text-transform: uppercase;
}

/* Filas de temas */
#bbpress-forums .bbp-body {
  background-color: #131019;
}

/* Hover mágico */
#bbpress-forums .bbp-forum-title a:hover {
  color: #fff0f5;
  text-shadow: 0 0 5px #b06aff;
}

/* Estilo para columnas de Topics/Posts/Last post */
#bbpress-forums td {
  color: #c6b3f1;
  font-size: 0.85rem;
  padding: 10px;
}

/* 🔮 TITULOS DE LOS FOROS */
#bbpress-forums li.bbp-forum .bbp-forum-title a {
  color: #D8B6FF !important; /* Lila más fuerte */
  font-weight: bold;
  font-size: 1.2rem;
  text-shadow: 0 0 3px #00000066;
}

/* 🔮 CABECERAS DE LA TABLA */
#bbpress-forums .bbp-header,
#bbpress-forums .bbp-header a,
#bbpress-forums .bbp-header th {
  color: #e0caff !important;
  font-weight: bold;
  background-color: #1c1825 !important;
}


/* 🔮 TÍTULOS DE LOS FOROS (FORZADO) */
#bbpress-forums li.bbp-forum .bbp-forum-title a {
  color: #e4d0ff !important;         /* Lila visible y suave */
  font-weight: bold !important;
  font-size: 1.2rem !important;
  text-shadow: 0 0 4px #000000cc !important;
  display: inline-block;
}

/* TITULOS DE LOS FOROS EN NEGRO */
#bbpress-forums .bbp-forum-title a {
  color: #000000 !important;   /* Negro puro */
  font-size: 1.2rem !important;
  font-weight: bold !important;
  text-shadow: none !important;
  opacity: 1 !important;
  display: inline-block;
}

/* Fuerza el color negro en enlaces de título de foros bbPress */
#bbpress-forums a.bbp-forum-title {
  color: #000000 !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
  text-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
}

/* También si el <a> está dentro de .bbp-forum-info (refuerzo por jerarquía) */
#bbpress-forums li.bbp-forum-info a.bbp-forum-title {
  color: #000000 !important;
}


/* Color de texto en el campo de búsqueda del foro */
#bbp-search-form input[type="text"] {
  color: #000000 !important; /* Negro puro */
}

.bbpress .col-12.col-md-8 {
  width: 100% !important;
}
 /* 🎨 Fondo general */
#bbpress-forums {
  background: #faf6ff;
  padding: 40px 20px;
  font-family: 'Segoe UI', sans-serif;
  color: #2a2a2a;
}

/* 📦 Tarjetas */
#bbpress-forums .bbp-body ul[id^="bbp-forum-"] {
  background: #ffffff;
  border-left: 5px solid #b884f0;
  border-radius: 8px;
  padding: 16px 20px;
  margin-bottom: 20px;
  box-shadow: 0 4px 12px rgba(186, 142, 238, 0.08);
  transition: all 0.2s ease-in-out;
}
#bbpress-forums .bbp-body ul[id^="bbp-forum-"]:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(186, 142, 238, 0.15);
}

/* 🧠 Título */
#bbpress-forums .bbp-forum-title {
  font-size: 1.2rem;
  font-weight: 600;
  color: #6a1db3;
  margin-bottom: 4px;
}
#bbpress-forums .bbp-forum-title a {
  color: #6a1db3;
  text-decoration: none;
}
#bbpress-forums .bbp-forum-title a:hover {
  color: #431073;
}

/* ✨ Descripción */
#bbpress-forums .bbp-forum-content {
  font-size: 0.95rem;
  color: #4e4e4e;
}

/* ❌ Ocultar tabla */
#bbpress-forums .bbp-header,
#bbpress-forums .bbp-footer,
#bbpress-forums .bbp-forum-topic-count,
#bbpress-forums .bbp-forum-reply-count,
#bbpress-forums .bbp-forum-freshness {
  display: none !important;
}

/* 📱 Responsive */
@media screen and (max-width: 768px) {
  #bbpress-forums {
    padding: 20px 10px;
  }
  #bbpress-forums .bbp-forum-title {
    font-size: 1.1rem;
  }
}

.more_less_input_text {
    color: #ffffff !important;
}
/* Botón ADD TO CART: fondo gris oscuro + texto blanco */
.product-button .button.add_to_cart_button {
    background-color: #2b2b2b !important; /* gris oscuro */
    color: #ffffff !important;            /* texto blanco */
    border: none !important;
}
/* Hover: dejar el morado que ya tienes */
.product-button .button.add_to_cart_button:hover {
    background-color: #c291ff !important; /* tu hover morado */
    color: #ffffff !important;
}



/* Quitar el borde del contenedor del selector de cantidad */
.product-quantity-button.tms-qty-button {
    border: none !important;
    box-shadow: none !important;
}

/* Fondo gris oscuro para el contenedor de la cantidad */
.product-quantity-button.tms-qty-button {
    background-color: #2b2b2b !important;  /* gris oscuro */
    border: none !important;               /* quitar borde blanco */
    box-shadow: none !important;
    border-radius: 6px !important;         /* opcional, para igualarlo al “Add to cart” */
}

/* Evitar cualquier cambio de color en hover */
.product-quantity-button.tms-qty-button:hover {
    background-color: #2b2b2b !important;
    border: none !important;
    box-shadow: none !important;
  }



    /* ==== CAJA SKU / CATEGORIES / TAGS ==== */
body .product-summary-wrapper .product-meta {
    border: 0 !important;                     /* quitar borde */
    border-color: transparent !important;     /* por si acaso */
    background-color: #2b2b2b !important;     /* gris oscuro */
    border-radius: 8px !important;
}

/* Quitar cualquier fondo raro de dentro (el azul) */
body .product-summary-wrapper .product-meta .meta-item {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Texto en blanco dentro de la caja */
body .product-summary-wrapper .product-meta,
body .product-summary-wrapper .product-meta * {
    color: ##d5bcff !important;

}


/* Quitar borde de los botoncitos (Share, Compare, Product Details) */
.product-summary-wrapper .product-action .icon-wrapper {
  border: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Hover con tu morado suave #c291ff85 */
.product-summary-wrapper .product-action .icon-wrapper:hover {
    background-color: #c291ff85 !important; /* tu color suave */
    border: none !important;
    box-shadow: none !important;
}

/* Flechas del carrusel (Related products) – quitar borde */
.swiper.carousel .swiper-button-prev svg,
.swiper.carousel .swiper-button-next svg,
.swiper.carousel .swiper-button-prev .icon,
.swiper.carousel .swiper-button-next .icon {
  border: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 50% !important;
  transition: background-color 0.25s ease !important;
}

/* Hover con fondo #c291ff85 */
.swiper.carousel .swiper-button-prev:hover svg,
.swiper.carousel .swiper-button-next:hover svg,
.swiper.carousel .swiper-button-prev:hover .icon,
.swiper.carousel .swiper-button-next:hover .icon {
  background: #c291ff85 !important;
}

/* Caja del widget de categorías */
.product-filters-widget.categories_filter {
  background: #181818;
  padding: 18px 20px;
  border-radius: 10px;
  color: #ffffff;
}

/* Título */
.product-filters-widget.categories_filter .title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 8px;
  display: block;
}

/* LISTA DE CATEGORÍAS EN 3 COLUMNAS */
.product-filters-widget.categories_filter .filter-items {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important; /* 3 columnas */
  gap: 8px 16px !important;             /* separación entre filas y columnas */
  max-height: 260px;                    /* haces la caja más baja */
  overflow-y: auto;                     /* scroll si hay muchas */
  padding-right: 4px;
}

/* Cada categoría (fila) */
.product-filters-widget.categories_filter .filter-items label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 4px 0 !important;
  font-size: 0.9rem;
  cursor: pointer;
  white-space: normal !important;       /* permite que el texto salte de línea */
}

/* Checkboxes bonitos y completos */
.product-filters-widget.categories_filter input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  transform: none !important;
  accent-color: #c291ff !important;     /* tu lila */
}

/


/* Caja del widget de categorías */
.product-filters-widget.categories_filter {
  background: #181818;
  padding: 15px 18px;
  border-radius: 10px;
  color: #ffffff;
  max-height: 260px !important;   /* 🔥 caja más pequeña */
  overflow: hidden;
}

/* Contenedor interno — ahora sí permitimos grid */
.product-filters-widget.categories_filter .filter-items {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important; /* 🔥 tres columnas */
  gap: 6px 14px !important;
  height: 220px !important;       /* altura interna */
  overflow-y: auto !important;     /* scroll vertical */
  padding-right: 6px;
}

/* Cada elemento de categoría */
.product-filters-widget.categories_filter .filter-items label {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 3px 0 !important;
  font-size: 0.9rem;
  white-space: normal !important; /* permite saltos de línea */
}

/* Checkboxes */
.product-filters-widget.categories_filter input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  accent-color: #c291ff !important;
  flex-shrink: 0 !important;
}


/* 🔥 Inputs del filtro de precio (Min / Max) */
.product-filters-widget.price_filter input {
  background: #2a2a2a !important;   /* gris oscuro */
  color: #ffffff !important;        /* texto blanco */
  border: none !important;          /* sin borde */
  border-radius: 8px !important;    /* esquinas suaves */
  padding: 10px 12px !important;    /* mejor altura */
  box-shadow: none !important;      /* sin sombras raras */
  outline: none !important;         /* sin borde azul al hacer clic */
  font-size: 0.95rem !important;
}

/* Cambia el placeholder (“Min”, “Max”) a gris suave */
.product-filters-widget.price_filter input::placeholder {
  color: #cccccc !important;
  opacity: 1 !important;
}

/* Hover bonito */
.product-filters-widget.price_filter input:hover {
  background: #3a3a3a !important;
}

/* Focus bonito (cuando se escribe) */
.product-filters-widget.price_filter input:focus {
  background: #454545 !important;
}

/* 🔥 Caja principal del selector (el que dice “Default sorting”) */
.tms-custom-select.style-3 .tms-custom-select-trigger {
  background: #2a2a2a !important;      /* gris oscuro */
  color: #ffffff !important;           /* texto blanco */
  border: none !important;             /* sin borde */
  border-radius: 8px !important;       /* esquinas suaves */
  padding: 10px 14px !important;
  font-size: 0.95rem !important;
  cursor: pointer;
  box-shadow: none !important;
}

/* Hover */
.tms-custom-select.style-3 .tms-custom-select-trigger:hover {
  background: #3a3a3a !important;
}

/* Focus (si lo usa el plugin) */
.tms-custom-select.style-3 .tms-custom-select-trigger:focus {
  background: #454545 !important;
}

/* 🔥 Opciones del desplegable */
.tms-custom-select.style-3 .custom-options {
  background: #1f1f1f !important;      /* fondo oscuro bonito */
  border: none !important;             /* sin borde */
  border-radius: 8px !important;
  color: #fff !important;
  box-shadow: none !important;
}

/* Cada opción */
.tms-custom-select.style-3 .custom-option {
  background: transparent !important;
  color: #ddd !important;
  padding: 10px 14px !important;
}

/* Hover de cada opción */
.tms-custom-select.style-3 .custom-option:hover {
  background: #3a3a3a !important;
  color: #fff !important;
}

/* Opción seleccionada */
.tms-custom-select.style-3 .custom-option.selected {
  background: #c291ff40 !important; /* tu lila suave translúcido */
  color: #fff !important;
}


/* 🔥 Estilo definitivo para el botón LOAD MORE */
.elementor-15809 .archive-toolbar-footer .load-more-button,
.elementor-15809 .load-more-button {
  background-color: #2e2e2e !important;   /* fondo gris */
  color: #c291ff !important;              /* texto morado */
  border: none !important;                /* sin línea/borde */
  box-shadow: none !important;            /* sin sombra */
  border-radius: 8px !important;
  padding: 12px 28px !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  cursor: pointer;
}

/* Quitamos cualquier adorno que use ::before / ::after */
.elementor-15809 .load-more-button::before,
.elementor-15809 .load-more-button::after {
  content: none !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Hover sutil */
.elementor-15809 .load-more-button:hover {
  background-color: #3a3a3a !important;   /* gris un pelín más claro */
  color: #d8b4ff !important;              /* morado algo más vivo */
}

/* Texto del botón LOAD MORE en negro */
.elementor-15809 .load-more-button .button-text {
  color: #000000 !important;
}

/* Fondo lila suave y texto negro para el Load More */
.load-more-button {
  background-color: #c291ff !important;
  border: none !important;
  color: #000 !important;
}

.pagination ul, .pagination .nav-links .page-numbers {
    background-color: #000000;
    color: #c291ff99;
}

.pagination .current{
    background-color: #c291ff !important;
    color: #000000 !important;
}

.post-grid .post-item {
    border-bottom: 0px solid !important;
}

/* Que la zona de posts ocupe TODO el ancho (solo en la página de blog-1) */
body.blog-1 .col-12.col-md-8 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

body.blog-1 .col-12.col-md-8,
body.blog .col-12.col-md-8,
body.archive .col-12.col-md-8 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
}


/* Añadir espacio entre el menú y el contenido en todas las páginas del blog */
body.blog .main-section,
body.archive .main-section,
body.category .main-section,
body.tag .main-section,
body.search .main-section {
    padding-top: 80px !important;
}

/* Contenedor para permitir efectos */
.tms-image-zoom, 
.post-item .tms-image-zoom, 
.archive .tms-image-zoom {
    position: relative;
    overflow: hidden;
    border-radius: 15px; /* redondeado */
}

/* Imagen con transición suave */
.tms-image-zoom img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
    transition: transform 0.4s ease, filter 0.4s ease;
}

/* Capa de degradado morado oscuro */
.tms-image-zoom::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    background: linear-gradient(
        to bottom,
        rgba(50, 0, 70, 0.5),
        rgba(0, 0, 0, 0.7)
    );
    pointer-events: none;
    transition: opacity 0.4s ease;
    opacity: 1;
}

/* Efecto hover — brillo + zoom suave */
.tms-image-zoom:hover img {
    transform: scale(1.06);
    filter: brightness(1.2);
}

/* El degradado se aclara al pasar el cursor */
.tms-image-zoom:hover::after {
    opacity: 0.3;
}

.post-grid .post-item .post-categories {
    padding: 0 0 10px 10px !important;
}

.post-grid .post-item .post-categories .category {
    padding: 6px 10px !important;
}


/* ===========================
   1. TARJETA CENTRAL DEL POST
   =========================== */

body.single-post section.content-section.post {
  max-width: 880px;                     /* ancho del bloque de lectura */
  margin: 60px auto 80px;               /* separaciones y centrado */
  padding: 40px 32px;
  border-radius: 24px;
  background: radial-gradient(circle at top, #261432eb 0, #08040d 45%, #030107 100%);
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.85);
}

/* evitamos cajas raras por fuera */
body.single-post #main.main-section,
body.single-post #primary,
body.single-post .site-main {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* contenido interno un poco más recogido */
body.single-post section.content-section.post .entry-content,
body.single-post section.content-section.post .post-content {
  max-width: 720px;
  margin: 25px auto 0;
}

/* ===========================
   2. IMAGEN DESTACADA
   =========================== */

/* wrapper de la imagen destacada */
body.single-post section.content-section.post .post-thumbnail {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  margin-bottom: 30px;
}

/* la imagen en sí */
body.single-post section.content-section.post .post-thumbnail img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 24px;
  transition: transform 0.35s ease;
}

/* capa de degradado morado encima */
body.single-post section.content-section.post .post-thumbnail::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(194, 145, 255, 0.55) 0%,
    rgba(10, 5, 25, 0.95) 100%
  );
  mix-blend-mode: screen;
  opacity: 0.6;
  transition: opacity 0.35s ease, box-shadow 0.35s ease, transform 0.35s ease;
}

/* brillo + zoom al poner el cursor */
body.single-post section.content-section.post .post-thumbnail:hover::before {
  opacity: 1;
  box-shadow: 0 0 35px rgba(194, 145, 255, 0.9);
  transform: scale(1.03);
}

body.single-post section.content-section.post .post-thumbnail:hover img {
  transform: scale(1.04);
}

/* ===========================
   IMAGEN DEL POST — ESTILO “LA UNIÓN”
   =========================== */

body.single-post section.content-section.post .post-thumbnail {
  position: relative;
  overflow: hidden;
  border-radius: 28px; /* igual a la captura */
  margin-bottom: 40px;
  transform: translateZ(0);
}

/* imagen */
body.single-post section.content-section.post .post-thumbnail img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 28px;
  object-fit: cover;
  transition: transform 0.5s ease, filter 0.5s ease;
}

/* degradado morado oscuro desde abajo */
body.single-post section.content-section.post .post-thumbnail::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(40, 0, 60, 0.85) 5%,
    rgba(20, 0, 30, 0.55) 40%,
    rgba(0, 0, 0, 0) 100%
  );
  border-radius: 28px;
  pointer-events: none;
  transition: opacity 0.45s ease;
  opacity: 0.8;
}

/* hover: brillo y zoom */
body.single-post section.content-section.post .post-thumbnail:hover img {
  transform: scale(1.06);
  filter: brightness(1.18);
}

body.single-post section.content-section.post .post-thumbnail:hover::after {
  opacity: 1;
}

/* ===========================
   TARJETA SUPERPUESTA SOBRE LA IMAGEN
   =========================== */

/* Contenedor del contenido del post */
body.single-post section.content-section.post .container-inner {
  position: relative;
  z-index: 5;
  max-width: 850px; /* ajusta si quieres */
  margin: 0 auto;
}

/* La tarjeta del texto */
body.single-post section.content-section.post .post-content {
  background: #0d0d0d; /* color oscuro elegante */
  padding: 50px;
  border-radius: 22px;
  margin-top: -70px; /* ¡Aquí es donde se superpone! */
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.45);
  position: relative;
  z-index: 10;
}

/* Ajuste para que los textos respiren */
body.single-post section.content-section.post .post-content p,
body.single-post section.content-section.post .post-content h2,
body.single-post section.content-section.post .post-content h3 {
  color: #fff;
}


/* SUBIR el bloque de texto 300px para montarlo sobre la imagen */
.single-post .container.full-container {
    position: relative;
    z-index: 20;
}

/* Asegurar que la tarjeta esté encima */
.single-post .main-section .post-text-card {
    position: relative;
    z-index: 50;
}

.single-post .main-section .container {
  width: 100% !important;
  max-width: 100% !important;
}

.single .post-intro-title.align-to-center{
    z-index: 9999;
    position: relative;
    margin-top: 100px;
}

body.single-post section.content-section.post {
    margin: 0px auto 80px !important;
    z-index: 9999;
    position: relative;
}

.single-post .main-section .post-thumbnail {
    top: 0;
    position: absolute;
    width: 100%;
}

.single-post .main-section .title.entry-title {
    display: contents !important;
}

.single-post .main-section .image-wrapper .image {
    width: 100% !important;
}

/* Degradado negro suave para todas las imágenes destacadas de todos los posts */
.single-post .main-section .post-thumbnail .image-wrapper {
    position: relative;
    overflow: hidden;
}

.single-post .main-section .post-thumbnail .image-wrapper::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40%; /* Ajusta la altura del degradado */
    pointer-events: none;
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.6) 60%,
        #000000 100%
    );
}




/* Ocultar solo el título "Tags" sin eliminar las etiquetas */
#post-tags .title {
    display: none !important;
}

#post-categories .title {
    display: none !important;
}


/* --- FORMULARIO DE COMENTARIOS ELEGANTE --- */

/* Contenedor de comentarios */
#commentform textarea {
    background: #0e0b14 !important; /* Fondo oscuro elegante */
    color: #d8c8ff !important; /* Texto en lila suave para máxima lectura */
    border: 1px solid #2e2348 !important; /* Borde violeta oscuro */
    border-radius: 12px !important; /* Bordes redondeados */
    padding: 20px !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
    resize: vertical; /* Permitir redimensionar solo vertical */
}

/* Placeholder visible */
#commentform textarea::placeholder {
    color: #8d7bbf !important; /* Lila suave */
    opacity: 0.7 !important;
}

/* Texto mientras escribes */
#commentform textarea:focus {
    outline: none !important;
    border-color: #a585ff !important; /* Brillo al enfocar */
    box-shadow: 0 0 12px rgba(165, 133, 255, 0.4) !important;
    text-color-: #000000 !important;
}

/* Botón de publicar comentario */
#commentform input[type="submit"] {
    background: linear-gradient(135deg, #8e5aff, #c89bff) !important;
    color: #fff !important;
    padding: 14px 28px !important;
    border-radius: 10px !important;
    border: none !important;
    font-size: 16px !important;
    cursor: pointer !important;
    transition: 0.3s ease;
    font-weight: 600;
}

/* Hover del botón */
#commentform input[type="submit"]:hover {
    background: linear-gradient(135deg, #b88cff, #e4c4ff) !important;
    box-shadow: 0 0 15px rgba(200, 155, 255, 0.5) !important;
}

/* Ajustes de márgenes para que todo respire bien */
#respond {
    margin-top: 50px !important;
}

/* Quitar fondo y borde de las etiquetas (en los posts) */
#post-tags .badge {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Color del texto de las etiquetas */
#post-tags .badge .badge-text {
  color: #d5bcff !important;
}

/* Por si el enlace hereda otro color */
#post-tags .badge,
#post-tags .badge:hover {
  color: #d5bcff !important;
}

/* Hover suave opcional */
#post-tags .badge:hover .badge-text {
  color: #ffffff !important;
  text-shadow: 0 0 6px #d5bcff;
}

/* --------- Navegación de posts: reset total --------- */

/* Reset brutal solo para estos dos enlaces */
.post-navigation-buttons .button.prev,
.post-navigation-buttons .button.next {
  all: unset;                          /* BORRA todo lo heredado de .button */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;

  padding: 0.45rem 1.1rem;
  border-radius: 999px;
  border: 1px solid rgba(194, 145, 255, 0.7);
  background: rgba(194, 145, 255, 0.18);    /* lila muy suave */
  color: #f7f0ff;
  font-size: 0.85rem;
  font-weight: 500;
  font-family: inherit;
  letter-spacing: 0.03em;
  text-decoration: none;
  white-space: nowrap;

  opacity: 0.7;
  transition:
    background 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease,
    opacity 0.2s ease,
    color 0.2s ease;
}

/* centramos el grupo de botones y separamos un poco */
.post-navigation-buttons {
  display: flex !important;
  justify-content: center;
  gap: 1rem;
}

/* icono de flecha un pelín más discreto */
.post-navigation-buttons .button.prev .button-icon,
.post-navigation-buttons .button.next .button-icon {
  font-size: 0.8rem !important;
}

/* Matamos los pseudo-elementos responsables del marco hortera */
.post-navigation-buttons .button.prev::before,
.post-navigation-buttons .button.prev::after,
.post-navigation-buttons .button.next::before,
.post-navigation-buttons .button.next::after {
  content: none !important;
  display: none !important;
}

/* Hover: más intensidad y brillito suave */
.post-navigation-buttons .button.prev:hover,
.post-navigation-buttons .button.next:hover {
  background: rgba(194, 145, 255, 0.38);
  opacity: 1;
  box-shadow: 0 0 14px rgba(194, 145, 255, 0.55);
  transform: translateY(-1px);
}

/* ----------- Estilo uniforme para campos del formulario ----------- */

#respond textarea,
#respond input[type="text"],
#respond input[type="email"],
#respond input[type="url"] {
    width: 100%;
    background: rgba(255, 255, 255, 0.05); /* mismo fondo suave que el textarea */
    border: 1px solid rgba(194, 145, 255, 0.35); /* borde lila suave */
    padding: 0.9rem 1rem;
    border-radius: 12px;
    font-size: 1rem;
    color: #ffffff; /* texto blanco */
    box-shadow: none !important;
    transition: border-color 0.2s ease, background 0.2s ease;
}

/* Placeholder igual que el textarea */
#respond textarea::placeholder,
#respond input[type="text"]::placeholder,
#respond input[type="email"]::placeholder,
#respond input[type="url"]::placeholder {
    color: #bca9d6 !important; /* gris lila clarito */
    opacity: 0.8;
}

/* Hover */
#respond textarea:hover,
#respond input[type="text"]:hover,
#respond input[type="email"]:hover,
#respond input[type="url"]:hover {
    background: rgba(255, 255, 255, 0.08);
}

/* Focus */
#respond textarea:focus,
#respond input[type="text"]:focus,
#respond input[type="email"]:focus,
#respond input[type="url"]:focus {
    outline: none !important;
    background: rgba(255, 255, 255, 0.10);
    border-color: rgba(194, 145, 255, 0.8) !important;
}

/* Sombra GRANDE y más intensa para el título del post */
h1.title.entry-title {
    text-shadow: 
        0 4px 12px rgba(0, 0, 0, 0.75),   /* sombra principal, fuerte */
        0 8px 24px rgba(0, 0, 0, 0.55),   /* halo amplio difuminado */
        0 12px 36px rgba(0, 0, 0, 0.40);  /* aura grande y suave */
    transition: text-shadow 0.3s ease;
}

article {
  padding-top: 30px;
}

.button .button-text {
    padding: 0 10px !important;
}

/* Forzar 4 columnas en los productos */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    width: 23% !important;
    margin-right: 2% !important;
}

/* Quitar el margen del último producto de cada fila */
.woocommerce ul.products li.product:nth-child(4n),
.woocommerce-page ul.products li.product:nth-child(4n) {
    margin-right: 0 !important;
}

/* Ocultar totalmente el selector de columnas */
.archive-layout-switcher,
.archive-layout-switcher *,
.layout-switcher,
.layout-switcher * {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* --- ESTADO NORMAL (que se vea siempre oscuro) --- */
.tms-custom-select-wrapper .tms-custom-select-trigger {
    background: #150b1f !important;       /* fondo oscuro */
    border: 1px solid #c291ff !important;  /* borde lila */
    color: #ffffff !important;             /* texto blanco */
    opacity: 1 !important;                 /* evitar que quede blando */
    border-radius: 8px !important;
    padding: 8px 18px !important;
    transition: 0.25s ease-in-out !important;
}

/* Ícono de flecha */
.tms-custom-select-wrapper .tms-custom-select-trigger::after {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* --- HOVER (que se ilumine un poco) --- */
.tms-custom-select-wrapper .tms-custom-select-trigger:hover {
    box-shadow: 0 0 12px #c291ff !important; /* glow suave lila */
    border-color: #d8aaff !important;        /* borde un pelín más claro */
    transform: translateY(-1px);             /* efecto suave */
}


/* Números base: sin fondo ni borde */
.archive-toolbar-footer .product-grid-pagination a.pagination-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  padding: 0;
  border-radius: none;
  border: none;
  background: none;
  color: #ffffff;
  font-size: 1rem;
  line-height: 1;
  text-decoration: none;
  transition: all 0.2s ease;
}

/* Ícono flecha reducido */
.tms-custom-select-wrapper .tms-custom-select-trigger::after {
    font-size: 12px !important;
    color: #ffffff !important;
}

/* --- HOVER --- */
.tms-custom-select-wrapper .tms-custom-select-trigger:hover {
    box-shadow: 0 0 10px #c291ff !important;
    border-color: #d8aaff !important;
    transform: translateY(-1px);
}

/* 🔮 Paginación de productos: estilo Moon of Lilith */
.archive-toolbar-footer .product-grid-pagination ul {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
}

/* li “limpio” */
.archive-toolbar-footer .product-grid-pagination li {
  margin: 0;
}

/* Botones de página */
.archive-toolbar-footer .product-grid-pagination a.pagination-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 10px;
  border-radius: 999px;                /* pastillita redonda */
  border: 1px solid #c291ff;
  background: rgba(194, 145, 255, 0.08);
  color: #f5ebff;
  font-size: 0.85rem;
  line-height: 1;
  text-decoration: none;
  transition: all 0.2s ease;
}

/* Hover general */
.archive-toolbar-footer .product-grid-pagination a.pagination-item:hover {
  background: #c291ff;
  color: #0b0711;
  box-shadow: 0 0 12px rgba(194, 145, 255, 0.45);
}

/* Página actual */
.archive-toolbar-footer .product-grid-pagination a.pagination-item.current {
  background: #c291ff;
  color: #0b0711;
  font-weight: 600;
  box-shadow: 0 0 16px rgba(194, 145, 255, 0.55);
}

/* Elementos deshabilitados (por si hay prev/next inactivos) */
.archive-toolbar-footer .product-grid-pagination li.disabled a,
.archive-toolbar-footer .product-grid-pagination li.disabled span {
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
}


@media (max-width: 767px) {
    video.elementor-video {
        width: 60% !important;   /* Ajusta el tamaño aquí */
        height: auto !important;
        margin: 0 auto !important;
        display: block !important;
    }
}
  /* Ocultar texto grande SOLO en responsive */
@media (max-width: 767px) {
    .elementor-element-54a06f9 {
        display: none !important;
    }
}

/* Centrado de títulos solo en móvil */
@media (max-width: 767px) {
    .text-intro-wrapper,
    .text-intro.style-2,
    .pre-title,
    .title {
        text-align: center !important;
        justify-content: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}
 @media (max-width: 767px) {
    .text-intro-wrapper {
        margin-top: -10px !important; /* sube los textos */
    }

    .pre-title {
        margin-bottom: 5px !important; /* acerca el título principal */
    }

    .title {
        margin-top: 0 !important;
        margin-bottom: 10px !important;
    }
}


@media (max-width: 767px) {
    /* Ajustar la luna en móvil */
    .elementor-section[data-id="5c0d4bf"] {
        padding-bottom: 10px !important; /* antes tenía mucho más */
        margin-bottom: 0 !important;
    }

    .elementor-widget-video video,
    .elementor-widget-video img {
        margin-bottom: 0 !important; 
    }
}


/******************************************
 * SOLO MÓVIL – HOME
 ******************************************/
@media (max-width: 767px) {

  /******************************************
   * 1) Iconos: solo el icono, 4 columnas
   ******************************************/

  /* Widget de cards de iconos (Moon Journal, Free Shipping, etc.) */
  body.home .elementor-widget[data-widget_type="themeasy-card.default"] .elementor-column {
    flex: 0 0 25%;
    max-width: 25%;
    width: 25%;
    text-align: center;
  }

  /* Ocultar títulos y textos dentro de cada card,
     dejando solo el icono */
  body.home .elementor-widget[data-widget_type="themeasy-card.default"] .card-body h1,
  body.home .elementor-widget[data-widget_type="themeasy-card.default"] .card-body h2,
  body.home .elementor-widget[data-widget_type="themeasy-card.default"] .card-body h3,
  body.home .elementor-widget[data-widget_type="themeasy-card.default"] .card-body h4,
  body.home .elementor-widget[data-widget_type="themeasy-card.default"] .card-body p,
  body.home .elementor-widget[data-widget_type="themeasy-card.default"] .card-body .card-description {
    display: none !important;
  }

  /* Un poco de aire alrededor del icono */
  body.home .elementor-widget[data-widget_type="themeasy-card.default"] .card-body {
    padding: 10px 0 !important;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  /******************************************
   * 2) Luna más pequeña y menos espacio debajo
   ******************************************/

  /* Reducir tamaño de la luna solo en la home móvil */
  body.home .elementor-widget-video video.elementor-video {
    max-width: 260px;
    height: auto;
    margin: 10px auto 0 auto; /* centrada y un pelín de margen arriba */
    display: block;
    z-index: 9999;
    position: relative;
  }

  /* Quitar hueco extra por debajo del widget de vídeo */
  body.home .elementor-widget-video .elementor-widget-container {
    height: 222px;
    margin: -50px 0 !important;
  }
}

/* ===== Iconos en fila solo en móvil ===== */
@media (max-width: 767px) {

  /* Forzar que los 4 iconos estén en la misma fila */
  body.home .elementor-section[data-id="5c0d4bf"] .elementor-container {
    display: flex;
    flex-wrap: nowrap;         /* todos en una sola línea */
    justify-content: space-between;
  }

  /* Cada columna = 25% del ancho */
  body.home .elementor-section[data-id="5c0d4bf"] .elementor-column {
    flex: 0 0 25%;
    max-width: 25%;
    width: 25%;
  }
}

@media (max-width: 767px) {

  /* Reducir tamaño de los iconos sin afectar escritorio */
  body.home .elementor-widget-themeasy-card img {
    width: 60px !important;   /* Ajusta aquí: 70px, 60px, 80px... */
    height: auto !important;
  }

  /* Opcional: reducir el espacio entre iconos */
  body.home .elementor-widget-themeasy-card {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
}


/* Ocultar banner del cupón solo en móvil */
@media (max-width: 767px) {
    .elementor-element.elementor-element-167a6bd {
        display: none !important; 
    }
    body.home .elementor-section[data-id="5c0d4bf"] .elementor-column {
        flex: auto !important;
        max-width: unset !important;
        width: unset !important;
    }
    .elementor-element-5c0d4bf .card svg {
        color: #FFFFFF;
        height: 75% !important;
    }
}

/***************************************************
 * RESEÑAS – Responsive solo (tablet + móvil)
 * Widget: .elementor-element-56f454
 ***************************************************/
@media (max-width: 1024px) {

  /* Asegurar que el carrusel se vea en responsive */
  .elementor-element-56f454 .swiper.carousel {
    opacity: 1 !important;
    pointer-events: auto !important;
    height: auto !important;
  }

  /* Wrapper del slider: centramos el contenido */
  .elementor-element-56f454 .swiper-wrapper {
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
  }

  /* Cada slide se comporta como una “card” centrada */
  .elementor-element-56f454 .swiper-slide {
    display: flex !important;
    justify-content: center !important;
    align-items: stretch !important;
    width: 85% !important;          /* 1 card visible y centrada */
    max-width: 420px;
    padding: 10px 0;
  }

  /* La tarjeta interior (el bloque gris/oscuro de la reseña) */
  .elementor-element-56f454 .card,
  .elementor-element-56f454 .card-boxed,
  .elementor-element-56f454 .card.boxed.parent.simple {
    width: 100% !important;
    margin: 0 auto !important;
    border-radius: 18px;
    overflow: hidden;
  }

  .elementor-element-56f454 .card .card-body,
  .elementor-element-56f454 .card-boxed .card-body,
  .elementor-element-56f454 .card.boxed.parent.simple .card-body {
    padding: 22px 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  /* Flechas de navegación visibles y centradas verticalmente */
  .elementor-element-56f454 .swiper-button-prev,
  .elementor-element-56f454 .swiper-button-next {
    display: flex !important;
    opacity: 1 !important;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.35);
    align-items: center;
    justify-content: center;
    z-index: 20;
  }

  .elementor-element-56f454 .swiper-button-prev {
    left: 10px !important;
  }

  .elementor-element-56f454 .swiper-button-next {
    right: 10px !important;
  }

  .elementor-element-56f454 .swiper-button-prev::after,
  .elementor-element-56f454 .swiper-button-next::after {
    font-size: 16px !important;
  }
}

/* Ajuste extra para móviles pequeños */
@media (max-width: 767px) {

  .elementor-element-56f454 .swiper-slide {
    width: 90% !important;
    max-width: 380px;
  }

  .elementor-element-56f454 .card .card-body,
  .elementor-element-56f454 .card-boxed .card-body,
  .elementor-element-56f454 .card.boxed.parent.simple .card-body {
    padding: 18px 16px;
  }
}

/* ===========================
   TESTIMONIOS - RESPONSIVE
   (solo tablet y móvil)
   =========================== */

/* Tablet y móvil hasta 1024px */
@media (max-width: 1024px) {

  /* Limitar el área del carrusel en responsive */
  body.home .elementor-element-56df454 .swiper-container {
    overflow: visible;
  }

  /* Wrapper de las slides */
  body.home .elementor-element-56df454 .swiper-wrapper {
    display: flex;
    align-items: stretch;
  }

  /* Cada slide ocupa prácticamente todo el ancho (1 card por pantalla) */
  body.home .elementor-element-56df454 .swiper-slide {
    flex: 0 0 90% !important;    /* ancho de la tarjeta */
    max-width: 360px;
    margin: 0 auto !important;   /* centrada */
  }

  /* La propia card */
  body.home .elementor-element-56df454 .card.boxed.parent.simple,
  body.home .elementor-element-56df454 .card.boxed.parent.simple * {
    box-sizing: border-box;
  }

  body.home .elementor-element-56df454 .card.boxed.parent.simple {
    width: 100%;
    padding: 20px 18px;
  }

  /* Texto más legible y con espaciados cómodos */
  body.home .elementor-element-56df454 .card-body-box p {
    font-size: 14px;
    line-height: 1.5;
  }

  /* Estrellas un poco separadas del texto */
  body.home .elementor-element-56df454 .icons-wrapper {
    margin-top: 12px;
  }

  /* Mostrar flechas también en responsive si el tema las oculta */
  body.home .elementor-element-56df454 .swiper-button-prev,
  body.home .elementor-element-56df454 .swiper-button-next {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
  }

  /* Posición de las flechas verticalmente centradas respecto a la card */
  body.home .elementor-element-56df454 .swiper-button-prev,
  body.home .elementor-element-56df454 .swiper-button-next {
    top: 50%;
    transform: translateY(-50%);
  }

  /* Un pelín más cerca de la tarjeta */
  body.home .elementor-element-56df454 .swiper-button-prev {
    left: 8px;
  }

  body.home .elementor-element-56df454 .swiper-button-next {
    right: 8px;
  }
}

/* Móvil pequeño: card aún más ancha para que se vea centrada y bonita */
@media (max-width: 767px) {
  body.home .elementor-element-56df454 .swiper-slide {
    flex: 0 0 94% !important;
    max-width: 380px;
  }
}


/* ===========================
   TESTIMONIOS - RESPONSIVE
   (solo tablet y móvil)
   =========================== */

/* Tablet y móvil hasta 1024px */
@media (max-width: 1024px) {

  /* Limitar el área del carrusel en responsive */
  body.home .elementor-element-56df454 .swiper-container {
    overflow: visible;
  }

  /* Wrapper de las slides */
  body.home .elementor-element-56df454 .swiper-wrapper {
    display: flex;
    align-items: stretch;
  }

  /* Cada slide ocupa prácticamente todo el ancho (1 card por pantalla) */
  body.home .elementor-element-56df454 .swiper-slide {
    flex: 0 0 90% !important;    /* ancho de la tarjeta */
    max-width: 360px;
    margin: 0 auto !important;   /* centrada */
  }

  /* La propia card */
  body.home .elementor-element-56df454 .card.boxed.parent.simple,
  body.home .elementor-element-56df454 .card.boxed.parent.simple * {
    box-sizing: border-box;
  }

  body.home .elementor-element-56df454 .card.boxed.parent.simple {
    width: 100%;
    padding: 20px 18px;
  }

  /* Texto más legible y con espaciados cómodos */
  body.home .elementor-element-56df454 .card-body-box p {
    font-size: 14px;
    line-height: 1.5;
  }

  /* Estrellas un poco separadas del texto */
  body.home .elementor-element-56df454 .icons-wrapper {
    margin-top: 12px;
  }

  /* Mostrar flechas también en responsive si el tema las oculta */
  body.home .elementor-element-56df454 .swiper-button-prev,
  body.home .elementor-element-56df454 .swiper-button-next {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
  }

  /* Posición de las flechas verticalmente centradas respecto a la card */
  body.home .elementor-element-56df454 .swiper-button-prev,
  body.home .elementor-element-56df454 .swiper-button-next {
    top: 50%;
    transform: translateY(-50%);
  }

  /* Un pelín más cerca de la tarjeta */
  body.home .elementor-element-56df454 .swiper-button-prev {
    left: 8px;
  }

  body.home .elementor-element-56df454 .swiper-button-next {
    right: 8px;
  }
}

/* Móvil pequeño: card aún más ancha para que se vea centrada y bonita */
@media (max-width: 767px) {
  body.home .elementor-element-56df454 .swiper-slide {
    flex: 0 0 94% !important;
    max-width: 380px;
  }
}

/* ================================
   RESEÑAS HORIZONTALES - RESPONSIVE
   SOLO TABLET + MÓVIL
   ================================ */

@media (max-width: 1024px) {

  /* Contenedor del carrusel */
  .elementor-element-56df454 .swiper-wrapper {
    display: flex !important;
    flex-direction: row !important;
    gap: 20px;
    overflow-x: auto !important;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    padding-bottom: 20px;
    padding-top: 10px;
  }

  /* Ocultar scrollbar feo */
  .elementor-element-56df454 .swiper-wrapper::-webkit-scrollbar {
    display: none;
  }

  /* Cada reseña como card horizontal */
  .elementor-element-56df454 .swiper-slide {
    flex: 0 0 70% !important;
    max-width: 300px;
    min-width: 260px;
    scroll-snap-align: center;
    margin: 0 !important;
  }

  /* Ajustes del contenido interno */
  .elementor-element-56df454 .card.boxed.parent.simple {
    padding: 18px !important;
    border-radius: 14px;
  }

  .elementor-element-56df454 .card-body-box p {
    font-size: 14px;
    line-height: 1.45;
  }

  /* Flechas fuera en responsive (mejor scroll táctil) */
  .elementor-element-56df454 .swiper-button-prev,
  .elementor-element-56df454 .swiper-button-next {
    display: none !important;
  }
}

/* MÓVIL PEQUEÑO AÚN MÁS HORIZONTAL */
@media (max-width: 767px) {
  .elementor-element-56df454 .swiper-slide {
    flex: 0 0 75% !important;
    max-width: 240px;
  }
}

/* ===========================
   TESTIMONIOS – SOLO RESPONSIVE
   =========================== */

/* Tablet y móvil (ajusta el 991px si quieres otro breakpoint) */
@media (max-width: 991px) {

  /* Hacer que cada slide ocupe todo el ancho disponible */
  body.home .themesasy-testimonial-carousel .swiper-container,
  body.home .themesasy-testimonial-carousel .swiper-wrapper {
    width: 100% !important;
  }

  body.home .themesasy-testimonial-carousel .swiper-slide {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    justify-content: center;
  }

  /* Card centrada y más “tipo tarjeta” */
  body.home .themesasy-testimonial-carousel .card-boxed.parent.simple,
  body.home .themesasy-testimonial-carousel .card {
    max-width: 90%;
    width: 90%;
    margin: 0 auto;
    height: auto;
  }

  /* Texto más cómodo en móvil */
  body.home .themesasy-testimonial-carousel .card .description p,
  body.home .themesasy-testimonial-carousel .card-boxed .card-body-box p {
    font-size: 0.95rem;
    line-height: 1.5;
  }

  /* Estrellas centradas bajo la card */
  body.home .themesasy-testimonial-carousel .icons-wrapper {
    justify-content: center !important;
  }

  /* Mostrar SIEMPRE flechas prev/next en móvil */
  body.home .themesasy-testimonial-carousel .swiper-button-prev,
  body.home .themesasy-testimonial-carousel .swiper-button-next {
    display: flex !important;
    align-items: center;
    justify-content: center;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Traer las flechas un poco hacia dentro para que no queden pegadas al borde */
  body.home .themesasy-testimonial-carousel .swiper-button-prev {
    left: 10px !important;
  }

  body.home .themesasy-testimonial-carousel .swiper-button-next {
    right: 10px !important;
  }
}

/* Ocultar SOLO el texto grande de la tarjeta Moon Journal en móviles */
@media (max-width: 767px) {
    .elementor-element-8850234 .text-intro.style-1 h2.title {
        display: none !important;
    }
}

/* Ocultar el texto del segundo widget SOLO en móviles */
@media (max-width: 767px) {
    .elementor-element-ccbd6a0 .title {
        display: none !important;
    }
}

/* Centrar botones SOLO en móviles */
@media (max-width: 767px) {
    .elementor-element-2d5fda9 .button-wrapper,
    .elementor-element-773b3d4 .button-wrapper {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
}

@media (max-width: 767px) {


    /* --- Centrar el botón PERFECTAMENTE --- */
    .elementor-element-2d5fda9 .button-wrapper,
    .elementor-element-773b3d4 .button-wrapper {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* --- Centrar el texto dentro del botón --- */
    .elementor-element-2d5fda9 .elementor-button,
    .elementor-element-773b3d4 .elementor-button {
        margin: 0 auto !important;
        text-align: center !important;
    }
}

@media (max-width: 767px) {
    .elementor-element-d273789 {
        display: none !important;
    }
}

@media (max-width: 767px) {
    /* Ocultar SOLO el botón de "Popular Categories" en móviles */
    .elementor-element-fc06374 .elementor-widget-button,
    .elementor-element-fc06374 .elementor-widget-themeasy-button,
    .elementor-element-fc06374 .button-wrapper {
        display: none !important;
    }
}