/* ===================================================================
   TisiShop 主題覆寫 - Cartzilla 原有顏色替換
   ================================================================ */

/* ===================================================================
   Header 背景（保持深色專業感）
   ================================================================ */

.navbar-dark,
.bg-dark {
  background: var(--dark-bg) !important;
}

.navbar-dark .navbar-nav .nav-link {
  color: rgba(255, 255, 255, 0.85) !important;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: var(--morandi-pink) !important;
}

.navbar-dark .navbar-brand {
  color: white !important;
}

/* ===================================================================
   Footer 背景（保持深色專業感）
   ================================================================ */

.footer-dark,
.bg-darker {
  background: var(--dark-bg) !important;
}

.footer-dark .widget-title,
.footer-dark h6 {
  color: white !important;
}

.footer-dark a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.footer-dark a:hover {
  color: var(--morandi-pink) !important;
}

/* ===================================================================
   價格文字（深莫蘭迪粉確保對比度）
   ================================================================ */

.product-price,
.text-accent,
.price {
  color: var(--morandi-pink-deep) !important;
  font-weight: 600;
}

.product-price del,
.price del {
  color: var(--text-secondary) !important;
  font-weight: 400;
}

/* ===================================================================
   Badge 徽章
   ================================================================ */

.badge-primary {
  background-color: var(--morandi-pink) !important;
  color: white !important;
}

.badge-info {
  background-color: var(--morandi-pink-dark) !important;
}

/* 產品標籤 */
.product-badge {
  background-color: var(--morandi-pink) !important;
}

/* ===================================================================
   表單選中狀態（扁平設計）
   ================================================================ */

.form-check-input:checked {
  background-color: var(--morandi-pink) !important;
  border-color: var(--morandi-pink) !important;
  box-shadow: none !important;
}

.form-check-input:focus {
  border-color: var(--morandi-pink) !important;
  box-shadow: 0 0 0 0.2rem rgba(232, 201, 188, 0.25) !important;
}

/* Radio 與 Checkbox */
.form-option-label {
  border-color: var(--border-light);
  transition: all 0.3s ease;
}

.form-option input[type="radio"]:checked ~ .form-option-label,
.form-option input[type="checkbox"]:checked ~ .form-option-label {
  border-color: var(--morandi-pink) !important;
  background-color: var(--morandi-pink) !important;
  color: white !important;
}

/* ===================================================================
   分頁器
   ================================================================ */

.page-link {
  color: var(--morandi-pink-deep) !important;
  border-color: var(--border-light);
}

.page-link:hover {
  color: var(--morandi-pink) !important;
  background-color: rgba(232, 201, 188, 0.1) !important;
  border-color: var(--morandi-pink) !important;
}

.page-item.active .page-link {
  background-color: var(--morandi-pink) !important;
  border-color: var(--morandi-pink) !important;
  color: white !important;
  box-shadow: none !important;
}

.page-item.disabled .page-link {
  color: var(--text-secondary) !important;
  border-color: var(--border-light) !important;
}

/* ===================================================================
   商品卡片
   ================================================================ */

.card-product {
  border-color: var(--border-light);
  transition: all 0.3s ease;
}

.card-product:hover {
  border-color: var(--morandi-pink) !important;
  box-shadow: var(--shadow-md);
  transform: translateY(-4px);
}

.card-product .card-body {
  background: var(--card-bg);
}

/* 商品卡片按鈕 */
.card-product .btn-primary {
  background: var(--morandi-pink) !important;
  border-color: var(--morandi-pink) !important;
}

/* ===================================================================
   Icon 強調色
   ================================================================ */

.text-primary,
i.text-primary,
.icon-primary {
  color: var(--morandi-pink-deep) !important;
}

.text-accent,
i.text-accent {
  color: var(--morandi-pink-deep) !important;
}

/* ===================================================================
   Breadcrumb 麵包屑
   ================================================================ */

.breadcrumb-item.active {
  color: var(--morandi-pink-deep) !important;
}

.breadcrumb-item a {
  color: var(--text-secondary);
}

.breadcrumb-item a:hover {
  color: var(--morandi-pink) !important;
}

/* ===================================================================
   Alert 提示框
   ================================================================ */

.alert-info {
  background-color: rgba(232, 201, 188, 0.1) !important;
  border-color: var(--morandi-pink) !important;
  color: var(--morandi-pink-deep) !important;
}

.alert-primary {
  background-color: rgba(232, 201, 188, 0.15) !important;
  border-color: var(--morandi-pink) !important;
  color: var(--text-primary) !important;
}

/* ===================================================================
   Toast 通知
   ================================================================ */

.toast-header {
  background-color: var(--morandi-pink);
  color: white;
}

/* ===================================================================
   Spinner 載入動畫
   ================================================================ */

.spinner-border.text-primary,
.spinner-grow.text-primary {
  color: var(--morandi-pink) !important;
}

/* ===================================================================
   Progress Bar 進度條
   ================================================================ */

.progress-bar {
  background-color: var(--morandi-pink) !important;
}

/* ===================================================================
   List Group
   ================================================================ */

.list-group-item.active {
  background-color: var(--morandi-pink) !important;
  border-color: var(--morandi-pink) !important;
}

.list-group-item-action:hover {
  background-color: rgba(232, 201, 188, 0.05);
}

/* ===================================================================
   Nav Tabs / Pills
   ================================================================ */

.nav-tabs .nav-link.active {
  color: var(--morandi-pink-deep) !important;
  border-bottom-color: var(--morandi-pink) !important;
}

.nav-pills .nav-link.active {
  background-color: var(--morandi-pink) !important;
}

/* ===================================================================
   Dropdown
   ================================================================ */

.dropdown-item:active,
.dropdown-item.active {
  background-color: var(--morandi-pink) !important;
  color: white !important;
}

.dropdown-item:hover {
  background-color: rgba(232, 201, 188, 0.1);
  color: var(--morandi-pink-deep);
}

/* ===================================================================
   Widget / Sidebar
   ================================================================ */

.widget-title {
  color: var(--text-primary);
}

.widget-list-link {
  color: var(--text-secondary);
}

.widget-list-link:hover {
  color: var(--morandi-pink) !important;
}

/* ===================================================================
   購物車相關
   ================================================================ */

.cart-item {
  border-color: var(--border-light);
}

.cart-total {
  color: var(--morandi-pink-deep) !important;
  font-weight: 700;
}

/* ===================================================================
   Cartzilla 特定類別覆寫
   ================================================================ */

/* 主要強調文字 */
.text-accent {
  color: var(--morandi-pink-deep) !important;
}

/* Star Rating */
.star-rating i {
  color: var(--morandi-pink) !important;
}

/* Social 按鈕 */
.btn-social {
  border-color: var(--border-light);
}

.btn-social:hover {
  border-color: var(--morandi-pink) !important;
  color: var(--morandi-pink) !important;
}

/* ===================================================================
   背景色類別
   ================================================================ */

.bg-primary {
  background-color: var(--morandi-pink) !important;
}

.bg-light {
  background-color: var(--light-bg) !important;
}

/* ===================================================================
   響應式調整
   ================================================================ */

@media (max-width: 768px) {
  .navbar-dark .navbar-toggler {
    border-color: var(--morandi-pink);
  }

  .navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23E8C9BC' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }
}
