/* SaforPOS · the shop (WooCommerce) and WordPress's own pages, in the site's colours and type. On top of estilos.css. */

.tienda-wp { padding-top: clamp(6.5rem, 11vw, 8.5rem); padding-bottom: clamp(4rem, 8vw, 6rem); min-height: 70vh; }
.tienda-wp > .head, .tienda-wp .page-title, .tienda-wp .product_title { font-size: clamp(2rem, 1.2rem + 3vw, 3.75rem); line-height: 1.02; letter-spacing: -0.03em; font-weight: var(--peso-alto); margin-bottom: 1.5rem; }
.texto-wp { max-width: 72rem; }
.texto-wp > * + * { margin-top: 1rem; }
.texto-wp a:not(.button):not(.wc-block-components-button) { text-decoration: underline; text-underline-offset: 0.18em; }

.tienda-wp .migas, .woocommerce-breadcrumb { font-size: var(--step-small); color: var(--muted); margin-bottom: 1.25rem; }
.woocommerce-breadcrumb a { color: inherit; }

/* Buttons: the site's, black by default and lime for the step that pays. */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
.wc-block-components-button:not(.is-link), .wp-element-button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 3rem; padding: 0 1.4rem;
  border: 0; border-radius: var(--radius); background: var(--negro); color: var(--blanco);
  font-family: var(--font); font-size: 1rem; font-weight: var(--peso-alto); line-height: 1.1; text-decoration: none;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .wc-block-components-button:not(.is-link):hover { background: #000; color: var(--blanco); }
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce .sft-contratar.alt,
.wc-block-components-checkout-place-order-button, .wc-block-cart__submit-button {
  background: var(--lima); color: var(--negro);
}
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover,
.wc-block-components-checkout-place-order-button:hover, .wc-block-cart__submit-button:hover { background: #d9ea1a; color: var(--negro); }
.woocommerce button.button:disabled, .woocommerce button.button.disabled { opacity: 0.45; }

/* Shop grid. */
.woocommerce ul.products { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: var(--gutter); margin: 2rem 0 0; padding: 0; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product { width: auto !important; float: none !important; margin: 0 !important; display: flex; flex-direction: column; gap: 0.6rem; padding: 1.5rem; border-radius: var(--radius); background: var(--blanco); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 1.2rem !important; line-height: 1.2; font-weight: var(--peso-alto); padding: 0 !important; }
.woocommerce ul.products li.product .price { color: var(--negro) !important; font-size: 1.6rem !important; font-weight: var(--peso-alto); letter-spacing: -0.02em; margin-top: auto !important; }
.woocommerce ul.products li.product .button { margin-top: 0.4rem !important; align-self: flex-start; }
.woocommerce ul.products li.product img { border-radius: calc(var(--radius) - 4px); }
.woocommerce .woocommerce-result-count, .woocommerce .woocommerce-ordering { font-size: var(--step-small); color: var(--muted); }

/* Product page. */
.woocommerce div.product { display: grid; gap: clamp(1.5rem, 4vw, 3.5rem); }
@media (min-width: 60em) { .woocommerce div.product { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .woocommerce div.product .woocommerce-tabs, .woocommerce div.product .related { grid-column: 1 / -1; } }
.woocommerce div.product div.images, .woocommerce div.product div.summary { width: auto !important; float: none !important; margin: 0 !important; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--negro) !important; font-size: clamp(2rem, 1.4rem + 2vw, 3rem) !important; font-weight: var(--peso-alto); letter-spacing: -0.03em; }
.woocommerce div.product .woocommerce-product-details__short-description { font-size: var(--step-lead); line-height: 1.35; margin: 1rem 0 1.5rem; }
.woocommerce div.product form.cart { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.8rem; margin-top: 1rem; }
.woocommerce div.product form.cart .quantity input { min-height: 3rem; width: 5rem; border-radius: var(--radius); border: 2px solid var(--paso); font: inherit; text-align: center; }
.woocommerce-tabs ul.tabs { padding: 0 !important; }
.woocommerce-tabs ul.tabs::before { border-color: var(--paso) !important; }
.woocommerce-tabs ul.tabs li { background: var(--paso) !important; border: 0 !important; border-radius: var(--radius) var(--radius) 0 0 !important; }
.woocommerce-tabs ul.tabs li.active { background: var(--blanco) !important; }
.woocommerce-tabs ul.tabs li::before, .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce-tabs .panel { background: var(--blanco); padding: 1.5rem; border-radius: 0 var(--radius) var(--radius) var(--radius); }

/* The TPV code (plugin saforpos-tienda): the one thing to type before paying. */
.sft-tpv { flex-basis: 100%; display: grid; gap: 0.4rem; margin: 0 0 0.6rem; }
.sft-tpv label { font-weight: var(--peso-alto); }
.sft-tpv input { min-height: 3.5rem; padding: 0 1rem; border: 2px solid var(--negro); border-radius: var(--radius); background: var(--blanco); font: inherit; font-size: 1.25rem; font-variant-numeric: tabular-nums; letter-spacing: 0.06em; text-transform: uppercase; }
.sft-tpv input:focus-visible { outline: 3px solid var(--lima); outline-offset: 2px; }
.sft-tpv small { color: var(--muted); }
.sft-cuota { margin-top: 1rem; }
.sft-nota { color: var(--muted); margin-top: 0.6rem; max-width: 46ch; }

/* Forms, notices, tables (classic cart, checkout and account). */
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text, .select2-container .select2-selection--single {
  min-height: 3rem; padding: 0.5rem 0.9rem; border: 2px solid var(--paso); border-radius: var(--radius); background: var(--blanco); font: inherit;
}
.woocommerce form .form-row input.input-text:focus-visible { outline: 3px solid var(--lima); outline-offset: 1px; border-color: var(--negro); }
.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner {
  border: 0 !important; border-radius: var(--radius) !important; background: var(--blanco) !important; color: var(--negro) !important; box-shadow: inset 4px 0 0 var(--lima);
}
.woocommerce-error, .wc-block-components-notice-banner.is-error { box-shadow: inset 4px 0 0 #c0362c; }
.woocommerce-message::before, .woocommerce-info::before { color: var(--negro) !important; }
.woocommerce table.shop_table { border: 0; border-radius: var(--radius); background: var(--blanco); border-collapse: separate; }
.woocommerce table.shop_table th { font-weight: var(--peso-alto); }
.woocommerce .cart-collaterals .cart_totals, .woocommerce-checkout-review-order { background: var(--blanco); border-radius: var(--radius); padding: 1.25rem; }

/* Block cart and checkout. */
.wc-block-cart, .wc-block-checkout { font-family: var(--font); }
.wc-block-components-sidebar-layout .wc-block-components-main, .wc-block-components-sidebar { background: transparent; }
.wc-block-components-totals-wrapper, .wc-block-components-order-summary { border-color: var(--paso) !important; }
.wc-block-components-text-input input, .wc-block-components-combobox .wc-block-components-combobox-control input, .wc-blocks-components-select__select {
  border-radius: var(--radius) !important; border: 2px solid var(--paso) !important; background: var(--blanco) !important;
}

/* Account. */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem; }
.woocommerce-account .woocommerce-MyAccount-navigation a { display: inline-block; padding: 0.5rem 0.9rem; border-radius: var(--radius); background: var(--blanco); text-decoration: none; }
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a { background: var(--negro); color: var(--blanco); }
.woocommerce-account .woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content { float: none !important; width: auto !important; }

@media (prefers-reduced-motion: reduce) { .woocommerce * { transition: none !important; } }
