/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.4.1759875298
Updated: 2025-10-07 17:14:58

*/

.footer-icon-list ul li{
	min-height:60px;
	background-color: #3E3E3E;
	padding:10px;
	border-radius:28px;
	overflow:hidden;
	position: relative
}
.footer-icon-list ul li::before{
	content:" ";
	width:68px;
	height:68px;
	position:absolute;
	background-color:#F9CF00;
	top:0;
	left:-10px;
}

.footer-icon-list ul li span{
	margin:0 !important;
	padding-left:15px
}
form,
div.car-filter,
div.car-filter .elementor-shortcode .yith-wcan-filters,
.filters-container{
	background-color:#343434 !important;
	border-radius:10px;
}

div.car-filter .filters-container{
	background-color:#343434 !important;
	padding:10px;

}

div.car-filter .filters-container .yith-wcan-filter h4{
	font-size:14px;
	font-weight:bolder;
	color:#fff;
	text-transform:capitalize;
} 

div.car-filter .filters-container .yith-wcan-filter li a{
	color:#fff !important;
}
div.car-filter .filters-container .yith-wcan-filter li input{
	border-color:#F9CF00;
}

.product-information-drl ul  li::marker{
	color:#F9CF00;
	
}

.yith-wcan-filters .irs{
	position: relative;
}

.yith-wcan-filters .irs .irs .irs-from{
	left:0 !important;
	background-color:transparent;
}
.yith-wcan-filters .irs .irs .irs-to{
	right: 0 !important;
	background-color:transparent;
}

/*Boton de contacto interna producto*/

#wp-drc-contact.wp-drc-contact a{
	color:#1A1A1A;
	background-color:#F9CF00;
	font-size:18px;
	padding:8px 12px;
	font-weight:900;
	border-radius:25px
}

/* === Variables del skin (puedes ajustar colores aquí) === */
.dc-filters{
  --dc-bg: #1e1e1e;        /* fondo panel */
  --dc-card:#2a2a2a;       /* fondo listas/inputs */
  --dc-line:#343434;       /* líneas/bordes */
  --dc-text:#f2f2f2;       /* texto principal */
  --dc-muted:#a7a7a7;      /* texto secundario */
  --dc-accent:#ffd000;     /* amarillo */
  --dc-radius:12px;
  --dc-gap:14px;
  color:var(--dc-text);
}

/* Panel general */
.dc-filters .yith-wcan-filters,
.dc-filters .yith-wcan-container,
.dc-filters .widget{
  background:var(--dc-bg);
  border:1px solid var(--dc-line);
  border-radius:var(--dc-radius);
  padding:18px 16px;
}

/* Títulos */
.dc-filters .widget-title,
.dc-filters .yith-wcan-title{
  color:var(--dc-text);
  font-weight:800;
  letter-spacing:.3px;
  margin:6px 0 14px;
  text-transform:uppercase;
}

/* Subtítulos de grupo (Marca, Línea, etc.) */
.dc-filters .yith-wcan-group .yith-wcan-title,
.dc-filters .yith-wcan-box .yith-wcan-title{
  font-weight:700;
  margin:18px 0 10px;
}

/* ---- Buscador dentro del filtro (si tu filtro lo trae) ---- */
.dc-filters input[type="search"],
.dc-filters .yith-wcan-search input{
  width:100%;
  background:var(--dc-card);
  border:1px solid var(--dc-line);
  border-radius:8px;
  color:var(--dc-text);
  padding:10px 40px 10px 12px;
  outline:none;
}
.dc-filters input[type="search"]::placeholder{ color:var(--dc-muted); }
/* Icono lupa (SVG embebido) */
.dc-filters .yith-wcan-search{ position:relative; }
.dc-filters .yith-wcan-search::after{
  content:"";
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  width:18px; height:18px;
  background: no-repeat center / contain
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23a7a7a7' d='M10 2a8 8 0 105.293 14.293l4.707 4.707 1.414-1.414-4.707-4.707A8 8 0 0010 2zm0 2a6 6 0 110 12A6 6 0 0110 4z'/></svg>");
}

/* ---- Listas de términos (checkbox look + contador derecha) ---- */
.dc-filters .yith-wcan-content{
  background:var(--dc-card);
  border:1px solid var(--dc-line);
  border-radius:8px;
  padding:6px;
}
.dc-filters .yith-wcan-list{
  list-style:none;
  margin:0; padding:0;
  max-height:260px; overflow:auto;
}
/* Scrollbar discreto */
.dc-filters .yith-wcan-list::-webkit-scrollbar{ width:8px }
.dc-filters .yith-wcan-list::-webkit-scrollbar-thumb{
  background:#3a3a3a; border-radius:999px;
}
.yith-wcan-filters .yith-wcan-filter .filter-items .filter-item>label>a:hover {
	color:var(--dc-accent) !important;
}
/* Item base */
.dc-filters .yith-wcan-list li a,
.dc-filters .yith-wcan-list li span{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px;
  position:relative;
  padding:10px 26px 10px 28px;
  color:var(--dc-accent); text-decoration:none;
  border-radius:8px;
}
/* "Checkbox" visual a la izquierda */
.dc-filters .yith-wcan-list li a::before{
  content:""; position:absolute; left:8px; top:50%; transform:translateY(-50%);
  width:16px; height:16px; border-radius:3px;
  border:2px solid var(--dc-line); background:var(--dc-bg);
}
/* Contador a la derecha */
.dc-filters .yith-wcan-list .count,
.dc-filters .yith-wcan-list .yith-wcan-term-count{
  color:var(--dc-muted); font-variant-numeric: tabular-nums;
}

/* Hover */
.dc-filters .yith-wcan-list li:hover a{
  background:#242424;
}

/* Activo/seleccionado (cubrimos varias clases usadas por YITH) */
.dc-filters .yith-wcan-list li.selected > a,
.dc-filters .yith-wcan-list li.chosen > a,
.dc-filters .yith-wcan-list li.active > a,
.dc-filters .yith-wcan-list li[aria-checked="true"] > a{
  background:#1b1b1b;
  outline:1px solid var(--dc-line);
	color:var(--dc-accent)
}
/* Checkbox lleno */
.dc-filters .yith-wcan-list li.selected > a::before,
.dc-filters .yith-wcan-list li.chosen  > a::before,
.dc-filters .yith-wcan-list li.active   > a::before,
.dc-filters .yith-wcan-list li[aria-checked="true"] > a::before{
  background:var(--dc-accent);
  border-color:var(--dc-accent);
  box-shadow: inset 0 0 0 3px #1b1b1b;
}
/* Flecha amarilla (> ) a la derecha para el activo (como tu captura) */
.dc-filters .yith-wcan-list li.selected > a::after,
.dc-filters .yith-wcan-list li.chosen  > a::after{
  content:""; position:absolute; right:8px; top:50%; transform:translateY(-50%) rotate(45deg);
  width:10px; height:10px; border-top:2px solid var(--dc-accent); border-right:2px solid var(--dc-accent);
}

/* ---- Botón "Mostrar más" / toggles ---- */
.dc-filters .yith-wcan-toggle,
.dc-filters .yith-wcan-show-more{
  display:inline-flex; align-items:center; gap:6px;
  color:var(--dc-text); cursor:pointer; margin:6px 2px 10px;
}
.dc-filters .yith-wcan-toggle:hover,
.dc-filters .yith-wcan-show-more:hover{ color:var(--dc-accent); }
.dc-filters .yith-wcan-toggle::after,
.dc-filters .yith-wcan-show-more::after{
  content:""; width:8px; height:8px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); margin-top:2px;
}

/* ---- Sliders (precio, modelo/año) - jQuery UI ---- */
.dc-filters .ui-slider{ position:relative; height:6px; background:var(--dc-line); border-radius:999px; margin:12px 6px 8px; }
.dc-filters .ui-slider .ui-slider-range{ background:var(--dc-accent); border-radius:999px; }
.dc-filters .ui-slider .ui-slider-handle{
  top:-6px; width:18px; height:18px;
  background:var(--dc-accent); border:2px solid #222; border-radius:50%;
  cursor:pointer;
}
.dc-filters .price_label,
.dc-filters .yith-wcan-range-label,
.dc-filters .yith-wcan-price-input,
.dc-filters .yith-wcan-price-wrapper{
  display:flex; justify-content:space-between; gap:10px;
  color:var(--dc-muted); font-weight:600; margin-top:4px;
}

/* Espaciados entre grupos */
.dc-filters .yith-wcan-group,
.dc-filters .yith-wcan-box{ margin-bottom:var(--dc-gap); }

/* Asegurar que enlaces deshabilitados/0 resultados se vean apagados */
.dc-filters .yith-wcan-list li.yith-wcan-disabled a{
  opacity:.45; cursor:not-allowed;
}
/* === Forzar textos/labels en blanco en la sidebar de filtros === */
.dc-filters{ --dc-text:#fff; } /* si usas mis variables, sube el base a blanco */

/* Títulos de grupo y widgets */
.dc-filters .widget-title,
.dc-filters .yith-wcan-title{ color:#fff !important; }

/* Items de listas (nombres de marca/línea, etc.) */
.dc-filters .yith-wcan-list li a,
.dc-filters .yith-wcan-list li span,
.dc-filters .yith-wcan-term,
.dc-filters .yith-wcan-term-name{ color:#fff !important; }

/* Labels debajo/encima de sliders (precio, modelo/año) */
.dc-filters .price_label,
.dc-filters .yith-wcan-range-label,
.dc-filters .yith-wcan-price-wrapper,
.dc-filters .yith-wcan-price-input label{ color:#fff !important; }

/* Placeholders y textos de inputs/buscador dentro del panel */
.dc-filters input,
.dc-filters input::placeholder{ color:#fff !important; }

/* Contadores a la derecha: mantenlos gris claro para contraste */
.dc-filters .yith-wcan-list .count,
.dc-filters .yith-wcan-list .yith-wcan-term-count{ color:#bdbdbd !important; }

/* Si YITH marca algunos elementos como "disabled" y por eso se ven opacos,
   quita la opacidad para que el texto siga siendo legible en blanco: */
.dc-filters .yith-wcan-list li.yith-wcan-disabled a,
.dc-filters .yith-wcan-list li.yith-wcan-disabled span{
  opacity:1 !important; color:#eaeaea !important;
}

/* Ordenar por: etiqueta y select en blanco para el header de la grilla */
.woocommerce-ordering label{ color:#fff !important; }
.woocommerce-ordering select{
  color:#fff; background:#2a2a2a; border:1px solid #3a3a3a;
}
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters,
#produc-order-drl .yith-wcan-filters,
#produc-order-drl .yith-wcan-filters .filters-container ,
#produc-order-drl .yith-wcan-filters .filters-container form{
	background: transparent !important;
	margin:0 !important;
}
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters button.yith-wcan-reset-filters,
#produc-order-drl .yith-wcan-filters .filters-container h4.filter-title,
#produc-order-drl .yith-wcan-filters .filters-container .yith-wcan-reset-filters,
#produc-order-drl .yith-wcan-filters .filters-container .filter-content .filter-content-footer a{
	font-family: "Montserrat", Sans-serif;
	font-weight:bolder;
	text-transform: uppercase;
	background-color: #F9CF00;
	border:none;
	border-radius:25px;
	color:#1A1A1A;
	font-size:16px;
}
#produc-order-drl .yith-wcan-filters .filters-container .filter-content{
	background-color: #343434 !important;
	border:none;
	box-shadow:none;
}
#produc-order-drl .yith-wcan-filters .filters-container .filter-content .dropdown-wrapper ul li a{
	color:#AAAAAA;
}
#produc-order-drl .yith-wcan-filters .filters-container .filter-content .dropdown-wrapper ul li a:hover{
	color:#fff;
}
#produc-order-drl .yith-wcan-filters .filters-container .filter-content .filter-content-footer{
	background-color:#343434 !important;
}
#produc-filter-drl #total-de-vehiculos *{
	color :#fff;
}
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters .filters-container{
	padding:10px
}
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters .filters-container h4.filter-title
{
	color:#FFFFFF;
	font-family: "Montserrat", Sans-serif;
	font-weight:bolder;
	text-transform: capitalize;
	font-size:14px;
	padding:5px;
}
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters .filters-container h4.filter-title:hover{
	background:#2B2B2B;
}
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters .filters-container .filter-content ul li a{
	color:#AAAAAA;
}
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters .filters-container .filter-content ul li label:hover,
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters .filters-container .filter-content ul li label:hover *{
	color:#fff;
}
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters .filters-container .filter-content .irs-handle,
#produc-filter-drl .elementor-widget-yith_wcan_filters .yith-wcan-filters .filters-container .filter-content .irs-bar{
	background-color:#F9CF00;
	border-color:#F9CF00;
}
/* ===== PDP: galería encima del carrusel en móviles ===== */
@media (max-width: 720px){

  /* 1) El contenedor de la galería/carrusel a columna */
  .single-product .woocommerce-product-gallery,
  .single-product div.product div.images{
    display: flex;
    flex-direction: column;      /* apila */
    gap: 10px;
    width: 100%;
  }

  /* 2) Imagen/visor principal arriba */
  .single-product .woocommerce-product-gallery .flex-viewport,
  .single-product .woocommerce-product-gallery__wrapper,
  .single-product div.product div.images figure{
    order: 0;                    /* primero */
    width: 100% !important;
  }

  /* 3) Thumbnails debajo, en fila horizontal con scroll */
  .single-product .woocommerce-product-gallery ol.flex-control-thumbs,
  .single-product div.product div.images .thumbnails{
    order: 1;                    /* segundo */
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    margin: 0;
    padding: 4px 0;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
  }

  .single-product .woocommerce-product-gallery ol.flex-control-thumbs li,
  .single-product div.product div.images .thumbnails a{
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  .single-product .woocommerce-product-gallery ol.flex-control-thumbs img,
  .single-product div.product div.images .thumbnails img{
    width: 92px;                 /* ajusta a gusto */
    height: auto;
    border-radius: 8px;
  }
}
/* ========== PDP: arreglar thumbs horizontales que solo muestran 1 ========== */
/* ====== PDP móvil: FIX slider + thumbs horizontales + flechas ====== */
@media (max-width: 720px){

  /* --- Layout: galería arriba, thumbs abajo --- */
  .single-product .woocommerce-product-gallery{
    display:flex !important;
    flex-direction:column !important;
    gap:10px;
  }

  /* Viewport del slider principal: que tenga altura y no colapse */
  .single-product .woocommerce-product-gallery .flex-viewport{
    order:0;
    height:auto !important;       /* evita height:0 */
    max-height:none !important;
    overflow:hidden !important;   /* Flexslider lo necesita */
  }

  /* Wrapper y slides: no forzar flex ni widths extra */
  .single-product .woocommerce-product-gallery__wrapper{
    order:0;
    display:block !important;     /* NO flex aquí */
    width:100% !important;
  }
  /* Oculta las no activas; muestra solo la activa (Flexslider usa esta clase) */
  .single-product .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image{
    display:none !important;
    float:none !important;
    width:100% !important;
  }
  .single-product .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image.flex-active-slide{
    display:block !important;
  }
  .single-product .woocommerce-product-gallery__image img{
    width:100% !important;
    height:auto !important;
    display:block !important;
    /* Importante: NO forzar opacity/visibility aquí para no romper el cambio de slide */
  }

  /* --- Thumbs en fila horizontal con scroll suave --- */
  .single-product .woocommerce-product-gallery ol.flex-control-thumbs,
  .single-product div.product div.images .thumbnails{
    order:1;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    gap:8px;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    margin:0 !important;
    padding:4px 0 !important;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }
  .single-product .woocommerce-product-gallery ol.flex-control-thumbs li,
  .single-product div.product div.images .thumbnails > *{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:92px;
    height:auto !important;
    float:none !important;
    display:inline-flex !important;
    scroll-snap-align:start;
  }
  .single-product .woocommerce-product-gallery ol.flex-control-thumbs img,
  .single-product div.product div.images .thumbnails img{
    width:92px !important;
    height:68px !important;
    object-fit:cover;
    border-radius:8px;
    display:block;
  }

  /* --- Flechas del slider principal (izq/der sobre la imagen) --- */
  .single-product .woocommerce-product-gallery .flex-direction-nav a{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:5;
    width:34px; height:34px;
    border-radius:50%;
    background:rgba(0,0,0,.45);
    text-indent:-9999px;          /* oculta texto */
  }
  .single-product .woocommerce-product-gallery .flex-direction-nav .flex-prev{ left:8px; }
  .single-product .woocommerce-product-gallery .flex-direction-nav .flex-next{ right:8px; }

  /* Si tu tema usa icon fonts para las flechas, muestra los pseudo-elementos */
  .single-product .woocommerce-product-gallery .flex-direction-nav .flex-prev:before,
  .single-product .woocommerce-product-gallery .flex-direction-nav .flex-next:before{
    content:"";
    position:absolute; inset:0; margin:auto;
    width:10px; height:10px;
    border-top:2px solid #ffd000; border-right:2px solid #ffd000;
  }
  .single-product .woocommerce-product-gallery .flex-direction-nav .flex-prev:before{ transform:rotate(-135deg); }
  .single-product .woocommerce-product-gallery .flex-direction-nav .flex-next:before{ transform:rotate(45deg); }
}



@media (max-width: 720px){
  /* Swiper thumbs */
  .single-product .swiper-thumbs .swiper-wrapper{ flex-direction: row !important; }

  /* Slick vertical → horizontal */
  .single-product .slick-vertical .slick-track{ display: flex !important; flex-direction: row !important; }
  .single-product .slick-vertical .slick-slide{ height: auto !important; }
}

@media (max-width: 720px){
  .single-product div.product div.images{ width:100% !important; max-width:100% !important; overflow:visible !important; }
}

