/* ============================================================================
 * themes/3ffood/sidebar.css — 3ffood 主題 sidebar 層完整抽取
 * ============================================================================
 *
 * 用途：
 *   承接舊 3ffood.css 的「行動裝置側邊抽屜選單（Mobile Sidebar）」與跨頁
 *   「商品分類側欄（.product-cat / .product-side-menu）」段落，作為 3ffood
 *   主題對 common/sidebar.css 的覆寫與補充層。載入順序在 common/sidebar.css
 *   之後，重複規則由 3ffood 版本後勝覆寫。
 *
 * 抽取策略（按 kgtwbeef 模式 — 完整段落抽取）：
 *   舊 3ffood.css 過渡期仍由 css.blade.php 載入托底（實際已註解，改由 helper
 *   增量接線），其 mobile-sidebar 與 product-cat 段落 SHALL 完整抽到本檔。
 *
 * 抽取來源（public/web/css/3ffood.css）：
 *   - line 7392-7900：Mobile Sidebar（overlay / .mobile-sidebar 抽屜本體 /
 *                     sidebar-header(-top/-title/-close-btn/-divider) /
 *                     sidebar-content(custom-scrollbar) / 3 層選單
 *                     (sidebar-menu-l1~l3 / menu-item / menu-btn / menu-icon /
 *                     menu-label / arrow-icon / menu-container-l2~l3) /
 *                     sidebar-system-menu / sidebar-footer /
 *                     member-menu-header/-list / logout-btn(-container)）
 *                     ※ 結尾 .strong { font-weight:700 } 為通用 utility，
 *                       已在 common/sidebar.css 提供，跳過不重複
 *   - line 3060-3247：跨頁商品分類側欄（.product-cat / .product-side-menu /
 *                     .product-cat-item 各層 ul / hover / .is-active /
 *                     .has-children），比照 kgtwbeef sidebar.css 收於 sidebar 層
 *                     （posts.show 等頁面亦使用，common/sidebar.css 已同樣處理）
 *
 * Cascade 提醒（.product-side-menu 用單一選擇器，勿改複合）：
 *   .product-side-menu 維持單一選擇器 (0,1,0)。原曾比照 kgtwbeef 改用
 *   .widget.product-side-menu (0,2,0)，但實測 cm12 參考站的 cascade 是：
 *   posts.show（無 .shop-section）由 3ffood/widget.css 的 .widget { padding: 20px 8px }
 *   以 source order 後勝；products.show 由 3ffood/pages/product.css 的
 *   .shop-section .product-side-menu (0,2,0) 勝出。複合選擇器會在 posts.show 反而
 *   蓋過 .widget，與 cm12 不符（task 10.7 user 回報「文章分類位置差異」修正）。
 *
 * 跳過範圍（非 sidebar 層，留給對應檔）：
 *   - .product-cat .treeview / .hitarea（3ffood.css 5341+，分類樹外掛樣式）→ product.css
 *   - .shop-section .product-side-menu / .shop-section .widget-search
 *     （3ffood.css 9924+，三福商品頁側欄日式簡約重設計，product-scoped）→ product.css(task 10.6)
 *   - .btn-group-category（3ffood.css 2965+，商品頁分類按鈕組）→ product.css
 *
 * 載入順序：
 *   common/sidebar.css -> themes/3ffood/sidebar.css（本檔）-> 其他
 *
 * 詳細規格：openspec/specs/web-theme-css/spec.md（Requirement R.FUNC.1 / R.FUNC.8）
 * 變更記錄：openspec/changes/issue518-web-theme-css-modularization/（task 10.3）
 * ============================================================================
 */

/* ============================================================================
 * 行動裝置側邊抽屜選單 Mobile Sidebar（overlay / 抽屜本體 / header / content / 3 層選單 / system-menu / footer / member-menu / logout）(3ffood.css 7392-7900；結尾 .strong utility 跳過)
 * ============================================================================ */

/* =========================================
   Mobile Sidebar Styles (Custom Implementation)
   ========================================= */

/* Overlay */

/* Sidebar Aside */

/* Header */

/* Content Area */

/* Scrollbar hide */

/* Menu Level 1 */

/* 第 1 層選單容器 - 使用 flexbox 分離跳轉和展開按鈕 */

/* 左側：跳轉連結區域 */

/* 右側：展開按鈕區域 */

/* 當展開時，整個容器變黑 */

/* Menu Level 2 */

/* 第 2 層選單容器 - 使用 flexbox 分離跳轉和展開按鈕 */

/* 左側：跳轉連結區域 */

/* 右側：展開按鈕區域 */

/* Menu Level 3 */

/* System Menu */

/* Footer */

/* Member Center Menu */

/* ============================================================================
 * 跨頁商品分類側欄 .product-cat / .product-side-menu（比照 kgtwbeef sidebar 收於 sidebar 層）(3ffood.css 3060-3247)
 * ============================================================================ */

.product-cat ul li {
  list-style: none !important;
  padding: 0;
}

/* .product-side-menu 基底（忠實對應 3ffood.css 3107，單一選擇器 0,1,0）：
 * 註：原曾比照 kgtwbeef 改用複合選擇器 .widget.product-side-menu (0,2,0)，但實測 cm12
 * 參考站在 posts.show（無 .shop-section）是讓 .widget { padding: 20px 8px }（載於
 * 3ffood/widget.css、source order 後勝）勝出、products.show 由 .shop-section
 * .product-side-menu(18px 14px) 勝出；複合選擇器會在 posts.show 反而蓋過 .widget
 * 變成 24px 20px（與 cm12 不符）。還原為單一 .product-side-menu 才正確重現 cm12 cascade。 */
.product-side-menu {
  background: #ffffff;
  border-left: 4px solid #2C2C2C;
  padding: 24px 20px;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
}

/* product-side-menu 子規則族（product-cat-item 連結/hover/is-active/has-children chevron/
 * 子分類）與 common/sidebar.css 語意完全相同（僅 combinator 空白寫法不同），已移除由
 * common 托底；本主題僅保留上方 .product-side-menu 本體的 brand border-left 覆寫。issue #562 */