/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 24 2026 | 11:59:09 */
/* Solo en la página Tienda */
body.woocommerce-shop #tm-sidebar{
  order: -1; /* izquierda en desktop */
}


/* MEGA MENU */

.tm-element-woo-add-to-cart :has(> .quantity) {
    display: flex;
    flex-wrap: wrap;
}

.uk-iconnav>* {
    padding: 10px;
}

.uk-margin-xsmall-right {
	margin-right: 0px !important;
}


nav.uk-navbar > .uk-navbar-center > .uk-navbar-nav {
    display: none !important;
}

/* Círculo */
.woocommerce-product-gallery__trigger::before {
    content: "";
    display: block;
    width: 15px;              /* tamaño del círculo */
    height: 15px;
    border: 2px solid #d5448f; /* borde rosa */
    border-radius: 50%;
    position: absolute;
    top: 40%;
    left: 42%;
    transform: translate(-50%, -50%); /* centrado perfecto */
    box-sizing: border-box;
}

/* Palo de la lupa */
.woocommerce-product-gallery__trigger::after {
    content: "";
    position: absolute;
    width: 12px;   /* largo del palo */
    height: 2px;   /* grosor del palo */
    background: #d5448f;
    top: 65%;      /* ajusta verticalmente */
    left: 65%;     /* ajusta horizontalmente */
    transform: rotate(45deg) translate(-50%, -50%);
    transform-origin: left center;
}

/* Ocultar el icono original del tema */
.woocommerce-product-gallery__trigger span {
    display: none;
}


/* Asegurar layout horizontal limpio */
#mega-menu-wrap-navbar .mega-menu {
    display: flex !important;
    align-items: center;
}

/* Separación REAL entre items principales */
#mega-menu-wrap-navbar .mega-menu > li.mega-menu-item {
    margin: 0 18px !important;
}

/* Evitar que el primer y último queden raros */
#mega-menu-wrap-navbar .mega-menu > li.mega-menu-item:first-child {
    margin-left: 0 !important;
}

#mega-menu-wrap-navbar .mega-menu > li.mega-menu-item:last-child {
    margin-right: 0 !important;
}



#mega-menu-wrap-navbar #mega-menu-navbar > li.mega-menu-item > a.mega-menu-link {
    height: 100%;
    padding: 0 0;
    color: #d5448f;
    transition: .1s ease-in-out;
    transition-property: color, background-color, border-color, box-shadow;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
}


/*  MENSAJE DE AÑADIDO AL CARRO  */


.woocommerce-error, .woocommerce-info, .woocommerce-message {
    margin: 0 auto;
    list-style: none;
    position: fixed;
    top: 10vh;
    right: 13vw;
    margin-bottom: 20px;
    padding: 15px 29px 15px 15px;
    background: #fff;
    color: #000;
    border: 1px solid #e5e5e7;
    width: auto;
    border-radius: 5px;
	text-align:center;
	z-index: 1000;
}

.woocommerce-message{
	background: #D5448F;
	color: white;
	text-align:center;
}

.woocommerce-message>.button, .woocommerce-message>input[type=submit] a{
	padding: 10px;
	font-size: 16px;
    line-height: 1.625;
    background: white;
    color: #D5448F;
    border-radius: 0;
    text-decoration: none;
}

.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.woocommerce-oculto {
  opacity: 0;
  transform: translateY(-10px);
  pointer-events: none;
}


/* =======================================================
   1) BOTONES Y ESTILOS GENERALES DE WOOCOMMERCE
======================================================= */

/* Tamaño de letra de los productos */

.wp-block-post-title{
    font-size: 16px !important; 
}

/* Precio rebajado */
ins {
    background: none !important;
    color: #D5448F !important;

}

/* MIS PEDIDOS */


a.woocommerce-button.view:hover {
    color: #d5448f !important;
}


div.wp-block-button a.product_type_variable {
    background-color: rgba(213, 68, 143, .1) !important;
    color: rgba(213, 68, 143, .7) !important;
    border-color: transparent !important;
    padding: 5px 15px !important;
}

a.wc-block-components-product-button__button.add_to_cart_button:hover{
    background-color: white;
    border: 1px solid #d5448f30;
    text-decoration: none;
    color: rgba(213, 68, 143, .7);
    padding: 5px 15px;
}


ul.products > * > .added_to_cart {
    color: white !important;
}

ul.products > * > .added_to_cart:hover {
    color: #d5448f !important;
}

ul.tabs li.active a {
    color: #d5448f !important;
    font-weight: bold;
}

ul.tabs li a {
    color: #d5448f80 !important;
    font-weight: light;
}

.single_add_to_cart_button {
    color: white !important;
}
.single_add_to_cart_button:hover {
    color: #d5448f !important;
}
.ir-tienda a{
    background: #d5448f;
    color: white !important;
    padding: 5px 15px;
}

.añadir-carro button{
    background: #d5448f;
    padding: 5px 15px;
}

.añadir-carro button:hover{
    background: white;
    color: #d5448f;
    border: 1px solid #d5448f30 !important;
    padding: 5px 15px;
}

.woocommerce .button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
    background-color: #d5448f;
    color:white;
}

.add_to_cart_button{
    padding: 0px;
    line-height: 35px;
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    text-align: center !important;
    justify-content: center !important;
}

.woocommerce-Button,
.edit{
	color: white !important;
}

.view{
	color: white !important;
}

.pay {
    color: white !important;
}

.onsale{
    background: #D5448F !important;
	color: white;
    border-radius: 5px;
}

.wc-block-components-product-sale-badge{
	background: #D5448F !important;
	color: white;
    border-radius: 5px;
    border: none;
}

.woocommerce-Price-amount {
	background: none !important;
}

/* Botones checkout */
.finalizarcompra {
	color: rgba(213, 68, 143, .7);
    background: rgba(213, 68, 143, .1);
    border-radius: 100px;
}

.realizarpedido button{
	color: rgba(213, 68, 143, .7);
    background: rgba(213, 68, 143, .1);
    border-radius: 100px;
    border: none;
}

.wc-proceed-to-checkout .checkout-button {
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 12px;
    font-size: 14px !important;
    margin-top: 20px;
    color: white !important;
}


/* =======================================================
   2) GRID DE PRODUCTOS / TARJETAS
======================================================= */

.wc-block-product {
	flex: 0 0 300px;
    max-width: 300px;
}

.wc-block-product .wp-block-woocommerce-product-button {
  margin-top: 0px;
}

.woocommerce-LoopProduct-link .woocommerce-loop-product__link img{
	object-fit: cover;
	width: 50px !important;
	height: 50px !important;
}

ul.products.columns-6 {
    display: flex;
    flex-wrap: wrap;
    gap: 15px; /* espacio entre productos */
}

ul.products.columns-6 li.product {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: calc(100% / 6 - 15px); /* 6 columnas con gap */
    box-sizing: border-box;
    min-height: 400px; /* altura mínima igual para todos */
}

ul.products.columns-6 li.product img {
    width: 100%;
    height: auto; /* mantiene proporción */
    max-height: 250px; /* limita altura de imagen */
    object-fit: contain; /* o cover si quieres recorte */
    display: block;
}


/* Contenedor de cada producto */
.related-products,
.wc-block-components-product-image {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin: 0 auto;     /* centra en el grid */
  flex-shrink: 0;     /* que no se encoja */
}

/* Imagen dentro del contenedor */
.related-products img,
.wc-block-components-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;  /* cubre todo el contenedor, recortando si hace falta */
  display: block;
}


/* Títulos a 2 líneas máximo */
.wc-block-product a,
ul.products li.product .woocommerce-loop-product__title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 3em;
}

/* Alturas iguales de tarjetas */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Ocultar botón en productos relacionados */
.related.products .product .button {
    display: none !important;
}


/* =======================================================
   3) MENÚ Y NAVBAR (YOOTHEME / UIKIT)
======================================================= */

.uk-navbar-toggle{
	color: #d5448f !important; 
}

/* Nivel 3 visible en dropdown */
.uk-navbar .uk-navbar-dropdown .uk-navbar-dropdown {
    display: block !important;
    position: absolute;
    left: 100%;
    top: 0;
    z-index: 1000;
}

.uk-navbar .uk-navbar-nav li:hover > .uk-navbar-dropdown {
    display: block !important;
}

/* Toggle + / - */
.menu-padre-toggle > a .uk-nav-parent-icon::after {
  content: "+";
  margin-left: 8px;
}

.menu-padre-toggle.uk-open > a .uk-nav-parent-icon::after {
  content: "−";
}

/* Submenús */
.uk-nav-sub {
  display: none;
}

.uk-parent.uk-open > .uk-nav-sub {
  display: block;
}


/* =======================================================
   4) HEADER Y BANNER SUPERIOR
======================================================= */

.tm-header {
    background-color: rgba(255, 255, 255, 0.8) !important;
}

.tm-header-mobile {
    background-color: rgba(255, 255, 255, 0.8) !important;
    padding: 10px;
}

.top-banner{
	text-align: center;
    align-content: center;
    line-height: 34px;
    height: 35px;
    background: #D5448F;
    color: white; 
    font-weight: bold;
    font-size: smaller;
}


/* =======================================================
   5) BUSCADOR AWS
======================================================= */

.aws-container {
  width: 30vw;
}

.aws-container .aws-search-field {
  border-radius:50px 0 0 50px !important;
  padding:20px;
  border-color: lightgray;
  background:none;
}

.aws-container .aws-search-form .aws-search-btn {
  border-radius:0 50px 50px 0 !important;
  border-color: lightgray;
  padding: 5px;
  width: auto;
  background:none;
}


/* =======================================================
   6) TABLA DE TOTALES DEL CARRITO
======================================================= */

.cart_totals table.shop_table {
    width: 100%;
    border-collapse: collapse;
    table-layout: auto;
}

.cart_totals table.shop_table th {
    width: 20%;
    padding: 12px 10px;
    text-align: left;
    vertical-align: top;
    white-space: normal;
    word-break: break-word;
}

.cart_totals table.shop_table td {
    width: 80%;
    min-width: 220px;
    padding: 12px 10px;
    text-align: right;
    vertical-align: top;
    white-space: normal;
    word-break: break-word;
}

/* Métodos de envío */
.cart_totals ul.woocommerce-shipping-methods li {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 8px;
    margin-bottom: 12px;
}

.cart_totals ul.woocommerce-shipping-methods li label {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px;
    cursor: pointer !important;
}

.cart_totals ul.woocommerce-shipping-methods li input[type="radio"] {
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    vertical-align: middle !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    accent-color: #333 !important;
    appearance: radio !important;
}

.cart_totals ul.woocommerce-shipping-methods li input[type="radio"]:checked::after {
    display: none;
}


/* =======================================================
   7) RESPONSIVE — MÓVILES (≤ 768px)
======================================================= */

@media (max-width: 768px) {
	
	.woocommerce-error, .woocommerce-info, .woocommerce-message {
    margin: 0 auto;
    list-style: none;
    position: fixed;
    top: 10vh;
    margin-bottom: 20px;
    padding: 15px 29px 15px 15px;
    background: #fff;
    color: #000;
    border: 1px solid #e5e5e7;
    width: auto;
    border-radius: 5px;
	text-align:center;
	z-index: 1000;
	transition-duration: 1s;
}

    /* Mi cuenta */
    .woocommerce-MyAccount-navigation {
        display: flex;
        flex-direction: column;
        gap: 10px !important;
    }

    .woocommerce-MyAccount-navigation li {
        width: 100%;
        text-align: left;
    }

    /* Buscador en blanco */
    .aws-search-form .aws-search-field {
        color: #ffffff !important;
        background: none !important;
    }

    .aws-search-form .aws-search-field::placeholder {
        color: #ffffff !important;
        opacity: 1;
    }

    .aws-search-form .aws-search-btn_icon svg path {
        fill: #ffffff !important;
    }

    .aws-search-form .aws-search-btn {
        color: #ffffff;
    }

    /* Totales carrito en móvil */
    .cart_totals table.shop_table th,
    .cart_totals table.shop_table td {
        display: block !important;
        width: 100% !important;
        text-align: left !important;
        padding: 8px 10px;
        margin-bottom: 6px;
        box-sizing: border-box;
        word-break: break-word;
    }

    .cart_totals table.shop_table tr.order-total td {
        font-weight: bold;
        font-size: 16px;
    }

    /* Botón checkout móvil */
    .wc-proceed-to-checkout .checkout-button {
        font-size: 14px;
        padding: 10px;
    }

    /* Ajustes buscador móvil */
    .aws-container {
        width: 60vw;
        border-color: white;
    }

    .aws-container .aws-search-field {
        border-color: white !important;
        color: white !important;
    }

    .aws-container .aws-search-form .aws-search-btn {
        border-color: white !important;
        color: white !important;
    }

    /* Banner móvil */
    .top-banner{
        height: 50px;
        line-height: 20px;
        padding-top: 5px;
    }
}


/* =======================================================
   8) GRID DE PRODUCTOS POR BREAKPOINTS
======================================================= */

/* 600px */
@media (max-width: 600px) {

    /*Navegación de mi cuenta*/
        body .woocommerce-MyAccount-navigation ul > li {
        flex: none !important;
        padding-left:
        position: relative !important;
    }

    body .woocommerce-MyAccount-navigation ul > li a {
        display: block !important;
        padding: 8px 0 !important;
    }

   /* =========================
   Mis Pedidos - versión Mobile
   ========================= */
.woocommerce-MyAccount-content .woocommerce-orders-table { 
	width: 100% !important; 
	} 
	
	.woocommerce-MyAccount-content .woocommerce-orders-table thead { 
		display: none !important; /* ocultamos solo la cabecera */ 
	} 
	
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr { 
		display: block !important; 
		border: 1px solid #ddd !important; 
		border-radius: 8px !important; 
		padding: 12px !important; 
		margin-bottom: 16px !important; 
	} 
	
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr td { 
		display: flex !important; 
		justify-content: space-between !important; 
		padding: 6px 0 !important; 
		white-space: normal !important; 
	} 
	/* Mostrar el título de la columna antes del contenido usando data-title */ 
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr td::before { 
		content: attr(data-title); 
		font-weight: bold; flex: 1; 
	} 
	
	/* Contenido de la celda ocupa el resto del espacio */ 
	
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr td > * { 
		flex: 2; 
		text-align: right; /* alineación del valor */ 
	} 
	
/* Contenedor de botones en columna */
.woocommerce-MyAccount-content 
.woocommerce-orders-table tbody tr td.woocommerce-orders-table__cell-order-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start; /* o flex-end si quieres alineados a la derecha */
    gap: 6px; /* separación entre botones */
}

/* Botones */
.woocommerce-MyAccount-content 
.woocommerce-orders-table tbody tr td.woocommerce-orders-table__cell-order-actions a.woocommerce-button {
    display: block !important; /* bloque para que tome todo el ancho disponible */
    text-align: center !important;
    min-width: 100px;
	align-items: right;
}

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

    .add_to_cart_button {
        padding: 5px;
        line-height: 20px;
    }

    ul.products, 
    .products {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    li.product {
        flex: 0 0 48%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    li.product .product-inner {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
}

/* 600–1000px */
@media (max-width: 1000px) and (min-width: 600px) {

    ul.products, 
    .products {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    li.product {
        flex: 0 0 32%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    li.product .product-inner {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    
      .aws-container {
        width: 40vw;
        margin-top: 20px;
        border-color: white;
    }
}

/* Carrusel horizontal de relacionados (≤1100px) */
@media (max-width: 1100px) {

  .related.products ul.products {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    display: flex !important;
    flex-wrap: nowrap;
    gap: 10px; /* espacio entre productos */
    list-style: none;
    padding: 10px; /* espacio a los lados */
    margin: 0;
  }

  .related.products ul.products li.product {
    flex: 0 0 150px; /* ancho fijo igual a la imagen */
    scroll-snap-align: start;
  }

  .related.products ul.products img {
    width: 150px;
    height: 150px;
    object-fit: cover;
    display: block;
  }

  .related.products {
    scroll-behavior: smooth;
  }
}