/*
 * NEXMED — estilos que el HTML original no tenía: WooCommerce (checkout,
 * cuenta, avisos), bloques nuevos, estados de carga y navegación fluida.
 * styles.css (Tailwind compilado del diseño) va primero y no se toca.
 */

/* Manrope autoalojada (antes Google Fonts: una conexión externa menos). */
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(../fonts/manrope-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------------------------------------------------------------------------
 * Navegación fluida: transición suave entre páginas (Chrome, Edge, Safari 18+).
 * El header se mantiene fijo durante el cambio.
 * ------------------------------------------------------------------------- */
@view-transition { navigation: auto; }
#site-header { view-transition-name: nx-header; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .22s; }
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
}

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }

/* Hero con <picture> (antes background-image): la imagen cubre el slide. */
.hero-slide picture, .hero-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---------------------------------------------------------------------------
 * Estados
 * ------------------------------------------------------------------------- */
.is-loading { position: relative; pointer-events: none; opacity: .75; }
.is-loading::after { content: ""; position: absolute; inset: 0; margin: auto; width: 16px; height: 16px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: nx-spin .6s linear infinite; }
.product-card__cta.is-loading, .pdp-actions__primary.is-loading, .pdp-actions__secondary.is-loading, .pdp-bundle__cta.is-loading, .contact-submit.is-loading, .agendar-actions__next.is-loading { color: transparent; }
.product-card__cta.is-loading::after, .pdp-actions__primary.is-loading::after, .pdp-bundle__cta.is-loading::after, .contact-submit.is-loading::after, .agendar-actions__next.is-loading::after { border-color: #fff; border-right-color: transparent; }
.pdp-actions__secondary.is-loading::after { border-color: var(--color-brand-purple); border-right-color: transparent; }
@keyframes nx-spin { to { transform: rotate(360deg); } }
.nx-loading { opacity: .6; }

.product-card__cta.is-disabled { background: var(--color-border); color: var(--color-ink-secondary); cursor: not-allowed; }
.product-card__stock-pill.is-out { color: #d92d20; border-color: #d92d20; }
.product-card__stock-pill.is-out::before { background: #d92d20; }
.product-card__price del { opacity: .55; font-weight: 500; margin-right: 6px; }
.product-card__price ins { text-decoration: none; }
.product-card[hidden] { display: none !important; }

.cart-item__meta { color: var(--color-ink-secondary); font-size: 12px; line-height: 1.4; }
.cart-item .variation { color: var(--color-ink-secondary); font-size: 12px; display: grid; grid-template-columns: auto 1fr; gap: 2px 6px; }
.cart-item .variation dd, .cart-item .variation p { margin: 0; }
.cart-item.is-updating .cart-item__price { opacity: .5; }
.cart-item.is-removing { opacity: .35; pointer-events: none; transition: opacity .2s; }
.cart-item__qty button { padding: 6px 10px; }

/* Aviso flotante (errores de stock, cupones…). */
.nx-toast { position: fixed; left: 50%; bottom: 24px; z-index: 80; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; max-width: min(92vw, 460px); padding: 12px 18px; border-radius: 14px; background: var(--color-ink-primary); color: #fff; font-size: 14px; font-weight: 600; box-shadow: var(--shadow-soft); transition: opacity .25s, transform .25s; }
.nx-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.nx-toast.is-error { background: #b42318; }

.nx-form-status { font-size: 14px; line-height: 1.5; padding: 10px 14px; border-radius: 12px; background: #ecfdf3; color: #15803d; }
.nx-form-status.is-error { background: #fef3f2; color: #b42318; }

/* ---------------------------------------------------------------------------
 * Tienda
 * ------------------------------------------------------------------------- */
.shop-group + .shop-group { margin-top: 8px; }
a.shop-checkbox-row { text-decoration: none; }
a.shop-checkbox-row::before { content: ""; width: 16px; height: 16px; border-radius: 4px; border: 1px solid var(--color-border); flex-shrink: 0; }
a.shop-checkbox-row.is-current { color: var(--color-brand-purple); font-weight: 600; }
a.shop-checkbox-row.is-current::before { background: var(--color-brand-purple); border-color: var(--color-brand-purple); }
a.shop-checkbox-row:hover { color: var(--color-brand-blue); }

/* Ficha */
.pdp-price del { opacity: .5; font-size: .7em; margin-right: 8px; }
.pdp-price ins { text-decoration: none; }
.pdp-short { color: var(--color-ink-secondary); font-size: 15px; line-height: 1.7; }
.pdp-variations { display: grid; gap: 16px; max-width: 420px; }
.pdp-out-of-stock { color: #b42318; font-weight: 600; font-size: 15px; }
.pdp-out-of-stock a { color: var(--color-brand-purple); text-decoration: underline; }
.pdp-description { display: grid; gap: 32px; margin-top: 64px; padding-top: 48px; border-top: 1px solid var(--color-border); }
@media (min-width: 1024px) { .pdp-description { grid-template-columns: 1.4fr .8fr; align-items: start; } }
.pdp-details { border: 1px solid var(--color-border); border-radius: var(--radius-card); background: #f7f7f8; padding: 20px 24px; display: grid; gap: 14px; font-size: 14px; }
.pdp-details div { display: flex; justify-content: space-between; gap: 16px; }
.pdp-details dt { color: var(--color-ink-secondary); }
.pdp-details dd { color: var(--color-ink-primary); font-weight: 600; text-align: right; }
.pdp-trust svg { display: inline; vertical-align: -3px; }

/* ---------------------------------------------------------------------------
 * Contenido editable (legales, artículos, descripción de producto)
 * ------------------------------------------------------------------------- */
.nx-prose { color: var(--color-ink-secondary); font-size: 15px; line-height: 1.7; }
.nx-prose > * + * { margin-top: 14px; }
.nx-prose h2 { font-family: var(--font-display); color: var(--color-ink-primary); font-size: 22px; font-weight: 600; line-height: 1.25; margin-top: 40px; }
.nx-prose h3 { font-family: var(--font-display); color: var(--color-ink-primary); font-size: 18px; font-weight: 600; margin-top: 28px; }
.nx-prose h2 + *, .nx-prose h3 + * { margin-top: 12px; }
.nx-prose ul, .nx-prose ol { padding-left: 1.3em; display: flex; flex-direction: column; gap: 8px; }
.nx-prose ul { list-style: disc; }
.nx-prose ol { list-style: decimal; }
.nx-prose a { color: var(--color-brand-purple); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.nx-prose a:hover { color: var(--color-brand-blue); }
.nx-prose strong { color: var(--color-ink-primary); }
.nx-prose img { border-radius: var(--radius-image); height: auto; }
.nx-prose blockquote { border-left: 3px solid var(--color-brand-purple); padding-left: 18px; font-style: italic; }
.nx-prose table { width: 100%; border-collapse: collapse; font-size: 14px; }
.nx-prose th, .nx-prose td { border-bottom: 1px solid var(--color-border); padding: 10px 8px; text-align: left; }
.nx-prose hr { border-color: var(--color-border); margin: 32px 0; }
.articulo-body.nx-prose { font-size: 16px; }
.articulo-back { display: inline-flex; align-items: center; gap: 8px; }

/* Listado de entradas */
.nx-article-grid { display: grid; gap: 24px; }
@media (min-width: 640px) { .nx-article-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .nx-article-grid { grid-template-columns: repeat(3, 1fr); } }
.nx-pagination { margin-top: 40px; display: flex; justify-content: center; }
.nx-pagination .nav-links { display: flex; gap: 8px; }
.nx-pagination .page-numbers { min-width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; border: 1px solid var(--color-border); font-weight: 600; font-size: 14px; }
.nx-pagination .page-numbers.current { background: var(--color-brand-purple); color: #fff; border-color: var(--color-brand-purple); }

/* ---------------------------------------------------------------------------
 * Bloques nuevos
 * ------------------------------------------------------------------------- */
.nx-banner__inner { position: relative; overflow: hidden; display: flex; align-items: center; background: var(--color-ink-primary); min-height: 360px; }
.nx-banner--sm .nx-banner__inner { min-height: 260px; }
.nx-banner--lg .nx-banner__inner { min-height: 520px; }
.nx-banner__media, .nx-banner__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nx-banner--dark .nx-banner__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,10,18,.72), rgba(8,10,18,.2)); }
.nx-banner__content { position: relative; z-index: 1; max-width: 620px; padding: 40px 24px; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
@media (min-width: 1024px) { .nx-banner__content { padding: 56px 60px; } }
.nx-banner__eyebrow { font-size: 14px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.nx-banner__title { font-size: clamp(26px, 3.4vw, 42px); line-height: 1.1; font-weight: 600; }
.nx-banner__text { font-size: 16px; line-height: 1.6; }
.nx-banner--dark .nx-banner__content { color: #fff; }
.nx-banner--dark .nx-banner__eyebrow { color: rgba(255,255,255,.75); }
.nx-banner:not(.nx-banner--dark) .nx-banner__inner { background: #f7f7f8; }
.nx-banner:not(.nx-banner--dark) .nx-banner__title { color: var(--color-ink-primary); }
.nx-banner:not(.nx-banner--dark) .nx-banner__text { color: var(--color-ink-secondary); }

.nx-text__inner { max-width: 820px; }
.nx-text--center .nx-text__inner { margin: 0 auto; text-align: center; }

/* ---------------------------------------------------------------------------
 * WooCommerce: avisos
 * ------------------------------------------------------------------------- */
.woocommerce-error, .woocommerce-message, .woocommerce-info, .woocommerce-notice { list-style: none; margin: 0 0 20px; padding: 14px 18px; border-radius: 14px; font-size: 14px; line-height: 1.5; background: #eaf3fb; color: var(--color-ink-primary); display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; justify-content: space-between; }
.woocommerce-error { background: #fef3f2; color: #b42318; flex-direction: column; align-items: flex-start; }
.woocommerce-message { background: #ecfdf3; color: #15803d; }
.woocommerce-error li { list-style: none; }
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message .button, .woocommerce-info .button { font-weight: 600; text-decoration: underline; }
.woocommerce-form-coupon-toggle .woocommerce-info a, .woocommerce-form-login-toggle .woocommerce-info a { color: var(--color-brand-purple); font-weight: 600; }

/* Campos (checkout, cuenta, cupones) con el mismo estilo de contact-input */
.nx-wc .form-row { display: flex; flex-direction: column; gap: 8px; margin: 0 0 16px; }
.nx-wc .form-row label { color: var(--color-ink-primary); font-size: 14px; font-weight: 600; }
.nx-wc .form-row label .required { color: #d92d20; text-decoration: none; border: 0; }
.nx-wc .form-row label .optional { color: var(--color-ink-secondary); font-weight: 400; }
.nx-wc .input-text, .nx-wc select, .nx-wc textarea, .nx-wc input[type="text"], .nx-wc input[type="email"], .nx-wc input[type="tel"], .nx-wc input[type="password"], .nx-wc input[type="number"] {
  border-radius: var(--radius-input); border: 1px solid var(--color-border); background: var(--color-surface); width: 100%; color: var(--color-ink-primary); padding: 10px 16px; font-family: inherit; font-size: 15px; line-height: 1.4; transition: border-color .3s;
}
.nx-wc select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666666' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 16px; padding-right: 40px; }
.nx-wc .input-text:focus, .nx-wc select:focus, .nx-wc textarea:focus { border-color: var(--color-brand-purple); outline: none; }
.nx-wc textarea { min-height: 100px; }
.nx-wc .woocommerce-invalid .input-text, .nx-wc .woocommerce-invalid select { border-color: #d92d20; }
.nx-wc .woocommerce-input-wrapper { display: block; }
.nx-wc input[type="checkbox"], .nx-wc input[type="radio"] { accent-color: var(--color-brand-purple); width: 16px; height: 16px; }
.nx-wc .woocommerce-form__label-for-checkbox { display: inline-flex; gap: 10px; align-items: center; font-weight: 500; cursor: pointer; }
@media (min-width: 640px) {
  .nx-wc .woocommerce-billing-fields__field-wrapper, .nx-wc .woocommerce-shipping-fields__field-wrapper, .nx-wc .woocommerce-address-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
  .nx-wc .form-row-wide, .nx-wc #billing_address_1_field, .nx-wc #billing_address_2_field, .nx-wc #shipping_address_1_field, .nx-wc #shipping_address_2_field, .nx-wc #billing_country_field, .nx-wc #shipping_country_field { grid-column: 1 / -1; }
}
.nx-wc h3 { font-family: var(--font-display); color: var(--color-ink-primary); font-size: 20px; font-weight: 600; margin-bottom: 18px; }
.nx-wc .button, .nx-wc button.button, .nx-wc input.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: var(--radius-btn); background: var(--color-brand-purple); color: #fff; padding: 12px 22px; font-size: 15px; font-weight: 600; cursor: pointer; transition: background-color .3s; border: 0; }
.nx-wc .button:hover { background: var(--color-brand-blue); }

.nx-wc .nx-hidden-field { display: none !important; }
/* selectWoo (región/comuna) con el mismo look de los inputs */
.nx-wc .select2-container .select2-selection--single { height: auto; min-height: 44px; border-radius: var(--radius-input); border: 1px solid var(--color-border); display: flex; align-items: center; padding: 0 8px; }
.nx-wc .select2-container .select2-selection--single .select2-selection__rendered { color: var(--color-ink-primary); font-size: 15px; line-height: 1.4; padding-left: 8px; }
.nx-wc .select2-container .select2-selection--single .select2-selection__arrow { height: 100%; right: 8px; }
.nx-wc .select2-container--focus .select2-selection--single, .nx-wc .select2-container--open .select2-selection--single { border-color: var(--color-brand-purple); }
.select2-dropdown { border-color: var(--color-border) !important; border-radius: 12px !important; overflow: hidden; font-size: 14px; }
.select2-results__option--highlighted[aria-selected], .select2-results__option--highlighted[data-selected] { background: var(--color-brand-purple) !important; }

/* Checkout: datos a la izquierda, resumen y pago a la derecha */
.nx-checkout { display: grid; gap: 24px; align-items: start; }
@media (min-width: 900px) { .nx-checkout { grid-template-columns: 1fr .8fr; } .nx-checkout__aside { position: sticky; top: 110px; } }
.nx-checkout__block + .nx-checkout__block { margin-top: 12px; }
.nx-checkout #ship-to-different-address { font-size: 15px; font-family: inherit; }
.nx-checkout .woocommerce-additional-fields h3 { display: none; }
.nx-checkout .shop_table { width: 100%; border-collapse: collapse; font-size: 14px; margin-top: 14px; }
.nx-checkout .shop_table th, .nx-checkout .shop_table td { padding: 10px 0; border-bottom: 1px solid var(--color-border); text-align: left; vertical-align: top; color: var(--color-ink-secondary); font-weight: 500; }
.nx-checkout .shop_table td:last-child, .nx-checkout .shop_table th:last-child { text-align: right; }
.nx-checkout .shop_table thead { display: none; }
.nx-checkout .shop_table .product-name { color: var(--color-ink-primary); }
.nx-checkout .shop_table .product-quantity { color: var(--color-ink-secondary); font-weight: 400; }
.nx-checkout .shop_table .variation { font-size: 12px; display: grid; grid-template-columns: auto 1fr; gap: 0 6px; margin-top: 4px; }
.nx-checkout .shop_table .variation dd, .nx-checkout .shop_table .variation p { margin: 0; }
.nx-checkout .shop_table .order-total th, .nx-checkout .shop_table .order-total td { color: var(--color-ink-primary); font-size: 18px; font-weight: 700; border-bottom: 0; padding-top: 14px; }
.nx-checkout .woocommerce-shipping-methods { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; text-align: left; }
.nx-checkout .woocommerce-shipping-methods li { display: flex; gap: 8px; align-items: center; }
.nx-checkout #payment { margin-top: 18px; }
.nx-checkout .wc_payment_methods { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.nx-checkout .wc_payment_method { border: 1px solid var(--color-border); border-radius: 14px; background: #fff; padding: 12px 14px; }
.nx-checkout .wc_payment_method > label { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--color-ink-primary); cursor: pointer; flex-wrap: wrap; }
.nx-checkout .wc_payment_method > label img { max-height: 26px; width: auto; }
.nx-checkout .payment_box { margin-top: 10px; font-size: 13px; color: var(--color-ink-secondary); line-height: 1.5; }
.nx-checkout .woocommerce-privacy-policy-text, .nx-checkout .woocommerce-terms-and-conditions-wrapper { font-size: 13px; color: var(--color-ink-secondary); margin-top: 14px; line-height: 1.5; }
.nx-checkout .woocommerce-privacy-policy-text a, .nx-checkout .woocommerce-terms-and-conditions-link { color: var(--color-brand-purple); font-weight: 600; }
.nx-checkout #place_order { width: 100%; margin-top: 16px; padding: 15px 22px; font-size: 16px; }
.nx-checkout .blockUI.blockOverlay { background: rgba(255,255,255,.6) !important; }
.checkout_coupon { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; }
.checkout_coupon p:not(.form-row) { width: 100%; font-size: 14px; }
.checkout_coupon .form-row { flex: 1; margin: 0; }

/* Confirmación del pedido */
.nx-thankyou-gateway:not(:empty) { margin-top: 24px; text-align: left; font-size: 14px; }
.nx-thankyou-gateway table { width: 100%; border-collapse: collapse; }
.nx-thankyou-gateway td, .nx-thankyou-gateway th { border-bottom: 1px solid var(--color-border); padding: 8px 4px; text-align: left; }
.woocommerce-order .woocommerce-customer-details, .woocommerce-order .woocommerce-order-details { display: none; }

/* Mi cuenta */
.woocommerce-account .nx-wc .woocommerce { display: grid; gap: 28px; }
@media (min-width: 900px) { .woocommerce-account .nx-wc .woocommerce { grid-template-columns: 240px 1fr; align-items: start; } }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 8px; border: 1px solid var(--color-border); border-radius: var(--radius-card); background: #f7f7f8; display: grid; gap: 2px; }
.woocommerce-MyAccount-navigation a { display: block; padding: 10px 14px; border-radius: 12px; font-size: 14px; font-weight: 600; color: var(--color-ink-secondary); }
.woocommerce-MyAccount-navigation .is-active a, .woocommerce-MyAccount-navigation a:hover { background: #fff; color: var(--color-brand-purple); }
.woocommerce-MyAccount-content { font-size: 15px; color: var(--color-ink-secondary); line-height: 1.6; }
.woocommerce-MyAccount-content a { color: var(--color-brand-purple); font-weight: 600; }
.nx-wc table.shop_table, .nx-wc .woocommerce-orders-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.nx-wc table.shop_table th, .nx-wc table.shop_table td { padding: 12px 8px; border-bottom: 1px solid var(--color-border); text-align: left; }
.nx-wc .u-columns { display: grid; gap: 32px; }
@media (min-width: 900px) { .nx-wc .u-columns { grid-template-columns: 1fr 1fr; } }
.nx-wc .woocommerce-form-login, .nx-wc .woocommerce-form-register, .nx-wc .woocommerce-ResetPassword { border: 1px solid var(--color-border); border-radius: var(--radius-card); padding: 24px; background: #fff; }
.nx-wc .lost_password a { color: var(--color-brand-purple); font-size: 14px; font-weight: 600; }

/* Cupón en el carrito */
.nx-coupon { display: flex; gap: 8px; margin-top: 18px; }
.nx-coupon .contact-input { flex: 1; min-width: 0; }
.nx-coupon-remove { font-size: 11px; color: var(--color-ink-secondary); margin-left: 4px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ---------------------------------------------------------------------------
 * Cursor de mano en botones: el preflight de Tailwind v4 lo deja en "default".
 * ------------------------------------------------------------------------- */
button:not(:disabled), [role="button"]:not([aria-disabled="true"]), summary, select, label[for], input[type="checkbox"], input[type="radio"], input[type="submit"], input[type="file"] { cursor: pointer; }
button:disabled, [aria-disabled="true"] { cursor: not-allowed; }

/* Tarjetas de artículo: extracto en máximo 3 líneas con "…". */
.article-card__excerpt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
}
