/*!
 * Estilos utilizados en el sitio web de Gëa Especias
 * Octubre de 2023
 *
 * Otros estilos han sido incorporados directamente al
 * maquetador Elementor en el editor CSS del Elemento en
 * la ruta Ajustes - Avanzado - CSS.
 */

/*** Elementos de uso general ***/

html {
    max-width: 1920px;
    margin: 0 auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    background-color: #1d1d1d;
}

body {
    -webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	line-height: unset;
}

ul {
    padding-inline-start: 0px !important;
}

p {
    margin: 0px 0px 10px 0px !important; 
}

::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-thumb {
    background: #DAA520;
    border-width: 1px;
    border-style: solid;
    border-color: #DAA520;
    border-radius: 20px;
}

::-webkit-scrollbar-track {
    background: #101E28;
}

:focus-visible {
    outline: none;
}

a, a:active, a:hover {
    color: #383838;
    font-weight: 500;
}

[type=button], [type=submit], button {
    border: none;        
}    

button:focus, button:hover, button:active, button:focus-visible {
    outline: none;
    background-color: transparent;
    text-decoration: none;    
}

[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover {
	background-color: transparent;
	text-decoration: none;
    outline: 0px auto -webkit-focus-ring-color;	
}

input[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea {
    padding: 0.5rem 1rem;
}

table tbody>tr:nth-child(odd)>td, table tbody>tr:nth-child(odd)>th {
    background-color: hsla(120, 100%, 50%, 0) !important;
}

::-webkit-input-placeholder {
   color: #000;
}

:-moz-placeholder {
   color: #000;
}

::-moz-placeholder {
   color: #000;
}

:-ms-input-placeholder {
   color: #000;
}

.elementor-section .elementor-container {
    width: 100% !important;
}

.elementor-button {
    line-height: 1.4;
}

.elementor-button-icon svg {
    width: 2em;
    height: 1.2em;
}

.elementor-widget-button:active {
    border: 0px solid transparent; 
}

.elementor-column-gap-default > .elementor-column>.elementor-element-populated {
    padding: 0px !important;
}

#boton-metele-sazon:hover {
    font-weight: bold !important;
}

.woocommerce-price-suffix {
    font-size: 12px !important;
}

/*** Popup de galería de producto en Producto Individual ***/

.pswp--open {
    z-index: 99900;
}

/*** Eliminación de animación del hover sobre miniaturas de Blog ***/

.premium-blog-post-container.premium-blog-skin-banner .premium-blog-content-wrapper {
    bottom: 0px !important;
}

/*** Aplicación de border-radius de miniaturas de Productos ***/

.attachment-woocommerce_thumbnail {
    border-radius: 20px !important;
}

/** Estilos personalizados de Preloader Gëa **/
	
#preloader {
    background: #101E28 url(/wp-content/uploads/gea-especias-preloader.gif) no-repeat center center;
    background-size: 200px;
    background-position: 50% 48%;
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
}

@media (max-width: 768px) {
    #preloader {
        background-size: 150px; }
}

/** Estilos personalizados de Menú Navegador **/

.menu {
  display: block;
  background: none;
  position: relative;
  min-width: 50px;
  min-height: 50px;
  padding: 0;
  border: 0;
  border-radius: 100%;
  outline: none;
  cursor: pointer;
  transition: all 250ms;
}

.menu > .bar {
  display: block;
  background: #BEC5BD;
  position: absolute;
  left: 10px;
  width: 70%;
  height: 3px;
  border-radius: 6px;
  transition: all 150ms;
}

.menu > .bar:first-child {
  top: 25%;
  transition-delay: 200ms;
  transform-origin: top right;
}

.menu > .bar:nth-child(2) {
  top: 47%;
  transition-delay: 100ms;
}

.menu > .bar:last-child {
  bottom: 25%;
  transition-delay: 200ms;
  transform-origin: bottom right;
}

.menu.abierto:before {
  -webkit-animation: abierto-cerrado 400ms 300ms forwards ease-in;
          animation: abierto-cerrado 400ms 300ms forwards ease-in;
}

.menu.abierto:active {
  transform: scale(0.85);
}

.menu.abierto > .bar {
  transition-delay: 0ms;
  left: 5px;
  transform: rotate(-44deg);
}

.menu.abierto > .bar:nth-child(2) {
  left: 50px;
  width: 0%;
}

.menu.abierto > .bar:last-child {
  bottom: 22%;
  left: 5px;
  transform: rotate(44deg);
}

.menu.cerrado:before {
  animation: abierto-cerrado 200ms forwards reverse ease-out;
}

@-webkit-keyframes abierto-cerrado {
  0% {
    -webkit-clip-path: polygon(100% 50%, 100% 50%, 100% 50%, 100% 50%, 50% 50%);
            clip-path: polygon(100% 50%, 100% 50%, 100% 50%, 100% 50%, 50% 50%);
  }
  25% {
    -webkit-clip-path: polygon(100% 50%, 100% 0%, 50% 0%, 50% 0%, 50% 0%);
            clip-path: polygon(100% 50%, 100% 0%, 50% 0%, 50% 0%, 50% 0%);
  }
  50% {
    -webkit-clip-path: polygon(100% 50%, 100% 0%, 0% 0%, 0% 50%, 50% 50%);
            clip-path: polygon(100% 50%, 100% 0%, 0% 0%, 0% 50%, 50% 50%);
  }
  75% {
    -webkit-clip-path: polygon(100% 50%, 100% 0%, 0% 0%, 0% 100%, 50% 100%);
            clip-path: polygon(100% 50%, 100% 0%, 0% 0%, 0% 100%, 50% 100%);
  }
  100% {
    -webkit-clip-path: polygon(100% 50%, 100% 0%, 0% 0%, 0% 100%, 100% 100%);
            clip-path: polygon(100% 50%, 100% 0%, 0% 0%, 0% 100%, 100% 100%);
  }
}

.menu-contenedor {
  opacity: 1;
  background-color: transparent;
  mix-blend-mode: difference;  
}

.menu-linea {
  display: inline-flex;
}

.menu-vineta {
  font-size: 20px; 
  padding: 0px 20px 0px 0px;
}

.menu-imagen {
  opacity: 0;
  transition: opacity .5s ease-out;
  -moz-transition: opacity .5s ease-out;
  -webkit-transition: opacity .5s ease-out;
  -o-transition: opacity .5s ease-out;
}

.menu-contenedor:hover + .menu-imagen {
  opacity: 1;
}

/*** Fuente del Sistema ***/	
	
@font-face {
	font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}