/* =============================================
   OLPA THEME — WOOCOMMERCE OVERRIDES
   ============================================= */

/* =============================================
   SHOP LAYOUT
   ============================================= */

/* Breadcrumb wrap */
.shop-breadcrumb-wrap { max-width: var(--container-max-width); margin: 0 auto; padding: 20px var(--container-padding) 0; }

/* Archive header (category/tag) */
.shop-archive-header { max-width: var(--container-max-width); margin: 0 auto; padding: 16px var(--container-padding) 0; }
.shop-archive-title { margin-bottom: 8px; }
.shop-archive-desc { color: var(--grey2); font-size: var(--fs-body); max-width: 600px; }

/* Main shop grid */
.shop-layout { max-width: var(--container-max-width); margin: 0 auto; padding: 16px var(--container-padding) 48px; display: grid; grid-template-columns: var(--grid-sidebar-width) 1fr; gap: var(--grid-gap); align-items: start; }
.shop-layout .woocommerce-notices-wrapper { grid-column: 1 / -1; }

/* Catalog area */
.catalog { min-width: 0; }

/* =============================================
   VEHICLE SEARCH (mock)
   ============================================= */

/* Mobile trigger button (hidden on desktop) */
.vehicle-search-toggle {
  display: none;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--dark3);
  border: 1px solid var(--border);
  border-radius: var(--radius-button);
  color: var(--grey1);
  font-family: var(--font-display);
  font-size: var(--fs-nav);
  font-weight: var(--fw-heading);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  height: var(--btn-height);
  cursor: pointer;
  transition: background .2s, color .2s;
  margin-bottom: 12px;
}
.vehicle-search-toggle:hover { background: var(--dark5); color: #fff; }

/* Overlay (mobile) */
.vehicle-search-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 9998;
  opacity: 0;
  transition: opacity .3s ease;
}
.vehicle-search-overlay.active { display: block; opacity: 1; }

/* Desktop: inline section */
.vehicle-search {
  background: var(--dark2);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 28px var(--container-padding);
}

/* Header with title + close (close hidden on desktop) */
.vehicle-search-header {
  max-width: var(--container-max-width);
  margin: 0 auto 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.vehicle-search-close {
  display: none;
  background: var(--dark3); border: 1px solid var(--border);
  border-radius: var(--radius-button);
  width: var(--icon-btn-size); height: var(--icon-btn-size);
  align-items: center; justify-content: center;
  color: var(--grey1); cursor: pointer;
  transition: background .2s, color .2s;
  flex-shrink: 0;
}
.vehicle-search-close:hover { background: var(--dark5); color: #fff; }

.vehicle-search-inner { max-width: var(--container-max-width); margin: 0 auto; }
.vehicle-search-title {
  font-family: var(--font-display);
  font-weight: var(--fw-heading);
  font-size: 20px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 10px;
}
.vehicle-search-title::before {
  content: '';
  width: 4px;
  height: 22px;
  background: var(--red);
  border-radius: 2px;
  flex-shrink: 0;
}
.vehicle-form {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}
.vehicle-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-width: 140px;
}
.vehicle-field label {
  font-family: var(--font-display);
  font-size: var(--fs-badge);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--grey2);
}
.vehicle-field select {
  background: var(--dark4);
  border: 1px solid var(--dark5);
  border-radius: var(--radius-button);
  color: var(--white);
  font-size: var(--fs-small);
  padding: 0 14px;
  height: var(--btn-height-lg);
  outline: none;
  transition: border-color .2s;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 34px;
  cursor: pointer;
  width: 100%;
}
.vehicle-field select:focus { border-color: var(--red); }
.vehicle-field select option { background: var(--dark3); }
.vehicle-field select:disabled { opacity: 0.5; cursor: not-allowed; }
.vehicle-btn {
  background: var(--red);
  color: #fff;
  font-family: var(--font-button);
  font-weight: var(--fw-button);
  font-size: var(--fs-button-lg);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  height: var(--btn-height-lg);
  padding: 0 var(--container-padding);
  border-radius: var(--radius-button);
  display: flex;
  align-items: center;
  gap: 8px;
  border: none;
  transition: background .2s, transform .15s;
  white-space: nowrap;
  flex-shrink: 0;
  cursor: pointer;
}
.vehicle-btn:hover { background: var(--red-dark); transform: translateY(-1px); }
.vehicle-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }

/* Vehicle search results */
.vs-results { margin-top: 16px; background: var(--dark3); border: 1px solid var(--border); border-radius: var(--radius-button); overflow: hidden; }
.vs-results-title { font-family: var(--font-display); font-size: var(--fs-nav); font-weight: var(--fw-heading); text-transform: uppercase; letter-spacing: var(--ls-nav); color: var(--white); padding: 12px 16px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 8px; }
.vs-size-row { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--border); transition: background .2s; }
.vs-size-row:last-child { border-bottom: none; }
.vs-size-row:hover { background: rgba(255,255,255,.03); }
.vs-size-value { font-family: var(--font-display); font-weight: var(--fw-heading); font-size: var(--fs-body); color: var(--white); min-width: 100px; }
.vs-size-type { font-size: var(--fs-cuotas); color: var(--grey2); display: flex; align-items: center; gap: 4px; flex: 1; }
.vs-size-type i { color: var(--green); }
.vs-size-btn { font-family: var(--font-display); font-size: var(--fs-cuotas); font-weight: 700; letter-spacing: var(--ls-nav); text-transform: uppercase; color: var(--red); display: flex; align-items: center; gap: 4px; flex-shrink: 0; transition: gap .2s; }
.vs-size-row:hover .vs-size-btn { gap: 8px; }
.vs-no-results { padding: 20px; text-align: center; color: var(--grey3); font-size: var(--fs-small); }

/* Also style results inside sf- search cards (home) */
.search-card .vs-results { margin-top: 14px; }

/* Mobile: becomes a slide-in panel */
@media (max-width: 1024px) {
  .vehicle-search-toggle { display: flex; }
  .vehicle-search-close { display: flex; }

  .vehicle-search {
    position: fixed;
    top: 0; left: 0;
    width: 85%; max-width: 380px;
    height: 100vh; height: 100dvh;
    z-index: 9999;
    border: none;
    border-right: 1px solid var(--border);
    border-radius: 0;
    background: var(--dark1);
    padding: var(--container-padding);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateX(-100%);
    transition: transform .3s ease;
    display: flex;
    flex-direction: column;
  }
  .vehicle-search.active { transform: translateX(0); }

  .vehicle-search-header { margin: 0 0 20px; }
  .vehicle-search-title { font-size: var(--fs-h4); }
  .vehicle-form { flex-direction: column; }
  .vehicle-field { min-width: 100%; }
  .vehicle-btn { width: 100%; justify-content: center; margin-top: 8px; }
}

/* =============================================
   CATALOG TOOLBAR
   ============================================= */
.catalog-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
  gap: 12px;
}
.catalog-info { font-size: var(--fs-small); color: var(--grey2); white-space: nowrap; display: flex; align-items: center; gap: 10px; }
.catalog-info strong { color: var(--white); font-weight: 700; }
.clear-filters-btn { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-display); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--red); text-decoration: none; transition: color .2s; white-space: nowrap; }
.clear-filters-btn:hover { color: var(--white); }
.catalog-sort { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.sort-label { font-family: var(--font-display); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--grey3); white-space: nowrap; }

/* Style WC ordering select */
.woocommerce-ordering { display: block !important; }
.woocommerce-ordering select,
.sort-select {
  background: var(--dark4);
  border: 1px solid var(--dark5);
  border-radius: var(--radius-button);
  color: var(--white);
  font-family: var(--font-display);
  font-size: var(--fs-cuotas);
  font-weight: var(--fw-nav);
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
  padding: 0 32px 0 12px;
  height: 36px;
  outline: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  cursor: pointer;
  transition: border-color .2s;
}
.woocommerce-ordering select:focus { border-color: var(--red); }

/* Hide default WC result count (we render our own) */
.woocommerce-result-count { display: none; }

/* =============================================
   PRODUCT GRID
   ============================================= */
.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--card-gap);
  list-style: none;
  margin: 0;
  padding: 0;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none; display: none; }
.woocommerce ul.products li.product {
  margin: 0;
  padding: 0;
  float: none;
  width: auto;
}

/* =============================================
   SIDEBAR / FILTER WIDGETS
   ============================================= */

/* Active filter tags */
.active-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.active-filter-tag {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: var(--font-display); font-size: var(--fs-badge); font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  background: rgba(227,27,35,.15); border: 1px solid var(--red); color: var(--red);
  padding: 4px 8px; border-radius: var(--radius-badge);
  transition: background .2s;
}
.active-filter-tag:hover { background: rgba(227,27,35,.3); }

/* Sidebar clear button */
.sidebar-clear {
  font-family: var(--font-display); font-size: var(--fs-eyebrow); font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--red); background: none; border: none; cursor: pointer;
  transition: color .2s;
}
.sidebar-clear:hover { color: var(--white); }
.sidebar-empty { font-size: var(--fs-small); color: var(--grey3); }

/* Filter count */
.filter-count { color: var(--grey3); font-size: var(--fs-badge); }

/* Filter list (for category list display) */
.filter-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.filter-list a { font-size: var(--fs-small); color: var(--grey2); transition: color .2s; display: flex; justify-content: space-between; }
.filter-list a:hover, .filter-list a.active { color: var(--red); }

/* Measure fields (ancho/perfil/rodado) */
.filter-measure-fields { display: flex; flex-direction: column; gap: 10px; }

/* Price filter */
.filter-price-form { display: flex; flex-direction: column; gap: 10px; }
.filter-price-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.filter-input {
  width: 100%; background: var(--dark4); border: 1px solid var(--dark5);
  border-radius: var(--radius-button); color: var(--white);
  font-size: var(--fs-small); padding: 0 12px; height: 40px; outline: none;
  transition: border-color .2s;
}
.filter-input:focus { border-color: var(--red); }
.filter-input::placeholder { color: var(--grey3); }

/* Filter apply button (used in price widget) */
.btn-filter-apply {
  background: var(--dark4); color: var(--grey1);
  font-family: var(--font-display); font-weight: var(--fw-heading);
  font-size: var(--fs-cuotas); letter-spacing: 0.08em; text-transform: uppercase;
  height: 36px; border-radius: var(--radius-button); border: 1px solid var(--dark5);
  cursor: pointer; transition: all .2s; width: 100%;
}
.btn-filter-apply:hover { background: var(--dark5); border-color: var(--grey3); color: #fff; }

/* Rating filter */
.filter-ratings { display: flex; flex-direction: column; gap: 6px; }
.filter-rating {
  display: flex; align-items: center; gap: 6px;
  color: var(--grey2); font-size: var(--fs-small);
  padding: 4px 0; transition: color .2s; cursor: pointer;
}
.filter-rating:hover { color: var(--gold); }
.filter-rating.active { color: var(--gold); font-weight: 700; }
.filter-rating i { color: var(--grey3); }
.filter-rating:hover i, .filter-rating.active i { color: var(--gold); }
.filter-rating .ph-fill.ph-star { color: var(--gold); }
.filter-rating-text { font-family: var(--font-display); font-size: var(--fs-cuotas); letter-spacing: 0.02em; }

/* Custom checkbox with link (widget version) */
a.filter-check { display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: var(--fs-small); color: var(--grey1); margin-bottom: 8px; transition: color .2s; }
a.filter-check:hover { color: #fff; }
.custom-check.checked { background: var(--red) !important; border-color: var(--red) !important; }

/* =============================================
   BREADCRUMB
   ============================================= */
.woocommerce-breadcrumb {
  font-family: var(--font-display);
  font-size: var(--fs-cuotas);
  font-weight: var(--fw-nav);
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
  color: var(--grey3);
  padding: 16px 0 0;
}
.woocommerce-breadcrumb a { color: var(--grey2); transition: color .2s; }
.woocommerce-breadcrumb a:hover { color: var(--red); }
.breadcrumb-sep { margin: 0 6px; opacity: 0.5; }

/* =============================================
   PAGINATION
   ============================================= */
.woocommerce nav.woocommerce-pagination {
  margin-top: 32px;
  text-align: center;
}
.woocommerce nav.woocommerce-pagination ul {
  display: flex;
  justify-content: center;
  gap: 6px;
  border: none;
}
.woocommerce nav.woocommerce-pagination ul li { border: none; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  background: var(--dark3);
  border: 1px solid var(--border);
  color: var(--grey1);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-nav);
  padding: 8px 14px;
  border-radius: var(--radius-button);
  transition: all .2s;
  min-width: var(--icon-btn-size);
  display: flex;
  align-items: center;
  justify-content: center;
}
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: var(--dark5); color: #fff; border-color: var(--grey3);
}
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--red); border-color: var(--red); color: #fff;
}

/* "View cart" link after AJAX add to cart */
.card-footer .added_to_cart {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-family: var(--font-display);
  font-size: var(--fs-cuotas);
  font-weight: var(--fw-nav);
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
  color: var(--grey1);
  margin-top: 6px;
  transition: color .2s;
}
.card-footer .added_to_cart:hover { color: var(--red); }

/* =============================================
   SALE FLASH (hidden — custom badges)
   ============================================= */
.woocommerce span.onsale { display: none !important; }

/* =============================================
   SINGLE PRODUCT OVERRIDES
   ============================================= */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--white);
  font-family: var(--font-display);
  font-weight: var(--fw-hero);
  font-size: 28px;
}
.woocommerce div.product p.price del { color: var(--grey3); font-size: var(--fs-h4); font-weight: 400; }
.woocommerce div.product p.price ins { text-decoration: none; color: var(--white); }

.woocommerce div.product .single_add_to_cart_button {
  background: var(--red) !important; color: #fff !important;
  font-family: var(--font-button); font-weight: var(--fw-button);
  font-size: var(--fs-button-lg); letter-spacing: 0.08em; text-transform: uppercase;
  border-radius: var(--radius-button); padding: 12px 32px; border: none;
  transition: background .2s, transform .15s;
}
.woocommerce div.product .single_add_to_cart_button:hover {
  background: var(--red-dark) !important; transform: translateY(-1px);
}

.woocommerce .quantity .qty {
  background: var(--dark3); border: 1px solid var(--border); color: var(--white);
  border-radius: var(--radius-button); padding: 8px 12px; font-size: var(--fs-body); width: 80px;
}

/* =============================================
   WC NOTICES
   ============================================= */
.woocommerce-message,
.woocommerce-info {
  background: var(--dark2); border: 1px solid var(--border);
  border-left: 4px solid var(--green); color: var(--white);
  border-radius: var(--radius-button); padding: 14px 20px;
}
.woocommerce-error {
  background: var(--dark2); border: 1px solid rgba(248,113,113,0.3);
  border-left: 4px solid #f87171; color: var(--white);
  border-radius: var(--radius-button); padding: 14px 20px;
}
.woocommerce-message a,
.woocommerce-info a { color: var(--red); font-weight: var(--fw-nav); }


/* =============================================
   CHECKOUT — Built from WC real HTML structure
   form.checkout.woocommerce-checkout
     > .col2-set#customer_details > .col-1 + .col-2
     > h3#order_review_heading
     > #order_review > table + #payment > ul.wc_payment_methods + .place-order
   ============================================= */

/* --- Container --- */
.woocommerce-checkout .woocommerce {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 32px var(--container-padding) 64px;
}

/* --- Notices (coupon toggle, login toggle) --- */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-card) !important;
  color: var(--grey1) !important;
  padding: 16px 20px !important;
  margin-bottom: 20px;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info { border-left: 3px solid var(--gold) !important; }
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info { border-left: 3px solid var(--red) !important; }
.woocommerce-checkout .woocommerce-info a { color: var(--red) !important; font-weight: 700; }

/* --- Coupon & Login collapsed forms --- */
.woocommerce-checkout .woocommerce-form-coupon,
.woocommerce-checkout .woocommerce-form-login {
  background: var(--dark2) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-card) !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
}

/* === 2-COLUMN GRID === */
form.checkout.woocommerce-checkout {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 0 28px;
  align-items: start;
}

/* Left: customer details spans full left column */
form.checkout .col2-set#customer_details {
  grid-column: 1;
  grid-row: 1 / 4;
}

/* Inside col2-set: stack col-1 and col-2 vertically (NOT side by side) */
form.checkout .col2-set .col-1,
form.checkout .col2-set .col-2 {
  width: 100% !important;
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
}

/* Right column: order heading + order review (takes remaining space) */
form.checkout h3#order_review_heading {
  grid-column: 2;
  grid-row: 1;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  border: none !important;
  font-family: var(--font-display) !important;
  font-weight: 900 !important;
  font-size: 20px !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--white) !important;
}

form.checkout #order_review {
  grid-column: 2;
  grid-row: 2 / 4;
  position: sticky;
  top: 140px;
  align-self: start;
  background: var(--dark2);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 24px;
}

/* === SECTION TITLES (h3 inside billing/shipping) === */
form.checkout h3 {
  font-family: var(--font-display) !important;
  font-weight: 800 !important;
  font-size: 18px !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--white) !important;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
  margin: 28px 0 20px !important;
}
form.checkout .col-1 > h3:first-child { margin-top: 0 !important; }

/* === CRITICAL: input wrapper must be block+full width === */
form.checkout .woocommerce-input-wrapper {
  display: block !important;
  width: 100% !important;
}

/* === FORM ROWS (float-based, WC default) === */
form.checkout p.form-row {
  margin: 0 0 16px !important;
  padding: 0 !important;
}
form.checkout p.form-row-first {
  float: left !important;
  width: 48% !important;
}
form.checkout p.form-row-last {
  float: right !important;
  width: 48% !important;
}
form.checkout p.form-row-wide {
  clear: both !important;
  width: 100% !important;
}

/* === LABELS === */
form.checkout p.form-row > label {
  font-family: var(--font-display) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--grey2) !important;
  margin-bottom: 6px !important;
  display: block !important;
}
form.checkout label .required { color: var(--red) !important; }
form.checkout label .optional { color: var(--grey3) !important; font-size: 9px; font-weight: 400; text-transform: none; letter-spacing: 0; }

/* === ALL INPUTS === */
form.checkout .input-text,
form.checkout input[type="text"],
form.checkout input[type="email"],
form.checkout input[type="tel"],
form.checkout input[type="password"],
form.checkout input[type="number"],
form.checkout input[type="url"],
form.checkout select,
form.checkout textarea {
  background: var(--dark3) !important;
  border: 1px solid var(--dark5) !important;
  border-radius: 8px !important;
  color: var(--white) !important;
  height: 48px !important;
  padding: 0 16px !important;
  font-size: 14px !important;
  font-family: var(--font-body) !important;
  width: 100% !important;
  box-sizing: border-box !important;
  outline: none !important;
  transition: border-color 0.2s;
  -webkit-appearance: none !important;
  appearance: none !important;
}
form.checkout textarea {
  height: auto !important;
  min-height: 80px;
  padding: 12px 16px !important;
}
form.checkout input:focus,
form.checkout textarea:focus,
form.checkout select:focus {
  border-color: var(--red) !important;
}
form.checkout ::placeholder { color: var(--grey3) !important; }

/* === SELECT2 === */
form.checkout .select2-container { width: 100% !important; }
form.checkout .select2-container--default .select2-selection--single {
  background: var(--dark3) !important;
  border: 1px solid var(--dark5) !important;
  border-radius: 8px !important;
  height: 48px !important;
  outline: none !important;
}
form.checkout .select2-selection__rendered {
  color: var(--white) !important;
  line-height: 48px !important;
  padding-left: 16px !important;
  font-size: 14px !important;
}
form.checkout .select2-selection__arrow { height: 48px !important; right: 12px !important; }

/* Select2 dropdown (renders outside form, global selectors needed) */
.select2-dropdown {
  background: var(--dark2) !important;
  border: 1px solid var(--dark5) !important;
  border-radius: 8px !important;
}
.select2-results__option {
  color: var(--grey1) !important;
  padding: 10px 16px !important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background: var(--red) !important;
  color: #fff !important;
}
.select2-search--dropdown .select2-search__field {
  background: var(--dark3) !important;
  border: 1px solid var(--dark5) !important;
  color: var(--white) !important;
  padding: 8px 12px !important;
  outline: none !important;
}

/* Product thumbnail in order review */
.checkout-product-row {
  display: flex; align-items: center; gap: 12px;
}
.checkout-product-thumb {
  width: 48px !important; height: 48px !important;
  border-radius: 6px; object-fit: cover;
  flex-shrink: 0;
}

/* === ORDER REVIEW TABLE === */
.woocommerce-checkout-review-order-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 0 20px !important;
}
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--border) !important;
  color: var(--grey1);
  font-size: 14px;
  background: transparent !important;
}
.woocommerce-checkout-review-order-table thead th {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 11px !important;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--grey3) !important;
}
.woocommerce-checkout-review-order-table .cart_item .product-name {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  color: var(--white) !important;
}
.woocommerce-checkout-review-order-table .cart_item .product-total {
  text-align: right;
  color: var(--white) !important;
  font-family: var(--font-display);
  font-weight: 700;
}
.woocommerce-checkout-review-order-table tfoot th {
  font-family: var(--font-display);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--grey2) !important;
  font-size: 13px;
}
.woocommerce-checkout-review-order-table tfoot td {
  text-align: right;
  font-family: var(--font-display);
  font-weight: 700;
  color: var(--white) !important;
}
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
  font-size: 22px !important;
  font-weight: 900 !important;
  color: var(--white) !important;
  border-bottom: none !important;
  padding-top: 16px !important;
}

/* Shipping in order review */
form.checkout .woocommerce-shipping-methods { list-style: none !important; padding: 0 !important; margin: 0 !important; }
form.checkout .woocommerce-shipping-methods li { margin-bottom: 6px; }
form.checkout .woocommerce-shipping-methods li label {
  color: var(--grey1) !important; font-size: 14px; cursor: pointer; display: flex; align-items: center; gap: 8px;
}
form.checkout .woocommerce-shipping-methods input[type="radio"] { accent-color: var(--red); }

/* === PAYMENT SECTION === */
#payment.woocommerce-checkout-payment {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin-top: 20px;
}
#payment ul.wc_payment_methods.payment_methods {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
  border: none !important;
  background: transparent !important;
}
#payment ul.payment_methods > li.wc_payment_method {
  background: var(--dark3) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-card) !important;
  margin-bottom: 8px !important;
  padding: 0 !important;
  overflow: hidden;
}
#payment ul.payment_methods > li > label {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px !important;
  margin: 0 !important;
  color: var(--grey1) !important;
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  cursor: pointer !important;
  background: transparent !important;
}
#payment ul.payment_methods > li > label img {
  max-height: 24px;
  width: auto;
}
#payment ul.payment_methods > li input.input-radio {
  accent-color: var(--red);
  width: 18px !important;
  height: 18px !important;
}
#payment .payment_box {
  background: var(--dark4) !important;
  color: var(--grey2) !important;
  padding: 16px !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  border-top: 1px solid var(--border) !important;
  margin: 0 !important;
}
#payment .payment_box::before {
  display: none !important;
}
#payment .payment_box p {
  margin-bottom: 8px;
  color: var(--grey2) !important;
}
#payment .payment_box fieldset {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* === PLACE ORDER === */
#payment .form-row.place-order {
  padding: 0 !important;
  margin-top: 16px !important;
  background: transparent !important;
}
#place_order {
  background: var(--red) !important;
  color: #fff !important;
  border: none !important;
  width: 100% !important;
  height: 56px !important;
  border-radius: 10px !important;
  font-family: var(--font-display) !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  cursor: pointer;
  transition: all 0.2s;
}
#place_order:hover {
  background: var(--red-dark) !important;
  transform: translateY(-1px);
  box-shadow: 0 8px 32px rgba(227,27,35,0.25);
}

/* Terms */
#payment .woocommerce-terms-and-conditions-wrapper {
  margin-bottom: 12px;
}
#payment .woocommerce-terms-and-conditions-wrapper label {
  font-size: 13px !important;
  color: var(--grey2) !important;
  display: flex !important;
  align-items: center;
  gap: 8px;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 400 !important;
}
#payment .woocommerce-terms-and-conditions-wrapper a { color: var(--red) !important; }

/* Privacy */
#payment .woocommerce-privacy-policy-text { color: var(--grey3) !important; font-size: 12px !important; }
#payment .woocommerce-privacy-policy-text a { color: var(--red) !important; }

/* Checkbox & Radio */
form.checkout input[type="checkbox"] { width: 20px !important; height: 20px !important; accent-color: var(--red); flex-shrink: 0; }
form.checkout input[type="radio"] { accent-color: var(--red); }
form.checkout #ship-to-different-address label {
  display: flex !important; align-items: center; gap: 10px; cursor: pointer;
  font-size: 14px !important; text-transform: none !important; letter-spacing: 0 !important;
}

/* Security badges (via hook) */
.checkout-security-badges { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.checkout-security-badges .os-sec-item { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--grey3); }
.checkout-security-badges .os-sec-item i { color: var(--grey2); }

/* WC Notices */
.woocommerce-checkout .woocommerce-error {
  background: rgba(227,27,35,0.1) !important; border: none !important;
  border-left: 3px solid var(--red) !important; border-radius: var(--radius-card) !important;
  color: var(--white) !important; padding: 16px 20px !important; list-style: none !important;
}
.woocommerce-checkout .woocommerce-message {
  background: rgba(34,197,94,0.1) !important; border: none !important;
  border-left: 3px solid var(--green) !important; border-radius: var(--radius-card) !important;
  color: var(--white) !important; padding: 16px 20px !important;
}

/* =============================================
   MULTI-STEP CHECKOUT
   Steps only apply to the LEFT column (form fields).
   Right column (order review) stays visible at all times.
   ============================================= */

/* Step progress bar (injected by JS inside #customer_details) */
.checkout-steps-bar {
  display: flex; gap: 0; margin-bottom: 24px;
  background: var(--dark2); border: 1px solid var(--border);
  border-radius: var(--radius-card); overflow: hidden;
}
.checkout-step-tab {
  flex: 1; display: flex; align-items: center; justify-content: center;
  gap: 10px; padding: 14px 12px;
  font-family: var(--font-display); font-size: var(--fs-nav);
  font-weight: 700; letter-spacing: var(--ls-nav); text-transform: uppercase;
  color: var(--grey3); cursor: pointer; transition: color .2s, background .2s;
  position: relative; border: none; background: none;
}
.checkout-step-tab:hover { color: var(--grey1); }
.checkout-step-tab.active { color: var(--white); background: var(--dark4); }
.checkout-step-tab.active::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: var(--red); }
.checkout-step-tab.completed { color: var(--green); }
.checkout-step-tab.completed::before {
  content: '✓'; font-size: 12px; width: 20px; height: 20px;
  background: var(--green); color: #fff; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.checkout-step-num {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--dark4); border: 1px solid var(--dark5);
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800; flex-shrink: 0;
}
.checkout-step-tab.active .checkout-step-num { background: var(--red); border-color: var(--red); color: #fff; }
.checkout-step-tab.completed .checkout-step-num { display: none; }

/* Step content title */
.checkout-step-title {
  font-family: var(--font-display); font-weight: 800; font-size: 18px;
  text-transform: uppercase; letter-spacing: 0.06em; color: var(--white);
  padding-bottom: 12px; border-bottom: 1px solid var(--border);
  margin-bottom: 20px; display: flex; align-items: center; gap: 10px;
}
.checkout-step-title i { color: var(--red); }

/* Step nav buttons */
.checkout-step-nav {
  display: flex; gap: 12px; margin-top: 24px; padding-top: 20px;
  border-top: 1px solid var(--border);
}
.checkout-step-nav .btn-step-prev {
  background: var(--dark3); color: var(--grey1); border: 1px solid var(--dark5);
  border-radius: var(--radius-button); height: 48px; padding: 0 24px;
  font-family: var(--font-display); font-weight: 700; font-size: var(--fs-nav);
  letter-spacing: var(--ls-nav); text-transform: uppercase;
  cursor: pointer; transition: all .2s; display: flex; align-items: center; gap: 8px;
}
.checkout-step-nav .btn-step-prev:hover { background: var(--dark5); color: var(--white); border-color: var(--grey3); }
.checkout-step-nav .btn-step-next {
  background: var(--red); color: #fff; border: none;
  border-radius: var(--radius-button); height: 48px; padding: 0 32px;
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-nav);
  letter-spacing: 0.08em; text-transform: uppercase;
  cursor: pointer; transition: all .2s; margin-left: auto;
  display: flex; align-items: center; gap: 8px;
}
.checkout-step-nav .btn-step-next:hover { background: var(--red-dark); transform: translateY(-1px); }

/* === RESPONSIVE === */
@media (max-width: 900px) {
  form.checkout.woocommerce-checkout {
    grid-template-columns: 1fr !important;
  }
  form.checkout .col2-set#customer_details { grid-row: auto; }
  form.checkout h3#order_review_heading { grid-column: 1; grid-row: auto; margin-top: 32px !important; }
  form.checkout #order_review { grid-column: 1; grid-row: auto; position: static !important; }
}
@media (max-width: 540px) {
  form.checkout p.form-row-first,
  form.checkout p.form-row-last {
    width: 100% !important;
    float: none !important;
  }
  .checkout-step-tab { font-size: var(--fs-badge); padding: 10px 8px; gap: 6px; }
  .checkout-step-num { width: 20px; height: 20px; font-size: 10px; }
  .checkout-step-nav { flex-wrap: wrap; }
  .checkout-step-nav .btn-step-prev,
  .checkout-step-nav .btn-step-next { flex: 1; justify-content: center; }
}

/* =============================================
   MY ACCOUNT
   ============================================= */

/* Main layout — flex container, constrained to viewport */
.woocommerce-account .woocommerce {
  display: flex;
  gap: var(--grid-gap);
  max-width: var(--container-max-width);
  width: 100%;
  margin: 0 auto;
  padding: 32px var(--container-padding) 64px;
  align-items: flex-start;
  box-sizing: border-box;
  overflow: hidden;
}

/* Our wrapper (if template renders it) */
.olpa-account { max-width: var(--container-max-width); width: 100%; margin: 0 auto; padding: 32px var(--container-padding) 64px; box-sizing: border-box; overflow: hidden; }
.olpa-account-layout { display: flex; gap: var(--grid-gap); align-items: flex-start; width: 100%; }

/* Navigation sidebar */
.woocommerce-MyAccount-navigation {
  width: 260px;
  min-width: 260px;
  flex-shrink: 0;
  background: var(--dark2);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 8px 0;
  position: sticky;
  top: var(--sidebar-sticky-top);
}
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.woocommerce-MyAccount-navigation ul li { margin: 0; }
.woocommerce-MyAccount-navigation ul li a {
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
  padding: 12px 18px;
  font-family: var(--font-display);
  font-size: var(--fs-nav);
  font-weight: var(--fw-nav);
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
  color: var(--grey1);
  border-left: 3px solid transparent;
  transition: all .2s;
}
.woocommerce-MyAccount-navigation ul li a:hover { color: var(--white); background: rgba(255,255,255,.04); }
.woocommerce-MyAccount-navigation ul li.is-active a {
  color: var(--white); background: rgba(227,27,35,.1);
  border-left-color: var(--red); font-weight: 700;
}
.woocommerce-MyAccount-navigation ul li a i { flex-shrink: 0; color: var(--grey2); }
.woocommerce-MyAccount-navigation ul li.is-active a i { color: var(--red); }

/* Content area — takes all remaining space, no overflow */
.woocommerce-MyAccount-content {
  flex: 1;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
.olpa-account-content { flex: 1; min-width: 0; width: 100%; max-width: 100%; overflow: hidden; }

/* Logout confirmation modal */
.logout-modal-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 9998;
  opacity: 0;
  transition: opacity .3s ease;
}
.logout-modal-overlay.active { display: flex; align-items: center; justify-content: center; opacity: 1; }
.logout-modal {
  background: var(--dark2);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 32px;
  max-width: 400px;
  width: 90%;
  text-align: center;
  z-index: 9999;
}
.logout-modal-icon { font-size: 32px; color: var(--red); margin-bottom: 16px; }
.logout-modal-title { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: var(--fs-h3); text-transform: uppercase; color: var(--white); margin-bottom: 8px; }
.logout-modal-text { font-size: var(--fs-small); color: var(--grey2); margin-bottom: 24px; }
.logout-modal-actions { display: flex; gap: 10px; justify-content: center; }
.logout-modal-actions .btn-secondary,
.logout-modal-actions .btn-primary { flex: 1; justify-content: center; }

/* Dashboard welcome */
.account-dashboard-welcome { background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card); padding: var(--container-padding); margin-bottom: 20px; }
.account-dashboard-hello { font-size: var(--fs-body); color: var(--grey1); margin-bottom: 4px; }
.account-dashboard-hello strong { color: var(--white); }
.account-dashboard-not-you { font-size: var(--fs-small); color: var(--grey3); }
.account-dashboard-not-you a { color: var(--red); transition: color .2s; }
.account-dashboard-not-you a:hover { color: var(--white); }
.account-dashboard-desc { font-size: var(--fs-small); color: var(--grey2); line-height: 1.5; }

/* Dashboard quick action cards */
.account-dashboard-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.account-dashboard-card {
  background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card);
  padding: 24px 20px; display: flex; flex-direction: column; align-items: center;
  text-align: center; gap: 10px; transition: border-color .2s, transform .2s;
}
.account-dashboard-card:hover { border-color: var(--red-glow); transform: translateY(-3px); }
.account-dashboard-card-icon { font-size: 28px; color: var(--red); }
.account-dashboard-card-title { font-family: var(--font-display); font-weight: var(--fw-heading); font-size: var(--fs-nav); text-transform: uppercase; letter-spacing: var(--ls-nav); color: var(--white); }
.account-dashboard-card-desc { font-size: var(--fs-cuotas); color: var(--grey2); }

/* Account tables (orders, downloads) */
.olpa-account .woocommerce-orders-table,
.olpa-account .woocommerce-table,
.woocommerce-account .woocommerce-orders-table,
.woocommerce-account .woocommerce-table { width: 100%; border-collapse: collapse; background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card); overflow: hidden; }
.olpa-account .woocommerce-orders-table thead th,
.olpa-account .woocommerce-table thead th,
.woocommerce-account .woocommerce-orders-table thead th,
.woocommerce-account .woocommerce-table thead th {
  font-family: var(--font-display); font-size: var(--fs-eyebrow); font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--grey3);
  padding: 14px 16px; text-align: left; background: var(--dark3); border: none;
}
.olpa-account .woocommerce-orders-table tbody td,
.olpa-account .woocommerce-table tbody td,
.woocommerce-account .woocommerce-orders-table tbody td,
.woocommerce-account .woocommerce-table tbody td {
  padding: 14px 16px; font-size: var(--fs-small); color: var(--grey1);
  border-bottom: 1px solid var(--border); background: none;
}
.olpa-account .woocommerce-orders-table tbody tr:last-child td { border-bottom: none; }

/* Order status badges */
.olpa-account .woocommerce-orders-table .order-status {
  font-family: var(--font-display); font-size: var(--fs-badge); font-weight: var(--fw-badge);
  letter-spacing: 0.06em; text-transform: uppercase; padding: 3px 8px; border-radius: var(--radius-badge);
}

/* Order action buttons */
.olpa-account .woocommerce-orders-table .woocommerce-button,
.olpa-account .woocommerce-orders-table .button {
  background: var(--dark4); color: var(--grey1);
  font-family: var(--font-display); font-weight: var(--fw-nav); font-size: var(--fs-cuotas);
  letter-spacing: var(--ls-nav); text-transform: uppercase;
  padding: 6px 14px; border-radius: var(--radius-button); border: 1px solid var(--dark5);
  transition: all .2s; display: inline-flex; align-items: center; gap: 4px;
}
.olpa-account .woocommerce-orders-table .button:hover { background: var(--dark5); border-color: var(--grey3); color: #fff; }

/* Empty state */
.olpa-account .woocommerce-message--info,
.olpa-account .woocommerce-info { background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 40px; text-align: center; color: var(--grey2); }

/* Address cards */
.woocommerce-account .woocommerce-Addresses,
.olpa-account .woocommerce-Addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.woocommerce-account .woocommerce-Address,
.olpa-account .woocommerce-Address { background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 24px; }
.woocommerce-account .woocommerce-Address-title h3,
.olpa-account .woocommerce-Address-title h3 {
  font-family: var(--font-display); font-size: var(--fs-h3); font-weight: var(--fw-heading);
  text-transform: uppercase; letter-spacing: var(--ls-nav); margin-bottom: 12px;
  display: flex; justify-content: space-between; align-items: center;
}
.woocommerce-account .woocommerce-Address-title a,
.olpa-account .woocommerce-Address-title a {
  font-family: var(--font-display); font-size: var(--fs-cuotas); font-weight: var(--fw-nav);
  text-transform: uppercase; letter-spacing: var(--ls-nav); color: var(--red); transition: color .2s;
}
.woocommerce-account .woocommerce-Address-title a:hover,
.olpa-account .woocommerce-Address-title a:hover { color: var(--white); }
.woocommerce-account .woocommerce-Address address,
.olpa-account .woocommerce-Address address { font-size: var(--fs-small); color: var(--grey2); line-height: 1.6; font-style: normal; }

/* Address edit form */
.woocommerce-account .woocommerce-address-fields .form-row { margin-bottom: 12px; display: flex; flex-direction: column; gap: 4px; }
.woocommerce-account .woocommerce-address-fields label {
  font-family: var(--font-display); font-size: var(--fs-badge); font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--grey2);
}
.woocommerce-account .woocommerce-address-fields label .required { color: var(--red); }
.woocommerce-account .woocommerce-address-fields input:not([type="checkbox"]):not([type="submit"]),
.woocommerce-account .woocommerce-address-fields select {
  background: var(--dark3); border: 1px solid var(--dark5); border-radius: var(--radius-button);
  color: var(--white); font-size: var(--fs-small); padding: 0 14px; height: var(--btn-height-lg);
  outline: none; transition: border-color .2s; width: 100%;
}
.woocommerce-account .woocommerce-address-fields input:focus,
.woocommerce-account .woocommerce-address-fields select:focus { border-color: var(--red); }
.woocommerce-account .woocommerce-address-fields .button {
  background: var(--red); color: #fff;
  font-family: var(--font-button); font-weight: var(--fw-button);
  font-size: var(--fs-button-lg); letter-spacing: 0.08em; text-transform: uppercase;
  height: var(--btn-height-lg); padding: 0 32px; border-radius: var(--radius-button);
  border: none; cursor: pointer; transition: background .2s, transform .15s; margin-top: 8px;
}
.woocommerce-account .woocommerce-address-fields .button:hover { background: var(--red-dark); transform: translateY(-1px); }

/* Edit account + address forms */
.olpa-account .woocommerce-EditAccountForm .form-row,
.olpa-account .woocommerce-address-fields .form-row { margin-bottom: 12px; display: flex; flex-direction: column; gap: 4px; }
.olpa-account .woocommerce-EditAccountForm label,
.olpa-account .woocommerce-address-fields label {
  font-family: var(--font-display); font-size: var(--fs-badge); font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--grey2);
}
.olpa-account .woocommerce-EditAccountForm label .required,
.olpa-account .woocommerce-address-fields label .required { color: var(--red); }
.olpa-account .woocommerce-EditAccountForm input:not([type="checkbox"]):not([type="submit"]),
.olpa-account .woocommerce-EditAccountForm select,
.olpa-account .woocommerce-address-fields input:not([type="checkbox"]):not([type="submit"]),
.olpa-account .woocommerce-address-fields select {
  background: var(--dark3); border: 1px solid var(--dark5); border-radius: var(--radius-button);
  color: var(--white); font-size: var(--fs-small); padding: 0 14px; height: var(--btn-height-lg);
  outline: none; transition: border-color .2s; width: 100%;
}
.olpa-account .woocommerce-EditAccountForm input:focus,
.olpa-account .woocommerce-address-fields input:focus,
.olpa-account .woocommerce-address-fields select:focus { border-color: var(--red); }
.olpa-account .woocommerce-EditAccountForm .button,
.olpa-account .woocommerce-address-fields .button {
  background: var(--red); color: #fff;
  font-family: var(--font-button); font-weight: var(--fw-button);
  font-size: var(--fs-button-lg); letter-spacing: 0.08em; text-transform: uppercase;
  height: var(--btn-height-lg); padding: 0 32px; border-radius: var(--radius-button);
  border: none; cursor: pointer; transition: background .2s, transform .15s; margin-top: 8px;
}
.olpa-account .woocommerce-EditAccountForm .button:hover,
.olpa-account .woocommerce-address-fields .button:hover { background: var(--red-dark); transform: translateY(-1px); }

/* Account responsive — tablet */
@media (max-width: 1024px) {
  .woocommerce-account .woocommerce { padding: 24px var(--container-padding) 48px; }
}

/* Account responsive — mobile */
@media (max-width: 768px) {
  /* Stack layout: nav above, content below */
  .olpa-account,
  .olpa-account-layout,
  .woocommerce-account .woocommerce { flex-direction: column; padding: 16px var(--container-padding) 48px; gap: 16px; max-width: 100%; overflow-x: hidden; }

  /* Force content to fit screen */
  .woocommerce-MyAccount-content,
  .olpa-account-content { width: 100%; max-width: 100%; overflow-x: auto; }

  /* Nav becomes horizontal scrollable pills */
  .woocommerce-MyAccount-navigation {
    width: 100% !important; min-width: 0 !important; position: static;
    border-radius: var(--radius-button); padding: 4px;
  }
  .woocommerce-MyAccount-navigation ul {
    display: flex; gap: 4px; overflow-x: auto;
    -webkit-overflow-scrolling: touch; padding: 0;
    scrollbar-width: none;
  }
  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
  .woocommerce-MyAccount-navigation ul li { flex-shrink: 0; }
  .woocommerce-MyAccount-navigation ul li a {
    border-left: none !important;
    padding: 10px 14px;
    font-size: var(--fs-badge);
    background: var(--dark3);
    border: 1px solid var(--dark5);
    border-radius: var(--radius-badge);
    gap: 6px;
  }
  .woocommerce-MyAccount-navigation ul li a:hover { background: var(--dark5); border-color: var(--grey3); }
  .woocommerce-MyAccount-navigation ul li.is-active a {
    background: var(--red) !important; border-color: var(--red); color: #fff;
  }
  .woocommerce-MyAccount-navigation ul li.is-active a i { color: #fff; }

  /* Dashboard cards: 1 column */
  .account-dashboard-cards { grid-template-columns: 1fr; }
  .account-dashboard-welcome { padding: 16px; }

  /* Addresses: stack */
  .olpa-account .woocommerce-Addresses,
  .woocommerce-account .woocommerce-Addresses { grid-template-columns: 1fr; }

  /* All inputs/selects: force fit within screen */
  .woocommerce-account input,
  .woocommerce-account select,
  .woocommerce-account textarea,
  .olpa-account input,
  .olpa-account select,
  .olpa-account textarea { max-width: 100%; box-sizing: border-box; }

  /* Address edit form: full width inputs */
  .woocommerce-account .woocommerce-address-fields .form-row,
  .olpa-account .woocommerce-address-fields .form-row,
  .olpa-account .woocommerce-EditAccountForm .form-row { width: 100%; }
  .woocommerce-account .woocommerce-address-fields .button,
  .olpa-account .woocommerce-EditAccountForm .button,
  .olpa-account .woocommerce-address-fields .button { width: 100%; display: flex; justify-content: center; }

  /* Tables: horizontal scroll */
  .olpa-account .woocommerce-orders-table,
  .olpa-account .woocommerce-table,
  .woocommerce-account .woocommerce-orders-table,
  .woocommerce-account .woocommerce-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Content sections inside account */
  .woocommerce-MyAccount-content { padding: 0; }

  /* Auth login/register: stack */
  .olpa-auth { padding: 24px var(--container-padding) 48px; }
  .olpa-auth-layout { grid-template-columns: 1fr; }
  .olpa-auth-card { padding: 20px; }
  .olpa-auth-btn { height: var(--btn-height-lg); }

  /* Logout modal: full width on small screens */
  .logout-modal { padding: 24px; max-width: 90%; }
  .logout-modal-actions { flex-direction: column; }
  .logout-modal-actions .btn-secondary,
  .logout-modal-actions .btn-primary { width: 100%; }
}

/* Account responsive — small mobile */
@media (max-width: 480px) {
  .woocommerce-MyAccount-navigation ul li a { padding: 8px 10px; font-size: 9px; }
  .account-dashboard-card { padding: 16px 12px; }
  .account-dashboard-card-icon { font-size: 24px; }
}

/* =============================================
   AUTH (Login / Register)
   ============================================= */
.olpa-auth { max-width: 800px; margin: 0 auto; padding: 48px var(--container-padding) 64px; }
.olpa-auth-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

.olpa-auth-card { background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card); padding: var(--container-padding); }
.olpa-auth-title {
  font-family: var(--font-display); font-weight: var(--fw-hero); font-size: 18px;
  text-transform: uppercase; letter-spacing: 0.04em; color: var(--white);
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--border);
}
.olpa-auth-title i { color: var(--red); }

.olpa-form-row { display: flex; flex-direction: column; gap: 4px; margin-bottom: 14px; }
.olpa-form-row-flex { flex-direction: row; justify-content: space-between; align-items: center; }

.olpa-input {
  background: var(--dark3); border: 1px solid var(--dark5); border-radius: var(--radius-button);
  color: var(--white); font-size: var(--fs-small); padding: 0 14px; height: var(--btn-height-lg);
  outline: none; transition: border-color .2s; width: 100%;
}
.olpa-input:focus { border-color: var(--red); }
.olpa-input::placeholder { color: var(--grey3); }

.olpa-checkbox-label { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); color: var(--grey2); cursor: pointer; }
.olpa-checkbox-label input[type="checkbox"] { accent-color: var(--red); }
.olpa-link { font-size: var(--fs-cuotas); color: var(--red); transition: color .2s; }
.olpa-link:hover { color: var(--white); }
.required { color: var(--red); }

.olpa-auth-btn { width: 100%; justify-content: center; margin-top: 8px; }
.olpa-auth-btn-register { background: var(--dark4); border: 2px solid var(--red); color: var(--white); }
.olpa-auth-btn-register:hover { background: var(--red); }

.olpa-auth-benefits { display: flex; flex-direction: column; gap: 8px; margin: 16px 0; padding: 16px 0; border-top: 1px solid var(--border); }
.olpa-auth-benefit { display: flex; align-items: center; gap: 8px; font-size: var(--fs-small); color: var(--grey2); }
.olpa-auth-benefit i { color: var(--green); }

@media (max-width: 768px) {
  .olpa-auth-layout { grid-template-columns: 1fr; }
}

/* =============================================
   WISHLIST
   ============================================= */

/* Card wishlist button (heart on product card image) */
.card-wishlist-btn {
  position: absolute;
  top: 12px; right: 12px;
  z-index: 3;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: rgba(0,0,0,.6);
  border: 1.5px solid rgba(255,255,255,.25);
  display: flex; align-items: center; justify-content: center;
  color: var(--white);
  font-size: 17px;
  cursor: pointer;
  transition: transform .2s, color .2s, background .2s, border-color .2s;
  backdrop-filter: blur(4px);
}
.card-wishlist-btn:hover { color: var(--red); border-color: rgba(255,255,255,.4); background: rgba(0,0,0,.75); }
.card-wishlist-btn.active { color: var(--red); border-color: var(--red); background: rgba(227,27,35,.15); }
.card-wishlist-btn.active:hover { color: var(--red-dark); background: rgba(227,27,35,.25); }

/* Single product wishlist button */
.sp-wishlist-btn {
  display: flex; align-items: center; gap: 8px;
  background: var(--dark3); border: 1px solid var(--dark5);
  border-radius: var(--radius-button); padding: 10px 16px;
  font-family: var(--font-display); font-size: var(--fs-nav);
  font-weight: var(--fw-nav); letter-spacing: var(--ls-nav);
  text-transform: uppercase; color: var(--grey1);
  cursor: pointer; transition: all .2s; margin-bottom: 16px;
  width: 100%;
  justify-content: center;
}
.sp-wishlist-btn:hover { border-color: var(--grey3); color: var(--white); }
.sp-wishlist-btn.active { border-color: var(--red); color: var(--red); }
.sp-wishlist-btn.active i { color: var(--red); }

/* Wishlist counter (header icon badge) */
.wishlist-count {
  position: absolute; top: -5px; right: -5px;
  background: var(--red); color: #fff;
  font-size: 9px; font-weight: 700;
  width: 16px; height: 16px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}

/* Wishlist panel (side panel from right) */
.wishlist-panel-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,.6); z-index: 9998;
  opacity: 0; transition: opacity .3s ease;
}
.wishlist-panel-overlay.active { display: block; opacity: 1; }

.wishlist-panel {
  position: fixed; top: 0; right: 0;
  width: 380px; max-width: 90%;
  height: 100vh; height: 100dvh;
  background: var(--dark1); z-index: 9999;
  transform: translateX(100%); transition: transform .3s ease;
  display: flex; flex-direction: column;
}
.wishlist-panel.active { transform: translateX(0); }

.wishlist-panel-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 16px var(--container-padding);
  border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.wishlist-panel-title {
  font-family: var(--font-display); font-weight: var(--fw-heading);
  font-size: var(--fs-h4); text-transform: uppercase; letter-spacing: var(--ls-nav);
}
.wishlist-panel-count { color: var(--red); }
.wishlist-panel-close {
  background: var(--dark3); border: 1px solid var(--border);
  border-radius: var(--radius-button);
  width: var(--icon-btn-size); height: var(--icon-btn-size);
  display: flex; align-items: center; justify-content: center;
  color: var(--grey1); cursor: pointer; transition: background .2s, color .2s;
}
.wishlist-panel-close:hover { background: var(--dark5); color: #fff; }

.wishlist-panel-items { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; }

.wishlist-panel-item {
  display: flex; align-items: center; gap: 12px;
  padding: 14px var(--container-padding);
  border-bottom: 1px solid var(--border);
  transition: opacity .2s;
}
.wishlist-panel-item-img { flex-shrink: 0; width: 60px; height: 60px; border-radius: var(--radius-button); overflow: hidden; background: var(--dark3); }
.wishlist-panel-item-img img { width: 100%; height: 100%; object-fit: cover; }
.wishlist-panel-item-info { flex: 1; min-width: 0; }
.wishlist-panel-item-name {
  font-family: var(--font-display); font-size: var(--fs-small); font-weight: var(--fw-nav);
  color: var(--white); display: block; margin-bottom: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .2s;
}
.wishlist-panel-item-name:hover { color: var(--red); }
.wishlist-panel-item-price { font-family: var(--font-display); font-weight: var(--fw-heading); font-size: var(--fs-small); color: var(--white); }
.wishlist-panel-item-price del { color: var(--grey3); font-size: var(--fs-cuotas); }
.wishlist-panel-item-price ins { text-decoration: none; }

.wishlist-panel-item-actions { display: flex; gap: 6px; flex-shrink: 0; }
.wishlist-panel-add-cart {
  width: 32px; height: 32px; border-radius: var(--radius-badge);
  background: var(--dark3); border: 1px solid var(--dark5);
  display: flex; align-items: center; justify-content: center;
  color: var(--grey2); transition: all .2s;
}
.wishlist-panel-add-cart:hover { background: var(--red); border-color: var(--red); color: #fff; }
.wishlist-panel-remove {
  width: 32px; height: 32px; border-radius: var(--radius-badge);
  background: none; border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  color: var(--grey3); cursor: pointer; transition: all .2s;
}
.wishlist-panel-remove:hover { background: rgba(227,27,35,.1); border-color: rgba(227,27,35,.3); color: var(--red); }

.wishlist-panel-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; padding: 60px var(--container-padding); text-align: center;
  color: var(--grey3);
}
.wishlist-panel-empty p { font-size: var(--fs-body); color: var(--grey2); }

.wishlist-panel-footer {
  padding: var(--container-padding);
  border-top: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 8px; flex-shrink: 0;
}
.wishlist-panel-btn { width: 100%; justify-content: center; text-align: center; }

/* Wishlist page */
.wishlist-page { max-width: var(--container-max-width); width: 100%; margin: 0 auto; padding: 32px var(--container-padding) 64px; box-sizing: border-box; overflow: hidden; }
.wishlist-page-header { display: flex; align-items: center; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.wishlist-page-title { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: clamp(28px, 4vw, 38px); text-transform: uppercase; }
.wishlist-page-count { font-family: var(--font-display); font-weight: var(--fw-nav); font-size: var(--fs-h4); color: var(--grey2); text-transform: uppercase; letter-spacing: var(--ls-nav); }

.wishlist-page-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--card-gap); list-style: none; margin: 0; padding: 0; }
.wishlist-page-grid::before,
.wishlist-page-grid::after { content: none; display: none; }
.wishlist-page-grid li.product { margin: 0; padding: 0; float: none; width: auto; }

.wishlist-page-empty {
  text-align: center; padding: 64px var(--container-padding);
  background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card);
}
.wishlist-page-empty-icon { font-size: 56px; color: var(--grey3); margin-bottom: 16px; }
.wishlist-page-empty h3 { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: var(--fs-price); text-transform: uppercase; margin-bottom: 8px; }
.wishlist-page-empty p { font-size: var(--fs-small); color: var(--grey2); margin-bottom: var(--container-padding); }

/* Wishlist responsive */
@media (max-width: 1200px) {
  .wishlist-page-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .wishlist-page-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .wishlist-page { padding: 16px var(--container-padding) 48px; }
  .sp-wishlist-btn { font-size: var(--fs-cuotas); padding: 8px 12px; }
}
@media (max-width: 380px) {
  .wishlist-page-grid { grid-template-columns: 1fr; }
}

/* =============================================
   CART PAGE (from mockup neumaking-carrito.html)
   ============================================= */
.cart-page { max-width: var(--container-max-width); margin: 0 auto; padding: 32px var(--container-padding) 64px; }

/* Header */
.cart-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; flex-wrap: wrap; gap: 12px; }
.cart-title { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: clamp(28px, 4vw, 38px); text-transform: uppercase; color: var(--white); }
.cart-title .accent { color: var(--red); }
.cart-title-count { font-family: var(--font-display); font-weight: var(--fw-nav); font-size: var(--fs-h4); color: var(--grey2); text-transform: uppercase; letter-spacing: var(--ls-nav); margin-left: 8px; }
.cart-back { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-display); font-size: var(--fs-nav); font-weight: 700; letter-spacing: var(--ls-nav); text-transform: uppercase; color: var(--grey2); transition: color .2s; }
.cart-back:hover { color: var(--white); }

.cart-layout { display: grid; grid-template-columns: 1fr 380px; gap: var(--container-padding); align-items: start; }

/* Cart items */
.cart-items { display: flex; flex-direction: column; gap: 12px; }
.cart-item { background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 20px; display: grid; grid-template-columns: 100px 1fr auto; gap: 20px; align-items: center; transition: border-color .2s; }
.cart-item:hover { border-color: rgba(255,255,255,.1); }

.ci-image { width: 100px; height: 100px; background: var(--dark3); border-radius: 10px; overflow: hidden; flex-shrink: 0; }
.ci-image img { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; }
.ci-info { display: flex; flex-direction: column; gap: 4px; }
.ci-brand { font-family: var(--font-display); font-size: var(--fs-badge); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red); }
.ci-name { font-family: var(--font-display); font-weight: var(--fw-heading); font-size: 17px; text-transform: uppercase; color: var(--white); letter-spacing: 0.02em; }
.ci-name a { color: var(--white); transition: color .2s; }
.ci-name a:hover { color: var(--red); }
.ci-size { font-family: var(--font-display); font-size: var(--fs-nav); font-weight: 700; color: var(--grey2); letter-spacing: 0.04em; }

.ci-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.ci-price-row { text-align: right; }
.ci-price-old { font-size: var(--fs-cuotas); color: var(--grey3); text-decoration: line-through; }
.ci-price { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: 22px; color: var(--white); }
.ci-cuotas { font-family: var(--font-display); font-size: var(--fs-eyebrow); font-weight: 700; color: var(--gold); display: flex; align-items: center; gap: 3px; }

.ci-controls { display: flex; align-items: center; gap: 10px; }
.ci-qty { display: flex; align-items: center; background: var(--dark3); border: 1px solid var(--dark5); border-radius: var(--radius-button); overflow: hidden; }
.ci-qty-btn { width: 34px; height: 34px; background: none; border: none; color: var(--grey1); display: flex; align-items: center; justify-content: center; transition: background .15s, color .15s; cursor: pointer; }
.ci-qty-btn:hover { background: var(--dark5); color: var(--white); }
.ci-qty-input { width: 36px; height: 34px; text-align: center; background: none; border: none; border-left: 1px solid var(--dark5); border-right: 1px solid var(--dark5); color: var(--white); font-family: var(--font-display); font-weight: var(--fw-heading); font-size: var(--fs-small); outline: none; }
.ci-remove { width: 34px; height: 34px; border-radius: var(--radius-button); background: none; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; color: var(--grey3); transition: all .2s; }
.ci-remove:hover { background: rgba(227,27,35,.1); border-color: rgba(227,27,35,.3); color: var(--red); }

/* Update cart button */
.cart-update-btn { margin-top: 8px; width: 100%; }

/* Empty cart */
.cart-empty { text-align: center; padding: 64px var(--container-padding); background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card); }
.cart-empty-icon { font-size: 56px; color: var(--grey3); margin-bottom: 16px; }
.cart-empty h3 { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: var(--fs-price); text-transform: uppercase; color: var(--white); margin-bottom: 8px; }
.cart-empty p { font-size: var(--fs-small); color: var(--grey2); margin-bottom: var(--container-padding); }
.cart-empty-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--red); color: #fff; font-family: var(--font-display); font-weight: var(--fw-heading); font-size: var(--fs-button-lg); letter-spacing: 0.08em; text-transform: uppercase; padding: 14px 28px; border-radius: 10px; border: none; transition: all .2s; }
.cart-empty-btn:hover { background: var(--red-dark); transform: translateY(-2px); }

/* Order summary */
.order-summary { background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 28px; position: sticky; top: var(--sidebar-sticky-top); }
.os-title { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: 20px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--white); margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 10px; }
.os-title i { color: var(--red); }
.os-rows { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.os-row { display: flex; justify-content: space-between; align-items: center; }
.os-label { font-size: var(--fs-small); color: var(--grey2); }
.os-value { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-body); color: var(--grey1); }
.os-value-free { color: var(--green); font-weight: var(--fw-heading); display: flex; align-items: center; gap: 4px; }
.os-value-discount { color: var(--green); }
.os-divider { height: 1px; background: var(--border); margin: 4px 0 16px; }

/* Free shipping progress bar in order summary */
.os-shipping-bar { margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--border); }
.os-shipping-text {
  font-family: var(--font-display); font-size: var(--fs-cuotas); font-weight: 700;
  letter-spacing: 0.02em; color: var(--grey1);
  display: flex; align-items: center; gap: 6px; margin-bottom: 8px;
}
.os-shipping-text--done { color: var(--green); }
.os-shipping-progress { height: 4px; background: var(--dark4); border-radius: 2px; overflow: hidden; }
.os-shipping-fill { height: 100%; background: var(--red); border-radius: 2px; transition: width .4s ease; }
.os-shipping-fill.complete { background: var(--green); }

/* Coupon in summary */
.os-coupon { display: flex; gap: 8px; margin-bottom: 16px; }
.os-coupon-input { flex: 1; background: var(--dark4); border: 1px solid var(--dark5); border-radius: var(--radius-button); color: var(--white); font-size: var(--fs-small); padding: 0 12px; height: 38px; outline: none; transition: border-color .2s; }
.os-coupon-input:focus { border-color: var(--red); }
.os-coupon-input::placeholder { color: var(--grey3); }
.os-coupon-btn { background: var(--dark4); color: var(--grey1); font-family: var(--font-display); font-weight: var(--fw-heading); font-size: var(--fs-cuotas); letter-spacing: 0.08em; text-transform: uppercase; height: 38px; padding: 0 16px; border-radius: var(--radius-button); border: 1px solid var(--dark5); cursor: pointer; transition: all .2s; flex-shrink: 0; }
.os-coupon-btn:hover { background: var(--dark5); border-color: var(--grey3); color: #fff; }

/* Total */
.os-total { display: flex; justify-content: space-between; align-items: flex-end; padding: 16px 0; border-top: 2px solid var(--border); margin-bottom: 20px; }
.os-total-label { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-small); text-transform: uppercase; letter-spacing: var(--ls-nav); color: var(--grey1); }
.os-total-price { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: 32px; color: var(--white); line-height: 1; text-align: right; }
.os-total-cuotas { font-family: var(--font-display); font-size: var(--fs-nav); font-weight: 700; color: var(--gold); text-align: right; margin-top: 4px; }

/* Checkout buttons */
.os-checkout { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.btn-checkout { width: 100%; height: 52px; border-radius: 10px; font-family: var(--font-display); font-weight: var(--fw-heading); font-size: var(--fs-body); letter-spacing: 0.08em; text-transform: uppercase; display: flex; align-items: center; justify-content: center; gap: 10px; border: none; transition: all .2s; cursor: pointer; }
.btn-checkout:hover { transform: translateY(-2px); }
.btn-checkout-red { background: var(--red); color: #fff; }
.btn-checkout-red:hover { background: var(--red-dark); box-shadow: 0 8px 32px rgba(227,27,35,.25); }

/* Security badges */
.os-security { display: flex; flex-direction: column; gap: 8px; }
.os-sec-item { display: flex; align-items: center; gap: 8px; font-size: var(--fs-cuotas); color: var(--grey3); }
.os-sec-item i { color: var(--grey2); }

/* Payment icons */
.os-payments { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.os-pay-icon { background: var(--dark4); border: 1px solid var(--dark5); border-radius: 6px; padding: 4px 10px; font-family: var(--font-display); font-size: var(--fs-badge); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--grey2); }

/* Suggested products */
.suggested { margin-top: var(--section-padding); }
.suggested-title { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: 22px; text-transform: uppercase; color: var(--white); margin-bottom: 20px; display: flex; align-items: center; gap: 10px; }
.suggested-title .accent { color: var(--red); }
.suggested-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--card-gap); }

/* Cart responsive */
@media (max-width: 1100px) {
  .cart-layout { grid-template-columns: 1fr 340px; }
  .suggested-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .cart-layout { grid-template-columns: 1fr; }
  .order-summary { position: static; }
  .cart-item { grid-template-columns: 80px 1fr auto; }
  .ci-image { width: 80px; height: 80px; }
  .suggested-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .cart-item { grid-template-columns: 1fr; gap: 14px; }
  .ci-image { width: 100%; height: 140px; }
  .ci-actions { flex-direction: row; align-items: center; justify-content: space-between; width: 100%; }
  .ci-controls { order: 1; }
  .ci-price-row { order: 2; text-align: left; }
  .os-total-price { font-size: 26px; }
}
@media (max-width: 540px) {
  .suggested-grid { grid-template-columns: 1fr 1fr; }
  .os-total-price { font-size: 24px; }
}

/* =============================================
   SINGLE PRODUCT PAGE
   ============================================= */
.single-product-layout {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 16px var(--container-padding) var(--section-padding);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--grid-gap);
  align-items: start;
}

/* Gallery */
.sp-gallery {
  position: relative;
  background: var(--dark2);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  overflow: hidden;
}
.sp-gallery-badge { position: absolute; top: 16px; left: 16px; z-index: 5; }
.sp-gallery .woocommerce-product-gallery { margin-bottom: 0; }
.sp-gallery .woocommerce-product-gallery__wrapper { background: var(--dark2); }
.sp-gallery .woocommerce-product-gallery__image img { width: 100%; height: auto; object-fit: contain; }
.sp-gallery .flex-control-thumbs { display: flex; gap: 8px; padding: 12px; list-style: none; margin: 0; }
.sp-gallery .flex-control-thumbs li { flex: 0 0 60px; height: 60px; border-radius: var(--radius-badge); overflow: hidden; border: 2px solid transparent; cursor: pointer; transition: border-color .2s; }
.sp-gallery .flex-control-thumbs li img { width: 100%; height: 100%; object-fit: cover; }
.sp-gallery .flex-control-thumbs li.flex-active { border-color: var(--red); }

/* Gallery zoom trigger — custom style */
.sp-gallery .woocommerce-product-gallery__trigger {
  position: absolute !important;
  top: 16px !important; right: 16px !important;
  left: auto !important; bottom: auto !important;
  z-index: 5;
  width: 42px !important; height: 42px !important;
  background: rgba(0,0,0,.6) !important;
  border: 1.5px solid rgba(255,255,255,.25) !important;
  border-radius: 50% !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  backdrop-filter: blur(4px);
  transition: background .2s, border-color .2s;
  font-size: 0 !important; text-indent: -9999px;
}
.sp-gallery .woocommerce-product-gallery__trigger::before {
  content: ''; display: block;
  width: 18px; height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f0f0f0' viewBox='0 0 256 256'%3E%3Cpath d='M229.66,218.34l-50.07-50.06a88.11,88.11,0,1,0-11.31,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Zm96,8H120v16a8,8,0,0,1-16,0V120H88a8,8,0,0,1,0-16h16V88a8,8,0,0,1,16,0v16h16a8,8,0,0,1,0,16Z'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat;
  text-indent: 0;
}
.sp-gallery .woocommerce-product-gallery__trigger img { display: none !important; }
.sp-gallery .woocommerce-product-gallery__trigger:hover { background: rgba(0,0,0,.8) !important; border-color: var(--white) !important; }

.woocommerce span.onsale { display: none !important; }

/* Product Info */
.sp-info { display: flex; flex-direction: column; gap: 0; }

/* Category + Brand row */
.sp-meta-top { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.sp-category { font-family: var(--font-display); font-size: var(--fs-badge); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--red); background: rgba(227,27,35,.1); padding: 3px 10px; border-radius: var(--radius-badge); transition: background .2s; }
.sp-category:hover { background: rgba(227,27,35,.2); }
.sp-brand { font-family: var(--font-display); font-size: var(--fs-badge); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--grey2); background: var(--dark4); padding: 3px 10px; border-radius: var(--radius-badge); }

/* Title + Wishlist icon inline */
.sp-title-row { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 6px; }
.sp-title-row .sp-title { flex: 1; margin-bottom: 0; font-size: 40px; }
.sp-wishlist-icon {
  width: 42px; height: 42px; flex-shrink: 0; border-radius: 50%;
  background: transparent; border: 2px solid var(--grey3);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; color: var(--grey3); cursor: pointer;
  transition: all .2s;
}
.sp-wishlist-icon:hover { border-color: var(--red); color: var(--red); }
.sp-wishlist-icon.active { background: var(--red); border-color: var(--red); color: #fff; }

.sp-size { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-nav); color: var(--red); letter-spacing: 0.04em; margin-bottom: 10px; }
.sp-sku { font-size: var(--fs-cuotas); color: var(--grey3); margin-bottom: 16px; }

/* Price block */
.sp-price-block { margin-bottom: 16px; }
.sp-price-old { font-size: var(--fs-small); color: var(--grey3); text-decoration: line-through; margin-bottom: 4px; }
.sp-price-row { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.sp-price-current { font-family: var(--font-display); font-weight: var(--fw-hero); font-size: clamp(24px, 4vw, 32px); color: var(--white); line-height: 1; }
.sp-price-block .card-price-cuotas { margin-top: 4px; }

.sp-divider { height: 1px; background: var(--border); margin: 8px 0 16px; }

/* Stock */
.sp-stock { margin-bottom: 16px; }
.badge-out { background: rgba(248,113,113,.15); color: #f87171; border: 1px solid rgba(248,113,113,.3); }

/* Add to cart form override */
.sp-add-to-cart { margin-bottom: 12px; }
.sp-add-to-cart .cart { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.sp-add-to-cart .quantity { flex-shrink: 0; }
.sp-add-to-cart .quantity .qty {
  background: var(--dark3) !important; border: 1px solid var(--dark5) !important; color: var(--white) !important;
  border-radius: var(--radius-button) !important; padding: 0 12px;
  font-size: var(--fs-body); font-family: var(--font-display); font-weight: 700;
  width: 80px; height: var(--btn-height-lg); text-align: center;
}
.sp-add-to-cart .single_add_to_cart_button {
  flex: 1; min-width: 200px;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--red) !important; color: #fff !important;
  font-family: var(--font-button) !important; font-weight: var(--fw-button) !important;
  font-size: var(--fs-button-lg) !important; letter-spacing: 0.08em !important;
  text-transform: uppercase !important; border-radius: var(--radius-button) !important;
  height: var(--btn-height-lg); border: none !important;
  transition: background .2s, transform .15s;
}
.sp-add-to-cart .single_add_to_cart_button:hover {
  background: var(--red-dark) !important; transform: translateY(-1px);
}

/* Buy Now button */
.sp-buy-now-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; height: var(--btn-height-lg);
  background: var(--dark3); color: var(--white);
  border: 1px solid var(--border); border-radius: var(--radius-button);
  font-family: var(--font-display); font-weight: var(--fw-heading);
  font-size: var(--fs-nav); letter-spacing: 0.08em; text-transform: uppercase;
  transition: all .2s; margin-bottom: 16px;
}
.sp-buy-now-btn:hover { background: var(--dark5); border-color: var(--grey3); }

/* Compatible vehicles */
.sp-vehicles { margin-bottom: 16px; }
.sp-vehicles-toggle {
  display: flex; align-items: center; gap: 8px; width: 100%;
  background: var(--dark3); border: 1px solid var(--border); border-radius: var(--radius-button);
  color: var(--grey1); font-family: var(--font-display); font-size: var(--fs-nav);
  font-weight: 700; letter-spacing: var(--ls-nav); text-transform: uppercase;
  padding: 12px 16px; cursor: pointer; transition: all .2s;
}
.sp-vehicles-toggle:hover { background: var(--dark5); border-color: var(--grey3); color: var(--white); }
.sp-vehicles-arrow { margin-left: auto; transition: transform .2s; }
.sp-vehicles-list { display: none; margin-top: 8px; background: var(--dark2); border: 1px solid var(--border); border-radius: var(--radius-button); overflow: hidden; max-height: 300px; overflow-y: auto; }
.sp-vehicles-list.open { display: block; }
.sp-vehicles-loading, .sp-vehicles-empty { padding: 16px; text-align: center; color: var(--grey3); font-size: var(--fs-small); display: flex; align-items: center; justify-content: center; gap: 8px; }
.sp-vehicles-make { font-family: var(--font-display); font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--red); padding: 10px 16px 4px; }
.sp-vehicles-group + .sp-vehicles-group { border-top: 1px solid var(--border); }
.sp-vehicle-item { display: flex; align-items: center; gap: 8px; padding: 8px 16px; font-size: var(--fs-small); color: var(--grey1); }
.sp-vehicle-item:hover { background: rgba(255,255,255,.02); }
.sp-vehicle-model { flex: 1; font-weight: 600; }
.sp-vehicle-years { color: var(--grey3); font-size: var(--fs-cuotas); }
.sp-vehicle-type { font-family: var(--font-display); font-size: var(--fs-badge); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--green); background: rgba(34,197,94,.1); padding: 2px 8px; border-radius: var(--radius-badge); }

/* Compact benefits under add-to-cart */
.sp-benefits {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  padding: 16px 0;
  border-top: 1px solid var(--border);
}
.sp-benefit {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-display);
  font-size: var(--fs-cuotas);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--grey2);
}
.sp-benefit i { color: var(--green); }

/* Below: tabs + related */
.sp-below { max-width: var(--container-max-width); margin: 0 auto; padding: 0 var(--container-padding) var(--section-padding); }

/* WC Tabs */
.woocommerce-tabs { margin-bottom: var(--section-padding); }
.woocommerce-tabs ul.tabs {
  list-style: none; margin: 0 0 1px; padding: 0;
  display: flex; gap: 0; border-bottom: 2px solid var(--border);
}
.woocommerce-tabs ul.tabs li {
  margin: 0; padding: 0; background: none; border: none;
}
.woocommerce-tabs ul.tabs li a {
  display: block; padding: 12px 20px;
  font-family: var(--font-display); font-size: var(--fs-nav);
  font-weight: var(--fw-nav); letter-spacing: var(--ls-nav);
  text-transform: uppercase; color: var(--grey2);
  border-bottom: 2px solid transparent;
  margin-bottom: -2px; transition: color .2s, border-color .2s;
}
.woocommerce-tabs ul.tabs li a:hover { color: var(--white); }
.woocommerce-tabs ul.tabs li.active a { color: var(--white); border-bottom-color: var(--red); }
.woocommerce-tabs .woocommerce-Tabs-panel {
  background: var(--dark2); border: 1px solid var(--border);
  border-radius: 0 0 var(--radius-card) var(--radius-card);
  padding: var(--container-padding);
  color: var(--grey1); font-size: var(--fs-body); line-height: 1.7;
}
.woocommerce-tabs .woocommerce-Tabs-panel h2 { font-size: var(--fs-h3); margin-bottom: 12px; }

/* Related products — carousel */
.related.products { padding-top: 16px; position: relative; }
.related.products > h2 { margin-bottom: 20px; }

/* Carousel wrapper — JS adds this div around ul.products */
.related-carousel-wrap { overflow: hidden; }

/* Track: flex row, items sized relative to wrapper */
.related.products ul.products {
  display: flex !important;
  gap: 14px;
  grid-template-columns: none !important;
  transition: transform .4s ease;
  list-style: none; margin: 0; padding: 0;
}
.related.products ul.products::before,
.related.products ul.products::after { content: none !important; display: none !important; }
.related.products ul.products > .product {
  flex: 0 0 calc((100% - 56px) / 5); /* 5 items visible, 4 gaps of 14px = 56px */
  max-width: calc((100% - 56px) / 5);
  width: auto !important;
  float: none !important;
  margin: 0 !important;
}

/* Carousel navigation */
.related-carousel-nav {
  display: flex; justify-content: center; gap: 8px; margin-top: 16px;
}
.related-carousel-arrow {
  width: 38px; height: 38px; border-radius: var(--radius-button);
  background: var(--dark4); border: 1px solid var(--dark5);
  display: flex; align-items: center; justify-content: center;
  color: var(--grey2); cursor: pointer; transition: all .2s;
}
.related-carousel-arrow:hover { background: var(--dark5); color: var(--white); border-color: var(--grey3); }

/* Single product responsive */
@media (max-width: 1024px) {
  .single-product-layout { grid-template-columns: 1fr; }
  .related.products ul.products > .product { flex: 0 0 calc((100% - 28px) / 3); max-width: calc((100% - 28px) / 3); }
}
@media (max-width: 768px) {
  .related.products ul.products > .product { flex: 0 0 calc((100% - 14px) / 2); max-width: calc((100% - 14px) / 2); }
  /* Sticky add-to-cart on mobile */
  .sp-add-to-cart {
    position: sticky;
    bottom: 0;
    background: var(--dark1);
    padding: 12px 0;
    margin: 0 calc(var(--container-padding) * -1);
    padding-left: var(--container-padding);
    padding-right: var(--container-padding);
    border-top: 1px solid var(--border);
    z-index: 50;
  }
  .sp-add-to-cart .single_add_to_cart_button { min-width: 0; flex: 1; }
  .sp-title-row { gap: 8px; }
  .sp-wishlist-icon { width: 36px; height: 36px; font-size: 18px; }
  .sp-buy-now-btn { font-size: var(--fs-cuotas); }
  .woocommerce-tabs ul.tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .woocommerce-tabs ul.tabs li a { white-space: nowrap; padding: 10px 14px; }
}
@media (max-width: 480px) {
  .related.products ul.products > .product { flex: 0 0 calc((100% - 14px) / 2); max-width: calc((100% - 14px) / 2); }
}

/* =============================================
   MOBILE FILTER BUTTON + PANEL
   ============================================= */

/* Inline filter button (hidden on desktop, shown on mobile) */
.mobile-filter-btn {
  display: none;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--dark3);
  border: 1px solid var(--border);
  border-radius: var(--radius-button);
  color: var(--grey1);
  font-family: var(--font-display);
  font-size: var(--fs-nav);
  font-weight: var(--fw-heading);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  height: var(--btn-height);
  cursor: pointer;
  transition: background .2s, color .2s;
  margin-bottom: 16px;
}
.mobile-filter-btn:hover { background: var(--dark5); color: #fff; }
.mobile-filter-badge { background: var(--red); color: #fff; font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 10px; margin-left: 4px; }

/* Filter panel overlay */
.filter-panel-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 9998;
  opacity: 0;
  transition: opacity .3s ease;
}
.filter-panel-overlay.active { display: block; opacity: 1; }

/* Close button inside filter panel (hidden on desktop) */
.filter-panel-close {
  display: none;
  background: var(--dark3); border: 1px solid var(--border);
  border-radius: var(--radius-button);
  width: var(--icon-btn-size); height: var(--icon-btn-size);
  align-items: center; justify-content: center;
  color: var(--grey1); cursor: pointer;
  transition: background .2s, color .2s;
}
.filter-panel-close:hover { background: var(--dark5); color: #fff; }

/* Apply button inside filter panel (hidden on desktop) */
.filter-panel-apply {
  display: none;
  width: 100%;
  background: var(--red); color: #fff;
  font-family: var(--font-button); font-weight: var(--fw-button);
  font-size: var(--fs-button); letter-spacing: 0.08em; text-transform: uppercase;
  height: var(--btn-height-lg); border-radius: var(--radius-button); border: none;
  cursor: pointer; transition: background .2s;
  margin-top: 16px; flex-shrink: 0;
}
.filter-panel-apply:hover { background: var(--red-dark); }

/* =============================================
   MINI CART PANEL
   ============================================= */
.mini-cart-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 9998;
  opacity: 0;
  transition: opacity .3s ease;
}
.mini-cart-overlay.active { display: block; opacity: 1; }

.mini-cart {
  position: fixed;
  top: 0; right: 0;
  width: 380px;
  max-width: 90%;
  height: 100vh; height: 100dvh;
  background: var(--dark1);
  z-index: 9999;
  transform: translateX(100%);
  transition: transform .3s ease;
  display: flex;
  flex-direction: column;
}
.mini-cart.active { transform: translateX(0); }

/* Header */
.mini-cart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px var(--container-padding);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.mini-cart-title {
  font-family: var(--font-display);
  font-weight: var(--fw-heading);
  font-size: var(--fs-h4);
  text-transform: uppercase;
  letter-spacing: var(--ls-nav);
}
.mini-cart-count { color: var(--red); }
.mini-cart-close {
  background: var(--dark3); border: 1px solid var(--border);
  border-radius: var(--radius-button);
  width: var(--icon-btn-size); height: var(--icon-btn-size);
  display: flex; align-items: center; justify-content: center;
  color: var(--grey1); cursor: pointer;
  transition: background .2s, color .2s;
}
.mini-cart-close:hover { background: var(--dark5); color: #fff; }

/* Free shipping bar */
.mini-cart-shipping {
  padding: 12px var(--container-padding);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.mini-cart-shipping-text {
  font-family: var(--font-display);
  font-size: var(--fs-cuotas);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--grey1);
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 8px;
}
.mini-cart-shipping--done { color: var(--green); }
.mini-cart-shipping-bar {
  height: 4px;
  background: var(--dark4);
  border-radius: 2px;
  overflow: hidden;
}
.mini-cart-shipping-fill {
  height: 100%;
  background: var(--red);
  border-radius: 2px;
  transition: width .4s ease;
}
.mini-cart-shipping-fill.complete { background: var(--green); }

/* Items */
.mini-cart-items {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0;
}

.mini-cart-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px var(--container-padding);
  border-bottom: 1px solid var(--border);
  transition: opacity .2s;
}
.mini-cart-item-thumb { flex-shrink: 0; width: 60px; height: 60px; border-radius: var(--radius-button); overflow: hidden; background: var(--dark3); }
.mini-cart-item-thumb img,
.mini-cart-item-img { width: 100%; height: 100%; object-fit: cover; }
.mini-cart-item-info { flex: 1; min-width: 0; }
.mini-cart-item-name {
  font-family: var(--font-display);
  font-size: var(--fs-small);
  font-weight: var(--fw-nav);
  color: var(--white);
  display: block;
  margin-bottom: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color .2s;
}
.mini-cart-item-name:hover { color: var(--red); }
.mini-cart-item-price { font-family: var(--font-display); font-weight: var(--fw-heading); font-size: var(--fs-small); color: var(--white); margin-bottom: 6px; }
.mini-cart-item-price del { color: var(--grey3); font-size: var(--fs-cuotas); font-weight: 400; }
.mini-cart-item-price ins { text-decoration: none; }

/* Quantity buttons */
.mini-cart-item-qty {
  display: inline-flex;
  align-items: center;
  background: var(--dark3);
  border: 1px solid var(--dark5);
  border-radius: var(--radius-badge);
  overflow: hidden;
}
.qty-btn {
  background: none; border: none; color: var(--grey2);
  width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: color .2s, background .2s;
}
.qty-btn:hover { background: var(--dark5); color: #fff; }
.qty-value {
  font-family: var(--font-display); font-weight: 700; font-size: var(--fs-small);
  min-width: 24px; text-align: center; color: var(--white);
}

/* Remove button */
.mini-cart-item-remove {
  flex-shrink: 0;
  color: var(--grey3);
  padding: 4px;
  transition: color .2s;
}
.mini-cart-item-remove:hover { color: var(--red); }

/* Empty state */
.mini-cart-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; padding: 60px var(--container-padding); text-align: center;
  color: var(--grey3); font-size: 40px;
}
.mini-cart-empty p { font-size: var(--fs-body); color: var(--grey2); }

/* Footer */
.mini-cart-footer {
  padding: var(--container-padding);
  border-top: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 8px;
  flex-shrink: 0;
}
.mini-cart-subtotal {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 4px;
}
.mini-cart-subtotal span:first-child {
  font-family: var(--font-display); font-size: var(--fs-small);
  font-weight: var(--fw-nav); text-transform: uppercase;
  letter-spacing: var(--ls-nav); color: var(--grey2);
}
.mini-cart-subtotal-amount {
  font-family: var(--font-display); font-weight: var(--fw-hero);
  font-size: var(--fs-price); color: var(--white);
}
.mini-cart-btn { width: 100%; justify-content: center; text-align: center; }

/* =============================================
   RESPONSIVE
   ============================================= */

/* 4 cols → 3 cols */
@media (max-width: 1200px) {
  .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); }
}

/* Sidebar becomes slide-in panel */
@media (max-width: 1024px) {
  .shop-layout { grid-template-columns: 1fr; }

  .sidebar {
    position: fixed;
    top: 0; left: 0;
    width: 85%; max-width: 340px;
    height: 100vh; height: 100dvh;
    z-index: 9999;
    border-radius: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateX(-100%);
    transition: transform .3s ease;
    display: flex;
    flex-direction: column;
  }
  .sidebar.filter-panel-active { transform: translateX(0); }
  .mobile-filter-btn { display: flex; }
  .filter-panel-close { display: flex; }
  .filter-panel-apply { display: block; }
  .sidebar-title { margin-bottom: 14px; }
}

/* 3 cols → 2 cols + mobile toolbar */
@media (max-width: 768px) {
  .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .catalog-header { flex-direction: column; align-items: flex-start; gap: 8px; }
  .catalog-sort { width: 100%; }
  .woocommerce-ordering select { width: 100%; }

  /* Compact product cards on mobile */
  .card-body { padding: 10px 10px 0; }
  .card-price-current { font-size: var(--fs-h3); }
  .card-footer { padding: 8px 10px 10px; }
  .btn-cart { height: 36px; font-size: var(--fs-cuotas); }
}

/* 2 cols → 1 col (very small screens) */
@media (max-width: 380px) {
  .woocommerce ul.products { grid-template-columns: 1fr; }
}
