/* OKB cart UX layer */
:root {
  --okb-cart-brown: #6E5437;
  --okb-cart-brown-dark: #5A4630;
  --okb-cart-camel: #D2B48C;
  --okb-cart-beige: #F2EBD7;
  --okb-cart-cream: #FAF7F1;
  --okb-cart-black: #1C1C1E;
  --okb-cart-gray: #8E857A;
  --okb-cart-pink: #E9B5C4;
  --okb-cart-border: #E1D5C7;
  --okb-cart-surface: #FFFDF9;
}

.okb-cart-page {
  width: min(100%, 1180px);
  margin-inline: auto;
  background:
    radial-gradient(circle at 10% 2%, rgba(233, 181, 196, .18), transparent 22rem),
    radial-gradient(circle at 92% 4%, rgba(210, 180, 140, .24), transparent 26rem),
    linear-gradient(180deg, var(--okb-cart-cream) 0%, #FFFDF9 100%) !important;
  color: var(--okb-cart-black) !important;
  border-radius: 0 0 28px 28px;
}

.okb-cart-page * {
  letter-spacing: normal;
}

.okb-cart-top {
  align-items: center;
  border: 1px solid rgba(225, 213, 199, .88);
  border-radius: 999px;
  background: rgba(255, 253, 249, .82);
  box-shadow: 0 14px 34px rgba(62, 45, 29, .05);
  padding: .6rem .75rem;
}

.okb-cart-steps {
  display: flex;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: .05rem;
  scrollbar-width: none;
}

.okb-cart-steps::-webkit-scrollbar {
  display: none;
}

.okb-cart-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(225, 213, 199, .9);
  border-radius: 1.35rem;
  background:
    linear-gradient(135deg, rgba(255, 253, 249, .98), rgba(242, 235, 215, .76)),
    radial-gradient(circle at 100% 0%, rgba(233, 181, 196, .25), transparent 18rem);
  box-shadow: 0 22px 58px rgba(62, 45, 29, .08);
  padding: clamp(1.15rem, 3vw, 2rem);
}

.okb-cart-hero::after {
  content: "";
  position: absolute;
  inset: auto -4rem -8rem auto;
  width: 18rem;
  height: 18rem;
  border-radius: 999px;
  background: rgba(210, 180, 140, .18);
  pointer-events: none;
}

.okb-cart-hero h1,
.okb-cart-page .okb-cart-title {
  color: var(--okb-cart-black) !important;
  font-family: "Playfair Display", serif !important;
}

.okb-cart-layout {
  align-items: start;
}

.okb-cart-products,
.okb-cart-recommendations,
.okb-cart-summary-box {
  border: 1px solid rgba(225, 213, 199, .9);
  border-radius: 1.25rem;
  background: rgba(255, 253, 249, .86);
  box-shadow: 0 18px 46px rgba(62, 45, 29, .06);
}

.okb-cart-products {
  padding: clamp(1rem, 2vw, 1.35rem);
}

.okb-cart-recommendations {
  padding: clamp(1rem, 2vw, 1.25rem);
}

.okb-cart-page .carrito-item {
  border-color: rgba(225, 213, 199, .96) !important;
  border-radius: 1.15rem !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(255, 253, 249, .96)) !important;
  box-shadow: 0 14px 36px rgba(62, 45, 29, .07) !important;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.okb-cart-page .carrito-item:hover {
  border-color: rgba(210, 180, 140, .95) !important;
  box-shadow: 0 20px 46px rgba(62, 45, 29, .1) !important;
  transform: translateY(-1px);
}

.okb-cart-product-image {
  background:
    linear-gradient(180deg, rgba(242, 235, 215, .7), rgba(250, 247, 241, .96)) !important;
}

.okb-cart-qty {
  min-height: 42px;
  border-color: rgba(210, 180, 140, .85) !important;
  background: #FFFFFF !important;
}

.okb-cart-qty button {
  min-width: 42px;
}

.okb-cart-page .okb-cart-button-primary,
.okb-cart-page a.okb-cart-button-primary,
.okb-cart-page button.okb-cart-button-primary {
  background: var(--okb-cart-brown) !important;
  border-color: var(--okb-cart-brown) !important;
  color: #FFFFFF !important;
  box-shadow: 0 14px 30px rgba(110, 84, 55, .2) !important;
}

.okb-cart-page .okb-cart-button-primary:hover,
.okb-cart-page a.okb-cart-button-primary:hover,
.okb-cart-page button.okb-cart-button-primary:hover {
  background: var(--okb-cart-brown-dark) !important;
  color: #FFFFFF !important;
}

.okb-cart-summary-card {
  border-color: rgba(225, 213, 199, .95) !important;
  border-radius: 1.25rem !important;
  background:
    linear-gradient(180deg, rgba(255, 253, 249, .98), rgba(242, 235, 215, .72)) !important;
  box-shadow: 0 24px 60px rgba(62, 45, 29, .11) !important;
}

.okb-cart-summary-total {
  border: 1px solid rgba(210, 180, 140, .72);
  background: #FFFFFF;
}

.okb-cart-trust-grid {
  display: grid;
  gap: .55rem;
  grid-template-columns: 1fr;
}

.okb-cart-trust-item {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  border: 1px solid rgba(225, 213, 199, .82);
  border-radius: .9rem;
  background: rgba(255, 255, 255, .68);
  padding: .72rem .8rem;
}

.okb-cart-trust-item i {
  color: var(--okb-cart-brown);
  margin-top: .1rem;
}

.okb-cart-recommendations article {
  border-color: rgba(225, 213, 199, .95) !important;
  border-radius: 1rem !important;
  background: #FFFFFF !important;
}

.okb-cart-empty {
  border-radius: 1.25rem !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(233, 181, 196, .18), transparent 15rem),
    #FFFFFF !important;
}

@media (max-width: 768px) {
  .okb-cart-page {
    border-radius: 0;
    padding-inline: .85rem !important;
    padding-bottom: 6rem !important;
  }

  .okb-cart-top {
    border-radius: 1.1rem;
    align-items: flex-start;
  }

  .okb-cart-hero {
    border-radius: 1.15rem;
    text-align: left;
  }

  .okb-cart-products,
  .okb-cart-recommendations {
    border-radius: 1.05rem;
    padding: .85rem;
  }

  .okb-cart-page .carrito-item {
    border-radius: 1rem !important;
  }
}