/* ============================================================
   woo.css — WooCommerce 購物車／結帳／帳號頁 對齊站台設計系統
   只在 cart / checkout / account 頁 enqueue（inc/woo-integration.php）。
   原則：全走 :root token、中文禁 italic、蓋掉 Woo 預設紫色系。
   ============================================================ */

/* ---------- 版心：購物流程頁放寬（page-article 預設 760px 對表格太窄） ---------- */
.woocommerce-cart .page-article,
.woocommerce-checkout .page-article,
.woocommerce-account .page-article{ max-width: 1000px; }

/* ---------- 通用文字 ---------- */
.woocommerce{
  font-family: var(--font-body);
  color: var(--ink);
}
.woocommerce h2, .woocommerce h3, #order_review_heading{
  font-family: var(--font-display);
  font-size: var(--t-h4);
  font-weight: var(--fw-medium);
  color: var(--ink);
  letter-spacing: -.01em;
  margin: var(--s-6) 0 var(--s-4);
}
.woocommerce a:not(.btn):not(.button){ color: var(--brand); }

/* ---------- 提示訊息（蓋掉 Woo 預設彩條） ---------- */
.woocommerce-message, .woocommerce-info, .woocommerce-error{
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-top: 2px solid var(--brand);
  border-radius: var(--r-sm);
  color: var(--ink);
  font-size: var(--t-body);
  padding: var(--s-3) var(--s-4);
  margin-bottom: var(--s-5);
}
.woocommerce-error{ border-top-color: var(--accent-deep); }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before{ color: var(--brand); }
.woocommerce-error::before{ color: var(--accent-deep); }

/* ---------- 按鈕：全部收斂到站台 .btn 語言（墨底紙字、hover 反轉） ---------- */
.woocommerce .button,
.woocommerce button.button,
.woocommerce a.button,
.woocommerce #place_order,
.wc-proceed-to-checkout a.checkout-button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s-2);
  padding: 12px 18px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: var(--fw-medium);
  letter-spacing: .04em;
  background: var(--ink);
  color: var(--paper);
  border: 1px solid var(--ink);
  border-radius: var(--r-sm);
  transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
  cursor: pointer;
  text-decoration: none;
  line-height: 1.4;
}
.woocommerce .button:hover,
.woocommerce #place_order:hover,
.wc-proceed-to-checkout a.checkout-button:hover{
  background: transparent;
  color: var(--ink);
}
.woocommerce .button:disabled,
.woocommerce .button.disabled{
  background: var(--muted);
  border-color: var(--muted);
  color: var(--paper);
  cursor: not-allowed;
}
.wc-proceed-to-checkout a.checkout-button{
  width: 100%;
  font-size: var(--t-body);
  padding: 14px 18px;
}

/* ---------- 表格（購物車、結帳明細）：細線、無框感 ---------- */
.woocommerce table.shop_table{
  border: 0;
  border-top: 1px solid var(--rule-strong);
  border-radius: 0;
  border-collapse: collapse;
  width: 100%;
  margin-bottom: var(--s-5);
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td{
  border: 0;
  border-bottom: 1px solid var(--rule);
  padding: var(--s-3) var(--s-2);
  font-size: var(--t-body);
  vertical-align: middle;
}
.woocommerce table.shop_table thead th{
  font-size: var(--t-eyebrow);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: var(--fw-semibold);
}
.woocommerce table.shop_table td.product-name a{
  color: var(--ink);
  text-decoration: none;
  font-weight: var(--fw-medium);
}
.woocommerce table.shop_table td.product-name a:hover{ color: var(--brand); }
.woocommerce td.product-thumbnail img{
  width: 64px;
  height: auto;
  border-radius: var(--r-sm);
  display: block;
}
.woocommerce a.remove{
  color: var(--muted) !important;
  font-weight: var(--fw-regular);
  width: 24px; height: 24px; line-height: 22px;
  border-radius: 50%;
  transition: color var(--dur) var(--ease-out), background var(--dur) var(--ease-out);
}
.woocommerce a.remove:hover{
  background: var(--accent-deep) !important;
  color: var(--paper) !important;
}
.woocommerce .woocommerce-Price-amount{ font-variant-numeric: tabular-nums; }

/* ---------- 表單元件 ---------- */
.woocommerce form .form-row label{
  font-size: var(--t-meta);
  color: var(--muted-2);
  font-weight: var(--fw-medium);
  margin-bottom: 4px;
}
.woocommerce form .form-row .required{ color: var(--accent-deep); text-decoration: none; }
.woocommerce .input-text,
.woocommerce input.qty,
.woocommerce select,
.woocommerce textarea{
  font-family: var(--font-body);
  font-size: 16px;               /* ≥16px：避免 iOS 聚焦自動放大 */
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--rule-strong);
  border-radius: var(--r-sm);
  padding: 10px 12px;
  line-height: 1.4;
  width: 100%;
  box-sizing: border-box;
  transition: border-color var(--dur) var(--ease-out);
}
.woocommerce .input-text:focus,
.woocommerce select:focus,
.woocommerce textarea:focus{
  outline: none;
  border-color: var(--ink);
}
.woocommerce input.qty{ width: 72px; text-align: center; }

/* select2（縣市下拉）對齊 input 樣式 */
.select2-container--default .select2-selection--single{
  border: 1px solid var(--rule-strong);
  border-radius: var(--r-sm);
  height: auto;
  padding: 10px 12px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height: 1.4;
  padding: 0;
  color: var(--ink);
  font-size: 16px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{ height: 100%; }
.select2-dropdown{
  border: 1px solid var(--rule-strong);
  border-radius: var(--r-sm);
  font-size: var(--t-body);
}
.select2-container--default .select2-results__option--highlighted[aria-selected]{
  background: var(--ink);
}

/* ---------- 購物車頁 ---------- */
.woocommerce-cart .cart-collaterals .cart_totals{
  float: none;
  width: 100%;
  max-width: 420px;
  margin-left: auto;
}
.woocommerce-cart .cart_totals h2{
  font-size: var(--t-h4);
  margin-top: 0;
}
.woocommerce-cart td.actions{ padding-top: var(--s-4); }
.woocommerce-cart td.actions .button{
  background: transparent;
  color: var(--ink);
  border-color: var(--rule-strong);
}
.woocommerce-cart td.actions .button:hover{ border-color: var(--ink); }

/* 空購物車 */
.cart-empty.woocommerce-info{ text-align: left; }
.woocommerce .return-to-shop{ margin-top: var(--s-4); }

/* ---------- 結帳頁 ---------- */
.woocommerce-checkout .col2-set{ margin-bottom: var(--s-5); }
.woocommerce form .form-row{ margin-bottom: var(--s-3); }
.woocommerce-additional-fields h3{ font-size: var(--t-body-lg); }

/* 付款方式列表 */
.woocommerce-checkout #payment{
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: var(--r-md);
}
.woocommerce-checkout #payment ul.payment_methods{
  border-bottom: 1px solid var(--rule);
  padding: var(--s-4);
}
.woocommerce-checkout #payment ul.payment_methods li{
  padding: var(--s-2) 0;
  font-size: var(--t-body);
}
.woocommerce-checkout #payment ul.payment_methods li label{
  font-weight: var(--fw-medium);
  color: var(--ink);
}
.woocommerce-checkout #payment div.payment_box{
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--r-sm);
  color: var(--muted-2);
  font-size: var(--t-meta);
}
.woocommerce-checkout #payment div.payment_box::before{ display: none; }
.woocommerce-checkout #payment .place-order{ padding: var(--s-4); }
.woocommerce-checkout #place_order{
  width: 100%;
  font-size: var(--t-body);
  padding: 14px 18px;
  float: none;
}

/* ---------- 訂單完成頁（thankyou） ---------- */
.woocommerce-order ul.woocommerce-order-overview{
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-4);
  list-style: none;
  margin: var(--s-5) 0;
  padding: var(--s-4);
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: var(--r-md);
}
.woocommerce-order ul.woocommerce-order-overview li{
  border: 0;
  border-right: 1px solid var(--rule);
  padding: 0 var(--s-4) 0 0;
  margin: 0;
  font-size: var(--t-meta);
  color: var(--muted);
  text-transform: none;
}
.woocommerce-order ul.woocommerce-order-overview li:last-child{ border-right: 0; }
.woocommerce-order ul.woocommerce-order-overview li strong{
  display: block;
  font-size: var(--t-body);
  color: var(--ink);
  margin-top: 2px;
}
.woocommerce-thankyou-order-received{
  font-family: var(--font-display);
  font-size: var(--t-h3);
  color: var(--ink);
  margin-bottom: var(--s-4);
}

/* ---------- 帳號頁（訪客結帳為主，僅基本對齊） ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation ul{
  list-style: none;
  padding: 0;
  border-top: 1px solid var(--rule-strong);
}
.woocommerce-account .woocommerce-MyAccount-navigation li{
  border-bottom: 1px solid var(--rule);
}
.woocommerce-account .woocommerce-MyAccount-navigation li a{
  display: block;
  padding: var(--s-3) 0;
  color: var(--ink);
  text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{ color: var(--brand); }

/* ---------- 響應式 ---------- */
@media (max-width: 768px){
  .woocommerce table.shop_table_responsive tr{
    border-bottom: 1px solid var(--rule);
    padding-block: var(--s-2);
  }
  .woocommerce table.shop_table_responsive td{
    border: 0;
    padding: 6px var(--s-2);
  }
  .woocommerce-cart .cart-collaterals .cart_totals{ max-width: none; }
  .woocommerce-order ul.woocommerce-order-overview{ flex-direction: column; gap: var(--s-2); }
  .woocommerce-order ul.woocommerce-order-overview li{ border-right: 0; padding: 0; }
}
