/* ==========================================================================
   DIGISOVIA — shop.css
   WooCommerce: product card, catalogue, single product, cart, checkout,
   account. Woo's own stylesheets are dequeued, so this is the whole surface.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. PRODUCT CARD
   -------------------------------------------------------------------------- */

.ds-products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--ds-space-6);
  list-style: none;
}
@media (max-width: 1180px) { .ds-products { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 880px)  { .ds-products { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 520px)  { .ds-products { grid-template-columns: 1fr; } }

.ds-product {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--ds-surface);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-card);
  overflow: hidden;
  transition: var(--ds-transition-card);
}
.ds-product:hover {
  transform: translateY(-6px);
  box-shadow: var(--ds-shadow-xl), var(--ds-shadow-brand);
  border-color: transparent;
}

.ds-product__media {
  position: relative;
  background: linear-gradient(160deg, #FFFFFF 0%, #F1F5F9 100%);
}
.ds-product__media .ds-img-wrap { aspect-ratio: 1; }
.ds-product__media .ds-img {
  transition: transform var(--ds-duration-slow) var(--ds-ease-out);
}
.ds-product:hover .ds-product__media .ds-img { transform: scale(1.05); }

/* Hover actions — wishlist + quick view */
.ds-product__actions {
  position: absolute;
  top: var(--ds-space-4);
  right: var(--ds-space-4);
  z-index: var(--ds-z-raised);
  display: flex;
  flex-direction: column;
  gap: var(--ds-space-2);
  opacity: 0;
  transform: translateX(8px);
  transition: opacity var(--ds-duration-base) var(--ds-ease-out),
              transform var(--ds-duration-base) var(--ds-ease-out);
}
.ds-product:hover .ds-product__actions,
.ds-product:focus-within .ds-product__actions {
  opacity: 1;
  transform: none;
}
/* Touch devices have no hover — never hide the controls there. */
@media (hover: none) {
  .ds-product__actions { opacity: 1; transform: none; }
}

.ds-product__action {
  display: grid;
  place-items: center;
  width: 2.375rem;
  height: 2.375rem;
  border-radius: var(--ds-radius-pill);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
  color: var(--ds-text-secondary);
  box-shadow: var(--ds-shadow-sm);
  transition: background-color var(--ds-duration-fast) var(--ds-ease-in-out),
              color var(--ds-duration-fast) var(--ds-ease-in-out),
              transform var(--ds-duration-fast) var(--ds-ease-out);
}
.ds-product__action:hover {
  background: var(--ds-primary-600);
  color: #fff;
  transform: scale(1.08);
}
.ds-product__action.is-active { background: var(--ds-danger-500); color: #fff; }
.ds-product__action.is-active svg { fill: currentColor; }

.ds-product__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: var(--ds-space-3);
  padding: var(--ds-space-5) var(--ds-space-5) var(--ds-space-6);
}

.ds-product__cat {
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-semibold);
  letter-spacing: var(--ds-tracking-wide);
  text-transform: uppercase;
  color: var(--ds-text-brand);
}

.ds-product__title {
  font-family: var(--ds-font-display);
  font-size: var(--ds-text-lg);
  font-weight: var(--ds-weight-bold);
  letter-spacing: var(--ds-tracking-tight);
  line-height: var(--ds-leading-snug);
  /* Two-line clamp keeps every card in a row the same height. */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ds-product__title a:hover { color: var(--ds-text-brand); }

.ds-product__excerpt {
  font-size: var(--ds-text-sm);
  color: var(--ds-text-secondary);
  line-height: var(--ds-leading-normal);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ds-product__delivery {
  display: inline-flex;
  align-items: center;
  gap: var(--ds-space-2);
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-medium);
  color: var(--ds-success-700);
}
.ds-product__delivery svg { color: var(--ds-success-500); }

.ds-product__foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--ds-space-3);
  margin-top: auto;
  padding-top: var(--ds-space-2);
}

/* --------------------------------------------------------------------------
   2. PRICE
   -------------------------------------------------------------------------- */

.ds-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--ds-space-2);
  font-family: var(--ds-font-display);
}
.ds-price .amount,
.ds-price ins .amount {
  font-size: var(--ds-text-xl);
  font-weight: var(--ds-weight-bold);
  letter-spacing: var(--ds-tracking-tight);
  color: var(--ds-text-primary);
}
.ds-price ins { text-decoration: none; }
.ds-price del {
  opacity: 1;
  text-decoration: line-through;
  text-decoration-color: var(--ds-danger-500);
  text-decoration-thickness: 2px;
}
.ds-price del .amount {
  font-size: var(--ds-text-sm);
  font-weight: var(--ds-weight-medium);
  color: var(--ds-text-muted);
}
.ds-price-save {
  display: block;
  width: 100%;
  font-family: var(--ds-font-text);
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-semibold);
  color: var(--ds-success-700);
}

/* --------------------------------------------------------------------------
   3. CATALOGUE TOOLBAR + FILTERS
   -------------------------------------------------------------------------- */

.ds-catalog-head {
  padding-block: var(--ds-space-8) var(--ds-space-10);
}
.ds-catalog-head__title { margin-bottom: var(--ds-space-4); }
.ds-catalog-head .ds-lead { max-width: 46rem; }

.ds-catalog-layout {
  display: grid;
  grid-template-columns: 17rem minmax(0, 1fr);
  gap: var(--ds-space-10);
  align-items: start;
  padding-bottom: var(--ds-section-y);
}
@media (max-width: 1024px) {
  .ds-catalog-layout { grid-template-columns: 1fr; }
}

.ds-filters {
  position: sticky;
  top: 6.5rem;
  display: flex;
  flex-direction: column;
  gap: var(--ds-space-6);
}
@media (max-width: 1024px) {
  .ds-filters {
    position: static;
    display: none;
    padding: var(--ds-space-6);
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-xl);
  }
  .ds-filters.is-open { display: flex; }
}

.ds-filter-group {
  padding: var(--ds-space-6);
  background: var(--ds-surface);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-lg);
}
@media (max-width: 1024px) {
  .ds-filter-group { padding: 0; background: none; border: 0; }
}

.ds-filter-group h3 {
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-semibold);
  letter-spacing: var(--ds-tracking-label);
  text-transform: uppercase;
  color: var(--ds-text-muted);
  margin-bottom: var(--ds-space-4);
}

.ds-filter-list { list-style: none; display: flex; flex-direction: column; gap: 2px; }
.ds-filter-list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-space-2);
  padding: var(--ds-space-2) var(--ds-space-3);
  border-radius: var(--ds-radius-md);
  font-size: var(--ds-text-sm);
  color: var(--ds-text-secondary);
  transition: background-color var(--ds-duration-fast) var(--ds-ease-in-out),
              color var(--ds-duration-fast) var(--ds-ease-in-out);
}
.ds-filter-list a:hover { background: var(--ds-neutral-100); color: var(--ds-text-primary); }
.ds-filter-list .is-current a {
  background: var(--ds-action-subtle);
  color: var(--ds-primary-700);
  font-weight: var(--ds-weight-semibold);
}
.ds-filter-list .count {
  font-size: var(--ds-text-xs);
  color: var(--ds-text-muted);
  background: var(--ds-neutral-100);
  padding: 1px 8px;
  border-radius: var(--ds-radius-pill);
}

.ds-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-space-4);
  margin-bottom: var(--ds-space-8);
  padding: var(--ds-space-4) var(--ds-space-5);
  background: var(--ds-surface);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-lg);
}
.ds-toolbar__count { font-size: var(--ds-text-sm); color: var(--ds-text-secondary); }
.ds-toolbar__right { display: flex; align-items: center; gap: var(--ds-space-3); }

.ds-select {
  appearance: none;
  padding: var(--ds-space-2) var(--ds-space-9) var(--ds-space-2) var(--ds-space-4);
  border: 1px solid var(--ds-border-strong);
  border-radius: var(--ds-radius-pill);
  background-color: var(--ds-surface);
  background-image: 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='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.875rem center;
  padding-right: 2.5rem;
  font-size: var(--ds-text-sm);
  font-weight: var(--ds-weight-medium);
  cursor: pointer;
}
.ds-select:hover { border-color: var(--ds-border-brand); }

.ds-filter-toggle { display: none; }
@media (max-width: 1024px) { .ds-filter-toggle { display: inline-flex; } }

/* --------------------------------------------------------------------------
   4. SINGLE PRODUCT
   -------------------------------------------------------------------------- */

.ds-pdp {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: var(--ds-space-16);
  align-items: start;
  padding-block: var(--ds-space-8) var(--ds-section-y);
}
@media (max-width: 980px) {
  .ds-pdp { grid-template-columns: 1fr; gap: var(--ds-space-10); }
}

/* Gallery */
.ds-gallery { position: sticky; top: 6.5rem; display: flex; flex-direction: column; gap: var(--ds-space-4); }
@media (max-width: 980px) { .ds-gallery { position: static; } }

.ds-gallery__main {
  position: relative;
  border-radius: var(--ds-radius-2xl);
  overflow: hidden;
  background: linear-gradient(160deg, #FFFFFF 0%, #F1F5F9 100%);
  border: 1px solid var(--ds-border);
}
.ds-gallery__main .ds-img-wrap { aspect-ratio: 1; }

.ds-gallery__thumbs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--ds-space-3);
}
.ds-gallery__thumb {
  border-radius: var(--ds-radius-lg);
  overflow: hidden;
  border: 2px solid transparent;
  background: var(--ds-neutral-100);
  cursor: pointer;
  transition: border-color var(--ds-duration-fast) var(--ds-ease-in-out),
              transform var(--ds-duration-fast) var(--ds-ease-out);
}
.ds-gallery__thumb:hover { transform: translateY(-2px); }
.ds-gallery__thumb.is-active { border-color: var(--ds-primary-600); }
.ds-gallery__thumb .ds-img-wrap { aspect-ratio: 1; }

/* Summary column */
.ds-pdp__summary { display: flex; flex-direction: column; gap: var(--ds-space-5); }

.ds-pdp__cat {
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-semibold);
  letter-spacing: var(--ds-tracking-wide);
  text-transform: uppercase;
  color: var(--ds-text-brand);
}

.ds-pdp__title {
  font-family: var(--ds-font-display);
  font-size: var(--ds-text-3xl);
  font-weight: var(--ds-weight-black);
  letter-spacing: var(--ds-tracking-display);
  line-height: var(--ds-leading-tight);
  text-wrap: balance;
}

.ds-pdp__rating { display: flex; align-items: center; gap: var(--ds-space-3); font-size: var(--ds-text-sm); }
.ds-pdp__rating a { color: var(--ds-text-muted); }
.ds-pdp__rating a:hover { color: var(--ds-text-brand); }

.ds-pdp__excerpt {
  font-size: var(--ds-text-lg);
  line-height: var(--ds-leading-relaxed);
  color: var(--ds-text-secondary);
  text-wrap: pretty;
}

/* Pricing block */
.ds-pricebox {
  padding: var(--ds-space-6);
  background: linear-gradient(150deg, var(--ds-primary-50) 0%, #fff 60%);
  border: 1px solid var(--ds-primary-100);
  border-radius: var(--ds-radius-xl);
}
.ds-pricebox .ds-price .amount,
.ds-pricebox .ds-price ins .amount { font-size: var(--ds-text-3xl); }
.ds-pricebox__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ds-space-3);
  margin-top: var(--ds-space-4);
}

/* Benefits list */
.ds-benefits { list-style: none; display: flex; flex-direction: column; gap: var(--ds-space-3); }
.ds-benefits li {
  display: flex;
  align-items: flex-start;
  gap: var(--ds-space-3);
  font-size: var(--ds-text-sm);
  color: var(--ds-text-secondary);
}
.ds-benefits svg { flex-shrink: 0; margin-top: 2px; color: var(--ds-success-500); }

/* Add to cart */
.ds-pdp form.cart {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ds-space-3);
  align-items: stretch;
}
.ds-pdp .quantity { display: none; } /* sold_individually — a licence quantity picker only confuses */
.ds-pdp form.cart .single_add_to_cart_button { flex: 1; min-width: 12rem; }

/* Trust strip under the buy button */
.ds-pdp__trust {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: var(--ds-space-3);
  padding-top: var(--ds-space-5);
  border-top: 1px solid var(--ds-border);
}
.ds-pdp__trust-item {
  display: flex;
  align-items: center;
  gap: var(--ds-space-2);
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-medium);
  color: var(--ds-text-secondary);
}
.ds-pdp__trust-item svg { color: var(--ds-primary-600); flex-shrink: 0; }

/* Sticky add-to-cart bar */
.ds-sticky-atc {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: var(--ds-z-sticky-atc);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-space-5);
  padding: var(--ds-space-3) var(--ds-gutter);
  background: rgba(255,255,255,.94);
  backdrop-filter: saturate(180%) blur(18px);
  border-top: 1px solid var(--ds-border);
  box-shadow: 0 -8px 28px -12px rgba(16,24,40,.18);
  transform: translateY(110%);
  transition: transform var(--ds-duration-slow) var(--ds-ease-out);
}
.ds-sticky-atc.is-visible { transform: none; }
.ds-sticky-atc__info { display: flex; align-items: center; gap: var(--ds-space-4); min-width: 0; }
.ds-sticky-atc__thumb {
  width: 3rem; height: 3rem;
  border-radius: var(--ds-radius-md);
  overflow: hidden; flex-shrink: 0;
  background: var(--ds-neutral-100);
}
.ds-sticky-atc__title {
  font-weight: var(--ds-weight-semibold);
  font-size: var(--ds-text-sm);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ds-sticky-atc__right { display: flex; align-items: center; gap: var(--ds-space-4); }
@media (max-width: 640px) {
  .ds-sticky-atc__thumb, .ds-sticky-atc .ds-price del { display: none; }
  .ds-sticky-atc { padding-block: var(--ds-space-2); }
}

/* Tabs */
.ds-tabs { padding-block: var(--ds-section-y-tight); border-top: 1px solid var(--ds-border); }
.ds-tabs__nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ds-space-1);
  list-style: none;
  margin-bottom: var(--ds-space-10);
  padding: var(--ds-space-1);
  background: var(--ds-neutral-100);
  border-radius: var(--ds-radius-pill);
  width: fit-content;
  max-width: 100%;
}
.ds-tabs__nav li a {
  display: inline-flex;
  padding: var(--ds-space-3) var(--ds-space-6);
  border-radius: var(--ds-radius-pill);
  font-size: var(--ds-text-sm);
  font-weight: var(--ds-weight-semibold);
  color: var(--ds-text-secondary);
  transition: background-color var(--ds-duration-fast) var(--ds-ease-in-out),
              color var(--ds-duration-fast) var(--ds-ease-in-out),
              box-shadow var(--ds-duration-fast) var(--ds-ease-out);
}
.ds-tabs__nav li.active a {
  background: var(--ds-surface);
  color: var(--ds-text-primary);
  box-shadow: var(--ds-shadow-sm);
}
.ds-tabs__panel { max-width: var(--ds-container-prose); }
.ds-tabs__panel > h2:first-child { margin-bottom: var(--ds-space-5); }
.ds-tab-title { font-size: var(--ds-text-xl); letter-spacing: var(--ds-tracking-tight); }
.ds-tab-lead { font-size: var(--ds-text-base); color: var(--ds-text-secondary); line-height: var(--ds-leading-relaxed); }
.ds-tab-note {
  margin-top: var(--ds-space-5);
  padding: var(--ds-space-4) var(--ds-space-5);
  background: var(--ds-primary-50);
  border-left: 3px solid var(--ds-primary-600);
  border-radius: var(--ds-radius-md);
  font-size: var(--ds-text-sm);
  color: var(--ds-primary-900);
}

/* Long-form description */
.ds-tabs__panel h2 { font-family: var(--ds-font-display); font-size: var(--ds-text-2xl); letter-spacing: var(--ds-tracking-tight); margin-bottom: var(--ds-space-4); }
.ds-tabs__panel h3 { font-family: var(--ds-font-display); font-size: var(--ds-text-lg); margin: var(--ds-space-8) 0 var(--ds-space-3); }
.ds-tabs__panel p { color: var(--ds-text-secondary); line-height: var(--ds-leading-relaxed); margin-bottom: var(--ds-space-4); }
.ds-tabs__panel ul { list-style: none; display: flex; flex-direction: column; gap: var(--ds-space-3); margin-bottom: var(--ds-space-6); }
.ds-tabs__panel ul li {
  position: relative;
  padding-left: var(--ds-space-8);
  color: var(--ds-text-secondary);
  line-height: var(--ds-leading-normal);
}
.ds-tabs__panel ul li::before {
  content: "";
  position: absolute;
  left: 0; top: .5em;
  width: 1.125rem; height: 1.125rem;
  border-radius: 50%;
  background: var(--ds-success-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2316A34A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;
}
.ds-tabs__panel strong { color: var(--ds-text-primary); font-weight: var(--ds-weight-semibold); }

/* Spec list */
.ds-spec-list { display: flex; flex-direction: column; gap: 0; }
.ds-spec-row {
  display: grid;
  grid-template-columns: 12rem minmax(0,1fr);
  gap: var(--ds-space-4);
  padding: var(--ds-space-4) 0;
  border-bottom: 1px solid var(--ds-border);
}
.ds-spec-row dt { font-weight: var(--ds-weight-semibold); font-size: var(--ds-text-sm); }
.ds-spec-row dd { color: var(--ds-text-secondary); font-size: var(--ds-text-sm); margin: 0; }
@media (max-width: 560px) { .ds-spec-row { grid-template-columns: 1fr; gap: var(--ds-space-1); } }

/* Delivery steps */
.ds-delivery-steps { list-style: none; display: flex; flex-direction: column; gap: var(--ds-space-5); margin-top: var(--ds-space-8); }
.ds-delivery-step { display: flex; gap: var(--ds-space-5); }
.ds-delivery-step__icon {
  flex-shrink: 0;
  display: grid; place-items: center;
  width: 2.75rem; height: 2.75rem;
  border-radius: var(--ds-radius-md);
  background: var(--ds-gradient-brand);
  color: #fff;
  box-shadow: var(--ds-shadow-brand);
}
.ds-delivery-step__n {
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-semibold);
  letter-spacing: var(--ds-tracking-label);
  text-transform: uppercase;
  color: var(--ds-text-brand);
}
.ds-delivery-step h3 { font-size: var(--ds-text-base); margin: 2px 0 var(--ds-space-1); }
.ds-delivery-step p { font-size: var(--ds-text-sm); color: var(--ds-text-secondary); }

/* Related / upsells */
.ds-related { padding-block: var(--ds-section-y-tight); border-top: 1px solid var(--ds-border); }

/* --------------------------------------------------------------------------
   5. QUICK VIEW MODAL
   -------------------------------------------------------------------------- */

.ds-modal {
  position: fixed;
  inset: 0;
  z-index: var(--ds-z-modal);
  display: grid;
  place-items: center;
  padding: var(--ds-space-5);
  background: rgba(17,24,39,.55);
  backdrop-filter: blur(6px);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--ds-duration-base) var(--ds-ease-out), visibility var(--ds-duration-base);
}
.ds-modal.is-open { opacity: 1; visibility: visible; }

.ds-modal__panel {
  position: relative;
  width: min(58rem, 100%);
  max-height: 88vh;
  overflow-y: auto;
  background: var(--ds-surface);
  border-radius: var(--ds-radius-2xl);
  box-shadow: var(--ds-shadow-2xl);
  transform: translateY(18px) scale(.98);
  transition: transform var(--ds-duration-slow) var(--ds-ease-spring);
}
.ds-modal.is-open .ds-modal__panel { transform: none; }

.ds-modal__close {
  position: absolute;
  top: var(--ds-space-4);
  right: var(--ds-space-4);
  z-index: 2;
  display: grid; place-items: center;
  width: 2.5rem; height: 2.5rem;
  border-radius: var(--ds-radius-pill);
  background: var(--ds-surface);
  box-shadow: var(--ds-shadow-md);
  color: var(--ds-text-secondary);
}
.ds-modal__close:hover { color: var(--ds-text-primary); }

.ds-quickview { display: grid; grid-template-columns: 1fr 1fr; }
.ds-quickview__media { background: linear-gradient(160deg,#fff,#F1F5F9); }
.ds-quickview__body { padding: var(--ds-space-10) var(--ds-space-8); display: flex; flex-direction: column; gap: var(--ds-space-4); }
@media (max-width: 720px) {
  .ds-quickview { grid-template-columns: 1fr; }
  .ds-quickview__body { padding: var(--ds-space-6); }
}

/* --------------------------------------------------------------------------
   6. CART
   -------------------------------------------------------------------------- */

.ds-cart-layout {
  display: grid;
  grid-template-columns: minmax(0,1fr) 22rem;
  gap: var(--ds-space-10);
  align-items: start;
  padding-block: var(--ds-space-8) var(--ds-section-y);
}
@media (max-width: 940px) { .ds-cart-layout { grid-template-columns: 1fr; } }

.woocommerce-cart-form__cart-item {
  display: grid;
  grid-template-columns: 5rem minmax(0,1fr) auto;
  gap: var(--ds-space-5);
  align-items: center;
  padding: var(--ds-space-5);
  background: var(--ds-surface);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-lg);
  margin-bottom: var(--ds-space-4);
}

.ds-order-summary {
  position: sticky;
  top: 6.5rem;
  padding: var(--ds-space-6);
  background: var(--ds-surface);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-xl);
  box-shadow: var(--ds-shadow-md);
}
.ds-order-summary h2 { font-size: var(--ds-text-lg); margin-bottom: var(--ds-space-5); }
.ds-order-summary__row {
  display: flex;
  justify-content: space-between;
  gap: var(--ds-space-4);
  padding: var(--ds-space-3) 0;
  font-size: var(--ds-text-sm);
  color: var(--ds-text-secondary);
}
.ds-order-summary__row--total {
  padding-top: var(--ds-space-4);
  margin-top: var(--ds-space-2);
  border-top: 1px solid var(--ds-border);
  font-family: var(--ds-font-display);
  font-size: var(--ds-text-lg);
  font-weight: var(--ds-weight-bold);
  color: var(--ds-text-primary);
}

/* --------------------------------------------------------------------------
   7. CHECKOUT
   -------------------------------------------------------------------------- */

.ds-checkout-steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--ds-space-4);
  padding-block: var(--ds-space-8);
}
.ds-checkout-step {
  display: flex;
  align-items: center;
  gap: var(--ds-space-3);
  font-size: var(--ds-text-sm);
  font-weight: var(--ds-weight-medium);
  color: var(--ds-text-muted);
}
.ds-checkout-step__n {
  display: grid; place-items: center;
  width: 1.75rem; height: 1.75rem;
  border-radius: var(--ds-radius-pill);
  background: var(--ds-neutral-200);
  color: var(--ds-text-secondary);
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-bold);
}
.ds-checkout-step.is-active { color: var(--ds-text-primary); }
.ds-checkout-step.is-active .ds-checkout-step__n { background: var(--ds-primary-600); color: #fff; }
.ds-checkout-step.is-done .ds-checkout-step__n { background: var(--ds-success-500); color: #fff; }
.ds-checkout-steps__sep { width: 2.5rem; height: 1px; background: var(--ds-border-strong); }

.woocommerce-checkout .ds-checkout-layout {
  display: grid;
  grid-template-columns: minmax(0,1fr) 24rem;
  gap: var(--ds-space-10);
  align-items: start;
  padding-bottom: var(--ds-section-y);
}
@media (max-width: 980px) {
  .woocommerce-checkout .ds-checkout-layout { grid-template-columns: 1fr; }
}

/* Form fields */
.form-row { display: flex; flex-direction: column; gap: var(--ds-space-2); margin-bottom: var(--ds-space-4); }
.form-row label { font-size: var(--ds-text-sm); font-weight: var(--ds-weight-medium); }
.form-row .required { color: var(--ds-danger-500); text-decoration: none; }

.input-text,
.select2-container .select2-selection,
select, textarea {
  width: 100%;
  padding: 0.8125rem var(--ds-space-4);
  border: 1px solid var(--ds-border-strong);
  border-radius: var(--ds-radius-md);
  background: var(--ds-surface);
  font-size: var(--ds-text-sm);
  transition: border-color var(--ds-duration-fast) var(--ds-ease-in-out),
              box-shadow var(--ds-duration-fast) var(--ds-ease-out);
}
.input-text:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--ds-primary-600);
  box-shadow: 0 0 0 4px rgba(37,99,235,.12);
}

.form-row-first, .form-row-last { }
@media (min-width: 640px) {
  .woocommerce-billing-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 var(--ds-space-4);
  }
  .form-row-wide { grid-column: 1 / -1; }
}

.ds-field--hero .input-text { font-size: var(--ds-text-base); padding-block: 1rem; }
.form-row .description { font-size: var(--ds-text-xs); color: var(--ds-text-muted); }

/* Consent checkbox */
.ds-consent {
  flex-direction: row;
  align-items: flex-start;
  gap: var(--ds-space-3);
  padding: var(--ds-space-4);
  background: var(--ds-warning-50);
  border: 1px solid #FDE68A;
  border-radius: var(--ds-radius-md);
  margin-bottom: var(--ds-space-5);
}
.ds-consent label { font-size: var(--ds-text-xs); line-height: var(--ds-leading-normal); font-weight: var(--ds-weight-regular); }
.ds-consent input[type="checkbox"] { margin-top: 3px; width: 1rem; height: 1rem; accent-color: var(--ds-primary-600); flex-shrink: 0; }

#place_order {
  width: 100%;
  padding: 1.0625rem 2rem;
  border-radius: var(--ds-radius-pill);
  background: var(--ds-gradient-cta);
  color: #fff;
  font-weight: var(--ds-weight-bold);
  font-size: var(--ds-text-base);
  box-shadow: var(--ds-shadow-brand);
  transition: transform var(--ds-duration-fast) var(--ds-ease-out), box-shadow var(--ds-duration-base) var(--ds-ease-out);
}
#place_order:hover { transform: translateY(-2px); box-shadow: 0 22px 40px -14px rgba(37,99,235,.45); }

.ds-trust-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--ds-space-4);
  margin-top: var(--ds-space-5);
  padding-top: var(--ds-space-5);
  border-top: 1px solid var(--ds-border);
}
.ds-trust-strip__item {
  display: inline-flex;
  align-items: center;
  gap: var(--ds-space-2);
  font-size: var(--ds-text-xs);
  color: var(--ds-text-muted);
}
.ds-trust-strip__item svg { color: var(--ds-success-500); }

/* --------------------------------------------------------------------------
   8. MY ACCOUNT
   -------------------------------------------------------------------------- */

.ds-account-layout {
  display: grid;
  grid-template-columns: 16rem minmax(0,1fr);
  gap: var(--ds-space-10);
  align-items: start;
  padding-block: var(--ds-space-8) var(--ds-section-y);
}
@media (max-width: 880px) { .ds-account-layout { grid-template-columns: 1fr; } }

.woocommerce-MyAccount-navigation ul { list-style: none; display: flex; flex-direction: column; gap: 2px; }
.ds-account-nav__item a {
  display: flex;
  align-items: center;
  gap: var(--ds-space-3);
  padding: var(--ds-space-3) var(--ds-space-4);
  border-radius: var(--ds-radius-md);
  font-size: var(--ds-text-sm);
  font-weight: var(--ds-weight-medium);
  color: var(--ds-text-secondary);
  transition: background-color var(--ds-duration-fast) var(--ds-ease-in-out),
              color var(--ds-duration-fast) var(--ds-ease-in-out);
}
.ds-account-nav__item a:hover { background: var(--ds-neutral-100); color: var(--ds-text-primary); }
.ds-account-nav__item.is-active a {
  background: var(--ds-action-subtle);
  color: var(--ds-primary-700);
  font-weight: var(--ds-weight-semibold);
}

.ds-account-content {
  padding: var(--ds-space-8);
  background: var(--ds-surface);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-xl);
}

.woocommerce-orders-table,
.woocommerce-table--order-details,
.shop_table {
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-lg);
  overflow: hidden;
}
.shop_table th {
  text-align: left;
  padding: var(--ds-space-4);
  background: var(--ds-neutral-100);
  font-size: var(--ds-text-xs);
  font-weight: var(--ds-weight-semibold);
  letter-spacing: var(--ds-tracking-wide);
  text-transform: uppercase;
  color: var(--ds-text-secondary);
}
.shop_table td {
  padding: var(--ds-space-4);
  border-top: 1px solid var(--ds-border);
  font-size: var(--ds-text-sm);
}

/* --------------------------------------------------------------------------
   9. NOTICES
   -------------------------------------------------------------------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  display: flex;
  align-items: center;
  gap: var(--ds-space-3);
  padding: var(--ds-space-4) var(--ds-space-5);
  border-radius: var(--ds-radius-lg);
  font-size: var(--ds-text-sm);
  margin-bottom: var(--ds-space-5);
  list-style: none;
}
.woocommerce-message { background: var(--ds-success-50); color: var(--ds-success-700); border: 1px solid #BBF7D0; }
.woocommerce-info    { background: var(--ds-primary-50);  color: var(--ds-primary-900); border: 1px solid var(--ds-primary-100); }
.woocommerce-error   { background: var(--ds-danger-50);   color: var(--ds-danger-700);  border: 1px solid #FECACA; }
.woocommerce-message .button { margin-left: auto; }

/* --------------------------------------------------------------------------
   10. PAGINATION
   -------------------------------------------------------------------------- */

.woocommerce-pagination { margin-top: var(--ds-space-12); }
.woocommerce-pagination ul {
  display: flex;
  justify-content: center;
  gap: var(--ds-space-2);
  list-style: none;
}
.woocommerce-pagination a,
.woocommerce-pagination span {
  display: grid;
  place-items: center;
  min-width: 2.5rem;
  height: 2.5rem;
  padding-inline: var(--ds-space-3);
  border-radius: var(--ds-radius-md);
  background: var(--ds-surface);
  border: 1px solid var(--ds-border);
  font-size: var(--ds-text-sm);
  font-weight: var(--ds-weight-medium);
  transition: all var(--ds-duration-fast) var(--ds-ease-in-out);
}
.woocommerce-pagination a:hover { border-color: var(--ds-border-brand); color: var(--ds-text-brand); }
.woocommerce-pagination .current {
  background: var(--ds-primary-600);
  border-color: var(--ds-primary-600);
  color: #fff;
}

/* --------------------------------------------------------------------------
   11. EMPTY STATES
   -------------------------------------------------------------------------- */

.ds-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--ds-space-5);
  padding: var(--ds-space-16) var(--ds-space-6);
}
.ds-empty__art { width: min(22rem, 100%); }
.ds-empty h2 { font-family: var(--ds-font-display); font-size: var(--ds-text-2xl); }
.ds-empty p { color: var(--ds-text-secondary); max-width: 32rem; }