/* NatureTech cart — v2 (Sprint 5).
   Source: design/v2/cart/template.html style block.
   Removed body/global resets (handled by tokens.css/main.css). All
   classes are .nt-cart-* prefixed already, so no namespace renaming. */


/* ============================================
 NATURETECH CART PAGE STYLES
 Design tokens (must match site-wide palette):
 ============================================
 --nt-deep-purple    #2D1B4E
 --nt-deeper         #1E1236
 --nt-bright-purple  #6B3FA0
 --nt-forest         #2D6A4F
 --nt-deep-forest    #1E4D38
 --nt-gold           #E6B149
 --nt-deep-gold      #C4922A
 --nt-cream          #F7F3E9
 --nt-lavender       #F0EBF7
 --nt-canvas         #FAF9FC
 --nt-ink            #1A1628
============================================ */

a { color: inherit; }
img { display: block; max-width: 100%; }

.nt-cart-page { max-width: 1920px; margin: 0 auto; padding: 0 24px 80px; transition: opacity 0.18s ease; }
.nt-cart-page.is-loading { opacity: 0.6; pointer-events: none; }

/* ==== STEPPER ==== */
.nt-cart-stepper {
display: flex;
align-items: center;
justify-content: center;
gap: 16px;
padding: 28px 0 8px;
flex-wrap: wrap;
}
.nt-cart-stepper-step {
display: flex;
align-items: center;
gap: 10px;
font-size: 13px;
color: #999;
}
.nt-cart-stepper-num {
width: 26px;
height: 26px;
border-radius: 50%;
background: #F0EBF7;
color: #999;
display: flex;
align-items: center;
justify-content: center;
font-family: 'IBM Plex Mono', monospace;
font-size: 12px;
font-weight: 500;
flex-shrink: 0;
transition: all 0.2s;
}
.nt-cart-stepper-step.active .nt-cart-stepper-num {
background: #6B3FA0;
color: white;
}
.nt-cart-stepper-step.active { color: #1E1236; font-weight: 500; }
.nt-cart-stepper-step.complete .nt-cart-stepper-num {
background: #2D6A4F;
color: white;
}
.nt-cart-stepper-arrow {
color: #C5C0CC;
font-size: 16px;
user-select: none;
}

/* ==== HEADER ==== */
.nt-cart-header { text-align: center; padding: 28px 0 36px; }
.nt-cart-eyebrow {
font-family: 'IBM Plex Mono', monospace;
font-size: 10px;
letter-spacing: 0.22em;
color: #6B3FA0;
text-transform: uppercase;
margin-bottom: 10px;
}
.nt-cart-title {
font-family: 'IBM Plex Sans Hebrew', sans-serif;
font-size: 40px;
font-weight: 500;
color: #1E1236;
margin: 0 0 6px;
}
.nt-cart-subtitle { font-size: 15px; color: #555059; margin: 0; }

/* ==== TWO COLUMN LAYOUT ==== */
.nt-cart-layout {
display: grid;
grid-template-columns: 1.85fr 1fr;
gap: 32px;
align-items: start;
}

/* ==== PRODUCTS COLUMN ==== */
.nt-cart-products-panel {
background: white;
border-radius: 14px;
padding: 28px 32px;
border: 1px solid #F0EBF7;
}
.nt-cart-table-head {
display: grid;
grid-template-columns: 70px 1fr 100px 130px 100px 24px;
gap: 16px;
align-items: center;
padding: 0 0 14px;
border-bottom: 1.5px solid #F0EBF7;
font-family: 'IBM Plex Mono', monospace;
font-size: 10px;
letter-spacing: 0.14em;
color: #999;
text-transform: uppercase;
}
.nt-cart-table-head .label-product { grid-column: 1 / 3; }
.nt-cart-product-row {
display: grid;
grid-template-columns: 70px 1fr 100px 130px 100px 24px;
gap: 16px;
align-items: center;
padding: 22px 0;
border-bottom: 1px solid #F0EBF7;
}
.nt-cart-product-row:last-of-type { border-bottom: none; }
.nt-cart-product-image {
width: 70px;
height: 70px;
border-radius: 8px;
background: linear-gradient(135deg, #F7F3E9 0%, #F0EBF7 100%);
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.nt-cart-product-image img { width: 100%; height: 100%; object-fit: cover; }
.nt-cart-product-name {
font-family: 'IBM Plex Sans Hebrew', sans-serif;
font-size: 14px;
font-weight: 500;
color: #1E1236;
text-decoration: none;
display: block;
margin-bottom: 4px;
line-height: 1.4;
}
.nt-cart-product-name:hover { color: #6B3FA0; }
.nt-cart-product-meta { font-size: 12px; color: #777; }
.nt-cart-product-unit-price { font-size: 14px; color: #555059; }

.nt-qty-stepper {
display: inline-flex;
align-items: center;
border: 1.5px solid #D8D3C5;
border-radius: 999px;
overflow: hidden;
height: 36px;
}
.nt-qty-stepper button {
width: 32px;
height: 100%;
background: white;
border: none;
font-size: 16px;
cursor: pointer;
color: #1E1236;
font-family: inherit;
transition: background 0.15s;
}
.nt-qty-stepper button:hover { background: #F7F3E9; }
.nt-qty-stepper input {
width: 38px;
border: none;
text-align: center;
font-family: inherit;
font-size: 13px;
font-weight: 500;
color: #1E1236;
background: transparent;
}
.nt-qty-stepper input:focus { outline: none; }

.nt-cart-product-subtotal {
font-family: 'IBM Plex Sans Hebrew', sans-serif;
font-size: 16px;
font-weight: 500;
color: #1E1236;
}
.nt-cart-remove-btn {
background: transparent;
border: none;
color: #C5C0CC;
cursor: pointer;
padding: 4px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 6px;
transition: all 0.15s;
}
.nt-cart-remove-btn:hover { color: #C4922A; background: #F7F3E9; }

.nt-cart-continue-shopping {
display: inline-flex;
align-items: center;
gap: 6px;
margin-top: 20px;
font-size: 13px;
color: #6B3FA0;
text-decoration: none;
font-weight: 500;
}
.nt-cart-continue-shopping:hover { color: #2D1B4E; }

/* ==== SUMMARY SIDEBAR ==== */
.nt-cart-summary-panel {
background: white;
border-radius: 14px;
padding: 28px 28px 24px;
border: 1px solid #F0EBF7;
position: sticky;
top: 20px;
}
.nt-cart-summary-title {
font-family: 'IBM Plex Sans Hebrew', sans-serif;
font-size: 18px;
font-weight: 500;
color: #1E1236;
margin: 0 0 22px;
}

.nt-cart-shipping-section { margin-bottom: 22px; }
.nt-cart-shipping-label {
font-family: 'IBM Plex Mono', monospace;
font-size: 10px;
letter-spacing: 0.14em;
color: #6B3FA0;
margin-bottom: 12px;
text-transform: uppercase;
}
.nt-cart-shipping-options { display: flex; flex-direction: column; gap: 8px; }
.nt-cart-shipping-option {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 12px 14px;
border: 1.5px solid #F0EBF7;
border-radius: 10px;
cursor: pointer;
transition: all 0.15s;
background: white;
}
.nt-cart-shipping-option:hover { border-color: #C5C0CC; }
.nt-cart-shipping-option.selected {
border-color: #6B3FA0;
background: #FAF9FC;
}
.nt-cart-shipping-radio {
width: 18px;
height: 18px;
border-radius: 50%;
border: 1.5px solid #D8D3C5;
flex-shrink: 0;
margin-top: 2px;
position: relative;
background: white;
}
.nt-cart-shipping-option.selected .nt-cart-shipping-radio {
border-color: #6B3FA0;
}
.nt-cart-shipping-option.selected .nt-cart-shipping-radio::after {
content: '';
width: 9px;
height: 9px;
background: #6B3FA0;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.nt-cart-shipping-content { flex: 1; min-width: 0; }
.nt-cart-shipping-option-title {
font-size: 13px;
font-weight: 500;
color: #1E1236;
margin-bottom: 2px;
}
.nt-cart-shipping-option-sub {
font-size: 11px;
color: #777;
line-height: 1.4;
}
.nt-cart-shipping-option-price {
font-size: 13px;
font-weight: 500;
color: #1E1236;
flex-shrink: 0;
margin-top: 1px;
}
.nt-cart-shipping-option-price.free { color: #2D6A4F; }

.nt-cart-summary-rows { display: flex; flex-direction: column; gap: 10px; }
.nt-cart-summary-row {
display: flex;
justify-content: space-between;
align-items: baseline;
font-size: 14px;
color: #555059;
}
.nt-cart-summary-row.total {
padding-top: 14px;
border-top: 1px solid #F0EBF7;
margin-top: 6px;
}
.nt-cart-summary-row.total .label,
.nt-cart-summary-row.total .value {
font-family: 'IBM Plex Sans Hebrew', sans-serif;
font-size: 18px;
font-weight: 500;
color: #1E1236;
}
.nt-cart-summary-row .value.free { color: #2D6A4F; font-weight: 500; }
.nt-cart-summary-tax-note {
font-size: 11px;
color: #999;
text-align: left;
margin-top: 4px;
}

/* ==== COUPON ==== */
.nt-cart-coupon-section { margin-top: 18px; }
.nt-cart-coupon-trigger {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
background: transparent;
border: 1px dashed #D8D3C5;
border-radius: 10px;
padding: 12px 14px;
font-family: inherit;
font-size: 13px;
color: #6B3FA0;
cursor: pointer;
transition: all 0.15s;
}
.nt-cart-coupon-trigger:hover { border-color: #6B3FA0; background: #FAF9FC; }
.nt-cart-coupon-trigger .chevron { transition: transform 0.2s; }
.nt-cart-coupon-section.open .nt-cart-coupon-trigger .chevron { transform: rotate(180deg); }
.nt-cart-coupon-content {
display: none;
padding-top: 12px;
}
.nt-cart-coupon-section.open .nt-cart-coupon-content { display: block; }
.nt-cart-coupon-input-group { display: flex; gap: 6px; }
.nt-cart-coupon-input {
flex: 1;
padding: 10px 14px;
border: 1.5px solid #D8D3C5;
border-radius: 999px;
font-family: inherit;
font-size: 13px;
background: white;
}
.nt-cart-coupon-input:focus { outline: none; border-color: #6B3FA0; }
.nt-cart-coupon-apply {
padding: 10px 16px;
background: white;
border: 1.5px solid #1E1236;
border-radius: 999px;
font-family: inherit;
font-size: 13px;
font-weight: 500;
color: #1E1236;
cursor: pointer;
transition: all 0.15s;
}
.nt-cart-coupon-apply:hover { background: #1E1236; color: white; }

/* ==== CHECKOUT CTA ==== */
.nt-cart-checkout-cta {
display: block;
width: 100%;
background: #2D6A4F;
color: white;
border: none;
border-radius: 999px;
font-family: inherit;
font-size: 15px;
font-weight: 500;
padding: 16px 28px;
cursor: pointer;
margin-top: 20px;
transition: background 0.15s;
text-align: center;
text-decoration: none;
}
.nt-cart-checkout-cta:hover { background: #1E4D38; color: white; }

/* ==== TRUST STRIP ==== */
.nt-cart-trust-strip {
display: flex;
justify-content: center;
gap: 14px;
margin-top: 14px;
font-size: 11px;
color: #777;
}
.nt-cart-trust-strip-item { display: flex; align-items: center; gap: 4px; }
.nt-cart-trust-strip-item svg { color: #6B3FA0; }

/* ==== EMPTY STATE ==== */
.nt-cart-empty-state {
background: white;
border-radius: 14px;
padding: 80px 40px;
text-align: center;
border: 1px solid #F0EBF7;
max-width: 560px;
margin: 60px auto 0;
}
.nt-cart-empty-icon {
width: 88px;
height: 88px;
margin: 0 auto 24px;
background: #F0EBF7;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: #6B3FA0;
}
.nt-cart-empty-title {
font-family: 'IBM Plex Sans Hebrew', sans-serif;
font-size: 24px;
font-weight: 500;
color: #1E1236;
margin: 0 0 10px;
}
.nt-cart-empty-body { font-size: 14px; color: #555059; margin: 0 0 28px; }
.nt-cart-empty-cta {
display: inline-flex;
align-items: center;
gap: 6px;
background: #2D6A4F;
color: white;
border: none;
border-radius: 999px;
font-family: inherit;
font-size: 14px;
font-weight: 500;
padding: 12px 28px;
cursor: pointer;
text-decoration: none;
transition: background 0.15s;
}
.nt-cart-empty-cta:hover { background: #1E4D38; color: white; }

/* ==== RESPONSIVE ==== */
@media (max-width: 900px) {
.nt-cart-layout { grid-template-columns: 1fr; }
.nt-cart-summary-panel { position: static; }
.nt-cart-stepper-step .nt-cart-stepper-label { display: none; }
.nt-cart-stepper-step.active .nt-cart-stepper-label { display: inline; }
.nt-cart-title { font-size: 32px; }
.nt-cart-products-panel { padding: 22px 18px; }

.nt-cart-table-head { display: none; }
.nt-cart-product-row {
  grid-template-columns: 70px 1fr 24px;
  grid-template-rows: auto auto;
  gap: 12px;
  padding: 18px 0;
}
.nt-cart-product-row .nt-cart-product-image { grid-column: 1; grid-row: 1 / 3; align-self: center; }
.nt-cart-product-row .nt-cart-product-info { grid-column: 2; grid-row: 1; }
.nt-cart-product-row .nt-cart-remove-btn { grid-column: 3; grid-row: 1; align-self: start; }
.nt-cart-product-row .nt-cart-product-actions {
  grid-column: 2 / 4;
  grid-row: 2;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
}
@media (max-width: 600px) {
.nt-cart-page { padding: 0 14px 100px; }
.nt-cart-title { font-size: 26px; }
.nt-cart-stepper { gap: 8px; padding: 16px 0; }
.nt-cart-stepper-step { font-size: 12px; }
.nt-cart-checkout-cta { font-size: 14px; padding: 14px 24px; }
}
