/* TempBag WooCommerce */
.tb-shop { padding: 40px 0 72px; }
.tb-shop-head { margin-bottom: 28px; }
.tb-shop-head h1 { font-size: clamp(34px, 4vw, 52px); font-weight: 400; }
.tb-shop-head p { color: var(--tb-muted); margin: 0; }

.tb-single { padding: 28px 0 72px; }
.tb-breadcrumb { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--tb-muted); margin-bottom: 28px; display: flex; gap: 8px; flex-wrap: wrap; }
.tb-breadcrumb a { color: var(--tb-muted); }
.tb-breadcrumb-here { color: var(--tb-ink-soft); }

.tb-single-top { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: start; }
.tb-single-badge { display: inline-block; background: var(--tb-ink); color: #fff; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; padding: 5px 12px; margin-bottom: 14px; border-radius: var(--tb-radius-pill); }
.tb-single-title { font-size: clamp(32px, 4vw, 48px); font-weight: 400; }
.tb-single-price { font-size: 20px; letter-spacing: .04em; margin: 8px 0 18px; }
.tb-single-short { color: var(--tb-ink-soft); font-size: 16px; margin-bottom: 22px; }

.tb-buy-area { margin-bottom: 10px; }
.tb-buy-area form.cart { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.tb-buy-area .qty { width: 72px; padding: 12px; border: 1px solid var(--tb-line); background: #fff; border-radius: 12px; }
.tb-buy-area .single_add_to_cart_button,
.tb-buy-area .button {
  flex: 1; min-width: 180px; background: var(--tb-ink); color: #fff;
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
  padding: 14px 22px; border: 0; cursor: pointer; border-radius: var(--tb-radius-pill);
}
.tb-buy-area table.variations { width: 100%; margin-bottom: 16px; border-collapse: separate; border-spacing: 0 14px; }
.tb-buy-area table.variations th { text-align: left; font-weight: 500; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--tb-muted); padding: 6px 14px 0 0; width: 72px; vertical-align: top; }
.tb-buy-area table.variations td { padding: 0; }
.tb-buy-area table.variations select {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); border: 0;
}
.tb-buy-area .reset_variations { display: none; }

.tb-swatches { display: flex; flex-wrap: wrap; gap: 8px; }
.tb-swatch {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 14px; border: 1px solid var(--tb-line); background: #fff;
  border-radius: 999px; cursor: pointer; font-size: 13px; color: var(--tb-ink);
  font-family: inherit; line-height: 1.2;
}
.tb-swatch:hover { border-color: var(--tb-ink); }
.tb-swatch.is-selected { border-color: var(--tb-ink); background: var(--tb-ink); color: #fff; }
.tb-swatch-dot {
  width: 12px; height: 12px; border-radius: 50%;
  background: #c4b5a0; border: 1px solid rgba(0,0,0,.12); flex: 0 0 12px;
}
.tb-swatches--size .tb-swatch-dot { display: none; }
.tb-swatch-dot[data-color="cognac"] { background: #8a4b24; }
.tb-swatch-dot[data-color="ink-black"] { background: #1a1a1a; }
.tb-swatch-dot[data-color="olive"] { background: #5c6b3a; }
.tb-swatch-dot[data-color="bordeaux"] { background: #6b2434; }
.tb-swatch-dot[data-color="natural"] { background: #d8c3a0; }
.tb-swatch-dot[data-color="saddle"] { background: #a56a32; }
.tb-swatch.is-selected .tb-swatch-dot { box-shadow: 0 0 0 2px #fff; }
.tb-buy-wa-wrap { margin-top: 10px; }
.tb-buy-wa-wrap .tb-wa-btn { width: 100%; }

.tb-single-meta { list-style: none; margin: 18px 0; border-top: 1px solid var(--tb-line); padding-top: 12px; }
.tb-single-meta li { display: flex; justify-content: space-between; font-size: 14px; padding: 5px 0; }
.tb-single-meta li span { color: var(--tb-muted); }
.tb-single-meta li b { font-weight: 500; }

.tb-custom-box { border: 1px solid var(--tb-line); background: var(--tb-paper); padding: 22px; margin-top: 8px; border-radius: var(--tb-radius); }
.tb-custom-box h3 { font-size: 26px; font-weight: 400; margin: 0 0 8px; }
.tb-custom-box p { color: var(--tb-ink-soft); font-size: 14px; margin: 0 0 14px; }

.tb-single-bottom { display: grid; grid-template-columns: 1.2fr .8fr; gap: 48px; margin-top: 56px; padding-top: 40px; border-top: 1px solid var(--tb-line); }
.tb-single-sub { font-size: 28px; font-weight: 400; margin-bottom: 16px; }
.tb-prose { color: var(--tb-ink-soft); }
.tb-prose h3 { font-family: var(--tb-font-head); font-size: 22px; color: var(--tb-ink); margin: 22px 0 10px; }
.tb-prose ul { list-style: none; }
.tb-prose ul li { padding: 6px 0 6px 18px; position: relative; }
.tb-prose ul li::before { content: "–"; position: absolute; left: 0; color: var(--tb-brass); }

.tb-gallery-main { background: #F4EFE7; border: 1px solid var(--tb-line); margin-bottom: 10px; border-radius: 22px; overflow: hidden; }
.tb-gallery-main img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.tb-gallery-thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.tb-thumb { padding: 0; border: 1px solid var(--tb-line); background: #F4EFE7; cursor: pointer; border-radius: 12px; overflow: hidden; }
.tb-thumb img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.tb-thumb.is-active { border-color: var(--tb-ink); }

.tb-spec-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.tb-spec-table th { text-align: left; color: var(--tb-muted); font-weight: 500; padding: 11px 14px 11px 0; border-bottom: 1px solid var(--tb-line); width: 40%; vertical-align: top; }
.tb-spec-table td { padding: 11px 0; border-bottom: 1px solid var(--tb-line); }

.tb-wa-cta { margin-top: 48px; }
.tb-wa-cta-inner { background: var(--tb-ink); color: #E8DFD3; padding: 40px 44px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; border-radius: 24px; }
.tb-wa-cta-text h3 { color: #F3EEE6; font-weight: 400; font-size: 32px; margin: 0 0 8px; }
.tb-wa-cta-text p { margin: 0; max-width: 36em; }
.tb-wa-cta-actions { display: flex; flex-direction: column; gap: 10px; min-width: 240px; }

.woocommerce table.shop_table { border: 1px solid var(--tb-line); background: var(--tb-card); }
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
  background: var(--tb-ink); color: #fff; border-radius: var(--tb-radius-pill);
  font-size: 12px; letter-spacing: .12em; text-transform: uppercase;
}
.woocommerce-page .tb-page, .woocommerce-cart .tb-page, .woocommerce-checkout .tb-page { max-width: 1100px; }

@media (max-width: 900px) {
  .tb-single-top, .tb-single-bottom { grid-template-columns: 1fr; gap: 28px; }
}