:root {
	--wd-text-font: "Quicksand", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: rgb(34,34,34);
	--wd-text-font-size: 15px;
	--wd-title-font: "Quicksand", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 500;
	--wd-title-color: rgb(53,53,53);
	--wd-entities-title-font: "Quicksand", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: rgb(36,36,36);
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Quicksand", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Quicksand", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 500;
	--wd-widget-title-transform: capitalize;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Quicksand", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 600;
	--wd-header-el-transform: uppercase;
	--wd-header-el-font-size: 14px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(8,38,74);
	--wd-alternative-color: rgb(204,23,28);
	--btn-default-font-family: "Quicksand", Arial, Helvetica, sans-serif;
	--btn-default-font-weight: 500;
	--btn-default-transform: none;
	--btn-default-font-size: 10px;
	--btn-default-bgcolor: rgb(180,24,28);
	--btn-default-bgcolor-hover: rgba(180,24,28,0.64);
	--btn-accented-bgcolor: rgb(180,24,28);
	--btn-accented-bgcolor-hover: rgba(180,24,28,0.59);
	--wd-form-brd-width: 1px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: rgb(30,115,190);
	--wd-link-color-hover: rgba(30,115,190,0.67);
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: rgb(255,255,255);
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
:is(.woodmart-archive-shop .wd-builder-off,.wd-wishlist-content,.related-and-upsells,.cart-collaterals,.wd-shop-product,.wd-fbt) .wd-products-with-bg, :is(.woodmart-archive-shop .wd-builder-off,.wd-wishlist-content,.related-and-upsells,.cart-collaterals,.wd-shop-product,.wd-fbt) .wd-products-with-bg :is(.wd-product,.wd-cat) {
	--wd-prod-bg:rgb(255,255,255);
	--wd-bordered-bg:rgb(255,255,255);
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: rgb(15,43,78);
	background-image: none;
}
html .wd-nav-mobile > li > a {
	text-transform: capitalize;
}
html .post.wd-post:not(.blog-design-small) .wd-entities-title {
	font-size: 18px;
}
html .product.wd-cat .wd-entities-title, html .product.wd-cat.cat-design-replace-title .wd-entities-title, html .wd-masonry-first .wd-cat:first-child .wd-entities-title {
	font-size: 16px;
	text-transform: none;
}
:is(.page, .search-no-results, .error404) :is(.wd-page-content, .whb-header) {
	background-color: rgb(246,246,246);
	background-image: none;
}
.woodmart-archive-shop:not(.single-product) :is(.wd-page-content, .whb-header) {
	background-color: rgb(246,246,246);
	background-image: none;
}
.single-product :is(.wd-page-content, .whb-header) {
	background-color: rgb(246,246,246);
	background-image: none;
}
.woodmart-archive-blog :is(.wd-page-content, .whb-header) {
	background-color: rgb(246,246,246);
	background-image: none;
}
html .btn.wd-buy-now-btn {
	background: rgb(180,24,28);
}
html .btn.wd-buy-now-btn:hover {
	background: rgba(180,24,28,0.6);
}
body, [class*=color-scheme-light], [class*=color-scheme-dark], .wd-search-form[class*="wd-header-search-form"] form.searchform, .wd-el-search .searchform {
	--wd-form-bg: rgb(255,255,255);
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
:root{
--wd-container-w: 1304px;
--wd-form-brd-radius: 5px;
--btn-default-color: #fff;
--btn-default-color-hover: #fff;
--btn-default-brd-radius: 5px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-accented-brd-radius: 5px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
--wd-brd-radius: 8px;
}

@media (min-width: 1304px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: rgb(28,97,231);
}

/* 1. Ocultar la barra lateral completamente */
.sidebar-container,
.woodmart-sidebar,
aside.sidebar,
.widget-area {
    display: none !important;
}
/* Ocultar botón Ver carrito en el panel lateral */
.widget_shopping_cart .buttons .btn-cart {
    display: none !important;
}



/* Botón largo del formulario WPForms */
.wpforms-container .wpforms-submit {
    background-color: #2770FF !important;
    color: #FFFFFF !important;
    border: 2px solid #2770FF !important;
    border-radius: 20px !important;
    padding: 14px 28px !important;
    width: 100% !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

/* Efecto al pasar el cursor */
.wpforms-container .wpforms-submit:hover {
    background-color: #102D50 !important;
    color: #FFFFFF !important;
    border-color: #102D50 !important;
}

/* Oculta la lista desplegable en las paginas de tienda/archivo por defecto */
.wd-dropdown-categories,
.tax-product_cat .wd-dropdown-categories,
.post-type-archive-product .wd-dropdown-categories {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Muestra el desplegable SOLO al pasar el ratón por encima de CATEGORIASS */
.wd-header-cats:hover .wd-dropdown-categories {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Estilo del cuadro de cantidad (Quantity field) */
.quantity input[type="number"],
.quantity input.qty {
    background-color: #f7fafc !important; /* Color de fondo claro */
    color: #1a202c !important;            /* Color del número */
    border: 1px solid #cbd5e0 !important; /* Color del borde */
    border-radius: 6px !important;        /* Bordes redondeados */
    font-weight: bold !important;
}

/* Botones de + y - en el selector de cantidad */
.quantity .plus, 
.quantity .minus {
    background-color: #edf2f7 !important;
    color: #2d3748 !important;
    border-color: #cbd5e0 !important;
}

/* Forzar precio tachado y precio nuevo en línea horizontal */
.product-image-summary .price,
.summary-inner .price,
p.price {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-direction: row-reverse !important; /* Coloca el tachado después del precio principal o en orden */
}

/* Reducir el tamaño del precio tachado */
.product-image-summary .price del,
p.price del {
    font-size: 0.65em !important; /* Tamaño más pequeño */
    opacity: 0.6 !important;       /* Un poco más tenue */
}

/* Aumentar o destacar el precio en oferta */
.product-image-summary .price ins,
p.price ins {
    text-decoration: none !important;
    font-weight: 700 !important;
}

/* Estilo base de las pastillas/botones de variaciones */
.wd-swatches-single .wd-swatch.wd-text,
.variations .value .wd-swatch {
    background-color: #ffffff !important;
    color: #2b364b !important;
    border: 1px solid #dcdfe6 !important;
    border-radius: 20px !important;
    padding: 8px 18px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    min-height: auto !important;
}

/* Pastilla cuando el usuario pasa el ratón por encima (Hover) */
.wd-swatches-single .wd-swatch.wd-text:hover {
    border-color: #3182ce !important;
    color: #3182ce !important;
}

/* Pastilla activa/seleccionada (Borde azul resaltado) */
.wd-swatches-single .wd-swatch.wd-text.wd-active,
.variations .value .wd-swatch.active {
    border: 2px solid #3182ce !important;
    background-color: #ffffff !important;
    color: #2b364b !important;
    box-shadow: 0 0 0 1px #3182ce !important;
}

/* Color de los títulos (Memoria RAM, Almacenamiento) */
.variations td.label, .variations label {
    color: #4a5568 !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

/***************************************************/
/* --- CONTENEDOR PRINCIPAL ESTILO CARD CELESTE --- */
.variations_form {
    background-color: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 20px !important;
    padding: 28px !important;
    margin-bottom: 25px !important;
    box-shadow: none !important;
    position: relative !important;
    padding-top: 85px !important; /* Espacio superior reservado para Título y Subtítulo */
}

/* --- TÍTULO PRINCIPAL (NEGRITA) --- */
.variations_form::before {
    content: "Configúrala a tu medida";
    position: absolute;
    top: 24px;
    left: 28px;
    right: 28px;
    display: block;
    font-family: inherit;
    color: #0f172a !important;
    font-size: 16px !important;
    font-weight: 900 !important; /* Negrita pronunciada */
    line-height: 1.2 !important;
    text-align: left !important;
}

/* --- SUBTÍTULO (TEXTO NORMAL, SIN NEGRITA) --- */
.variations_form::after {
    content: "Poténciala a tu gusto; la dejamos lista y optimizada antes de enviártela.";
    position: absolute;
    top: 48px;
    left: 28px;
    right: 28px;
    display: block;
    font-family: inherit;
    color: #64748b !important; /* Tono gris suave para el subtítulo */
    font-size: 13.5px !important;
    font-weight: 400 !important; /* Sin negrita */
    line-height: 1.4 !important;
    text-align: left !important;
}

/* --- ESTRUCTURA VERTICAL (SIN LÍNEAS DIVISORAS) --- */
.variations_form .variations tbody,
.variations_form .variations tr {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
}

.variations_form .variations tr {
    margin-bottom: 20px !important;
    padding-bottom: 0 !important;
    border: none !important; /* Sin línea divisora */
}

/* --- TÍTULO DEL ATRIBUTO (MEMORIA RAM / ALMACENAMIENTO ARRIBA) --- */
.variations_form .variations td.label {
    display: block !important;
    width: 100% !important;
    padding: 0 0 10px 0 !important;
    text-align: left !important;
    border: none !important;
}

.variations_form .variations td.label label {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    text-transform: none !important;
    margin: 0 !important;
}

/* ELIMINACIÓN TOTAL Y RADICAL DE CUALQUIER TEXTO DINÁMICO O CIFRA AL LADO DEL TÍTULO */
.variations td.label .wd-attr-selected,
.variations td.label span,
.variations td.label small,
.variations td.label .woocommerce-variation-selection-needed,
.variations tr td.label::after {
    display: none !important;
    content: none !important;
}

/* --- CONTENEDOR DE LOS BOTONES ABAJO --- */
.variations_form .variations td.value {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 0 !important;
    border: none !important;
}

/* --- ESTILO DE BOTONES TIPO PASTILLA --- */
.variations .value .variable-item,
.variations .value .wd-swatch,
.woo-variation-swatches .variable-items-wrapper .variable-item {
    border-radius: 50px !important;
    border: 1.5px solid #cbd5e0 !important;
    background-color: #ffffff !important;
    color: #1e293b !important;
    padding: 9px 20px !important;
    font-weight: 700 !important;
    font-size: 13.5px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
    margin: 0 !important;
    transition: all 0.2s ease-in-out !important;
    cursor: pointer !important;
}

/* Efecto Hover al pasar el mouse */
.variations .value .variable-item:hover,
.variations .value .wd-swatch:hover,
.woo-variation-swatches .variable-items-wrapper .variable-item:hover {
    border-color: #3b82f6 !important;
    background-color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important;
}

/* PASTILLA SELECCIONADA / ACTIVA (Borde Azul Eléctrico) */
.variations .value .variable-item.selected,
.variations .value .wd-swatch.active,
.woo-variation-swatches .variable-items-wrapper .variable-item.selected {
    border: 2px solid #2563eb !important;
    background-color: #ffffff !important;
    color: #0f172a !important;
    box-shadow: 0 0 0 1px #2563eb !important;
}

/* Ocultar enlace "Limpiar" */
.reset_variations {
    display: none !important;
}

/* --- FORMATO DEL PRECIO HORIZONTAL ABAJO --- */
.single-product .summary p.price,
.single-product .summary .woocommerce-Variation-price .price {
    display: flex !important;
    flex-direction: row-reverse !important;
    justify-content: flex-end !important;
    align-items: baseline !important;
    gap: 12px !important;
    margin-top: 22px !important;
    margin-bottom: 12px !important;
}

/* Precio Oferta / Actual (Grande a la izquierda) */
.single-product .summary p.price ins,
.single-product .summary .woocommerce-Variation-price ins .amount {
    font-size: 32px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-decoration: none !important;
}

/* Precio Anterior (Chico, Tachado a la derecha) */
.single-product .summary p.price del,
.single-product .summary .woocommerce-Variation-price del .amount {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
}

/*IMPRESION*/
/* Contenedor principal de especificaciones de impresora */
.printer-specs-container {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 12px !important;
    margin-top: 15px !important;
    margin-bottom: 20px !important;
    width: 100% !important;
}

/* Tarjeta individual */
.printer-spec-card {
    background-color: #ffffff !important;
    border: 1px solid #f1f5f9 !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

/* Círculo suave para el icono */
.printer-spec-icon {
    width: 32px;
    height: 32px;
    background-color: #eff6ff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Textos dentro de la tarjeta */
.printer-spec-info {
    display: flex;
    flex-direction: column;
}

.printer-spec-label {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.printer-spec-value {
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    line-height: 1.3;
}

/* Adaptación para celular */
@media (max-width: 768px) {
    .printer-specs-container {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* --- CONTENEDOR DE ESPECIFICACIONES DE MONITORES --- */
.monitor-specs-container {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important; /* 5 columnas para abarcar los 5 campos */
    gap: 10px !important;
    margin-top: 15px !important;
    margin-bottom: 22px !important;
    width: 100% !important;
}

/* Tarjeta individual */
.monitor-spec-card {
    background-color: #ffffff !important;
    border: 1px solid #f1f5f9 !important;
    border-radius: 14px !important;
    padding: 12px 10px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

/* Circulito suave para el icono azul */
.monitor-spec-icon {
    width: 32px;
    height: 32px;
    background-color: #eff6ff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.monitor-spec-info {
    display: flex;
    flex-direction: column;
}

.monitor-spec-label {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.monitor-spec-value {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    line-height: 1.3;
}

/* Adaptación para pantallas medianas y móviles */
@media (max-width: 992px) {
    .monitor-specs-container {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 576px) {
    .monitor-specs-container {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/***************************************************/
/* --- AJUSTE DE PRECIOS Y BOTÓN DE COMPRA --- */

/* 1. Precio Principal / Oferta (Más grande y llamativo) */
.single-product .summary p.price ins,
.single-product .summary .woocommerce-Variation-price ins .amount,
.single-product .summary p.price > .amount {
    font-size: 34px !important; /* Aumenta el tamaño del precio actual */
    font-weight: 800 !important;
    color: #0f172a !important;
    text-decoration: none !important;
}

/* 2. Precio Tachado (Más pequeño y discreto) */
.single-product .summary p.price del,
.single-product .summary .woocommerce-Variation-price del .amount,
.single-product .summary p.price del .amount {
    font-size: 16px !important; /* Reduce el tamaño del precio tachado */
    font-weight: 500 !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
}

/* 3. Redondez en el Botón "Añadir al carrito" */
.single-product .summary .single_add_to_cart_button,
.single-product .summary button[name="add-to-cart"] {
    border-radius: 50px !important; /* Bordes redondeados tipo píldora */
    padding: 12px 28px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    transition: all 0.2s ease-in-out !important;
}

/* 4. Redondez y suavizado del selector de cantidad (+ / -) */
.single-product .summary .quantity {
    border-radius: 30px !important;
    overflow: hidden !important;
    border: 1px solid #cbd5e0 !important;
}

.single-product .summary .quantity input[type="number"],
.single-product .summary .quantity .plus,
.single-product .summary .quantity .minus {
    border: none !important;
    background-color: #f8fafc !important;
}

/***************************************************/
/* --- ESTILO FORMULARIO DE SERVICIO TÉCNICO --- */

.tech-service-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 10px;
}

/* Distribución en filas y columnas */
.tech-service-form .form-row {
    display: flex;
    gap: 15px;
    width: 100%;
}

.tech-service-form .form-row.two-cols .form-group {
    flex: 1;
}

.tech-service-form .form-group {
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* Etiquetas (Labels) */
.tech-service-form label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    margin-bottom: 6px !important;
}

/* Inputs, Selects y Textarea */
.tech-service-form input[type="text"],
.tech-service-form input[type="email"],
.tech-service-form input[type="tel"],
.tech-service-form select,
.tech-service-form textarea {
    width: 100% !important;
    border-radius: 12px !important;
    border: 1.5px solid #cbd5e0 !important;
    background-color: #f8fafc !important;
    padding: 10px 14px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    transition: all 0.2s ease !important;
    outline: none !important;
}

/* Focus activo en los campos */
.tech-service-form input:focus,
.tech-service-form select:focus,
.tech-service-form textarea:focus {
    border-color: #2563eb !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

/* Botón de Enviar (Estilo Píldora) */
.tech-service-form .form-submit {
    margin-top: 8px;
    text-align: center;
}

.tech-service-form input[type="submit"] {
    width: 100% !important;
    border-radius: 50px !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
}

.tech-service-form input[type="submit"]:hover {
    background-color: #1d4ed8 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
}

/* Responsivo para celulares */
@media (max-width: 600px) {
    .tech-service-form .form-row.two-cols {
        flex-direction: column;
        gap: 16px;
    }
}

/***************************************************/
/* --- ESTILO FORMULARIO DE DISTRIBUIDORES --- */

.distributor-form {
    display: flex;
    flex-direction: column;
    gap: 12px; /* Reducido de 16px a 12px para mayor cercanía */
    padding: 12px;
    background-color: #ffffff;
    border-radius: 16px;
}

.distributor-form .form-row {
    display: flex;
    gap: 12px;
    width: 100%;
}

.distributor-form .form-row.two-cols .form-group {
    flex: 1;
}

.distributor-form .form-group {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.distributor-form label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    margin-bottom: 3px !important; /* Espacio corto y preciso entre el título y el input */
}

.distributor-form input[type="text"],
.distributor-form input[type="email"],
.distributor-form input[type="tel"],
.distributor-form select,
.distributor-form textarea {
    width: 100% !important;
    border-radius: 12px !important;
    border: 1.5px solid #cbd5e0 !important;
    background-color: #f8fafc !important;
    padding: 10px 14px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    transition: all 0.2s ease !important;
    outline: none !important;
}

.distributor-form input:focus,
.distributor-form select:focus,
.distributor-form textarea:focus {
    border-color: #2563eb !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

.distributor-form .form-submit {
    margin-top: 6px;
    text-align: center;
}

.distributor-form input[type="submit"] {
    width: 100% !important;
    border-radius: 50px !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
}

.distributor-form input[type="submit"]:hover {
    background-color: #1d4ed8 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
}

@media (max-width: 600px) {
    .distributor-form .form-row.two-cols {
        flex-direction: column;
        gap: 12px;
    }
}

/***************************************************/
/* --- ESTILO OUTSOURCING DE IMPRESIÓN --- */

.outsourcing-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 10px;
    background-color: #ffffff;
    border-radius: 16px;
}

.outsourcing-form .form-row {
    display: flex;
    gap: 12px;
    width: 100%;
}

.outsourcing-form .form-row.two-cols .form-group {
    flex: 1;
}

.outsourcing-form .form-group {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.outsourcing-form label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    margin-bottom: 3px !important;
}

.outsourcing-form input[type="text"],
.outsourcing-form input[type="email"],
.outsourcing-form input[type="tel"],
.outsourcing-form select,
.outsourcing-form textarea {
    width: 100% !important;
    border-radius: 12px !important;
    border: 1.5px solid #cbd5e0 !important;
    background-color: #f8fafc !important;
    padding: 10px 14px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    transition: all 0.2s ease !important;
    outline: none !important;
}

.outsourcing-form input:focus,
.outsourcing-form select:focus,
.outsourcing-form textarea:focus {
    border-color: #2563eb !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

.outsourcing-form .form-submit {
    margin-top: 6px;
    text-align: center;
}

.outsourcing-form input[type="submit"] {
    width: 100% !important;
    border-radius: 50px !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
}

.outsourcing-form input[type="submit"]:hover {
    background-color: #1d4ed8 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
}

@media (max-width: 600px) {
    .outsourcing-form .form-row.two-cols {
        flex-direction: column;
        gap: 12px;
    }
}

/***************************************************/
/* --- ESTILO ARRIENDO DE EQUIPOS DE CÓMPUTO --- */

.equipment-rental-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 10px;
    background-color: #ffffff;
    border-radius: 16px;
}

.equipment-rental-form .form-row {
    display: flex;
    gap: 12px;
    width: 100%;
}

.equipment-rental-form .form-row.two-cols .form-group {
    flex: 1;
}

.equipment-rental-form .form-group {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.equipment-rental-form label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    margin-bottom: 3px !important;
}

.equipment-rental-form input[type="text"],
.equipment-rental-form input[type="email"],
.equipment-rental-form input[type="tel"],
.equipment-rental-form select,
.equipment-rental-form textarea {
    width: 100% !important;
    border-radius: 12px !important;
    border: 1.5px solid #cbd5e0 !important;
    background-color: #f8fafc !important;
    padding: 10px 14px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    transition: all 0.2s ease !important;
    outline: none !important;
}

.equipment-rental-form input:focus,
.equipment-rental-form select:focus,
.equipment-rental-form textarea:focus {
    border-color: #2563eb !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

.equipment-rental-form .form-submit {
    margin-top: 6px;
    text-align: center;
}

.equipment-rental-form input[type="submit"] {
    width: 100% !important;
    border-radius: 50px !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
}

.equipment-rental-form input[type="submit"]:hover {
    background-color: #1d4ed8 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
}

@media (max-width: 600px) {
    .equipment-rental-form .form-row.two-cols {
        flex-direction: column;
        gap: 12px;
    }
}

/***************************************************/
/* --- ESTILO SERVICIO TÉCNICO CORPORATIVO --- */

.corporate-tech-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 10px;
    background-color: #ffffff;
    border-radius: 16px;
}

.corporate-tech-form .form-row {
    display: flex;
    gap: 12px;
    width: 100%;
}

.corporate-tech-form .form-row.two-cols .form-group {
    flex: 1;
}

.corporate-tech-form .form-group {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.corporate-tech-form label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    margin-bottom: 3px !important;
}

.corporate-tech-form input[type="text"],
.corporate-tech-form input[type="email"],
.corporate-tech-form input[type="tel"],
.corporate-tech-form select,
.corporate-tech-form textarea {
    width: 100% !important;
    border-radius: 12px !important;
    border: 1.5px solid #cbd5e0 !important;
    background-color: #f8fafc !important;
    padding: 10px 14px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    transition: all 0.2s ease !important;
    outline: none !important;
}

.corporate-tech-form input:focus,
.corporate-tech-form select:focus,
.corporate-tech-form textarea:focus {
    border-color: #2563eb !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

.corporate-tech-form .form-submit {
    margin-top: 6px;
    text-align: center;
}

.corporate-tech-form input[type="submit"] {
    width: 100% !important;
    border-radius: 50px !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
}

.corporate-tech-form input[type="submit"]:hover {
    background-color: #1d4ed8 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
}

@media (max-width: 600px) {
    .corporate-tech-form .form-row.two-cols {
        flex-direction: column;
        gap: 12px;
    }
}

/***************************************************/
/* --- ESTILO SERVICIO TÉCNICO RESIDENCIAL --- */

.residential-tech-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 10px;
    background-color: #ffffff;
    border-radius: 16px;
}

.residential-tech-form .form-row {
    display: flex;
    gap: 12px;
    width: 100%;
}

.residential-tech-form .form-row.two-cols .form-group {
    flex: 1;
}

.residential-tech-form .form-group {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.residential-tech-form label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    margin-bottom: 3px !important;
}

.residential-tech-form input[type="text"],
.residential-tech-form input[type="email"],
.residential-tech-form input[type="tel"],
.residential-tech-form select,
.residential-tech-form textarea {
    width: 100% !important;
    border-radius: 12px !important;
    border: 1.5px solid #cbd5e0 !important;
    background-color: #f8fafc !important;
    padding: 10px 14px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    transition: all 0.2s ease !important;
    outline: none !important;
}

.residential-tech-form input:focus,
.residential-tech-form select:focus,
.residential-tech-form textarea:focus {
    border-color: #2563eb !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

.residential-tech-form .form-submit {
    margin-top: 6px;
    text-align: center;
}

.residential-tech-form input[type="submit"] {
    width: 100% !important;
    border-radius: 50px !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
}

.residential-tech-form input[type="submit"]:hover {
    background-color: #1d4ed8 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
}

@media (max-width: 600px) {
    .residential-tech-form .form-row.two-cols {
        flex-direction: column;
        gap: 12px;
    }
}


/* Botón de cotización de Compufácil */
.boton-cotizacion button,
.boton-cotizacion a,
.boton-cotizacion input[type="button"],
.boton-cotizacion input[type="submit"] {
    background-color: #2770FF !important;
    color: #FFFFFF !important;
    border: 1px solid #102D50 !important;
    border-radius: 30px !important;
    padding: 14px 28px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    box-shadow: none !important;
    transition: all 0.25s ease !important;
}


/* Botón de cotización Compufácil CELESTE */
.boton-cotizacion button,
.boton-cotizacion a,
.boton-cotizacion input[type="button"],
.boton-cotizacion input[type="submit"] {
    background: #2770FF !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 14px 28px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-transform: capitalize !important;
    letter-spacing: normal !important;
    box-shadow: none !important;
}

/* Mantener el mismo diseño al pasar el cursor */
.boton-cotizacion2 button:hover,
.boton-cotizacion2 a:hover,
.boton-cotizacion2 input[type="button"]:hover,
.boton-cotizacion2 input[type="submit"]:hover {
    background: #FFFFFF !important;
    color: #2770FF !important;
    border: none !important;
    border-radius: 20px !important;
    box-shadow: none !important;
}

/* Botón de cotización Compufácil BLANCO */
.boton-cotizacion2 button,
.boton-cotizacion2 a,
.boton-cotizacion2 input[type="button"],
.boton-cotizacion2 input[type="submit"] {
    background: #FFFFFF !important;
    color: #2770FF !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 14px 28px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-transform: capitalize !important;
    letter-spacing: normal !important;
    box-shadow: none !important;
}

/* Mantener el mismo diseño al pasar el cursor */
.boton-cotizacion2 button:hover,
.boton-cotizacion2 a:hover,
.boton-cotizacion2 input[type="button"]:hover,
.boton-cotizacion2 input[type="submit"]:hover {
    background: #FFFFFF !important;
    color: #2770FF !important;
    border: none !important;
    border-radius: 20px !important;
    box-shadow: none !important;
}

/*////////////////////////POPUP///////////////////////////*/


/* Dar más espacio al popup de cotización */
.wpb-pcf-popup,
.wpb-pcf-popup .modal-content,
.wpb-pcf-popup .wpcf7 {
    width: 100% !important;
    max-width: 650px !important;
    box-sizing: border-box !important;
}

/* Espacio interior del formulario */
.wpb-pcf-popup .wpcf7 {
    padding: 28px !important;
}

/* Separación entre campos */
.wpb-pcf-popup .wpcf7 p {
    margin-bottom: 20px !important;
}

/* Campos más cómodos */
.wpb-pcf-popup .wpcf7 input:not([type="submit"]),
.wpb-pcf-popup .wpcf7 select,
.wpb-pcf-popup .wpcf7 textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 12px 14px !important;
    border-radius: 8px !important;
}

/* Altura del área de mensaje */
.wpb-pcf-popup .wpcf7 textarea {
    min-height: 110px !important;
}

/* Adaptación a móviles */
@media (max-width: 600px) {
    .wpb-pcf-popup,
    .wpb-pcf-popup .modal-content {
        max-width: calc(100vw - 24px) !important;
    }

    .wpb-pcf-popup .wpcf7 {
        padding: 18px !important;
    }
}

/******************FORM ANCHO**************/
/* 1. Ampliar el contenedor general de la ventana modal/formulario */
.dialog-widget-content, 
.elementor-popup-modal, 
.popup-inner-content,
.modal-content-wrapper { /* Ajusta según el contenedor de tu plugin o Elementor */
    max-width: 750px !important; /* Lo hacemos más ancho (por defecto suelen venir en 500-600px) */
    width: 90% !important;
}

/* 2. Darle amplitud interna y mejor distribución al formulario */
form.elementor-form, .your-form-class {
    padding: 10px 20px !important;
}

/* 3. Asegurar que las filas de dos columnas respiren bien y ocupen todo el ancho */
.elementor-form-fields-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px 20px !important; /* Espacio vertical y horizontal entre campos */
}

/* 4. Forzar que los campos de texto y selects aprovechen todo el ancho disponible */
.elementor-field-group {
    margin-bottom: 0 !important;
}

.elementor-field-group .elementor-field {
    width: 100% !important;
    max-width: 100% !important;
    height: 48px !important; /* Un poco más altos para que sean más cómodos de escribir */
    font-size: 15px !important;
    border-radius: 8px !important;
}

/* 5. Ajustar el campo de texto grande (mensaje/descripción) */
textarea.elementor-field {
    height: 110px !important; /* Más espacio para que el cliente redacte tranquilo */
    resize: vertical !important;
}

/* 6. Botón de envío prominente y centrado */
.elementor-field-type-submit button {
    width: 100% !important;
    padding: 14px 20px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    border-radius: 8px !important;
    letter-spacing: 0.5px !important;
}

/***************************************************/
/* --- ESTILO BOTÓN TRANSPARENTE CON FLECHA --- */

.btn-arrow-clean {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: transparent !important;
    border: none !important;
    color: #1b2c4b !important;
    
    /* Tipografía y Grosor real */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    letter-spacing: 0.5px !important;
    -webkit-text-stroke: 0.4px #1b2c4b !important;
    
    text-decoration: none !important;
    text-transform: capitalize !important;
    padding: 12px 0 !important;
    cursor: pointer !important;
    transition: color 0.3s ease !important;
}

/* ELIMINA RADICALMENTE cualquier icono o flecha nativa previa del tema */
.btn-arrow-clean i,
.btn-arrow-clean svg,
.btn-arrow-clean span[class*="icon"],
.btn-arrow-clean [class*="fa-"],
.btn-arrow-clean::before {
    display: none !important;
    content: none !important;
}

/* Dibuja la única flecha gruesa y pesada al final */
.btn-arrow-clean::after {
    content: "➔" !important;
    display: inline-block !important;
    font-family: Arial, sans-serif !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    line-height: 1 !important;
    color: inherit !important;
    -webkit-text-stroke: 0.6px #1b2c4b !important;
    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), -webkit-text-stroke 0.3s ease !important;
}

/* Efecto Hover */
.btn-arrow-clean:hover {
    color: #0056b3 !important;
    -webkit-text-stroke: 0.4px #0056b3 !important;
}

.btn-arrow-clean:hover::after {
    color: #0056b3 !important;
    -webkit-text-stroke: 0.6px #0056b3 !important;
    transform: translateX(6px) !important;
}

/* --- ESTILO BOTÓN TRANSPARENTE CON FLECHA LETRAS CELESTES--- */

.btn-arrow-clean-celeste {
    display: inline-flex;
    align-items: center;
    gap: 8px; /* Espacio entre el texto y la flecha */
    background: transparent !important;
    border: none !important;
    color: #2770FF !important;
    font-weight: 700 !important; /* Extra Bold */
    font-size: 15px !important;
    text-decoration: none !important;
		text-transform: capitalize !important;
    padding: 5px 0 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.btn-arrow-clean-celeste .arrow-icon {
    display: inline-block;
    transition: transform 0.3s ease !important;
}

/* Efecto Hover: La flecha se mueve sutilmente hacia la derecha */
.btn-arrow-clean-celeste:hover .arrow-icon {
    transform: translateX(5px);
}

.btn-arrow-clean-celeste:hover {
    color: #2770FF !important; /* Opcional: cambia ligeramente de color al pasar el cursor */
}



/* =========================================
   COMPUFÁCIL - IMAGEN DE PRODUCTO WOODMART
   Layout personalizado: Producto Card
========================================= */


/* COMPUFÁCIL - MINIATURAS DE PRODUCTOS */

/* Espacio reservado para la imagen */
.wp-block-wd-li-product-thumbnail {
    height: 200px !important;
    min-height: 200px !important;
    max-height: 200px !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #ffffff !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* Enlace o contenedor interior */
.wp-block-wd-li-product-thumbnail a {
    height: 100% !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}

/* Imagen: tamaño controlado y sin deformación */
.wp-block-wd-li-product-thumbnail img {
    display: block !important;
    width: 90% !important;
    height: 180px !important;
    max-width: 90% !important;
    max-height: 180px !important;
    object-fit: contain !important;
    object-position: center center !important;
    margin: auto !important;
}

/***************************WIDGET FLOTANTE SEMINUEVOS***************************/
/* 1. Fijar el bloque en el lateral derecho de la pantalla */
.widget-seminuevos-flotante {
    position: fixed !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 9999 !important;
    transition: all 0.3s ease-in-out !important;
}

/* 2. Botón o pestaña que siempre se ve y parpadea/palpita */
.widget-seminuevos-flotante .badge-animado {
    background-color: #e60000; /* Tu color de acento / rojo */
    color: #ffffff;
    padding: 12px 16px;
    border-radius: 8px 0 0 8px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: -4px 4px 15px rgba(0,0,0,0.15);
    animation: pulso-latte 2s infinite; /* Efecto animado para atraer la atención */
}

/* 3. Animación de pulso continuo */
@keyframes pulso-latte {
    0% {
        box-shadow: 0 0 0 0 rgba(230, 0, 0, 0.7);
    }
    70% {
        box-shadow: 0 0 0 12px rgba(230, 0, 0, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(230, 0, 0, 0);
    }
}

/* === Tarjetas "¿Qué necesitas?" (Inicio): botones alineados con una sola flecha === */
/* Evita la flecha duplicada en el contenedor del widget del popup */
.elementor-widget.btn-arrow-clean { display: block !important; }
.elementor-widget.btn-arrow-clean { padding: 0 !important; }
.elementor-widget.btn-arrow-clean > .elementor-widget-container { display: flex; justify-content: center; margin-top: 0 !important; }
button.btn-arrow-clean.wpb-pcf-btn, a#btn-arrow-clean { white-space: nowrap !important; }
a#btn-arrow-clean .elementor-button-content-wrapper { flex-wrap: nowrap; }
.elementor-widget.btn-arrow-clean::after { content: none !important; display: none !important; }
/* Botón del popup con la misma tipografía que los demás */
button.btn-arrow-clean.wpb-pcf-btn {
    font-family: "Montserrat", sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    padding: 12px 24px !important;
    line-height: 1 !important;
    text-transform: none !important;
}
/* Flecha en los botones de Elementor con ID btn-arrow-clean */
a#btn-arrow-clean .elementor-button-content-wrapper { align-items: center; }
a#btn-arrow-clean .elementor-button-text::after {
    content: "➔";
    display: inline-block;
    margin-left: 10px;
    font-family: Arial, sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 1;
    -webkit-text-stroke: 0.6px currentColor;
}