/**
 * ANBOOST Storefront — Final Art Direction Pass
 * Same architecture. Higher craft. Soft, expensive, breathable.
 * Merchant brand colors preserved via CSS variables.
 */

/* ------------------------------------------------------------------
   Elevated token rhythm (extend, do not fight brand)
   ------------------------------------------------------------------ */
:root {
  --sf-space-9: 2.5rem;
  --sf-space-10: 3rem;
  --sf-space-12: 4rem;
  --sf-space-16: 5.5rem;

  --sf-radius-xl: 1rem;

  --sf-shadow-soft: 0 2px 8px rgba(15, 23, 42, 0.04), 0 12px 28px rgba(15, 23, 42, 0.06);
  --sf-shadow-lift: 0 4px 14px rgba(15, 23, 42, 0.05), 0 18px 40px rgba(15, 23, 42, 0.08);
  --sf-shadow-float: 0 10px 40px rgba(15, 23, 42, 0.12);

  /* Readable muted — do not wash toward white (overridden again by premium-polish last) */
  --sf-muted: #526277;
  --sf-placeholder: #526277;
  --sf-hairline: rgba(15, 23, 42, 0.09);

  --sf-title-tracking: -0.025em;
  --sf-price-size: 1.125rem;
  --sf-price-size-lg: 1.5rem;
}

/* ------------------------------------------------------------------
   Page air — sections must breathe
   ------------------------------------------------------------------ */
.padding-top-100 {
  padding-top: clamp(3.5rem, 6vw, 5.5rem) !important;
}

.padding-bottom-100 {
  padding-bottom: clamp(3.5rem, 6vw, 5.5rem) !important;
}

.padding-top-70 {
  padding-top: clamp(2.5rem, 4.5vw, 4rem) !important;
}

.padding-bottom-70 {
  padding-bottom: clamp(2.5rem, 4.5vw, 4rem) !important;
}

.padding-top-50 {
  padding-top: clamp(2rem, 3.5vw, 3rem) !important;
}

.padding-bottom-50 {
  padding-bottom: clamp(2rem, 3.5vw, 3rem) !important;
}

/* Phase 1: global .section-title / .section-para removed — theme owns homepage section titles.
   Phase 4.1: Related Products visuals moved to theme CSS (hexfashion pilot: related-products.css). */

/* Phase 0: global product-card / flex-card rules removed (theme + .shop-area/plp-shelf own cards). */

/* ------------------------------------------------------------------
   Buttons — primary feels decisive; outline stays quiet
   ------------------------------------------------------------------ */
.cmn-btn,
a.cmn-btn,
button.cmn-btn {
  padding: 0.8rem 1.6rem !important;
  letter-spacing: 0.03em !important;
  font-weight: 650 !important;
  border-radius: var(--sf-radius-md) !important;
}

.cmn-btn-bg-1,
.cmn-btn.btn-bg-1,
.btn-wrapper .cmn-btn-bg-1,
.cmn-btn-bg-heading {
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12) inset, var(--sf-shadow-sm);
}

.cmn-btn-bg-1:hover,
.cmn-btn.btn-bg-1:hover,
.btn-wrapper .cmn-btn-bg-1:hover {
  box-shadow: var(--sf-shadow-md);
}

.cmn-btn-outline-one,
.cmn-btn.btn-outline-one,
.btn-wrapper .cmn-btn-outline-one {
  border-width: 1px !important;
  font-weight: 600 !important;
  background: transparent;
}

.cmn-btn-small,
.cmn-btn.cmn-btn-small {
  min-height: 2.35rem;
  padding: 0.55rem 1.1rem !important;
  font-size: 0.875rem;
  letter-spacing: 0.02em !important;
}

/* ------------------------------------------------------------------
   PDP — calm buy block, obvious next step
   ------------------------------------------------------------------ */
.shop-details-contents .title,
.shop-details-contents h2.title,
.shop-details-wrapper .title {
  font-size: clamp(1.5rem, 2.4vw, 2rem) !important;
  font-weight: 650 !important;
  letter-spacing: var(--sf-title-tracking);
  line-height: 1.2 !important;
  margin-bottom: var(--sf-space-3) !important;
}

.shop-details-contents .price-update-through,
.shop-details-contents .price-wrap {
  margin-block: var(--sf-space-5) !important;
  padding-block: var(--sf-space-3);
  border-block: 1px solid var(--sf-hairline);
}

.shop-details-contents .flash-prices,
.shop-details-contents .price-title {
  font-size: var(--sf-price-size-lg) !important;
  font-weight: 700 !important;
}

.shop-details-contents .value-input-area {
  margin-block: var(--sf-space-5) !important;
}

.shop-details-contents .value-input-area + .value-input-area {
  margin-top: var(--sf-space-4) !important;
}

.shop-details-contents .btn-wrapper,
.shop-details-cart-btn,
.details-btn-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sf-space-3);
  margin-top: var(--sf-space-6);
}

.shop-details-contents .add_to_cart_single_page,
.shop-details-contents .but_now_single_page {
  min-width: min(100%, 11rem);
}

.shop-details-stock,
.stock-notifications {
  font-size: 0.9rem;
  color: var(--sf-muted);
  margin-top: var(--sf-space-4) !important;
}

.shop-details-tabs,
.details-tab-nav,
.product-details-tab {
  margin-top: var(--sf-space-10);
}

.shop-details-tabs .tabs li,
.details-tabs li,
[data-tab] {
  letter-spacing: 0.02em;
}

/* Gallery: quiet frame */
.shop-details-thums,
.shop-details-thumb {
  border-radius: var(--sf-radius-xl);
  overflow: hidden;
  background-color: var(--sf-surface-muted);
}

.shop-details-bottom-slider-area {
  margin-top: var(--sf-space-5) !important;
  gap: var(--sf-space-3);
}

.shop-details-bottom-slider-area .small-img {
  border: 1px solid var(--sf-hairline);
  transition: border-color var(--sf-duration) var(--sf-ease), box-shadow var(--sf-duration) var(--sf-ease) !important;
}

.shop-details-bottom-slider-area .slick-current .small-img,
.shop-details-bottom-slider-area .small-img.slick-current {
  border-color: var(--sf-heading);
  box-shadow: none !important;
}

/* ------------------------------------------------------------------
   Shop listing — filters + toolbar
   ------------------------------------------------------------------ */
.shop-area .row,
.shop-contents .row {
  --bs-gutter-y: 1.75rem;
}

.shop-sidebar .single-sidebar-item,
.shop-sidebar-content .widget,
.single-sidebar-item {
  margin-bottom: var(--sf-space-6) !important;
  padding-bottom: var(--sf-space-5) !important;
  border-bottom-color: var(--sf-hairline) !important;
}

.shop-sidebar .title,
.single-sidebar-item .title,
.widget .widget-title {
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
  margin-bottom: var(--sf-space-4) !important;
  color: var(--sf-heading);
}

.shop-filters-top,
.shop-top-bar,
.product-showing-filter {
  padding-bottom: var(--sf-space-4);
  margin-bottom: var(--sf-space-5) !important;
  border-bottom: 1px solid var(--sf-hairline);
}

/* Breadcrumbs: whisper, don't shout */
.breadcrumb-area,
.breadcrumb-wrap,
.page-breadcrumb {
  font-size: 0.8125rem;
  color: var(--sf-muted);
  letter-spacing: 0.01em;
}

.breadcrumb-area .page-title,
.breadcrumb-wrap .page-title,
.breadcrumb-contents .title {
  letter-spacing: var(--sf-title-tracking);
  font-weight: 650;
}

/* ------------------------------------------------------------------
   Cart / wishlist / checkout — calm density
   ------------------------------------------------------------------ */
.cart-area table,
.wishlist-area table,
.checkout-area table {
  border-collapse: separate;
  border-spacing: 0;
}

.cart-area table thead th,
.wishlist-area table thead th,
.compare-area table thead th {
  font-size: 0.72rem !important;
  letter-spacing: 0.08em !important;
  padding-block: 1rem !important;
  border-bottom: 1px solid var(--sf-hairline) !important;
  background: transparent !important;
  color: var(--sf-muted) !important;
}

.cart-area table tbody td,
.wishlist-area table tbody td {
  padding-block: 1.35rem !important;
  border-bottom: 1px solid var(--sf-hairline) !important;
  vertical-align: middle;
}

.cart-total-contents,
.checkout-order-summery,
.order-summery-contents,
.coupon-contents {
  border: 1px solid var(--sf-hairline) !important;
  border-radius: var(--sf-radius-xl) !important;
  padding: var(--sf-space-6) !important;
  background: var(--sf-surface);
  box-shadow: none !important;
}

.checkout-order-summery .summery-title,
.cart-total-contents .title,
.order-summery-contents .summery-title {
  font-size: 1.05rem !important;
  font-weight: 650 !important;
  letter-spacing: -0.015em;
  padding-bottom: var(--sf-space-4);
  margin-bottom: var(--sf-space-4);
  border-bottom: 1px solid var(--sf-hairline);
}

.single-checkout-cart-items,
.single-check-carts {
  padding-block: var(--sf-space-3);
}

.checkout-cart-title,
.checkout-cart-title span {
  font-weight: 600 !important;
  letter-spacing: -0.01em;
}

.checkout-cart-thumb img {
  border-radius: var(--sf-radius-md);
}

.proceed_checkout_btn,
.checkout_disable.proceed_checkout_btn {
  margin-top: var(--sf-space-5);
  min-height: 3.15rem !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.04em !important;
}

.terms-condition {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ------------------------------------------------------------------
   Mini-cart dropdown — boutique, not popover clutter
   ------------------------------------------------------------------ */
.cart-shopping .addto-cart-contents {
  padding: var(--sf-space-5) !important;
  border-radius: var(--sf-radius-xl) !important;
  border-color: var(--sf-hairline) !important;
  box-shadow: var(--sf-shadow-float) !important;
  min-width: min(22rem, calc(100vw - 2rem));
}

.cart-shopping .single-addto-carts {
  padding: var(--sf-space-4) 0 !important;
  border-bottom-color: var(--sf-hairline) !important;
}

.cart-shopping .cart-total-amount {
  margin-top: var(--sf-space-4);
  padding-top: var(--sf-space-4);
  border-top: 1px solid var(--sf-hairline);
}

.cart-shopping .btn-wrapper {
  margin-top: var(--sf-space-3) !important;
}

.cart-shopping .btn-wrapper .cmn-btn {
  width: 100%;
}

/* ------------------------------------------------------------------
   Forms — quieter borders, taller controls
   ------------------------------------------------------------------ */
.form--control,
.form-control,
.single-input .form--control {
  min-height: 3rem;
  padding-inline: 1rem !important;
  border-color: var(--sf-hairline) !important;
  border-radius: var(--sf-radius-md) !important;
  background: var(--sf-surface);
}

.form--control:hover,
.form-control:hover {
  border-color: var(--sf-border-strong) !important;
}

.form--control:focus,
.form-control:focus {
  border-color: var(--sf-action) !important;
  box-shadow: var(--sf-focus-ring) !important;
}

.single-input label,
.form-group label {
  font-size: 0.8125rem;
  letter-spacing: 0.02em;
  font-weight: 600 !important;
  margin-bottom: 0.45rem !important;
}

/* ------------------------------------------------------------------
   Header / nav icons — less visual noise
   ------------------------------------------------------------------ */
.nav-right-content .icon,
.track-icon-list .single-icon .icon,
.cart-shopping > .icon {
  transition: color var(--sf-duration) var(--sf-ease), opacity var(--sf-duration) var(--sf-ease);
}

.nav-right-content .icon:hover,
.track-icon-list .single-icon .icon:hover,
.cart-shopping > .icon:hover {
  color: var(--sf-action);
}

.icon-notification {
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  min-width: 1.15rem;
  letter-spacing: 0;
}

/* ------------------------------------------------------------------
   Empty states — serene, not apologetic
   ------------------------------------------------------------------ */
.cart-empty-area,
.wishlist-empty-area,
.error-page-content .single-page-contents {
  text-align: center;
  padding-block: var(--sf-space-10);
}

.cart-empty-area .single-page-contents-title,
.single-page-contents-title {
  font-size: clamp(1.35rem, 2vw, 1.75rem) !important;
  font-weight: 650 !important;
  letter-spacing: var(--sf-title-tracking);
  margin-bottom: var(--sf-space-3) !important;
}

.cart-empty-area p,
.single-page-contents p {
  color: var(--sf-muted);
  margin-bottom: var(--sf-space-6);
}

/* ------------------------------------------------------------------
   QV modal — product focus, less chrome
   ------------------------------------------------------------------ */
#product_quick_view .modal-content,
.product-quick-view-modal .modal-content,
.quick-view-modal .modal-content {
  border: 0 !important;
  border-radius: var(--sf-radius-xl) !important;
  box-shadow: var(--sf-shadow-float) !important;
  overflow: hidden;
}

#product_quick_view .shop-details-contents,
.product-quick-view .shop-details-contents {
  padding: var(--sf-space-6) !important;
}

/* ------------------------------------------------------------------
   Sale / discount badges — retail refined, not alert red
   ------------------------------------------------------------------ */
.discount-percent,
.sale-badge,
.discount-badge {
  background-color: color-mix(in srgb, var(--sf-heading) 92%, #fff) !important;
  color: #fff !important;
  border: 0 !important;
  font-size: 0.6875rem !important;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Phase 1: global footer typography/spacing removed — theme / footer-style.css own footer. */

/* ------------------------------------------------------------------
   Payment success / account — post-purchase calm
   ------------------------------------------------------------------ */
.order-success-area {
  padding-block: var(--sf-space-8);
}

.order-success-area .title {
  letter-spacing: var(--sf-title-tracking);
}

.billing-items {
  border-color: var(--sf-hairline) !important;
  border-radius: var(--sf-radius-xl) !important;
  padding: var(--sf-space-6) !important;
  box-shadow: none !important;
}

/* ------------------------------------------------------------------
   Mobile — keep generosity without waste
   ------------------------------------------------------------------ */
@media (max-width: 767.98px) {
  .shop-details-contents .btn-wrapper,
  .details-btn-wrapper {
    flex-direction: column;
  }

  .shop-details-contents .add_to_cart_single_page,
  .shop-details-contents .but_now_single_page,
  .shop-details-contents .cmn-btn {
    width: 100%;
  }

  .cart-shopping .addto-cart-contents {
    min-width: min(20rem, calc(100vw - 1.5rem));
  }
}

@media (prefers-reduced-motion: reduce) {
  /* Phase 0: card motion overrides removed */
}