/**
 * 產品設計頁 — 莫蘭迪配色（只改視覺，不改版面）
 */
#custom-product {
  --ios-bg: var(--md-surface, #E4E9EF);
  --ios-card: var(--md-white, #F5F7FA);
  --ios-separator: var(--md-border, rgba(88, 100, 112, 0.14));
  --ios-label: var(--md-text, #5C6670);
  --ios-secondary: var(--md-text-muted, #8A96A3);
  --ios-tint: var(--md-primary, #7A8FA3);
  --ios-fill: var(--md-primary-softer, rgba(122, 143, 163, 0.08));
}

.container-fluid.py-4[style*="f1f5f9"],
.container-fluid.py-4[style*="E8E5E0"] {
  background: var(--md-surface, #E4E9EF) !important;
}

#custom-product .create-panel {
  background: var(--md-white, #F5F7FA);
  border: 1px solid var(--md-border);
  box-shadow: 0 2px 12px rgba(88, 100, 112, 0.06);
}

#custom-product .create-panel-right {
  background: var(--md-card, #F0F3F7);
  border: none;
  border-radius: 12px;
}

#custom-product .create-panel-right.has-result {
  background: var(--md-white, #F5F7FA);
  border: 1px solid var(--md-border);
}

#custom-product .prompt-hero,
#custom-product .form-control,
#custom-product .form-select {
  border-color: var(--md-border);
  border-radius: 10px;
  background: var(--md-white, #F5F7FA);
  color: var(--md-text);
}

#custom-product .prompt-hero:focus,
#custom-product .form-control:focus,
#custom-product .form-select:focus {
  border-color: var(--md-primary);
  box-shadow: 0 0 0 3px var(--md-primary-soft);
}

#custom-product .form-row .label,
#custom-product .label {
  color: var(--md-text);
  font-weight: 600;
}

#custom-product .form-text,
#custom-product .page-sub,
#custom-product .design-flow-steps {
  color: var(--md-text-muted);
}

#custom-product .design-flow-steps {
  border-left-color: var(--md-primary);
}

#custom-product #designTabs,
#custom-product #designTabGroups .cp-tab-group-tabs {
  border-bottom: 1px solid var(--md-border);
}

#custom-product #designTabs .nav-link,
#custom-product #designTabGroups .cp-tab-group-tabs .nav-link {
  color: var(--md-text-muted);
  border-bottom-width: 2px;
  font-weight: 500;
}

#custom-product #designTabs .nav-link.active,
#custom-product #designTabGroups .cp-tab-group-tabs .nav-link.active {
  color: var(--md-primary);
  border-bottom-color: var(--md-primary);
}

#custom-product .cp-tab-group-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--md-text-muted);
  margin-bottom: 0.25rem;
}

#custom-product .btn-generate,
#custom-product .promo-generate-btn {
  background: var(--md-primary);
  border: none;
  border-radius: 12px;
}

#custom-product .btn-generate:hover,
#custom-product .promo-generate-btn:hover {
  background: var(--md-primary-dark);
}

#custom-product .design-ai-disclaimer {
  background: var(--md-clay-bg);
  border: 1px solid var(--md-clay-border);
  border-left: 4px solid var(--md-clay);
  border-radius: 8px;
  color: var(--md-clay-text);
}

#custom-product .design-ai-disclaimer-icon {
  color: var(--md-clay);
}

#custom-product .past-gallery .past-item,
#custom-product .past-gallery-inner .past-item {
  border: 1px solid var(--md-border);
  box-shadow: 0 1px 2px rgba(88, 100, 112, 0.06);
}

#custom-product .dap-tab.active {
  background: var(--md-primary);
  border-color: var(--md-primary);
}

#custom-product .prompt-ref-tips-btn {
  color: var(--md-rose-text);
  border-color: var(--md-rose);
  background: var(--md-rose-bg);
}

#custom-product .prompt-ref-tips-btn:hover {
  background: var(--md-rose);
  border-color: var(--md-rose);
  color: #fff;
}

/* 數位資產選擇器（設計頁） */
#custom-product .dap-tab {
  border-color: rgba(88, 100, 112, 0.14);
  background: #F5F7FA;
  color: #8A96A3;
}
#custom-product .dap-tab.active {
  background: var(--md-primary, #7A8FA3);
  border-color: var(--md-primary, #7A8FA3);
  color: #fff;
}
#custom-product .dap-card {
  border-color: rgba(88, 100, 112, 0.14);
  background: #F5F7FA;
}
#custom-product .dap-card:hover {
  border-color: var(--md-primary, #7A8FA3);
  box-shadow: 0 2px 8px rgba(122, 143, 163, 0.12);
}
#custom-product .dap-thumb-wrap {
  background: #EAEEF3;
}
#custom-product .dap-badge {
  background: rgba(122, 143, 163, 0.88);
}
#custom-product .dap-title {
  color: #8A96A3;
}

/* 設計頁 Tab、廠商版型切換鈕（覆蓋 style.css !important） */
#custom-product #designTabs .nav-link {
  color: var(--md-text-muted, #8A96A3);
}
#custom-product #designTabs .nav-link:hover {
  color: var(--md-text, #5C6670);
}
#custom-product #designTabs .nav-link.active {
  color: var(--md-primary, #7A8FA3) !important;
  border-bottom-color: var(--md-primary, #7A8FA3) !important;
  background: transparent !important;
}

#custom-product #bs-category-summary {
  background: var(--md-card, #F0F3F7) !important;
  border-color: var(--md-border) !important;
  color: var(--md-text, #5C6670);
}

#custom-product #bs-go-set-category {
  color: var(--md-primary, #7A8FA3) !important;
  font-weight: 500;
}
#custom-product #bs-go-set-category:hover {
  color: var(--md-primary-dark, #657A8E) !important;
  text-decoration: underline !important;
}

#custom-product #bs-browse-mode-toggle .btn-primary,
#custom-product #bs-browse-mode-toggle .btn-primary.active {
  background-color: var(--md-primary, #7A8FA3) !important;
  border-color: var(--md-primary, #7A8FA3) !important;
  color: #fff !important;
}
#custom-product #bs-browse-mode-toggle .btn-primary:hover {
  background-color: var(--md-primary-dark, #657A8E) !important;
  border-color: var(--md-primary-dark, #657A8E) !important;
}
#custom-product #bs-browse-mode-toggle .btn-outline-primary {
  color: var(--md-text-muted, #8A96A3) !important;
  border-color: var(--md-border) !important;
  background: var(--md-white, #F5F7FA) !important;
}
#custom-product #bs-browse-mode-toggle .btn-outline-primary:hover,
#custom-product #bs-browse-mode-toggle .btn-outline-primary.active {
  color: var(--md-primary, #7A8FA3) !important;
  border-color: rgba(122, 143, 163, 0.45) !important;
  background: var(--md-primary-softer, rgba(122, 143, 163, 0.08)) !important;
}

#custom-product .bs-btn-select-design.btn-primary {
  background-color: var(--md-primary, #7A8FA3) !important;
  border-color: var(--md-primary, #7A8FA3) !important;
}
