/* =========================================================
   商店相關頁面（商店、商品、購物車、結帳、我的帳戶）
   只在 wuxingren_is_store_context() 為真時載入。
   - 這些頁面的 body 都有 .woocommerce-page（.woocommerce 只有商店、商品頁有），選擇器一律用它。
   - WooCommerce 自己的樣式先載入、區塊樣式甚至印在頁尾，覆寫區塊元件時前面加 body 提高權重。
   ========================================================= */

.shop-main{ padding-top:96px; padding-bottom:110px; }
.shop-main,
.shop-main button,
.shop-main input,
.shop-main select,
.shop-main textarea{ font-family:var(--sans); }
/* 全站 section 有上下 120px 內距（首頁用），WooCommerce 的訂單明細、相關商品也是 section，這裡歸零 */
.shop-main section{ padding:0; }

/* ---------- 共用：標題、按鈕、表單、提示 ---------- */
.shop-main .page-title,
.shop-main .product_title{
  font-family:var(--serif); font-weight:600; color:var(--ink);
  font-size:clamp(28px,4vw,42px); line-height:1.3; margin:0 0 32px;
}
.shop-sec-title,
.shop-main .related > h2,
.shop-main .upsells > h2,
.shop-main .woocommerce-MyAccount-content h2,
.shop-main .woocommerce-order-details__title,
.shop-main .woocommerce-column__title{
  font-family:var(--serif); font-weight:600; color:var(--ink);
  font-size:22px; margin:0 0 20px;
}

.woocommerce-page .shop-main a.button,
.woocommerce-page .shop-main button.button,
.woocommerce-page .shop-main .button.alt{
  font-family:var(--sans); font-size:15px; font-weight:600; letter-spacing:.02em;
  background:var(--purple); color:var(--paper); border:1px solid var(--purple);
  border-radius:3px; padding:12px 26px; line-height:1.4;
  transition:background .16s ease, border-color .16s ease;
}
.woocommerce-page .shop-main a.button:hover,
.woocommerce-page .shop-main button.button:hover,
.woocommerce-page .shop-main .button.alt:hover{
  background:#38264f; border-color:#38264f; color:var(--paper);
}

/* 傳統表單（我的帳戶、登入）。不能寫成整頁的 input／select：
   區塊版結帳的欄位靠上方內距讓出浮動標籤的位置，被蓋掉會變成標籤和內容疊在一起。 */
.woocommerce-page .shop-main form .form-row label{ color:var(--ink-soft); font-size:14px; line-height:1.6; }
.woocommerce-page .shop-main :is(.woocommerce-MyAccount-content, form.login, form.register, form.lost_reset_password) :is(.input-text, input[type="email"], input[type="text"], input[type="tel"], input[type="number"], input[type="password"], input[type="datetime-local"], select){
  width:100%; border:1px solid var(--ink-faint); background:#fff; border-radius:3px;
  padding:11px 14px; font-size:15px; color:var(--ink); line-height:1.5;
  box-shadow:none;
}
.woocommerce-page .shop-main :is(.woocommerce-MyAccount-content, form.login, form.register, form.lost_reset_password) :is(input, select):focus{ outline:0; border-color:var(--purple); }
/* 我的帳戶地址的「縣/市」：WooCommerce 會換成可搜尋的下拉元件（selectWoo），框線跟著輸入框 */
.woocommerce-page .shop-main .select2-container--default .select2-selection--single{ border-color:var(--ink-faint); border-radius:3px; }
.shop-main input[type="checkbox"]{ accent-color:var(--purple); }

/* 傳統版提示（我的帳戶、查看訂單）：WooCommerce 的彩色上框換成九紫左線 */
.woocommerce-page .shop-main .woocommerce-message,
.woocommerce-page .shop-main .woocommerce-info,
.woocommerce-page .shop-main .woocommerce-error,
.shop-main .wx-app-account-cart-notice{
  background:#fff; color:var(--ink-soft); border:1px solid var(--line);
  border-left:3px solid var(--purple); border-radius:3px;
  padding:16px 20px; margin:0 0 28px; font-size:14.5px; line-height:1.8;
}
.woocommerce-page .shop-main .woocommerce-error{ border-left-color:#b3261e; }
.woocommerce-page .shop-main .woocommerce-message::before,
.woocommerce-page .shop-main .woocommerce-info::before,
.woocommerce-page .shop-main .woocommerce-error::before{ display:none; }
.woocommerce-page .shop-main .woocommerce-message a,
.woocommerce-page .shop-main .woocommerce-info a,
.woocommerce-page .shop-main .woocommerce-error a,
.shop-main .wx-app-account-cart-notice a{ color:var(--purple); font-weight:600; }
.woocommerce-page .shop-main .woocommerce-message .button,
.woocommerce-page .shop-main .woocommerce-info .button{ float:none; margin-left:12px; padding:6px 16px; font-size:13.5px; color:var(--paper); }

/* ---------- 商店列表 ---------- */
.woocommerce-page .shop-main ul.products{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 260px), 1fr));
  gap:40px 32px; margin:0; padding:0;
}
.woocommerce-page .shop-main ul.products::before,
.woocommerce-page .shop-main ul.products::after{ display:none; }
.woocommerce-page .shop-main ul.products li.product{
  width:auto; float:none; margin:0; padding:0; display:flex; flex-direction:column;
}
.woocommerce-page .shop-main ul.products li.product a img{
  margin:0 0 18px; border:1px solid var(--line); border-radius:3px; background:#EFE9DD;
  aspect-ratio:1/1; object-fit:cover;
}
.woocommerce-page .shop-main ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--serif); font-weight:600; font-size:19px; color:var(--ink);
  padding:0; margin:0 0 6px; line-height:1.45;
}
.woocommerce-page .shop-main ul.products li.product .price{
  color:var(--ink-soft); font-size:15px; margin:0 0 18px; font-weight:500;
}
.woocommerce-page .shop-main ul.products li.product .button{ margin-top:auto; align-self:flex-start; }
/* 加入購物車後 WooCommerce 會在按鈕下面插「查看購物車」，卡片變高會把同一排的按鈕推下去；
   改由頁首購物車圖示顯示數量，這個連結不顯示。 */
.woocommerce-page .shop-main ul.products li.product a.added_to_cart{ display:none; }

/* 商店頁依分類分段 */
.shop-main .shop-cat{ margin:0 0 72px; }
.shop-main .shop-cat:last-child{ margin-bottom:0; }
.shop-main .shop-cat-title{ font-family:var(--serif); font-weight:700; font-size:24px; color:var(--ink); margin:0 0 8px; }
.shop-main .shop-cat-title a{ color:inherit; text-decoration:none; }
.shop-main .shop-cat-title a:hover{ color:var(--purple); }
.shop-main .shop-cat-intro{ color:var(--ink-soft); font-size:15px; line-height:1.8; max-width:640px; margin:0 0 28px; }

/* 分類頁開頭的介紹 */
.woocommerce-page .shop-main .term-description{ max-width:680px; color:var(--ink-soft); font-size:15.5px; line-height:1.9; margin:-12px 0 40px; }
.woocommerce-page .shop-main .term-description p{ margin:0 0 14px; }

/* 麵包屑（商品頁、分類頁） */
.woocommerce-page .shop-main .shop-breadcrumb{ font-size:13.5px; color:var(--ink-faint); margin:0 0 28px; line-height:1.7; }
.woocommerce-page .shop-main .shop-breadcrumb a{ color:var(--ink-soft); text-decoration:none; }
.woocommerce-page .shop-main .shop-breadcrumb a:hover{ color:var(--purple); }
.woocommerce-page .shop-main .shop-breadcrumb .sep{ margin:0 8px; }

/* ---------- 單一商品 ---------- */
.woocommerce-page .shop-main div.product{ margin:0; }
.woocommerce-page .shop-main div.product div.images,
.woocommerce-page .shop-main div.product div.summary{ margin-bottom:56px; }
.woocommerce-page .shop-main div.product div.images img{
  border:1px solid var(--line); border-radius:3px; background:#EFE9DD;
}
.woocommerce-page .shop-main div.product .product_title{ font-size:clamp(26px,3.4vw,34px); margin-bottom:14px; }
.woocommerce-page .shop-main div.product p.price,
.woocommerce-page .shop-main div.product span.price{
  color:var(--purple); font-size:24px; font-weight:600; margin:0 0 22px;
}
.woocommerce-page .shop-main div.product .woocommerce-product-details__short-description{
  color:var(--ink-soft); font-size:15.5px; line-height:1.9; margin-bottom:22px;
}
.woocommerce-page .shop-main div.product .woocommerce-product-details__short-description p{ margin:0 0 10px; }
.shop-main .wx-app-account-notice{
  font-size:14px; line-height:1.8; color:var(--ink-soft);
  background:#fff; border:1px solid var(--line); border-left:3px solid var(--purple);
  border-radius:3px; padding:12px 16px; margin:0 0 24px;
}
.shop-main .wx-app-account-notice a{ color:var(--purple); font-weight:600; }
.woocommerce-page .shop-main div.product form.cart{ display:flex; gap:12px; align-items:stretch; margin-bottom:0; }
.woocommerce-page .shop-main div.product form.cart::before,
.woocommerce-page .shop-main div.product form.cart::after{ display:none; }
.woocommerce-page .shop-main div.product form.cart div.quantity{ float:none; margin:0; }
.woocommerce-page .shop-main .quantity .qty{
  width:4.2em; height:100%; min-height:46px; text-align:center;
  border:1px solid var(--line); border-radius:3px; background:#fff; font-size:15px;
}
.woocommerce-page .shop-main div.product form.cart .button{ float:none; flex:1 1 auto; max-width:260px; }

.shop-main .shop-description{ border-top:1px solid var(--line); padding-top:44px; margin-bottom:56px; clear:both; }
.shop-description .prose{ max-width:680px; }
.shop-description .prose h2{ font-size:18px; margin:32px 0 12px; }
.shop-description .prose h2:first-child{ margin-top:0; }
/* 商品說明區的標題用粗體 700（全站標題是 600），段落標題才看得出層次（2026-09-25 Jerry） */
.shop-description .shop-sec-title,
.shop-description .prose h2,
.shop-description .prose h3{ font-weight:700; }
.shop-description .prose ol{ margin:0 0 18px; padding-left:22px; }
.woocommerce-page .shop-main .related,
.woocommerce-page .shop-main .upsells{ border-top:1px solid var(--line); padding-top:44px; clear:both; }

/* ---------- 我的帳戶 ---------- */
.woocommerce-account .shop-main .woocommerce-MyAccount-navigation,
.woocommerce-account .shop-main .woocommerce-MyAccount-content{ float:none; width:auto; }
.woocommerce-account .shop-main .woocommerce-MyAccount-navigation{ margin:0 0 36px; border-bottom:1px solid var(--line); }
.woocommerce-account .shop-main .woocommerce-MyAccount-navigation ul{
  list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:4px 28px;
}
.woocommerce-account .shop-main .woocommerce-MyAccount-navigation li{ margin:0; }
.woocommerce-account .shop-main .woocommerce-MyAccount-navigation a{
  display:inline-block; padding:10px 0 12px; font-size:15px; color:var(--ink-soft);
  text-decoration:none; position:relative;
}
.woocommerce-account .shop-main .woocommerce-MyAccount-navigation a:hover{ color:var(--purple); }
.woocommerce-account .shop-main .woocommerce-MyAccount-navigation li.is-active a{ color:var(--purple); font-weight:600; }
.woocommerce-account .shop-main .woocommerce-MyAccount-navigation li.is-active a::after{
  content:''; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--purple);
}
.woocommerce-account .shop-main .woocommerce-MyAccount-content{ color:var(--ink-soft); font-size:15.5px; line-height:1.9; }
.woocommerce-account .shop-main .woocommerce-MyAccount-content a{ color:var(--purple); }
.woocommerce-account .shop-main .woocommerce-MyAccount-content a.button{ color:var(--paper); }
.woocommerce-account .shop-main .woocommerce-MyAccount-content > p:first-child{ margin-top:0; }
.woocommerce-account .shop-main .woocommerce-order-details,
.woocommerce-account .shop-main .woocommerce-customer-details{ margin:0 0 40px; }

.shop-main .wx-app-account,
.shop-main .wx-payment-report{ max-width:560px; }
.shop-main .wx-payment-report{
  background:#fff; border:1px solid var(--line); border-radius:3px; padding:26px 28px; margin:0 0 40px;
}
.shop-main .wx-payment-report h2{ margin-bottom:10px; }
.woocommerce-page .shop-main .wx-app-account-form .form-row,
.woocommerce-page .shop-main .wx-payment-report-form .form-row{ padding:0; margin:0 0 18px; }
.woocommerce-page .shop-main .wx-app-account-form .button + .button{ margin-left:8px; }
.woocommerce-page .shop-main .wx-app-account-form .button[value="resend_code"],
.woocommerce-page .shop-main .wx-app-account-form .button[value="change_email"]{
  background:transparent; color:var(--ink-soft); border-color:var(--line); font-weight:500;
}
.woocommerce-page .shop-main .wx-app-account-form .button[value="resend_code"]:hover,
.woocommerce-page .shop-main .wx-app-account-form .button[value="change_email"]:hover{
  background:transparent; color:var(--purple); border-color:var(--purple);
}

/* 登入表單 */
.woocommerce-page .shop-main form.login,
.woocommerce-page .shop-main form.register{
  border:1px solid var(--line); border-radius:3px; background:#fff; padding:28px; margin:0 0 32px; max-width:480px;
}

/* 表格（訂單列表、訂單明細）與地址 */
.woocommerce-page .shop-main table.shop_table{
  border:1px solid var(--line); border-radius:3px; border-collapse:separate; background:#fff; font-size:14.5px;
}
.woocommerce-page .shop-main table.shop_table th,
.woocommerce-page .shop-main table.shop_table td{ border-top-color:var(--line); padding:12px 14px; }
.woocommerce-page .shop-main table.shop_table th{ color:var(--ink); font-weight:600; }
.woocommerce-page .shop-main table.shop_table td a{ color:var(--purple); }
.woocommerce-page .shop-main table.shop_table .button{ padding:6px 14px; font-size:13.5px; margin:2px 4px 2px 0; color:var(--paper); }
.woocommerce-page .shop-main mark{ background:transparent; color:var(--ink); font-weight:600; }
/* 只限傳統頁面：區塊版結帳的地址卡片裡也有 <address>，套到會變成框中框 */
.woocommerce-account .shop-main address,
.woocommerce-order-received .shop-main address{
  border:1px solid var(--line); border-radius:3px; background:#fff; padding:14px 16px;
  font-style:normal; line-height:1.8; margin-bottom:32px;
}

/* ---------- 區塊版購物車與結帳 ---------- */
body .shop-main .wc-block-components-button:not(.is-link){
  font-family:var(--sans); font-weight:600; letter-spacing:.02em;
  background:var(--purple); color:var(--paper); border-radius:3px; min-height:50px;
}
body .shop-main .wc-block-components-button:not(.is-link):hover,
body .shop-main .wc-block-components-button:not(.is-link):focus{
  background:#38264f; color:var(--paper);
}
body .shop-main .wc-block-components-button:not(.is-link) .wc-block-components-button__text{ color:inherit; }
body .shop-main .wc-block-components-button.is-link{ color:var(--purple); }

body .shop-main .wc-block-components-title,
body .shop-main .wc-block-components-checkout-step__title,
body .shop-main .wc-block-cart__totals-title{
  font-family:var(--serif); font-weight:600; color:var(--ink);
}
/* 輸入框與下拉選單統一框線。用 --ink-faint 而不是 --line：淡框線在宣紙底上幾乎看不見（對比約 1.3:1）。
   input 加 :is([type]) 是為了權重高過 WooCommerce 的 .wc-block-components-form .wc-block-components-text-input input[type=text] */
body .shop-main .wc-block-components-text-input input:is([type="text"],[type="email"],[type="tel"],[type="number"]),
body .shop-main .wc-block-components-combobox .wc-block-components-combobox-control input,
body .shop-main .wc-blocks-components-select .wc-blocks-components-select__select,
body .shop-main .wc-block-components-textarea{
  border-color:var(--ink-faint); border-radius:3px; background:#fff; color:var(--ink);
}
body .shop-main .wc-block-components-text-input input:is([type="text"],[type="email"],[type="tel"],[type="number"]):focus,
body .shop-main .wc-blocks-components-select .wc-blocks-components-select__select:focus,
body .shop-main .wc-block-components-textarea:focus{
  border-color:var(--purple); box-shadow:0 0 0 1px var(--purple); outline:0;
}
body .shop-main .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]{ border-color:var(--ink-faint); border-radius:3px; }
body .shop-main .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked{ background:var(--purple); border-color:var(--purple); }
body .shop-main .wc-block-components-checkbox .wc-block-components-checkbox__mark{ fill:var(--paper); }
body .shop-main .wc-block-components-radio-control__input:checked{ border-color:var(--purple); }
body .shop-main .wc-block-components-radio-control__input:checked::before{ background:var(--purple); }
body .shop-main .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
body .shop-main .wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted{
  box-shadow:inset 0 0 0 1.5px var(--purple); border-radius:3px;
}

body .shop-main .wc-block-components-notice-banner{
  border-radius:3px; font-size:14.5px; line-height:1.8; color:var(--ink-soft);
  background:#fff; border:1px solid var(--line); border-left-width:3px;
}
body .shop-main .wc-block-components-notice-banner.is-error{ border-left-color:#b3261e; }
body .shop-main .wc-block-components-notice-banner.is-info,
body .shop-main .wc-block-components-notice-banner.is-success{ border-left-color:var(--purple); }

body .shop-main .wc-block-components-product-name{ color:var(--ink); font-weight:600; text-decoration:none; }
body .shop-main .wc-block-components-product-metadata{ color:var(--ink-faint); }
body .shop-main .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
body .shop-main .wc-block-components-totals-footer-item .wc-block-components-totals-item__label{ color:var(--ink); }
body .shop-main .wc-block-components-address-card{ border-color:var(--line); border-radius:3px; background:#fff; }
body .shop-main .wc-block-components-address-card__edit{ color:var(--purple); }
body .shop-main .wc-block-checkout__terms,
body .shop-main .wc-block-components-checkout-return-to-cart-button{ color:var(--ink-faint); }
body .shop-main .wc-block-checkout__terms a{ color:var(--purple); }

/* ---------- 手機 ---------- */
@media (max-width:720px){
  .shop-main{ padding-top:64px; padding-bottom:80px; }
  .woocommerce-page .shop-main div.product form.cart .button{ max-width:none; }
  .woocommerce-account .shop-main .woocommerce-MyAccount-navigation ul{ gap:0 20px; }
  .woocommerce-account .shop-main .woocommerce-MyAccount-navigation a{ font-size:14.5px; padding:8px 0 10px; }
  .shop-main .wx-payment-report{ padding:22px 20px; }
  .woocommerce-page .shop-main .wx-payment-report-form .form-row-first,
  .woocommerce-page .shop-main .wx-payment-report-form .form-row-last{ width:100%; float:none; }
}
