/*
 * VISOMAR — integración visual de WordPress/WooCommerce con el diseño original.
 * Solo agrega estilos para piezas que no existían en el sitio React (carro/checkout/cuenta de WooCommerce,
 * contenido editorial, precio en tarjetas). Usa las variables y componentes de assets/css/visomar.css.
 */

/* ---------- Utilidades ---------- */
.visomar-lock { overflow: hidden; }
.visomar-skip:focus { position: fixed; z-index: 100; top: 8px; left: 8px; width: auto; height: auto; padding: 10px 14px; margin: 0; overflow: visible; clip: auto; color: #fff; background: var(--red); white-space: normal; }
.cart-filled { display: contents; }
.cart-drawer:focus { outline: none; }
[aria-busy="true"] { opacity: .65; pointer-events: none; }
.visomar-bare { min-height: 100vh; }
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-header { top: 0; } }

/* Contenido editorial (el reset de Tailwind quita márgenes y tamaños de títulos y listas). */
.entry-content > * + * { margin-top: 1em; }
.entry-content h2 { font-family: var(--font-display); font-size: 30px; font-weight: 800; line-height: 1.05; text-transform: uppercase; }
.entry-content h3 { font-family: var(--font-display); font-size: 23px; font-weight: 800; text-transform: uppercase; }
.entry-content ul { padding-left: 1.2em; list-style: disc; }
.entry-content ol { padding-left: 1.2em; list-style: decimal; }
.entry-content a { color: #a60e09; font-weight: 700; text-decoration: underline; }
.entry-content p { line-height: 1.7; }

/* ---------- Búsqueda del catálogo (botón "limpiar" como enlace) ---------- */
.catalog-search__clear { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; color: #55595a; background: #f0f1ef; }

/* ---------- Tarjeta con precio (cuando el producto tiene precio en WooCommerce) ---------- */
.catalog-item-card--buy h3 a:hover { color: var(--red); }
.catalog-item-card--buy .catalog-item-card__image { display: block; }
.catalog-item-card .product-price-row { margin-top: 10px; }
.catalog-item-card__add { margin-top: auto; align-self: stretch; }
.catalog-item-card .product-tax-note { margin-bottom: 12px; }
.product-price-row .woocommerce-Price-amount, .product-price-row ins { color: #141516; font-size: 20px; font-weight: 800; letter-spacing: -.025em; text-decoration: none; }
.product-price-row del, .product-price-row del .woocommerce-Price-amount { color: #929496; font-size: 12px; font-weight: 400; }
.product-price-row .woocommerce-price-suffix { margin-left: 4px; color: #898b8c; font-size: 10px; }

/* ---------- Ficha: precio, compra y galería nativa de WooCommerce ---------- */
.catalog-product-price { margin-top: 18px; }
.catalog-product-price .woocommerce-Price-amount, .catalog-product-price ins { font-size: 30px; }
.catalog-product-buy { margin-top: 23px; }
.catalog-product-buy .woocommerce div.product form.cart { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; margin: 0; }
.catalog-product-buy .woocommerce .quantity input.qty { width: 74px; min-height: 48px; padding: 0 8px; color: #171819; text-align: center; background: #fff; border: 1px solid #c7c9c9; border-radius: 2px; font-size: 14px; font-weight: 700; }
.catalog-product-buy .woocommerce div.product form.cart .single_add_to_cart_button { display: inline-flex; min-height: 48px; align-items: center; gap: 12px; padding: 0 22px; color: #fff; background: var(--red); border: 0; border-radius: 2px; font-size: 13px; font-weight: 800; cursor: pointer; transition: background .18s, transform .18s; }
.catalog-product-buy .woocommerce div.product form.cart .single_add_to_cart_button:hover { background: #bd0903; transform: translateY(-1px); }
.catalog-product-buy .stock { width: 100%; margin: 0 0 6px; color: #2f7a4b; font-size: 12px; font-weight: 700; }
.catalog-product-buy .stock.out-of-stock { color: #a20e08; }
.catalog-product-buy + .catalog-product-contact { margin-top: 12px; }
.catalog-product-photo .woocommerce-product-gallery { float: none !important; width: 100% !important; margin: 0 !important; }
.catalog-product-photo .woocommerce-product-gallery img { width: 100%; height: auto; background: #f2f2ef; }
.catalog-product-photo .flex-control-thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-top: 8px; }
.catalog-product-long { margin-top: 18px; }

/* ---------- Avisos de WooCommerce con la paleta del sitio ---------- */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error,
.woocommerce .woocommerce-message, .woocommerce .woocommerce-info, .woocommerce .woocommerce-error {
	margin: 0 0 18px; padding: 12px 14px 12px 42px; color: #285b3e; background: #edf8f1; border: 1px solid #c8e8d3; border-top: 0; border-left: 3px solid #22a55c; font-size: 12px; line-height: 1.5; list-style: none;
}
.woocommerce .woocommerce-info, .woocommerce-page .woocommerce-info { color: #5d4631; background: #fff2df; border-color: #f2dcb9; border-left-color: #da6b00; }
.woocommerce .woocommerce-error, .woocommerce-page .woocommerce-error { color: #86231e; background: #fff0ee; border-color: #f0c5c1; border-left-color: var(--red); }
.woocommerce .woocommerce-message::before, .woocommerce .woocommerce-info::before, .woocommerce .woocommerce-error::before { top: 12px; left: 14px; color: inherit; }
.woocommerce-message .button, .woocommerce-info .button { float: right; padding: 0 12px; min-height: 30px; line-height: 30px; color: #fff !important; background: #151617 !important; border-radius: 2px !important; font-size: 11px !important; }

/* ---------- Botones de WooCommerce con el estilo .button del original ---------- */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt {
	display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 10px; padding: 0 18px; color: #fff; background: var(--red); border: 1px solid transparent; border-radius: 2px; font-family: "Barlow", Arial, sans-serif; font-size: 13px; font-weight: 800; line-height: 1; transition: background .18s, transform .18s;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover { color: #fff; background: #bd0903; transform: translateY(-1px); }
.woocommerce .button.button--outline { color: #171819; background: transparent; border-color: #c7c9c9; }

/* ---------- Páginas de WooCommerce (carro, pago, cuenta) ---------- */
.wc-page-banner { padding: 52px 0 44px; }
.wc-page-banner h1 { font-size: clamp(40px, 5.6vw, 62px); }
.wc-page { background: #fff; }
.wc-page.section-pad { padding-block: 46px 82px; }
.wc-page .entry-content > * + * { margin-top: 0; }

/* Bloques de carro y checkout. */
.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout { font-family: "Barlow", Arial, sans-serif; color: #191a1b; }
.wc-block-components-title.wc-block-components-title, .wc-block-cart__totals-title, .wc-block-components-checkout-step__title {
	font-family: var(--font-display) !important; font-size: 22px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 0 !important;
}
.wc-block-components-button:not(.is-link), .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button {
	min-height: 48px; color: #fff !important; background: var(--red) !important; border: 0 !important; border-radius: 2px !important; font-family: "Barlow", Arial, sans-serif !important; font-size: 13px !important; font-weight: 800 !important;
}
.wc-block-components-button:not(.is-link):hover { background: #bd0903 !important; }
.wc-block-components-product-name { color: #191a1b !important; font-weight: 700; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { color: var(--red); font-size: 22px; font-weight: 800; }
.wc-block-components-text-input input, .wc-block-components-combobox .wc-block-components-combobox-control input, .wc-blocks-components-select .wc-blocks-components-select__select, .wc-block-components-textarea {
	border-color: #d9dbd9 !important; border-radius: 1px !important;
}
.wc-block-components-text-input.is-active input:focus, .wc-block-components-text-input input:focus { border-color: #b00d07 !important; box-shadow: 0 0 0 3px #e106001a !important; }
.wc-block-cart-item__image img, .wc-block-components-order-summary-item__image img { background: #f2f2ef; }

.wp-block-woocommerce-checkout-order-summary-block, .wp-block-woocommerce-cart-order-summary-block { padding: 18px; background: #f4f4f2; border-top: 3px solid var(--red); }

/* Carro y checkout clásicos (shortcode), por si la tienda los usa. */
.woocommerce table.shop_table { border-radius: 0; border-color: #e2e3e1; }
.woocommerce table.shop_table th { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #656768; background: #f2f3f3; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select { min-height: 42px; padding: 10px 11px; background: #fff; border: 1px solid #d9dbd9; border-radius: 1px; font-size: 13px; }
.woocommerce form .form-row label { color: #353738; font-size: 12px; font-weight: 700; }

/* Mi cuenta (con sesión iniciada). */
.woocommerce-account .wc-page .woocommerce { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 34px; align-items: start; }
.woocommerce-account .woocommerce::before, .woocommerce-account .woocommerce::after { display: none; }
.woocommerce-account .woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; }
.woocommerce-MyAccount-navigation ul { display: grid; gap: 4px; padding: 12px; background: #171819; border-top: 3px solid var(--red); }
.woocommerce-MyAccount-navigation a { display: block; padding: 11px 12px; color: #c9cbce; font-size: 13px; font-weight: 700; }
.woocommerce-MyAccount-navigation .is-active a, .woocommerce-MyAccount-navigation a:hover { color: #fff; background: #291b1a; box-shadow: inset 3px 0 0 var(--red); }
.woocommerce-MyAccount-content { padding: 26px; background: #f7f7f5; border: 1px solid #e2e3e1; font-size: 14px; line-height: 1.65; }
.woocommerce-MyAccount-content > p + p { margin-top: 12px; }
.woocommerce-MyAccount-content a { color: #a60e09; font-weight: 700; }
.woocommerce-MyAccount-content .customer-account-type { margin-top: 18px; background: #fff; border: 1px solid #e2e3e1; }
.woocommerce-MyAccount-content h2, .woocommerce-MyAccount-content h3, .woocommerce-column__title, .woocommerce-order-details__title { margin: 0 0 12px; font-family: var(--font-display); font-size: 24px; font-weight: 800; text-transform: uppercase; }
.woocommerce-MyAccount-content mark { color: inherit; background: #ffe5e2; }
@media (max-width: 760px) {
	.woocommerce-account .wc-page .woocommerce { grid-template-columns: 1fr; gap: 16px; }
	.woocommerce-MyAccount-navigation ul { display: flex; overflow-x: auto; }
	.woocommerce-MyAccount-navigation a { white-space: nowrap; }
	.woocommerce-MyAccount-content { padding: 16px; }
}

/* ---------- Acceso de clientes (form-login.php) ---------- */
.customer-auth-card .woocommerce-notices-wrapper ul, .customer-auth-card .woocommerce-error, .customer-auth-card .woocommerce-message, .customer-auth-card .woocommerce-info { margin: 0 0 14px !important; }
.customer-auth-card .woocommerce-error li + li { margin-top: 4px; }
.customer-type-tabs label { display: grid; min-height: 39px; place-items: center; color: #66696a; font-size: 11px; font-weight: 800; cursor: pointer; }
.customer-type-tabs label:has(input:checked) { color: #fff; background: #161718; box-shadow: 0 2px 7px #0002; }
.customer-type-tabs label:has(input:focus-visible) { outline: 3px solid #ff6a5e; outline-offset: 2px; }
.customer-auth-rut { display: none; gap: 8px; }
.customer-auth-form:has(input[name="visomar_customer_type"][value="empresa"]:checked) .customer-auth-rut { display: grid; }
.customer-auth-form:has(input[name="visomar_customer_type"][value="empresa"]:checked) .customer-auth-persona-note { display: none; }
.customer-auth-rut > label { margin-top: 7px; color: #303233; font-size: 11px; font-weight: 800; }
.customer-auth-remember { display: flex; align-items: center; gap: 8px; margin-top: 8px; color: #5e6264; font-size: 11px; font-weight: 600; }
.customer-auth-remember input { width: 15px; height: 15px; accent-color: var(--red); }
.customer-auth-lost { margin: 12px 0 0; text-align: center; font-size: 11px; }
.customer-auth-lost a { color: #a50f09; font-weight: 800; }
.customer-auth-card .woocommerce-privacy-policy-text { margin-top: 8px; color: #858889; font-size: 10px; line-height: 1.5; }
.customer-auth-card .woocommerce-privacy-policy-text a { color: #a50f09; }
/* Restablecer contraseña (formulario nativo dentro de la misma tarjeta). */
.customer-auth-card .woocommerce-ResetPassword p { color: #696d6f; font-size: 12px; line-height: 1.6; }
.customer-auth-card .woocommerce-ResetPassword .form-row { display: grid; gap: 6px; margin-top: 12px; }
.customer-auth-card .woocommerce-ResetPassword label { color: #303233; font-size: 11px; font-weight: 800; }
.customer-auth-card .woocommerce-ResetPassword input.input-text { min-height: 46px; padding: 0 12px; background: #fafaf9; border: 1px solid #d9dcda; }
.customer-auth-card .woocommerce-ResetPassword button.button { width: 100%; min-height: 48px; margin-top: 8px; }

/* ---------- Paginación del blog ---------- */
.visomar-pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 28px; }
.visomar-pagination .page-numbers { display: grid; min-width: 38px; height: 38px; place-items: center; padding: 0 10px; background: #fff; border: 1px solid #dedfdd; font-size: 12px; font-weight: 700; }
.visomar-pagination .page-numbers.current { color: #fff; background: #171819; border-color: #171819; }
.visomar-pagination .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Los formularios nativos de WooCommerce traen borde y relleno propios; dentro de la tarjeta se usa el diseño original. */
.customer-auth-card .woocommerce form.login, .customer-auth-card .woocommerce form.register, .customer-auth-card .woocommerce form.lost_reset_password { margin: 0; padding: 0; border: 0; border-radius: 0; }
/* WooCommerce agrega su propio botón "mostrar contraseña"; se usa el del diseño original. */
.customer-auth-input .password-input { display: contents; }
.customer-auth-input .show-password-input { display: none !important; }
/* Botones del diseño original (.button--*) que quedan dentro de contenedores .woocommerce: se restauran sus medidas. */
.woocommerce .button[class*="button--"] { min-height: 48px; padding: 0 20px; gap: 12px; font-size: 13px; letter-spacing: .015em; line-height: normal; border-radius: 2px; }
.woocommerce .button.button--full { width: 100%; }
.customer-auth-card .woocommerce .customer-auth-submit { margin-top: 10px; }
/* Medidor de seguridad de contraseña de WooCommerce: debajo del campo, sin romper la fila. */
.customer-auth-input { flex-wrap: wrap; }
.customer-auth-input input { flex: 1; }
.customer-auth-input .woocommerce-password-strength, .customer-auth-input .woocommerce-password-hint { order: 10; flex: 0 0 calc(100% + 24px); margin: 0 -12px; padding: 5px 12px; border: 0; font-size: 10px; font-weight: 700; line-height: 1.45; text-align: left; }
.customer-auth-input .woocommerce-password-hint { order: 11; padding-top: 0; padding-bottom: 8px; color: #777b7c; font-weight: 500; background: #fafaf9; }
/* Navegación de Mi cuenta. */
.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li { margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation a { text-decoration: none; }
.customer-auth-card .woocommerce form.woocommerce-ResetPassword .form-row { display: grid; grid-template-columns: 1fr; float: none; width: 100%; margin: 12px 0 0; padding: 0; }
.customer-auth-card .woocommerce-ResetPassword .form-row label { line-height: 1.4; }
.customer-auth-card .woocommerce-ResetPassword .form-row input.input-text { width: 100%; }
.catalog-product-buy .woocommerce div.product form.cart div.quantity { float: none; margin: 0; }