/* ==========================================================================
   Botiga Child — v1.1 視覺修訂（theme-visual-revision-spec R-1 ~ R-10）
   2026-09-05 阿碼實作。本檔由 functions.php 以 priority 999 enqueue，
   載於 Botiga custom-styles.css 之後 → 同 specificity 以「後載入」勝出；
   與母主題/全域樣式衝突處另加 !important 硬蓋。
   只改版型視覺層；不動商品資料、不動母主題。
   ========================================================================== */

/* --------------------------------------------------------------------------
   R-1 商品分類 pills 導覽列 — 已移除（2026-09-06 工單，結構已從 functions.php 刪除）
   原 .bt-cat-nav 樣式段（桌面＋手機）同步清除。
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   R-11 列表頁頂部精簡（2026-09-06 工單）：
   ① woocommerce-page-header 行高/留白調小（原母主題 80px/80px 過高）
   ② result count 文字已由 functions.php 移除 → 左欄空置：隱藏左欄、排序欄全寬靠右
   -------------------------------------------------------------------------- */
.woocommerce-page-header{padding-top:clamp(12px,1.6vw,20px) !important;padding-bottom:clamp(8px,1vw,12px) !important;margin-bottom:0 !important}
.woocommerce-page-header + .content-wrapper{margin-top:clamp(10px,1.4vw,16px) !important;margin-bottom:clamp(20px,3vw,40px) !important}
.woocommerce-page-header .woocommerce-breadcrumb{margin:0 0 2px !important;line-height:1.4}
.woocommerce-page-header .woocommerce-products-header__title{line-height:1.1 !important;margin:0 !important}
.woocommerce-sorting-wrapper{margin-bottom:16px !important;padding-bottom:12px !important}
.woocommerce-sorting-wrapper .botiga-sorting-left{display:none !important}
.woocommerce-sorting-wrapper .botiga-sorting-right{flex:0 0 100% !important;max-width:100% !important;width:100% !important;justify-content:flex-end !important}

/* --------------------------------------------------------------------------
   R-2 Header 主列：三欄 auto（選單單行不折）＋緊湊梯次
   Botiga desktop header 於 ≥1025px 顯示（≤1024 走 mobile hamburger，天然單行）
   -------------------------------------------------------------------------- */
@media (min-width:1025px){
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-row{grid-template-columns:auto auto auto !important;column-gap:clamp(14px,2vw,36px) !important}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-column-1,.bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-column-3{min-width:0}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-column-1 .bhfb-component-menu{justify-content:flex-start;max-width:none;width:auto}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-column-2{justify-content:center}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-column-3{justify-content:flex-end}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row nav.main-navigation{max-width:none;white-space:nowrap}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .botiga-dropdown-ul{flex-wrap:nowrap !important;white-space:nowrap}
  .bhfb-header .main-navigation .botiga-dropdown-ul>li>a{padding:18px 12px;font-size:15px;white-space:nowrap}
  .bhfb-header.bhfb-desktop .bhfb-component-woo_icons .header-item{--bt-bhfb-woo-icons-gap:18px}
}
/* 窄桌機 1101–1279：輕縮 padding/字距 */
@media (min-width:1101px) and (max-width:1279px){
  .bhfb-header .main-navigation .botiga-dropdown-ul>li>a{padding:18px 9px;font-size:14.5px}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-row{column-gap:clamp(10px,1.6vw,22px) !important}
}
/* 極窄桌機 1025–1100：緊湊梯次（font 13.5 + padding 6 + icon 間距縮小） */
@media (min-width:1025px) and (max-width:1100px){
  .bhfb-header .main-navigation .botiga-dropdown-ul>li>a{padding:18px 6px;font-size:13.5px;letter-spacing:.01em}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-row{column-gap:12px !important}
  .bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-column-1 .bhfb-builder-item + .bhfb-builder-item,.bhfb-header.bhfb-desktop .bhfb-main_header_row .bhfb-column-3 .bhfb-builder-item + .bhfb-builder-item{margin-left:10px}
  .bhfb-header.bhfb-desktop .bhfb-component-woo_icons .header-item{--bt-bhfb-woo-icons-gap:12px}
  .bhfb-header.bhfb-desktop .bhfb-component-logo .site-title{font-size:17px}
}

/* --------------------------------------------------------------------------
   R-3 頂欄 — 已移除（2026-09-06 工單：整列不再輸出，樣式清除）
   -------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------
   R-4 手機 offcanvas：分組導覽（group 標題 fs13/ink-2、項 min-height 44px）
   -------------------------------------------------------------------------- */
.bhfb-mobile_offcanvas .mobile-offcanvas-menu-content{padding:2px 0 0}
.bt-offcanvas-group{margin:0 0 18px}
.bt-offcanvas-group__title{font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--color-ink-2);margin:0 0 0;padding:8px 0 6px;border-bottom:1px solid var(--color-border)}
.bt-offcanvas-group__list{list-style:none;margin:0;padding:0}
.bt-offcanvas-group__list li{margin:0;padding:0}
.bt-offcanvas-group__list a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:10px 2px;border-bottom:1px solid var(--color-border);color:var(--color-ink);font-size:16px;text-decoration:none}
.bt-offcanvas-group__list a:hover{color:var(--color-accent)}
.bt-offcanvas-group__list a[aria-current="page"]{color:var(--color-accent);font-weight:600}

/* --------------------------------------------------------------------------
   R-5 PDP：解開母主題 max-width:50% 掐制（圖 ≥600、文字欄 ≥400、死白消失）
   -------------------------------------------------------------------------- */
.single-product .product-gallery-summary>*{max-width:none !important;width:100% !important}
.single-product .product-gallery-summary .woocommerce-product-gallery{width:100% !important}

/* --------------------------------------------------------------------------
   R-6 商品卡文字區升級（title 17px/1.5 等高兩行、價格 17px 層級分明）
   -------------------------------------------------------------------------- */
:root{--fs-prod-title:17px}
.woocommerce ul.products li.product h2.woocommerce-loop-product__title{font-size:17px;line-height:1.5;margin:0 0 12px}
.woocommerce ul.products li.product h2.woocommerce-loop-product__title a{min-height:calc(2 * 1.5em);-webkit-line-clamp:2}
.woocommerce ul.products li.product .price{font-size:17px;font-weight:600;line-height:1.85;color:var(--color-ink);margin:auto 0 0}
.woocommerce ul.products li.product .price del{font-size:.85em}
.woocommerce ul.products li.product .price ins{font-size:1.05em}

/* --------------------------------------------------------------------------
   R-7 首頁區塊放寬（結構 layout contentSize 1140 另以 wp eval-file 寫入 DB）
   .bt-section 原 clamp(16px,4vw,0) 為 min>max 無效值 → 修正水平 padding
   -------------------------------------------------------------------------- */
.bt-section{padding:clamp(32px,6vw,72px) clamp(14px,1vw,32px) 0}
/* 手機：還原無水平 padding（與 v1.0 一致），避免 2 欄小卡圖縮水 */
@media (max-width:639px){.bt-section{padding:clamp(24px,7vw,44px) 0 0}}

/* --------------------------------------------------------------------------
   R-8 特價徽章：圖上實心晶片（自帶底色 → 任何圖 6.41:1；!important 蓋 custom-styles span.onsale）
   -------------------------------------------------------------------------- */
.woocommerce span.onsale.bt-sale,span.onsale.bt-sale{background:#F6EFE7 !important;color:#9A3412 !important;border:1px solid #E5D5C2 !important;border-radius:var(--radius-s) !important;font-size:12px;font-weight:600;letter-spacing:.04em;padding:4px 10px !important;top:12px !important;left:12px !important;right:auto !important;bottom:auto !important;width:auto !important;max-width:none !important;box-shadow:0 1px 3px rgba(31,32,33,.12);min-height:0;line-height:1.5;margin:0;text-transform:none;text-decoration:none;z-index:3;display:inline-block}

/* --------------------------------------------------------------------------
   R-9 Hero CTA：古銅金實底＋白字（4.67:1）＋hover 深金＋focus-visible 白框
   -------------------------------------------------------------------------- */
body .bt-hero .wp-block-button__link{background:#A56600 !important;border:1px solid #A56600 !important;color:#FFFFFF !important;padding:14px 30px;font-size:15px;border-radius:var(--radius-s);box-shadow:0 2px 10px rgba(0,0,0,.28);text-decoration:none;line-height:1.4}
body .bt-hero .wp-block-button__link:hover{background:#7D4D00 !important;border-color:#7D4D00 !important;color:#FFFFFF !important}
body .bt-hero .wp-block-button__link:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px}

/* --------------------------------------------------------------------------
   R-10 全站按鈕 token 統一（#262019 / hover #A56600）+ hover 加購陰影
   已特別設計的元件（hero CTA、loop hover 加購、PDP ATC…）用更高 specificity
   還原自身樣式，不被此通用規則蓋掉。
   -------------------------------------------------------------------------- */
body .button,body a.button,body button.button,body .wp-block-button__link{background:#262019 !important;color:#FAFAFA !important;border:1px solid #262019 !important}
body .button:hover,body a.button:hover,body button.button:hover,body .wp-block-button__link:hover{background:#A56600 !important;border-color:#A56600 !important;color:#FFFFFF !important}
/* loop hover 加購：保留白底晶片設計＋補陰影（淺圖上也立體） */
.woocommerce ul.products li.product .loop-button-wrap .button{background:rgba(255,255,255,.97) !important;color:var(--color-ink) !important;border:1px solid var(--color-ink) !important;box-shadow:0 2px 10px rgba(31,32,33,.18)}
.woocommerce ul.products li.product .loop-button-wrap .button:hover{background:var(--color-accent) !important;border-color:var(--color-accent) !important;color:#FFFFFF !important}
/* hero 內 wp-block-button__link 屬已特別設計（R-9），同為 !important 時 specificity 較高者勝 */


/* --------------------------------------------------------------------------
   R-12 首頁 hero／商品頁／結帳頁：頂部空白收斂（2026-09-08 工單）
   老闆：大圖與導覽（含付款提醒橫幅）之間空白太大。
   來源：.content-wrapper 預設 margin-top 80px；此三類頁面頂端已由
   橫幅/頁頭接管視覺節奏 → 收斂為貼齊橫幅下方的小間距（10~18px）。
   列表頁（shop/分類）已有 R-11 收斂，不重複套用。
   -------------------------------------------------------------------------- */
body.home .content-wrapper,
body.single-product .content-wrapper,
body.woocommerce-checkout .content-wrapper {
	margin-top: clamp( 10px, 1.5vw, 18px ) !important;
}
