
/* =========================================================
   TITIBDUL GLOBAL CART V9
   Satu keranjang lintas halaman, checkout final via WhatsApp.
   ========================================================= */

:root {
  --tb-cart-bg: #070400;
  --tb-cart-card: #120b03;
  --tb-cart-gold: #f8c848;
  --tb-cart-gold-pale: #fff0b8;
  --tb-cart-muted: #bfae83;
  --tb-cart-line: rgba(248,200,72,.24);
  --tb-cart-teal: #0e9688;
  --tb-cart-teal-bright: #12b8a7;
}

.tb-global-cart-enabled .unified-navbar .nav-cta {
  position: relative !important;
  min-width: 116px !important;
}

.tb-nav-cart-count {
  display: inline-flex;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  margin-left: 7px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(0,0,0,.38);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;
  font-size: .72rem;
  font-weight: 950;
}

.tb-cart-fab {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 1800;
  min-height: 54px;
  padding: 12px 18px;
  border-radius: 999px;
  border: 1px solid rgba(248,200,72,.56);
  background: linear-gradient(135deg, var(--tb-cart-teal), var(--tb-cart-teal-bright));
  color: #fff;
  box-shadow:
    0 18px 42px rgba(0,0,0,.55),
    0 10px 25px rgba(14,150,136,.28);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 950;
  transition: transform .22s ease, box-shadow .22s ease;
}

.tb-cart-fab:hover {
  transform: translateY(-3px);
  box-shadow:
    0 24px 50px rgba(0,0,0,.64),
    0 14px 30px rgba(14,150,136,.35);
}

.tb-cart-fab-count {
  min-width: 25px;
  height: 25px;
  padding: 0 7px;
  border-radius: 999px;
  background: rgba(0,0,0,.42);
  border: 1px solid rgba(255,255,255,.24);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .76rem;
}

.tb-cart-modal {
  position: fixed;
  inset: 0;
  z-index: 2500;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(0,0,0,.80);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.tb-cart-modal.active {
  display: flex;
}

.tb-cart-dialog {
  width: min(820px, 100%);
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  border-radius: 28px;
  padding: 28px;
  background:
    radial-gradient(circle at 100% 0%, rgba(248,200,72,.10), transparent 36%),
    linear-gradient(180deg, #160d04, #070400);
  border: 1px solid rgba(248,200,72,.44);
  box-shadow:
    0 34px 90px rgba(0,0,0,.72),
    0 0 40px rgba(248,200,72,.09);
}

.tb-cart-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.tb-cart-head h2 {
  color: var(--tb-cart-gold-pale);
  font-size: clamp(1.65rem, 4vw, 2.3rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}

.tb-cart-head p {
  color: var(--tb-cart-muted);
  margin-top: 8px;
  line-height: 1.6;
}

.tb-cart-close {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  color: var(--tb-cart-gold);
  border: 1px solid rgba(248,200,72,.25);
  background: rgba(248,200,72,.06);
  font-weight: 950;
  font-size: 1.05rem;
}

.tb-cart-list {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.tb-cart-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 17px;
  border-radius: 19px;
  border: 1px solid rgba(248,200,72,.16);
  background: rgba(248,200,72,.045);
}

.tb-cart-category {
  color: #75d3ca;
  font-size: .70rem;
  font-weight: 950;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.tb-cart-name {
  color: var(--tb-cart-gold-pale);
  font-weight: 950;
  line-height: 1.35;
  margin-top: 5px;
}

.tb-cart-variant {
  color: var(--tb-cart-muted);
  font-size: .80rem;
  line-height: 1.5;
  margin-top: 4px;
}

.tb-cart-line-total {
  color: var(--tb-cart-gold);
  font-size: .84rem;
  font-weight: 900;
  margin-top: 7px;
}

.tb-cart-controls {
  display: flex;
  align-items: center;
  gap: 9px;
}

.tb-cart-qty-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(248,200,72,.31);
  background: rgba(248,200,72,.065);
  color: var(--tb-cart-gold);
  font-weight: 950;
  font-size: 1.05rem;
}

.tb-cart-qty {
  min-width: 25px;
  text-align: center;
  color: var(--tb-cart-gold-pale);
  font-weight: 950;
}

.tb-cart-remove {
  width: 36px;
  height: 36px;
  margin-left: 5px;
  border-radius: 50%;
  border: 1px solid rgba(255,112,96,.24);
  background: rgba(159,41,31,.12);
  color: #ffab9e;
  font-weight: 950;
}

.tb-cart-empty {
  padding: 52px 20px;
  margin-top: 24px;
  border-radius: 20px;
  border: 1px dashed rgba(248,200,72,.23);
  color: var(--tb-cart-muted);
  text-align: center;
  line-height: 1.7;
}

.tb-cart-empty b {
  display: block;
  color: var(--tb-cart-gold);
  font-size: 1.12rem;
  margin-bottom: 6px;
}

.tb-cart-summary-box {
  display: grid;
  gap: 9px;
  margin-top: 20px;
  padding: 19px;
  border-radius: 19px;
  border: 1px solid rgba(18,184,167,.22);
  background: rgba(14,150,136,.085);
}

.tb-summary-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  color: var(--tb-cart-muted);
}

.tb-summary-row strong {
  color: var(--tb-cart-gold-pale);
}

.tb-summary-row.grand {
  padding-top: 11px;
  border-top: 1px solid rgba(248,200,72,.16);
  font-size: 1.08rem;
}

.tb-summary-row.grand strong {
  color: var(--tb-cart-gold);
  font-size: 1.25rem;
}

.tb-cart-note {
  margin-top: 14px;
  color: var(--tb-cart-muted);
  font-size: .82rem;
  line-height: 1.55;
}

.tb-customer-form {
  display: grid;
  gap: 12px;
  margin-top: 22px;
  padding: 18px;
  border-radius: 19px;
  border: 1px solid rgba(248,200,72,.20);
  background: rgba(248,200,72,.035);
}

.tb-customer-title {
  color: var(--tb-cart-gold-pale);
  font-weight: 950;
  margin-bottom: 2px;
}

.tb-customer-field {
  display: grid;
  gap: 6px;
}

.tb-customer-field span {
  color: var(--tb-cart-muted);
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .02em;
}

.tb-customer-field input,
.tb-customer-field textarea {
  width: 100%;
  padding: 11px 14px;
  border-radius: 13px;
  border: 1px solid rgba(248,200,72,.26);
  background: rgba(0,0,0,.35);
  color: var(--tb-cart-gold-pale);
  font-family: inherit;
  font-size: .92rem;
  resize: vertical;
}

.tb-customer-field input::placeholder,
.tb-customer-field textarea::placeholder {
  color: rgba(191,174,131,.55);
}

.tb-customer-field input:focus,
.tb-customer-field textarea:focus {
  outline: none;
  border-color: rgba(248,200,72,.62);
}

.tb-customer-error {
  min-height: 1.1em;
  color: #ffab9e;
  font-size: .80rem;
  font-weight: 850;
}

.tb-checkout-title {
  color: var(--tb-cart-gold-pale);
  margin-top: 24px;
  font-weight: 950;
  text-align: center;
}

.tb-checkout-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 13px;
}

.tb-checkout-btn {
  min-height: 49px;
  padding: 13px 17px;
  border-radius: 999px;
  border: 1px solid rgba(248,200,72,.52);
  background: linear-gradient(135deg, var(--tb-cart-teal), var(--tb-cart-teal-bright));
  color: #fff;
  font-weight: 950;
  text-align: center;
}

.tb-cart-clear {
  width: 100%;
  min-height: 46px;
  margin-top: 12px;
  border-radius: 999px;
  border: 1px solid rgba(248,200,72,.22);
  background: transparent;
  color: var(--tb-cart-muted);
  font-weight: 850;
}

.tb-cart-toast {
  position: fixed;
  left: 50%;
  bottom: 88px;
  z-index: 2800;
  max-width: min(440px, calc(100% - 30px));
  padding: 13px 17px;
  border-radius: 15px;
  border: 1px solid rgba(248,200,72,.34);
  background: rgba(7,4,0,.96);
  color: var(--tb-cart-gold-pale);
  box-shadow: 0 18px 45px rgba(0,0,0,.58);
  text-align: center;
  font-weight: 850;
  transform: translate(-50%, 30px);
  opacity: 0;
  pointer-events: none;
  transition: .24s ease;
}

.tb-cart-toast.active {
  transform: translate(-50%, 0);
  opacity: 1;
}

/* Product modal: checkout contact buttons become one add-to-cart button. */
.tb-global-cart-enabled .modal:not(.tb-cart-modal) .modal-actions .contact-btn:first-child {
  grid-column: 1 / -1 !important;
}

.tb-global-cart-enabled .modal:not(.tb-cart-modal) .modal-actions .contact-btn:nth-child(n+2) {
  display: none !important;
}

/* Sari Milo had its own page-local cart. V9 replaces it with the global cart. */
.tb-page-sari-milo #cartBar,
.tb-page-sari-milo #cartModal {
  display: none !important;
}

/* Prevent direct WA-style CTA from looking different after conversion. */
.tb-global-cart-open {
  cursor: pointer !important;
}

@media (max-width: 680px) {
  .tb-cart-fab {
    right: 12px;
    bottom: 12px;
    min-height: 50px;
    padding: 10px 14px;
  }

  .tb-cart-dialog {
    padding: 21px;
    border-radius: 23px;
  }

  .tb-cart-item {
    grid-template-columns: 1fr;
  }

  .tb-cart-controls {
    justify-content: flex-end;
  }

  .tb-checkout-actions {
    grid-template-columns: 1fr;
  }
}
