/**
 * Prime Lens — WooCommerce Stylesheet
 *
 * Covers:
 *  1.  CSS custom properties passed to WC blocks
 *  2.  Classic template overrides (product grid, prices, buttons, badges)
 *  3.  Form inputs + labels
 *  4.  Stars, breadcrumb, pagination, ordering
 *  5.  Notices (success / error / info) — single definition, no duplicates
 *  6.  Single product (tabs, quantity, meta)
 *  7.  Cart & Checkout — BLOCK versions (wc-block-*)
 *  8.  My Account — flexbox layout (no floats)
 *  9.  Tables
 *  10. Responsive throughout (mobile-first, breakpoints 480 / 640 / 768 / 1024)
 *
 * @package prime-lens
 * @version 2.1.0
 */

/* ═══════════════════════════════════════════════════════
   1. BRAND TOKENS → WC BLOCKS
══════════════════════════════════════════════════════════ */
:root {
  --wc-blocks-primary:              var(--pl-primary);
  --wc-blocks-primary-hover:        var(--pl-secondary);
  --wc-blocks-color-primary:        var(--pl-primary);
  --wc-blocks-color-primary-hover:  var(--pl-secondary);
  --wc-blocks-color-secondary:      var(--pl-secondary);
  --wc-blocks-border-color:         var(--pl-border-solid);
  --wc-blocks-border-radius:        var(--pl-radius-lg);
  --wc-blocks-font-size:            1rem;
  --wc-blocks-background-color:     #ffffff;
  --wc-blocks-main-text-color:      var(--pl-text);
  --wc-blocks-secondary-text-color: var(--pl-text-muted);
}

/* ═══════════════════════════════════════════════════════
   1.5 WOOCOMMERCE TYPOGRAPHY
══════════════════════════════════════════════════════════ */
.woocommerce div.product .product_title,
.woocommerce-Tabs-panel h2,
.woocommerce-Tabs-panel h3,
.woocommerce-Reviews-title,
#reply-title,
.wc-block-cart__main-heading,
.wc-block-checkout__title {
  font-family: 'Playfair Display', serif !important;
}

/* ═══════════════════════════════════════════════════════
   2. PRODUCT GRID (classic loop)
══════════════════════════════════════════════════════════ */
.woocommerce ul.products {
  display: grid !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  /* 1 col mobile default */
  grid-template-columns: 1fr !important;
  gap: 1rem !important;
}
@media (min-width: 480px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.25rem !important;
  }
}
@media (min-width: 1024px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 2rem !important;
  }
}

/* ═══════════════════════════════════════════════════════
   3. PRICES
══════════════════════════════════════════════════════════ */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--pl-price) !important;
  font-size: 1.125rem !important;
  font-weight: 600 !important;
}
@media (min-width: 768px) {
  .woocommerce ul.products li.product .price,
  .woocommerce div.product p.price,
  .woocommerce div.product span.price { font-size: 1.25rem !important; }
}
.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
  color: var(--pl-text-muted) !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}
.woocommerce ul.products li.product .price ins,
.woocommerce div.product p.price ins {
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* ═══════════════════════════════════════════════════════
   4. BUTTONS (classic templates)
══════════════════════════════════════════════════════════ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input[type="submit"],
.woocommerce #respond input#submit {
  background-color: var(--pl-primary) !important;
  color: #fff !important;
  border-radius: var(--pl-radius-full) !important;
  padding: 0.6875rem 1.25rem !important;
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  border: none !important;
  transition: var(--pl-transition) !important;
  box-shadow: none !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}
@media (min-width: 640px) {
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input[type="submit"],
  .woocommerce #respond input#submit { padding: 0.75rem 1.5rem !important; }
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input[type="submit"]:hover,
.woocommerce #respond input#submit:hover {
  background-color: var(--pl-secondary) !important;
  color: #fff !important;
}
.woocommerce a.button.alt,
.woocommerce button.button.alt { background-color: var(--pl-secondary) !important; }
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover { background-color: var(--pl-secondary-dark) !important; }

/* ═══════════════════════════════════════════════════════
   5. SALE BADGE
══════════════════════════════════════════════════════════ */
.woocommerce span.onsale {
  background: var(--pl-primary) !important;
  border-radius: var(--pl-radius-full) !important;
  min-height: auto !important;
  min-width: auto !important;
  padding: 0.2rem 0.625rem !important;
  line-height: 1.5 !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  top: 0.75rem !important;
  left: 0.75rem !important;
  right: auto !important;
}

/* ═══════════════════════════════════════════════════════
   6. FORM INPUTS (classic templates)
══════════════════════════════════════════════════════════ */
.woocommerce form .input-text,
.woocommerce form input[type="text"],
.woocommerce form input[type="email"],
.woocommerce form input[type="tel"],
.woocommerce form input[type="number"],
.woocommerce form input[type="password"],
.woocommerce form select,
.woocommerce form textarea {
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 0.8125rem 1rem !important;
  width: 100% !important;
  font-size: 1rem !important;
  color: var(--pl-text) !important;
  background: #fff !important;
  box-shadow: none !important;
  outline: none !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.woocommerce form .input-text:focus,
.woocommerce form input:focus,
.woocommerce form select:focus,
.woocommerce form textarea:focus {
  border-color: var(--pl-primary) !important;
  box-shadow: 0 0 0 3px rgba(83,177,228,0.15) !important;
  outline: none !important;
}

/* Hide WooCommerce Show Password Toggle entirely */
.woocommerce form .show-password-input {
  display: none !important;
}

.woocommerce form .form-row {
  padding: 0 !important;
  margin-bottom: 1rem !important;
  clear: none !important;
}
.woocommerce form .form-row label {
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: var(--pl-text) !important;
  margin-bottom: 0.375rem !important;
  display: block !important;
}
/* Stack on mobile, side-by-side on tablet+ */
.woocommerce form .form-row.form-row-first,
.woocommerce form .form-row.form-row-last {
  width: 100% !important;
  float: none !important;
}
@media (min-width: 640px) {
  .woocommerce form .form-row.form-row-first {
    width: 48% !important;
    float: left !important;
  }
  .woocommerce form .form-row.form-row-last {
    width: 48% !important;
    float: right !important;
  }
}

/* ═══════════════════════════════════════════════════════
   7. STARS
══════════════════════════════════════════════════════════ */
.woocommerce .star-rating span::before,
.woocommerce .star-rating::before { color: #FBBF24 !important; }
.woocommerce .star-rating         { color: #FBBF24 !important; }

/* Interactive Rating Stars (Review Form) */
.woocommerce p.stars a {
  position: relative;
  height: 1.25em;
  width: 1.25em;
  text-indent: -999em;
  display: inline-block;
  text-decoration: none;
  margin-right: 0.25rem;
  outline: none;
}
.woocommerce p.stars a::before {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 1.25em;
  height: 1.25em;
  line-height: 1.25;
  font-family: system-ui, -apple-system, sans-serif;
  content: "★";
  text-indent: 0;
  font-size: 1.25rem;
  color: #d1d5db;
  transition: color 0.15s ease;
}
.woocommerce p.stars:hover a::before {
  color: #FBBF24 !important;
}
.woocommerce p.stars a:hover ~ a::before {
  color: #d1d5db !important;
}
.woocommerce p.stars.selected a::before {
  color: #FBBF24;
}
.woocommerce p.stars.selected a.active ~ a::before {
  color: #d1d5db;
}

/* ═══════════════════════════════════════════════════════
   8. BREADCRUMB
══════════════════════════════════════════════════════════ */
.woocommerce .woocommerce-breadcrumb {
  font-size: 0.875rem !important;
  color: var(--pl-text-muted) !important;
  padding: 1rem 0 !important;
  margin: 0 !important;
  background: none !important;
  flex-wrap: wrap !important;
}
.woocommerce .woocommerce-breadcrumb a { color: var(--pl-text-muted) !important; text-decoration: none !important; }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--pl-primary) !important; }

/* ═══════════════════════════════════════════════════════
   9. NOTICES — single definition
══════════════════════════════════════════════════════════ */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top: none !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 0.875rem 1.125rem !important;
  margin-bottom: 1rem !important;
  font-size: 0.9375rem !important;
}
.woocommerce-message {
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  color: #166534 !important;
}
.woocommerce-info {
  background: var(--pl-bg-accent) !important;
  border: 1px solid rgba(83,177,228,0.3) !important;
  color: var(--pl-secondary) !important;
}
.woocommerce-error {
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  color: #991b1b !important;
}
.woocommerce-message::before,
.woocommerce-info::before { display: none !important; }
/* Button inside notice */
.woocommerce-message .button { margin-left: auto !important; }

/* ═══════════════════════════════════════════════════════
   10. PAGINATION
══════════════════════════════════════════════════════════ */
.woocommerce nav.woocommerce-pagination {
  text-align: center !important;
  margin: 2rem 0 3rem !important;
}
.woocommerce nav.woocommerce-pagination ul {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 0.375rem !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}
.woocommerce nav.woocommerce-pagination ul li { border: none !important; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2.25rem !important;
  height: 2.25rem !important;
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  color: var(--pl-text) !important;
  text-decoration: none !important;
  transition: var(--pl-transition) !important;
  font-size: 0.9375rem !important;
  background: #fff !important;
}
.woocommerce nav.woocommerce-pagination ul li a:hover {
  border-color: var(--pl-primary) !important;
  color: var(--pl-primary) !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--pl-primary) !important;
  color: #fff !important;
  border-color: var(--pl-primary) !important;
}

/* ═══════════════════════════════════════════════════════
   11. ORDERING & RESULT COUNT
══════════════════════════════════════════════════════════ */
.woocommerce-ordering { float: none !important; margin: 0 !important; }
.woocommerce-ordering select {
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 0.5rem 2.25rem 0.5rem 0.875rem !important;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 0.625rem center !important;
  appearance: none !important;
  cursor: pointer !important;
  font-size: 0.9375rem !important;
  color: var(--pl-text) !important;
  outline: none !important;
  max-width: 100% !important;
}
.woocommerce-result-count {
  font-size: 0.9375rem !important;
  color: var(--pl-text-muted) !important;
  margin: 0 !important;
  float: none !important;
}

/* ═══════════════════════════════════════════════════════
   12. SINGLE PRODUCT — tabs, quantity, meta
══════════════════════════════════════════════════════════ */

/* ── Tab container ── */
body.single-product .woocommerce-tabs {
  margin-top: 3rem !important;
  margin-bottom: 3rem !important;
}

body.single-product .woocommerce-tabs ul.tabs.wc-tabs {
  padding: 0 !important;
  margin: 0 !important;
  background: #fff !important;
  border: 1px solid var(--pl-border-solid) !important;
  border-bottom: none !important;
  border-radius: var(--pl-radius-xl) var(--pl-radius-xl) 0 0 !important;
  display: flex !important;
  overflow-x: auto !important;
  white-space: nowrap !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important;
  gap: 0 !important;
  list-style: none !important;
}

body.single-product .woocommerce-tabs ul.tabs.wc-tabs::-webkit-scrollbar {
  display: none !important;
}

/* ── Tab items ── */
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  flex-shrink: 0 !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.single-product .woocommerce-tabs ul.tabs.wc-tabs li::before,
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li::after { 
  display: none !important; 
}

/* ── Tab links ── */
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a {
  display: block !important;
  color: var(--pl-text-muted) !important;
  font-weight: 500 !important;
  font-size: 0.9375rem !important;
  padding: 1rem 1.5rem !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  border-bottom: 3px solid transparent !important;
  line-height: 1 !important;
}

@media (min-width: 768px) {
  body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a {
    padding: 1.25rem 2rem !important;
    font-size: 1rem !important;
  }
}

body.single-product .woocommerce-tabs ul.tabs.wc-tabs li a:hover {
  color: var(--pl-primary) !important;
  background: rgba(83, 177, 228, 0.03) !important;
}

/* ── Active tab ── */
body.single-product .woocommerce-tabs ul.tabs.wc-tabs li.active a {
  color: var(--pl-primary) !important;
  font-weight: 600 !important;
  border-bottom-color: var(--pl-primary) !important;
  background: #fff !important;
}

/* ── Tab panel content card ── */
body.single-product .woocommerce-Tabs-panel {
  background: #fff !important;
  border: 1px solid var(--pl-border-solid) !important;
  border-radius: 0 0 var(--pl-radius-xl) var(--pl-radius-xl) !important;
  padding: 2rem 1.5rem !important;
  margin: 0 !important;
  display: none; /* Hide by default */
}

/* Show active panel */
body.single-product .woocommerce-Tabs-panel.active {
  display: block;
}

@media (min-width: 768px) {
  body.single-product .woocommerce-Tabs-panel {
    padding: 3rem !important;
  }
}

/* ── Tab panel typography reset ── */
body.single-product .woocommerce-Tabs-panel h2 {
  font-size: 1.5rem !important;
  font-weight: 600 !important;
  color: var(--pl-text) !important;
  margin: 0 0 1.5rem !important;
}

body.single-product .woocommerce-Tabs-panel h3 {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: var(--pl-text) !important;
  margin: 2rem 0 1rem !important;
}

body.single-product .woocommerce-Tabs-panel p {
  font-size: 1rem !important;
  line-height: 1.8 !important;
  color: var(--pl-text) !important;
  margin-bottom: 1.25rem !important;
}

/* ── Tab panel table styles ── */
body.single-product .woocommerce-Tabs-panel table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin-bottom: 1.5rem !important;
  background: #fff !important;
  border-radius: var(--pl-radius-lg) !important;
  overflow: hidden !important;
  box-shadow: 0 0 0 1px var(--pl-border-solid) !important;
}

body.single-product .woocommerce-Tabs-panel table th,
body.single-product .woocommerce-Tabs-panel table td {
  padding: 1rem 1.25rem !important;
  border-bottom: 1px solid var(--pl-border-solid) !important;
  text-align: left !important;
  font-size: 0.9375rem !important;
  color: var(--pl-text) !important;
  vertical-align: top !important;
}

body.single-product .woocommerce-Tabs-panel table th {
  background: var(--pl-bg-muted) !important;
  font-weight: 600 !important;
  width: 30% !important;
  color: var(--pl-secondary) !important;
}

body.single-product .woocommerce-Tabs-panel table tr:last-child th,
body.single-product .woocommerce-Tabs-panel table tr:last-child td {
  border-bottom: none !important;
}

body.single-product .woocommerce-Tabs-panel table p {
  margin: 0 !important;
  padding: 0 !important;
}

/* ── Reviews Section ── */
body.single-product #reviews {
  outline: none !important;
}

body.single-product .woocommerce-Reviews-title {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: var(--pl-text) !important;
  margin: 0 0 2rem !important;
}

/* Star Rating — CSS Only implementation to replace numbers */
.woocommerce .star-rating {
  float: none !important;
  overflow: hidden !important;
  position: relative !important;
  height: 1em !important;
  line-height: 1 !important;
  font-size: 1rem !important;
  width: 5.4em !important;
  font-family: system-ui, -apple-system, sans-serif !important;
  margin-bottom: 0.5rem !important;
  color: #FBBF24 !important;
}

/* Fallback for when 'star' font isn't loaded: use CSS stars */
.woocommerce .star-rating::before {
  content: '★★★★★' !important;
  opacity: 0.25 !important;
  float: left !important;
  top: 0 !important;
  left: 0 !important;
  position: absolute !important;
  letter-spacing: 0.1em !important;
}

.woocommerce .star-rating span {
  overflow: hidden !important;
  float: left !important;
  top: 0 !important;
  left: 0 !important;
  position: absolute !important;
  padding-top: 1.5em !important;
}

.woocommerce .star-rating span::before {
  content: '★★★★★' !important;
  top: 0 !important;
  left: 0 !important;
  position: absolute !important;
  letter-spacing: 0.1em !important;
}

/* Review list */
body.single-product #comments .commentlist {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 3rem !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1.5rem !important;
}

body.single-product #comments .commentlist .comment_container {
  display: flex !important;
  gap: 1rem !important;
  padding: 1.5rem !important;
  background: var(--pl-bg-muted) !important;
  border-radius: var(--pl-radius-xl) !important;
  border: 1px solid var(--pl-border-solid) !important;
}

body.single-product #comments .commentlist .comment_container img.avatar {
  width: 3rem !important;
  height: 3rem !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

body.single-product #comments .commentlist .comment-text {
  flex: 1 !important;
}

body.single-product #comments .commentlist .meta {
  margin-bottom: 0.5rem !important;
}

body.single-product #comments .commentlist .woocommerce-review__author {
  font-weight: 600 !important;
  color: var(--pl-text) !important;
}

/* ── Review form ── */
body.single-product #review_form_wrapper {
  background: var(--pl-bg-muted) !important;
  padding: 2rem !important;
  border-radius: var(--pl-radius-xl) !important;
  border: 1px solid var(--pl-border-solid) !important;
}

body.single-product #reply-title {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  margin-bottom: 1.5rem !important;
}

body.single-product .comment-form #submit {
  background: var(--pl-gradient-main) !important;
  color: #fff !important;
  padding: 1rem 2.5rem !important;
  border-radius: var(--pl-radius-full) !important;
  font-weight: 600 !important;
  border: none !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
}

body.single-product .comment-form #submit:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--pl-shadow-lg) !important;
}

/* Cart Form Layout: Side-by-side Quantity and Button */
.woocommerce div.product form.cart.variations_form {
  display: block !important;
}

.woocommerce div.product form.cart:not(.variations_form),
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 1rem !important;
  align-items: stretch !important;
  margin-bottom: 2rem !important;
}

/* Fix pseudo-elements breaking flex layout */
.woocommerce div.product form.cart::before,
.woocommerce div.product form.cart::after,
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart::before,
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart::after {
  display: none !important;
}

.woocommerce div.product form.cart .quantity {
  margin: 0 !important;
  flex-shrink: 0 !important;
  display: flex !important;
}

.woocommerce div.product form.cart .single_add_to_cart_button {
  margin: 0 !important;
  flex: 1 !important;
  white-space: normal !important;
}

/* Quantity input fix */
.woocommerce div.product form.cart .quantity .qty {
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 0.5rem !important;
  text-align: center !important;
  width: 3.5rem !important;
  font-size: 1rem !important;
  height: 100% !important;
  min-height: 48px !important;
  -moz-appearance: textfield !important;
}
.woocommerce div.product form.cart .quantity .qty::-webkit-outer-spin-button,
.woocommerce div.product form.cart .quantity .qty::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

/* Product meta */
.woocommerce div.product .product_meta {
  font-size: 0.875rem !important;
  color: var(--pl-text-muted) !important;
  margin-top: 1.5rem !important;
  padding-top: 1.5rem !important;
  border-top: 1px solid var(--pl-border-solid) !important;
}

.woocommerce div.product .product_meta span {
  display: block !important;
  margin-bottom: 0.25rem !important;
}

.woocommerce div.product .product_meta a { 
  color: var(--pl-primary) !important; 
  text-decoration: none !important; 
}


/* ═══════════════════════════════════════════════════════
   13. CART BLOCK (wc-block-cart / wp-block-woocommerce-cart)
══════════════════════════════════════════════════════════ */
.wc-block-cart,
.wp-block-woocommerce-cart {
  padding: 2rem 1rem !important;
  max-width: var(--pl-container-max) !important;
  margin: 0 auto !important;
}
@media (min-width: 768px) {
  .wc-block-cart,
  .wp-block-woocommerce-cart { padding: 3rem 1.5rem !important; }
}

/* Section headings */
.wc-block-cart__main-heading {
  font-size: 1.5rem !important;
  font-weight: 600 !important;
  color: var(--pl-text) !important;
  margin-bottom: 1.5rem !important;
}

/* Cart items container */
.wc-block-cart-items {
  border: 1px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-2xl) !important;
  overflow: hidden !important;
  background: #fff !important;
  margin-bottom: 1.5rem !important;
}
.wc-block-cart-items__header {
  background: var(--pl-bg-muted) !important;
  padding: 0.875rem 1.25rem !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  color: var(--pl-text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  display: none !important; /* hidden on mobile */
}
@media (min-width: 640px) {
  .wc-block-cart-items__header { display: block !important; }
}
.wc-block-cart-item {
  padding: 1rem !important;
  border-bottom: 1px solid var(--pl-border-solid) !important;
}
@media (min-width: 768px) {
  .wc-block-cart-item { padding: 1.25rem !important; }
}
.wc-block-cart-item:last-child { border-bottom: none !important; }

/* Product image */
.wc-block-cart-item__image a,
.wc-block-cart-item__image img {
  width: 4.5rem !important;
  height: 4.5rem !important;
  object-fit: cover !important;
  border-radius: var(--pl-radius-lg) !important;
  display: block !important;
}
@media (min-width: 768px) {
  .wc-block-cart-item__image a,
  .wc-block-cart-item__image img {
    width: 6rem !important;
    height: 6rem !important;
    border-radius: var(--pl-radius-xl) !important;
  }
}

/* Product name */
.wc-block-cart-item__product-name,
.wc-block-cart-item__product-name a {
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  color: var(--pl-text) !important;
  text-decoration: none !important;
  display: block !important;
  margin-bottom: 0.25rem !important;
}
@media (min-width: 768px) {
  .wc-block-cart-item__product-name,
  .wc-block-cart-item__product-name a { font-size: 1rem !important; }
}
.wc-block-cart-item__product-name a:hover { color: var(--pl-primary) !important; }

/* Variation (power, size, etc.) */
.wc-block-cart-item__product-metadata {
  font-size: 0.8125rem !important;
  color: var(--pl-text-muted) !important;
  margin-bottom: 0.625rem !important;
}

/* Quantity stepper */
.wc-block-components-quantity-selector {
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  background: #fff !important;
}
.wc-block-components-quantity-selector__button {
  background: transparent !important;
  border: none !important;
  padding: 0.4375rem 0.75rem !important;
  cursor: pointer !important;
  color: var(--pl-text) !important;
  font-size: 1.125rem !important;
  line-height: 1 !important;
  transition: background 0.15s !important;
  min-height: 44px !important;
  min-width: 44px !important;
}
.wc-block-components-quantity-selector__button:hover { background: var(--pl-bg-muted) !important; }
.wc-block-components-quantity-selector__input {
  width: 2.75rem !important;
  text-align: center !important;
  border: none !important;
  border-left: 1.5px solid var(--pl-border-solid) !important;
  border-right: 1.5px solid var(--pl-border-solid) !important;
  padding: 0.4375rem 0.25rem !important;
  font-size: 1rem !important;
  color: var(--pl-text) !important;
  background: transparent !important;
  outline: none !important;
  -moz-appearance: textfield !important;
}
.wc-block-components-quantity-selector__input::-webkit-outer-spin-button,
.wc-block-components-quantity-selector__input::-webkit-inner-spin-button { -webkit-appearance: none !important; }

/* Remove link */
.wc-block-cart-item__remove-link {
  color: var(--pl-text-light) !important;
  font-size: 0.8125rem !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.25rem !important;
  margin-top: 0.5rem !important;
}
.wc-block-cart-item__remove-link:hover { color: #dc2626 !important; }

/* Line total price */
.wc-block-cart-item__total .price,
.wc-block-cart-item__total bdi {
  font-size: 1.0625rem !important;
  font-weight: 600 !important;
  color: var(--pl-price) !important;
}

/* Order summary sidebar */
.wc-block-cart__payment-pad,
.wc-block-components-order-summary {
  background: #fff !important;
  border: 1px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-2xl) !important;
  padding: 1.25rem !important;
  box-shadow: var(--pl-shadow-sm) !important;
}
@media (min-width: 768px) {
  .wc-block-cart__payment-pad,
  .wc-block-components-order-summary { padding: 1.5rem !important; }
}

.wc-block-components-order-summary__button-text,
.wc-block-components-order-summary__title {
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  color: var(--pl-text) !important;
}

/* Totals rows */
.wc-block-components-totals-item {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 0.625rem 0 !important;
  font-size: 0.9375rem !important;
  color: var(--pl-text-muted) !important;
  border-bottom: 1px solid var(--pl-border-solid) !important;
}
.wc-block-components-totals-item:last-child { border-bottom: none !important; }
.wc-block-components-totals-item__value { font-weight: 500 !important; color: var(--pl-text) !important; }

/* Grand total row */
.wc-block-components-totals-footer-item {
  padding: 1rem 0 0 !important;
  border-top: 2px solid var(--pl-border-solid) !important;
  margin-top: 0.5rem !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
  font-size: 1.0625rem !important;
  font-weight: 600 !important;
  color: var(--pl-text) !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--pl-price) !important;
}

/* Coupon input */
.wc-block-components-totals-coupon__form {
  display: flex !important;
  gap: 0.5rem !important;
  margin-top: 1rem !important;
  flex-wrap: wrap !important;
}
.wc-block-components-totals-coupon__input { flex: 1 !important; min-width: 0 !important; }
.wc-block-components-totals-coupon__input .wc-block-components-text-input {
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 0.625rem 1rem !important;
  font-size: 1rem !important;
  outline: none !important;
  width: 100% !important;
  transition: border-color 0.2s !important;
}
.wc-block-components-totals-coupon__input .wc-block-components-text-input:focus { border-color: var(--pl-primary) !important; }
.wc-block-components-totals-coupon__button {
  background: var(--pl-bg-muted) !important;
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 0.625rem 1rem !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  font-size: 1rem !important;
  transition: background 0.2s !important;
}
.wc-block-components-totals-coupon__button:hover { background: #e9ecef !important; }

/* Proceed to checkout / Place order button */
.wc-block-cart__submit-container { margin-top: 1.5rem !important; }
.wc-block-cart__submit-container .wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  width: 100% !important;
  background: var(--pl-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--pl-radius-full) !important;
  padding: 0.9375rem 1.5rem !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: var(--pl-transition) !important;
  box-shadow: var(--pl-shadow-md) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
}
@media (min-width: 768px) {
  .wc-block-cart__submit-container .wc-block-cart__submit-button,
  .wc-block-components-checkout-place-order-button { font-size: 1.0625rem !important; padding: 1rem 2rem !important; }
}
.wc-block-cart__submit-container .wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
  background: var(--pl-secondary) !important;
  box-shadow: var(--pl-shadow-xl) !important;
}

/* Return to shop */
.wc-block-cart__return-to-cart-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.375rem !important;
  color: var(--pl-primary) !important;
  font-size: 0.9375rem !important;
  text-decoration: none !important;
  margin-top: 1rem !important;
}
.wc-block-cart__return-to-cart-link:hover { color: var(--pl-secondary) !important; }

/* ═══════════════════════════════════════════════════════
   14. CHECKOUT BLOCK (wc-block-checkout)
══════════════════════════════════════════════════════════ */
.wc-block-checkout,
.wp-block-woocommerce-checkout {
  padding: 2rem 1rem !important;
  max-width: var(--pl-container-max) !important;
  margin: 0 auto !important;
}
@media (min-width: 768px) {
  .wc-block-checkout,
  .wp-block-woocommerce-checkout { padding: 3rem 1.5rem !important; }
}

/* Step heading */
.wc-block-components-checkout-step__heading {
  font-size: 1.0625rem !important;
  font-weight: 600 !important;
  color: var(--pl-text) !important;
  margin-bottom: 1.25rem !important;
  padding-bottom: 0.75rem !important;
  border-bottom: 1px solid var(--pl-border-solid) !important;
}
@media (min-width: 768px) {
  .wc-block-components-checkout-step__heading { font-size: 1.25rem !important; }
}

/* Step number badge */
.wc-block-components-checkout-step__heading-number {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 1.875rem !important;
  height: 1.875rem !important;
  background: var(--pl-gradient-main) !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  margin-right: 0.625rem !important;
  flex-shrink: 0 !important;
}

/* Step panels */
.wc-block-components-checkout-step {
  background: #fff !important;
  border: 1px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-2xl) !important;
  padding: 1.25rem !important;
  margin-bottom: 1.25rem !important;
}
@media (min-width: 768px) {
  .wc-block-components-checkout-step { padding: 1.75rem !important; }
}
@media (min-width: 1024px) {
  .wc-block-components-checkout-step { padding: 2rem !important; }
}

/* Checkout text inputs */
.wc-block-components-text-input label,
.wc-block-components-select label {
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: var(--pl-text) !important;
  margin-bottom: 0.375rem !important;
  display: block !important;
}
.wc-block-components-text-input input,
.wc-block-components-select select,
.wc-block-components-country-input input {
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 0.8125rem 1rem !important;
  font-size: 1rem !important;
  width: 100% !important;
  color: var(--pl-text) !important;
  background: #fff !important;
  outline: none !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.wc-block-components-text-input input:focus,
.wc-block-components-select select:focus {
  border-color: var(--pl-primary) !important;
  box-shadow: 0 0 0 3px rgba(83,177,228,0.15) !important;
}

/* 2-column address grid */
.wc-block-components-address-form {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.875rem !important;
}
@media (min-width: 768px) {
  .wc-block-components-address-form { grid-template-columns: 1fr 1fr !important; }
  .wc-block-components-address-form .wc-block-components-address-form__address_1,
  .wc-block-components-address-form .wc-block-components-address-form__email,
  .wc-block-components-address-form .wc-block-components-address-form__phone,
  .wc-block-components-address-form .wc-block-components-country-input { grid-column: 1 / -1 !important; }
}

/* Payment method options */
.wc-block-components-radio-control-accordion-option {
  border: 2px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-xl) !important;
  padding: 0.875rem 1.125rem !important;
  margin-bottom: 0.625rem !important;
  transition: border-color 0.2s, background 0.2s !important;
  background: #fff !important;
}
.wc-block-components-radio-control-accordion-option:has(input:checked) {
  border-color: var(--pl-primary) !important;
  background: var(--pl-bg-accent) !important;
}
.wc-block-components-payment-method-label {
  font-weight: 500 !important;
  color: var(--pl-text) !important;
  font-size: 1rem !important;
}
.wc-block-components-radio-control-accordion-content {
  background: var(--pl-bg-muted) !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 1rem !important;
  margin-top: 0.75rem !important;
  font-size: 0.9375rem !important;
  color: var(--pl-text-muted) !important;
}

/* Sidebar sticky */
.wc-block-checkout__sidebar .wc-block-components-order-summary {
  position: sticky !important;
  top: 6rem !important;
}

/* Privacy / terms text */
.wc-block-checkout__privacy-policy-text,
.wc-block-checkout__terms {
  font-size: 0.8125rem !important;
  color: var(--pl-text-muted) !important;
  margin-top: 1rem !important;
  text-align: center !important;
  line-height: 1.6 !important;
}
.wc-block-checkout__privacy-policy-text a,
.wc-block-checkout__terms a { color: var(--pl-primary) !important; }

/* ═══════════════════════════════════════════════════════
   15. WC BLOCK GENERIC COMPONENTS
══════════════════════════════════════════════════════════ */
/* Checkbox */
.wc-block-components-checkbox input[type="checkbox"] {
  border: 1.5px solid var(--pl-border-solid) !important;
  border-radius: 4px !important;
  width: 1.125rem !important;
  height: 1.125rem !important;
}
.wc-block-components-checkbox input[type="checkbox"]:checked {
  background-color: var(--pl-primary) !important;
  border-color: var(--pl-primary) !important;
}

/* Validation error */
.wc-block-components-validation-error p {
  color: #dc2626 !important;
  font-size: 0.8125rem !important;
  margin-top: 0.25rem !important;
}
.wc-block-components-text-input.has-error input,
.wc-block-components-select.has-error select { border-color: #dc2626 !important; }

/* ═══════════════════════════════════════════════════════
   16. CART & CHECKOUT PAGE WRAPPERS
══════════════════════════════════════════════════════════ */
.woocommerce-cart,
.woocommerce-checkout {
  background: var(--pl-bg-muted) !important;
  min-height: 60vh !important;
}
.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content { max-width: 100% !important; }

/* ═══════════════════════════════════════════════════════
   17. MY ACCOUNT — flexbox, no floats
══════════════════════════════════════════════════════════ */
.woocommerce-account .woocommerce {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.5rem !important;
  padding: 2rem 1rem !important;
  max-width: var(--pl-container-max) !important;
  margin: 0 auto !important;
  float: none !important;
  width: auto !important;
}
@media (min-width: 768px) {
  .woocommerce-account .woocommerce {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 2rem !important;
    padding: 3rem 1.5rem !important;
  }
}

/* Nav sidebar */
.woocommerce-MyAccount-navigation {
  width: 100% !important;
  flex-shrink: 0 !important;
  float: none !important;
}
@media (min-width: 768px) {
  .woocommerce-MyAccount-navigation {
    width: 220px !important;
    position: sticky !important;
    top: 6rem !important;
  }
}

/* Content area */
.woocommerce-MyAccount-content {
  flex: 1 !important;
  min-width: 0 !important;
  width: 100% !important;
  float: none !important;
}

/* Nav list */
.woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #fff !important;
  border: 1px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-2xl) !important;
  overflow: hidden !important;
  /* Horizontal scroll on mobile */
  display: flex !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}
@media (min-width: 768px) {
  .woocommerce-MyAccount-navigation ul {
    display: block !important;
    overflow-x: visible !important;
  }
  .woocommerce-MyAccount-navigation ul li {
    border-bottom: 1px solid var(--pl-border-solid) !important;
  }
  .woocommerce-MyAccount-navigation ul li:last-child { border-bottom: none !important; }
}
.woocommerce-MyAccount-navigation ul li a {
  display: block !important;
  padding: 0.875rem 1.125rem !important;
  color: var(--pl-text-muted) !important;
  text-decoration: none !important;
  transition: var(--pl-transition-fast) !important;
  font-size: 0.9375rem !important;
  white-space: nowrap !important;
}
.woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-MyAccount-navigation ul li.is-active a {
  background: var(--pl-bg-accent) !important;
  color: var(--pl-primary) !important;
}

/* ═══════════════════════════════════════════════════════
   17b. MY ACCOUNT — Login / Register Tab UI
   The form-login.php template renders a two-tab UI:
   "Login" and "Create Account". These rules power it.
══════════════════════════════════════════════════════════ */

/* Page-level centering for the login/register wrap */
.woocommerce-account:not(.logged-in) .woocommerce {
  display: block !important;
  padding: 2rem 1rem !important;
}

.pl-login-wrap {
  max-width: 480px;
  margin: 0 auto;
}

/* ── Tab bar ─────────────────────────────────────────── */
.pl-login-tabs {
  display: flex;
  border-bottom: 2px solid var(--pl-border-solid);
  margin-bottom: 2rem;
  gap: 0;
}

.pl-login-tab {
  flex: 1;
  padding: 0.875rem 1rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--pl-text-muted);
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease;
  text-align: center;
  line-height: 1.2;
}

.pl-login-tab:hover {
  color: var(--pl-primary);
}

.pl-login-tab--active {
  color: var(--pl-primary) !important;
  font-weight: 600 !important;
  border-bottom-color: var(--pl-primary) !important;
}

/* ── Form panels — only the active one is shown ──────── */
.pl-login-form {
  display: none;
}

.pl-login-form--active {
  display: block;
}

/* ── Form headings ───────────────────────────────────── */
.pl-login-form h2 {
  font-size: 1.625rem;
  font-weight: 700;
  color: var(--pl-text);
  margin: 0 0 0.375rem;
  line-height: 1.2;
}

@media (min-width: 640px) {
  .pl-login-form h2 { font-size: 1.875rem; }
}

.pl-login-subtitle {
  color: var(--pl-text-muted);
  margin: 0 0 1.75rem;
  font-size: 0.9375rem;
  line-height: 1.5;
}

/* ── Submit buttons inside login/register forms ──────── */
.pl-login-form .woocommerce-form-login__submit,
.pl-login-form .woocommerce-form-register__submit {
  width: 100%;
  padding: 0.875rem 1.5rem !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  border-radius: var(--pl-radius-full) !important;
  background: var(--pl-gradient-main) !important;
  color: #fff !important;
  border: none !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease, transform 0.2s ease !important;
  margin-top: 0.5rem !important;
  min-height: 52px !important;
}

.pl-login-form .woocommerce-form-login__submit:hover,
.pl-login-form .woocommerce-form-register__submit:hover {
  opacity: 0.92 !important;
  transform: translateY(-1px) !important;
}

/* ── Lost password link ──────────────────────────────── */
.pl-login-form .woocommerce-LostPassword {
  font-size: 0.875rem;
  text-align: right;
  margin: -0.5rem 0 0.75rem;
}

.pl-login-form .woocommerce-LostPassword a {
  color: var(--pl-primary);
  text-decoration: none;
}

.pl-login-form .woocommerce-LostPassword a:hover {
  text-decoration: underline;
}

/* ── Remember me checkbox ────────────────────────────── */
.pl-login-form .woocommerce-form__label-for-checkbox {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  font-size: 0.9375rem !important;
  cursor: pointer !important;
}

/* ═══════════════════════════════════════════════════════
   18. SHOP TABLE (orders, account)
══════════════════════════════════════════════════════════ */
.woocommerce table.shop_table {
  width: 100% !important;
  border-collapse: collapse !important;
  border: 1px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-xl) !important;
  overflow: hidden !important;
  font-size: 0.9375rem !important;
}
.woocommerce table.shop_table th {
  font-weight: 600 !important;
  color: var(--pl-text) !important;
  background: var(--pl-bg-muted) !important;
  padding: 0.875rem 1rem !important;
  border-bottom: 2px solid var(--pl-border-solid) !important;
  text-align: left !important;
  white-space: nowrap !important;
}
.woocommerce table.shop_table td {
  padding: 0.875rem 1rem !important;
  border-bottom: 1px solid var(--pl-border-solid) !important;
  vertical-align: middle !important;
}
.woocommerce table.shop_table tr:last-child td { border-bottom: none !important; }

/* Horizontal scroll on mobile */
.woocommerce-MyAccount-content .woocommerce-orders-table,
.woocommerce-MyAccount-content .shop_table_responsive {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  display: block !important;
  width: 100% !important;
}

/* ═══════════════════════════════════════════════════════
   19. MISC WRAPPERS
══════════════════════════════════════════════════════════ */
.pl-wc-wrapper {
  background: var(--pl-bg);
  padding: 2rem 0 4rem;
  min-height: 60vh;
}

/* ═══════════════════════════════════════════════════════
   20. THANK YOU PAGE LAYOUT
══════════════════════════════════════════════════════════ */
.pl-thankyou__icon--failed { background: linear-gradient(135deg, #ef4444, #b91c1c); }
.pl-thankyou__text { color: var(--pl-text-muted); margin-bottom: 2rem; }
.pl-thankyou__text--compact { margin-bottom: 1.5rem; }
.pl-thankyou__actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.pl-thankyou__whatsapp-wrap { margin-top: 2rem; }
.pl-thankyou__whatsapp-btn { display: inline-flex; margin: 0 auto 1.5rem; }

/* === Mobile Sticky Checkout Bar — Cart === */

.pl-sticky-cart-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: #ffffff;
  border-top: 1.5px solid rgba(0, 0, 0, 0.08);
  padding: 0.875rem 1rem;
  padding-bottom: calc(0.875rem + env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.08);
}

.pl-sticky-cart-bar__total {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pl-sticky-cart-bar__label {
  font-size: 0.75rem;
  color: rgba(0, 0, 0, 0.5);
  font-weight: 400;
  line-height: 1;
}

.pl-sticky-cart-bar__amount {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--pl-secondary);
  line-height: 1;
}

.pl-sticky-cart-bar__btn {
  flex: 1;
  max-width: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 1.25rem;
  background: linear-gradient(135deg, #53B1E4 0%, #454AA0 100%);
  color: #ffffff;
  font-size: 0.9375rem;
  font-weight: 500;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  text-decoration: none;
  min-height: 48px;
  transition: opacity 0.2s ease;
  letter-spacing: 0.01em;
}

.pl-sticky-cart-bar__btn:hover {
  opacity: 0.9;
  color: #ffffff;
  text-decoration: none;
}

@media (min-width: 768px) {
  .pl-sticky-cart-bar {
    display: none;
  }
}

.pl-cart-bottom-spacer {
  height: 80px;
}

@media (min-width: 768px) {
  .pl-cart-bottom-spacer {
    display: none;
  }
}

/* === Mobile Sticky Checkout Bar — Place Order === */

.pl-sticky-order-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: #ffffff;
  border-top: 1.5px solid rgba(0, 0, 0, 0.08);
  padding: 0.875rem 1rem;
  padding-bottom: calc(0.875rem + env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.08);
}

.pl-sticky-order-bar__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.8125rem;
  color: rgba(0, 0, 0, 0.5);
}

.pl-sticky-order-bar__total {
  font-size: 1rem;
  font-weight: 600;
  color: var(--pl-secondary);
}

.pl-sticky-order-bar .wc-block-components-checkout-place-order-button,
.pl-sticky-order-bar .wc-block-checkout__place-order button {
  width: 100% !important;
  padding: 1rem !important;
  background: linear-gradient(135deg, #53B1E4 0%, #454AA0 100%) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 9999px !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  min-height: 52px !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease !important;
}

.pl-sticky-order-bar .wc-block-components-checkout-place-order-button:hover {
  opacity: 0.9 !important;
}

@media (min-width: 768px) {
  .pl-sticky-order-bar {
    display: none;
  }
}

.pl-checkout-bottom-spacer {
  height: 100px;
}

@media (min-width: 768px) {
  .pl-checkout-bottom-spacer {
    display: none;
  }
}

/* === Checkout — hide duplicate order summary on mobile ===
 * WooCommerce Blocks checkout renders the order summary twice on mobile:
 * once as a collapsed toggle at the top, and once as the full sidebar
 * stacked below the form. Hide the bottom one on mobile only.
 */
.wc-block-checkout .wc-block-checkout__sidebar {
  display: none;
}

@media (min-width: 768px) {
  .wc-block-checkout .wc-block-checkout__sidebar {
    display: block;
  }
}

/* ═══════════════════════════════════════════════════════
   21. CART & CHECKOUT — PAGE TEMPLATE WIDTH FIX
   
   Root cause: page.php wraps WC block content inside
   .pl-entry-content (max-width: 48rem). For cart and
   checkout, we must expand to full container width.
══════════════════════════════════════════════════════════ */
body.woocommerce-cart .pl-page,
body.woocommerce-checkout .pl-page {
  padding: 0 !important;
}
body.woocommerce-cart .pl-page > .pl-container,
body.woocommerce-checkout .pl-page > .pl-container {
  padding: 0 !important;
  max-width: 100% !important;
}
body.woocommerce-cart .pl-entry-content,
body.woocommerce-checkout .pl-entry-content {
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ═══════════════════════════════════════════════════════
   22. BLOCK CART — EXPLICIT 2-COLUMN FLEX LAYOUT
   
   Override the Section 13 padding-only rule.
   Add proper flex layout so items and totals sit
   side-by-side on tablet/desktop.
══════════════════════════════════════════════════════════ */
.wc-block-cart,
.wp-block-woocommerce-cart {
  padding: 0 !important;
  max-width: 100% !important;
}
.wc-block-cart {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.5rem !important;
  padding: 2rem 1rem !important;
}
@media (min-width: 768px) {
  .wc-block-cart {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 2rem !important;
    padding: 3rem 1.5rem !important;
  }
  .wc-block-cart__main {
    flex: 1 1 0% !important;
    min-width: 0 !important;
  }
  .wc-block-cart__sidebar {
    flex: 0 0 340px !important;
    width: 340px !important;
    position: sticky !important;
    top: 8rem !important;
  }
}

/* Cart items: full width at all breakpoints */
.wc-block-cart-items {
  width: 100% !important;
}
.wc-block-cart__payment-pad {
  width: 100% !important;
}

/* Fix cart items header: use flex so "Total" aligns right.
   Section 13 set display:block which broke column alignment. */
@media (min-width: 640px) {
  .wc-block-cart-items__header {
    display: flex !important;
    justify-content: flex-end !important;
  }
}

/* ═══════════════════════════════════════════════════════
   23. BLOCK CHECKOUT — EXPLICIT 2-COLUMN FLEX LAYOUT
   
   Override Section 14. Add proper flex layout with
   a wider sidebar so order summary text is readable.
══════════════════════════════════════════════════════════ */
.wc-block-checkout,
.wp-block-woocommerce-checkout {
  padding: 0 !important;
  max-width: 100% !important;
}
.wc-block-checkout {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.5rem !important;
  padding: 2rem 1rem !important;
}
@media (min-width: 768px) {
  .wc-block-checkout {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 2rem !important;
    padding: 3rem 1.5rem !important;
  }
  .wc-block-checkout__main {
    flex: 1 1 0% !important;
    min-width: 0 !important;
  }
  /* Desktop sidebar: fixed width, sticky, scrollable if tall */
  .wc-block-checkout .wc-block-checkout__sidebar {
    flex: 0 0 360px !important;
    width: 360px !important;
    display: block !important;
    position: sticky !important;
    top: 8rem !important;
    max-height: calc(100vh - 10rem) !important;
    overflow-y: auto !important;
    /* Reset mobile max-height clip */
    transition: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
    order: 0 !important;
  }
  .wc-block-checkout .wc-block-checkout__sidebar.pl-summary-open {
    max-height: calc(100vh - 10rem) !important;
  }
}

/* ═══════════════════════════════════════════════════════
   24. ORDER SUMMARY ITEM — TEXT WRAPPING FIX
   
   Product names were breaking character-by-character
   in the narrow sidebar. Fix with flex layout +
   word-break on the description column.
══════════════════════════════════════════════════════════ */
.wc-block-components-order-summary-item {
  display: flex !important;
  gap: 0.75rem !important;
  align-items: flex-start !important;
  min-width: 0 !important;
}
.wc-block-components-order-summary-item__image {
  flex-shrink: 0 !important;
  width: 3.5rem !important;
  height: 3.5rem !important;
}
.wc-block-components-order-summary-item__image img {
  width: 3.5rem !important;
  height: 3.5rem !important;
  object-fit: cover !important;
  border-radius: var(--pl-radius-lg) !important;
  display: block !important;
}
.wc-block-components-order-summary-item__description {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
.wc-block-components-order-summary-item__name {
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: var(--pl-text) !important;
  margin: 0 0 0.25rem !important;
  line-height: 1.4 !important;
}
.wc-block-components-order-summary-item__individual-prices,
.wc-block-components-order-summary-item__variation {
  font-size: 0.8125rem !important;
  color: var(--pl-text-muted) !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
}
.wc-block-components-order-summary-item__total {
  flex-shrink: 0 !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  color: var(--pl-price) !important;
  white-space: nowrap !important;
  margin-left: auto !important;
}

/* ═══════════════════════════════════════════════════════
   25. MOBILE CHECKOUT — COLLAPSIBLE ORDER SUMMARY
   
   On mobile: sidebar is shown collapsed at the top
   of the checkout form. JS (prime_lens_checkout_accordion)
   injects a .pl-summary-handle button as the first child;
   clicking it toggles .pl-summary-open on the sidebar.
   max-height: 3.75rem → collapsed (handle only visible).
   max-height: 120rem  → open (all content visible).
══════════════════════════════════════════════════════════ */

/* Override Section 14's mobile display:none — we now manage
   visibility via max-height accordion instead */
.wc-block-checkout .wc-block-checkout__sidebar {
  display: block !important;
}

@media (max-width: 767px) {
  .wc-block-checkout .wc-block-checkout__sidebar {
    /* Position above form on mobile */
    order: -1 !important;
    /* Accordion collapsed state: clipped to handle height */
    overflow: hidden !important;
    max-height: 3.75rem !important;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    border-radius: var(--pl-radius-xl) !important;
    box-shadow: var(--pl-shadow-md) !important;
    margin-bottom: 0.5rem !important;
  }
  .wc-block-checkout .wc-block-checkout__sidebar.pl-summary-open {
    max-height: 120rem !important;
  }
  /* Pad main form so it doesn't hide behind sticky order bar */
  .wc-block-checkout__main {
    padding-bottom: 5rem !important;
  }
}

/* The injected accordion toggle button (.pl-summary-handle)
   is inserted by prime_lens_checkout_accordion() in JS. */
.pl-summary-handle {
  display: none; /* Hidden on desktop */
}
@media (max-width: 767px) {
  .pl-summary-handle {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 3.75rem !important;
    padding: 0 1.25rem !important;
    background: var(--pl-secondary) !important;
    color: #fff !important;
    border: none !important;
    cursor: pointer !important;
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    font-family: inherit !important;
    text-align: left !important;
    flex-shrink: 0 !important;
  }
  .pl-summary-handle:focus-visible {
    outline: 2px solid rgba(255,255,255,0.8) !important;
    outline-offset: -3px !important;
  }
  .pl-summary-handle__right {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
  }
  .pl-summary-handle__price {
    font-size: 0.9375rem;
    font-weight: 700;
  }
  .pl-summary-handle__icon {
    width: 1.125rem;
    height: 1.125rem;
    transition: transform 0.3s ease;
    flex-shrink: 0;
  }
  .pl-summary-handle--open .pl-summary-handle__icon {
    transform: rotate(180deg);
  }
}

/* ═══════════════════════════════════════════════════════
   26. LOGIN / MY ACCOUNT — WIDER LAYOUT + TABS + MOBILE NOTICES FIX
══════════════════════════════════════════════════════════ */

/* 26a. Widen login container on PC */
.woocommerce-account:not(.logged-in) .pl-entry-content,
.woocommerce-account:not(.logged-in) .woocommerce {
  max-width: 720px !important;
  width: 100% !important;
  margin: 0 auto !important;
}

@media (min-width: 768px) {
  .woocommerce-account:not(.logged-in) .pl-entry-content,
  .woocommerce-account:not(.logged-in) .woocommerce {
    max-width: 560px !important;
    padding: 3rem 2rem !important;
  }
}

@media (min-width: 1024px) {
  .woocommerce-account:not(.logged-in) .pl-entry-content,
  .woocommerce-account:not(.logged-in) .woocommerce {
    max-width: 600px !important;
  }
}

/* 26b. Login/Register tabs */
.pl-login-wrap {
  background: #fff;
  border-radius: var(--pl-radius-2xl);
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
  overflow: hidden;
}

.pl-login-tabs {
  display: flex;
  border-bottom: 1px solid var(--pl-border-solid);
}

.pl-login-tab {
  flex: 1;
  padding: 1rem 1.5rem;
  background: var(--pl-bg-muted);
  border: none;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 500;
  color: var(--pl-text-muted);
  transition: all 0.2s ease;
}

.pl-login-tab:hover {
  background: #fff;
  color: var(--pl-text);
}

.pl-login-tab--active {
  background: #fff;
  color: var(--pl-primary);
  font-weight: 600;
  box-shadow: inset 0 -2px 0 var(--pl-primary);
}

/* 26c. Login forms container */
.pl-login-forms {
  padding: 2rem 1.5rem;
}

@media (min-width: 768px) {
  .pl-login-forms {
    padding: 2.5rem;
  }
}

.pl-login-form {
  display: none;
}

.pl-login-form--active {
  display: block;
}

.pl-login-form h2 {
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
  text-align: center;
}

.pl-login-subtitle {
  text-align: center;
  color: var(--pl-text-muted);
  margin-bottom: 1.5rem;
  font-size: 0.9375rem;
}

/* 26d. Hide cart/info notices on login page — NOT errors.
 * .woocommerce-message (green) can bleed in from add-to-cart on other pages.
 * .woocommerce-info   (blue)  similarly bleeds in.
 * .woocommerce-error  MUST remain visible — it shows login/register failures.
 */
.woocommerce-account:not(.logged-in) .woocommerce-message,
.woocommerce-account:not(.logged-in) .woocommerce-info {
  display: none !important;
}

/* Style errors on the login page so they look intentional */
.woocommerce-account:not(.logged-in) .woocommerce-error {
  display: block !important;
  margin-bottom: 1.5rem !important;
  border-radius: var(--pl-radius-lg) !important;
  padding: 0.875rem 1.125rem !important;
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  color: #991b1b !important;
  font-size: 0.9375rem !important;
  list-style: none !important;
}

/* 26e. Better form styling for login */
.woocommerce-account:not(.logged-in) .woocommerce-form {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.woocommerce-account:not(.logged-in) .woocommerce-form-row {
  margin-bottom: 1rem !important;
}

.woocommerce-account:not(.logged-in) .woocommerce-form-row label {
  display: block;
  margin-bottom: 0.375rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--pl-text);
}

.woocommerce-account:not(.logged-in) .woocommerce-Input {
  width: 100% !important;
  padding: 0.75rem 1rem !important;
  border: 1px solid var(--pl-border-solid) !important;
  border-radius: var(--pl-radius-lg) !important;
  font-size: 1rem !important;
  background: #fff !important;
}

.woocommerce-account:not(.logged-in) .woocommerce-Input:focus {
  outline: none !important;
  border-color: var(--pl-primary) !important;
  box-shadow: 0 0 0 3px rgba(83,177,228,0.15) !important;
}

.woocommerce-account:not(.logged-in) .woocommerce-form-login__submit,
.woocommerce-account:not(.logged-in) .woocommerce-form-register__submit {
  width: 100% !important;
  padding: 0.875rem 1.5rem !important;
  margin-top: 1rem !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
}

.woocommerce-account:not(.logged-in) .lost_password {
  text-align: center;
  margin-top: 1rem;
  font-size: 0.875rem;
}

.woocommerce-account:not(.logged-in) .lost_password a {
  color: var(--pl-primary);
  text-decoration: none;
}

.woocommerce-account:not(.logged-in) .lost_password a:hover {
  text-decoration: underline;
}

/* Remember me checkbox */
.woocommerce-account:not(.logged-in) .woocommerce-form__label-for-checkbox {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  font-size: 0.875rem !important;
  color: var(--pl-text-muted) !important;
  cursor: pointer;
}

.woocommerce-account:not(.logged-in) .woocommerce-form__input-checkbox {
  width: 1rem !important;
  height: 1rem !important;
  cursor: pointer;
}