@charset "utf-8";
/*
Theme Name: D. Child
Theme URI: https://denocheydia.com/
Template: astra
Author: moodoraman
Author URI: https://denocheydia.com/
Description: D. es un tema exclusivo y de alto rendimiento, construido sobre la arquitectura ultra-ligera de Astra para ofrecer una experiencia visual circular, moderna y adaptable. Con un enfoque en la estÃ©tica geomÃ©trica y la flexibilidad total, D. permite un control absoluto sobre sidebars, Ã¡reas de widgets y tipografÃ­as circulares, integrÃ¡ndose a la perfecciÃ³n con maquetadores como Elementor o Gutenberg.
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 1.1.1770977518
Updated: 2026-02-13 11:11:58

*/


/*==  by D. ==*/


/* header */


/* pages */

/*Accesibilidad*/
.onetap-desc{display:none;}


/*formulario*/
  
/*
Formulario Contact Form 7 a 2 columnas responsive
*/

 .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
  border-color: #ffb900;
	 background-color: #ffb900;
	 padding: 20px; border-radius: 20px;
	 text-align: center;
	 font-weight: 700;
} 
.wpcf7 form.sent .wpcf7-response-output {
  border-color: #46b450;
	background-color: #46b450;
	 padding: 20px; border-radius: 20px;
	 text-align: center;
	 font-weight: 700;
	color: #fff;
}


#responsive-form{
	max-width:600px /*-- change this to get your desired form width --*/;
	margin:0 auto;
        width:100%;
}
.form-row{
	width: 100%;
}
.column-half, .column-full{
	float: left;
	position: relative;
	padding: 0.65rem;
	width:100%;
	-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}
.clearfix:after {
	content: "";
	display: table;
	clear: both;
}

input[type="email"], input[type="number"], input[type="password"], input[type="reset"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], select, textarea {
  color: #666;
  padding: .75em;
  height: auto;
  border-width: 0px;
  border-style: solid;
  border-color: var(--ast-border-color);
  border-radius: 20px;
  background:#fff;
  box-shadow: none;
  box-sizing: border-box;
  transition: all .2s linear;
	border-bottom: 1px solid var(--ast-border-color);
}

textarea{height: 150px;}
.clearfix h4{ font-size: 0.9em; margin: 0; margin-left: 25px; padding-top: 20px;}
/**---------------- Media query ----------------**/
@media only screen and (min-width: 48em) { 
	.column-half{
		width: 50%;
	}
}
/*-- fin formulario de contacto--*/


/* footer */

/*cookies*/
.cli-modal-content {
    background-color: #444;
    -moz-border-radius: 0px;
    -webkit-border-radius:0px;
    -o-border-radius: 0px;
    border-radius:0px;
    -moz-box-shadow: #333 0 0 0 0;
    -webkit-box-shadow: #333 0 0 0 0;
    -o-box-shadow: #333 0 0 0 0;
    box-shadow: #333 0 0 0 0;
}
.cli-tab-container p, .cli-privacy-content-text {
    color: #ccc;
}
.cli-privacy-readmore {
    color: #ccc !important;
}
.cli-tab-header {
    background-color: #ccc;
}
.cli-tab-header a.cli-nav-link {
    color: #ccc;
}
span.cli-necessary-caption {
    color: #444;
}
.cli-switch .cli-slider::after {
    color: #444;
}
.cli-modal-close svg {
    fill: #444;
}
.cli-privacy-overview h4 {
    color: #ccc;
    text-transform: uppercase;
}
.wt-cli-ckyes-brand-logo {
    display: none;
}
#cookie-law-info-again {
    width: 25px !important;
    margin-bottom: 15px;
    background-color: #444 !important;
    font-size: 14pt;
    height: 25px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    -o-border-radius: 50px;
    border-radius: 50px;
    background-repeat: no-repeat;
    -moz-box-shadow: #333 0 0 0 0;
    -webkit-box-shadow: #333 0 0 0 0;
    -o-box-shadow: #333 0 0 0 0;
    box-shadow: #333 0 0 0 0;
    background-image: url("https://denocheydia.com/Clientes/ImgCorreoDenocheydia/cookies.png");
    padding: 0;
}

.cookiebannerimg {
    background-repeat: no-repeat;
    background-image: url("https://denocheydia.com/Clientes/ImgCorreoDenocheydia/cookies.png") !important;
	width: 25px!important; height: 50px!important;
    padding: 0;
	content: ''; float: left; margin-right: 10px;
}

#cookie-law-info-bar {
  font-size: 14px; line-height: 1em;
  text-align: left;
  font-weight: 300;
}


.material-symbols-outlined {
    font-variation-settings: 'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24;
}
#cookie_hdr_showagain {
    display: none;
}
#cookie-law-info-bar {
    width: 300px;
    display: block;
    background-color: #444 !important;
    color: #ccc !important;
    position: fixed;
    overflow: auto;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    height: auto;
    font-family: Helvetica, sans-serif;
    inset: auto auto 15px 15px;
    max-height: 479px;
    padding: 25px 15px;border-radius: 0px;
}

#cookie-law-info-bar span br{ margin-bottom: 10px;}
#cookie-law-info-bar span { font-size:0.8em; color:#ccc; line-height: 1.1em!important;}
.cli-tab-footer .wt-cli-privacy-accept-btn {
  background-color: #333;
}

.cli-switch input:checked + .cli-slider {
  background-color: #444;
}
table.cookielawinfo-winter thead th {
  background: #444!important;
  padding: 15px 10px;
  color: #444;
  text-align: left;
  font-weight: normal;
}
.cli-tab-header {
  border-radius: 0px;
  background-color: #ccc;
}
.cli-tab-section {
  margin-top: 1px;
}
.cli-tab-header a.cli-nav-link {
  color: #444;
}
.cli-tab-header a::before {

  border-right: 1px solid #444;
  border-bottom: 1px solid #444;
}


/* ==========================================================================
   Ãrea Privada WooCommerce (Mi Cuenta) - Kideflor
   ========================================================================== */

:root {
    /* Reemplaza estos valores por los colores exactos de pruebaweb.net */
    --kf-color-primario: #2b5e35; /* Tu verde corporativo principal */
    --kf-color-fondo-activo: #f3f8f4; /* Un verde muy claro para el fondo activo */
    --kf-color-texto: #374151; 
    --kf-color-texto-suave: #64748b;
    --kf-color-borde: #e5e7eb;
    --kf-radio-borde: 8px;
}

/* Layout general a dos columnas */
.woocommerce-account .woocommerce {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    align-items: flex-start;
}

/* NavegaciÃ³n lateral (MenÃº) */
.woocommerce-account .woocommerce-MyAccount-navigation {
    flex: 0 0 280px;
    width: 280px;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0;
    margin: 0;
    border: 1px solid var(--kf-color-borde);
    border-radius: var(--kf-radio-borde);
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
}



.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
    border-bottom: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation a {
    display: block;
    padding: 16px 20px;
    color: var(--kf-color-texto);
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
}

/* Estado activo y hover heredando variables corporativas */
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation a:hover {
    background-color: var(--kf-color-fondo-activo);
    color: var(--kf-color-primario);
    border-left: 4px solid var(--kf-color-primario);
    padding-left: 16px;
}

/* Contenedor principal de datos */
.woocommerce-account .woocommerce-MyAccount-content {
    flex: 1;
    min-width: 0;
    background: #ffffff;
    padding: 35px;
    border-radius: var(--kf-radio-borde);
    border: 1px solid var(--kf-color-borde);
    box-shadow: 0 4px 12px rgba(0,0,0,0.03);
}

/* --------------------------------------------------------------------------
   Grid de Tarjetas para el Escritorio (dashboard.php)
   -------------------------------------------------------------------------- */
.kideflor-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

.kideflor-card-acceso {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 25px 20px;
    background: #f8fafc;
    border: 1px solid var(--kf-color-borde);
    border-radius: var(--kf-radio-borde);
    text-align: center;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.kideflor-card-acceso:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.06);
    border-color: var(--kf-color-primario);
}

.kideflor-card-acceso .icono {
    font-size: 28px;
    margin-bottom: 12px;
}

.kideflor-card-acceso h3 {
    font-size: 16px;
    margin: 0;
    font-weight: 600;
    color: var(--kf-color-texto);
    transition: color 0.2s ease;
}

.kideflor-card-acceso:hover h3 {
    color: var(--kf-color-primario);
}

.kideflor-card-acceso p {
    font-size: 13px;
    color: var(--kf-color-texto-suave);
    margin: 5px 0 0;
}

/* Adaptabilidad MÃ³vil */
@media (max-width: 768px) {
    .woocommerce-account .woocommerce {
        flex-direction: column;
        gap: 20px;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation {
        flex: 1 1 100%;
        width: 100%;
    }
    .woocommerce-account .woocommerce-MyAccount-content {
        padding: 20px;
    }
}

/* ==========================================================================
   Carrito VacÃ­o WooCommerce - Kideflor
   ========================================================================== */

/* Centrar todo el bloque del carrito vacÃ­o */
.woocommerce .wc-empty-cart-message,
.woocommerce .return-to-shop {
    text-align: center;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
}

/* RediseÃ±o de la caja de aviso del carrito */
.woocommerce .cart-empty.woocommerce-info {
    background-color: var(--kf-color-fondo-activo, #f3f8f4);
    border: 2px dashed var(--kf-color-primario, #2b5e35); /* Borde punteado estilo "zona vacÃ­a" */
    color: var(--kf-color-texto, #374151);
    padding: 50px 20px;
    border-radius: var(--kf-radio-borde, 8px);
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 15px;
    box-shadow: none; /* Quitamos la sombra por defecto de WooCommerce */
}

/* Ocultar el icono por defecto de WooCommerce (si lo carga tu tema) */
.woocommerce .cart-empty.woocommerce-info::before {
    display: none;
}

/* AÃ±adir un icono personalizado (Cesta y hoja) */
.woocommerce .cart-empty.woocommerce-info::after {
    content: "ðŸ›’ ðŸŒ¿"; 
    font-size: 42px;
    display: block;
    margin-bottom: 10px;
    order: -1; /* Coloca el icono por encima del texto */
}

/* RediseÃ±o del botÃ³n "Volver a la tienda" */
.woocommerce .return-to-shop .button.wc-backward {
    background-color: var(--kf-color-primario, #2b5e35);
    color: #ffffff !important;
    padding: 15px 35px;
    border-radius: var(--kf-radio-borde, 8px);
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    display: inline-block;
    border: none;
}

/* Efecto hover del botÃ³n */
.woocommerce .return-to-shop .button.wc-backward:hover {
    background-color: #1e4225; /* Un tono mÃ¡s oscuro para el hover */
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(43, 94, 53, 0.2);
}


/*Producto*/
/* Estilo para el aviso de "Regístrate para ver tarifas" */
.kf-precio-oculto {
    display: inline-block;
    font-size: 14px;
    color: var(--kf-color-primario, #2b5e35);
    background-color: var(--kf-color-fondo-activo, #f3f8f4);
    padding: 6px 12px;
    border-radius: 4px;
    font-weight: 500;
    border: 1px solid rgba(43, 94, 53, 0.2);
}

/* Botón de acceso en la ficha de producto */
a.kf-btn-acceso-catalogo {
    display: block;
    text-align: center;
    background-color: transparent !important;
    color: var(--kf-color-texto, #374151) !important;
    border: 2px solid var(--kf-color-borde, #e5e7eb) !important;
    margin-top: 20px;
    transition: all 0.3s ease;
}

a.kf-btn-acceso-catalogo:hover {
    border-color: var(--kf-color-primario, #2b5e35) !important;
    color: var(--kf-color-primario, #2b5e35) !important;
    background-color: var(--kf-color-fondo-activo, #f3f8f4) !important;
}


/* ==========================================================================
   DISEÑO FINAL FICHA DE PRODUCTO B2B - KIDEFLOR
   ========================================================================== */

/* Variables de color para fácil ajuste */
:root {
    --kf-verde: #2b5e35;
    --kf-verde-hover: #1e4225;
    --kf-fondo-suave: #f3f8f4;
    --kf-gris-borde: #e5e7eb;
    --kf-gris-texto: #4b5563;
    --kf-negro: #111827;
}



/* Eliminar pestañas y dejar solo titular limpio */

li.reviews_tab, #tab-reviews { display: none !important; } /* Quitar valoraciones */
.woocommerce div.product .woocommerce-tabs ul.tabs li.active::before{ display:none;}

/* 2. TABLA TÉCNICA COMPACTA CON ICONOS */
.woocommerce-product-attributes.shop_attributes {
    border: 1px solid var(--kf-gris-borde) !important;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 20px !important;
}
.woocommerce-product-attributes.shop_attributes th {
    
    background-color: #fafafa;
    padding: 8px 12px !important;
    color: var(--kf-negro);
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-right: 1px solid var(--kf-gris-borde);
}
.woocommerce-product-attributes.shop_attributes td {
    padding: 8px 12px !important;
    font-size: 13px;
    color: var(--kf-gris-texto);
	width: 100%;
}
.woocommerce-product-attributes.shop_attributes th::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    background-size: contain;
    background-repeat: no-repeat;
}

.woocommerce-js div.product .woocommerce-tabs {
  padding-top: 0em;
  margin-bottom: 0em;
}

/* SVGs de la tabla */
.woocommerce-product-attributes-item--attribute_pa_color th::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232b5e35" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z"/></svg>'); }
.woocommerce-product-attributes-item--attribute_pa_longitud th::before, .woocommerce-product-attributes-item--dimensions th::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232b5e35" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="8" width="18" height="8" rx="2"/><path d="M7 8v4M11 8v4M15 8v4"/></svg>'); }
.woocommerce-product-attributes-item--attribute_pa_peso th::before, .woocommerce-product-attributes-item--weight th::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232b5e35" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 14a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-4z"/><path d="M12 12V8M8 8h8M10 8a2 2 0 0 1 4 0"/></svg>'); }
.woocommerce-product-attributes-item--attribute_pa_calidad th::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232b5e35" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="8" r="7"/><polyline points="8.21 13.89 7 23 12 20 17 23 15.79 13.88"/></svg>'); }
.woocommerce-product-attributes-item--attribute_pa_origen th::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232b5e35" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>'); }
.woocommerce-product-attributes-item--attribute_pa_formato-de-venta th::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232b5e35" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/></svg>'); }

/* 3. BOTONES DE RAMOS Y CUBOS */
.cfvsw-swatches-container { gap: 10px; margin-bottom: 20px; }
.cfvsw-swatches-option.cfvsw-label-option {
    border: 2px solid var(--kf-gris-borde) !important;
    border-radius: 8px !important;
    padding: 8px 16px !important;
    background: #fff !important;
    transition: all 0.3s;
}
.cfvsw-swatches-option.selected {
    border-color: var(--kf-verde) !important;
    background-color: var(--kf-fondo-suave) !important;
    color: var(--kf-verde) !important;
}
.cfvsw-swatch-inner { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.cfvsw-swatch-inner::before {
    content: ""; display: block; width: 20px; height: 20px; background-size: contain; background-repeat: no-repeat;
}
/* Icono Ramos (Tres flores) */
.cfvsw-swatches-option[data-slug*="ramo"] .cfvsw-swatch-inner::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%236b7280" stroke-width="1.5"><circle cx="12" cy="8" r="3"/><circle cx="7" cy="12" r="3"/><circle cx="17" cy="12" r="3"/><path d="M12 22v-7M9 22l1-4M15 22l-1-4"/></svg>'); }
/* Icono Cubo */
.cfvsw-swatches-option[data-slug*="cubo"] .cfvsw-swatch-inner::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%236b7280" stroke-width="1.5"><path d="M5 6l2 14h10l2-14M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>'); }

.cfvsw-swatches-option.selected[data-slug*="ramo"] .cfvsw-swatch-inner::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232b5e35" stroke-width="1.5"><circle cx="12" cy="8" r="3"/><circle cx="7" cy="12" r="3"/><circle cx="17" cy="12" r="3"/><path d="M12 22v-7M9 22l1-4M15 22l-1-4"/></svg>'); }
.cfvsw-swatches-option.selected[data-slug*="cubo"] .cfvsw-swatch-inner::before { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232b5e35" stroke-width="1.5"><path d="M5 6l2 14h10l2-14M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>'); }

/* 4. BOTONES CANTIDAD +/- TIPO PÍLDORA */
.quantity.buttons_added {
    background: #f0f2f0;
    border-radius: 30px !important;
    padding: 3px;
    display: inline-flex !important;
    align-items: center;
    height: 44px !important;
}
.quantity.buttons_added a.minus, .quantity.buttons_added a.plus {
    background: #fff !important;
    color: var(--kf-verde) !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: bold;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    text-decoration: none;
}
.quantity.buttons_added a:hover { background: var(--kf-verde) !important; color: #fff !important; }
.quantity.buttons_added input.qty {
    background: transparent !important;
    border: none !important;
    width: 40px !important;
    font-weight: 700;
    font-size: 16px;
    text-align: center;
}

/* 5. BOTÓN AÑADIR AL CARRITO */
button.single_add_to_cart_button {
    background-color: var(--kf-verde) !important;
    height: 44px !important;
    border-radius: 30px !important;
    padding: 0 25px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    font-size: 14px !important;
    margin-left: 10px !important;
    transition: all 0.3s;
}
button.single_add_to_cart_button:hover {
    background-color: var(--kf-verde-hover) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(43, 94, 53, 0.2);
}

/* Estilo para la palabra "Desde" en precios variables */
span.kf-precio-desde {
    font-size: 14px !important;
    font-weight: 500;
    color: var(--kf-gris-texto, #4b5563);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-right: 4px;
}

/* ==========================================================================
   FORZAR ESTADO SELECCIONADO (RAMOS / CUBOS) - MÁXIMA PRIORIDAD
   ========================================================================== */

/* 1. Fondo verde y texto blanco obligatorios para el botón activo */
html body .cfvsw-swatches-container .cfvsw-swatches-option.cfvsw-selected-swatch,
html body .cfvsw-swatches-container .cfvsw-swatches-option.selected,
html body .cfvsw-swatches-container .cfvsw-swatches-option.active {
    background-color: var(--kf-verde, #2b5e35) !important;
    border-color: var(--kf-verde, #2b5e35) !important;
    box-shadow: 0 4px 10px rgba(43, 94, 53, 0.4) !important;
    transform: translateY(-1px) !important;
}

/* 2. Forzar el texto interior a blanco */
html body .cfvsw-swatches-container .cfvsw-swatches-option.cfvsw-selected-swatch .cfvsw-swatch-inner,
html body .cfvsw-swatches-container .cfvsw-swatches-option.selected .cfvsw-swatch-inner,
html body .cfvsw-swatches-container .cfvsw-swatches-option.active .cfvsw-swatch-inner {
    color: #ffffff !important;
}

/* 3. Forzar Icono de Ramos a BLANCO al hacer clic */
html body .cfvsw-swatches-option.cfvsw-selected-swatch[data-slug*="ramo"] .cfvsw-swatch-inner::before,
html body .cfvsw-swatches-option.selected[data-slug*="ramo"] .cfvsw-swatch-inner::before { 
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23ffffff" stroke-width="1.5"><circle cx="12" cy="8" r="3"/><circle cx="7" cy="12" r="3"/><circle cx="17" cy="12" r="3"/><path d="M12 22v-7M9 22l1-4M15 22l-1-4"/></svg>') !important; 
}

/* 4. Forzar Icono de Cubo a BLANCO al hacer clic */
html body .cfvsw-swatches-option.cfvsw-selected-swatch[data-slug*="cubo"] .cfvsw-swatch-inner::before,
html body .cfvsw-swatches-option.selected[data-slug*="cubo"] .cfvsw-swatch-inner::before { 
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23ffffff" stroke-width="1.5"><path d="M5 6l2 14h10l2-14M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>') !important; 
}


/* ==========================================================================
   DISEÑO DE GALERÍA DE IMÁGENES Y ZOOM - KIDEFLOR
   ========================================================================== */



/* 2. Redondear la imagen principal y aplicar transición al hacer hover */
.woocommerce-product-gallery__image {
    border-radius: 8px;
    overflow: hidden;
}
.woocommerce-product-gallery__image img {
    border-radius: 8px;
    display: block;
    width: 100%;
    transition: transform 0.3s ease;
}

/* 3. Diseño del Visor (Zoom) */
.zoomImg {
    cursor: crosshair !important; /* Cambia el cursor para invitar al detalle */
    background-color: #ffffff; /* Evita que los PNGs transparentes se vean mal al hacer zoom */
}


/* 5. Diseño de las Miniaturas (Galería inferior) */
.woocommerce-product-gallery .flex-control-thumbs {
    display: flex !important;
    gap: 12px;
    margin-top: 15px !important;
    padding: 0 !important;
}
.woocommerce-product-gallery .flex-control-thumbs li {
    width: calc(25% - 9px) !important; /* Layout de 4 columnas */
    list-style: none !important;
}
.woocommerce-product-gallery .flex-control-thumbs img {
    border-radius: 8px !important;
    border: 2px solid transparent !important;
    cursor: pointer;
    opacity: 0.6;
    transition: all 0.3s ease;
    margin: 0 !important;
}
.woocommerce-product-gallery .flex-control-thumbs img:hover,
.woocommerce-product-gallery .flex-control-thumbs img.flex-active {
    opacity: 1;
    border-color: var(--kf-verde, #2b5e35) !important; /* Borde verde al seleccionar */
    box-shadow: 0 2px 8px rgba(43, 94, 53, 0.2);
}

/* ==========================================================================
   DISEÑO CAJA DE DESCRIPCIÓN LARGA (AVISOS / NOTAS IMPORTANTES)
   ========================================================================== */
.elementor-widget-woocommerce-product-content {
    background-color: #fef2f2; /* Fondo rojo muy suave */
    border-left: 4px solid #dc2626; /* Línea roja intensa a la izquierda */
    padding: 12px 16px;
    border-radius: 0 6px 6px 0;
    margin-bottom: 20px;
}
.elementor-widget-woocommerce-product-content p {
    color: #991b1b; /* Texto rojo oscuro */
    font-size: 14px;
    font-weight: 500;
    margin: 0 !important;
    line-height: 1.5;
}
/* ==========================================================================
   BARRA FLOTANTE DE COMPRA (STICKY ADD TO CART - ASTRA)
   ========================================================================== */

/* 1. Contenedor principal (Efecto flotante y fondo blanco puro) */
.ast-sticky-add-to-cart {
    background-color: #ffffff !important;
    border-top: 1px solid var(--kf-gris-borde, #e5e7eb) !important;
    box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.08) !important; /* Sombra suave hacia arriba */
    padding: 12px 0 !important;
    transition: all 0.3s ease-in-out;
}

/* 2. Alineación de los bloques interiores */
.ast-sticky-add-to-cart-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* 3. Bloque Izquierdo (Miniatura y Título) */
.ast-sticky-add-to-cart-title-wrap {
    display: flex;
    align-items: center;
    gap: 15px;
}
.ast-sticky-add-to-cart-title-wrap img {
    width: 48px !important;
    height: 48px !important;
    border-radius: 8px !important;
    object-fit: cover;
    border: 1px solid var(--kf-gris-borde, #e5e7eb);
}
.ast-sticky-add-to-cart-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--kf-negro, #111827) !important;
}

/* 4. Bloque Derecho (Precio) */
.ast-sticky-add-to-cart-action-wrap {
    display: flex;
    align-items: center;
    gap: 24px;
}
.ast-sticky-add-to-cart-action-price.price {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--kf-verde, #2b5e35) !important;
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin: 0 !important;
}
.ast-sticky-add-to-cart-action-price small {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--kf-gris-texto, #4b5563) !important;
}

/* 5. Botón de Acción ("Seleccionar opciones" o "Añadir al carrito") */
.ast-sticky-add-to-cart-action-wrap .button {
    background-color: var(--kf-verde, #2b5e35) !important;
    color: #ffffff !important;
    border-radius: 30px !important;
    padding: 10px 24px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    transition: all 0.3s ease !important;
    border: none !important;
    line-height: 1.5 !important;
}
.ast-sticky-add-to-cart-action-wrap .button:hover {
    background-color: var(--kf-verde-hover, #1e4225) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(43, 94, 53, 0.25) !important;
}

/* 6. Optimización extrema para Teléfonos Móviles */
@media (max-width: 768px) {
    .ast-sticky-add-to-cart {
        padding: 10px 0 !important;
    }
    .ast-sticky-add-to-cart-title-wrap img {
        display: none !important; /* Ocultamos la foto para ganar espacio vital */
    }
    .ast-sticky-add-to-cart-title {
        font-size: 14px !important;
        line-height: 1.2 !important;
    }
    .ast-sticky-add-to-cart-action-price.price {
        display: none !important; /* Ocultamos el precio para dejar el botón bien grande */
    }
    .ast-sticky-add-to-cart-action-wrap .button {
        padding: 10px 18px !important;
        font-size: 12px !important;
        width: 100%;
        text-align: center;
    }
}
/*--------- TIENDA ----------------------------------------------------------------------------------*/

/* ==========================================================================
   NUEVO DISEÑO TARJETA B2B: "HIGH-CONTRAST APP STYLE"
   ========================================================================== */

/* 1. Tarjeta Global: Sin bordes duros, con sombras suaves y muy redondeada */
html body .e-con-inner:has(.kf-card-content) {
    background: #ffffff !important;
    border: none !important;
    border-radius: 8px !important; 
    overflow: hidden !important;
    transition: all 0.4s ease !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.06) !important; 
}
html body .e-con-inner:has(.kf-card-content):hover {
    box-shadow: 0 15px 35px rgba(43, 94, 53, 0.15) !important; 
    transform: translateY(-6px) !important;
}

html body .ast-col-sm-12 { padding: 0 !important; background-color: #fff; border-radius: 8px !important; }


/* 2. Área de Imagen (100% visible, encaje perfecto) */
html body .elementor-widget-theme-post-featured-image .elementor-widget-container a {
    display: block !important;
    width: 100% !important;
    height: 250px !important; 
    position: relative !important; 
    overflow: hidden !important;
    background-color: #f8fafc !important; 
	 border-radius: 8px 8px 0 0 !important;
}
html body .elementor-widget-theme-post-featured-image .elementor-widget-container img {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    object-fit: cover !important; 
    object-position: center !important; 
    transition: transform 0.5s ease !important;
}
html body .e-con-inner:has(.kf-card-content):hover .elementor-widget-theme-post-featured-image img {
    transform: scale(1.08) !important; 
}

/* 3. Contenido Central */
html body .kf-card-content { display: flex; flex-direction: column; flex-grow: 1; background-color: #f5f5f5; }

html body .kf-tarjeta-header { padding: 20px 20px 10px 20px !important; }
html body .kf-tarjeta-titulo { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 5px; }

html body .kf-circulo { 
    width: 14px; height: 14px; border-radius: 50%; 
    border: 2px solid #ffffff; flex-shrink: 0; margin-top: 2px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

html body h2.kf-titulo-prod { font-size: 16px !important; font-weight: 800 !important; margin: 0 !important; line-height: 1.2 !important; text-align: left; }
html body h2.kf-titulo-prod a { color: #111827 !important; text-decoration: none !important; }
html body h2.kf-titulo-prod a:hover { color: var(--kf-verde, #2b5e35) !important; }

html body .kf-tarjeta-subtitulo { font-size: 12px !important; color: #555 !important; padding-left: 24px !important; font-weight: 400 !important; }

/* 4. Atributos "Píldora" (Cambio visual drástico: Fondo verde clarito, texto verde oscuro) */
.kf-tarjeta-atributos { 
    display: flex; flex-wrap: wrap; gap: 8px; 
    padding: 0 20px 20px 20px !important; 
}
 .kf-tarjeta-atributos span { 
    display: flex; align-items: center; gap: 1px; 
    font-size: 12px !important; font-weight: 700 !important; 
    color: var(--kf-verde, #2b5e35) !important; 
    background: #fff !important; 
    padding: 1px 9px !important; 
    border-radius: 8px !important; /* Formato píldora ovalada */
}
 .kf-tarjeta-atributos svg { width: 14px !important; height: 14px !important; stroke: var(--kf-verde, #2b5e35) !important; }

/* 5. Pie de Tarjeta (Precio centrado y Botón Ancho Completo) */
html body .kf-tarjeta-footer { 
    padding: 20px !important; 
    background-color: #ffffff !important; 
    border-top: 1px solid #f3f4f6 !important; 
    display: flex !important; 
    flex-direction: column !important; /* Apilamos precio y botón siempre */
    gap: 12px !important; 
    margin-top: auto; 
}
html body .kf-tarjeta-precio { 
    font-size: 22px !important; font-weight: 800 !important; line-height: 1em;
    color: #111827 !important; text-align: center !important; width: 100% !important;
}
html body .kf-tarjeta-precio span.kf-precio-desde { font-size: 12px !important; color: #6b7280 !important; font-weight: 600 !important; text-transform: uppercase; }
html body .woocommerce-price-suffix { font-size: 12px !important; color: #9ca3af !important; font-weight: 500 !important; }

html body .kf-btn-seleccionar { 
    background-color: var(--kf-verde, #2b5e35) !important; 
    color: #ffffff !important; font-size: 13px !important; font-weight: 700 !important; 
    text-transform: uppercase; letter-spacing: 0.5px !important;
    padding: 12px 0 !important; border-radius: 8px !important; 
    text-align: center !important; width: 100% !important; display: block !important;
    transition: all 0.3s ease !important; 
}
html body .kf-btn-seleccionar:hover { 
    background-color: var(--kf-verde-hover, #1e4225) !important; 
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 15px rgba(43, 94, 53, 0.25) !important; 
}

html body .elementor-widget-loop-grid .elementor-loop-container .e-con { width: 100% !important; max-width: 100% !important; }

/* ==========================================================================
   6. RESPONSIVE (MÓVIL Y TABLET)
   ========================================================================== */
@media (max-width: 1024px) {
    html body .elementor-widget-theme-post-featured-image .elementor-widget-container a { height: 200px !important; }
    html body .kf-tarjeta-header { padding: 15px 15px 10px 15px !important; }
    html body .kf-tarjeta-atributos { padding: 0 15px 15px 15px !important; }
    html body .kf-tarjeta-footer { padding: 15px !important; }
}
@media (max-width: 767px) {
    html body .elementor-widget-theme-post-featured-image .elementor-widget-container a { height: 180px !important; }
    html body h2.kf-titulo-prod { font-size: 13px !important; }
    html body .kf-tarjeta-atributos span { font-size: 11px !important; padding: 5px 10px !important; }
    html body .kf-tarjeta-precio { font-size: 16px !important; }
}

/* ==========================================================================
   DESPLEGABLE DE ORDENACIÓN B2B
   ========================================================================== */
.kf-orden-form {
    display: inline-block;
    margin: 0; 
}
.kf-orden-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.kf-orden-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #ffffff;
    border: 1px solid var(--kf-gris-borde, #e5e7eb);
    border-radius: 30px;
    padding: 10px 40px 10px 38px; /* Espacio para el icono a la izq y la flecha a la der */
    font-size: 14px;
    font-weight: 600;
    color: #4b5563;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
    transition: all 0.3s ease;
    
    /* Flecha personalizada */
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%234b5563" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>');
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 16px;
}
.kf-orden-select:hover, .kf-orden-select:focus {
    outline: none;
    border-color: var(--kf-verde, #2b5e35);
    box-shadow: 0 4px 12px rgba(43, 94, 53, 0.1);
}
/* ==========================================================================
   BUSCADOR B2B DE PRODUCTOS
   ========================================================================== */
.kf-buscador-form {
    display: inline-block;
    margin: 0;
    width: 100%;
    max-width: 280px; /* Ancho controlado para que no se coma toda la pantalla */
}

.kf-buscador-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.kf-buscador-icono {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    color: #9ca3af;
    pointer-events: none; /* Para poder hacer clic a través de él */
}

.kf-buscador-input {
    width: 100%;
    background-color: #ffffff;
    border: 1px solid var(--kf-gris-borde, #e5e7eb);
    border-radius: 30px 0 0 30px !important; /* Redondeado solo por la izquierda */
    padding: 10px 15px 10px 38px !important; /* Espacio para el icono de la lupa */
    font-size: 14px !important;
    color: #111827;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
    transition: all 0.3s ease;
    outline: none !important;
    height: 42px !important; /* Altura exacta para igualar al desplegable */
}

.kf-buscador-input:focus {
    border-color: var(--kf-verde, #2b5e35);
}

.kf-buscador-btn {
    background-color: var(--kf-verde, #2b5e35) !important;
    color: #ffffff !important;
    border: 1px solid var(--kf-verde, #2b5e35) !important;
    border-radius: 0 30px 30px 0 !important; /* Redondeado solo por la derecha */
    padding: 0 20px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer;
    transition: all 0.3s ease;
    height: 42px !important; /* Altura exacta */
}

.kf-buscador-btn:hover {
    background-color: var(--kf-verde-hover, #1e4225) !important;
    box-shadow: 0 4px 10px rgba(43, 94, 53, 0.2);
}

/* En móviles, el buscador ocupa el 100% del ancho */
@media (max-width: 767px) {
    .kf-buscador-form {
        max-width: 100%;
        margin-bottom: 10px !important;
    }
}

/* ==========================================================================
   DESTACAR PRODUCTOS EN BÚSQUEDA (MÉTODO DE FUERZA BRUTA)
   ========================================================================== */

/* 1. Iluminar la tarjeta entera apuntando directamente al contenedor nativo de Elementor */
html body.search .elementor-loop-container .e-loop-item > .e-con,
html body.search-results .elementor-loop-container .e-loop-item > .e-con {
    outline: 2px solid var(--kf-verde, #2b5e35) !important;
    outline-offset: -2px !important; /* Para que el borde no rompa la cuadrícula */
    box-shadow: 0 12px 35px rgba(43, 94, 53, 0.25) !important; /* Sombra verde fija */
    transform: translateY(-4px) !important; /* Lo eleva un poquito permanentemente */
    transition: all 0.3s ease !important;
}

/* 2. La Etiqueta flotante (Se mantiene igual porque ya te funcionaba) */
html body.search .elementor-widget-theme-post-featured-image .elementor-widget-container a::before,
html body.search-results .elementor-widget-theme-post-featured-image .elementor-widget-container a::before {
    content: '\2713 Encontrado'; 
    position: absolute;
    top: 12px;
    right: 12px;
    background-color: var(--kf-verde, #2b5e35);
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 6px 12px;
    border-radius: 30px;
    z-index: 10;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    animation: kf-aparecer-etiqueta 0.5s ease forwards;
}

@keyframes kf-aparecer-etiqueta {
    0% { transform: scale(0); }
    80% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* ==========================================================================
   BARRA LATERAL DE FILTROS B2B (SIDEBAR CORPORATIVO)
   ========================================================================== */

/* 1. Contenedores de cada Filtro (Cajas Blancas Limpias) */
.elementor-widget-wp-widget-woocommerce_product_categories,
.elementor-widget-wp-widget-woocommerce_layered_nav,
.elementor-widget-wp-widget-woocommerce_price_filter {
    background: #ffffff !important;
    border: 1px solid var(--kf-gris-borde, #e5e7eb) !important;
    border-radius: 8px !important;
    padding: 20px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
}

/* 2. Títulos de los Filtros */
.elementor-widget-wp-widget-woocommerce_product_categories h5,
.elementor-widget-wp-widget-woocommerce_layered_nav h5,
.elementor-widget-wp-widget-woocommerce_price_filter h5 {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #111827 !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    padding-bottom: 12px !important;
    border-bottom: 2px solid #f3f4f6 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* 3. Limpieza de Listas (Adiós viñetas) */
.woocommerce-widget-layered-nav-list,
.product-categories {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 4. Elementos de la lista y contadores */
.woocommerce-widget-layered-nav-list__item,
.cat-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed #f3f4f6 !important;
    transition: all 0.2s ease !important;
}
.woocommerce-widget-layered-nav-list__item:last-child,
.cat-item:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

/* Enlaces (Textos de los filtros) */
.woocommerce-widget-layered-nav-list__item a,
.cat-item a {
    color: #4b5563 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
    flex-grow: 1;
}

/* Efecto al pasar el ratón o si está seleccionado */
.woocommerce-widget-layered-nav-list__item a:hover,
.cat-item a:hover,
.woocommerce-widget-layered-nav-list__item.chosen a,
.cat-item.current-cat a {
    color: var(--kf-verde, #2b5e35) !important;
    font-weight: 700 !important;
}

/* Contadores (El número de productos entre paréntesis) */
.woocommerce-widget-layered-nav-list__item .count,
.cat-item .count {
    background: #f3f4f6 !important;
    color: #6b7280 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 2px 8px !important;
    border-radius: 20px !important;
    margin-left: 10px !important;
}

/* 5. DISEÑO DEL DESLIZADOR DE PRECIO (SLIDER) */
.price_slider_wrapper {
    padding-top: 10px !important;
}
.price_slider_wrapper .ui-slider {
    background: #e5e7eb !important;
    height: 4px !important;
    border: none !important;
    border-radius: 4px !important;
    margin-bottom: 20px !important;
}
/* Barra de progreso verde */
.price_slider_wrapper .ui-slider .ui-slider-range {
    background: var(--kf-verde, #2b5e35) !important;
    border-radius: 4px !important;
}
/* Tiradores del slider */
.price_slider_wrapper .ui-slider .ui-slider-handle {
    background: #ffffff !important;
    border: 2px solid var(--kf-verde, #2b5e35) !important;
    width: 16px !important;
    height: 16px !important;
    top: -6px !important;
    border-radius: 50% !important;
    cursor: grab !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important;
    outline: none !important;
}
.price_slider_wrapper .ui-slider .ui-slider-handle:active {
    cursor: grabbing !important;
    background: var(--kf-verde, #2b5e35) !important;
}

/* Textos de precio y Botón Filtrar */
.price_slider_amount {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-direction: row-reverse !important; /* Pone el botón a la derecha */
}
.price_slider_amount .price_label {
    font-size: 13px !important;
    color: #4b5563 !important;
    font-weight: 600 !important;
}
.price_slider_amount .button {
    background: var(--kf-fondo-suave, #f3f8f4) !important;
    color: var(--kf-verde, #2b5e35) !important;
    border: 1px solid var(--kf-verde, #2b5e35) !important;
    border-radius: 30px !important;
    padding: 6px 16px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
}
.price_slider_amount .button:hover {
    background: var(--kf-verde, #2b5e35) !important;
    color: #ffffff !important;
}

/* Ocultar botón de "Filtrar" genérico si usas filtros por AJAX (opcional) */
.woocommerce-widget-layered-nav .woocommerce-widget-layered-nav-dropdown__submit {
    display: none !important;
}

/* ==========================================================================
   REDISEÑO CATEGORÍAS B2B - en tienda
   ========================================================================== */

/* Fila principal (Wrapper) */
.kf-cat-wrapper {
    display: flex;
    align-items: center;
    background-color: #f9fafb;
    border-radius: 8px;
    transition: all 0.3s ease;
    border: 1px solid #f3f4f6;
    margin-bottom: 4px;
    cursor: pointer;
}

.kf-cat-wrapper:hover {
    background-color: #f3f4f6;
}

/* El botón (+) AHORA AL PRINCIPIO */
.kf-toggle-cat {
    width: 40px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

/* El nombre de la categoría */
.widget_product_categories ul li.cat-parent > .kf-cat-wrapper a {
    flex: 1;
    padding: 0px 10px 0px 0px !important; /* Menos padding a la izq porque ya está el icono */
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #111827 !important;
    text-decoration: none !important;
}

/* Rotación del icono al abrir */
.cat-parent.kf-opened > .kf-cat-wrapper .kf-toggle-cat {
    transform: rotate(45deg);
    color: #ef4444;
}

/* Estado activo de la fila */
.cat-parent.kf-opened > .kf-cat-wrapper {
    background-color: #ffffff;
    border-color: var(--kf-verde, #2b5e35);
}

/* Contenedor de Subcategorías */
.widget_product_categories ul.children {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
    margin: 0 !important;
    padding: 0 !important;
}

.widget_product_categories ul.children li a {
    padding: 0px 5px 0px 10px !important; /* Alineado con el inicio del texto superior */
    font-size: 14px !important;
    color: #4b5563 !important;
    display: block !important;
}

.widget_product_categories ul.children li a:hover {
    color: var(--kf-verde, #2b5e35) !important;
    background-color: #f0fdf4 !important;
}
/* Resaltar la fila de la categoría padre activa */
.cat-parent.current-cat-parent > .kf-cat-wrapper,
.cat-parent.current-cat > .kf-cat-wrapper {
    background-color: #f0fdf4 !important; /* Verde muy clarito */
    border-color: var(--kf-verde, #2b5e35) !important;
}

/* Resaltar la subcategoría específica */
.widget_product_categories ul.children li.current-cat a {
    color: var(--kf-verde, #2b5e35) !important;
    background-color: #f0fdf4 !important;
}


.widget_product_categories ul li.cat-parent > .kf-cat-wrapper a {
    cursor: pointer !important;
}

/* Cambio de color al estar abierto para indicar que ya es "clicable" para navegar */
.cat-parent.kf-opened > .kf-cat-wrapper a:hover {
    text-decoration: underline !important;
    color: var(--kf-verde, #2b5e35) !important;
}

/* ==========================================================================
   MUESTRAS DE COLOR (SWATCHES) EN EL FILTRO LATERAL B2B
   ========================================================================== */

/* 1. Creamos el "círculo" base solo para los enlaces que filtren por color */
.woocommerce-widget-layered-nav-list__item a[href*="filter_color="]::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-right: 8px;
    vertical-align: middle;
    border: 1px solid var(--kf-gris-borde, #d1d5db);
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.1);
    background-color: #f3f4f6; /* Gris por defecto */
    position: relative;
    top: -1px;
    transition: transform 0.2s ease;
}

/* 2. Pequeño efecto de latido al pasar el ratón */
.woocommerce-widget-layered-nav-list__item a[href*="filter_color="]:hover::before {
    transform: scale(1.2);
}

/* 3. MAPA DE COLORES COMPLETO (Sincronizado con JS) */

/* BLANCOS Y CREMAS */
.woocommerce-widget-layered-nav-list__item a[href*="blanco"]::before,
.woocommerce-widget-layered-nav-list__item a[href*="blanca"]::before { background-color: #ffffff !important; }

.woocommerce-widget-layered-nav-list__item a[href*="crema"]::before,
.woocommerce-widget-layered-nav-list__item a[href*="marfil"]::before { background-color: #fef3c7 !important; }

.woocommerce-widget-layered-nav-list__item a[href*="champan"]::before { background-color: #fde68a !important; }

/* AMARILLOS Y NARANJAS */
.woocommerce-widget-layered-nav-list__item a[href*="amarillo"]::before { background-color: #facc15 !important; }
.woocommerce-widget-layered-nav-list__item a[href*="limon"]::before { background-color: #fef08a !important; }
.woocommerce-widget-layered-nav-list__item a[href*="mostaza"]::before { background-color: #eab308 !important; }
.woocommerce-widget-layered-nav-list__item a[href*="naranja"]::before { background-color: #fb923c !important; }
.woocommerce-widget-layered-nav-list__item a[href*="melocoton"]::before { background-color: #fdba74 !important; }

/* ROJOS Y BURDEOS */
.woocommerce-widget-layered-nav-list__item a[href*="rojo"]::before,
.woocommerce-widget-layered-nav-list__item a[href*="roja"]::before { background-color: #dc2626 !important; }

/* Composiciones de rojo (Deben ir después del rojo normal) */
.woocommerce-widget-layered-nav-list__item a[href*="rojo-oscuro"]::before { background-color: #991b1b !important; }
.woocommerce-widget-layered-nav-list__item a[href*="granate"]::before { background-color: #7f1d1d !important; }
.woocommerce-widget-layered-nav-list__item a[href*="burdeos"]::before { background-color: #800020 !important; } /* Tono vino */
.woocommerce-widget-layered-nav-list__item a[href*="teja"]::before { background-color: #c2410c !important; }
.woocommerce-widget-layered-nav-list__item a[href*="coral"]::before { background-color: #fb7185 !important; }
.woocommerce-widget-layered-nav-list__item a[href*="salmon"]::before { background-color: #f87171 !important; }

/* ROSAS Y MORADOS */
.woocommerce-widget-layered-nav-list__item a[href*="rosa"]::before { background-color: #f472b6 !important; }
.woocommerce-widget-layered-nav-list__item a[href*="rosa-pastel"]::before { background-color: #fbcfe8 !important; } /* Va después de rosa */
.woocommerce-widget-layered-nav-list__item a[href*="fucsia"]::before,
.woocommerce-widget-layered-nav-list__item a[href*="magenta"]::before { background-color: #d946ef !important; }

.woocommerce-widget-layered-nav-list__item a[href*="morado"]::before,
.woocommerce-widget-layered-nav-list__item a[href*="purpura"]::before { background-color: #a855f7 !important; }
.woocommerce-widget-layered-nav-list__item a[href*="lila"]::before,
.woocommerce-widget-layered-nav-list__item a[href*="lavanda"]::before { background-color: #d8b4fe !important; }
.woocommerce-widget-layered-nav-list__item a[href*="violeta"]::before { background-color: #7e22ce !important; }

/* VERDES */
.woocommerce-widget-layered-nav-list__item a[href*="verde"]::before { background-color: #22c55e !important; }
.woocommerce-widget-layered-nav-list__item a[href*="verde-oscuro"]::before { background-color: #15803d !important; } /* Va después de verde */
.woocommerce-widget-layered-nav-list__item a[href*="lima"]::before { background-color: #84cc16 !important; }

/* AZULES */
.woocommerce-widget-layered-nav-list__item a[href*="azul"]::before { background-color: #3b82f6 !important; }
.woocommerce-widget-layered-nav-list__item a[href*="celeste"]::before { background-color: #7dd3fc !important; }
.woocommerce-widget-layered-nav-list__item a[href*="turquesa"]::before { background-color: #2dd4bf !important; }

/* NEUTROS Y MULTICOLOR */
.woocommerce-widget-layered-nav-list__item a[href*="negro"]::before { background-color: #1f2937 !important; }
.woocommerce-widget-layered-nav-list__item a[href*="marron"]::before { background-color: #78350f !important; }
.woocommerce-widget-layered-nav-list__item a[href*="bicolor"]::before,
.woocommerce-widget-layered-nav-list__item a[href*="multicolor"]::before { background-color: #94a3b8 !important; }

/* ==========================================================================
   ICONOS PARA FILTROS DE LONGITUD Y CALIDAD
   ========================================================================== */

/* Configuración base de los iconos */
.woocommerce-widget-layered-nav-list__item a[href*="filter_longitud="]::before,
.woocommerce-widget-layered-nav-list__item a[href*="filter_calidad="]::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    vertical-align: text-bottom;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.6; /* Un tono sutil y elegante */
    transition: opacity 0.2s ease, transform 0.2s ease;
}

/* Efecto al pasar el ratón: se encienden */
.woocommerce-widget-layered-nav-list__item a[href*="filter_longitud="]:hover::before,
.woocommerce-widget-layered-nav-list__item a[href*="filter_calidad="]:hover::before {
    opacity: 1;
    transform: scale(1.1);
}

/* ICONO: LONGITUD (Flechas de cota de medida) */
.woocommerce-widget-layered-nav-list__item a[href*="filter_longitud="]::before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%234b5563" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 3H3"/><path d="M21 21H3"/><path d="M12 21V3"/><path d="m8 7 4-4 4 4"/><path d="m8 17 4 4 4-4"/></svg>');
}

/* ICONOS: CALIDAD */

/* Calidad EX (Estrella Premium) */
.woocommerce-widget-layered-nav-list__item a[href*="filter_calidad=ex"]::before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%234b5563" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>');
}

/* Calidad PRE (Medalla / Sello) */
.woocommerce-widget-layered-nav-list__item a[href*="filter_calidad=pre"]::before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%234b5563" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="8" r="7"/><polyline points="8.21 13.89 7 23 12 20 17 23 15.79 13.88"/></svg>');
}

/* Calidad SUP (Diamante) */
.woocommerce-widget-layered-nav-list__item a[href*="filter_calidad=sup"]::before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%234b5563" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 3h12l4 6-10 13L2 9Z"/></svg>');
}

/* ==========================================================================
   MÓDULO "VISTOS RECIENTEMENTE" (DISEÑO CORPORATIVO)
   ========================================================================== */

/* 1. Caja Principal, Título y Limpieza (Mismo bloque que los demás) */
.elementor-widget-wp-widget-woocommerce_recently_viewed_products {
    background: #ffffff !important;
    border: 1px solid var(--kf-gris-borde, #e5e7eb) !important;
    border-radius: 8px !important;
    padding: 20px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
}

.elementor-widget-wp-widget-woocommerce_recently_viewed_products h5 {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #111827 !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    padding-bottom: 12px !important;
    border-bottom: 2px solid #f3f4f6 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.elementor-widget-wp-widget-woocommerce_recently_viewed_products ul.product_list_widget {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 4. Miniatura de la imagen cuadrada y limpia */
.elementor-widget-wp-widget-woocommerce_recently_viewed_products ul.product_list_widget li img {
    width: 45px !important;
    height: 45px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    margin-right: 12px !important;
    border: 1px solid #e5e7eb !important;
    margin-left: 0 !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;
}

/* 5. Estilo del Título del producto */
.elementor-widget-wp-widget-woocommerce_recently_viewed_products ul.product_list_widget li .product-title {
    color: #111827 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    transition: color 0.2s ease !important;
}
.woocommerce-js ul.product_list_widget li > a {
  margin-bottom: 0;
}
/* ==========================================================================
   AVISO AÑADIDO AL CARRITO - DISEÑO VISUAL CORPORATIVO PREMIUM
   ========================================================================== */

/* 1. Espaciado del contenedor */
.woocommerce-notices-wrapper {
    margin-bottom: 30px !important;
}

/* 2. El Banner (Fondo verde corporativo con degradado elegante) */
.woocommerce-notices-wrapper .woocommerce-message {
    background: linear-gradient(135deg, var(--kf-verde, #2b5e35) 0%, #1a3820 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 16px 24px 16px 75px !important; /* Dejamos mucho espacio a la izquierda para el icono */
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-shadow: 0 10px 25px rgba(43, 94, 53, 0.25) !important; /* Sombra verde difuminada */
    position: relative !important;
    overflow: hidden !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: 0.3px !important;
}

/* 3. Ocultar el icono nativo pequeño y roto de WooCommerce */
.woocommerce-notices-wrapper .woocommerce-message::before {
    display: none !important;
}

/* 4. Icono Gigante Transparente (Efecto Glassmorphism / Marca de agua) */
.woocommerce-notices-wrapper .woocommerce-message::after {
    content: '\2713'; /* El check de éxito */
    position: absolute !important;
    left: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 24px !important;
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.15) !important; /* Fondo blanco semitransparente */
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    backdrop-filter: blur(4px) !important; /* Desenfoca el fondo dándole aspecto de cristal */
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

/* 5. El Botón "Ver carrito" (Blanco de alto contraste) */
.woocommerce-notices-wrapper .woocommerce-message .button.wc-forward {
    background-color: #ffffff !important;
    color: var(--kf-verde, #2b5e35) !important;
    border: none !important;
    border-radius: 30px !important;
    padding: 12px 28px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    margin-left: 20px !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    white-space: nowrap !important;
}

/* Efecto Hover del Botón (Se vuelve negro premium) */
.woocommerce-notices-wrapper .woocommerce-message .button.wc-forward:hover {
    background-color: #111827 !important; 
    color: #ffffff !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2) !important;
}

/* 6. Adaptación para Teléfonos Móviles */
@media (max-width: 767px) {
    .woocommerce-notices-wrapper .woocommerce-message {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 20px 20px 20px 75px !important;
        gap: 15px !important;
    }
    .woocommerce-notices-wrapper .woocommerce-message .button.wc-forward {
        margin-left: 0 !important;
        width: 100% !important;
        text-align: center !important;
    }
}


/* ==========================================================================
   PÁGINA DE CARRITO B2B (DISEÑO PREMIUM A DOBLE COLUMNA)
   ========================================================================== */

/* 1. ESTRUCTURA GENERAL (Doble columna en PC) */
@media (min-width: 992px) {
    .woocommerce-cart .woocommerce {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 40px !important;
        align-items: flex-start !important;
    }
    .woocommerce-cart .woocommerce-cart-form {
        width: 65% !important;
    }
    .woocommerce-cart .cart-collaterals {
        width: 35% !important;
        position: sticky !important;
        top: 100px !important; /* Hace que el resumen baje contigo al hacer scroll */
    }
}

/* 2. TABLA DE PRODUCTOS (Limpieza total) */
.woocommerce-cart table.shop_table {
    border: none !important;
    border-collapse: collapse !important;
    width: 100% !important;
    border-radius: 0 !important;
}

/* Cabecera de la tabla */
.woocommerce-cart table.shop_table thead th {
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid var(--kf-verde, #2b5e35) !important;
    color: #111827 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding: 15px 0 !important;
    text-align: left !important;
}

/* Filas de productos */
.woocommerce-cart table.shop_table tbody td {
    border-top: none !important;
    border-bottom: 1px dashed #e5e7eb !important;
    padding: 20px 10px !important;
    vertical-align: middle !important;
}

/* Imagen del producto */
.woocommerce-cart table.shop_table .product-thumbnail img {
    width: 70px !important;
    height: 70px !important;
    object-fit: cover !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05) !important;
}

/* Nombre del producto */
.woocommerce-cart table.shop_table .product-name a {
    color: #111827 !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    display: block !important;
    line-height: 1.4 !important;
}
.woocommerce-cart table.shop_table .product-name a:hover {
    color: var(--kf-verde, #2b5e35) !important;
}

/* Precios */
.woocommerce-cart table.shop_table .product-price .amount,
.woocommerce-cart table.shop_table .product-subtotal .amount {
    color: #111827 !important;
    font-weight: 700 !important;
    font-size: 15px !important;
}

/* Botón de eliminar (Cruz) */
.woocommerce-cart table.shop_table .product-remove a {
    color: #ef4444 !important; /* Rojo alerta */
    font-weight: bold !important;
    background: #fef2f2 !important;
    width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.woocommerce-cart table.shop_table .product-remove a:hover {
    background: #ef4444 !important;
    color: #ffffff !important;
}

/* Cantidad (Ajuste de los botones +/-) */
.woocommerce-cart .quantity.buttons_added {
    display: flex !important;
    align-items: center !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 30px !important;
    overflow: hidden !important;
    width: 100px !important;
}
.woocommerce-cart .quantity.buttons_added input.qty {
    width: 40px !important;
    border: none !important;
    text-align: center !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    padding: 5px 0 !important;
    -moz-appearance: textfield !important;
}
.woocommerce-cart .quantity.buttons_added a.minus,
.woocommerce-cart .quantity.buttons_added a.plus {
    width: 30px !important;
    background: transparent !important;
    color: #4b5563 !important;
    text-align: center !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: background 0.2s !important;
}
.woocommerce-cart .quantity.buttons_added a:hover {
    background: #f3f4f6 !important;
    color: var(--kf-verde, #2b5e35) !important;
}

/* Botón Actualizar Carrito */
.woocommerce-cart .actions {
    text-align: right !important;
    padding: 20px 0 0 0 !important;
    border: none !important;
}
.woocommerce-cart .actions .button {
    background-color: #f3f4f6 !important;
    color: #4b5563 !important;
    border-radius: 30px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    padding: 10px 20px !important;
    transition: all 0.3s ease !important;
}
.woocommerce-cart .actions .button:hover {
    background-color: var(--kf-verde, #2b5e35) !important;
    color: #ffffff !important;
}


/* 3. TARJETA RESUMEN (TOTALES DEL CARRITO) */
.woocommerce-cart .cart-collaterals .cart_totals {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03) !important;
    width: 100% !important;
}

/* Título de la tarjeta */
.woocommerce-cart .cart-collaterals h2 {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #111827 !important;
    margin-top: 0 !important;
    margin-bottom: 20px !important;
    padding-bottom: 15px !important;
    border-bottom: 1px solid #e5e7eb !important;
    text-transform: uppercase !important;
}

/* Filas del resumen (Subtotal, Envío, IVA) */
.woocommerce-cart .cart-collaterals table.shop_table tr {
    display: flex !important;
    justify-content: space-between !important;
    border-bottom: 1px dashed #f3f4f6 !important;
    padding: 15px 0 !important;
}
.woocommerce-cart .cart-collaterals table.shop_table tr:last-child {
    border-bottom: none !important;
}
.woocommerce-cart .cart-collaterals table.shop_table th {
    font-weight: 500 !important;
    color: #6b7280 !important;
    padding: 0 !important;
    border: none !important;
}
.woocommerce-cart .cart-collaterals table.shop_table td {
    padding: 0 !important;
    border: none !important;
    text-align: right !important;
}

/* Fila del TOTAL FINAL */
.woocommerce-cart .cart-collaterals table.shop_table tr.order-total {
    border-top: 2px solid var(--kf-verde, #2b5e35) !important;
    margin-top: 10px !important;
    padding-top: 20px !important;
}
.woocommerce-cart .cart-collaterals table.shop_table tr.order-total th {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #111827 !important;
}
.woocommerce-cart .cart-collaterals table.shop_table tr.order-total .amount {
    font-size: 22px !important;
    font-weight: 900 !important;
    color: var(--kf-verde, #2b5e35) !important;
}

/* Botón Finalizar Compra (El Gran CTA) */
.woocommerce-cart .wc-proceed-to-checkout {
    margin-top: 25px !important;
    padding: 0 !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    display: block !important;
    width: 100% !important;
    background-color: var(--kf-verde, #2b5e35) !important;
    color: #ffffff !important;
    text-align: center !important;
    padding: 16px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 20px rgba(43, 94, 53, 0.25) !important;
    transition: all 0.3s ease !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background-color: #111827 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2) !important;
}

/* 4. ADAPTACIÓN A MÓVILES */
@media (max-width: 768px) {
    .woocommerce-cart table.shop_table th {
        display: none !important; /* Oculta las cabeceras en móvil */
    }
    .woocommerce-cart table.shop_table tr.cart_item {
        display: flex !important;
        flex-direction: column !important;
        position: relative !important;
        padding: 15px !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 8px !important;
        margin-bottom: 15px !important;
    }
    .woocommerce-cart table.shop_table td {
        padding: 5px 0 !important;
        border: none !important;
    }
    .woocommerce-cart table.shop_table .product-remove {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
    }
    .woocommerce-cart table.shop_table .product-thumbnail img {
        width: 100% !important;
        height: 150px !important;
    }
    .woocommerce-cart table.shop_table .product-name, 
    .woocommerce-cart table.shop_table .product-price {
        text-align: center !important;
    }
    .woocommerce-cart table.shop_table .product-quantity {
        display: flex !important;
        justify-content: center !important;
        margin-top: 10px !important;
    }
}

/* ==========================================================================
   FORZAR TEXTO "COMPRAR" EN EL BOTÓN DEL CARRITO
   ========================================================================== */

/* 1. Hacemos que la palabra "Checkout" se reduzca a tamaño cero (invisible) */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    font-size: 0 !important; 
}

/* 2. Inyectamos la palabra "COMPRAR" y le damos el tamaño corporativo */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button::after {
    content: 'COMPRAR' !important; 
    font-size: 16px !important; 
    font-weight: 800 !important;
    letter-spacing: 0.5px !important;
}

/* ==========================================================================
   PÁGINA DE FINALIZAR COMPRA (CHECKOUT PREMIUM B2B)
   ========================================================================== */

/* 1. LAYOUT MAESTRO (CSS Grid a dos columnas en Escritorio) */
@media (min-width: 100%) {
    form.woocommerce-checkout {
        display: grid !important;
        grid-template-columns: 1fr 450px !important; /* Columna izq fluida, Columna der fija de 450px */
        grid-column-gap: 50px !important;
        align-items: start !important;
    }
    
    /* Zona de Datos (Izquierda) */
    #customer_details {
        grid-column: 1 !important;
        grid-row: 1 / 3 !important; 
    }
    /* Quitamos el 50% por defecto de Woo para que los datos ocupen el 100% de la zona izquierda */
    .woocommerce-checkout .col2-set .col-1, 
    .woocommerce-checkout .col2-set .col-2 {
        float: none !important;
        width: 100% !important;
        margin-bottom: 30px !important;
    }

    /* Zona del Resumen y Botón (Derecha) */
    #order_review_heading {
        grid-column: 2 !important;
        grid-row: 1 !important;
        margin-top: 0 !important;
    }
    #order_review {
        grid-column: 2 !important;
        grid-row: 2 !important;
        position: sticky !important; /* El cajón de pago baja contigo al hacer scroll */
        top: 100px !important; 
    }
}

/* 2. TIPOGRAFÍA Y TÍTULOS DE SECCIÓN */
.woocommerce-checkout h3 {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #111827 !important;
    text-transform: uppercase !important;
    border-bottom: 2px solid var(--kf-verde, #2b5e35) !important;
    padding-bottom: 12px !important;
    margin-bottom: 25px !important;
    letter-spacing: 0.5px !important;
}

/* 3. DISEÑO DE LOS CAMPOS DEL FORMULARIO */
.woocommerce-checkout .form-row {
    margin-bottom: 20px !important;
}
.woocommerce-checkout .form-row label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #4b5563 !important;
    margin-bottom: 8px !important;
    display: block !important;
}
/* Inputs Premium (Fondo muy clarito, se vuelven blancos al escribir) */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
    width: 100% !important;
    background-color: #f9fafb !important;
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    padding: 14px 15px !important;
    font-size: 14px !important;
    color: #111827 !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
    background-color: #ffffff !important;
    border-color: var(--kf-verde, #2b5e35) !important;
    box-shadow: 0 0 0 4px rgba(43, 94, 53, 0.1) !important; /* Halo verde corporativo al hacer clic */
    outline: none !important;
}

/* 4. TARJETA RESUMEN DEL PEDIDO (Columna Derecha) */
#order_review {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03) !important;
}

/* Tabla del pedido */
table.woocommerce-checkout-review-order-table {
    width: 100% !important;
    border: none !important;
}
table.woocommerce-checkout-review-order-table th,
table.woocommerce-checkout-review-order-table td {
    border: none !important;
    border-bottom: 1px dashed #e5e7eb !important;
    padding: 15px 0 !important;
    background: transparent !important;
}
table.woocommerce-checkout-review-order-table th {
    font-weight: 600 !important;
    color: #6b7280 !important;
    text-align: left !important;
}
table.woocommerce-checkout-review-order-table td {
    text-align: right !important;
    font-weight: 700 !important;
    color: #111827 !important;
}
table.woocommerce-checkout-review-order-table .product-name {
    font-size: 13px !important;
    font-weight: 500 !important;
}
table.woocommerce-checkout-review-order-table .product-quantity {
    font-weight: 800 !important;
    color: var(--kf-verde, #2b5e35) !important;
}
/* Total Fuerte */
table.woocommerce-checkout-review-order-table tr.order-total th,
table.woocommerce-checkout-review-order-table tr.order-total td {
    border-top: 2px solid var(--kf-verde, #2b5e35) !important;
    border-bottom: none !important;
    padding-top: 20px !important;
    font-size: 16px !important;
}
table.woocommerce-checkout-review-order-table tr.order-total td .amount {
    color: var(--kf-verde, #2b5e35) !important;
    font-size: 24px !important;
    font-weight: 900 !important;
}

/* 5. ZONA DE PAGO (Pasarela, Transferencia, etc.) */
#payment {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin-top: 20px !important;
}
#payment ul.payment_methods {
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: 20px !important;
    background: #f9fafb !important;
}
/* Caja descriptiva del método de pago */
#payment div.payment_box {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: 15px !important;
    color: #4b5563 !important;
    font-size: 13px !important;
    margin-top: 15px !important;
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.02) !important;
}
#payment div.payment_box::before {
    display: none !important; /* Quita el triángulo por defecto que trae Woo */
}

/* 6. POLÍTICA DE PRIVACIDAD Y CONDICIONES */
.woocommerce-terms-and-conditions-wrapper {
    margin-top: 20px !important;
    font-size: 13px !important;
    color: #4b5563 !important;
}
.woocommerce-terms-and-conditions {
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.02) !important;
}

/* 7. EL BOTÓN FINAL (CTA GIGANTE) */
#payment #place_order {
    display: block !important;
    width: 100% !important;
    background-color: var(--kf-verde, #2b5e35) !important;
    color: #ffffff !important;
    text-align: center !important;
    padding: 18px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 20px rgba(43, 94, 53, 0.25) !important;
    transition: all 0.3s ease !important;
    margin-top: 25px !important;
}
#payment #place_order:hover {
    background-color: #111827 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2) !important;
}

/* 8. ADAPTACIÓN A MÓVILES */
@media (max-width: 991px) {
    form.woocommerce-checkout {
        display: block !important;
    }
    #order_review {
        margin-top: 30px !important;
    }
}

/* Estilo para el botón de "Regístrate para ver precios" */
.btn-registro-precios {
    display: inline-block;
    background-color: transparent;
    color: var(--kf-verde, #2b5e35) !important;
    padding: 8px 12px;
    border: 2px solid var(--kf-verde, #2b5e35);
    border-radius: 5px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: all 0.3s ease;
}

.btn-registro-precios:hover {
    background-color: var(--kf-verde, #2b5e35);
    color: #ffffff !important;
    box-shadow: 0 4px 10px rgba(43, 94, 53, 0.2);
}

/* ==========================================================================
   NUEVO LOGIN PREMIUM KIDEFLOR: CENTRADO Y ACCESIBLE
   ========================================================================== */

/* 1. CONTENEDOR MAESTRO: Centrado absoluto y fondo sutil */
.woocommerce-account .woocommerce {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px !important;
    min-height: 70vh;
}

/* 2. LA TARJETA DE ACCESO */
.woocommerce-form-login.login {
    width: 100% !important;
    max-width: 450px !important;
    background: #ffffff !important;
    padding: 45px !important;
    border-radius: 20px !important;
    box-shadow: 0 20px 50px rgba(0,0,0,0.08) !important;
    border: 1px solid rgba(0,0,0,0.03) !important;
    float: none !important;
    margin: 0 auto !important;
}

/* 3. RE-ESTILIZAR TÍTULO (Usando el H2 de WooCommerce) */
.woocommerce-account h2 {
    font-family: 'Montserrat', sans-serif; /* O la corporativa que uses */
    font-weight: 800 !important;
    font-size: 28px !important;
    color: #1a1a1a !important;
    text-align: center;
    letter-spacing: -0.5px;
}

/* 4. CAMPOS DE ENTRADA Y LABELS */
.woocommerce-form-row label {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #374151 !important;
    margin-bottom: 10px !important;
    display: block;
}

.woocommerce-Input--text.input-text {
    height: 55px !important;
    background: #f3f4f6 !important;
    border: 2px solid transparent !important;
    border-radius: 12px !important;
    padding: 0 20px !important;
    font-size: 15px !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
}

.woocommerce-Input--text.input-text:focus {
    background: #ffffff !important;
    border-color: var(--kf-verde, #2b5e35) !important;
    box-shadow: 0 10px 20px rgba(43, 94, 53, 0.05) !important;
    outline: none !important;
}

/* 5. EL ICONO "MOSTRAR CONTRASEÑA" */
.password-input {
    display: block !important;
    position: relative !important;
}

.show-password-input {
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #9ca3af !important;
    cursor: pointer !important;
    background: none !important;
    border: none !important;
    padding: 5px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.show-password-input::after {
    font-family: 'Dashicons' !important; /* Icono nativo de WP */
    content: "\f177" !important;
    font-size: 20px !important;
}

/* 6. RECUÉRDAME Y BOTÓN */
.woocommerce-form-login__rememberme {
    margin-top: 15px !important;
    margin-bottom: 25px !important;
    display: flex !important;
    align-items: center;
    gap: 10px;
    font-size: 14px !important;
    color: #6b7280 !important;
    cursor: pointer;
}

.woocommerce-form-login__submit {
    width: 100% !important;
    height: 55px !important;
    background-color: var(--kf-verde, #2b5e35) !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    border: none !important;
}

.woocommerce-form-login__submit:hover {
    background-color: #111827 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 15px 30px rgba(0,0,0,0.15) !important;
}

/* 7. ENLACE OLVIDO */
.lost_password {
    margin-top: 25px !important;
    text-align: center !important;
}

.lost_password a {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--kf-verde, #2b5e35) !important;
    text-decoration: none !important;
    opacity: 0.8;
}

.lost_password a:hover {
    opacity: 1;
    text-decoration: underline !important;
}


/* Responsivo */
@media (max-width: 480px) {
    .woocommerce-form-login.login {
        padding: 30px 20px !important;
    }
}

/* ==========================================================================
   SOLUCIÓN DEFINITIVA ICONO PASSWORD (SVG INJECTED)
   ========================================================================== */

/* Contenedor del input de password */
.password-input {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

/* El botón que genera WooCommerce */
.show-password-input {
    position: absolute !important;
    top: 50% !important;
    right: 15px !important;
    transform: translateY(-50%) !important;
    width: 24px !important;
    height: 24px !important;
    cursor: pointer !important;
    z-index: 10 !important;
    border: none !important;
    background: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Ocultamos cualquier texto o icono previo que intente poner Woo */
.show-password-input::before,
.show-password-input::after {
    content: "" !important;
    position: absolute !important;
    width: 20px !important;
    height: 20px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    transition: opacity 0.2s ease !important;
}

/* Icono OJO ABIERTO (Estado por defecto) */
.show-password-input::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%239ca3af'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M15 12a3 3 0 11-6 0 3 3 0 016 0z' /%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z' /%3E%3C/svg%3E") !important;
}

/* Icono OJO CERRADO (Cuando está activo/mostrando) */
.show-password-input.display-password::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232b5e35'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.542-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l18 18' /%3E%3C/svg%3E") !important;
}

/* Ajuste del padding del input para que el texto no choque con el ojo */
.woocommerce-Input[type="password"],
.woocommerce-Input[type="text"]#password {
    padding-right: 50px !important;
}

/* ==========================================================================
   DISEÑO DUAL: ACCESO Y REGISTRO PROFESIONAL (KIDEFLOR)
   ========================================================================== */

/* 1. CONTENEDOR DE DOBLE COLUMNA */
.woocommerce-account .u-columns.col2-set {
    display: flex !important;
    gap: 40px;
    max-width: 1000px !important; /* Más ancho para albergar ambos */
    margin: 40px auto !important;
    background: transparent !important;
}

/* 2. ESTILO PARA CADA TARJETA (Acceso y Registro) */
.woocommerce-account .u-column1, 
.woocommerce-account .u-column2 {
    flex: 1;
    background: #ffffff !important;
    padding: 40px !important;
    border-radius: 20px !important;
    box-shadow: 0 15px 40px rgba(0,0,0,0.06) !important;
    border: 1px solid rgba(0,0,0,0.03) !important;
    display: flex;
    flex-direction: column;
}

/* 3. TÍTULOS H2 (Acceder y Registrarse) */
.woocommerce-account h2 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800 !important;
    font-size: 24px !important;
    color: #1a1a1a !important;
    margin-bottom: 30px !important;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* 4. CAMPOS DE ENTRADA (INPUTS) */
.woocommerce-form-row label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #4b5563 !important;
    margin-bottom: 8px !important;
}

.woocommerce-Input--text.input-text {
    height: 50px !important;
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    padding: 0 15px !important;
    font-size: 15px !important;
    transition: all 0.3s ease !important;
}

.woocommerce-Input--text.input-text:focus {
    background: #ffffff !important;
    border-color: var(--kf-verde, #2b5e35) !important;
    box-shadow: 0 0 0 4px rgba(43, 94, 53, 0.08) !important;
    outline: none !important;
}

/* 5. BOTONES (Acceso y Registro) */
.woocommerce-form-login__submit,
.woocommerce-form-register__submit {
    width: 100% !important;
    height: 52px !important;
    background-color: var(--kf-verde, #2b5e35) !important;
    color: #fff !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border: none !important;
    margin-top: 15px !important;
    transition: all 0.3s ease !important;
}

.woocommerce-form-login__submit:hover,
.woocommerce-form-register__submit:hover {
    background-color: #111827 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
}

/* 6. TEXTO INFORMATIVO DE PRIVACIDAD EN REGISTRO */
.woocommerce-privacy-policy-text {
    font-size: 12px !important;
    color: #9ca3af !important;
    line-height: 1.5 !important;
    margin: 20px 0 !important;
    text-align: justify;
}

/* 7. ADAPTACIÓN PARA MÓVILES */
@media (max-width: 900px) {
    .woocommerce-account .u-columns.col2-set {
        flex-direction: column;
        align-items: center;
    }
    .woocommerce-account .u-column1, 
    .woocommerce-account .u-column2 {
        width: 100% !important;
        max-width: 450px !important;
    }
}

/* Estilo para el enlace de "olvidaste contraseña" centrado */
.lost_password {
    text-align: center;
    margin-top: 15px;
}

.lost_password a {
    font-size: 13px;
    color: #6b7280;
    text-decoration: none;
}

.lost_password a:hover {
    color: var(--kf-verde, #2b5e35);
}
/* Contenedor del check de privacidad */
.kf-privacy-container {
    margin: 20px 0 !important;
    padding: 15px !important;
    background: #f9fafb;
    border-radius: 10px;
    border: 1px inset rgba(0,0,0,0.02);
}

/* Forzar que el cuadradito sea visible y grande */
.kf-privacy-container input[type="checkbox"] {
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
    width: 18px !important;
    height: 18px !important;
    margin-right: 10px !important;
    cursor: pointer !important;
    display: inline-block !important;
    vertical-align: middle !important;
    accent-color: var(--kf-verde, #2b5e35) !important;
}

/* Estilo del texto */
.kf-privacy-container label {
    display: inline !important;
    font-size: 14px !important;
    color: #4b5563 !important;
    cursor: pointer;
}

.kf-privacy-container .required {
    color: #e11d48 !important;
    margin-left: 4px;
}


/* ==========================================================================
   REDISEÑO B2B PREMIUM "MI CUENTA" - KIDEFLOR (CSS GRID)
   ========================================================================== */
:root {
    --kf-verde: #2b5e35;
    --kf-verde-hover: #1e4225;
    --kf-fondo-app: #f4f6f8;
    --kf-blanco: #ffffff;
    --kf-texto-oscuro: #1f2937;
    --kf-texto-claro: #6b7280;
    --kf-borde: #e5e7eb;
}

/* 1. CONTENEDOR PRINCIPAL: Grid a prueba de balas */
.woocommerce-account .woocommerce {
    display: grid !important;
    grid-template-columns: 280px minmax(0, 1fr) !important; /* Columna fija izq, fluido dcha */
    gap: 40px !important;
    max-width: 1200px !important;
    margin: 50px auto !important;
    align-items: flex-start !important;
}

/* Anular los "clearfix" de Astra que rompen el diseño a 2 columnas */
.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after {
    display: none !important;
}

.woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-content {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
}

/* -----------------------------------------
   2. MENÚ LATERAL (Estilo Dashboard App)
   ----------------------------------------- */
.woocommerce-MyAccount-navigation {
    background: var(--kf-blanco);
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    border: 1px solid var(--kf-borde);
    overflow: hidden;
    position: sticky; /* Se queda fijo al hacer scroll */
    top: 100px;
}

.woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 10px !important;
    margin: 0 !important;
}

.woocommerce-MyAccount-navigation ul li {
    margin-bottom: 5px;
}

.woocommerce-MyAccount-navigation ul li:last-child {
    margin-bottom: 0;
    margin-top: 15px;
    border-top: 1px solid var(--kf-borde);
    padding-top: 15px;
}

.woocommerce-MyAccount-navigation ul li a {
    display: flex;
    align-items: center;
    padding: 14px 20px;
    color: var(--kf-texto-claro);
    font-weight: 600;
    font-size: 15px;
    text-decoration: none !important;
    border-radius: 10px;
    transition: all 0.3s ease;
}

/* Iconos de FontAwesome */
.woocommerce-MyAccount-navigation ul li a::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 15px;
    font-size: 18px;
    width: 24px;
    text-align: center;
    transition: all 0.3s ease;
}

.woocommerce-MyAccount-navigation-link--dashboard a::before { content: "\f3fd"; } /* Icono panel */
.woocommerce-MyAccount-navigation-link--orders a::before { content: "\f468"; } /* Icono cajas */
.woocommerce-MyAccount-navigation-link--edit-address a::before { content: "\f3c5"; } /* Icono mapa */
.woocommerce-MyAccount-navigation-link--edit-account a::before { content: "\f2c2"; } /* Icono tarjeta id */
.woocommerce-MyAccount-navigation-link--customer-logout a::before { content: "\f2f5"; color: #ef4444; } /* Icono salir rojo */

/* Estado Activo y Hover */
.woocommerce-MyAccount-navigation ul li.is-active a {
    background: rgba(43, 94, 53, 0.08); /* Fondo verde muy suave */
    color: var(--kf-verde) !important;
}

.woocommerce-MyAccount-navigation ul li a:hover {
    background: var(--kf-fondo-app);
    color: var(--kf-texto-oscuro) !important;
}

.woocommerce-MyAccount-navigation ul li.is-active a::before {
    color: var(--kf-verde);
}

/* -----------------------------------------
   3. ÁREA DE CONTENIDO (Tarjetas B2B)
   ----------------------------------------- */
.woocommerce-MyAccount-content {
    background: var(--kf-blanco);
    padding: 45px!important;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    border: 1px solid var(--kf-borde);
}

.woocommerce-MyAccount-content h3,
.woocommerce-MyAccount-content legend {
    font-family: 'Oswald', sans-serif !important;
    font-size: 26px !important;
    color: var(--kf-texto-oscuro);
    margin-bottom: 30px;
    border-bottom: 2px solid var(--kf-verde);
    padding-bottom: 12px;
    display: inline-block;
}

.woocommerce-MyAccount-content p {
    color: var(--kf-texto-claro);
    font-size: 16px;
    line-height: 1.6;
}

/* Enlaces dentro del contenido */
.woocommerce-MyAccount-content a {
    color: var(--kf-verde);
    font-weight: 600;
    text-decoration: none;
    transition: color 0.3s ease;
}

.woocommerce-MyAccount-content a:hover {
    color: var(--kf-verde-hover);
    text-decoration: underline;
}

/* Botones Premium (Negros/Verdes) */
.woocommerce-MyAccount-content .button {
    background-color: var(--kf-texto-oscuro) !important;
    color: var(--kf-blanco) !important;
    border-radius: 8px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    border: none !important;
    transition: all 0.3s ease !important;
}

.woocommerce-MyAccount-content .button:hover {
    background-color: var(--kf-verde) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(43, 94, 53, 0.2);
}

/* -----------------------------------------
   4. DISEÑO RESPONSIVE (Móvil y Tablet)
   ----------------------------------------- */
@media (max-width: 900px) {
    /* Rompemos el Grid a 1 sola columna para móvil */
    .woocommerce-account .woocommerce {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
        margin: 20px auto !important;
    }
    
    .woocommerce-MyAccount-navigation {
        position: relative;
        top: 0;
    }

    /* Convertimos el menú en un slider horizontal o botones apilados */
    .woocommerce-MyAccount-navigation ul {
        display: flex;
        flex-wrap: wrap;
        padding: 5px !important;
    }

    .woocommerce-MyAccount-navigation ul li {
        width: 50%;
        margin: 0;
        padding: 5px;
    }

    .woocommerce-MyAccount-navigation ul li:last-child {
        border-top: none;
        padding-top: 5px;
    }

    .woocommerce-MyAccount-navigation ul li a {
        flex-direction: column;
        justify-content: center;
        text-align: center;
        padding: 15px 10px;
        font-size: 13px;
        background: var(--kf-fondo-app);
    }

    .woocommerce-MyAccount-navigation ul li a::before {
        margin-right: 0;
        margin-bottom: 10px;
        font-size: 20px;
    }
    
    .woocommerce-MyAccount-content {
        padding: 25px;
    }
}

.woocommerce-MyAccount-content-wrapper{border:none!important;}
.woocommerce-account .woocommerce {
  margin: 0px !important;
	padding: 0!important;
}

/* ==========================================================================
   DISEÑO DEL CARRITO (CART) B2B - KIDEFLOR (ESTRUCTURA DE COLUMNAS)
   ========================================================================== */

/* 1. LIBERAR EL CONTENEDOR DE ELEMENTOR */
/* Forzamos a que el widget del carrito ocupe todo el ancho disponible sin ser aplastado */
.elementor-widget-wc-elements .woocommerce {
    width: 100% !important;
    max-width: 1200px;
    margin: 0 auto;
}

/* 2. ZONA DE AVISOS A ANCHO COMPLETO (FILA 1) */
/* El mensaje de error de pedido mínimo ocupará el 100% de la parte superior */
.woocommerce-cart .woocommerce-notices-wrapper {
    width: 100% !important;
    flex-basis: 100% !important;
    margin-bottom: 30px;
}

/* Estilo corporativo para el error de pedido mínimo */
.woocommerce-cart .woocommerce-error {
    border-left: 5px solid #dc2626 !important; /* Rojo corporativo */
    background: #fef2f2 !important;
    padding: 20px 20px 20px 50px !important;
    color: #991b1b !important;
    border-radius: 8px;
    list-style: none;
    font-size: 16px;
    position: relative;
    box-shadow: 0 4px 15px rgba(220, 38, 38, 0.1);
}

.woocommerce-cart .woocommerce-error::before {
    content: "\f071"; /* Icono FontAwesome de Alerta */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    left: 20px;
    color: #dc2626;
    font-size: 20px;
}

/* 3. ESTRUCTURA A DOS COLUMNAS (FILA 2) */
/* Utilizamos CSS Grid para forzar una proporción 65% (Productos) - 35% (Totales) */
@media (min-width: 900px) {
    .woocommerce-cart .woocommerce {
        display: grid !important;
        grid-template-columns: 2fr 1fr; /* 2 fracciones para la tabla, 1 fracción para el total */
        gap: 40px;
        align-items: start;
    }
    
    /* Le decimos a la tabla de productos que vaya a la izquierda */
    .woocommerce-cart .woocommerce-cart-form {
        grid-column: 1 / 2;
        width: 100% !important;
        margin: 0 !important;
        float: none !important;
    }
    
    /* Le decimos a los totales del carrito que vayan a la derecha */
    .woocommerce-cart .cart-collaterals {
        grid-column: 2 / 3;
        width: 100% !important;
        margin: 0 !important;
        float: none !important;
    }
}

/* 4. MEJORA VISUAL DE LAS TABLAS */

/* Tabla de productos (Izquierda) */
.woocommerce-cart-form table.shop_table {
    border: 1px solid var(--kf-borde, #e5e7eb) !important;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.02);
    overflow: hidden; /* Para que las esquinas redondeadas funcionen */
}

.woocommerce-cart-form table.shop_table th {
    background-color: var(--kf-gris-fondo, #f9fafb);
    padding: 15px !important;
    text-transform: uppercase;
    font-size: 13px;
    border-bottom: 2px solid var(--kf-borde, #e5e7eb) !important;
}

.woocommerce-cart-form table.shop_table td {
    padding: 20px 15px !important;
    vertical-align: middle;
}

/* Caja de Totales (Derecha) */
.cart-collaterals .cart_totals {
    background: var(--kf-gris-fondo, #f9fafb);
    padding: 30px !important;
    border-radius: 12px;
    border: 1px solid var(--kf-verde, #2b5e35);
    box-shadow: 0 10px 30px rgba(43, 94, 53, 0.05);
}

.cart-collaterals .cart_totals h2 {
    font-family: 'Oswald', sans-serif !important;
    font-size: 24px;
    color: var(--kf-texto-oscuro, #111827);
    margin-bottom: 20px;
    border-bottom: 2px solid var(--kf-verde, #2b5e35);
    padding-bottom: 10px;
}

/* Botón de Finalizar Compra */
.cart-collaterals .checkout-button {
    background-color: var(--kf-verde, #2b5e35) !important;
    color: white !important;
    font-size: 16px !important;
    padding: 15px 20px !important;
    border-radius: 8px !important;
    width: 100%;
    text-align: center;
    transition: all 0.3s ease;
    margin-top: 20px;
    display: block;
}

.cart-collaterals .checkout-button:hover {
    background-color: var(--kf-verde-hover, #1e4225) !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(43, 94, 53, 0.3);
}

/* 5. RESPONSIVE (Móviles) */
@media (max-width: 899px) {
    .woocommerce-cart .woocommerce {
        display: flex !important;
        flex-direction: column;
    }
    
    .woocommerce-cart .woocommerce-cart-form,
    .woocommerce-cart .cart-collaterals {
        width: 100% !important;
    }
}

/* ==========================================================================
   DISEÑO TABLA DETALLES DEL PEDIDO (FICHA DEL PRODUCTO COMPRADO)
   ========================================================================== */

.woocommerce-order-details table.shop_table {
    border: none !important;
    background: transparent !important;
    border-collapse: separate !important;
    border-spacing: 0 15px !important; /* Espacio entre filas para efecto "Tarjeta" */
}

/* Cabecera de la tabla */
.woocommerce-order-details table.shop_table thead th {
    background: var(--kf-gris-fondo, #f9fafb) !important;
    color: var(--kf-texto-oscuro, #111827) !important;
    font-family: 'Oswald', sans-serif;
    font-size: 16px !important;
    text-transform: uppercase;
    border: none !important;
    padding: 15px 20px !important;
}

.woocommerce-order-details table.shop_table thead th:first-child { border-radius: 8px 0 0 8px; }
.woocommerce-order-details table.shop_table thead th:last-child { border-radius: 0 8px 8px 0; }

/* Filas de Producto (Efecto Tarjeta) */
.woocommerce-order-details table.shop_table tbody tr.woocommerce-table__line-item {
    background: #ffffff;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    border-radius: 12px;
}

.woocommerce-order-details table.shop_table tbody td {
    border: 1px solid var(--kf-borde, #e5e7eb) !important;
    border-style: solid none solid none !important;
    padding: 20px !important;
    vertical-align: top;
}

.woocommerce-order-details table.shop_table tbody td:first-child { 
    border-left: 1px solid var(--kf-borde, #e5e7eb) !important; 
    border-radius: 12px 0 0 12px; 
}
.woocommerce-order-details table.shop_table tbody td:last-child { 
    border-right: 1px solid var(--kf-borde, #e5e7eb) !important; 
    border-radius: 0 12px 12px 0; 
    font-weight: 700;
    font-size: 18px;
    color: var(--kf-verde, #2b5e35);
    text-align: right;
    vertical-align: middle;
}

/* Estructura Nombre e Imagen */
.kf-order-product-name {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.kf-order-img {
    border-radius: 8px;
    margin-right: 15px;
    border: 1px solid var(--kf-borde, #e5e7eb);
    object-fit: cover;
}

.kf-order-title {
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    color: var(--kf-texto-oscuro, #111827);
    text-decoration: none;
}

.kf-order-title a { color: var(--kf-texto-oscuro, #111827); }
.kf-order-title a:hover { color: var(--kf-verde, #2b5e35); }

/* Características nativas (Color, Formato...) convertidas en píldoras */
.woocommerce-order-details ul.wc-item-meta {
    list-style: none !important;
    padding: 0 !important;
    margin: 10px 0 15px 0 !important;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.woocommerce-order-details ul.wc-item-meta li {
    background: var(--kf-gris-fondo, #f9fafb);
    border: 1px solid var(--kf-borde, #e5e7eb);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 13px;
    color: var(--kf-texto-claro, #4b5563);
    margin: 0 !important;
    display: flex;
    align-items: center;
}

.woocommerce-order-details ul.wc-item-meta li strong {
    color: var(--kf-texto-oscuro, #111827);
    margin-right: 5px;
    font-weight: 600;
}

.woocommerce-order-details ul.wc-item-meta li p { margin: 0 !important; }

/* Descripción Corta */
.kf-order-desc {
    font-size: 14px;
    color: #6b7280;
    margin-bottom: 15px;
    font-style: italic;
    border-left: 3px solid var(--kf-borde, #e5e7eb);
    padding-left: 10px;
}

/* Bloque de Matemáticas (Cant. y Precio ud.) */
.kf-order-math {
    display: flex;
    gap: 15px;
    margin-top: 15px;
}

.kf-math-tag {
    display: inline-block;
    background: #ecfdf5; /* Verde corporativo hiper claro */
    color: #065f46;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 13px;
    border: 1px solid #a7f3d0;
}

.kf-math-tag i { margin-right: 5px; opacity: 0.7; }

/* -----------------------------------------
   RESPONSIVE MÓVIL (Detalles del Pedido)
   ----------------------------------------- */
@media (max-width: 768px) {
    .woocommerce-order-details table.shop_table thead { display: none; }
    .woocommerce-order-details table.shop_table tbody td { display: block; width: 100% !important; border: 1px solid var(--kf-borde, #e5e7eb) !important; border-radius: 0 !important; }
    .woocommerce-order-details table.shop_table tbody td:first-child { border-bottom: none !important; border-radius: 12px 12px 0 0 !important; }
    .woocommerce-order-details table.shop_table tbody td:last-child { border-top: none !important; border-radius: 0 0 12px 12px !important; text-align: left; background: var(--kf-gris-fondo, #f9fafb); }
    .woocommerce-order-details table.shop_table tbody td:last-child::before { content: "Subtotal: "; color: var(--kf-texto-claro, #6b7280); font-weight: normal; font-size: 14px; }
}


/* ==========================================================================
   DISEÑO MINI-CARRITO B2B: CSS GRID ESTRUCTURADO (ANTI-APLASTAMIENTO)
   ========================================================================== */

/* 1. Contenedor Principal: Medida exacta para que no agobie */
.elementor-menu-cart__main {
    background-color: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1) !important;
    border: 1px solid var(--kf-borde, #e5e7eb) !important;
    border-top: 4px solid var(--kf-verde, #2b5e35) !important;
    width: 360px !important; /* Ancho perfecto para leer bien */
}

/* 2. Área de la lista de productos */
.elementor-menu-cart__products {
    padding: 20px !important;
    max-height: 55vh !important;
}

/* 3. EL TRUCO DE MAGIA: CSS GRID AREAS */
.elementor-menu-cart__product {
    padding: 15px 0 !important;
    border-bottom: 1px solid var(--kf-borde, #e5e7eb) !important;
    
    /* Dibujamos la cuadrícula de hierro */
    display: grid !important;
    grid-template-columns: 75px 1fr 24px !important; /* Col 1: Foto | Col 2: Textos (Flexible) | Col 3: Botón X */
    grid-template-rows: auto auto !important; /* Fila 1: Título | Fila 2: Precio */
    grid-template-areas:
        "imagen titulo borrar"
        "imagen precio borrar" !important;
    
    column-gap: 15px !important;
    row-gap: 6px !important;
    align-items: center !important;
}

.elementor-menu-cart__product:last-child {
    border-bottom: none !important;
}

/* 4. Asignamos cada elemento suelto a su posición exacta en el mapa */

/* A. La Imagen a la izquierda */
.elementor-menu-cart__product-image {
    grid-area: imagen !important;
    width: 100% !important;
    margin: 0 !important; /* Reseteamos márgenes de Elementor */
}

.elementor-menu-cart__product-image img {
    border-radius: 8px !important;
    border: 1px solid var(--kf-borde, #e5e7eb) !important;
    width: 75px !important;
    height: 75px !important;
    object-fit: cover !important;
}

/* B. El Título en el centro arriba */
.elementor-menu-cart__product-name {
    grid-area: titulo !important;
    align-self: end !important; /* Lo empuja un poco hacia abajo para juntarlo al precio */
    margin: 0 !important;
}

.elementor-menu-cart__product-name a {
    font-family: 'Oswald', sans-serif !important;
    font-size: 15px !important;
    color: var(--kf-texto-oscuro, #111827) !important;
    line-height: 1.3 !important;
    display: block !important;
    transition: color 0.2s ease !important;
    /* Evita que un título súper largo rompa el diseño (lo corta en la 2ª línea) */
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.elementor-menu-cart__product-name a:hover {
    color: var(--kf-verde, #2b5e35) !important;
}

/* C. El Precio y Cantidad en el centro abajo */
.elementor-menu-cart__product-price {
    grid-area: precio !important;
    align-self: start !important; /* Lo empuja hacia arriba cerca del título */
    margin: 0 !important;
    font-size: 14px !important;
    color: var(--kf-texto-claro, #6b7280) !important;
}

.elementor-menu-cart__product-price .product-quantity {
    font-weight: 600 !important;
    color: var(--kf-texto-oscuro, #111827) !important;
    margin-right: 5px !important;
}

.elementor-menu-cart__product-price .amount {
    color: var(--kf-verde, #2b5e35) !important;
    font-weight: 700 !important;
    font-size: 16px !important;
}

/* D. El botón de borrar (X) a la derecha */
.elementor-menu-cart__product-remove {
    grid-area: borrar !important;
    justify-self: end !important; /* Lo pega a la derecha del todo */
    margin: 0 !important;
}

.elementor-menu-cart__product-remove a {
    color: #ef4444 !important;
    font-size: 18px !important;
    display: block !important;
    transition: transform 0.2s ease !important;
}

.elementor-menu-cart__product-remove a:hover {
    transform: scale(1.2) !important;
}

/* 5. Zona de Subtotal */
.elementor-menu-cart__subtotal {
    background-color: var(--kf-gris-fondo, #f9fafb) !important;
    padding: 15px 20px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-top: 1px solid var(--kf-borde, #e5e7eb) !important;
    font-family: 'Oswald', sans-serif !important;
    font-size: 18px !important;
    color: var(--kf-texto-oscuro, #111827) !important;
}

.elementor-menu-cart__subtotal .amount {
    color: var(--kf-verde, #2b5e35) !important;
    font-weight: 700 !important;
}

/* 6. Zona de Botones */
.elementor-menu-cart__footer-buttons {
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    background: #ffffff !important;
}

.elementor-menu-cart__footer-buttons .elementor-button {
    font-family: 'Oswald', sans-serif !important;
    text-transform: uppercase !important;
    font-size: 15px !important;
    letter-spacing: 0.5px !important;
    padding: 12px !important;
    border-radius: 6px !important;
    text-align: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--view-cart {
    background: transparent !important;
    color: var(--kf-texto-oscuro, #111827) !important;
    border: 1px solid #d1d5db !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover {
    background: var(--kf-gris-fondo, #f9fafb) !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--checkout {
    background: var(--kf-verde, #2b5e35) !important;
    color: #ffffff !important;
    border: none !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--checkout:hover {
    background: var(--kf-verde-hover, #1e4225) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(43, 94, 53, 0.2) !important;
}

/* ==========================================================================
   DISEÑO WIDGET ENVÍO GRATIS: ACCESIBLE (AA), MODERNO Y VISUAL
   ========================================================================== */

/* Contenedor principal: Flexbox para alinear icono y contenido */
.kf-widget-envio {
    display: flex !important;
    gap: 20px !important;
    background-color: #ffffff !important;
    border: 0px solid var(--kf-borde, #e5e7eb) !important;
    border-radius: 12px !important;
    padding: 4px !important;
    margin-bottom: 25px !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0) !important;
    align-items: center !important;
}

/* Icono destacado a la izquierda */
.kf-widget-icono {
    width: 50px !important;
    height: 50px !important;
    flex-shrink: 0 !important;
    background-color: #f3f4f6 !important; /* Gris muy suave */
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.kf-widget-icono i {
    font-size: 22px !important;
    color: #4b5563 !important; /* Gris oscuro para el camión */
}

/* Icono en estado de éxito */
.kf-widget-icono.exito { background-color: #ecfdf5 !important; }
.kf-widget-icono.exito i { color: #047857 !important; }

/* Contenedor del texto y la barra */
.kf-widget-contenido {
    flex-grow: 1 !important;
    width: 100% !important;
}

/* Texto principal */
.kf-widget-texto {
    font-family: 'Oswald', sans-serif !important;
    font-size: 14px !important;
    color: #374151 !important; /* Gris muy oscuro, casi negro (Alto contraste) */
    line-height: 1.2 !important;
    margin-bottom: 12px !important;
}

.kf-widget-texto strong {
    color: #111827 !important; /* Negro puro para los datos clave */
    font-weight: 600 !important;
    font-size: 14px !important;
}

.kf-widget-texto.exito strong { color: #047857 !important; } /* Verde oscuro AA */

/* Pista de la barra de progreso (Fondo) */
.kf-widget-track {
    width: 100% !important;
    height: 5px !important; /* Más gruesa para mejor visibilidad */
    background-color: #e5e7eb !important;
    border-radius: 6px !important;
    overflow: hidden !important;
}

/* Relleno de la barra de progreso */
.kf-widget-progreso {
    height: 100% !important;
    background-color: #047857 !important; /* Verde oscuro que cumple contraste AA sobre blanco/gris */
    border-radius: 6px !important;
    transition: width 0.5s ease-in-out !important;
}

/* Etiquetas de inicio y fin (Contexto visual) */
.kf-widget-etiquetas {
    display: flex !important;
    justify-content: space-between !important;
    margin-top: 8px !important;
    font-size: 13px !important;
    color: #6b7280 !important;
    font-weight: 500 !important;
}

.kf-widget-etiquetas span.exito {
    color: #047857 !important;
    font-weight: 700 !important;
}

/* Eliminar el icono nativo de WooCommerce que suele dar problemas */
.cart-empty.woocommerce-info::before {
    display: none !important;
}

/* Rediseño del contenedor del mensaje */
.cart-empty.woocommerce-info {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-top: 4px solid var(--kf-verde, #2b5e35) !important;
    color: #111827 !important; /* Gris casi negro para máxima legibilidad */
    padding: 40px 20px !important;
    border-radius: 8px !important;
    text-align: center !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    margin: 40px 0 !important;
    list-style: none !important; /* Por si el tema lo trata como lista */
}

/* Ajuste del botón de retorno */
.return-to-shop {
    text-align: center !important;
    margin-bottom: 50px !important;
}

.return-to-shop .button {
    background-color: var(--kf-verde, #2b5e35) !important;
    color: #ffffff !important;
    padding: 16px 32px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-block !important;
    transition: background 0.3s ease !important;
}

.return-to-shop .button:hover {
    background-color: #1a3d22 !important;
}


/* Resaltar la línea de Recargo de Equivalencia en el carrito y checkout */
.tax-total[class*="re-"] th, 
.tax-total[class*="re-"] td {
    background-color: #f0fdf4 !important; /* Un verde muy suave para indicar que es un impuesto especial */
    font-weight: bold !important;
    color: #166534 !important;
}

/* Añadir una pequeña nota informativa bajo el total si hay RE */
.kf-re-info-note {
    font-size: 12px;
    color: #6b7280;
    margin-top: 10px;
    font-style: italic;
}

/* ==========================================================================
   KIDEFLOR B2B - ESTILO LÍNEA RECARGO DE EQUIVALENCIA
   ========================================================================== */

/* Resalta la línea del cargo extra en el carrito y en el checkout */
table.shop_table tr.fee th,
table.shop_table tr.fee td {
    background-color: #f0fdf4 !important; /* Fondo verde muy suave y limpio */
    color: #166534 !important; /* Verde oscuro corporativo Kideflor */
    border-top: 1px solid #dcfce7 !important;
    border-bottom: 1px solid #dcfce7 !important;
}

table.shop_table tr.fee th {
    font-weight: 600 !important;
}

table.shop_table tr.fee td .amount {
    font-weight: bold !important;
}

/*===================== responsive ===========================================================================*/


@media screen and (max-width:1620px) {
	
	
}


@media screen and (max-width:1200px) {
	
   
}


@media screen and (max-width:770px) {
   
    
}


@media screen and (max-width:768px) {
	
	
}


@media screen and (max-width:500px) {
	

}

