/* Shopping cart page */
.cart-page-body {
  background: #f7faf3;
}

.cart-page-main {
  position: relative;
  overflow: hidden;
  min-height: 760px;
  padding: 24px 0 76px;
  background:
    linear-gradient(rgba(255, 255, 255, 0.93), rgba(249, 252, 245, 0.95)),
    url('../images/product page.png') center top / cover fixed;
}

.cart-page-main::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 105px;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(187, 220, 116, 0.26));
}

.cart-shell { position: relative; z-index: 1; }

.cart-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  color: #718073;
  font-size: 0.8rem;
}

.cart-breadcrumb a { color: #237139; font-weight: 700; }
.cart-breadcrumb i { font-size: 0.58rem; }

.cart-page-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
}

.cart-title-group { display: flex; align-items: center; gap: 16px; }
.cart-title-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid #dce8d7;
  border-radius: 50%;
  color: #2b803d;
  background: rgba(255, 255, 255, 0.92);
  font-size: 1.2rem;
}

.cart-page-heading h1 {
  margin: 0 0 4px;
  color: #17251a;
  font-family: 'Outfit', sans-serif;
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  font-weight: 800;
}

.cart-page-heading p { margin: 0; color: #68736a; font-size: 0.88rem; }
.cart-secure-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border: 1px solid #dce9d8;
  border-radius: 8px;
  color: #347642;
  background: #f5faef;
  font-size: 0.72rem;
  font-weight: 700;
}

.cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 22px;
  align-items: start;
}

.cart-items-card,
.cart-summary-card,
.cart-benefits,
.cart-recommendations {
  border: 1px solid #dfe8dc;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 34px rgba(36, 79, 40, 0.08);
}

.cart-table-head,
.cart-item {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) 120px 140px 54px;
  gap: 14px;
  align-items: center;
}

.cart-table-head {
  padding: 15px 20px;
  border-bottom: 1px solid #e5ece2;
  color: #5f6c61;
  background: linear-gradient(180deg, #fbfdf8, #f4f8ef);
  font-size: 0.7rem;
  font-weight: 800;
}

.cart-item { padding: 18px 20px; border-bottom: 1px solid #ebf0e8; }
.cart-item:last-child { border-bottom: 0; }

.cart-product { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 14px; align-items: center; min-width: 0; }
.cart-product-image {
  width: 78px;
  height: 92px;
  display: grid;
  place-items: center;
  border: 1px solid #e3ebe0;
  border-radius: 10px;
  background: linear-gradient(145deg, #f5faef, #fff);
}
.cart-product-image img { width: 64px; height: 82px; object-fit: contain; }
.cart-product-copy { min-width: 0; }
.cart-product-copy h3 { margin: 0 0 5px; color: #203025; font-size: 1rem; }
.cart-product-copy p { margin: 0 0 7px; color: #78827a; font-size: 0.72rem; line-height: 1.4; }
.cart-product-copy small { color: #398047; font-size: 0.67rem; font-weight: 700; }

.cart-size-select {
  width: 100%;
  min-height: 40px;
  padding: 0 30px 0 10px;
  border: 1px solid #dce6d9;
  border-radius: 7px;
  color: #344137;
  background: #fff;
  font-size: 0.76rem;
  font-weight: 700;
}

.cart-quantity-controls {
  display: grid;
  grid-template-columns: 36px 48px 36px;
  overflow: hidden;
  width: max-content;
  border: 1px solid #dce6d9;
  border-radius: 7px;
}
.cart-quantity-controls button,
.cart-quantity-controls input {
  height: 38px;
  min-width: 0;
  border: 0;
  color: #2b783a;
  background: #fff;
  text-align: center;
  font-weight: 800;
}
.cart-quantity-controls button { cursor: pointer; font-size: 1rem; }
.cart-quantity-controls button:hover { background: #edf7e8; }
.cart-quantity-controls input { border-inline: 1px solid #e4ebe1; color: #26352a; appearance: textfield; }
.cart-quantity-controls input::-webkit-inner-spin-button,
.cart-quantity-controls input::-webkit-outer-spin-button { appearance: none; margin: 0; }

.cart-remove {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid #dfe8dc;
  border-radius: 7px;
  color: #478052;
  background: #fff;
  cursor: pointer;
}
.cart-remove:hover { color: #fff; border-color: #b43c3c; background: #b43c3c; }

.cart-empty { padding: 58px 22px; text-align: center; }
.cart-empty i { color: #70a85c; font-size: 2.2rem; }
.cart-empty h2 { margin: 14px 0 7px; color: #25332a; }
.cart-empty p { margin: 0 0 18px; color: #758077; }

.cart-summary-card { padding: 22px; }
.cart-summary-card h2 {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 20px;
  color: #26372a;
  font-size: 1.12rem;
}
.cart-summary-card h2 i { color: #3b8b49; }
.cart-summary-list { display: grid; gap: 13px; margin-bottom: 20px; }
.cart-summary-row { display: flex; justify-content: space-between; gap: 16px; color: #677269; font-size: 0.8rem; }
.cart-summary-row strong { color: #27452e; }
.cart-summary-message {
  margin: 0 0 18px;
  padding: 13px;
  border: 1px solid #e0eadc;
  border-radius: 9px;
  color: #4e6253;
  background: #f8fbf5;
  font-size: 0.74rem;
  line-height: 1.5;
}
.cart-checkout,
.cart-continue,
.cart-empty a {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 800;
}
.cart-checkout { color: #fff; background: linear-gradient(135deg, #2c873b, #166a29); }
.cart-checkout:hover { color: #fff; }
.cart-continue { margin-top: 10px; border: 1px solid #3d8e4c; color: #286f36; background: #fff; }
.cart-empty a { width: max-content; margin: auto; padding: 0 20px; color: #fff; background: #287e38; }

.cart-support-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
  padding: 13px;
  border: 1px solid #dfe8dc;
  border-radius: 12px;
  color: #4f6554;
  background: rgba(255, 255, 255, 0.92);
  font-size: 0.64rem;
}
.cart-support-strip span { display: flex; align-items: center; gap: 7px; }
.cart-support-strip i { color: #3d8b4a; }

.cart-benefits {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 2px;
  padding: 17px 20px;
}
.cart-benefit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  padding: 0 18px;
  border-right: 1px solid #e4ebe1;
}
.cart-benefit:last-child { border-right: 0; }
.cart-benefit i { color: #368546; font-size: 1.1rem; }
.cart-benefit strong,
.cart-benefit small { display: block; }
.cart-benefit strong { color: #344238; font-size: 0.73rem; }
.cart-benefit small { margin-top: 2px; color: #7a847c; font-size: 0.61rem; }

.cart-recommendations { grid-column: 1 / -1; padding: 20px; }
.cart-recommendation-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 15px; }
.cart-recommendation-heading h2 { margin: 0; color: #28372c; font-size: 1.05rem; }
.cart-recommendation-heading a { color: #2e7b3c; font-size: 0.72rem; font-weight: 800; }
.cart-recommendation-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.cart-recommendation-card { padding: 12px; border: 1px solid #e2eae0; border-radius: 10px; background: #fff; }
.cart-recommendation-card img { width: 100%; height: 125px; object-fit: contain; }
.cart-recommendation-card small { color: #5c9661; font-size: 0.58rem; font-weight: 800; text-transform: uppercase; }
.cart-recommendation-card h3 { margin: 5px 0 4px; color: #28342b; font-size: 0.82rem; }
.cart-recommendation-card p { margin: 0 0 9px; color: #747e75; font-size: 0.64rem; }
.cart-recommendation-card a { color: #2d7f3d; font-size: 0.67rem; font-weight: 800; }

@media (max-width: 960px) {
  .cart-layout { grid-template-columns: 1fr; }
  .cart-summary-column { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .cart-support-strip { margin-top: 0; align-content: center; }
}

@media (max-width: 760px) {
  .cart-page-heading { align-items: flex-start; flex-direction: column; }
  .cart-table-head { display: none; }
  .cart-item { grid-template-columns: 1fr 1fr auto; }
  .cart-product { grid-column: 1 / -1; }
  .cart-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 0; }
  .cart-benefit:nth-child(2) { border-right: 0; }
  .cart-recommendation-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
  .cart-page-main { padding-top: 18px; }
  .cart-title-icon { width: 46px; height: 46px; }
  .cart-item { grid-template-columns: 1fr; gap: 12px; padding: 16px; }
  .cart-product { grid-column: auto; grid-template-columns: 68px minmax(0, 1fr); }
  .cart-product-image { width: 68px; height: 82px; }
  .cart-product-image img { width: 56px; height: 72px; }
  .cart-size-select { max-width: 180px; }
  .cart-summary-column { grid-template-columns: 1fr; }
  .cart-benefits { grid-template-columns: 1fr; }
  .cart-benefit { justify-content: flex-start; border-right: 0; }
  .cart-recommendation-grid { grid-template-columns: 1fr; }
}

/* Enlarged cart content */
.cart-layout { grid-template-columns: minmax(0, 1fr) 360px; gap: 26px; }
.cart-page-heading { margin-bottom: 28px; }
.cart-title-icon { width: 62px; height: 62px; font-size: 1.45rem; }
.cart-page-heading h1 { font-size: clamp(2.15rem, 3.4vw, 3rem); }
.cart-page-heading p { font-size: 1rem; }
.cart-secure-note { padding: 12px 16px; font-size: 0.85rem; }
.cart-table-head,
.cart-item { grid-template-columns: minmax(0, 1.8fr) 140px 150px 60px; gap: 18px; }
.cart-table-head { padding: 18px 24px; font-size: 0.84rem; }
.cart-item { padding: 22px 24px; }
.cart-product { grid-template-columns: 92px minmax(0, 1fr); gap: 18px; }
.cart-product-image { width: 92px; height: 108px; }
.cart-product-image img { width: 76px; height: 96px; }
.cart-product-copy h3 { margin-bottom: 7px; font-size: 1.18rem; }
.cart-product-copy p { margin-bottom: 9px; font-size: 0.86rem; }
.cart-product-copy small { font-size: 0.78rem; }
.cart-size-select { min-height: 46px; padding-left: 13px; font-size: 0.9rem; }
.cart-quantity-controls { grid-template-columns: 42px 56px 42px; }
.cart-quantity-controls button,
.cart-quantity-controls input { height: 44px; font-size: 0.95rem; }
.cart-remove { width: 44px; height: 44px; font-size: 0.95rem; }
.cart-summary-card { padding: 27px; }
.cart-summary-card h2 { margin-bottom: 24px; font-size: 1.36rem; }
.cart-summary-list { gap: 16px; margin-bottom: 23px; }
.cart-summary-row { font-size: 0.96rem; }
.cart-summary-message { padding: 16px; font-size: 0.9rem; }
.cart-checkout,
.cart-continue,
.cart-empty a { min-height: 52px; font-size: 0.95rem; }
.cart-support-strip { padding: 16px; font-size: 0.76rem; }
.cart-benefits { padding: 22px 24px; }
.cart-benefit { gap: 14px; }
.cart-benefit i { font-size: 1.3rem; }
.cart-benefit strong { font-size: 0.88rem; }
.cart-benefit small { font-size: 0.72rem; }
.cart-recommendations { padding: 26px; }
.cart-recommendation-heading { margin-bottom: 20px; }
.cart-recommendation-heading h2 { font-size: 1.32rem; }
.cart-recommendation-heading a { font-size: 0.86rem; }
.cart-recommendation-grid { gap: 18px; }
.cart-recommendation-card { padding: 16px; }
.cart-recommendation-card img { height: 155px; }
.cart-recommendation-card small { font-size: 0.7rem; }
.cart-recommendation-card h3 { margin: 7px 0 6px; font-size: 1rem; }
.cart-recommendation-card p { margin-bottom: 12px; font-size: 0.8rem; }
.cart-recommendation-card a { font-size: 0.82rem; }
@media (max-width: 960px) {
  .cart-layout { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .cart-item { grid-template-columns: 1fr 1fr auto; }
  .cart-product { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
  .cart-page-heading h1 { font-size: 2rem; }
  .cart-page-heading p { font-size: 0.9rem; }
  .cart-secure-note { font-size: 0.78rem; }
  .cart-item { grid-template-columns: 1fr; padding: 18px; }
  .cart-product { grid-column: auto; grid-template-columns: 78px minmax(0, 1fr); gap: 14px; }
  .cart-product-image { width: 78px; height: 92px; }
  .cart-product-image img { width: 64px; height: 80px; }
  .cart-product-copy h3 { font-size: 1.02rem; }
  .cart-product-copy p { font-size: 0.78rem; }
  .cart-summary-card,
  .cart-recommendations { padding: 20px; }
}