/* ═══════════════════════════════════════════════════════
   SONGYU LED — WooCommerce 深色主題樣式
   woocommerce.css  v1.0.0
═══════════════════════════════════════════════════════ */

/* ── 全站重設 WooCommerce 預設樣式 ── */
.sy-woocommerce *,
.woocommerce *,
.woocommerce-page * {
  box-sizing: border-box;
}

/* ── 產品中心包裝 ── */
.sy-woo-wrap {
  background: var(--sy-black);
  min-height: 60vh;
  position: relative;
  z-index: 1;
}

.sy-woo-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px;
}

/* ── WooCommerce Hero ── */
.sy-woo-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse 80% 60% at 60% 40%, rgba(26,58,204,.22) 0%, transparent 55%),
    linear-gradient(160deg, #030507 0%, #060c1a 60%, #030507 100%);
  padding: 100px 0 60px;
}

.sy-woo-hero::after {
  content: '';
  position: absolute; left: 0; right: 0; height: 2px; top: 0;
  background: linear-gradient(90deg, transparent, #00ddff, transparent);
  animation: sy-scanline 4s linear infinite;
  opacity: .25;
}

.sy-woo-hero-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px;
}

.sy-woo-breadcrumb {
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  letter-spacing: .3em;
  color: var(--sy-grey);
  margin-bottom: 16px;
}

.sy-woo-breadcrumb a { color: var(--sy-grey); text-decoration: none; }
.sy-woo-breadcrumb a:hover { color: var(--sy-cyan); }
.sy-woo-breadcrumb .breadcrumb-separator,
.sy-woo-breadcrumb span { color: var(--sy-grey); }

/* WooCommerce default breadcrumb */
.woocommerce-breadcrumb {
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  letter-spacing: .3em;
  color: var(--sy-grey) !important;
  background: none !important;
  padding: 0 !important;
  margin-bottom: 16px !important;
}
.woocommerce-breadcrumb a { color: var(--sy-grey); }
.woocommerce-breadcrumb a:hover { color: var(--sy-cyan); }

.sy-woo-mono {
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  letter-spacing: .4em;
  color: var(--sy-cyan);
  margin-bottom: 12px;
}

.sy-woo-hero-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(48px, 7vw, 80px);
  line-height: .95;
  letter-spacing: .04em;
  color: #fff;
  margin-bottom: 16px;
}

.sy-woo-accent {
  color: var(--sy-cyan);
  text-shadow: 0 0 30px rgba(0,210,255,.4);
}

.sy-woo-hero-desc {
  font-size: 16px;
  font-weight: 300;
  color: var(--sy-grey-light);
  letter-spacing: .1em;
}

/* ── 分類導覽 ── */
.sy-woo-cats {
  background: var(--sy-navy);
  border-bottom: 1px solid var(--sy-border);
}

.sy-woo-cats-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px;
  display: flex;
  gap: 0;
}

.sy-woo-cat-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 18px 28px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--sy-grey-light);
  text-decoration: none;
  font-family: 'Noto Sans TC', sans-serif;
  border-right: 1px solid var(--sy-border);
  transition: background .25s, color .25s;
  position: relative;
}

.sy-woo-cat-item::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, #1a3acc, #00ddff);
  transform: scaleX(0);
  transition: transform .3s;
}

.sy-woo-cat-item:hover,
.sy-woo-cat-item.sy-woo-cat-active {
  color: var(--sy-cyan);
  background: rgba(0,200,255,.06);
}

.sy-woo-cat-item:hover::after,
.sy-woo-cat-item.sy-woo-cat-active::after {
  transform: scaleX(1);
}

.sy-woo-cat-item svg { color: var(--sy-cyan); }

/* ── 主內容區 ── */
.sy-woo-main {
  padding: 60px 0 80px;
}

/* ── 工具列 ── */
.sy-woo-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 32px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--sy-border);
}

.sy-woo-result-count .woocommerce-result-count {
  font-size: 13px;
  color: var(--sy-grey);
  font-family: 'Share Tech Mono', monospace;
  letter-spacing: .15em;
}

.sy-woo-orderby select,
.woocommerce-ordering select {
  background: var(--sy-navy);
  color: #fff;
  border: 1px solid var(--sy-border);
  padding: 8px 16px;
  font-size: 12px;
  font-family: 'Noto Sans TC', sans-serif;
  outline: none;
  cursor: pointer;
}

/* ── 產品格局 ── */
.woocommerce ul.products,
ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

@media (max-width: 900px) {
  .woocommerce ul.products,
  ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 540px) {
  .woocommerce ul.products,
  ul.products { grid-template-columns: 1fr !important; }
}

/* ── 產品卡片 ── */
.sy-product-card-woo {
  background: var(--sy-navy) !important;
  border: 1px solid var(--sy-border) !important;
  overflow: hidden;
  position: relative;
  transition: border-color .3s, transform .3s !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  width: auto !important;
}

.sy-product-card-woo:hover {
  border-color: var(--sy-cyan) !important;
  transform: translateY(-4px);
}

.sy-product-card-woo::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, #1a3acc, #00ddff);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s;
  z-index: 5;
}

.sy-product-card-woo:hover::before { transform: scaleX(1); }

/* 圖片區 */
.sy-product-img-link {
  display: block;
  position: relative;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  height: auto;
  background: linear-gradient(135deg, #001428, #002244);
  text-decoration: none;
}

.sy-product-img {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  transition: transform .4s;
  position: absolute;
  top: 0; left: 0;
}

.sy-product-card-woo:hover .sy-product-img { transform: scale(1.04); }

.sy-product-img-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  inset: 0;
  gap: 12px;
}

.sy-product-img-placeholder span {
  font-family: 'Share Tech Mono', monospace;
  font-size: 10px;
  letter-spacing: .2em;
  color: rgba(0,180,255,.35);
}

.sy-product-cat-badge {
  position: absolute;
  top: 12px; left: 12px;
  font-family: 'Share Tech Mono', monospace;
  font-size: 10px;
  letter-spacing: .15em;
  color: var(--sy-cyan);
  background: rgba(0,200,255,.12);
  border: 1px solid rgba(0,200,255,.35);
  padding: 4px 10px;
}

.sy-product-badge-new {
  position: absolute;
  top: 12px; right: 12px;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 12px;
  letter-spacing: .2em;
  color: #fff;
  background: var(--sy-brand-blue);
  padding: 3px 10px;
}

/* 資訊區 */
.sy-product-info { padding: 20px 22px 24px; }

.sy-product-spec-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.sy-spec-tag {
  font-size: 10px;
  letter-spacing: .1em;
  color: var(--sy-cyan);
  border: 1px solid rgba(0,200,255,.3);
  padding: 2px 8px;
  font-family: 'Share Tech Mono', monospace;
}

.sy-product-title {
  font-size: 16px !important;
  font-weight: 700 !important;
  margin: 0 0 8px !important;
  letter-spacing: .04em;
}

.sy-product-title a {
  color: #fff !important;
  text-decoration: none;
  transition: color .2s;
}

.sy-product-title a:hover { color: var(--sy-cyan) !important; }

.sy-price-label {
  font-family: 'Share Tech Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: .2em !important;
  color: var(--sy-grey) !important;
  margin: 6px 0 10px !important;
}

.sy-product-excerpt {
  font-size: 13px;
  color: var(--sy-grey);
  font-weight: 300;
  line-height: 1.6;
  margin-bottom: 16px;
}

.sy-product-actions {
  display: flex;
  gap: 10px;
}

.sy-btn-detail {
  flex: 1;
  padding: 10px 0;
  text-align: center;
  background: transparent;
  color: var(--sy-grey-light);
  border: 1px solid var(--sy-border);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .12em;
  text-decoration: none;
  font-family: 'Noto Sans TC', sans-serif;
  transition: border-color .25s, color .25s;
}

.sy-btn-detail:hover {
  border-color: var(--sy-cyan);
  color: var(--sy-cyan);
}

.sy-btn-inquiry-sm {
  flex: 1;
  padding: 10px 0;
  text-align: center;
  background: linear-gradient(135deg, #1a3acc, #2550ee);
  color: #fff !important;
  border: none;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-decoration: none;
  font-family: 'Noto Sans TC', sans-serif;
  transition: box-shadow .3s;
}

.sy-btn-inquiry-sm:hover {
  box-shadow: 0 0 16px rgba(26,58,204,.5);
}

/* ── 單品頁 ── */
.sy-single-wrap { padding-top: 0; }

.sy-single-breadcrumb { padding: 80px 0 24px; }

.sy-single-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  margin-bottom: 60px;
}

/* 圖片 */
.sy-single-gallery .woocommerce-product-gallery { margin: 0 !important; }
.sy-single-gallery .woocommerce-product-gallery__image img {
  width: 100% !important;
  height: 400px !important;
  object-fit: cover !important;
}

.sy-single-img-placeholder {
  height: 400px;
  background: linear-gradient(135deg, #001428, #002244);
  border: 1px solid var(--sy-border);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.sy-single-img-placeholder p {
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  letter-spacing: .25em;
  color: rgba(0,180,255,.35);
}

/* 摘要 */
.sy-single-cat {
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  letter-spacing: .3em;
  color: var(--sy-cyan);
  margin-bottom: 12px;
}

.sy-single-title {
  font-size: clamp(28px, 4vw, 42px) !important;
  font-weight: 900 !important;
  letter-spacing: .06em !important;
  color: #fff !important;
  line-height: 1.2 !important;
  margin-bottom: 12px !important;
}

.sy-price-label-lg {
  font-family: 'Share Tech Mono', monospace;
  font-size: 12px;
  letter-spacing: .25em;
  color: var(--sy-grey);
  margin-bottom: 20px;
}

.sy-single-divider {
  height: 2px;
  background: linear-gradient(90deg, #1a3acc, #00ddff, transparent);
  margin: 20px 0;
}

/* 規格表 */
.sy-specs-table {
  background: var(--sy-navy);
  border: 1px solid var(--sy-border);
  margin-bottom: 24px;
}

.sy-specs-title {
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  letter-spacing: .3em;
  color: var(--sy-cyan);
  padding: 14px 20px;
  border-bottom: 1px solid var(--sy-border);
}

.sy-specs-grid { padding: 0 20px; }

.sy-spec-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid rgba(0,180,255,.08);
  font-family: 'Noto Sans TC', sans-serif;
}

.sy-spec-row:last-child { border-bottom: none; }

.sy-spec-label {
  font-size: 13px;
  color: var(--sy-grey);
  font-weight: 300;
  display: flex;
  flex-direction: column;
}

.sy-spec-label small {
  font-size: 10px;
  letter-spacing: .1em;
  color: rgba(120,140,160,.6);
  font-family: 'Share Tech Mono', monospace;
}

.sy-spec-value {
  font-size: 14px;
  color: #fff;
  font-weight: 600;
  letter-spacing: .05em;
}

.sy-spec-value small { font-size: 11px; color: var(--sy-grey); margin-left: 4px; }

/* 單品詢價按鈕 */
.sy-single-inquiry {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin: 24px 0;
}

.sy-btn-inquiry-lg {
  flex: 1;
  min-width: 160px;
  padding: 14px 28px;
  text-align: center;
  background: linear-gradient(135deg, #1a3acc, #2550ee);
  color: #fff !important;
  font-family: 'Noto Sans TC', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .15em;
  text-decoration: none;
  transition: box-shadow .3s, transform .2s;
}

.sy-btn-inquiry-lg:hover {
  box-shadow: 0 0 24px rgba(26,58,204,.55);
  transform: translateY(-2px);
}

.sy-btn-inquiry-outline {
  flex: 1;
  min-width: 140px;
  padding: 14px 28px;
  text-align: center;
  background: transparent;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.3);
  font-family: 'Noto Sans TC', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .1em;
  text-decoration: none;
  transition: border-color .3s, color .3s;
}

.sy-btn-inquiry-outline:hover {
  border-color: var(--sy-cyan);
  color: var(--sy-cyan) !important;
}

.sy-single-contact-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--sy-grey);
  font-family: 'Noto Sans TC', sans-serif;
  font-weight: 300;
}

.sy-single-contact-hint svg { color: var(--sy-cyan); flex-shrink: 0; }

/* 說明區 */
.sy-single-description {
  padding: 40px 0;
  border-top: 1px solid var(--sy-border);
}

.sy-desc-tab-title {
  font-family: 'Share Tech Mono', monospace;
  font-size: 12px;
  letter-spacing: .3em;
  color: var(--sy-cyan);
  margin-bottom: 12px;
}

.sy-single-description .woocommerce-Tabs-panel p,
.sy-single-description p {
  font-size: 15px;
  color: var(--sy-grey-light);
  font-weight: 300;
  line-height: 1.8;
  margin-bottom: 16px;
}

/* 相關產品 */
.sy-related-products { padding: 40px 0 80px; }

.sy-related-title {
  font-family: 'Share Tech Mono', monospace;
  font-size: 12px;
  letter-spacing: .3em;
  color: var(--sy-cyan);
  margin-bottom: 12px;
}

.sy-related-grid { list-style: none; padding: 0; margin: 0; }

/* ── 空產品 ── */
.sy-woo-no-products {
  text-align: center;
  padding: 80px 0;
  color: var(--sy-grey);
}

/* ── 分頁 ── */
.woocommerce-pagination {
  margin-top: 48px;
}

.woocommerce-pagination ul {
  list-style: none;
  display: flex;
  gap: 6px;
  justify-content: center;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--sy-navy);
  border: 1px solid var(--sy-border);
  color: var(--sy-grey-light);
  font-size: 13px;
  text-decoration: none;
  transition: border-color .25s, color .25s, background .25s;
}

.woocommerce-pagination ul li a:hover,
.woocommerce-pagination ul li span.current {
  border-color: var(--sy-cyan);
  color: var(--sy-cyan);
  background: rgba(0,200,255,.08);
}

/* ── WooCommerce notices ── */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  background: var(--sy-navy) !important;
  border-top-color: var(--sy-cyan) !important;
  color: var(--sy-grey-light) !important;
}

/* ── RWD ── */
@media (max-width: 900px) {
  .sy-woo-container { padding: 0 24px; }
  .sy-woo-hero-inner { padding: 0 24px; }
  .sy-woo-cats-inner { padding: 0 24px; overflow-x: auto; }
  .sy-woo-cat-item { padding: 16px 18px; white-space: nowrap; }
  .sy-single-layout { grid-template-columns: 1fr; gap: 32px; }
}

/* ── 強制隱藏分類縮圖（空白卡片來源）── */
.woocommerce ul.products li.product-category,
ul.products li.product-category {
  display: none !important;
}

/* 確保只有真正的產品卡片顯示 */
.woocommerce ul.products li.product:not([class*="type-product"]) {
  display: none !important;
}

/* ── 最終防線：隱藏沒有產品內容的卡片（取無空間）── */
.woocommerce ul.products li.product:not(:has(.sy-product-info)),
ul.products li.product:not(:has(.sy-product-info)) {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

/* ── 修正 WooCommerce .first / .last 衝突 ── */
.woocommerce ul.products li.product.first,
.woocommerce ul.products li.product.last,
ul.products li.product.first,
ul.products li.product.last {
  float: none !important;
  clear: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* 確保 grid 容器完全覆蓋 WooCommerce 預設 */
.woocommerce ul.products,
.woocommerce-page ul.products,
ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  float: none !important;
  clear: both !important;
}

/* ══ 分類導覽列 ═══════════════════════════════════════════ */
.sy-woo-cat-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border: 1px solid rgba(0,180,255,.22);
  margin-bottom: 40px;
  background: #060c1a;
}

.sy-woo-cat-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 24px;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Noto Sans TC', sans-serif;
  letter-spacing: .08em;
  color: #7a8fa8;
  text-decoration: none;
  border-right: 1px solid rgba(0,180,255,.22);
  position: relative;
  transition: color .25s, background .25s;
  white-space: nowrap;
}
.sy-woo-cat-item:last-child { border-right: none; }

/* 底部漸層線 */
.sy-woo-cat-item::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, #1a3acc, #00ddff);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s;
}

.sy-woo-cat-item:hover {
  color: #00ddff;
  background: rgba(0,200,255,.06);
}
.sy-woo-cat-item:hover::after { transform: scaleX(1); }

/* 當前分類：預設展開 */
.sy-woo-cat-item.sy-woo-cat-active {
  color: #00ddff;
  background: rgba(0,200,255,.08);
}
.sy-woo-cat-item.sy-woo-cat-active::after { transform: scaleX(1); }

.sy-woo-cat-item svg { color: #00ddff; flex-shrink: 0; }

/* ══ CTA 區塊 ════════════════════════════════════════════ */
.sy-woo-cta {
  background: linear-gradient(160deg, #0a1535 0%, #020814 100%);
  border-top: 1px solid rgba(0,180,255,.25);
  margin-top: 60px;
  position: relative;
  overflow: hidden;
}
.sy-woo-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 60% at 50% 50%, rgba(26,58,204,.12) 0%, transparent 70%);
  pointer-events: none;
}
.sy-woo-cta-inner {
  max-width: 800px;
  margin: 0 auto;
  padding: 80px 48px;
  text-align: center;
  position: relative;
  z-index: 1;
}
.sy-woo-mono {
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  letter-spacing: .4em;
  color: #00ddff;
  margin-bottom: 16px;
}
.sy-woo-cta-title {
  font-family: 'Noto Sans TC', sans-serif;
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 900;
  color: #fff;
  letter-spacing: .06em;
  margin: 0 0 12px;
  line-height: 1.3;
}
.sy-woo-cta-desc {
  font-size: 16px;
  color: #7a8fa8;
  font-weight: 300;
  margin-bottom: 32px;
  font-family: 'Noto Sans TC', sans-serif;
}
.sy-woo-cta-btns {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

/* 隱藏列表頁價格及按鈕 */
.woocommerce ul.products .price,
.woocommerce ul.products .sy-price-label,
ul.products .price,
ul.products .sy-price-label { display: none !important; }

.sy-loop-btns { display: none !important; }

/* ══ 單品頁圖片修正 ════════════════════════════════════════ */

/* 主圖 1:1 */
.sy-woocommerce .woocommerce-product-gallery__image,
.woocommerce-product-gallery .woocommerce-product-gallery__image {
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
}
.sy-woocommerce .woocommerce-product-gallery__image img,
.woocommerce-product-gallery .woocommerce-product-gallery__image img {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
}

/* 佔位圖改為 1:1 */
.sy-single-img-placeholder {
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
}

/* 小圖水平排列 */
.sy-woocommerce .flex-control-thumbs,
.flex-control-thumbs {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 10px !important;
  padding: 0 !important;
  list-style: none !important;
}
.sy-woocommerce .flex-control-thumbs li,
.flex-control-thumbs li {
  float: none !important;
  width: 72px !important;
  margin: 0 !important;
}
.sy-woocommerce .flex-control-thumbs li img,
.flex-control-thumbs li img {
  width: 72px !important;
  height: 72px !important;
  object-fit: cover !important;
  aspect-ratio: 1 / 1 !important;
  border: 1px solid rgba(0,180,255,.22) !important;
  transition: border-color .25s !important;
}
.sy-woocommerce .flex-control-thumbs li img:hover,
.flex-control-thumbs li img.flex-active {
  border-color: #00ddff !important;
}