/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
.elementor-swiper-button-prev:hover,
.elementor-swiper-button-next:hover {
  transform: scale(1.2)!important;
  filter: brightness(1.5);
	
}

.elementor-swiper-button-prev,
.elementor-swiper-button-next {
  border: none;
  cursor: pointer;
  transform: translateY(1%)!important;
}

/* TODOS LOS PRODUCTOS tabla************************************************/
.pedido-scroll {
  max-height: 600px; /* ajusta según el alto de tus filas */
  overflow-y: auto;
  border: 1px solid #ddd;
  border-radius: 4px;
}

/* FIN TODOS LOS PRODUCTOS tabla************************************************/

/* Efecto: campo se eleva ligeramente al enfocarse */
.elementor-form .elementor-field:focus {
  transform: translateY(-2px);
  outline: none;
  border-color: #6b0504; /* opcional para mayor realce */
}

.elementor-widget-social-icons .elementor-icon {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  will-change: transform;
}

.elementor-widget-social-icons .elementor-icon:hover {
  transform: scale(1.1);
}

.elementor-message-success{
	text-align: end;
	color: white;
}
	
.footer-form .elementor-message-success{
	text-align: end;
	padding-right: 5px;
}
	.elementor-message-danger {
  text-align: center;
}

.footer-form .elementor-message-danger {
  text-align: end;
  padding-right: 20px;
	margin-right: 20px;
}

.elementor-field-textual {
  resize: none;
}

#form-field-text_option_product:disabled {
  background-color: #9f9f9f;
  opacity: 0.6;
  cursor: not-allowed;
}

/* Chrome, Safari, Edge - WebKit */
.tabla-pedido input[type="number"]::-webkit-inner-spin-button,
.tabla-pedido input[type="number"]::-webkit-outer-spin-button,
.elementor input[type="number"]::-webkit-inner-spin-button,
.elementor input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0;
}

/* Firefox */
.tabla-pedido input[type="number"],
.elementor input[type="number"] {
  -moz-appearance: textfield !important;
}


/* ESTILO TABLA PRODUCTO */

/*INPUT OTRO PRODUCTO*/
.tabla-pedido-custom .nombre-manual {
  padding: 0px 2px!important;
  width: 70%!important;
}

.tabla-pedido-custom thead {
  display: none;
}

/* Estilo tabla general */
.tabla-pedido-custom {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Roboto', sans-serif;
  border-radius: 12px;
  overflow: hidden;
  background: white;
}

.tabla-pedido-custom th,
.tabla-pedido-custom td {
  padding: 9px;
    border-bottom: 1px solid #e0e0e0;
    vertical-align: middle;
	border-style: none;
}

/* Nombre del producto */
.tabla-pedido-custom .producto-nombre {
  color: #333;
  font-weight: 300;
}

/* Celda de categoría si se usa */
.tabla-pedido-custom .producto-categoria {
  color: #777;
}

/* Contenido centrado en celdas de cantidad */
.tabla-pedido-custom .producto-cantidad {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
}

/* Estilo input de cantidad */
.tabla-pedido-custom .producto-cantidad input[type="number"] {
  width: 40px;
  height: 30px;
  text-align: center;
  padding: 5px;
  border: 1px solid #ccc;
  border-radius: 2px;
  appearance: textfield;
  font-family: 'Roboto', sans-serif;
  font-size: 13px;
}

/* Botones + y - */
.tabla-pedido-custom .pedido-mas,
.tabla-pedido-custom .pedido-menos {
  background-color: #2B61A4;
  color: white;
  border: none;
  border-radius: 2px;
  width: 20px;
  height: 30px;
  font-size: 16px;
  cursor: pointer;
  transition: background 0.2s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.tabla-pedido-custom .pedido-mas:hover,
.tabla-pedido-custom .pedido-menos:hover {
  background-color: #1f4c8a;
}

/* Ocultar spinners */
.tabla-pedido-custom input[type="number"]::-webkit-inner-spin-button,
.tabla-pedido-custom input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0;
}
.tabla-pedido-custom input[type="number"] {
  -moz-appearance: textfield !important;
}

/* Estilo contenedor */
.pedido-bloque {
  margin-bottom: 20px;
  border-radius: 12px;
  overflow: hidden;
}

.pedido-header {
  background-color: #3369b7;
  color: white;
  padding: 15px 20px;
  font-weight: bold;
  font-size: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 12px;
  height: 6rem;
}

.pedido-titulo {
  margin: 0;
  font-weight: 700;
	
}

.pedido-toggle {
  background: white;
  color: #3369b7;
  font-weight: bold;
  font-size: 18px;
  border: none;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: transform 0.2s ease;
}

.pedido-toggle:hover {
  transform: scale(1.1);
}

/* Scroll vertical */
.pedido-scroll {
  max-height: 590px !important;
  overflow-y: auto;
  border-style: none!important;
  border-radius: 0px!important;
}



.pedido-scroll::-webkit-scrollbar {
  width: 8px; /* ancho vertical */
  height: 8px; /* alto horizontal (si aplica) */
}

.pedido-scroll::-webkit-scrollbar-track {
  background: #f1f1f1; /* color del fondo */
  border-radius: 10px;
}

.pedido-scroll::-webkit-scrollbar-thumb {
  background: #2B61A4; /* color de la barra */
  border-radius: 10px;
}

.pedido-scroll::-webkit-scrollbar-thumb:hover {
  background: #1f4c85; /* color al hacer hover */
}
.tabla-pedido-custom .producto-cantidad {
    display: flex
;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    border-style: none;
}

table td, table th {
    border-style: none;

}
#ver-detalles-pedido .elementor-button {
  cursor: pointer;
}

.elementor-message-success {
    text-align: end;
    color: #000000;
}

/* estilo horizontal menu 1 desktop*/
#menu-2-6b73041 {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 40px; 
  list-style: none;

}
#menu-2-6b73041 a {
  text-decoration: none;
}

#menu-2-6b73041 a::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  width: 100%;
  background:#2B3D8A;
  opacity: 0;
  transition: opacity 0.3s ease;
}

#menu-2-6b73041 a:hover::after {
  opacity: 1;
}

.elementor-53 .elementor-element.elementor-element-6b73041 #menu-2-6b73041 a {
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
  margin-top: 15px;
  margin-bottom: 15px;
}
.elementor-form-fields-wrapper.elementor-labels- .elementor-field-textual.elementor-size-xs {
  border-radius: 2px;
  font-size: 13px;
  min-height: 33px;
  padding: 1px 0px;
}
/* SIN padding cuando solo se ve el placeholder */
.elementor-form-fields-wrapper.elementor-labels- .elementor-field-textual.elementor-size-xs:placeholder-shown {
  padding: 4px 0; /* solo padding vertical */
}

/* CON padding al escribir (cuando ya no se muestra el placeholder) */
.elementor-form-fields-wrapper.elementor-labels- .elementor-field-textual.elementor-size-xs:not(:placeholder-shown) {
  padding: 4px 12px;
}



/* POP-UP-DETALLES PEDIDO*/
/* === POPUP === */
.popup-detalles {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}
#popup-detalles h1,
#popup-detalles h2,
#popup-detalles h3,
#popup-detalles h4 {
  font-size: 1.3rem !important;
  font-family: 'Roboto';
}

.popup-contenido {
  background: #fff;
  padding: 20px;
  max-width: 600px;
  width: 90%;
  border-radius: 8px;
  position: relative;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

.cerrar-popup {
  position: absolute;
  top: 10px;
  right: 15px;
  background: none;
  border: none;
  font-size: 20px;
  cursor: pointer;
}

.contenedor-detalles-pedido {
  max-height: 400px;
  overflow-y: auto;
}

/* === TABLA === */
.tabla-pedido-resumen {
  width: 100%;
  border-collapse: collapse;
  font-family: Roboto, sans-serif;
}

.tabla-pedido-resumen thead {
  background: #2B3D8A;
  color: white;
}

.tabla-pedido-resumen th,
.tabla-pedido-resumen td {
  padding: 10px;
  border: 1px solid #ddd;
  text-align: left;
}

.tabla-pedido-resumen td:nth-child(2) {
  text-align: center;
}
#popup-detalles button.cerrar-popup:hover {
  background-color: white !important;
}


.feature-image:hover {
  
  transform: translateY(-10px); /* Eleva el elemento */
}
/* Solo aplica a <form name="form-pedido"> */
form[name="form-pedido"] input:-webkit-autofill,
form[name="form-pedido"] textarea:-webkit-autofill {
  -webkit-text-fill-color: #110806 !important;
  transition: background-color 9999s ease-in-out 0s !important;
  box-shadow: 0 0 0 1000px #E8F0FE inset !important;
}

form[name="form-pedido"] input:focus,
form[name="form-pedido"] textarea:focus {
  background-color: #E8F0FE !important;
  outline: none !important;
}

form[name="form-pedido"] input:not(:placeholder-shown),
form[name="form-pedido"] textarea:not(:placeholder-shown) {
  background-color: #E8F0FE !important;
}

/* Solo subrayado en el item activo */
.menu-footer-movil .elementor-nav-menu .elementor-item.elementor-item-active {
  text-decoration: underline;
  text-underline-offset: 4px;   /* separación entre texto y línea */
  text-decoration-thickness: 2px; /* grosor de la línea */
  text-decoration-color: #4a90e2; /* color de la línea */
}


/* Al hacer hover o si el enlace está activo */
.menu-footer-movil .elementor-nav-menu .elementor-item:hover::after,
.menu-footer-movil .elementor-nav-menu .elementor-item.elementor-item-active::after,
.menu-footer-movil .elementor-nav-menu .current-menu-item > .elementor-item::after,
.menu-footer-movil .elementor-nav-menu .current_page_item > .elementor-item::after {
  opacity: 1;
}

.elementor-element-23d4d233 .elementor-icon {
  width: 20px!important;
  
}
/* Estilo para el botón activo SÓLO en esta galería */
.galeria-productos .e-n-tab-title[aria-selected="true"] {
  font-weight: 900!important;

}

.iconos-header .elementor-social-icon svg{
    width: 20px !important;
  height: 20px !important;
}




/* TITULOS PAGINAS PRODUCTOS*/
@media (max-width: 768px) {
	.tabla-pedido-custom .nombre-manual {
  padding: 0px 2px!important;
  width: 100%!important;
}
	


	/* Galeria adaptada e imágenes*/
	/* Anula el modo acordeón en móviles */

	.galeria-productos.e-n-tabs-mobile .e-n-tabs {
    display: flex !important;
    flex-direction: column !important;
  }

  .galeria-productos.e-n-tabs-mobile .e-n-tabs-heading {
    order: 0 !important; 
    display: flex !important;
    flex-wrap: wrap;
	 align-content: center;
  }

  .galeria-productos.e-n-tabs-mobile .e-n-tabs-content {
    order: 1 !important; 
  }

  .galeria-productos.e-n-tabs-mobile .e-n-tab-title {
    display: inline-flex !important;
    width: auto !important;
  }
	
	.galeria-productos .gallery {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0 20px !important;
    margin: 0 !important;
    padding: 20px !important;
    
  }

  .galeria-productos .gallery-item {
    margin: 0 !important;
    padding: 0 !important;
  }

  .galeria-productos .gallery .gallery-icon {
    margin: 0 !important;
    padding: 0 !important;
  }

  .galeria-productos .gallery .gallery-icon img {
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain;
  }
 
	h3.pedido-titulo {
  font-size: 1rem !important;
}

	.pedido-header{
		height: 4rem;
	}
	
	/*ESTILO TABLA PRODUCTOS MOVIL*/
	/* Estilos generales para la tabla */
.tabla-pedido-custom {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed; /* Fija el ancho de las columnas */
}

/* Columnas con ancho igual */
.tabla-pedido-custom th,
.tabla-pedido-custom td {
    width: 50%;
    padding: 8px;
    box-sizing: border-box;
}

/* Asegura que las filas tengan el mismo alto */
.tabla-pedido-custom tbody tr {
    display: flex;
}

.tabla-pedido-custom tbody td {
    display: flex;
    align-items: center; /* Centra verticalmente el contenido */
    min-height: 100%; /* Asegura que ocupe todo el alto */
}

/* Contenedor de cantidad - alineación horizontal */
.producto-cantidad {
    display: flex;
    justify-content: center; /* Centra horizontalmente */
    align-items: center; /* Centra verticalmente */
    gap: 5px; /* Espacio entre elementos */
}

/* Estilo para los botones */
.pedido-menos, 
.pedido-mas {
    padding: 8px 12px;
    font-size: 16px;
    flex-shrink: 0; /* Evita que se encojan */
}

/* Estilo para el input */
.producto-cantidad input {
    width: 50px; /* Ancho fijo para el input */
    text-align: center;
    padding: 5px;
}

/* Ajustes para móvil */
 .tabla-pedido-custom tbody tr {
        flex-direction: row; /* Asegura disposición horizontal */
    }
    
    .producto-nombre {
        display: flex;
        align-items: center; /* Centra el texto verticalmente */
    }
	
	
.elementor-130 .elementor-element.elementor-element-7bd9c5c .elementor-nav-menu--dropdown a.elementor-item-active {
    color: #fff!important;
}
		.elementor-swiper-button-next {
    display: none !important;
  }
	.elementor-swiper-button-prev {
    display: none !important;
  }
}

.elementor-widget-theme-post-excerpt {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/*viñetas solo en elementos con la clase lista-vinietas*/
/* Quita viñetas normales y márgenes/paddings */
.lista-vinietas ul {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.lista-vinietas ul li {
  display: flex !important;
  align-items: center !important;
  margin-bottom: 8px !important;
  position: relative !important;
  padding-left: 32px !important; /* espacio para el ícono */
}

/* Inserta el SVG como viñeta */
.lista-vinietas ul li::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 24px !important;
  height: 24px !important;
  background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="24" height="24" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12ZM15.7071 9.29289C16.0976 9.68342 16.0976 10.3166 15.7071 10.7071L12.0243 14.3899C11.4586 14.9556 10.5414 14.9556 9.97568 14.3899L8.29289 12.7071C7.90237 12.3166 7.90237 11.6834 8.29289 11.2929C8.68342 10.9024 9.31658 10.9024 9.70711 11.2929L11 12.5858L14.2929 9.29289C14.6834 8.90237 15.3166 8.90237 15.7071 9.29289Z" fill="%232B3D8A"/></svg>') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}

* {
  outline: 0px solid red !important;
}


html, body {
  overscroll-behavior: none;
}