/* ================================================================
   TrueKatana — Product Detail Page
   Design System: --one-* tokens (from layout.css :root)
   ================================================================ */

.one-product-container {
  background: linear-gradient(180deg, var(--one-bg-primary) 0%, var(--one-bg-void) 100%) !important;
  color: var(--one-text-secondary);
  margin: 0;
  overflow-x: hidden;
}

/* ── Breadcrumb ── */
.one-product-header { max-width: 1280px; margin: 0 auto; padding: 10px 20px 0; }
.one-product-breadcrumb-list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 5px; padding: 8px 0; }
.one-product-breadcrumb-list li:not(:first-child)::before { color: var(--one-text-muted); content: "/"; margin-right: 8px; }
.one-product-breadcrumb a { color: var(--one-text-secondary); }
.one-product-breadcrumb a:hover { color: var(--one-link); }

/* ── Product hero ── */
.one-product-body { background-color: var(--one-bg-card) !important; overflow-x: hidden; padding: 15px 20px 1.5rem; }
.one-product-body-container { max-width: 1280px; margin: 0 auto 1rem; }
.one-product-layout { display: grid; gap: 24px; grid-template-columns: minmax(0, 7fr) minmax(340px, 5fr); }
.one-product-gallery-col,
.one-product-info-col { min-width: 0; }
.one-product-body-right { color: var(--one-text-secondary); }

.one-product-image-container { margin: 0; min-height: 360px; }
.one-product-image-container a,
.one-product-thumb-figure a,
.one-product-real-figure a { display: block; }
.one-product-main-image { border-radius: 5px; display: block; min-height: 360px; width: 100%; }
.one-product-thumb-container { display: flex; flex-wrap: wrap; gap: 4px; min-height: 70px; padding-top: 6px; }
.one-product-thumb-figure { display: block; margin: 0; }
.one-product-thumb { border: 1px solid var(--one-border) !important; border-radius: 5px; display: block; max-height: 70px; max-width: 70px; }

/* ── Product info ── */
.one-product-title { color: var(--one-text-primary); font-family: var(--one-font-body); font-size: 1.8em; font-weight: 600; letter-spacing: -0.01em; line-height: 1.2; margin-top:0px !important;margin-bottom:5px !important}
.one-product-review-bar { align-items: center; display: flex; flex-wrap: wrap; gap: 4px; }
.one-product-header-reviews { color: var(--one-text-secondary); font-size: 0.875rem; margin-left: 6px; }
.one-product-star { color: var(--one-warning-vivid); display: inline-flex; margin-right: 3px; }
.one-product-review-stars { align-items: center; display: inline-flex; }

.one-product-body-price { color: var(--one-text-primary); font-size: 2.15em; font-weight: 600; padding-bottom: 4px; }
.one-product-body-price small { font-size: 0.55em; }
.one-product-price-unavailable { color: var(--one-red); }
.one-product-price-coupon-container { color: var(--one-success-vivid) !important; font-size: 0.4em !important; font-weight: 600; }
.one-product-price-coupon-tags { background-color: var(--one-success-vivid) !important; border-radius: var(--one-radius-full); color: #000; display: inline-flex; margin-right: 8px; padding:1px 10px; font-size: 0.8em !important; }
.one-product-body-coupon { border: 1px dashed var(--one-success-vivid); border-radius: 5px; margin-bottom: 5px; max-width: 300px; padding: 5px 10px 10px !important; vertical-align: middle; }
.one-product-body-coupon-percent { color: var(--one-success-vivid); font-family: var(--one-font-body); font-size: 23px; font-weight: 900; }
.one-product-body-coupon-percent svg { margin-top: -6px; }
.one-product-body-coupon-subtitle { color: var(--one-success-vivid); font-family: var(--one-font-body); font-size: 13px; font-weight: 400; }
.one-product-body-coupon-subtitle span { color: var(--one-success-vivid); font-weight: 900; }

.one-product-shipping-methold { align-items: center; display: flex; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 8px; padding-top: 4px; }
.one-product-shipping-item { align-items: center; display: inline-flex; gap: 6px; line-height: 1.35; }
.one-product-shipping-tips { color: var(--one-success-vivid); font-size: 14px; font-weight: 600; }
.one-product-shipping-tips a { color: var(--one-success-vivid) !important; }
.one-product-shipping-tips svg,
.one-product-inventory-instock svg,
.one-product-inventory-low svg,
.one-product-inventory-out svg { flex: 0 0 auto; }
.one-product-inventory-instock { color: var(--one-success-vivid) !important; font-size: 14px; font-weight: 600; }
.one-product-inventory-low { color: var(--one-warning) !important; font-weight: 600; }
.one-product-inventory-out { color: var(--one-red) !important; font-weight: 600; }

.one-product-desktop-content { display: block; }
.one-product-body-desc { color: var(--one-text-secondary); }
.one-product-body-ul { color: var(--one-text-primary); font-weight: 600; line-height: 1.6; padding-left: 16px; }
.one-product-body-ul li { margin-bottom: 1rem; }
.one-product-body-hr { background: var(--one-border); border: 0; height: 1px; margin: 10px 0; }

/* ── Actions & variants ── */
.one-product-action-panel { display: grid; gap: 4px; margin-top: 1rem; }
.one-product-action-row { display: grid; }
.one-product-body-add-cart,
.one-product-paypal-action,
.one-product-out-of-stock { align-items: center; border: 1px solid transparent; border-radius: 4px; display: inline-flex; font-family: var(--one-font-body); font-size: 1.25em; font-weight: 700; gap: 8px; justify-content: center; line-height: 1.2; min-height: 48px; padding: 10px 18px; text-align: center; width: 100%; }
.one-product-action-icon { flex: 0 0 auto; }
.one-product-body-add-cart { background-color: var(--one-red) !important; border-color: var(--one-red) !important; color: #fff !important; transition: opacity 0.15s;cursor:pointer; }
.one-product-body-add-cart:hover { background-color: var(--one-red-hover) !important; border-color: var(--one-red-hover) !important; }
.one-product-paypal-action { background-color: var(--one-cta-secondary) !important; border-color: var(--one-cta-secondary) !important; color: #fff !important; transition: background-color 0.15s; cursor: pointer;}
.one-product-paypal-action:hover { background-color: var(--one-cta-secondary-hover) !important; border-color: var(--one-cta-secondary-hover) !important; }
.one-product-out-of-stock { background: var(--one-bg-void); border-color: var(--one-bg-void); color: #fff; cursor: not-allowed; }

.one-product-variant-block { margin-bottom: 1rem; }
.one-product-variant-title { color: var(--one-text-primary); margin-bottom: 8px; }
.one-product-variant-items { display: flex; flex-wrap: wrap; gap: 4px; margin: 8px 0 1rem; }
.one-product-variant-figure { display: block; margin: 0; }
.one-product-variant-image { border-radius: 4px; display: block; max-width: 52px; }
.one-product-variant-selected { border: 2px solid var(--one-success-vivid); }
.one-product-variant-figure figcaption { color: var(--one-text-muted); display: block; font-size: 11px; margin-top: 2px; text-align: center; }

.one-product-highlight {margin-top:20px}
.one-product-highlight-li { color: var(--one-text-primary); font-weight: 500; padding: 2px 0; }
.one-product-highlight-icon {width: 24px; }
.one-product-highlight-icon img { max-width: 18px; }
.one-product-highlight-title {}
.one-product-subscribe { margin-top: 10px; }
.one-product-subscribe hr { background-color: var(--one-border) !important; border: 0; height: 1px; }
.one-product-subscribe a { cursor: pointer; text-decoration: underline !important; }
.one-product-share { margin-top: 12px; }

/* ── Description Section ── */
.one-product-desc { background-color: var(--one-bg-void) !important; color: var(--one-text-primary); font-size: 1.1em; min-height: 800px; }
.one-product-desc-container { max-width: 1280px; margin: 0 auto; padding: 50px 20px; }
.one-product-desc-container h2 { color: var(--one-text-primary); font-family: var(--one-font-body); font-size: 1.75em; font-weight: 600; letter-spacing: -0.01em; }
.one-product-desc-description { margin: 20px 0; color: var(--one-text-secondary)}
.one-product-desc-description a { color: var(--one-link); }
.one-product-desc-description a:hover { color: var(--one-link); text-decoration: underline; }
.one-product-desc-ul { padding-left: 15px; }
.one-product-desc-ul li { margin-bottom: 0.75rem; color: var(--one-text-secondary)}
.one-product-desc-tags { margin: 20px 0; }
.one-product-tag-title { color: var(--one-text-primary); font-weight: bold; }

.one-product-video-grid,
.one-product-spec-grid,
.one-product-real-grid { display: grid; grid-template-columns: minmax(0, 1fr); }
.one-product-video { max-width: 50%; }
.one-product-video-frame { aspect-ratio: 10 / 13; margin-bottom: 1.5rem; }
.one-product-video-frame iframe { border: 0; height: 100%; width: 100%; }
.one-product-rich-grid { display: grid; gap: 24px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 1.5rem; }
.page-details-rich-image { margin-bottom: 1rem; }
.page-details-rich-image img { display: block; width: 100%; }
.one-product-spec-panel { max-width: 650px; }
.one-product-real-panel { max-width: 650px; }
.one-product-real-figure { display: block; margin: 0 0 1rem; max-width: 700px; }
.one-product-real-figure img { border-radius: 5px; display: block; width: 100%; }

.one-product-property-table caption { height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.one-product-property-table { border-collapse: collapse; margin-bottom: 3rem; width: 100%; }
.one-product-property-table td { border: 1px solid var(--one-border); color: var(--one-text-secondary); font-size: 0.95em; padding: 10px 16px; }
.one-product-property-table th { background-color: var(--one-bg-card) !important; border: 1px solid var(--one-border); color: var(--one-text-primary); font-size: 0.95em; font-weight:600; padding: 10px 16px; text-align: right;}

/* ── FAQs Section ── */
.one-products-faqs-container-fluid { background-color: var(--one-bg-void) !important; padding: 0 0 50px; }
.one-products-faqs-container { margin: 0 auto; max-width: 1280px; padding: 10px 20px 0; }
.one-products-faqs-title { font-family: var(--one-font-body); font-weight: 600; letter-spacing: -0.01em; font-size: 1.65em; }
.one-products-faqs-summary { color: var(--one-text-primary); font-size: 1.1em; margin-bottom: 5px; }
.one-products-faqs-summary::marker { color: var(--one-red) !important; font-size:14px}
.one-products-faqs-content { color: var(--one-text-secondary); font-size: 1em; max-width: 80%; padding: 5px 0 10px 15px; }

/* ── Tags Section ── */
.one-product-tags-container-fluid { background-color: var(--one-bg-primary); padding: 60px 0; }
.one-product-tags-container { margin: 0 auto; max-width: 1280px; padding: 0 20px; }
.one-product-tags-title { color: var(--one-text-primary); font-family: var(--one-font-body); font-size: 2em; font-weight: 600; letter-spacing: -0.01em; text-align: center; margin-top:5px!important}
.one-product-tags { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; list-style: none; margin: 0; padding: 0; }
.one-product-tags li { background-color: var(--one-bg-card); border-radius: 50px; color: var(--one-text-primary) !important; cursor: pointer; display: inline-block; font-size: 12px; line-height: 1; padding: 6px 12px; text-align: center; transition: background-color 0.15s, transform 0.15s; white-space: nowrap; }
.one-product-tags li:hover { background-color: var(--one-bg-elevated); transform: translateY(-1px); }
.one-product-tags li a { color: var(--one-text-secondary) !important; transition: color 0.15s; }
.one-product-tags li:hover a { color: var(--one-text-primary) !important; }

/* ── Subscribe Banner ── */
.one-product-subscribe-banner { background-color: var(--one-bg-void); border-top: 1px solid var(--one-border-subtle); border-bottom: 1px solid var(--one-border-subtle); color: var(--one-text-primary); padding: 110px 20px; text-align: center; }
.one-product-subscribe-banner-box { margin: 0 auto; max-width: 760px; }
.one-product-subscribe-banner-kicker { color: var(--one-text-secondary); font-size: 1.45em; font-weight: 700; line-height: 1.2; margin: 0 0 36px; }
.one-product-subscribe-banner-title { color: var(--one-text-primary); font-family: var(--one-font-body); font-size: 4.6em; font-weight: 800; letter-spacing: -0.01em; line-height: 1.05; margin: 0 0 32px; }
.one-product-subscribe-banner-desc { color: var(--one-text-primary); font-size: 1em; line-height: 1.35; margin: 0 auto 28px; max-width: 620px; }
.one-product-subscribe-banner-btn { align-items: center; background-color: var(--one-red); border-radius: var(--one-radius-full); color: #fff !important; display: inline-flex; font-size: 1.2em; font-weight: 800; justify-content: center; line-height: 1.2; min-width: 290px; padding: 14px 34px; text-align: center; transition: background-color 0.15s; }
.one-product-subscribe-banner-btn:hover { background-color: var(--one-red-hover); color: #fff !important; }

/* ── Related Products ── */
.one-product-related { background: var(--one-bg-void); }
.one-product-related-container { max-width: 1600px; margin: auto; padding: 60px 20px 80px; }
.one-product-related-title { color: var(--one-text-primary); font-family: var(--one-font-body); font-size: 2em; font-weight: 600; letter-spacing: -0.01em; margin-bottom: 40px; text-align: center; }

@media (min-width: 1200px) {
  .one-product-related .one-product-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

/* ── Product Reviews ── */
.one-product-reviews-fluid { background-color: var(--one-bg-primary) !important; }
.one-product-reviews-container { max-width: 1280px; margin: auto; padding: 40px 20px; }
.one-product-reviews-h3 { align-items: center; color: var(--one-text-primary); display: flex; font-family: var(--one-font-body); font-size: 1.65em; font-weight: 600; gap: 12px; letter-spacing: -0.01em;}
.one-product-reviews-count-badge { align-items: center; background: var(--one-red); border-radius: 9999px; color: #fff; display: inline-flex; font-family: var(--one-font-body); font-size: 0.4em; font-weight: 500; justify-content: center; padding: 2px 10px; }
.one-product-reviews { display: grid; gap: 16px; }
.one-product-reviews-card { background-color: var(--one-bg-card) !important; border: 1px solid var(--one-border); border-radius: 5px; display: grid; grid-template-columns: 260px 1fr; }
.one-product-reviews-left { border-right: 1px solid var(--one-border); min-height: 100px; padding: 18px; }
.one-product-reviews-left small { display: block; font-size: 0.8em; }
.one-product-reviews-title { align-items: center; color: var(--one-text-primary); display: inline-flex; gap: 8px; }
.one-product-reviews-flag { border-radius: 2px; box-shadow: 0 0 0 1px rgba(255,255,255,.12); flex: 0 0 auto; font-size: 12px; line-height: 1; }
.one-product-reviews-right { color: var(--one-text-secondary); font-weight: 500; padding: 18px 22px; }
.one-product-reviews-meta { align-items: center; display: flex; gap: 8px; }
.one-product-reviews-content { margin: 16px 0 0; max-width: 80%; }
.one-product-reviews-action { margin-top: 1.5rem; text-align: center; }
.one-product-reviews-more { background: transparent !important; border: 1px solid var(--one-text-muted) !important; border-radius:40px; color: var(--one-text-primary) !important; cursor: pointer; display: inline-flex; font-family: var(--one-font-body); font-size: 0.95em; font-weight: 600; padding: 8px 42px; transition: border-color 0.15s; }
.one-product-reviews-more:hover { border-color: var(--one-text-primary) !important; color: var(--one-text-primary) !important; }

/* ── Sales Notify ── */
.one-product-sales-notify { margin-top: 25px; }
.one-product-sales-notify a { border-bottom: 1px dashed var(--one-text-primary); }
.one-product-sales-notify span { max-width: 70%; margin: auto; }
.one-product-sales-notify hr { background-color: var(--one-border-hover) !important; }
.one-product-sales-notify-modal-title { color: var(--one-text-primary); }
.one-product-sales-notify-modal-body { color: var(--one-text-secondary) !important; padding: 30px; }
.one-product-sales-notify-modal-body input::placeholder { color: var(--one-text-muted) !important; }

@media (max-width: 991.98px) {
  .one-product-layout { grid-template-columns: 1fr; }
  .one-product-video { max-width: 100%; }
  .one-product-rich-grid { grid-template-columns: 1fr; }
  .one-product-reviews-card { grid-template-columns: 1fr; }
  .one-product-reviews-left { border-bottom: 1px solid var(--one-border); border-right: 0; min-height: 50px; }
  .one-product-reviews-content { max-width: 100%; }
}

@media (max-width: 767.98px) {
  .one-product-header { display: none; }
  .one-product-body { padding: 0 !important; }
  .one-product-body-right { padding: 10px 15px; }
  #main_image_container { border-radius: 0 !important; }
  .one-product-thumb-container { min-height: 60px; padding: 0 15px 10px; }
  .one-product-thumb { max-height: 50px; max-width: 50px !important; }
  .one-product-title { font-size: 1.5em; line-height: 1.15em; }
  .one-product-body-coupon { display: block; margin-bottom: 10px; }
  .one-product-shipping-methold { font-size: 1em; margin-bottom: 20px !important; }
  .one-product-desktop-content { display: none; }
  .one-product-desc-container { padding: 36px 25px 0; }
  .one-product-desc-ul li { margin-bottom: 20px !important; }
  .one-products-faqs-container { padding: 10px 25px; }
  .one-products-faqs-summary { margin-bottom: 10px; }
  .one-products-faqs-content { max-width: 100%; }
  .one-product-subscribe-banner { padding: 70px 20px; }
  .one-product-subscribe-banner-kicker { font-size: 1.1em; margin-bottom: 24px; }
  .one-product-subscribe-banner-title { font-size: 2.8em; margin-bottom: 22px; }
  .one-product-subscribe-banner-desc { font-size: 0.95em; max-width: 92%; }
  .one-product-subscribe-banner-btn { font-size: 1em; min-width: min(290px, 100%); }
  .one-product-related-title { font-size: 2em; font-weight: 700; text-align: center; }
}