@charset "UTF-8";
/* css_modern.css v20260827040 - XYZ88 現代樣式表 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --primary:#2563eb;
  --primary-d:#1d4ed8;
  --accent:#7c3aed;
  --purple1:#7c3aed;
  --purple2:#a855f7;
  --blue1:#2563eb;
  --blue2:#3b82f6;
  --bg:#f8fafc;
  --bg2:#f1f5f9;
  --surface:#ffffff;
  --surface-soft:#f8fafc;
  --border:#e2e8f0;
  --border-l:#f1f5f9;
  --border-strong:#cbd5e1;
  --text:#1e293b;
  --text-l:#64748b;
  --text-dim:#94a3b8;
  --link:#2563eb;
  --link-h:#1d4ed8;
  --red:#dc2626;
  --green:#16a34a;
  --amber:#d97706;
  --header-h:64px;
  --topbar-h:38px;
  --sidebar-w:220px;
  --max-w:1268px;
  --r:10px;
  --r-lg:16px;
  --sh:0 1px 2px rgba(0,0,0,.04);
  --sh2:0 8px 30px rgba(0,0,0,.08);
  --sh-soft:0 10px 24px rgba(15,23,42,.08);
  --tr:all .2s cubic-bezier(.4,0,.2,1);
  --font:"Noto Sans TC","Microsoft JhengHei","PingFang TC",system-ui,sans-serif;
}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{
  margin:0;padding:0;
  font-family:var(--font);
  background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);
  color:var(--text);
  line-height:1.75;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-feature-settings:"kern" 1,"liga" 1,"calt" 1;
}
a{color:var(--link);text-decoration:none;transition:var(--tr);font-weight:600}
a:hover{color:var(--link-h)}
img{max-width:100%;height:auto}

/* 捲軸：極細、不佔位 */
::-webkit-scrollbar{width:3px;height:3px}
::-webkit-scrollbar-track{background:transparent;margin:4px 0}
::-webkit-scrollbar-thumb{background:rgba(128,128,128,.2);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:rgba(128,128,128,.4)}
::-webkit-scrollbar-corner{background:transparent}
/* Firefox：全域细捲軸 */
*{scrollbar-width:thin;scrollbar-color:rgba(128,128,128,.2) transparent}

/* 視覺隱藏 h1（保留給 SEO） */
h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* 頁首 */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.88);box-shadow:0 1px 3px rgba(0,0,0,.05);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.header-bar{max-width:1440px;margin:0 auto;height:var(--header-h);display:flex;align-items:center;justify-content:space-between;padding:0 16px;gap:6px}
.header-topbar{display:flex;height:var(--topbar-h);background:linear-gradient(135deg,#1e40af 0%,#2563eb 50%,#3b82f6 100%);align-items:center;padding:0 16px}
.header-topbar-inner{max-width:var(--max-w);width:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:4px}
.topbar-left{display:flex;align-items:center;gap:2px}
.topbar-right{display:flex;align-items:center;gap:4px}
.topbar-mobile-icons{display:none;align-items:center;gap:2px}
.tbi-link{display:flex;align-items:center;justify-content:center;width:26px;height:26px;color:rgba(255,255,255,.85);border-radius:6px;transition:var(--tr);text-decoration:none}
.tbi-icon{width:15px;height:15px;flex-shrink:0}
.tbi-link:hover{background:rgba(255,255,255,.15);color:#fff;text-decoration:none}
.tbi-link:active{background:rgba(255,255,255,.25)}
.tb-link{display:flex;align-items:center;gap:5px;padding:5px 12px;font-size:.82rem;color:rgba(255,255,255,.85);border-radius:20px;transition:var(--tr);white-space:nowrap;font-weight:500;text-decoration:none}
.tb-icon{width:14px;height:14px;flex-shrink:0;opacity:.7;transition:var(--tr)}
.tb-link:hover{background:rgba(255,255,255,.15);color:#fff;text-decoration:none}
.tb-link:hover .tb-icon{opacity:1}
.tb-link.active{background:rgba(255,255,255,.18);color:#fff}
.tb-divider{width:1px;height:16px;background:rgba(255,255,255,.2);margin:0 4px;flex-shrink:0}
#topbarFavCount{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:16px;font-size:10px;font-weight:700;color:#fff;background:#ef4444;border-radius:8px;padding:0 5px;margin-left:3px;line-height:1}
.tb-btn{display:flex;align-items:center;gap:5px;padding:5px 14px;font-size:.82rem;font-weight:600;border-radius:20px;transition:var(--tr);white-space:nowrap;text-decoration:none;cursor:pointer}
.tb-btn-login{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);color:#fff}
.tb-btn-login:hover{background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.5);text-decoration:none}
.tb-btn-register{background:#fff;color:#1e40af}
.tb-btn-register:hover{background:#f0f7ff;box-shadow:0 2px 8px rgba(0,0,0,.12);text-decoration:none}
.tb-member{display:flex;align-items:center;gap:6px;padding:5px 12px;font-size:.82rem;font-weight:500;color:#fff;border-radius:20px;transition:var(--tr);text-decoration:none;cursor:pointer}
.tb-member:hover{background:rgba(255,255,255,.15);text-decoration:none}
.tb-member-avatar{width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;text-transform:uppercase;flex-shrink:0}
.tb-member-name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-logout{padding:5px 12px;font-size:.82rem;color:rgba(255,255,255,.7);border-radius:20px;transition:var(--tr);text-decoration:none;cursor:pointer}
.tb-logout:hover{color:#fff;background:rgba(255,255,255,.1);text-decoration:none}
.tb-btn-login,.tb-btn-register,.tb-member,.tb-logout{display:none}
#topbar-auth{display:none}
.tb-auth-logout{display:inline-flex;align-items:center;padding:3px 9px;font-size:.75rem;font-weight:600;color:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.25);border-radius:14px;text-decoration:none;white-space:nowrap;transition:all .2s}
.tb-auth-logout:hover,.tb-auth-logout:active{color:#fff;border-color:rgba(255,255,255,.5);box-shadow:0 3px 10px rgba(0,0,0,.4)}
.header-left{display:flex;align-items:center;gap:8px;flex-shrink:0}
.logo{display:flex;align-items:center;gap:7px;text-decoration:none;flex-shrink:0;padding:4px 0}
.logo-mark{font-size:1.5rem;font-weight:800;letter-spacing:-1px;background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;font-family:"Inter",sans-serif}
.logo-sub{font-size:.85rem;color:var(--primary);font-weight:700;white-space:nowrap;letter-spacing:1px}

/* 大型選單按鈕 */
.mega-menu-btn{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;font-size:.82rem;color:var(--text-l);border-radius:20px;transition:var(--tr);white-space:nowrap;font-weight:500;text-decoration:none;background:transparent;border:1.5px solid transparent;cursor:pointer;font-family:var(--font)}
.mega-menu-btn:hover{border-color:var(--primary);background:var(--surface);color:var(--primary)}
.mega-menu-btn.active{border-color:var(--primary);background:var(--surface);color:var(--primary)}
.mega-menu-btn .arrow{font-size:.7rem;transition:transform .2s}
.mega-menu-btn.active .arrow{transform:rotate(180deg)}

/* 搜尋 */
.hdr-search{flex:1;max-width:760px;display:flex;align-items:center;position:relative}
.hdr-search input{flex:1;padding:8px 46px 8px 38px;border:1.5px solid var(--border);border-radius:24px;font-size:15px;outline:none;transition:var(--tr);font-family:var(--font);font-weight:500;background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b6b6b' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E") no-repeat 12px center}
.hdr-search input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(37,99,235,.1);background-color:var(--surface)}
.hdr-search-btn{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:32px;height:32px;padding:0;display:flex;align-items:center;justify-content:center;background-color:#fff;border:1.5px solid var(--primary);border-radius:50%;cursor:pointer;color:var(--primary);transition:var(--tr);font-family:var(--font);z-index:2}
.hdr-search-btn svg{width:18px;height:18px}
.hdr-search-btn:hover{background-color:var(--primary);color:#fff}
.hdr-search-btn:active{transform:translateY(-50%) scale(.96)}
.search-suggest{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--surface);border:none;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.15);max-height:380px;overflow-y:auto;z-index:101;padding:8px}
.search-suggest.open{display:block}
.suggest-item{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;font-size:.85rem;font-weight:500;color:var(--text);transition:all .15s ease;border-radius:10px;margin:2px 0}
.suggest-item:hover{background:rgba(37,99,235,.06);color:var(--primary)}

/* 搜索熱門關鍵字面板 */
.search-hot{display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:105;background:var(--surface);border-radius:14px;box-shadow:0 16px 40px rgba(0,0,0,.18);padding:12px 16px 14px;animation:suggestIn .2s cubic-bezier(.16,1,.3,1)}
.search-hot.open{display:block}
.search-hot-tags{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center}
.search-hot-tag{display:inline-flex;align-items:center;padding:0;font-size:.85rem;font-weight:500;color:var(--text-l);background:transparent;border:none;border-radius:0;cursor:pointer;transition:color .15s ease;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(100,116,139,.45);white-space:nowrap}
.search-hot-tag:hover,.search-hot-tag:active{color:var(--primary);text-decoration:underline;background:transparent;border:none}
.search-hot-title-row{display:none}
.page-member .search-hot,
.page-member-auth .search-hot{
  display:none !important;
}

/* 電腦版：搜索器下方緊湊熱門關鍵字列（無面板、無邊框、常駐顯示，寬度與搜索框組件一致） */
@media(min-width:769px){
  .search-hot{
    position:absolute;
    top:calc(100% + 2px);
    left:0;
    right:0;
    width:100%;
    background:transparent;
    border:none;
    border-radius:0;
    box-shadow:none;
    padding:0 0 0 12px;
    display:block !important;
    animation:none;
    z-index:50;
    box-sizing:border-box;
  }
  .search-hot.open{display:block}
  .page-member .search-hot,
  .page-member-auth .search-hot{
    display:none !important;
  }
  .search-hot-tags{
    gap:14px;
    flex-wrap:nowrap;
    overflow:hidden;
    white-space:nowrap;
    padding-top:2px;
  }
  .search-hot-tag{
    font-size:.82rem;
    color:#94a3b8;
    text-decoration:none;
    font-weight:400;
    padding:0;
    text-underline-offset:0;
    text-decoration-color:transparent;
  }
  .search-hot-tag:hover,.search-hot-tag:active{
    color:var(--primary);
    text-decoration:underline;
    background:transparent;
    border:none;
  }
}

/* 頁首右侧 */
.header-right{display:flex;align-items:center;gap:4px;flex-shrink:0;position:relative}
#hdr-auth{display:inline-flex;align-items:center;gap:4px;order:2}
.header-right .search-toggle-btn{order:1}
.header-right .cart-btn{order:3}
.hdr-quick-link{display:flex;align-items:center;gap:5px;padding:7px 14px;font-size:.82rem;color:var(--text-l);border-radius:20px;transition:var(--tr);white-space:nowrap;font-weight:500;text-decoration:none}
.hdr-quick-link svg{width:16px;height:16px;flex-shrink:0;opacity:.65;transition:var(--tr)}
.hdr-quick-link:hover svg{opacity:1}
.hdr-quick-link:hover{background:var(--bg);color:var(--primary);text-decoration:none}
.cart-btn{display:flex;align-items:center;gap:8px;padding:7px 18px;background-color:#fff;border:1.5px solid var(--primary);border-radius:24px;cursor:pointer;font-size:.84rem;font-weight:600;color:var(--primary);transition:var(--tr);white-space:nowrap;font-family:var(--font);position:relative;box-shadow:none}
.cart-btn:hover,.cart-btn:active,.cart-btn.open{background-color:var(--primary);border-color:#fff;color:#fff}
.cart-btn:active,.cart-btn.open{transform:scale(.96)}
.cart-btn:hover .cart-count,.cart-btn:active .cart-count,.cart-btn.open .cart-count{background:#fff;color:var(--primary)}
.cart-count{background:var(--primary);color:#fff;font-size:.68rem;font-weight:700;min-width:21px;height:21px;border-radius:11px;display:none;align-items:center;justify-content:center;padding:0 7px;line-height:1;font-family:"Inter",sans-serif}
.cart-count.visible{display:flex}

/* Header 登入/註冊/會員（方案B 樣式1A） */
.hdr-login{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;font-size:.82rem;font-weight:700;border-radius:22px;border:1.5px solid var(--primary);background:transparent;color:var(--primary)!important;white-space:nowrap;cursor:pointer;transition:var(--tr);text-decoration:none;font-family:var(--font)}
.hdr-login:hover{background:var(--primary);color:#fff!important;text-decoration:none}
.hdr-login svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.hdr-register{display:inline-flex;align-items:center;padding:6px 14px;font-size:.82rem;font-weight:700;border-radius:22px;border:1.5px solid var(--primary);background:var(--primary);color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.25);white-space:nowrap;cursor:pointer;transition:var(--tr);text-decoration:none;font-family:var(--font)}
.hdr-register:hover{background:var(--primary-d);text-decoration:none;box-shadow:0 3px 10px rgba(37,99,235,.45)}
.hdr-member{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 3px;border:1.5px solid var(--border);border-radius:22px;background:var(--surface);cursor:pointer;transition:var(--tr);font-family:var(--font);outline:none;font-size:.82rem;line-height:1.4}
.hdr-member:hover{border-color:var(--primary);background:#eff6ff}
.hdr-member.open{border-color:var(--primary);background:#eff6ff;box-shadow:0 0 0 3px rgba(37,99,235,.1)}
.hdr-member-chevron{width:14px;height:14px;color:var(--text-l);transition:transform .25s cubic-bezier(.4,0,.2,1);flex-shrink:0}
.hdr-member.open .hdr-member-chevron{transform:rotate(180deg);color:var(--primary)}
.hdr-avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;text-transform:uppercase;font-family:"Inter",sans-serif}
.hdr-name{font-size:.82rem;font-weight:600;color:var(--text);max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hdr-logout{display:inline-flex;align-items:center;padding:6px 12px;font-size:.82rem;font-weight:500;color:var(--text-l);border-radius:18px;background:transparent;border:none;cursor:pointer;white-space:nowrap;transition:var(--tr);text-decoration:none;font-family:var(--font)}
.hdr-logout:hover{background:#fef2f2;color:#ef4444;text-decoration:none}

/* ===== 會員下拉選單 ===== */
.hdr-member-wrap{position:relative;display:inline-flex}
.mob-avatar-wrap{display:none} /* 桌面版隱藏手持版頭像按鈕 */
.hdr-member-overlay{position:fixed;inset:0;z-index:10000;display:none;pointer-events:none}
.hdr-member-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;width:256px;
  background:var(--surface);border:1px solid var(--border-l);border-radius:16px;
  box-shadow:0 4px 6px rgba(15,23,42,.04),0 12px 24px rgba(15,23,42,.08),0 20px 48px rgba(15,23,42,.1);
  z-index:10001;overflow:hidden;flex-direction:column;
  opacity:0;transform:scale(.92) translateY(-4px);transform-origin:top right;
  transition:opacity .2s ease,transform .2s cubic-bezier(.4,0,.2,1);pointer-events:none}
.hdr-member-dropdown.open{display:flex;opacity:1;transform:scale(1) translateY(0);pointer-events:auto}
.hdr-member-dropdown-arrow{position:absolute;top:-6px;right:24px;width:12px;height:12px;
  background:var(--surface);transform:rotate(45deg);border-radius:2px 0 0 0;
  box-shadow:-1px -1px 2px rgba(15,23,42,.04)}
.hdr-member-dropdown-user{padding:16px 16px 12px}
.hdr-member-dropdown-user-top{display:flex;align-items:center;gap:10px}
.hdr-member-dropdown-avatar-lg{width:44px;height:44px;border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;
  flex-shrink:0;text-transform:uppercase;font-family:"Inter",sans-serif}
.hdr-member-dropdown-user-info{flex:1;min-width:0}
.hdr-member-dropdown-username{font-size:16px;font-weight:700;color:var(--text);line-height:1.3}
.hdr-member-dropdown-email{font-size:13px;color:var(--text-l);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hdr-member-dropdown-divider{height:1px;background:var(--border-l);margin:0}
.hdr-member-dropdown-links{padding:6px 0}
.hdr-member-dropdown-link{display:flex;align-items:center;gap:12px;padding:10px 16px;
  font-size:15px;color:var(--text);text-decoration:none;transition:background .12s,color .12s;font-family:var(--font)}
.hdr-member-dropdown-link:hover{background:rgba(37,99,235,.05);color:var(--primary);text-decoration:none}
.hdr-member-dropdown-link svg{width:18px;height:18px;stroke:var(--text-l);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;fill:none;flex-shrink:0;transition:stroke .12s}
.hdr-member-dropdown-link:hover svg{stroke:var(--primary)}
.hdr-member-dropdown-link-badge{margin-left:6px;font-size:11px;font-weight:700;color:#fff;background:var(--red);border-radius:8px;padding:1px 7px;min-width:20px;text-align:center}
.hdr-member-dropdown-footer{padding:4px 0 6px}
.hdr-member-dropdown-logout{display:flex;align-items:center;gap:12px;padding:9px 16px;
  font-size:14px;color:#ef4444;text-decoration:none;transition:background .12s,color .12s;
  width:100%;text-align:left;border:none;background:none;cursor:pointer;font-family:var(--font)}
.hdr-member-dropdown-logout:hover{background:#fef2f2;color:#dc2626;text-decoration:none}
.hdr-member-dropdown-logout svg{width:17px;height:17px;stroke:#ef4444;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;fill:none;flex-shrink:0}
.mobile-menu-btn{display:none;width:40px;height:40px;border:1.5px solid var(--primary);border-radius:50%;background:#fff;cursor:pointer;font-size:1.45rem;line-height:1;color:var(--primary);align-items:center;justify-content:center;box-shadow:none;transition:var(--tr)}
.mobile-menu-btn:hover,.mobile-menu-btn:active{background:var(--primary);border-color:#fff;color:#fff;transform:scale(.95)}
.icon-btn.search-toggle-btn{display:none}
.hdr-back{display:none;width:36px;height:36px;border:none;background:transparent;
  cursor:pointer;align-items:center;justify-content:center;color:var(--text);
  flex-shrink:0;border-radius:50%;transition:var(--tr)}
.hdr-back:hover{background:var(--bg);color:var(--primary)}
.hdr-back svg{width:20px;height:20px}

/* 大型選單 */
.mega-menu{display:none;position:absolute;left:0;right:0;top:var(--header-h);background:var(--surface);box-shadow:var(--sh2);border-bottom:3px solid var(--primary);max-height:70vh;overflow-y:auto;padding:20px;z-index:99}
.mega-menu.open{display:block}
.mega-grid{max-width:var(--max-w);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(min-content,1fr));gap:20px;align-items:start}
.mega-col{min-width:0}
.mega-title{font-size:.88rem;font-weight:700;color:var(--primary);padding-bottom:10px;border-bottom:2px solid var(--primary);margin-bottom:10px}
.mega-links{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.mega-links:has(>a:nth-child(7)){display:grid;grid-template-columns:1fr 1fr;column-gap:16px;width:100%;align-items:stretch}
.mega-links a{display:block;width:auto;min-width:0;padding:7px 10px;font-size:.82rem;font-weight:500;color:#475569;border-radius:0;border-bottom:1px solid rgba(128,128,128,.12);border-left:3px solid transparent;transition:var(--tr);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mega-links a:hover{background:var(--bg);color:var(--primary);text-decoration:none;padding-left:14px;border-left-color:var(--primary)}

/* 側邊欄 */
.sidebar{background:var(--surface);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden;position:fixed;top:calc(var(--header-h) + var(--topbar-h) + 6px);left:calc((100vw - min(100vw, var(--max-w))) / 2 + 16px);width:var(--sidebar-w);max-height:calc(100vh - var(--header-h) - var(--topbar-h) - 12px);height:auto;display:flex;flex-direction:column;z-index:10}
.sidebar-close{display:none;position:absolute;top:10px;right:10px;width:28px;height:28px;border:none;background:transparent;font-size:1.2rem;cursor:pointer;color:var(--text-l);z-index:10}
.sidebar-quick{display:none}
.sidebar-quick .sq-link{flex:1;flex-direction:column;gap:4px;padding:8px 4px;font-size:.72rem;text-align:center;border-radius:8px}
.sq-link{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:#334155;font-size:.83rem;font-weight:600;text-decoration:none;transition:all .2s ease}
.sq-link:hover{background:var(--surface);color:var(--primary);box-shadow:0 2px 8px rgba(0,0,0,.06);transform:translateX(2px)}
.sq-badge{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;background:var(--red);color:#fff;font-size:10px;font-weight:700;border-radius:8px;margin-left:2px;vertical-align:middle}
.sq-member-card{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:linear-gradient(135deg,#EEEDFE,#E6F1FB);border:1px solid #AFA9EC;text-decoration:none;transition:all .2s ease;flex:1}
.sq-member-card:hover{box-shadow:0 2px 10px rgba(83,74,183,.15);transform:translateX(2px)}
.sq-member-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#534AB7,#378ADD);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0;text-transform:uppercase}
.sq-member-info{display:flex;flex-direction:column;gap:2px;overflow:hidden}
.sq-member-name{font-size:.82rem;font-weight:600;color:#3C3489;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sq-member-label{font-size:.72rem;color:#534AB7;font-weight:500}
.sq-member-sub{display:flex;flex-direction:column;gap:2px;padding:6px 0 0 0}
.sq-sub-link{display:flex;align-items:center;gap:8px;padding:8px 12px 8px 24px;border-radius:8px;text-decoration:none;color:#4a5568;font-size:.82rem;font-weight:500;transition:all .2s ease}
.sq-sub-link:hover{background:#EEEDFE;color:#534AB7;transform:translateX(2px)}
.sq-sub-icon{width:16px;height:16px;flex-shrink:0}
.accordion{overflow-y:auto;flex:1;scrollbar-gutter:stable}
.cat-group{border-bottom:1px solid var(--border)}
.cat-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;padding:9px 12px;background:transparent;border:none;cursor:pointer;font-size:15px;font-weight:700;color:#1e3a8a;text-align:left;transition:var(--tr)}
.cat-toggle:hover{background:rgba(67,56,202,.06);color:#4338ca}
.cat-arrow{width:18px;height:18px;flex-shrink:0;display:flex;align-items:center;justify-content:center;margin-left:auto;border-radius:3px;background:transparent;border:none;transition:all .25s cubic-bezier(.16,1,.3,1);color:var(--text-l);opacity:.55}
.cat-arrow svg{width:14px;height:14px;stroke-width:1.8;stroke:currentColor}
.cat-group.open .cat-arrow{opacity:.8;color:var(--primary);background:transparent;border-color:transparent}
.cat-group.open .cat-arrow svg{color:var(--primary);transform:rotate(180deg)}
.cat-links{display:none;padding:4px 0 8px}
.cat-group.open .cat-links{display:block}
.cat-links a{display:block;padding:4px 12px 4px 24px;font-size:14px;color:#475569;transition:var(--tr);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-left:2px solid transparent}
.cat-links a:hover{background:rgba(67,56,202,.06);color:#4338ca;padding-left:28px;border-left-color:#4338ca}
.cat-links a.active{background:rgba(37,99,235,.08);color:var(--primary);font-weight:600;border-left-color:var(--primary)}

/* 主內容 */
.main-wrap{max-width:var(--max-w);margin:0 auto;display:grid;grid-template-columns:var(--sidebar-w) 1fr;gap:16px;padding:6px 16px;align-items:start}
.content{background:var(--surface);border-radius:var(--r);box-shadow:var(--sh);padding:20px 24px;min-width:0;grid-column:2}
.content:has(.search-page){background:transparent;box-shadow:none;border-radius:0;padding:0}
.content:has(.disk-detail-page){background:transparent;box-shadow:none;border-radius:0;padding:0}
.content:has(.home-card){background:transparent;box-shadow:none;border-radius:0;padding:0}


.search-page{padding:20px 24px;background:var(--bg)}

/* 共用工具外殼（購物車/問與/閱讀/訂單狀態） */
.main-content{
  grid-column:2;
  min-width:0;
}
.main-content::before{
  display:none !important;
  content:attr(data-page-label);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:6px 14px;
  margin:0 0 14px;
  border-radius:14px;
  background:linear-gradient(135deg,#eff6ff 0%,#f8fafc 100%);
  color:var(--primary-d);
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.08em;
  border:1px solid rgba(37,99,235,.12);
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.main-content[data-page-label=""]::before{display:none}
.main-content > :first-child{
  margin-top:0;
}
.main-content > :last-child{
  margin-bottom:0;
}
.main-content > form,
.main-content > center,
.main-content > table,
.main-content > div,
.main-content > script{
  max-width:1000px;
}
.main-content > center{
  display:block;
  margin:0 auto 18px;
}
.main-content > center > *{
  margin-left:auto;
  margin-right:auto;
}
.main-content > font[color="Red"],
.main-content > center > font[color="Red"]{
  display:block;
  max-width:1000px;
  margin:0 auto 14px;
  padding:12px 14px;
  border-radius:14px;
  background:#fff1f2;
  border:1px solid #fecdd3;
  color:#be123c;
  font-weight:700;
  line-height:1.7;
}
.main-content font[color="Brown"],
.main-content font[color="blue"],
.main-content font[color="Blue"],
.main-content font[color="red"],
.main-content font[color="Red"]{
  font-family:var(--font);
}
.main-content > hr{
  border:none;
  border-top:1px solid rgba(148,163,184,.22);
  margin:18px 0;
}

/* 商品網格 */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2px;background:var(--border);border-radius:12px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.prod-card{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--surface);transition:all .2s cubic-bezier(.16,1,.3,1);position:relative}
.prod-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:transparent;border-radius:0 2px 2px 0;transition:background .2s}
.prod-card:hover{background:rgba(37,99,235,.02);z-index:1}
.prod-card:hover::before{background:#2563eb}
.prod-num{flex-shrink:0;font-size:13px;font-weight:700;color:var(--text-l);background:var(--bg);padding:3px 8px;border-radius:6px;font-family:"Inter",sans-serif;min-width:70px;text-align:center}
.prod-title{flex:1;font-size:15px;font-weight:400;line-height:1.55;word-break:break-all;color:#475569;text-decoration:none;transition:color .2s}
.prod-title:hover{color:#1e293b}

/* 資料夾區段 */
.folder-section{display:flex;align-items:center;gap:10px;padding:14px 16px;margin:2px 0 0;background:var(--bg);border-left:3px solid #cbd5e1;font-size:14px;font-weight:600;color:#475569;letter-spacing:.03em}
.folder-icon{width:20px;height:20px;flex-shrink:0}
.folder-section{border-radius:14px;background:linear-gradient(135deg,#6D28D9 0%,#7C3AED 50%,#6D28D9 100%);border:1px solid rgba(255,255,255,.14);box-shadow:0 4px 14px rgba(124,58,237,.20)}
.folder-section{font-size:.85rem;font-weight:700;color:#fff;letter-spacing:.04em}
.search-page .folder-section{background:linear-gradient(135deg,#6D28D9 0%,#7C3AED 50%,#6D28D9 100%);border-radius:14px;box-shadow:0 4px 14px rgba(124,58,237,.20);border:1px solid rgba(255,255,255,.14);margin:0;padding:12px 16px;font-size:.95rem;color:#fff;justify-content:center;letter-spacing:.04em;font-weight:700}
.search-page > b,.search-page > b font{color:#6B4226 !important}

/* 分頁 */
.pagination-wrap{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:16px 0}
.pagination-wrap a,.pagination-wrap span,.pagination-wrap select{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;border:1.5px solid var(--border);border-radius:8px;font-size:.82rem;font-weight:600;color:var(--text-l);background:var(--surface);transition:var(--tr);cursor:pointer;font-family:var(--font)}
.pagination-wrap a:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.pagination-wrap .current{background:var(--primary);color:#fff;border-color:var(--primary)}

/* 頁尾 */
.site-footer{display:none !important;text-align:center;padding:24px 0;color:var(--text-l);font-size:.78rem;letter-spacing:.03em}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:10000}
.search-mask{display:none;position:fixed;top:var(--header-h);left:0;width:100%;height:calc(100vh - var(--header-h));z-index:49;background:rgba(0,0,0,.25)}

.modern-cart-form.payway-paypal #addr_row,
.modern-cart-form.payway-paypal #time_row,
.modern-cart-form.payway-supermarket #time_row{display:none !important}

/* 響應式 */
@media(max-width:1030px){
  .mega-menu{top:calc(var(--header-h) + var(--topbar-h))}
  .sidebar{top:calc(var(--header-h) + var(--topbar-h) + 6px);max-height:calc(100vh - var(--header-h) - var(--topbar-h) - 12px);height:auto}
  .search-mask{top:calc(var(--header-h) + var(--topbar-h));height:calc(100vh - var(--header-h) - var(--topbar-h))}
  .cart-btn{flex-shrink:0}
}
@media(min-width:769px){
  :root{--header-h:74px}
  .header-bar{align-items:flex-start;padding-top:10px}
}
@media(max-width:768px){
  body{overflow-x:hidden;-webkit-text-size-adjust:100%}
  .site-header{position:fixed;top:0;left:0;right:0;width:100%;z-index:100}
  .main-wrap{padding-top:calc(var(--header-h) + 32px)}
  .header-topbar{display:flex;height:32px;padding:0 12px}
  .topbar-left{display:none}
  .topbar-mobile-icons{display:flex;gap:6px}
  .topbar-right{gap:4px}
  .tb-btn{padding:4px 10px;font-size:12px}
  .tb-btn svg{width:12px;height:12px}
  .tb-member{padding:4px 10px;font-size:12px}
  .tb-member-avatar{width:18px;height:18px;font-size:10px}
  .tb-member-name{max-width:80px}
  .tb-logout{padding:4px 10px;font-size:12px}
  .mega-menu{top:calc(var(--header-h) + 32px)}
  .sidebar{top:calc(var(--header-h) + 32px + 6px);max-height:calc(100vh - var(--header-h) - 32px - 12px);height:auto}
  .search-mask{top:calc(var(--header-h) + 32px);height:calc(100vh - var(--header-h) - 32px)}
  .mobile-menu-btn{display:flex}
  .mega-menu-btn{display:none}
  .hdr-search{display:none}
  .search-toggle-btn{display:flex}
  .icon-btn.search-toggle-btn{
    display:flex;
    width:40px;height:40px;
    background-color:#fff;
    color:var(--primary);
    border:1.5px solid var(--primary);
    box-shadow:none;
  }
  .icon-btn.search-toggle-btn:hover,
  .icon-btn.search-toggle-btn:active{
    background-color:var(--primary);
    color:#fff;
    border-color:#fff
  }
  .icon-btn.search-toggle-btn:active{transform:scale(.92)}
  .icon-btn.search-toggle-btn svg{width:20px;height:20px;stroke-width:2.5}
  /* 手机版头像按钮 - 搜索与购物车之间, 与桌面版统一渐变风格 */
  .mob-avatar-wrap{display:flex;align-items:center;position:relative}
  .mob-avatar-btn{
    width:40px;height:40px;border-radius:50%;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    color:#fff;border:none;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    padding:0;font-size:16px;font-weight:700;
    text-transform:uppercase;font-family:"Inter",sans-serif;
    transition:var(--tr);
  }
  .mob-avatar-btn:hover{transform:scale(1.05)}
  .mob-avatar-btn:active{transform:scale(.92)}
  /* 手机版头像下拉清单 */
  .mob-dropdown-overlay{position:fixed;inset:0;z-index:998;display:none;pointer-events:none}
  .mob-dropdown-overlay.open{display:block}
  .mob-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;width:260px;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 4px 16px rgba(15,23,42,.1),0 8px 32px rgba(15,23,42,.12);z-index:9999;overflow:hidden;flex-direction:column;opacity:0;transform:translateY(-6px);transition:opacity .18s,transform .18s}
  .mob-dropdown.open{display:flex;opacity:1;transform:translateY(0)}
  .mob-dropdown-user{padding:12px 14px;display:flex;align-items:center;gap:10px}
  .mob-dropdown-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;flex-shrink:0;text-transform:uppercase}
  .mob-dropdown-info{flex:1;min-width:0}
  .mob-dropdown-name{font-size:16px;font-weight:700;color:var(--text)}
  .mob-dropdown-email{font-size:11px;color:var(--text-l);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mob-dropdown-divider{height:1px;background:var(--border-l)}
  .mob-dropdown-link{display:flex;align-items:center;gap:10px;padding:11px 14px;font-size:15px;font-weight:500;color:var(--text);text-decoration:none;transition:background .12s;font-family:var(--font)}
  .mob-dropdown-link:hover,.mob-dropdown-link:active{background:rgba(37,99,235,.06);color:var(--primary)}
  .mob-dropdown-link svg{width:16px;height:16px;stroke:var(--text-l);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;fill:none;flex-shrink:0;transition:stroke .12s}
  .mob-dropdown-link:hover svg,.mob-dropdown-link:active svg{stroke:var(--primary)}
  .mob-dropdown-link-badge{margin-left:6px;font-size:13px;font-weight:700;color:#fff;background:var(--red);border-radius:8px;padding:1px 7px;min-width:20px;text-align:center}
  .mob-dropdown-logout{display:flex;align-items:center;gap:10px;padding:10px 14px;font-size:15px;color:var(--red);border:none;background:none;cursor:pointer;width:100%;text-align:left;font-family:var(--font);transition:background .12s}
  .mob-dropdown-logout:hover{background:#fef2f2}
  .mob-dropdown-logout svg{width:15px;height:15px;stroke:var(--red);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;fill:none}
  .header-bar.search-mode .header-left{display:none}
  .header-bar.search-mode .header-right{display:none}
  .header-bar.search-mode .hdr-search{display:flex;flex:1;max-width:none}
  .sidebar{position:fixed;top:0;left:0;bottom:0;width:340px;max-height:none;z-index:10001;transform:translateX(-100%);transition:transform .3s ease;border-radius:0}
  .sidebar.open{transform:translateX(0)}
  .sidebar-close{display:block;top:4px;right:4px}
  .sidebar-quick{display:flex;flex-direction:row;gap:1px;padding:0;margin-top:32px;border-bottom:2px solid var(--primary);overflow:visible !important}
  .sidebar-quick .sq-link{flex:1;min-width:0;flex-direction:column;gap:2px;padding:4px 1px;font-size:.72rem;text-align:center;border-radius:8px;display:flex !important}
  .sidebar-quick .sq-label{white-space:nowrap}
  .sidebar-quick .sq-badge{margin-left:1px;padding:0 3px;min-width:14px;height:14px;font-size:9px}
  .sidebar-overlay.open{display:block}
  .main-wrap{grid-template-columns:1fr;padding:10px;padding-top:calc(var(--header-h) + 32px)}
  .main-content{grid-column:auto}
  .content{grid-column:auto;padding:14px 12px}
  .product-grid{grid-template-columns:1fr}
  #div_searcher_list .esl-bar{display:none}
}
@media(max-width:480px){html{font-size:15px}.header-bar{padding:0 10px}}


/* ===== 首頁樣式（來自 index_modern.htm）===== */
.suggest-header {display:flex;align-items:center;gap:6px;padding:8px 12px 6px;
  font-size:.7rem;font-weight:700;color:var(--text-l);text-transform:uppercase;letter-spacing:.8px;}
.suggest-header svg {width:13px;height:13px;color:var(--accent)}
.suggest-item .suggest-icon {width:16px;height:16px;color:var(--text-l);flex-shrink:0;opacity:.4;transition:all .15s ease;}
.suggest-item:hover .suggest-icon,.suggest-item.active .suggest-icon {color:var(--primary);opacity:1}
.suggest-item .suggest-text {flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.suggest-item .suggest-hl {font-weight:800;color:var(--primary);background:rgba(183,28,28,.08);padding:0 2px;border-radius:3px}
.suggest-item .suggest-arrow {width:14px;height:14px;color:var(--primary);opacity:0;transition:all .15s ease;flex-shrink:0;transform:translateX(-4px)}
.suggest-item:hover .suggest-arrow,.suggest-item.active .suggest-arrow {opacity:.6;transform:translateX(0)}
.suggest-empty {padding:20px 16px;text-align:center;font-size:.82rem;color:var(--text-l);
  display:flex;flex-direction:column;align-items:center;gap:6px;}
.suggest-empty svg {width:28px;height:28px;color:#e2e8f0}
.suggest-divider {height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);margin:6px 4px}
.icon-btn {width:38px;height:38px;border:none;background:transparent;border-radius:50%;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;color:var(--text-l);transition:var(--tr);}
.icon-btn:hover {background:var(--bg);color:var(--primary)}
.hdr-nav-link {display:flex;align-items:center;gap:5px;
  padding:7px 14px;font-size:.82rem;color:var(--text-l);border-radius:20px;
  transition:var(--tr);white-space:nowrap;font-weight:500;text-decoration:none;}
.hdr-nav-link:hover {background:var(--bg);color:var(--primary);text-decoration:none}
.nav-icon {width:14px;height:14px;flex-shrink:0;opacity:.6}
.hdr-nav-link:hover .nav-icon {opacity:1}
.cart-btn .cart-icon-svg {width:20px;height:20px;flex-shrink:0;transition:var(--tr)}
.cart-btn.bounce {animation:cartBounce .5s ease}
.cart-btn.bounce .cart-count {animation:countPop .3s ease}
/* 飛入購物車動畫 */
.fly-orb {position:fixed;width:24px;height:24px;border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  z-index:9999;pointer-events:none;
  box-shadow:0 2px 8px rgba(183,28,28,.4);}
.fly-orb.flying {animation:flyToCart .6s cubic-bezier(.4,.0,.2,1) forwards}
/* 提示通知 - 方案A：白底深字藍圖標 */
.toast-container {position:fixed;top:24px;left:50%;transform:translateX(-50%);
  z-index:10000;display:flex;flex-direction:column;gap:8px;align-items:center;
  pointer-events:none;}
.toast {display:inline-flex;align-items:center;gap:8px;
  padding:8px 16px;background:#fff;color:#1e293b;
  border:1px solid #e2e8f0;
  border-radius:999px;font-size:13px;font-weight:600;font-family:var(--font);
  box-shadow:0 4px 16px rgba(0,0,0,.1),0 2px 4px rgba(0,0,0,.06);
  animation:toastSlide .35s cubic-bezier(.34,1.56,.64,1) forwards;
  pointer-events:auto;white-space:nowrap;}
@keyframes toastSlide{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}
.toast .toast-cart {width:16px;height:16px;color:rgba(30,41,59,.5);flex-shrink:0}
.toast .toast-sep {width:1px;height:14px;background:rgba(30,41,59,.15);flex-shrink:0}
.toast .toast-icon {width:16px;height:16px;color:#2563eb;flex-shrink:0}
.toast .toast-title {font-size:13px;font-weight:600;color:#1e293b}
.search-mask.show {display:block}
/* ===== 收藏彈窗登入 ===== */
.fav-login-overlay{position:fixed;inset:0;background:rgba(248,250,252,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10005;display:flex;align-items:center;justify-content:center}
.fav-login-card{background:var(--surface);border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.18);width:380px;max-width:92vw;padding:28px 24px 20px;position:relative}
.fav-login-close{position:absolute;top:8px;right:10px;width:32px;height:32px;border:none;background:transparent;font-size:22px;cursor:pointer;color:var(--text-l);border-radius:50%;display:flex;align-items:center;justify-content:center}
.fav-login-close:hover{background:var(--bg2);color:var(--text)}
.fav-login-title{font-size:20px;font-weight:700;color:var(--text);text-align:center;margin:0 0 20px}
.fav-login-field{position:relative;margin-bottom:12px}
.fav-login-field input{width:100%;padding:12px 14px;padding-right:42px;border:1.5px solid var(--border);border-radius:10px;font-size:15px;font-family:var(--font);transition:var(--tr);background:var(--surface)}
.fav-login-field input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.fav-login-field-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;font-size:13px;color:var(--text-l)}
.fav-login-check{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:13px}
.fav-login-check input{width:16px;height:16px;accent-color:var(--primary)}
.fav-login-turnstile{margin-bottom:14px;display:flex;justify-content:center;align-items:center;min-height:65px}
.fav-turnstile-retry{padding:10px 18px;background:#fff;border:1px solid #cbd5e1;border-radius:8px;color:#334155;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}
.fav-turnstile-retry:hover{background:#f1f5f9;border-color:#94a3b8}
.fav-login-msg{font-size:13px;text-align:center;margin-bottom:12px;min-height:20px}
.fav-login-msg-err{color:#ef4444}
.fav-login-submit{width:100%;padding:12px;background:linear-gradient(135deg,var(--primary),var(--purple1));color:#fff;border:none;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer;font-family:var(--font);transition:var(--tr)}
.fav-login-submit:hover{opacity:.92;transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,99,235,.3)}
.fav-login-submit:active{transform:translateY(0)}
.fav-login-submit:disabled{opacity:.6;pointer-events:none}
.fav-login-reg-link{text-align:center;margin-top:16px;font-size:14px}
.fav-login-reg-link a{color:var(--primary);text-decoration:none;font-weight:500}
.fav-login-reg-link a:hover{text-decoration:underline}
.fav-login-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-l);border-radius:50%;padding:0}
.fav-login-eye:hover{background:var(--bg2);color:var(--text)}
.fav-login-eye svg{width:18px;height:18px}
.fav-login-forgot-link{color:var(--primary);text-decoration:none;font-size:13px;font-weight:500}
.fav-login-forgot-link:hover{text-decoration:underline}
.fav-login-desc{font-size:14px;color:var(--text-l);text-align:center;margin:0 0 16px;line-height:1.6}
/* ===== 迷你購物車下拉選單 (A+D) ===== */
.cart-dropdown {display:none;position:absolute;top:calc(100% + 6px);right:0;
  width:380px;max-height:calc(100vh - 120px);
  background:var(--surface);border:1px solid var(--border);border-radius:14px;
  box-shadow:0 12px 40px rgba(15,23,42,.16),0 4px 12px rgba(15,23,42,.08);
  z-index:10002;overflow:hidden;flex-direction:column;
  opacity:0;transform:translateY(-6px) scale(.97);transform-origin:top right;
  transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.cart-dropdown.open {display:flex;opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.mini-cart-header {display:flex;align-items:center;gap:8px;padding:14px 16px 10px;
  border-bottom:1px solid var(--border-l);flex-shrink:0}
.mini-cart-title {font-size:.92rem;font-weight:700;color:var(--text);display:flex;align-items:center;gap:6px}
.mini-cart-title svg {width:17px;height:17px;color:var(--primary)}
.mini-cart-count {font-size:.72rem;font-weight:600;color:var(--text-l);
  background:var(--bg2);padding:2px 8px;border-radius:999px}
.mini-cart-close {margin-left:auto;width:28px;height:28px;border:none;background:transparent;
  cursor:pointer;border-radius:8px;display:flex;align-items:center;justify-content:center;
  color:var(--text-l);transition:var(--tr)}
.mini-cart-close:hover {background:var(--bg2);color:var(--text)}
.mini-cart-close svg {width:16px;height:16px}
.mini-cart-list {flex:1;overflow-y:auto;padding:4px 0;min-height:60px;max-height:min(440px,calc(100vh - 320px))}
.mini-cart-list::-webkit-scrollbar {width:5px}
.mini-cart-list::-webkit-scrollbar-thumb {background:var(--border-strong);border-radius:3px}
.mini-cart-item {display:flex;align-items:center;gap:8px;padding:8px 16px;
  transition:background .15s;border-bottom:1px solid var(--border-l)}
.mini-cart-item:last-child {border-bottom:none}
.mini-cart-item:hover {background:var(--surface-soft)}
.mini-cart-item-info {flex:1;min-width:0}
.mini-cart-item-title-wrap {display:flex;align-items:flex-start;gap:4px}
.mini-cart-item-title {font-size:.8rem;color:var(--text);text-decoration:none;line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  word-break:break-word;flex:1;min-width:0}
.mini-cart-item-title:hover {color:var(--primary)}
.mini-cart-item-price {font-size:.82rem;font-weight:700;color:#2563eb;
  white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums}
.mini-cart-item-price.notfree {color:#FF7A45}
.mini-cart-item-notfree {display:inline-block;text-align:center;background:#FF7A45;color:#fff;
  padding:2px 7px;border-radius:4px;font-size:12px;font-weight:500;white-space:nowrap;
  flex-shrink:0;margin-top:1px}
.mini-cart-empty {display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;padding:32px 16px;color:var(--text-dim)}
.mini-cart-empty svg {width:40px;height:40px;opacity:.4}
.mini-cart-empty span {font-size:.84rem}
.mini-cart-prompts {padding:6px 16px;border-top:1px solid var(--border-l);flex-shrink:0;display:flex;flex-direction:column;gap:6px}
.mini-cart-prompt-blue {font-size:.72rem;text-align:center;line-height:1.45;font-weight:600;color:#2563eb;background:#eff6ff;border:0.5px solid #bfdbfe;border-radius:6px;padding:7px 10px}
.mini-cart-prompt-green {font-size:.72rem;text-align:center;line-height:1.45;font-weight:600;color:#15803d;background:#f0fdf4;border:0.5px solid #bbf7d0;border-radius:6px;padding:7px 10px}
/* 折扣進度條 */
.mini-cart-progress-track {width:100%;height:8px;background:#e2e8f0;border-radius:999px;overflow:hidden}
.mini-cart-progress-fill {height:100%;background:#2563eb;border-radius:999px;transition:width .5s ease;width:0}
.mini-cart-item-remove {width:22px;height:22px;border:none;border-radius:4px;background:transparent;color:var(--text-dim);font-size:18px;line-height:1;cursor:pointer;padding:0;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .15s}
.mini-cart-item-remove:hover {background:#fef2f2;color:#dc2626}
.mini-cart-footer {padding:12px 16px;border-top:1px solid var(--border);flex-shrink:0;
  background:var(--surface-soft)}
.mini-cart-subtotal {display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.mini-cart-subtotal-label {font-size:.8rem;color:var(--text-l);font-weight:600}
.mini-cart-subtotal-amount {font-size:1.1rem;font-weight:800;color:var(--red);font-variant-numeric:tabular-nums}
.mini-cart-discount {font-size:.7rem;color:var(--green);margin-bottom:8px;text-align:right;font-variant-numeric:tabular-nums}
.mini-cart-checkout {display:flex;align-items:center;justify-content:center;gap:6px;
  width:100%;padding:10px 16px;background:linear-gradient(135deg,var(--primary),var(--primary-d));
  color:#fff;font-size:.86rem;font-weight:700;text-decoration:none;border-radius:10px;
  transition:var(--tr);box-shadow:0 4px 12px rgba(37,99,235,.2)}
.mini-cart-checkout:hover {color:#fff;transform:translateY(-1px);box-shadow:0 6px 18px rgba(37,99,235,.3)}
.mini-cart-checkout:active {transform:translateY(0)}
.mini-cart-checkout svg {width:16px;height:16px;color:#fff}
.mini-cart-loading {display:flex;align-items:center;justify-content:center;padding:32px 16px;
  color:var(--text-dim);font-size:.82rem}
.sq-icon {width:18px;height:18px;flex-shrink:0;color:var(--text-l);transition:color .2s}
.sq-link:hover .sq-icon {color:var(--primary)}
.sq-label {letter-spacing:.03em}
.section-title {background:linear-gradient(135deg,#6D28D9 0%,#7C3AED 50%,#6D28D9 100%);color:#fff;
  font-size:.96rem;font-weight:800;padding:11px 18px;border-radius:14px;
  margin:0 0 16px;display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.04em;
  box-shadow:0 4px 14px rgba(124,58,237,.15)}
.section-title.dyna-title {background:linear-gradient(135deg,#f8fafc 0%,#fff 100%);color:#334155;
  font-size:1.05rem;font-weight:800;padding:12px 16px;border-radius:14px;
  margin:0 0 10px;align-items:center;gap:10px;letter-spacing:.03em;justify-content:flex-start;display:none;
  border:1px solid rgba(148,163,184,.16);box-shadow:0 1px 2px rgba(15,23,42,.04)}
.section-title.dyna-title .section-count {font-size:13px;color:#94a3b8;font-weight:400;padding-top:6px;opacity:1;margin-left:8px}
.section-title.dyna-title img, .section-title.dyna-title .section-icon {display:none}
.section-count {font-size:.82rem;font-weight:400;opacity:.85;white-space:nowrap;}
.section-icon {width:16px;height:16px;flex-shrink:0}
.home-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow:hidden;margin:0 0 20px;box-shadow:0 2px 8px rgba(15,23,42,.06)}
.home-card:last-child{margin-bottom:0}
.card-header{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;font-size:1.05rem;font-weight:700;color:#fff}
.card-header.ann{background:linear-gradient(135deg,#4338ca,#6366f1)}
.card-header.prod{background:linear-gradient(135deg,var(--blue1),var(--blue2))}
.card-header svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.card-body{padding:0}
.list-item{display:flex;align-items:center;gap:8px;padding:5px 12px;border-bottom:1px solid var(--border-l);font-size:.82rem}
.list-item:last-child{border-bottom:none}
.item-icon{flex-shrink:0;width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none}
.item-icon.ann{background:transparent;color:#6366f1}
.item-icon.prod{background:var(--blue1)}
.item-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.item-main{flex:1;min-width:0}
.item-title{color:var(--link);text-decoration:none;font-size:15px;font-weight:400;line-height:1.45;letter-spacing:.015em;word-break:break-word}
.item-title.red{color:var(--red)}
.ann-badge{display:inline-block;background:#e0e7ff;color:#4338ca;padding:1px 6px;border-radius:4px;font-size:.72rem;font-weight:700;margin-right:6px;flex-shrink:0}
.promo-banner {background:linear-gradient(135deg,#eef2ff,#e0e7ff);border:1px solid #c7d2fe;border-radius:10px;
  padding:10px 14px;margin:8px 12px 12px;text-align:center;font-size:14px;
  font-weight:400;line-height:1.55;letter-spacing:.015em;color:#475569;}
.promo-banner b{font-weight:500}
.promo-banner a{color:#4338ca;font-weight:500;text-decoration:none}
.promo-banner a:hover{text-decoration:underline}
.promo-highlight {background:none;color:#4338ca;padding:0 2px;font-weight:500;font-size:.9em}
.ann-item {display:flex;align-items:baseline;gap:8px;padding:6px 8px;
  border-bottom:1px solid #f5f0e8;font-size:.84rem;flex-wrap:wrap;}
.ann-icon {width:14px;height:14px;color:#6366f1;flex-shrink:0}
.ann-date {color:#6366f1;font-weight:700;white-space:nowrap;flex-shrink:0;font-family:"Inter",sans-serif;font-size:.8rem}
.ann-link {font-weight:500}
.ann-extra {color:var(--text-l);font-size:.8rem}
/* 麵包屑 */
.breadcrumb{display:flex;align-items:center;gap:6px;padding:4px 0 2px;font-size:13.8px;color:var(--text-l);flex-wrap:wrap;font-weight:600}
.breadcrumb a{color:#64748b;font-weight:600;text-decoration:none}
.breadcrumb a:hover{color:var(--primary);text-decoration:underline}
.breadcrumb .bc-sep{color:#cbd5e1}
.breadcrumb .bc-type{color:#64748b;font-weight:700}
.breadcrumb .bc-count{font-size:13.8px;color:#94a3b8;margin-left:auto;white-space:nowrap}
.breadcrumb .bc-current{color:var(--text);font-weight:700}

/* 分頁（現代版） */
.pagination-wrap{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:14px 0;font-size:.82rem;color:var(--text-l)}
.pg-info{font-weight:500;white-space:nowrap}
.pg-info b{color:var(--primary);font-family:"Inter",sans-serif}
.pagination-wrap a,.pagination-wrap span{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 10px;border:1.5px solid var(--border);border-radius:8px;font-size:.82rem;font-weight:600;color:var(--text-l);background:var(--surface);transition:all .15s ease;cursor:pointer;font-family:var(--font)}
.pagination-wrap a:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.pagination-wrap span{opacity:.35;cursor:default;pointer-events:none}
.pagination-wrap select{font-size:.82rem;padding:4px 8px;border:1.5px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font-family:var(--font);cursor:pointer}
.pagination-top{margin-bottom:10px}
.pagination-bottom{margin-top:10px}

/* ===== Pubu 风格数字分頁 ===== */
.pubu-pg{display:flex;align-items:center;justify-content:center;gap:5px;margin:28px 0;width:100%;box-sizing:border-box}
/* 箭頭按鈕（第一頁/上頁/下頁/末頁） */
.pubu-pg-a{display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border:1px solid #e0e0e0;border-radius:6px;
  background:#fff;color:#475569;font-size:.85rem;font-weight:600;
  text-decoration:none;transition:all .15s ease;cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.03);line-height:1}
.pubu-pg-a:hover{background:var(--primary);color:#fff;border-color:var(--primary);transform:translateY(-1px)}
.pubu-pg-a.pubu-pg-d{opacity:.25;cursor:default;pointer-events:none;background:#fafafa;border-color:#eee;transform:none}
.pubu-pg-d:hover{background:#fafafa;color:#cbd5e1;border-color:#eee;transform:none}
/* 頁碼按鈕 */
.pubu-pg-n{display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:34px;padding:0 8px;
  border:1px solid #e0e0e0;border-radius:6px;
  background:#fff;color:#334155;font-size:.88rem;font-weight:600;
  text-decoration:none;transition:all .15s ease;cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.03)}
.pubu-pg-n:hover{background:var(--primary);color:#fff;border-color:var(--primary);transform:translateY(-1px);box-shadow:0 3px 8px rgba(37,99,235,.25)}
/* 當前頁 */
.pubu-pg-on{background:var(--primary)!important;color:#fff!important;border-color:var(--primary)!important;
  cursor:default;box-shadow:0 3px 10px rgba(37,99,235,.35)!important;transform:translateY(-1px);font-weight:700}
/* 省略號 */
.pubu-pg-dot{display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:34px;color:#cbd5e1;font-weight:400;font-size:.9rem;letter-spacing:2px}
.search-count {display:flex;justify-content:flex-end;padding:0 4px 8px 0;
  font-size:.82rem;color:var(--text-l);}
.search-count b {color:var(--primary);font-family:var(--font-mono);margin:0 3px;}
.product-list {display:flex;flex-direction:column;gap:1px;
  background:var(--border);border-radius:12px;overflow:hidden;
  box-shadow:0 2px 8px rgba(0,0,0,.06),0 0 0 1px rgba(0,0,0,.03);}
.prod-item {display:flex;align-items:center;gap:12px;padding:11px 14px;
  background:var(--surface);font-size:.86rem;
  transition:all .2s cubic-bezier(.16,1,.3,1);
  position:relative;}
.prod-item::before {content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:transparent;border-radius:0 3px 3px 0;
  transition:background .2s;}
.prod-item:hover {background:rgba(37,99,235,.02);
  z-index:1;}
.prod-item:hover::before {background:#2563eb}
.prod-item:has(.prod-title.red):hover::before,
.prod-item.red:hover::before {background:var(--red)}
.prod-item:has(.prod-title.blue):hover::before,
.prod-item.blue:hover::before {background:var(--blue1)}
.prod-buy {flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:12px;
  background:#fff;
  border:1.5px solid #2563eb;
  color:#2563eb;cursor:pointer;transition:all .22s ease;
  box-shadow:none;
  position:relative;overflow:hidden;}
.prod-buy::before {content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.18),transparent 55%);pointer-events:none;opacity:0}
.prod-buy:hover {transform:translateY(-1px);
  background:#2563eb;
  border-color:#2563eb;color:#fff;
  box-shadow:0 4px 12px rgba(37,99,235,.25)}
.prod-buy:hover::before {opacity:.8}
.prod-buy:active {transform:translateY(0) scale(.98)}
.prod-buy.added {background:#fff;border-color:#2563eb;color:#2563eb;opacity:.92}
.prod-buy.added::before {opacity:0}
.prod-buy.added:hover {background:#2563eb;border-color:#2563eb;color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,99,235,.25)}
.prod-buy.added:hover::before {opacity:.8}
.prod-buy.added .prod-cart-icon {animation:checkPop .4s ease}
.prod-cart-icon {width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.35;stroke-linecap:round;stroke-linejoin:round;transition:var(--tr);flex-shrink:0;position:relative;z-index:1}
/* 隱藏精選商品區的磁碟編號 */
.product-list .prod-num{display:none}

.prod-title.red {color:#b45309}
.prod-title.blue {color:#1d4ed8}
.prod-title.red:hover {color:#1e293b;text-decoration:none}
.prod-title.blue:hover {color:#1e293b;text-decoration:none}
/* Visited link tracking — JS+localStorage (browser blocks text-decoration in :visited)
   2026-08-24: Reddit 式換色相 — 藍 #1d4ed8 → 調和版紫 #6d5bd0（不抽色彩，鮮明可讀） */
.prod-title.red.visited,.prod-title.blue.visited{color:#6d5bd0}
.prod-title.red.visited:hover,.prod-title.blue.visited:hover{color:#5a48b8}
.addin-card-body .prod-title.visited{color:#6d5bd0}
.addin-card-body .prod-title.visited:hover{color:#5a48b8}

.product-list .prod-title{font-size:15px;line-height:1.65;letter-spacing:.015em;font-weight:400;word-break:break-word;color:#475569;transition:color .2s ease,opacity .2s ease}
.product-list .prod-title.visited{color:#6d5bd0}
.product-list .prod-title.visited:hover{color:#5a48b8}
.product-list .prod-title:hover{color:#1e293b;opacity:1}
.product-list .prod-title.blue{color:#1d4ed8}
.product-list .prod-title.red{color:#1d4ed8}
.product-list .prod-title.blue.visited,.product-list .prod-title.red.visited{color:#6d5bd0}
/* 搜索關鍵字高亮 — 黃底圓角標籤 */
.prod-title b,.prod-title strong,.prod-title mark,.sr-hl{background:#fef08a;color:#1e293b;padding:0 3px;border-radius:3px;font-weight:700}
/* ===== Addin Cards Grid (dyna_menu_addin卡片布局) ===== */
.addin-cards{display:grid;grid-template-columns:1fr;gap:16px}
.addin-card{background:var(--surface);border-radius:16px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.06);border:1px solid #e2e8f0;transition:transform .2s,box-shadow .2s}
.addin-card:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(0,0,0,.12)}
.addin-card-header{display:flex;align-items:center;gap:10px;padding:14px 18px;background:linear-gradient(135deg,rgba(30,64,175,.94),rgba(37,99,235,.88));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;font-size:.92rem;font-weight:700;letter-spacing:.03em;border-bottom:1px solid rgba(255,255,255,.08)}
.addin-card-body{display:flex;flex-direction:column}
.addin-card-icon{font-size:1.1em;line-height:1;flex-shrink:0}
.addin-card-title{flex:1}
.addin-card-count{font-size:.78em;font-weight:400;background:rgba(255,255,255,.15);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);padding:2px 10px;border-radius:20px;white-space:nowrap;border:1px solid rgba(255,255,255,.12)}
.addin-card-body .prod-item{border-radius:0;border-bottom:1px solid #f1f5f9;padding:9px 14px;background:#fff;box-shadow:none}
.addin-card-body .prod-item:last-child{border-bottom:none}
.addin-card-body .prod-item:hover{background:#f8fafc}
.addin-card-body .prod-title{font-size:14px !important;line-height:1.55 !important;letter-spacing:.01em !important}
.addin-card-body .prod-cart-btn{opacity:.6;transition:opacity .2s}
.addin-card-body .prod-cart-btn:hover{opacity:1}
@media(max-width:768px){.addin-cards{grid-template-columns:1fr;gap:12px}
.addin-card-header{font-size:.85rem;padding:12px 14px}
.addin-card-body .prod-item{padding:8px 12px}}
/* ===== 覆寫 lch_ajax88.js 旧搜尋下拉选单 ===== */
#div_searcher_list {position:absolute;top:calc(100% + 8px) !important;left:0 !important;
  z-index:101 !important;
  background:var(--surface) !important;border:none !important;border-radius:16px !important;
  box-shadow:0 12px 40px rgba(0,0,0,.15),0 0 0 1px rgba(0,0,0,.04) !important;
  overflow-y:auto;overflow-x:hidden;padding:8px !important;
  animation:suggestIn .2s cubic-bezier(.16,1,.3,1);}
#div_searcher_list .esl-item {display:flex !important;align-items:center;gap:10px;
  padding:9px 12px;cursor:pointer;border-radius:10px;transition:background .15s ease;margin:2px 0}
#div_searcher_list .esl-item:hover {background:rgba(37,99,235,.08)}
#div_searcher_list .esl-item.esl-active {background:rgba(37,99,235,.14)}
#div_searcher_list .esl-icon {width:30px;height:30px;border-radius:8px;flex-shrink:0;
  background:linear-gradient(135deg,#f1f5f9,#e2e8f0);color:#94a3b8;
  display:flex;align-items:center;justify-content:center}
#div_searcher_list .esl-icon svg {width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#div_searcher_list .esl-text {flex:1;min-width:0;font-size:.88rem;font-weight:500;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#div_searcher_list .esl-hl {font-weight:800;color:var(--primary);background:rgba(37,99,235,.1);padding:0 2px;border-radius:3px}
#div_searcher_list .esl-bar {width:50px;height:5px;background:#f1f5f9;border-radius:999px;overflow:hidden;flex-shrink:0}
#div_searcher_list .esl-bar-fill {height:100%;background:linear-gradient(90deg,var(--accent),#a855f7);border-radius:999px;transition:width .3s ease}
#div_searcher_list .esl-count {flex-shrink:0;font-size:.72rem;font-weight:700;color:var(--green);
  background:#dcfce7;padding:3px 9px;border-radius:999px;white-space:nowrap}
.hdr-nav-link .nav-icon {width:18px;height:18px;opacity:.8}
.sidebar-quick .sq-icon {width:20px;height:20px;margin:0 auto}
@media(min-width:481px){
  .site-header > .cart-dropdown,
  .header-bar > .cart-dropdown { right: calc((100vw - min(100vw, 1440px)) / 2 + 16px); }
}
.mini-cart-item-title{-webkit-line-clamp:1}
.mini-cart-item{padding:7px 12px}

@media(max-width:768px){
  .prod-item{padding:10px 12px;gap:10px}
  .prod-buy{width:36px;height:36px;border-radius:11px}
}

@media(max-width:768px){
  .mobile-menu-btn{display:flex}
  .mega-menu-btn{display:none}
  .hdr-search{display:none}
  .search-toggle-btn{display:flex}
  .logo-mark{font-size:1.2rem}
  .logo-sub{font-size:.72rem}
  .hdr-nav-link{font-size:0;padding:7px 12px;gap:0}
  .hdr-nav-link .nav-icon{width:18px;height:18px;opacity:.8}
  .cart-btn{font-size:0;padding:7px 12px;gap:0}
  .cart-btn .cart-icon-svg{width:22px;height:22px}
  .cart-btn .cart-count{font-size:.72rem;min-width:18px;height:18px;border-radius:9px;padding:0 5px;font-weight:800}
  .hdr-login,.hdr-register,.hdr-member,.hdr-logout,.hdr-member-wrap,.hdr-member-dropdown,.hdr-member-overlay{display:none !important}
  #topbar-auth{display:flex;align-items:center;gap:3px;margin-left:auto}
  .tb-auth-member{display:none !important} /* 手機版頭像已移至第一行 */
  .tb-auth-login{display:inline-flex;align-items:center;padding:3px 9px;font-size:.75rem;font-weight:600;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:14px;text-decoration:none;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.25)}
  .tb-auth-login:hover,.tb-auth-login:active{color:#fff;box-shadow:0 3px 10px rgba(0,0,0,.4)}
  .tb-auth-register{display:inline-flex;align-items:center;padding:3px 9px;font-size:.75rem;font-weight:600;color:#1e40af;background:#fff;border-radius:14px;text-decoration:none;white-space:nowrap}
  .tb-auth-member{display:inline-flex;align-items:center;gap:3px;padding:2px 8px 2px 2px;font-size:.75rem;font-weight:500;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:14px;text-decoration:none;white-space:nowrap}
  .tb-auth-avatar{width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;text-transform:uppercase;flex-shrink:0}
  .tb-auth-logout{display:inline-flex;align-items:center;padding:3px 9px;font-size:.75rem;font-weight:600;color:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.25);border-radius:14px;text-decoration:none;white-space:nowrap;transition:all .2s}
  .tb-auth-logout:hover,.tb-auth-logout:active{color:#fff;border-color:rgba(255,255,255,.5);box-shadow:0 3px 10px rgba(0,0,0,.4)}
  .ann-extra{display:none}
  
  
  /* 搜索模式：header 展開，熱門關鍵字放在搜索框下方（header 內） */
  .site-header.search-open{position:relative;height:auto}
  .site-header.search-open ~ .main-wrap{padding-top:0}
  .site-header.search-open ~ .search-mask{top:0}
  .header-bar.search-mode .header-left{display:none}
  .header-bar.search-mode .header-right{display:none}
  .header-bar.search-mode{
    height:auto;min-height:var(--header-h);flex-wrap:wrap;align-items:flex-start;padding:10px 10px 6px;gap:4px;
  }
  .header-bar.search-mode .hdr-search{
    display:grid;grid-template-columns:1fr 40px;grid-template-rows:auto auto auto;align-items:start;gap:6px 4px;
    flex:1;max-width:none;margin:0 10px 0 0;min-width:0;position:relative;
  }
  .header-bar.search-mode .hdr-back{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;background:#fff;border:1.5px solid var(--primary);border-radius:50%;color:var(--primary);transition:var(--tr)}
  .header-bar.search-mode .hdr-back svg{width:24px;height:24px;stroke-width:3}
  .header-bar.search-mode .hdr-back:hover,.header-bar.search-mode .hdr-back:active{background:var(--primary);border-color:#fff;color:#fff}
  .header-bar.search-mode .hdr-back:active{transform:scale(.95)}
  .header-bar.search-mode .hdr-search input{
    grid-column:1/2;grid-row:1;min-width:0;width:100%;
    background:rgba(28,28,28,.05);border:none;border-radius:57px;
    height:40px;padding:0 16px 0 36px;font-size:15px;color:#475569;
    box-shadow:none;
  }
  .header-bar.search-mode .hdr-search input::placeholder{color:#94a3b8}
  .header-bar.search-mode .hdr-search input:focus{background:rgba(28,28,28,.08);box-shadow:none}
  .header-bar.search-mode .hdr-search-btn{
    grid-column:2/3;grid-row:1;
    position:static;
    align-self:start;
    transform:none;
    display:flex;align-items:center;justify-content:center;
    width:40px;height:40px;min-width:40px;padding:0;border-radius:50%;
    background-color:#fff;border:1.5px solid var(--primary);color:var(--primary);box-shadow:none;
    transition:var(--tr);
  }
  .header-bar.search-mode .hdr-search-btn svg{width:18px;height:18px}
  .header-bar.search-mode .hdr-search-btn:hover{
    background-color:var(--primary);border-color:#fff;color:#fff;box-shadow:none
  }
  .header-bar.search-mode .hdr-search-btn:active{
    background-color:var(--primary);
    border-color:#fff;
    color:#fff;
    box-shadow:none;
    transform:translateY(2px) scale(.96)
  }
  .header-bar.search-mode .hdr-search .search-suggest{
    position:absolute;top:calc(100% + 6px);left:0;right:0;
    z-index:105;border-radius:14px;max-height:260px;
    background:var(--surface);box-shadow:0 16px 40px rgba(0,0,0,.18);
    border:none;padding:8px;animation:suggestIn .2s cubic-bezier(.16,1,.3,1);
  }
  .header-bar.search-mode .hdr-search #div_searcher_list{
    position:relative !important;top:auto !important;left:auto !important;right:auto !important;
    width:auto !important;z-index:1 !important;
    grid-column:1/2;grid-row:2;
    border-radius:10px !important;margin:0;max-height:220px;
    box-shadow:none !important;
  }
  .header-bar.search-mode .hdr-search .search-hot{
    grid-column:1/2;grid-row:3;
    position:static;display:block;width:100%;max-height:none;overflow:visible;
    background:transparent;box-shadow:none;border-radius:0;padding:2px 0 0;margin:0;
  }
  .header-bar.search-mode .hdr-search.has-suggestions .search-hot{
    display:none;
  }
  .header-bar.search-mode .hdr-search .search-hot-title-row{
    display:none;
  }
  .header-bar.search-mode .hdr-search .search-hot-title{
    font-size:11px;font-weight:500;color:var(--text-l);white-space:nowrap;
  }
  .header-bar.search-mode .hdr-search .search-hot-dashed{
    flex:1;border-bottom:0.5px dashed var(--border);height:0;
  }
  .header-bar.search-mode .hdr-search .search-hot-tags{gap:6px 10px;padding-left:0;flex-wrap:wrap}
  .header-bar.search-mode .hdr-search .search-hot-tag{
    font-size:14px;padding:0;background:transparent;border:none;border-radius:0;color:#94a3b8;text-decoration:none;font-weight:400;
  }
  .header-bar.search-mode .hdr-search .search-hot-tag:hover,
  .header-bar.search-mode .hdr-search .search-hot-tag:active{
    background:transparent;color:var(--primary);text-decoration:underline;border:none;
  }
  /* 手機版：最多顯示 4 個熱門關鍵字（DB 6 個，隱藏第 5 個以後，所有頁面所有模式都生效） */
  .hdr-search .search-hot-tag:nth-child(n+5){display:none}
  .search-mask.show{top:0;height:100vh}
  .search-hot-tag{font-size:.9rem;padding:0;background:transparent;border:none;border-radius:0;color:var(--text-l);text-decoration:underline;text-underline-offset:3px}
  .search-hot-tag:hover,.search-hot-tag:active{background:transparent;color:var(--primary);text-decoration:underline;border:none}
  .suggest-header{display:none}
  .suggest-item{padding:7px 10px;font-size:.78rem}
  #div_searcher_list .esl-bar{width:36px}
  #div_searcher_list .esl-count{font-size:.68rem;padding:2px 7px}
  .sidebar{
    position:fixed;top:0;left:0;bottom:0;width:340px;max-height:none;z-index:10001;
    transform:translateX(-100%);transition:transform .3s ease;border-radius:0;
  }
  .sidebar.open{transform:translateX(0)}
  .sidebar-close{display:block;top:4px;right:4px}
  .sidebar-quick{display:flex;flex-direction:row;gap:1px;padding:0;margin-top:32px;border-bottom:2px solid var(--primary);overflow:visible !important}
  .sidebar-quick .sq-link{flex:1;min-width:0;flex-direction:column;gap:2px;padding:4px 1px;font-size:.72rem;text-align:center;border-radius:8px;display:flex !important}
  .sidebar-quick .sq-label{white-space:nowrap}
  .sidebar-quick .sq-badge{margin-left:1px;padding:0 3px;min-width:14px;height:14px;font-size:9px}
  .sidebar-quick .sq-icon{width:20px;height:20px;margin:0 auto}
  .sidebar-quick .sq-member-card{flex:1;flex-direction:column;gap:2px;padding:10px 4px;text-align:center;border-radius:8px;min-width:0}
  .sidebar-quick .sq-member-avatar{width:24px;height:24px;font-size:11px;margin:0 auto}
  .sidebar-quick .sq-member-info{align-items:center;gap:0}
  .sidebar-quick .sq-member-name{font-size:.72rem}
  .sidebar-quick .sq-member-label{display:none}
  .accordion{margin-top:0}
  .sidebar-overlay.open{display:block}
  .main-wrap{grid-template-columns:1fr;padding:calc(var(--header-h) + 32px) 10px 10px}
  .main-content{grid-column:auto}
  .content{grid-column:auto;padding:12px}
  .section-title{margin:0 -12px;border-radius:0}
  .section-title.dyna-title{margin:0 0 4px;border-radius:0}
  .home-card{margin:0 0 12px;border-radius:12px}
  .card-header{padding:10px 14px;font-size:.98rem}
  .list-item{padding:3px 9px;gap:6px;font-size:.8rem}
  .item-title{font-size:15px;line-height:1.45}
  .item-icon{width:26px;height:26px;border-radius:7px}
  .item-icon svg{width:15px;height:15px}
  .ann-badge{font-size:.68rem;padding:1px 5px}
  .promo-banner{margin:6px 8px 10px;padding:8px 12px;font-size:13px}
  .promo-highlight{padding:0}
  .mega-grid{grid-template-columns:1fr}
  .cart-dropdown{right:8px;width:calc(100vw - 16px);max-width:340px;max-height:80vh}
}




.main-content table.grid,
.main-content table[border="1"][class*="grid"] {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  border: none !important;
}
.main-content table.grid tr.title,
.main-content table[border="1"][class*="grid"] tr.title {
  background: #f8fafc;
  border-bottom: 2px solid #e2e8f0;
}
.main-content table.grid tr.title td,
.main-content table[border="1"][class*="grid"] tr.title td {
  padding: 10px 16px;
  font-weight: 600;
  font-size: 13px;
  color: #64748b;
}
.main-content table.grid td,
.main-content table[border="1"][class*="grid"] td {
  padding: 12px 16px;
  border-bottom: 1.5px solid #e2e8f0 !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  font-size: 14px;
}
.main-content table.grid tr:hover td,
.main-content table[border="1"][class*="grid"] tr:hover td {
  background: #f8fafc;
}


.main-content form table[border="1"],
.main-content form table[border="1"][cellspacing] {
  width: 100%;
  border: none !important;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.main-content form table[border="1"] td,
.main-content form table[border="1"][cellspacing] td {
  padding: 12px 16px;
  border: none !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 14px;
  vertical-align: top;
}
.main-content form table[border="1"] td:first-child,
.main-content form table[border="1"][cellspacing] td:first-child {
  width: 120px;
  font-weight: 600;
  color: #334155;
  background: #f8fafc;
}
.main-content form table[border="1"] input[type="text"],
.main-content form table[border="1"] input[type="email"],
.main-content form table[border="1"] input[type="tel"],
.main-content form table[border="1"] textarea,
.main-content form table[border="1"][cellspacing] input[type="text"],
.main-content form table[border="1"][cellspacing] input[type="email"],
.main-content form table[border="1"][cellspacing] input[type="tel"],
.main-content form table[border="1"][cellspacing] textarea {
  width: 100%;
  padding: 8px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-size: 14px;
  font-family: var(--font);
  transition: var(--tr);
}
.main-content form table[border="1"] input:focus,
.main-content form table[border="1"] textarea:focus,
.main-content form table[border="1"][cellspacing] input:focus,
.main-content form table[border="1"][cellspacing] textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37,99,235,.1);
  outline: none;
}
.main-content form table[border="1"] input[type="submit"],
.main-content form table[border="1"][cellspacing] input[type="submit"] {
  padding: 10px 32px;
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: var(--tr);
}
.main-content form table[border="1"] input[type="submit"]:hover,
.main-content form table[border="1"][cellspacing] input[type="submit"]:hover {
  background: var(--primary-d);
}


.main-content form[action="?"] table[border="1"],
.main-content form[action="?"] table[border="1"][cellspacing] {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden;
}
.main-content form[action="?"] table[border="1"] tr:first-child td,
.main-content form[action="?"] table[border="1"][cellspacing] tr:first-child td {
  background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%) !important;
  color: var(--primary-d) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: .03em;
  text-align: left !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #dbeafe !important;
}
.main-content form[action="?"] table[border="1"] tr:nth-child(2) td,
.main-content form[action="?"] table[border="1"][cellspacing] tr:nth-child(2) td {
  background: #fff !important;
  color: #334155 !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
  padding: 14px 16px !important;
}
.main-content form[action="?"] table[border="1"] tr:nth-child(2) td font,
.main-content form[action="?"] table[border="1"][cellspacing] tr:nth-child(2) td font {
  font-family: var(--font) !important;
}
.main-content form[action="?"] table[border="1"] tr:nth-child(2) td hr,
.main-content form[action="?"] table[border="1"][cellspacing] tr:nth-child(2) td hr {
  border: none;
  border-top: 1px solid #dbe4f0;
  margin: 10px 0;
}
.main-content form[action="?"] table[border="1"] td[colspan="3"][align="center"][bgcolor="Gray"],
.main-content form[action="?"] table[border="1"][cellspacing] td[colspan="3"][align="center"][bgcolor="Gray"] {
  background: #fff !important;
  color: var(--text) !important;
  font-weight: 800;
}
.main-content form[action="?"] table[border="1"] tr td,
.main-content form[action="?"] table[border="1"][cellspacing] tr td {
  padding: 10px 14px !important;
}
.main-content form[action="?"] table[border="1"] td:first-child,
.main-content form[action="?"] table[border="1"][cellspacing] td:first-child {
  width: 140px;
  background: #f8fafc;
  color: #1e293b;
  font-weight: 700;
}
.main-content form[action="?"] table[border="1"] td:nth-child(2),
.main-content form[action="?"] table[border="1"][cellspacing] td:nth-child(2) {
  color: #334155;
}
.main-content form[action="?"] table[border="1"] td:nth-child(3),
.main-content form[action="?"] table[border="1"][cellspacing] td:nth-child(3) {
  color: var(--text-l);
  font-size: 13px;
  line-height: 1.65;
}
.main-content form[action="?"] table[border="1"] textarea,
.main-content form[action="?"] table[border="1"][cellspacing] textarea {
  min-height: 160px;
  resize: vertical;
}
.main-content form[action="?"] table[border="1"] input[type="submit"],
.main-content form[action="?"] table[border="1"] input[type="reset"],
.main-content form[action="?"] table[border="1"][cellspacing] input[type="submit"],
.main-content form[action="?"] table[border="1"][cellspacing] input[type="reset"] {
  min-width: 140px;
}
.main-content form[action="?"] table[border="1"] input[type="reset"],
.main-content form[action="?"] table[border="1"][cellspacing] input[type="reset"] {
  background: #fff !important;
  color: #64748b !important;
  border: 1.5px solid #cbd5e1 !important;
}
.main-content form[action="?"] table[border="1"] input[type="reset"]:hover,
.main-content form[action="?"] table[border="1"][cellspacing] input[type="reset"]:hover {
  background: #f8fafc !important;
  color: #334155 !important;
  border-color: #94a3b8 !important;
}
.main-content form[action="?"] .ex_validator {
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.45;
}
.main-content form[action="?"] #ex_addr {
  background: #fff1f2;
  border: 2px solid #fb7185;
  border-radius: 10px;
  padding: 8px 12px;
  box-shadow: 0 4px 14px rgba(244,63,94,.12);
}


/* ===== Unified Utility Pages ===== */
.main-content > form,
.main-content > center > form {
  max-width: 1000px;
  margin: 0 auto;
}

.main-content > center > table[border="0"],
.main-content > table#table1,
.main-content > table[border="0"] {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}

.main-content form table[border="1"],
.main-content form table[border="1"][cellspacing],
.main-content table[width="590"],
.main-content table#table1 {
  font-family: var(--font);
}

.main-content table#table1 {
  border-collapse: separate;
  border-spacing: 0;
}

.main-content table#table1 td {
  border: none;
}

.main-content table#table1 td[bgcolor="#ccffff"] {
  background: linear-gradient(180deg, #fff 0%, #eff6ff 100%) !important;
  color: #334155;
  padding: 22px 24px;
  border-radius: 0 0 16px 16px;
}

.main-content table#table1 td[background*="bg_03"] {
  background: linear-gradient(135deg, #0f172a 0%, #1d4ed8 100%) !important;
  color: #fff;
  padding: 14px 20px;
  border-radius: 16px 16px 0 0;
}

.main-content table#table1 tr:first-child td {
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.08);
}

.main-content table#table1 tr:last-child td {
  padding-bottom: 18px;
}

.main-content table#table1 font,
.main-content table#table1 b {
  font-family: var(--font);
}

.main-content table#table1 hr {
  border: none;
  border-top: 1px solid #dbe4f0;
  margin: 10px 0;
}

.main-content table#table1 a {
  color: var(--link);
  font-weight: 700;
}

.main-content table#table1 a:hover {
  color: var(--primary-d);
}

/* Modern utility page cards */
.main-content .utility-page,
.main-content .utility-page-inline,
.main-content form[action="?"],
.main-content form[action="?"] > table,
.main-content table[width="590"],
.main-content table#table1{
  width:100%;
  max-width:1000px;
  margin:0 auto 18px;
}
.main-content .utility-card,
.main-content form table[border="1"],
.main-content form table[border="1"][cellspacing],
.main-content table[width="590"],
.main-content table#table1{
  background:#fff;
  border:1px solid #e5eef7 !important;
  border-radius:18px;
  box-shadow:0 10px 30px rgba(15,23,42,.08);
  overflow:hidden;
}
.main-content .utility-card-body{
  padding:20px 22px;
}
.main-content .utility-hero{
  margin:0 auto 18px;
}
.main-content .utility-note,
.main-content .utility-alert{
  margin:12px 0 16px;
}
.main-content .addr-hint{
  margin-top:10px;
}

.main-content .utility-page,
.main-content .utility-page-inline{
  max-width: 1000px;
  margin: 0 auto 18px;
}
.main-content .utility-hero{
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  padding: 22px 24px;
  color: #fff;
  background: linear-gradient(135deg,#0f172a 0%,#1d4ed8 58%,#7c3aed 100%);
  box-shadow: 0 18px 44px rgba(15,23,42,.16);
}
.main-content .utility-hero::after{
  content:'';
  position:absolute;
  right:-40px;
  top:-48px;
  width:180px;
  height:180px;
  border-radius:50%;
  background: rgba(255,255,255,.12);
  filter: blur(2px);
}
.main-content .utility-hero-title{
  position:relative;
  z-index:1;
  font-size: 1.4rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .01em;
}
.main-content .utility-hero-sub{
  position:relative;
  z-index:1;
  margin-top: 8px;
  max-width: 74ch;
  font-size: .96rem;
  line-height: 1.8;
  color: rgba(255,255,255,.88);
}
.main-content .utility-hero-chips{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.main-content .utility-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.16);
  font-size: .79rem;
  font-weight: 600;
  color: #fff;
}
.main-content .utility-card{
  background: #fff;
  border: 1px solid #e5eef7;
  border-radius: 18px;
  box-shadow: 0 8px 28px rgba(15,23,42,.08);
  overflow: hidden;
}
.main-content .utility-card-body{
  padding: 20px 22px;
}
.main-content .utility-note{
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #9a3412;
  border-radius: 14px;
  padding: 12px 14px;
  font-size: .92rem;
  line-height: 1.75;
}
.main-content .utility-alert{
  background: #fff1f2;
  border: 1px solid #fecdd3;
  color: #9f1239;
  border-radius: 14px;
  padding: 12px 14px;
  font-size: .92rem;
  line-height: 1.75;
}
.main-content .utility-grid{
  display:grid;
  grid-template-columns: minmax(0,1.35fr) minmax(260px,.65fr);
  gap: 16px;
}
.main-content .addr-hint{
  display:block;
  margin-top: 8px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #fff1f2;
  border: 1px solid #fda4af;
  color: #be123c;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.7;
  box-shadow: 0 6px 16px rgba(225,29,72,.10);
}
.main-content .addr-hint strong{
  color: #9f1239;
}

.main-content table#table1,
.main-content form table[border="1"],
.main-content form table[border="1"][cellspacing],
.main-content table[width="590"] {
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  border-radius: 14px;
  overflow: hidden;
}

.main-content table#table1 td,
.main-content table[width="590"] td {
  line-height: 1.8;
}


.main-content > table#table1 {
  max-width: 1000px;
  margin: 0 auto 18px;
}

.main-content > table#table1 td {
  padding: 0;
}

.main-content > table#table1 td[background] {
  padding: 16px 20px;
}

.main-content > table#table1 td[bgcolor="#ccffff"] {
  font-size: 14px;
  line-height: 1.9;
}

.main-content > table#table1 td[bgcolor="#ccffff"] b,
.main-content > table#table1 td[bgcolor="#ccffff"] font {
  font-size: 14px !important;
  line-height: 1.9;
}

.main-content > table#table1 td[bgcolor="#ccffff"] a {
  text-decoration: underline;
  text-underline-offset: 2px;
}


body.page-read .main-content > table#table1,
body.page-read .main-content table#table1 {
  max-width: 1000px;
  margin: 0 auto 18px;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.page-read .main-content > table#table1 td[background],
body.page-read .main-content table#table1 td[background*="bg_03"] {
  background: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  border-radius: 12px 12px 0 0 !important;
  box-shadow: none !important;
  padding: 10px 16px !important;
}

body.page-read .main-content > table#table1 td[background] font,
body.page-read .main-content table#table1 td[background*="bg_03"] font {
  color: var(--primary-d) !important;
  font-weight: 800 !important;
}

body.page-read .main-content > table#table1 td[bgcolor="#ccffff"],
body.page-read .main-content table#table1 td[bgcolor="#ccffff"] {
  background: #fff !important;
  border-radius: 0 0 12px 12px !important;
  box-shadow: none !important;
  padding: 18px 20px !important;
}

body.page-read .main-content table#table1 hr {
  border-top: 1px solid #e2e8f0 !important;
}

@media(max-width: 768px){
  .main-content .utility-page,
  .main-content .utility-page-inline{
    margin-bottom: 14px;
  }
  .main-content .utility-hero{
    padding: 18px 16px;
    border-radius: 16px;
  }
  .main-content .utility-hero-title{
    font-size: 1.18rem;
  }
  .main-content .utility-card-body{
    padding: 16px;
  }
  .main-content .utility-grid{
    grid-template-columns: 1fr;
  }
}


.main-content form[action="?"]:has(input[name="oid"]) {
  max-width: 760px;
  margin: 0 auto;
}

.main-content form[action="?"]:has(input[name="oid"]) table {
  width: 100%;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  border: none !important;
  border-collapse: collapse;
}

.main-content form[action="?"]:has(input[name="oid"]) td {
  padding: 12px 16px;
  border-bottom: 1px solid #f1f5f9;
  font-size: 14px;
}

.main-content form[action="?"]:has(input[name="oid"]) td:first-child {
  width: 140px;
  background: #f8fafc;
  color: #1e293b;
  font-weight: 700;
}

.main-content form[action="?"]:has(input[name="oid"]) input[type="text"] {
  width: 100%;
  padding: 10px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-family: var(--font);
  font-size: 14px;
}

.main-content form[action="?"]:has(input[name="oid"]) input[type="text"]:focus {
  border-color: var(--primary);
  outline: none;
  box-shadow: 0 0 0 3px rgba(37,99,235,.1);
}

.main-content form[action="?"]:has(input[name="oid"]) input[type="submit"] {
  padding: 10px 28px;
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

.main-content form[action="?"]:has(input[name="oid"]) input[type="submit"]:hover {
  background: var(--primary-d);
}

.main-content .utility-form {
  max-width: 860px;
  margin: 0 auto 18px;
}

.main-content .utility-form > table {
  width: 100%;
  background: linear-gradient(135deg,#ffffff 0%,#fbfdff 100%);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(15,23,42,.06);
  border: 1px solid rgba(226,232,240,.9) !important;
  border-collapse: collapse;
}

.main-content .utility-form td {
  padding: 12px 16px;
  border-bottom: 1px solid #edf2f7;
  font-size: 14px;
}

.main-content .utility-form td:first-child {
  width: 140px;
  background: linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);
  color: #1e293b;
  font-weight: 800;
}

.main-content .utility-form input[type="text"],
.main-content .utility-form input[type="email"],
.main-content .utility-form textarea,
.main-content .utility-form select {
  width: 100%;
  padding: 10px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-family: var(--font);
  font-size: 14px;
  background: #fff;
}

.main-content .utility-form input:focus,
.main-content .utility-form textarea:focus,
.main-content .utility-form select:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37,99,235,.1);
}

.main-content .utility-form input[type="submit"] {
  padding: 10px 28px;
  background: linear-gradient(135deg,var(--primary) 0%,var(--primary-d) 100%);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(37,99,235,.16);
}

.main-content .utility-form input[type="submit"]:hover {
  filter: brightness(1.02);
  transform: translateY(-1px);
}

.main-content .utility-form table[border="1"],
.main-content .utility-form table[border="1"][cellspacing]{
  width:100%;
  border-collapse:collapse;
}
.main-content .utility-form tr:first-child td{
  background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%) !important;
  color:#fff !important;
  font-weight:800 !important;
  text-align:center !important;
  letter-spacing:.05em;
}
.main-content .utility-form tr:first-child td font,
.main-content .utility-form tr:first-child td b{
  color:#fff !important;
}
.main-content .utility-form tr:nth-child(2) td{
  background:#f8fafc;
  color:var(--text);
  line-height:1.8;
}
.main-content .utility-form tr td{
  border-bottom:1px solid #eef2f7;
}
.main-content .utility-form tr:last-child td{
  border-bottom:none;
}
.main-content .utility-form textarea{
  min-height:120px;
  resize:vertical;
}
.main-content .utility-form label{
  font-size:14px;
  color:var(--text);
  font-weight:600;
}
.main-content .utility-form .ex_validator{
  margin-top:6px;
  color:var(--red);
  font-size:13px;
  font-weight:700;
}
.main-content .utility-form #ex_addr{
  display:block;
  padding:10px 12px;
  margin-top:8px;
  border-radius:12px;
  background:linear-gradient(135deg,#fff1f2 0%,#fff7f7 100%);
  border:1px solid #fecdd3;
  color:#be123c;
  line-height:1.6;
}

/* 訂單狀態表單：與問與/購物車現代樣式對齊 */
.main-content .order-hint {
  max-width: 760px;
  margin: 16px auto 8px;
  padding: 12px 16px;
  background: #fef9f0;
  border: 1px solid #f5e6c8;
  border-radius: 10px;
  font-size: 15px;
  line-height: 1.7;
}
.main-content .order-hint font {
  color: #b45309 !important;
}

body.page-orderstate .main-content .utility-form--orderstate {
  max-width: 760px;
  margin: 0 auto 24px;
  font-family: var(--font);
}

body.page-orderstate .main-content .utility-form--orderstate > .of-inner,
body.page-orderstate .main-content .utility-form--orderstate > table {
  width: 100%;
}

body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table,
body.page-orderstate .main-content .utility-form--orderstate > table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: #fff !important;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .08);
  border: 1px solid #e5e7eb !important;
}

body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table tr,
body.page-orderstate .main-content .utility-form--orderstate > table tr {
  display: grid;
  grid-template-columns: 128px minmax(0, 400px) auto;
  align-items: center;
  gap: 0;
  border-bottom: 1px solid #eef2f7;
  min-height: 56px;
}

body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td,
body.page-orderstate .main-content .utility-form--orderstate > table td {
  padding: 12px 16px !important;
  border: none !important;
  background: transparent !important;
  vertical-align: middle !important;
  box-sizing: border-box;
}

body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:first-child,
body.page-orderstate .main-content .utility-form--orderstate > table td:first-child {
  font-weight: 700 !important;
  color: #334155 !important;
  font-size: 15px !important;
  text-align: right !important;
  white-space: nowrap;
  padding-right: 10px !important;
}

body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:nth-child(2),
body.page-orderstate .main-content .utility-form--orderstate > table td:nth-child(2) {
  padding-left: 8px !important;
}

body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:nth-child(3),
body.page-orderstate .main-content .utility-form--orderstate > table td:nth-child(3) {
  padding-left: 8px !important;
  font-size: 14px !important;
}

body.page-orderstate .main-content .utility-form--orderstate input[type="text"],
body.page-orderstate .main-content .utility-form--orderstate input[type="email"],
body.page-orderstate .main-content .utility-form--orderstate input:not([type]) {
  width: 100% !important;
  max-width: 400px;
  padding: 10px 12px;
  border: 1.5px solid #dbe3ee;
  border-radius: 10px;
  font-family: var(--font);
  font-size: 14px;
  color: var(--text);
  background: #fff;
  box-sizing: border-box;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body.page-orderstate .main-content .utility-form--orderstate input[type="text"]:focus,
body.page-orderstate .main-content .utility-form--orderstate input[type="email"]:focus,
body.page-orderstate .main-content .utility-form--orderstate input:not([type]):focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

body.page-orderstate .main-content .utility-form--orderstate input[type="submit"] {
  padding: 10px 34px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-d) 100%);
  color: #fff;
  font-family: var(--font);
  font-size: 15px;
  font-weight: 700;
  box-shadow: 0 8px 18px rgba(37, 99, 235, .18);
  cursor: pointer;
}

body.page-orderstate .main-content .utility-form--orderstate input[type="submit"]:hover {
  filter: brightness(1.02);
  transform: translateY(-1px);
}

/* 訂購表單：補回與問題表單一致的白色卡片外框 */
body.page-order .main-content .order-form {
  max-width: 760px;
  margin: 0 auto 24px;
  font-family: var(--font);
}

body.page-order .main-content .order-form > .of-inner,
body.page-order .main-content .order-form > table {
  width: 100%;
}

body.page-order .main-content .order-form > .of-inner > table,
body.page-order .main-content .order-form > table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .08);
}

body.page-order .main-content .order-form > .of-inner > table tr,
body.page-order .main-content .order-form > table tr {
  display: grid;
  grid-template-columns: 128px minmax(0, 400px) minmax(0, 1fr);
  align-items: center;
  gap: 0;
  border-bottom: 1px solid #eef2f7;
  min-height: 56px;
}

body.page-order .main-content .order-form > .of-inner > table td,
body.page-order .main-content .order-form > table td {
  padding: 12px 16px !important;
  border: none !important;
  background: transparent !important;
  vertical-align: middle !important;
  box-sizing: border-box;
}

body.page-order .main-content .order-form > .of-inner > table td:first-child,
body.page-order .main-content .order-form > table td:first-child {
  width: 128px;
  font-weight: 700 !important;
  color: #334155 !important;
  font-size: 15px !important;
  text-align: right !important;
  white-space: nowrap;
  padding-right: 10px !important;
}

body.page-order .main-content .order-form > .of-inner > table td:nth-child(3),
body.page-order .main-content .order-form > table td:nth-child(3) {
  padding-left: 8px !important;
  font-size: 14px !important;
  color: var(--text-l) !important;
  line-height: 1.5;
}

body.page-order .main-content .order-form input[type="text"],
body.page-order .main-content .order-form input[type="email"],
body.page-order .main-content .order-form input:not([type]),
body.page-order .main-content .order-form select,
body.page-order .main-content .order-form textarea {
  width: 100% !important;
  max-width: 400px;
  padding: 10px 12px;
  border: 1.5px solid #dbe3ee;
  border-radius: 10px;
  font-family: var(--font);
  font-size: 14px;
  color: var(--text);
  background: #fff;
  box-sizing: border-box;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body.page-order .main-content .order-form input[type="text"]:focus,
body.page-order .main-content .order-form input[type="email"]:focus,
body.page-order .main-content .order-form input:not([type]):focus,
body.page-order .main-content .order-form select:focus,
body.page-order .main-content .order-form textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

body.page-order .main-content .order-form input[type="submit"] {
  padding: 10px 36px !important;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-d) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  max-width: none !important;
  width: auto !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, .2);
}

body.page-order .main-content .order-form tr:last-child td {
  padding-top: 14px !important;
  padding-bottom: 18px !important;
}

body.page-order .main-content .order-form tr:last-child td:nth-child(2) {
  text-align: left;
}

body.page-order .main-content .order-form #addr_zip {
  width: 60px !important;
  max-width: 60px !important;
  text-align: center;
  color: #64748b;
  background: #f8fafc;
  display: inline-block;
  margin-right: 4px;
}

body.page-order .main-content .order-form #addr_county,
body.page-order .main-content .order-form #addr_zone {
  width: auto !important;
  max-width: 160px !important;
  display: inline-block;
  margin-right: 4px;
}

/* 超商取貨時隱藏郵遞區號/縣市/地區（桌面版） */
body.page-order .main-content .order-form.payway-supermarket .cart-addr-inline #addr_zip,
body.page-order .main-content .order-form.payway-supermarket .cart-addr-inline #addr_county,
body.page-order .main-content .order-form.payway-supermarket .cart-addr-inline #addr_zone {
  display: none !important;
}

body.page-order .main-content .order-form #addr_info {
  max-width: 100% !important;
  width: 100% !important;
  margin-top: 6px;
}

body.page-order .main-content .order-form #ex_addr {
  display: block;
  margin-top: 8px;
  background: #fff1f2;
  border: 2px solid #fb7185;
  border-radius: 10px;
  padding: 8px 12px;
  box-shadow: 0 4px 14px rgba(244, 63, 94, .12);
}

body.page-order .main-content .order-form .g-recaptcha {
  transform: scale(.96);
  transform-origin: left top;
}

@media (max-width: 768px) {
  body.page-order .main-content .order-form {
    max-width: 100%;
  }

  body.page-order .main-content .order-form > .of-inner > table tr,
  body.page-order .main-content .order-form > table tr {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    grid-template-columns: none !important;
  }

  body.page-order .main-content .order-form > .of-inner > table td:first-child,
  body.page-order .main-content .order-form > table td:first-child {
    flex: 0 0 auto !important;
    width: auto !important;
    order: 1 !important;
    text-align: left !important;
    padding: 8px 4px 4px 12px !important;
    background: #f8fafc;
  }

  body.page-order .main-content .order-form > .of-inner > table td:nth-child(3),
  body.page-order .main-content .order-form > table td:nth-child(3) {
    flex: 0 0 auto !important;
    width: auto !important;
    order: 2 !important;
    display: block !important;
    padding: 8px 12px 4px 4px !important;
    font-size: 14px !important;
    color: var(--text-l) !important;
    text-align: left !important;
    white-space: normal !important;
  }

  body.page-order .main-content .order-form > .of-inner > table td:nth-child(2),
  body.page-order .main-content .order-form > table td:nth-child(2) {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 3 !important;
    padding: 0 12px 8px !important;
  }

  /* 地址欄位手機版：郵遞區號、縣市、地區橫排 */
  body.page-order .main-content .order-form .cart-addr-inline,
  body.page-cart .main-content .order-form .cart-addr-inline {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 8px;
  }
  body.page-order .main-content .order-form .cart-addr-inline #addr_zip,
  body.page-cart .main-content .order-form .cart-addr-inline #addr_zip,
  body.page-order .main-content .order-form .cart-addr-inline #addr_county,
  body.page-cart .main-content .order-form .cart-addr-inline #addr_county,
  body.page-order .main-content .order-form .cart-addr-inline #addr_zone,
  body.page-cart .main-content .order-form .cart-addr-inline #addr_zone {
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    margin-bottom: 0 !important;
  }
  body.page-order .main-content .order-form .cart-addr-inline #addr_zip,
  body.page-cart .main-content .order-form .cart-addr-inline #addr_zip {
    width: 64px !important;
    max-width: 64px !important;
    flex: 0 0 auto !important;
    text-align: center;
  }
  body.page-order .main-content .order-form .cart-addr-inline #addr_county,
  body.page-cart .main-content .order-form .cart-addr-inline #addr_county,
  body.page-order .main-content .order-form .cart-addr-inline #addr_zone,
  body.page-cart .main-content .order-form .cart-addr-inline #addr_zone {
    flex: 1 1 0 !important;
    min-width: 90px;
  }

  /* 超商取貨時隱藏郵遞區號/縣市/地區（手機版） */
  body.page-order .main-content .order-form.payway-supermarket .cart-addr-inline #addr_zip,
  body.page-cart .main-content .order-form.payway-supermarket .cart-addr-inline #addr_zip,
  body.page-order .main-content .order-form.payway-supermarket .cart-addr-inline #addr_county,
  body.page-cart .main-content .order-form.payway-supermarket .cart-addr-inline #addr_county,
  body.page-order .main-content .order-form.payway-supermarket .cart-addr-inline #addr_zone,
  body.page-cart .main-content .order-form.payway-supermarket .cart-addr-inline #addr_zone {
    display: none !important;
  }

  body.page-order .main-content .order-form {
    overflow-x: hidden;
  }

  /* Mobile: all form fields full width */
  body.page-order .main-content .order-form input[type="text"],
  body.page-order .main-content .order-form input[type="email"],
  body.page-order .main-content .order-form input:not([type]),
  body.page-order .main-content .order-form select,
  body.page-order .main-content .order-form textarea,
  body.page-cart .main-content .order-form input[type="text"],
  body.page-cart .main-content .order-form input[type="email"],
  body.page-cart .main-content .order-form input:not([type]),
  body.page-cart .main-content .order-form select,
  body.page-cart .main-content .order-form textarea {
    max-width: 100% !important;
    width: 100% !important;
  }
}

body.page-orderstate .main-content .utility-form--orderstate img {
  vertical-align: middle;
  border-radius: 8px;
}

/* 驗証碼圖片：所有表單（訂單狀態、問與、購物車） */
.main-content #lchcodeimg,
.main-content img#lchcodeimg {
  width: auto !important;
  height: 28px !important;
  min-height: 28px;
}

body.page-orderstate .main-content .utility-form--orderstate #lchcodeimg {
  height: 28px !important;
  width: auto !important;
}

body.page-orderstate .main-content .utility-form--orderstate a {
  color: var(--primary-d);
  text-decoration: none;
}

body.page-orderstate .main-content .utility-form--orderstate a:hover {
  text-decoration: underline;
}

body.page-orderstate .main-content .utility-form--orderstate font {
  font-family: var(--font) !important;
}

body.page-orderstate .main-content .utility-form--orderstate .of-inner > table tr:last-child {
  border-bottom: none;
}

body.page-orderstate .main-content .utility-form--orderstate .of-inner > table tr:last-child td:nth-child(2) {
  text-align: left;
  padding-top: 16px;
  padding-bottom: 18px;
}

body.page-orderstate .main-content .utility-form--orderstate .of-inner > table tr td:first-child {
  text-align: right;
}

body.page-orderstate .main-content .utility-form--orderstate .of-inner > table tr td:nth-child(3) {
  color: var(--text-l);
  font-size: 14px;
  white-space: nowrap;
  padding-left: 8px;
}

/* 窄螢幕（≤1030px）→ 訂單查詢提示字換行到輸入框下方 */
@media(max-width:1030px) {
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)),
  body.page-orderstate .main-content .utility-form--orderstate > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)) {
    grid-template-columns: 128px minmax(0, 400px);
  }
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)) > td:nth-child(3),
  body.page-orderstate .main-content .utility-form--orderstate > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)) > td:nth-child(3) {
    grid-column: 2;
    align-self: start;
    padding-left: 1em !important;
    padding-top: 0;
    margin-top: -8px;
    font-size: 13px !important;
    max-width: 400px !important;
  }
}

@media (max-width: 768px) {
  body.page-orderstate .main-content .utility-form--orderstate {
    max-width: 100%;
  }

  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table,
  body.page-orderstate .main-content .utility-form--orderstate > table {
    display: flex !important;
    flex-wrap: wrap;
  }

  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table tr,
  body.page-orderstate .main-content .utility-form--orderstate > table tr,
  body.page-orderstate .main-content .utility-form--orderstate .of-inner > table tr {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
  }

  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:first-child,
  body.page-orderstate .main-content .utility-form--orderstate > table td:first-child,
  body.page-orderstate .main-content .utility-form--orderstate .of-inner > table tr td:first-child {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 1 !important;
    text-align: left !important;
    padding: 8px 12px 4px !important;
    font-weight: 600;
    color: var(--text);
  }

  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:nth-child(3),
  body.page-orderstate .main-content .utility-form--orderstate > table td:nth-child(3),
  body.page-orderstate .main-content .utility-form--orderstate .of-inner > table tr td:nth-child(3) {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 2 !important;
    display: block !important;
    padding: 0 12px 4px !important;
    font-size: 14px !important;
    color: var(--text-l) !important;
    text-align: left !important;
    white-space: normal !important;
  }

  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:nth-child(2),
  body.page-orderstate .main-content .utility-form--orderstate > table td:nth-child(2),
  body.page-orderstate .main-content .utility-form--orderstate .of-inner > table tr td:nth-child(2) {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 3 !important;
    padding: 0 12px 8px !important;
  }
}

/* 訂單結果表格（現代樣式，取代 width='590' 表格） */
.main-content .order-result-wrap {
  max-width: 760px;
  margin: 60px auto 24px;
}

.main-content .order-result-wrap .of-inner > .order-result-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .08);
  border: 1px solid #e5e7eb;
}

.main-content .order-result-table tr {
  border-bottom: 1px solid #eef2f7;
}

.main-content .order-result-table tr:last-child {
  border-bottom: none;
}

.main-content .order-result-table .order-result-header td {
  background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
  color: #fff;
  font-weight: 800;
  text-align: center;
  font-size: 16px;
  letter-spacing: .05em;
  padding: 18px 16px;
}

.main-content .order-result-table td {
  padding: 12px 16px;
  border: none;
  font-size: 14px;
  vertical-align: middle;
}

.main-content .order-result-table td:first-child {
  width: 140px;
  background: #f8fafc;
  color: #334155;
  font-weight: 700;
  white-space: nowrap;
}

.main-content .order-result-table td:nth-child(2) {
  color: var(--text);
  line-height: 1.6;
}

@media (max-width: 768px) {
  .main-content .order-result-table td:first-child {
    width: 100%;
    display: block;
    padding: 8px 16px 4px;
  }
  .main-content .order-result-table td:nth-child(2) {
    display: block;
    padding: 0 16px 12px;
  }
}


.main-content table[width="100%"]:not(.grid):not([border="1"]),
.main-content > table[width="100%"] {
  width: 100%;
}
.main-content table[width="100%"] td[align="center"] > center > table,
.main-content > table[width="100%"]:first-child table {
  margin: 0 auto;
  background: #fff;
  border-radius: var(--r-lg);
  padding: 18px;
  box-shadow: var(--sh-soft);
}


.main-content div[align="right"],
.main-content td[align="right"] div {
  padding: 12px 0;
}
.main-content div[align="right"] a,
.main-content td[align="right"] div a {
  display: inline-block;
  padding: 6px 12px;
  margin: 0 2px;
  border-radius: 6px;
  background: #fff;
  border: 1px solid #e2e8f0;
  color: var(--text);
  text-decoration: none;
  font-size: 13px;
  transition: var(--tr);
}
.main-content div[align="right"] a:hover,
.main-content td[align="right"] div a:hover {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.main-content div[align="right"] select,
.main-content td[align="right"] div select {
  padding: 6px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  font-size: 13px;
  background: #fff;
}

/* ===== 搜尋页面现代布局 ===== */
.search-page {
  padding: 0;
}

.search-header {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}

.sf-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.sf-row label {
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  font-size: 14px;
}

.sf-row input[type="text"] {
  flex: 1;
  padding: 8px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-size: 14px;
  font-family: var(--font);
  transition: var(--tr);
}

.sf-row input[type="text"]:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37,99,235,.1);
  outline: none;
}

.sf-row button[type="submit"] {
  padding: 8px 20px;
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  transition: var(--tr);
}

.sf-row button[type="submit"]:hover {
  background: var(--primary-d);
}

/* ===== 搜尋结果页面（tag/xxx.htm）===== */
.search-page {
  padding: 0;
}

.sf-wrap {
  max-width: 500px;
  margin: 0 auto;
  padding: 32px 20px;
}

.sf-row {
  display: flex;
  gap: 8px;
}

.sf-row input[type="text"] {
  flex: 1;
  padding: 10px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 15px;
  outline: none;
  transition: border-color .2s;
}

.sf-row input[type="text"]:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37,99,235,.1);
}

.sf-row button[type="submit"] {
  padding: 10px 20px;
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  cursor: pointer;
  transition: background .2s;
}

/* ===== 面包屑 ===== */
/* ===== 搜索结果页 — 目录页风格（面包屑 + 标题 + 计数在关键字下方）===== */
.sr-breadcrumb{margin-bottom:8px}

.sr-title{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  background:linear-gradient(135deg,#f8fafc 0%,#fff 100%);color:#334155;
  padding:12px 16px;border-radius:14px;margin:0 0 10px;
  border:1px solid rgba(148,163,184,.16);box-shadow:0 1px 2px rgba(15,23,42,.04)}
.sr-title-head{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.sr-title-icon{width:20px;height:20px;flex-shrink:0;color:#94a3b8}
.sr-title-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sr-title-keyword{font-size:20px;font-weight:800;line-height:1.3;word-break:break-all;color:#334155}
.sr-title-count{font-size:13px;color:#94a3b8;font-weight:400;white-space:nowrap;flex-shrink:0}
.sr-title-count b{color:#64748b;font-weight:700}

.sr-header{display:flex;align-items:baseline;gap:14px;padding:20px 4px 16px;margin-bottom:4px}

/* 每个搜尋结果项目 - disk_line 模板輸出樣式 */
.search-results > div,
.search-results > a {
  display: block;
  padding: 12px 16px;
  border-bottom: 1px solid #f1f5f9;
  transition: background .15s ease;
  position: relative;
  overflow: hidden;
}
.search-results > div::before,
.search-results > a::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: transparent;
  border-radius: 0 2px 2px 0;
  transition: background .2s;
}
.search-results > div:hover,
.search-results > a:hover {
  background: rgba(37,99,235,.02);
}
.search-results > div:hover::before,
.search-results > a:hover::before {
  background: #2563eb;
}

/* 覆寫旧的表格式搜尋布局 */
.main-content > table[width="100%"]:not(.grid) {
  width: 100%;
  border: none !important;
}

.main-content > table[width="100%"]:not(.grid) td[align="center"] {
  text-align: left !important;
  padding: 0 !important;
}





.content > table[width="100%"]:first-child {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
.content > table[width="100%"]:first-child > tbody > tr:first-child > td {
  padding: 0 !important;
  background: transparent !important;
}




table.grid {
  width: 100% !important;
  border-collapse: collapse !important;
  border: none !important;
  background: #fff !important;
  table-layout: fixed;
}
table.grid,
table.grid td,
table.grid font {
  font-family: var(--font) !important;
}
table.grid tr.title {
  background: #f8f9fa !important;
  border-bottom: 2px solid #dee2e6 !important;
}
table.grid tr.title td {
  padding: 10px 12px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: #475569 !important;
  text-align: center !important;
  vertical-align: middle !important;
}
table.grid tr.title td:nth-child(2) {
  text-align: left !important;
}
table.grid tr.title td:nth-child(4) {
  text-align: right !important;
}
table.grid tr td {
  border-bottom: 1px solid #eee !important;
  padding: 12px !important;
  vertical-align: middle !important;
  font-size: 14px;
  line-height: 1.5;
}


table.grid tr td:first-child,
table.grid tr.title td:first-child {
  width: 95px;
  text-align: center !important;
}
table.grid tr td:nth-child(2),
table.grid tr.title td:nth-child(2) {
  width: auto;
  text-align: left !important;
}
table.grid tr td:nth-child(4),
table.grid tr.title td:nth-child(4) {
  width: 95px;
  text-align: right !important;
}
table.grid tr td:nth-child(5),
table.grid tr.title td:nth-child(5) {
  width: 55px;
  text-align: center !important;
}


.cart-title {
  display: block;
  font-size: 14px;
  line-height: 1.65;
  letter-spacing: .015em;
  font-weight: 400;
  word-break: break-word;
  color: #475569;
}
.cart-title a {
  color: inherit;
  text-decoration: none;
  transition: color .2s ease, opacity .2s ease;
}
.cart-title a:hover {
  color: #1e293b;
  opacity: 1;
}


table.grid tr td a[href*="cart_remove"] span {
  transition: color .15s;
}
table.grid tr td a[href*="cart_remove"]:hover span {
  color: #dc2626 !important;
}


table.grid tr td:nth-child(3),
table.grid tr.title td:nth-child(3) {
  display: none !important;
}


table.grid tr td:first-child {
  font-size: 14px !important;
  color: #94a3b8 !important;
}

table.grid tr td:nth-child(4) {
  font-weight: 600 !important;
  color: #dc2626 !important;
}

table.grid tr td font[color="Brown"] {
  display: inline-block;
  text-align: center;
  background: #fef3c7;
  color: #92400e !important;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 14px !important;
  font-family: var(--font);
  font-weight: 500;
  margin-top: 4px;
}

.cart-special-label {
  display: inline-block;
  text-align: center;
  background: transparent;
  color: #FF7A45;
  border: 1px solid #FF7A45;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 14px;
  font-family: var(--font);
  font-weight: 500;
}

.cart-item-notfree {
  display: inline-block;
  text-align: center;
  background: #FF7A45;
  color: #fff;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 12px;
  font-family: var(--font);
  font-weight: 500;
  margin-top: 4px;
  white-space: nowrap;
}

.cart-price-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding-left: 0px;
}

/* 價格等寬數字 */
.cart-price-cell font[color="red"],
.cart-price-cell font[color="#2563eb"] {
  font-variant-numeric: tabular-nums;
}
/* 特價商品價格變橘色 */
.cart-price-cell:has(.cart-item-notfree) font[color="red"],
.cart-price-cell:has(.cart-item-notfree) font[color="#2563eb"] {
  color: #FF7A45 !important;
}


div[align="right"] {
  line-height: 1.4 !important;
  font-family: var(--font) !important;
  padding: 6px 0;
}
div[align="right"] font {
  font-size: 14px !important;
  font-family: var(--font) !important;
}
div[align="right"] font[color="red"] {
  font-weight: 700 !important;
  color: var(--red) !important;
  font-variant-numeric: tabular-nums;
}
div[align="right"] hr {
  border: none;
  border-top: 1px dashed #ddd;
  margin: 8px 0;
}

#amount_total {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--red) !important;
}

/* 按鈕區 - 醒目按鈕 */
.cart-btn-area a > img[src*="cart_c"],
.cart-btn-area a > img[src*="cart_q"],
a[href*="history.go(-1)"] img,
a[href*="javascript:history"] img,
a[onclick*="cart_clear"] img[src*="cart_q"],
a[onclick*="history.back"] img[src*="cart_c"] {
  display: none !important;
}
/* 繼續購物按鈕 (history.go / history.back) */
a[href*="history.go(-1)"],
a[href*="javascript:history"],
a[onclick*="history.back"] {
  display: inline-flex !important;
  align-items: center;
  margin-right: 12px;
  text-decoration: none;
}
a[href*="history.go(-1)"]::before,
a[href*="javascript:history"]::before,
a[onclick*="history.back"]::before {
  content: '\2190 \7e7c\7e8c\8cfc\7269';
  display: inline-block;
  padding: 10px 28px;
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
  border: none;
  border-radius: 8px;
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(79,70,229,.3);
  transition: all .2s;
}
a[href*="history.go(-1)"]:hover::before,
a[href*="javascript:history"]:hover::before,
a[onclick*="history.back"]:hover::before {
  background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%);
  box-shadow: 0 4px 14px rgba(79,70,229,.4);
  transform: translateY(-1px);
}
/* 清空購物車按鈕 */
a[onclick*="cart_clear"] {
  display: inline-flex !important;
  align-items: center;
  text-decoration: none;
}
a[onclick*="cart_clear"]::before {
  content: '\6e05\7a7a\8cfc\7269\8eca';
  display: inline-block;
  padding: 10px 28px;
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  border: none;
  border-radius: 8px;
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(220,38,38,.3);
  transition: all .2s;
}
a[onclick*="cart_clear"]:hover::before {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
  box-shadow: 0 4px 14px rgba(220,38,38,.4);
  transform: translateY(-1px);
}

/* ---- 購物車最低金額提示區（v2022）---- */
.cart-min-notice {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 18px 24px;
  margin: 8px auto;
  max-width: 520px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
}

.cart-min-text {
  font-size: .95rem;
  color: var(--red);
  font-weight: 600;
  text-align: center;
  line-height: 1.5;
}

.cart-min-text font {
  color: inherit;
}

.cart-min-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}

.cart-min-actions .cart-action-btn {
  width: 150px;
  padding: 10px 18px;
  margin: 0 !important;
  min-height: 44px;
}

/* 購物車最低金額提示的按鈕（取代舊的 cart_c.gif / cart_q.gif img） */
.cart-action-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 10px 28px;
  border: none;
  border-radius: 8px;
  color: #fff !important;
  font-size: .9rem;
  font-weight: 600;
  text-decoration: none !important;
  cursor: pointer;
  transition: all .2s ease;
  white-space: nowrap;
  letter-spacing: .3px;
  font-family: var(--font), sans-serif;
}

.cart-action-btn:hover {
  transform: translateY(-1px);
  color: #fff !important;
}

.cart-action-btn.cart-action-back {
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
  box-shadow: 0 2px 8px rgba(79,70,229,.3);
}

.cart-action-btn.cart-action-back:hover {
  background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%);
  box-shadow: 0 4px 14px rgba(79,70,229,.4);
}

.cart-action-btn.cart-action-clear {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  box-shadow: 0 2px 8px rgba(220,38,38,.3);
}

.cart-action-btn.cart-action-clear:hover {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
  box-shadow: 0 4px 14px rgba(220,38,38,.4);
}

/* 防止舊 ::before 偽元素與新按鈕文字重複 */
a.cart-action-btn::before {
  content: none !important;
  display: none !important;
  padding: 0 !important;
  background: none !important;
}

/* 手機版調整 */
@media (max-width:768px) {
  .cart-min-notice {
    padding: 14px 16px;
    margin: 6px 10px;
    border-radius: 8px;
  }
  .cart-min-text {
    font-size: .85rem;
  }
  .cart-action-btn {
    padding: 9px 22px;
    font-size: .84rem;
  }
  .cart-min-actions {
    gap: 10px;
  }
  .cart-min-actions .cart-action-btn {
    width: 130px;
    padding: 9px 14px;
    margin: 0 !important;
    min-height: 40px;
  }
}

.center > .cart-promo-hint {
  background: #fffbf0;
  border: 1px solid #f0e0b0;
  border-radius: 6px;
  padding: 10px 16px;
  margin: 10px 0;
  font-size: 13px;
  line-height: 1.6;
}
.center > .cart-promo-hint font[color="red"] {
  color: #b45309 !important;
  font-weight: 600;
}
.center > .cart-promo-hint font[color="blue"] {
  color: var(--blue1) !important;
  font-weight: 600;
}

/* 訂單表單 - modern clean style */
.modern-cart-form {
  margin-top: 20px;
}
.modern-cart-form .of-inner {
  display: block !important;
}
.modern-cart-form .of-inner > table {
  width: 100% !important;
  border: none !important;
  border-collapse: collapse !important;
  background: #fff !important;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
/* 表單格 - CSS Grid 佈局 */
.modern-cart-form .of-inner > table > tbody > tr,
.modern-cart-form .of-inner > table tr {
  display: grid;
  grid-template-columns: 110px 360px 1fr;
  align-items: center;
  gap: 0;
  border-bottom: 1px solid #f1f5f9;
  min-height: 44px;
}
/* radio 按鈕行：欄位自動寬度，提示文字緊靠 */
.modern-cart-form .of-inner > table tr.radio-row,
.modern-cart-form .of-inner > table tr:has(input[type="radio"]) {
  grid-template-columns: 110px auto auto !important;
  align-items: start;
}
.modern-cart-form .of-inner > table tr:last-child {
  border-bottom: none;
}
.modern-cart-form .of-inner > table td {
  padding: 9px 12px !important;
  border: none !important;
  vertical-align: middle !important;
  background: transparent !important;
}

.modern-cart-form .of-inner > table td:first-child {
  font-weight: 600 !important;
  color: #334155 !important;
  font-size: 15px !important;
  text-align: right !important;
  padding-right: 8px !important;
}

.modern-cart-form .of-inner > table td:nth-child(3) {
  font-size: 14px !important;
  color: #94a3b8 !important;
  line-height: 1.4;
  padding: 9px 12px 9px 6px !important;
  text-align: left;
}

.modern-cart-form input[type="text"],
.modern-cart-form input[type="email"],
.modern-cart-form input[type="tel"],
.modern-cart-form input:not([type]),
.modern-cart-form select,
.modern-cart-form textarea {
  width: 100%;
  max-width: 400px;
  padding: 8px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-size: 14px;
  font-family: var(--font);
  transition: all .2s ease;
  background: #fff;
  color: var(--text);
  line-height: 1.5;
  box-sizing: border-box;
}
.modern-cart-form input:focus,
.modern-cart-form select:focus,
.modern-cart-form textarea:focus {
  border-color: var(--primary);
  outline: none;
  box-shadow: 0 0 0 3px rgba(37,99,235,.08);
}

.modern-cart-form select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 32px;
  cursor: pointer;
}
.modern-cart-form select:hover {
  border-color: #cbd5e1;
}
/* textarea */
.modern-cart-form textarea {
  max-width: 100%;
  min-height: 100px;
  resize: vertical;
  line-height: 1.6;
}

.modern-cart-form #addr_zip {
  width: 60px !important;
  max-width: 60px !important;
  text-align: center;
  color: #64748b;
  background: #f8fafc;
  display: inline-block;
  margin-right: 4px;
}
.modern-cart-form #addr_county,
.modern-cart-form #addr_zone {
  width: auto !important;
  max-width: 160px !important;
  display: inline-block;
  margin-right: 4px;
}
.modern-cart-form #addr_info {
  max-width: 100% !important;
  width: 100% !important;
  margin-top: 6px;
}

.modern-cart-form input[type="submit"] {
  padding: 10px 36px !important;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-d) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  max-width: none !important;
  width: auto !important;
  box-shadow: 0 2px 8px rgba(37,99,235,.2);
  transition: all .2s ease;
}
.modern-cart-form input[type="submit"]:hover {
  opacity: .92;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(37,99,235,.3);
}
.modern-cart-form input[type="submit"]:active {
  transform: translateY(0);
}

.modern-cart-form input[type="reset"] {
  padding: 9px 24px !important;
  background: #fff !important;
  color: #64748b !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  max-width: none !important;
  width: auto !important;
  transition: all .2s ease;
  margin-left: 8px;
}
.modern-cart-form input[type="reset"]:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  color: #475569 !important;
}
/* === Cart 底部總金額卡片（JS inline style 控制；CSS 僅為 fallback，不可用 !important 以免阻擋 JS 切換 fixed→absolute） === */
.cart-sticky-total {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99;
  display: flex;
  visibility: visible;
  opacity: 1;
  justify-content: flex-start;
  padding: 0 16px 14px;
  background: transparent;
  pointer-events: none;
}
.cart-sticky-total-card {
  width: calc(min(100vw, var(--max-w)) - var(--sidebar-w) - 48px);
  max-width: 1000px;
  margin-left: calc((100vw - min(100vw, var(--max-w))) / 2 + var(--sidebar-w) + 16px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  gap: 10px;
  padding: 14px 22px;
  background: #fff;
  border: 1px solid var(--border-strong);
  border-radius: 16px;
  box-shadow: 0 4px 20px rgba(0,0,0,.10);
  pointer-events: auto;
}
.cart-sticky-total-tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  background: linear-gradient(135deg, #1d4ed8, #4f46e5);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  border-radius: 999px;
  white-space: nowrap;
}
.cart-sticky-total-amount {
  color: #b91c1c;
  font-weight: 700;
  font-size: 24px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.5px;
  white-space: nowrap;
}
.cart-sticky-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.cart-sticky-notice {
  width: 100%;
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  border: 1px solid #fed7aa;
  border-radius: 8px;
  padding: 8px 10px;
  color: #9a3412;
  font-size: 13px;
  line-height: 1.5;
  box-sizing: border-box;
}
.cart-sticky-notice--paypal {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border-color: #bfdbfe;
  color: #1e40af;
}
.cart-sticky-notice a {
  color: #c2410c;
  text-decoration: underline;
  font-weight: 600;
}
.cart-sticky-notice--paypal a {
  color: #1e3a8a;
}
.cart-sticky-notice a:hover {
  text-decoration: none;
}
/* PayPal 步驟卡片（位置 3：OneDrive 按鈕下方） */
#tips_paypal {
  width: 100%;
  grid-template-columns: none;
}
#tips_paypal td {
  display: block;
  width: 100%;
  padding: 6px 12px 0;
  box-sizing: border-box;
}
.paypal-step-card {
  border: 1px solid #93c5fd;
  background: #f8fafc;
  border-radius: 14px;
  padding: 16px 18px;
  margin: 0;
  text-align: left;
  box-sizing: border-box;
  box-shadow: 0 2px 10px rgba(37, 99, 235, .08);
  overflow: hidden;
}
.psc-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-weight: 700;
  color: #003087;
  font-size: 14px;
}
.psc-header svg {
  flex-shrink: 0;
}
.psc-brand-img {
  width: 22px;
  height: 22px;
  object-fit: contain;
  flex-shrink: 0;
}
.psc-brand-text {
  font-size: 14px;
  font-weight: 700;
  color: #003087;
  text-decoration: none;
}
.psc-dot {
  color: #93c5fd;
  font-weight: 700;
}
.psc-steps {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.psc-step {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  line-height: 1.5;
  color: #374151;
}
.psc-num {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #2563eb;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}
.psc-step strong {
  color: #111827;
}
.psc-warn {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed #bfdbfe;
  font-size: 12px;
  color: #f97316;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  line-height: 1.4;
}
.psc-warn svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  margin-top: 2px;
}
/* 手機版 */
@media (max-width: 768px) {
  .cart-sticky-total {
    justify-content: center;
    padding: 0 10px 10px;
  }
  .cart-sticky-total-card {
    width: calc(100vw - 20px);
    max-width: none;
    margin-left: 0;
    padding: 12px 16px;
    border-radius: 14px;
    gap: 8px;
  }
  .cart-sticky-total-tag {
    padding: 4px 10px;
    font-size: 12px;
  }
  .cart-sticky-total-amount {
    font-size: 20px;
  }
  .cart-sticky-notice {
    padding: 7px 8px;
    font-size: 12px;
  }
  .paypal-step-card {
    padding: 14px;
  }
  .psc-header {
    font-size: 13px;
    gap: 6px;
    margin-bottom: 10px;
  }
  .psc-header svg {
    width: 20px;
    height: 20px;
  }
  .psc-brand-img {
    width: 20px;
    height: 20px;
  }
  .psc-brand-text {
    font-size: 13px;
  }
  .psc-step {
    font-size: 13px;
    gap: 8px;
  }
  .psc-steps {
    gap: 7px;
  }
  .psc-warn {
    font-size: 11px;
    margin-top: 10px;
    padding-top: 8px;
  }
  /* 手機版：#tips_paypal 依 PayPal 選中狀態顯示/隱藏（覆蓋 .of-inner > table tr 的 display:flex !important） */
  .modern-cart-form:has(#payway_paypal:not(:checked)) #tips_paypal {
    display: none !important;
  }
  .modern-cart-form:has(#payway_paypal:checked) #tips_paypal {
    display: block !important;
  }
}

/* === radio 標籤 === */
/* 完全隱藏原生 radio 圈圈，用 label 邊框高亮顯示選中狀態 */
.modern-cart-form input[type="radio"] {
  display: none !important;
}
.modern-cart-form label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 6px;
  cursor: pointer;
  margin: 0 4px 4px 0;
  font-size: 14px;
  font-weight: 500;
  color: #475569;
  transition: all .15s ease;
  background: #fff;
  font-family: var(--font);
}
.modern-cart-form label:hover {
  border-color: #cbd5e1;
  background: #f8fafc;
}

/* 電腦版 radio 標籤垂直排列（每排一個，寬度自適應內容） */
.modern-cart-form label:has(input[type="radio"]) {
  display: flex;
  align-items: center;
  gap: 0;
  margin: 4px 0;
  padding: 10px 20px;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  cursor: pointer;
  transition: all .2s ease;
  width: fit-content;
}
.modern-cart-form label:has(input[type="radio"]):hover {
  border-color: var(--primary);
}

.modern-cart-form label:has(input[type="radio"]:checked),
.modern-cart-form label.checked {
  border-color: var(--primary) !important;
  background: rgba(37,99,235,.08) !important;
  color: var(--primary) !important;
  font-weight: 600 !important;
  box-shadow: 0 0 0 2px rgba(37,99,235,.2);
}

.modern-cart-form .ex_validator {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  color: #dc2626;
  margin-top: 6px;
  display: block;
}
.modern-cart-form #ex_addr {
  background: #fff1f2;
  border: 2px solid #fb7185;
  border-radius: 10px;
  padding: 8px 12px;
  box-shadow: 0 4px 14px rgba(244,63,94,.12);
  letter-spacing: .02em;
}
.modern-cart-form #ex_addr.flash {
  animation: exAddrFlash .9s ease-in-out 2;
}
@keyframes exAddrFlash {
  0%, 100% { transform: translateY(0); box-shadow: 0 4px 14px rgba(244,63,94,.12); }
  50% { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(244,63,94,.24); }
}

.modern-cart-form input[readonly] {
  background: #e2e8f0;
  color: #94a3b8;
  cursor: not-allowed;
  border-color: #cbd5e1;
}
.modern-cart-form input[readonly]:focus {
  border-color: #cbd5e1;
  box-shadow: none;
  outline: none;
}

/* 超商門市按鈕 ╟ 始終橘色（只出現在超商取貨流程中） */
.modern-cart-form #ezship_select {
  display: inline-block;
  padding: 6px 14px;
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  border: 1px solid #fed7aa;
  border-radius: 20px;
  font-size: 14px !important;
  font-weight: 600;
  color: #9a3412 !important;
  text-decoration: none;
  transition: all .2s ease;
  margin-top: 6px;
}
.modern-cart-form #ezship_select:hover {
  background: linear-gradient(135deg, #ffedd5 0%, #fed7aa 100%);
  border-color: #fdba74;
  color: #9a3412 !important;
}
.modern-cart-form #ezship_select:active {
  background: #fed7aa;
  transform: scale(0.95);
}

.modern-cart-form #tips_not_paypal,
.modern-cart-form #tips_paypal {
  font-size: 14px;
  line-height: 1.6;
  color: #64748b;
}
.modern-cart-form #tips_not_paypal font[color],
.modern-cart-form #tips_paypal font[color] {
  font-family: var(--font);
}

.modern-cart-form td font,
.modern-cart-form td div font,
.modern-cart-form .of-inner font {
  font-family: var(--font) !important;
}

.modern-cart-form hr {
  border: none;
  border-top: 1px solid #e2e8f0;
  margin: 16px 0;
}


/* 訂購表單上方提示公告 */
.cart-order-notice {
  display: block;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto 12px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid #fed7aa;
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  color: #9a3412;
  font-size: 14px;
  line-height: 1.5;
  box-shadow: 0 2px 8px rgba(154, 52, 18, .06);
}
.cart-order-notice--paypal {
  border-color: #bfdbfe;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  color: #1e40af;
}
.cart-notice-body b,
.cart-notice-body strong {
  font-weight: 600;
}
.cart-notice-body a {
  color: inherit;
  text-decoration: underline;
}

/* 購物車選項標籤 v3：預設白底黑字 → 選中橘底深橘字 */
.modern-cart-form label.cart-option-pill,
.modern-cart-form label.cart-payment-pill {
  display: inline-flex !important;
  padding: 5px 12px !important;
  margin: 2px 4px !important;
  border-radius: 20px !important;
  font-size: 14px !important;
  cursor: pointer;
  color: #333 !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: none !important;
  transition: all 0.2s ease;
  width: auto !important;
  gap: 4px !important;
  font-weight: 500 !important;
}
.modern-cart-form label.cart-option-pill:hover,
.modern-cart-form label.cart-payment-pill:hover {
  background: #fafafa !important;
  border-color: #d1d5db !important;
  color: #333 !important;
}
.modern-cart-form label.cart-option-pill:active,
.modern-cart-form label.cart-payment-pill:active {
  background: #f5f5f5 !important;
  border-color: #cbd5e1 !important;
  transform: scale(0.95);
}
.modern-cart-form label.cart-option-pill:has(input[type="radio"]:checked),
.modern-cart-form label.cart-payment-pill:has(input[type="radio"]:checked) {
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%) !important;
  border-color: #fed7aa !important;
  color: #9a3412 !important;
  box-shadow: 0 0 0 2px rgba(154, 52, 18, .15) !important;
  font-weight: 600 !important;
}
.cart-option-pill img,
.cart-payment-pill img {
  vertical-align: middle;
  margin-left: 2px;
}

/* USB 儲存出貨說明卡片（整合進 USB 選項下方） */
.usb-disk-detail {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  padding: 12px 14px;
  margin-top: 10px;
  line-height: 1.7;
}
.usb-disk-detail-title {
  font-size: 13px;
  font-weight: 700;
  color: #9a3412;
  margin-bottom: 6px;
}
.usb-disk-detail-text {
  font-size: 13px;
  color: #78350f;
}
.usb-disk-detail-text b,
.usb-disk-detail-text B {
  color: #9a3412;
}

/* 光碟選中灰階提示（方案 A） */
.cart-cd-hint {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 0;
  margin-top: 6px;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.4;
}
.cart-cd-hint svg {
  display: none;
}

/* 儲存類型行：卡片放在選項下方，使用 2 欄布局 */
.modern-cart-form .of-inner > table tr#tr_sendtype {
  grid-template-columns: 110px auto !important;
}
body.page-cart .main-content .order-form > .of-inner > table tr#tr_sendtype,
body.page-cart .main-content .order-form > table tr#tr_sendtype {
  grid-template-columns: 128px auto !important;
}
.modern-cart-form .of-inner > table tr#tr_sendtype > td:nth-child(2) {
  display: block;
  width: 100%;
}

/* PayPal 藍色膠囊（OneDrive雲端下載）— v3：預設白底黑字，選中才變藍 */
.modern-cart-form label.cart-paypal-pill {
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  padding: 5px 12px !important;
  margin: 2px 4px !important;
  border-radius: 20px !important;
  font-size: 14px !important;
  cursor: pointer;
  color: #333 !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: none !important;
  transition: all 0.2s ease;
  width: auto !important;
  font-weight: 500 !important;
}
.modern-cart-form label.cart-paypal-pill:hover {
  background: #fafafa !important;
  border-color: #d1d5db !important;
  color: #333 !important;
}
.modern-cart-form label.cart-paypal-pill:active {
  background: #f5f5f5 !important;
  border-color: #cbd5e1 !important;
  transform: scale(0.95);
}
.modern-cart-form label.cart-paypal-pill:has(input[type="radio"]:checked) {
  color: #1e40af !important;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
  border-color: #bfdbfe !important;
  box-shadow: 0 0 0 2px rgba(30, 64, 175, .15) !important;
  font-weight: 600 !important;
}

#tips2_not_paypal,
#tips2_paypal {
  display: none;
}
#tips2_not_supermarket,
#tips2_supermarket {
  font-weight: 600;
}

@media (max-width: 768px) {
  .cart-order-notice {
    margin: 0 0 12px;
    padding: 7px 10px;
    font-size: 13px;
  }
}

.g-recaptcha {
  transform: scale(0.95);
  transform-origin: left;
  margin: 4px 0;
}


@media(max-width: 768px){
  .content > table[width="100%"]:first-child {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  table.grid {
    min-width: 480px;
    font-size: 14px;
  }
  table.grid tr td {
    padding: 8px 10px !important;
  }
  div[align="right"] {
    font-size: 14px;
  }
  #amount_total {
    font-size: 16px !important;
  }
  .modern-cart-form .of-inner > table tr,
  .modern-cart-form table[of-inner] tr {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 2px !important;
    align-items: center;
  }
  .modern-cart-form .of-inner > table td:first-child,
  .modern-cart-form table[of-inner] td:first-child {
    order: 1;
    flex: 0 0 auto !important;
    width: auto !important;
    padding: 4px 4px 0 10px !important;
    font-size: 15px !important;
    text-align: left !important;
  }
  .modern-cart-form .of-inner > table td:nth-child(3),
  .modern-cart-form table[of-inner] td:nth-child(3) {
    order: 2;
    flex: 0 0 auto !important;
    width: auto !important;
    display: block !important;
    font-size: 14px !important;
    text-align: left !important;
    padding: 4px 10px 0 4px !important;
  }
  .modern-cart-form .of-inner > table td:nth-child(2),
  .modern-cart-form table[of-inner] td:nth-child(2) {
    order: 3;
    flex: 0 0 100% !important;
    width: 100% !important;
    padding: 4px 10px !important;
  }
  .modern-cart-form input[type="text"],
  .modern-cart-form input[type="email"],
  .modern-cart-form textarea,
  .modern-cart-form select {
    max-width: 100%;
    width: 100%;
  }
  
  .modern-cart-form #addr_info {
    width: 100% !important;
  }
  
  .modern-cart-form label:has(input[type="radio"]) {
    display: flex;
    width: 100%;
    margin: 4px 0;
  }
  a[href*="history.go(-1)"]::before,
  a[href*="javascript:history"]::before,
  a[onclick*="cart_clear"]::before,
  a[onclick*="history.back"]::before {
    width: 100%;
    text-align: center;
    margin: 4px 0;
  }
}

/* ===== cart 手機版表格欄寬修復（移除/價格完整顯示） ===== */
@media(max-width: 768px){
  body.page-cart .main-content {
    overflow-x: hidden !important;
  }
  body.page-cart .main-content table.grid {
    min-width: auto !important;
    width: 100% !important;
    table-layout: fixed !important;
    max-width: 100% !important;
  }
  /* 隱藏編號欄 */
  body.page-cart .main-content table.grid tr td:first-child,
  body.page-cart .main-content table.grid tr.title td:first-child {
    display: none !important;
  }
  /* 名稱欄自適應 */
  body.page-cart .main-content table.grid tr td:nth-child(2),
  body.page-cart .main-content table.grid tr.title td:nth-child(2) {
    width: auto !important;
    text-align: left !important;
    padding-right: 8px !important;
    word-break: break-word !important;
    white-space: normal !important;
  }
  /* 價格欄壓縮 */
  body.page-cart .main-content table.grid tr td:nth-child(4),
  body.page-cart .main-content table.grid tr.title td:nth-child(4) {
    width: 58px !important;
    max-width: 58px !important;
    min-width: 58px !important;
    text-align: right !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    white-space: nowrap !important;
  }
  /* 移除欄加寬並完整顯示文字 */
  body.page-cart .main-content table.grid tr td:nth-child(5),
  body.page-cart .main-content table.grid tr.title td:nth-child(5) {
    width: 68px !important;
    max-width: 68px !important;
    min-width: 68px !important;
    text-align: center !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }
  /* 商品名稱手機版略小、強制折行 */
  body.page-cart .main-content table.grid .cart-title {
    font-size: 13px !important;
    line-height: 1.5 !important;
    word-break: break-word !important;
    white-space: normal !important;
  }
  body.page-cart .main-content table.grid nobr {
    white-space: normal !important;
  }
  /* 價格紅字不換行 */
  body.page-cart .main-content table.grid tr td:nth-child(4) font {
    white-space: nowrap !important;
  }
  /* 表頭高度正常化（清空按鈕絕對定位不撐高） */
  body.page-cart .main-content table.grid tr.title {
    height: 28px !important;
  }
  body.page-cart .main-content table.grid tr.title td {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    vertical-align: middle !important;
  }
  body.page-cart .main-content table.grid tr.title td:nth-child(5) {
    position: relative !important;
    padding-right: 4px !important;
  }
  body.page-cart .main-content table.grid tr.title td .cart-clear-btn--header {
    position: absolute !important;
    top: 50% !important;
    right: 4px !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    padding: 1px 6px !important;
    font-size: 14.5px !important;
    line-height: 1 !important;
    display: inline-block !important;
  }
}

/* ===== 磁碟詳情頁面 ===== */
.disk-detail-page{background:var(--surface);border-radius:var(--r);box-shadow:var(--sh);padding:8px 10px 18px;max-width:1000px;margin:0 auto;width:100%}

.disk-breadcrumb{
  padding:4px 10px 12px;
  margin:0;
  font-size:13.8px;
  line-height:1.35;
  color:#64748b;
  font-weight:600;
}

.disk-breadcrumb a{
  color:#64748b;
  font-weight:600;
  text-decoration:none;
}

.disk-breadcrumb .bc-type{
  color:#64748b;
  font-weight:700;
}

.disk-breadcrumb .bc-sep{
  color:#cbd5e1;
}

.disk-breadcrumb + .disk-detail-page .disk-info-card{
  padding-top:10px;
}

.disk-info-card {
  background:transparent;
  border-radius:var(--r);
  padding:18px 0 4px;
  margin:0 0 4px;
}

.disk-title{font-size:16.2px;font-weight:700;color:var(--text);margin:0 0 10px;line-height:1.4;word-break:break-word}
.disk-info-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  background:transparent;
  border-radius:0;
  overflow:visible;
  box-shadow:none;
  border:none;
}

.info-item {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:13px 16px;
  background:transparent;
  border-bottom:1px solid var(--border);
  min-width:0;
}
.info-label {
  font-size:14px;
  color:var(--text-l);
  font-weight:600;
  white-space:nowrap;
  flex-shrink:0;
}

.info-value {
  font-size:15px;
  color:var(--text);
  word-break:break-all;
  line-height:1.5;
  text-align:left;
  flex:1;
}

/* 商品頁產品名稱（商品名稱那一行） */
.disk-info-grid .info-item:first-child .info-value:not(.disk-price) {
  font-size:16px;
  font-weight:700;
  color:#0f172a;
  line-height:1.35;
}
.disk-info-grid .info-item:first-child .info-value.disk-price {
  font-size:20px;
  font-weight:700;
}

.info-value.disk-price {
  font-size:20px;
  font-weight:700;
}

.info-value.disk-price .cart-special-label,
.disk-mobile-buybar-price .cart-special-label {
  margin-left:8px;
  vertical-align:middle;
  white-space:nowrap;
}

.info-value a {
  color:var(--link);
  text-decoration:none;
}

.info-value a:hover {
  color:var(--primary);
  text-decoration:underline;
}

.info-value .disk-tag {
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(37,99,235,.08);
  color:#2563eb;
  font-size:14px;
  font-weight:600;
  line-height:1.35;
  text-decoration:none;
  border:1px solid rgba(37,99,235,.16);
  margin:4px 4px 4px 0;
  transition:all .2s ease;
  vertical-align:middle;
}

.info-value .disk-tag:hover {
  background:#2563eb;
  color:#fff;
  transform:translateY(-1px);
  text-decoration:none;
}

.disk-buy-area {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:14px 0 0;
  margin-top:0;
  flex-wrap:wrap;
}
/* 桌面版分欄佈局中按鈕靠左（≥1030px） */
@media(min-width:1030px){
  .disk-product-layout .disk-buy-area {
    justify-content:flex-start;
  }
}

.disk-buy-btn,.disk-buy-btn-secondary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:999px;
  padding:12px 24px;
  min-height:46px;
  font-size:.92rem;
  font-weight:800;
  cursor:pointer;
  transition:all .22s ease;
  letter-spacing:.03em;
  position:relative;
  overflow:hidden;
  border:1px solid transparent;
  white-space:nowrap;
}

.disk-buy-btn svg,.disk-buy-btn-secondary svg {
  width:18px;
  height:18px;
  flex-shrink:0;
  stroke-width:2;
}

.disk-buy-btn {
  background:linear-gradient(135deg,rgba(37,99,235,.96),rgba(29,78,216,.92));
  color:#fff;
  border-color:rgba(37,99,235,.18);
  box-shadow:0 10px 22px rgba(37,99,235,.18),inset 0 1px 0 rgba(255,255,255,.14);
}

.disk-buy-btn:hover {
  transform:translateY(-1px);
  box-shadow:0 14px 26px rgba(37,99,235,.24),inset 0 1px 0 rgba(255,255,255,.18);
  filter:saturate(1.04);
}

.disk-buy-btn::before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.18),transparent 55%);
  pointer-events:none;
  opacity:.82;
}

.disk-buy-btn.ordered {
  background:#eff6ff;
  box-shadow:none;
  cursor:default;
  transform:none;
  border:1.5px solid #bfdbfe;
  color:#2563eb;
}

.disk-buy-btn.ordered::before {
  display:none;
}

.disk-buy-btn.ordered:hover {
  background:#eff6ff;
  border-color:#bfdbfe;
  color:#2563eb;
  transform:none;
  box-shadow:none;
  filter:none;
}

.disk-buy-btn-secondary {
  background:linear-gradient(135deg,rgba(37,99,235,.96),rgba(29,78,216,.92));
  color:#fff;
  border-color:rgba(37,99,235,.18);
  box-shadow:0 10px 22px rgba(37,99,235,.18),inset 0 1px 0 rgba(255,255,255,.14);
}

.disk-buy-btn-secondary:hover {
  transform:translateY(-1px);
  box-shadow:0 14px 26px rgba(37,99,235,.24),inset 0 1px 0 rgba(255,255,255,.18);
  filter:saturate(1.04);
}

.disk-buy-btn-secondary::before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.14),transparent 55%);
  pointer-events:none;
  opacity:.82;
}

/* 商品頁左右分欄佈局（方案D範例二：桌面版圖片左、資訊右） */
.disk-product-layout {
  display:flex;
  gap:36px;
  align-items:flex-start;
}
.disk-product-layout .disk-cover-image {
  flex:0 0 260px;
  max-width:260px;
  margin:0;
  text-align:left;
}
.disk-product-layout .disk-cover-image img {
  width:100%;
  height:auto;
  border-radius:8px;
  box-shadow:0 2px 12px rgba(0,0,0,.08);
  transition:transform .3s ease,box-shadow .3s ease;
}
.disk-product-layout .disk-info-card {
  flex:1;
  min-width:0;
  padding-top:0;
}
/* 瀏覽寬度 < 1030px：手機模式 — 圖片往上放、置中 */
@media(max-width:1030px){
  .disk-product-layout {
    flex-direction:column;
    gap:0;
  }
  .disk-product-layout .disk-cover-image {
    flex:none;
    max-width:320px;
    margin:0 auto 16px;
    text-align:center;
  }
  .disk-detail-page .disk-product-layout .disk-cover-image.disk-cover-adaptive {
    flex:none;
    max-width:320px;
  }
  .disk-product-layout .disk-cover-image img {
    max-width:100%;
    width:auto;
  }
}

/* 方案C：自適應封面圖（≥420px 圖片 + 放大鏡） */
.disk-product-layout .disk-cover-image.disk-cover-adaptive {
  flex:0 0 clamp(260px, 32%, 420px);
  max-width:420px;
}
.disk-cover-image.disk-cover-adaptive {
  cursor:zoom-in;
  position:relative;
  display:inline-block;
  overflow:hidden;
  border-radius:8px;
}
.disk-cover-image.disk-cover-adaptive:hover img {
  transform:scale(1.03);
  box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.disk-cover-image.disk-cover-adaptive:hover .zoom-icon {
  opacity:1;
  transform:scale(1);
}
.disk-cover-adaptive .zoom-icon {
  position:absolute;
  top:8px;
  right:8px;
  transform:scale(.8);
  opacity:0;
  background:rgba(0,0,0,.55);
  color:#fff;
  border-radius:50%;
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:opacity .25s,transform .25s;
  pointer-events:none;
  z-index:1;
}
.disk-cover-adaptive .zoom-icon svg{display:block}
/* 放大彈窗 */
.image-zoom-modal {
  display:none;
  position:fixed;
  inset:0;
  z-index:999999;
  align-items:center;
  justify-content:center;
}
.image-zoom-modal.active {
  display:flex;
}
.image-zoom-backdrop {
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.88);
  cursor:zoom-out;
  animation:zoomFadeIn .2s ease;
}
.image-zoom-close {
  position:absolute;
  top:16px;
  right:16px;
  width:44px;
  height:44px;
  border-radius:50%;
  background:rgba(255,255,255,.15);
  color:#fff;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2;
  transition:background .2s;
  backdrop-filter:blur(4px);
}
.image-zoom-close:hover {
  background:rgba(255,255,255,.3);
}
#imageZoomImg {
  max-width:92vw;
  max-height:92vh;
  object-fit:contain;
  border-radius:4px;
  box-shadow:0 8px 40px rgba(0,0,0,.5);
  position:relative;
  z-index:1;
  animation:zoomImgIn .25s ease;
}
#imageZoomImg[src=""] {
  display:none;
}
@keyframes zoomFadeIn {
  from{opacity:0}
  to{opacity:1}
}
@keyframes zoomImgIn {
  from{opacity:0;transform:scale(.92)}
  to{opacity:1;transform:scale(1)}
}
/* 無封面圖商品（非ebook）仍為單欄 */
.disk-cover-image{text-align:center;margin:0 0 16px}
.disk-cover-image img{max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 12px rgba(0,0,0,.08);display:inline-block}

.disk-content {
  background:transparent;
  border-radius:var(--r);
  padding:0 0 12px;
  margin:0 0 20px;
  font-size:.95rem;
  line-height:1.45;
  color:var(--text);
  word-break:break-all;
  overflow:hidden;
}

.disk-content br { line-height:0;font-size:0; }

.disk-content > * + * {
  margin-top: 4px;
}

.disk-content h1,
.disk-content h2,
.disk-content h3,
.disk-content h4,
.disk-content h5 {
  color: var(--text);
  line-height: 1.35;
  margin: 18px 0 10px;
  font-weight: 800;
  letter-spacing: .01em;
}

.disk-content h1 {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
  white-space: normal;
  font-size: 20px;
  font-weight: 900;
  color: #0f172a;
  line-height: 1.35;
  margin: 18px 0 10px;
  letter-spacing: .01em;
}

.disk-content h2 {
  font-size: 1.28rem;
}

.disk-content h3 {
  font-size: 1.08rem;
}

.disk-content p,
.disk-content div,
.disk-content li {
  font-size: 15px;
  line-height: 1.45;
  margin: 0;
}

.disk-content > table,
.disk-content > .subject,
.disk-content > font,
.disk-content > p,
.disk-content > div {
  width: 100%;
  box-sizing: border-box;
}

.disk-content > p,
.disk-content > div,
.disk-content > font {
  padding-left: 2px;
  padding-right: 2px;
}

.disk-content ul,
.disk-content ol {
  padding-left: 1.35em;
  margin: 10px 0 12px;
}

.disk-content li + li {
  margin-top: 6px;
}

.disk-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 6px 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
}

.disk-content td,
.disk-content th {
  padding: 8px 12px;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: top;
  text-align: left;
}

.disk-content tr:last-child td,
.disk-content tr:last-child th {
  border-bottom: none;
}

.disk-content table[width="100%"] {
  margin-top: 10px;
}

.disk-content table[width="100%"] tr:first-child td {
  padding: 6px 10px;
}

.disk-content table[width="100%"] td {
  padding: 8px 12px;
}

.disk-content .subject {
  display: block;
  margin: 10px 0 8px;
  padding: 7px 12px 7px 10px;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
  border-left: 4px solid var(--primary);
  border-radius: 10px;
  font-weight: 800;
  font-size: 15px;
  color: var(--text);
}

.disk-content img {
  display: block;
  max-width: min(100%, 640px);
  height: auto;
  margin: 16px auto;
  border-radius: 6px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

/* YouTube lazy-load 影片容器：點擊前後保持相同尺寸，防止 iframe 縮小 */
.llyv {
  position: relative;
  width: 100%;
  max-width: 560px;
  aspect-ratio: 16 / 9;
  height: auto;
  background: #000;
  overflow: hidden;
  cursor: pointer;
  display: block;
  margin: 12px auto !important;
}

.llyv iframe,
.llyv img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
  /* Override .disk-content img styles */
  max-width: none;
  margin: 0;
  border-radius: 0;
  box-shadow: none;
}

.disk-content .llyv {
  margin: 12px auto !important;
}

/* Old-layout wrapper: ensure llyv centers even if display changes */
.disk-content .wrapper {
  text-align: center;
}

.llyv-play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 68px;
  height: 48px;
  background: rgba(255, 0, 0, .85);
  border-radius: 12px;
  z-index: 2;
  pointer-events: none;
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
}

.llyv-play-btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: 10px 0 10px 18px;
  border-color: transparent transparent transparent #fff;
}

/* YouTube video container */
.dc-youtube {
  margin: 12px auto !important;
  max-width: 560px;
  width: 100%;
}
.dc-youtube .llyv,
.dc-youtube .llyv iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
}
.dc-youtube .llyv img {
  max-width: none;
  margin: 0;
  border-radius: 0;
  box-shadow: none;
}

/* Beautified file list */
.dc-file-list {
  list-style: none;
  padding: 0;
  margin: 8px 0;
}
.dc-file-list li {
  padding: 6px 10px;
  font-size: 14px;
  line-height: 1.6;
}
.dc-file-list li.dc-folder {
  border-left: 3px solid var(--primary, #2563eb);
  padding: 6px 10px 6px 8px;
  font-weight: 700;
  border-bottom: none;
  margin-left: 0;
}
.dc-file-list li.dc-file {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 28px;
  border-bottom: 1px solid var(--border, #e5e7eb);
  position: relative;
}
.dc-file-list li.dc-file::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  background: #1a73e8;
  border-radius: 50%;
}
.dc-file-list li:last-child {
  border-bottom: none;
}
.dc-file-tag {
  display: inline-block;
  background: var(--primary, #2563eb);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
  white-space: nowrap;
  flex-shrink: 0;
}
.disk-content a {
  color:var(--link);
  text-decoration:none;
}

.disk-content a:hover {
  color:var(--primary);
  text-decoration:underline;
}

.disk-content font {
  display: inline-block;
  max-width: 100%;
  line-height:1.5;
}

/* 清除商品內容區的醜陋灰色背景 */
.disk-content [bgcolor],
.disk-content [style*="background-color:#cccccc"],
.disk-content [style*="background-color:#CCCCCC"],
.disk-content [style*="background-color:#c0c0c0"],
.disk-content [style*="background-color:#C0C0C0"] {
  background: transparent !important;
}

/* 商品內容區的舊版 <font> 分類標題美化 */
.disk-content font[color="blue"] b,
.disk-content font[color="Blue"] b,
.disk-content font[color="#0000FF"] b,
.disk-content font[color="#0000ff"] b,
.disk-content font[color="blue"],
.disk-content font[color="Blue"],
.disk-content font[color="#0000FF"],
.disk-content font[color="#0000ff"] {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: linear-gradient(90deg, #eff6ff 0%, #f8fafc 100%);
  border-left: 4px solid var(--primary);
  border-radius: 0 8px 8px 0;
  padding: 8px 14px;
  margin: 12px 0 8px;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--primary) !important;
  font-family: var(--font) !important;
  letter-spacing: .03em;
}

/* 商品內容區一般 font 字體現代化 */
.disk-content font {
  font-size: 14px !important;
  font-family: var(--font) !important;
  color: var(--text);
}

.disk-content .detail-cat{
  display:flex !important;
  align-items:center;
  gap:0;
  font-weight:700 !important;
  letter-spacing:.02em;
  min-height:42px;
  padding:8px 12px 8px 10px;
  margin:10px 0 8px;
  background:linear-gradient(135deg,#f8fafc 0%,#ffffff 100%);
  border:1px solid rgba(148,163,184,.18);
  border-radius:14px;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
  box-sizing:border-box;
}

.disk-content .detail-cat-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:28px;
  height:28px;
  border-radius:999px;
  padding:0;
  margin-right:4px;
  background:linear-gradient(135deg,#e2e8f0 0%,#f8fafc 100%);
  color:#475569;
  box-shadow:0 1px 2px rgba(15,23,42,.08),inset 0 0 0 1px rgba(148,163,184,.16);
}

.disk-content .detail-cat-icon svg{
  width:16px;
  height:16px;
}

.disk-content .cat-info .detail-cat-icon{background:linear-gradient(135deg,#dbeafe 0%,#eff6ff 100%);color:#1d4ed8}
.disk-content .cat-video .detail-cat-icon{background:linear-gradient(135deg,#dbeafe 0%,#eff6ff 100%);color:#2563eb}
.disk-content .cat-course .detail-cat-icon{background:linear-gradient(135deg,#dbeafe 0%,#eff6ff 100%);color:#1d4ed8}
.disk-content .cat-image .detail-cat-icon{background:linear-gradient(135deg,#dbeafe 0%,#eff6ff 100%);color:#2563eb}
.disk-content .cat-related .detail-cat-icon{background:linear-gradient(135deg,#e0e7ff 0%,#eef2ff 100%);color:#4338ca}
.disk-content .cat-link .detail-cat-icon{background:linear-gradient(135deg,#cffafe 0%,#ecfeff 100%);color:#0e7490}
.disk-content .cat-install .detail-cat-icon{background:linear-gradient(135deg,#e0e7ff 0%,#eef2ff 100%);color:#4338ca}
.disk-content .cat-crack .detail-cat-icon{background:linear-gradient(135deg,#f1f5f9 0%,#f8fafc 100%);color:#334155}

.disk-keywords {
  padding:12px 4px;
  font-size:15px;
  color:var(--text-l);
  line-height:1.8;
}

.disk-keywords a {
  color:var(--link);
  text-decoration:none;
  margin-right:4px;
}

.disk-keywords a:hover {
  color:var(--primary);
  text-decoration:underline;
}

/* 搜索/標籤頁底部熱門關鍵字表（舊版相容） */
.main-content > table[cellspacing="0"]{
  width:100%;border-collapse:collapse;margin:16px 0 8px;
}
.main-content > table[cellspacing="0"] > tbody > tr:first-child > td.p_title{
  font-size:1rem;font-weight:600;color:var(--text);
  padding:8px 0 10px;border-bottom:1px solid var(--border);
}
.main-content > table[cellspacing="0"] table[style*="table-layout:fixed"]{
  width:100%;table-layout:fixed;
}
.main-content > table[cellspacing="0"] table[style*="table-layout:fixed"] a{
  display:block;padding:5px 4px;font-size:.85rem;color:var(--text-l);
  text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.main-content > table[cellspacing="0"] table[style*="table-layout:fixed"] a:hover{
  color:var(--primary);text-decoration:underline;
}

/* 手機響應式（磁碟详情） */
@media(max-width:768px){
  .content:has(.disk-detail-page){padding:0}
  .disk-detail-page{padding:8px 6px 18px}
  .disk-breadcrumb{padding:4px 6px 12px}
  .disk-info-card {padding:14px 10px 4px}
  .disk-info-grid {grid-template-columns:1fr;gap:10px}
  .info-item {padding:10px 12px}
  .info-value {font-size:15px}
  .info-value .disk-tag {padding:3px 8px;font-size:14px}
  .disk-info-grid .info-item:first-child .info-value:not(.disk-price) {font-size:16px}
  .disk-info-table th {width:80px;font-size:15px}
  .disk-info-table td {font-size:15px}
  .disk-content {padding:0 8px 12px;font-size:15px}
  .disk-buy-area {gap:10px;padding:16px 0}
  .disk-buy-btn,.disk-buy-btn-secondary {padding:10px 18px;font-size:.88rem;min-height:38px}
  .disk-product-layout .disk-cover-image,
  .disk-detail-page .disk-product-layout .disk-cover-image.disk-cover-adaptive { max-width:240px; margin:0 auto 12px; }
  .disk-product-layout .disk-cover-image img { max-width:100%; }
}
/* 小手機：圖片再縮小 */
@media(max-width:480px){
  .disk-product-layout .disk-cover-image,
  .disk-detail-page .disk-product-layout .disk-cover-image.disk-cover-adaptive { max-width:200px; }
}

/* ===== Mobile Sticky Bottom Buy Bar (dyna_disk) ===== */
.disk-mobile-buybar{
  position:fixed;
  bottom:0;left:0;right:0;
  z-index:98;
  background:rgba(255,255,255,.97);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  box-shadow:0 -2px 12px rgba(0,0,0,.1);
  border-top:1px solid var(--border);
  transform:translateY(100%);
  transition:transform .3s ease;
  display:none;
}
.disk-mobile-buybar.visible{
  transform:translateY(0);
}
.disk-mobile-buybar-inner{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:8px 12px;
  max-width:var(--max-w);
  margin:0 auto;
}
.disk-mobile-buybar-price{
  font-size:1rem;
  font-weight:800;
  color:var(--primary);
  white-space:nowrap;
  flex-shrink:0;
  justify-self:start;
}
.disk-mobile-buybar-btns{
  display:flex;
  gap:8px;
  flex-shrink:0;
  justify-content:center;
  grid-column:2;
}
.disk-mobile-buybar-btns .disk-buy-btn,
.disk-mobile-buybar-btns .disk-buy-btn-secondary{
  flex-shrink:0;
  padding:8px 14px;
  min-height:36px;
  font-size:.8rem;
}
/* Mobile fav button — compact heart icon */
.disk-mobile-fav-btn{
  flex-shrink:0;
  width:36px;height:36px;
  padding:0;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--border);
  border-radius:50%;
  background:transparent;
  color:#94a3b8;
  cursor:pointer;
  transition:color .2s, border-color .2s, background .2s;
}
.disk-mobile-fav-btn .fav-icon{
  width:18px;height:18px;
}
.disk-mobile-fav-btn:hover{
  color:#e53e3e;
  border-color:#e53e3e;
}
.disk-mobile-fav-btn.fav-active{
  color:#e53e3e;
  border-color:#e53e3e;
  background:rgba(229,62,62,.08);
}
@media(max-width:768px){
  .disk-mobile-buybar{display:block}
  .disk-mobile-buybar-price .cart-special-label{font-size:12px;padding:1px 4px}
  .toast-container{top:16px}
  .sr-title{padding:10px 12px;margin:0 0 8px}
  .sr-title-keyword{font-size:17px}
  .sr-title-count{font-size:12px}
}



/* 問與表單寬度統一 */
.main-content .question-form {
  max-width: 1000px;
  margin: 0 auto;
}
.main-content .question-form .of-inner,
.main-content .question-form .of-inner > table {
  width: 100%;
}
.main-content .question-form .of-inner > table,
.main-content .question-form table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: #fff !important;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.main-content .question-form .of-inner > table > tbody > tr,
.main-content .question-form .of-inner > table tr,
.main-content .question-form table tr {
  display: grid;
  grid-template-columns: 110px 360px 1fr;
  align-items: center;
  gap: 0;
  border-bottom: 1px solid #f1f5f9;
  min-height: 44px;
}
.main-content .question-form .of-inner > table td,
.main-content .question-form table td {
  padding: 9px 12px !important;
  border: none !important;
  vertical-align: middle !important;
  background: transparent !important;
}
.main-content .question-form .of-inner > table td:first-child,
.main-content .question-form table td:first-child {
  font-weight: 600 !important;
  color: #334155 !important;
  font-size: 15px !important;
  text-align: right !important;
  padding-right: 8px !important;
  white-space: nowrap;
}
.main-content .question-form .of-inner > table td:nth-child(3),
.main-content .question-form table td:nth-child(3) {
  font-size: 14px !important;
  color: #94a3b8 !important;
  line-height: 1.4;
  padding: 9px 12px 9px 6px !important;
  text-align: left;
}
.main-content .question-form .of-inner > table select,
.main-content .question-form .of-inner > table input[type="text"],
.main-content .question-form .of-inner > table textarea,
.main-content .question-form table select,
.main-content .question-form table input[type="text"],
.main-content .question-form table textarea {
  width: 100%;
  max-width: 400px;
  padding: 8px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-size: 14px;
  font-family: var(--font);
  transition: all .2s ease;
  background: #fff;
  color: var(--text);
  line-height: 1.5;
  box-sizing: border-box;
}
.main-content .question-form .question-addr-inline {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.main-content .question-form .question-addr-inline #addr_zip {
  width: 64px !important;
  max-width: 64px !important;
  flex: 0 0 auto;
  text-align: center;
  color: #64748b;
  background: #f8fafc;
  display: inline-block;
  margin-right: 0;
}
.main-content .question-form .question-addr-inline #addr_county,
.main-content .question-form .question-addr-inline #addr_zone {
  width: auto !important;
  max-width: 160px !important;
  flex: 1 1 0;
  min-width: 90px;
  display: inline-block;
  margin-right: 0;
}
.main-content .question-form #addr_info {
  max-width: 500px !important;
  width: 100% !important;
  margin-top: 6px;
}
.main-content .question-form #ex_addr {
  display: block;
  margin-top: 8px;
  background: #fff1f2;
  border: 2px solid #fb7185;
  border-radius: 10px;
  padding: 8px 12px;
  box-shadow: 0 4px 14px rgba(244,63,94,.12);
}
.main-content .question-form .g-recaptcha {
  transform: scale(.96);
  transform-origin: left top;
}
.main-content .question-form input[type="submit"] {
  padding: 10px 36px !important;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-d) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  max-width: none !important;
  width: auto !important;
  box-shadow: 0 2px 8px rgba(37,99,235,.2);
}
.main-content .question-form tr:last-child td {
  padding-top: 14px !important;
  padding-bottom: 18px !important;
}
.main-content .question-form tr:last-child td:nth-child(2) {
  text-align: left;
}

.main-content .question-form .question-title-cell select {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 300px;
}
.main-content .question-form .question-section-title {
  background: linear-gradient(135deg, #f8fafc 0%, #fff 100%) !important;
  color: var(--primary-d) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .03em;
  padding: 14px 16px !important;
}


.main-content .question-form .question-title-cell {
  width: auto !important;
}
.main-content .question-form .question-title-cell select {
  width: 100% !important;
  max-width: none !important;
  min-width: 360px;
}
.main-content .question-form .question-section-title {
  background: linear-gradient(135deg, #f8fafc 0%, #fff 100%) !important;
  color: var(--primary-d) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .03em;
  padding: 14px 16px !important;
}

.main-content .question-form .question-title-select {
  width: 100% !important;
  max-width: none !important;
  min-width: 420px;
}

.main-content .question-form .question-title-cell select,
.main-content .question-form .question-title-select {
  width: 100% !important;
  max-width: 400px !important;
  min-width: 0 !important;
}




/* 問與內容列：標籤靠左、表單靠右，不影響其他列 */
.main-content .question-form .question-content-row {
  width: 100%;
  grid-template-columns: 110px minmax(0, 1fr) !important;
  align-items: start;
}
.main-content .question-form .question-content-row > td {
  vertical-align: top !important;
}
.main-content .question-form .question-content-row > td:first-child {
  width: 96px;
  white-space: nowrap;
}
.main-content .question-form .question-content-row .question-content-cell {
  width: 100% !important;
  padding: 9px 12px !important;
  min-width: 0;
}
.main-content .question-form .question-content-row .question-content-cell textarea[name="content"] {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 220px;
  display: block;
  margin: 0;
  box-sizing: border-box;
}
.main-content .question-form .question-content-row .question-content-cell br + font[color="Brown"] {
  display: block;
  margin-top: 10px;
}

.main-content .question-form .question-content-cell {
  width: 100% !important;
  padding: 9px 12px !important;
  display: table-cell !important;
}
.main-content .question-form .question-content-cell textarea[name="content"] {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 220px;
  display: block;
  margin: 0;
  box-sizing: border-box;
}
.main-content .question-form .question-content-cell font[color="Brown"] {
  display: block;
  margin-top: 10px;
}

body.page-orderstate .main-content .utility-form--orderstate #lchcodeimg {
  display: block;
  margin-top: 8px;
  height: 28px !important;
}

/* === 問與表單：手機響應式 === */
@media (max-width: 768px) {
  .main-content .question-form,
  .main-content .question-form .of-inner,
  .main-content .question-form .of-inner > table,
  .main-content .question-form table {
    text-align: left !important;
  }

  .main-content .question-form .of-inner > table,
  .main-content .question-form table {
    display: flex !important;
    flex-wrap: wrap;
  }

  .main-content .question-form .of-inner > table > tbody > tr,
  .main-content .question-form .of-inner > table tr,
  .main-content .question-form table tr {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    grid-template-columns: none !important;
  }

  .main-content .question-form .of-inner > table td:first-child,
  .main-content .question-form table td:first-child {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 1 !important;
    text-align: left !important;
    padding: 8px 12px 4px !important;
    font-weight: 600;
    color: var(--text);
  }

  .main-content .question-form .of-inner > table td:nth-child(3),
  .main-content .question-form table td:nth-child(3) {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 2 !important;
    display: block !important;
    padding: 0 12px 4px !important;
    font-size: 14px !important;
    color: #94a3b8 !important;
    text-align: left !important;
    white-space: normal !important;
  }

  .main-content .question-form .of-inner > table td:nth-child(2),
  .main-content .question-form table td:nth-child(2) {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 3 !important;
    text-align: left !important;
    padding: 0 12px 8px !important;
  }

  .main-content .question-form .of-inner > table select,
  .main-content .question-form .of-inner > table input[type="text"],
  .main-content .question-form .of-inner > table textarea,
  .main-content .question-form table select,
  .main-content .question-form table input[type="text"],
  .main-content .question-form table textarea {
    max-width: 100% !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* question 表單地址三欄手機版橫排 */
  .main-content .question-form .question-addr-inline {
    display: flex !important;
    gap: 8px;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
  }
  .main-content .question-form .question-addr-inline #addr_zip {
    width: 64px !important;
    max-width: 64px !important;
    flex: 0 0 auto !important;
    display: inline-block !important;
    margin-bottom: 0 !important;
  }
  .main-content .question-form .question-addr-inline #addr_county,
  .main-content .question-form .question-addr-inline #addr_zone {
    flex: 1 1 0 !important;
    min-width: 90px;
    display: inline-block !important;
    margin-bottom: 0 !important;
    max-width: none !important;
    width: auto !important;
  }
}

/* 窄螢幕（≤1030px）→ 問與表單提示字換行到輸入框下方，地址/問題內容列也統一對齊 */
@media(max-width:1030px) {
  body.page-question .main-content .question-form .of-inner > table tr:not(:has(input[type="radio"])):not(:has(td:nth-child(3) a img)),
  body.page-question .main-content .question-form table tr:not(:has(input[type="radio"])):not(:has(td:nth-child(3) a img)) {
    grid-template-columns: 110px minmax(0, 360px);
  }
  body.page-question .main-content .question-form .of-inner > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)) > td:nth-child(3),
  body.page-question .main-content .question-form table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)) > td:nth-child(3) {
    grid-column: 2;
    align-self: start;
    padding-left: 1em !important;
    padding-top: 0;
    margin-top: -8px;
    font-size: 13px !important;
    max-width: 360px !important;
  }

  /* 地址行：統一 2 欄，內容格拉滿 */
  body.page-question .main-content .question-form .of-inner > table tr:has(td[colspan="2"]),
  body.page-question .main-content .question-form table tr:has(td[colspan="2"]) {
    grid-template-columns: 110px minmax(0, 1fr) !important;
  }
  body.page-question .main-content .question-form .of-inner > table tr:has(td[colspan="2"]) > td[colspan="2"],
  body.page-question .main-content .question-form table tr:has(td[colspan="2"]) > td[colspan="2"] {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
    padding: 12px 12px 8px !important;
  }

  /* 問題內容行：統一 2 欄，textarea 拉滿 */
  body.page-question .main-content .question-form .of-inner > table tr.question-content-row,
  body.page-question .main-content .question-form table tr.question-content-row {
    grid-template-columns: 110px minmax(0, 1fr) !important;
  }
  body.page-question .main-content .question-form .of-inner > table tr.question-content-row .question-content-cell,
  body.page-question .main-content .question-form table tr.question-content-row .question-content-cell {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 12px 8px !important;
  }

  /* 訂單編號行：≤1030px 切 2 欄，與其他欄位對齊 */
  body.page-question .main-content .question-form .of-inner > table tr.question-orderid-row,
  body.page-question .main-content .question-form table tr.question-orderid-row {
    grid-template-columns: 110px minmax(0, 360px) !important;
  }
  /* 訂單編號行提示字（第三欄）移到第二欄下方 */
  body.page-question .main-content .question-form .of-inner > table tr.question-orderid-row > td:nth-child(3),
  body.page-question .main-content .question-form table tr.question-orderid-row > td:nth-child(3) {
    grid-column: 2;
    align-self: start;
    padding-left: 1em !important;
    padding-top: 0;
    margin-top: -8px;
    font-size: 13px !important;
    max-width: 360px !important;
    white-space: normal !important;
  }

  /* 窄螢幕標題欄統一左對齊，避免與 110px 欄寬衝突 */
  body.page-question .main-content .question-form .of-inner > table td:first-child,
  body.page-question .main-content .question-form table td:first-child,
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:first-child,
  body.page-orderstate .main-content .utility-form--orderstate > table td:first-child {
    text-align: left !important;
    padding-right: 8px !important;
    width: 110px;
  }
}

/* === 問題表單 / 訂單查詢：最終對齊覆寫 ===
   目的：
   1) 讓 question / orderstate 兩頁使用同一套卡片與欄寬節奏。
   2) 修正 table row 在 grid 佈局下的 colspan 對齊問題。
   3) 避免前面重複規則互相覆蓋。 */
body.page-question .main-content .question-form,
body.page-orderstate .main-content .utility-form--orderstate {
  max-width: 1000px;
  margin: 0 auto 24px;
  font-family: var(--font);
}

body.page-question .main-content .question-form > .of-inner,
body.page-question .main-content .question-form > table,
body.page-orderstate .main-content .utility-form--orderstate > .of-inner,
body.page-orderstate .main-content .utility-form--orderstate > table {
  width: 100%;
}

body.page-question .main-content .question-form > .of-inner > table,
body.page-question .main-content .question-form > table,
body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table,
body.page-orderstate .main-content .utility-form--orderstate > table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--sh-soft);
}

@media (min-width: 1031px) {
  body.page-question .main-content .question-form > .of-inner > table tr,
  body.page-question .main-content .question-form > table tr,
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table tr,
  body.page-orderstate .main-content .utility-form--orderstate > table tr {
    display: grid;
    grid-template-columns: 128px minmax(0, 400px) minmax(0, 1fr);
    align-items: center;
    gap: 0;
    border-bottom: 1px solid #eef2f7;
    min-height: 56px;
  }
}

body.page-question .main-content .question-form > .of-inner > table td,
body.page-question .main-content .question-form > table td,
body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td,
body.page-orderstate .main-content .utility-form--orderstate > table td {
  padding: 12px 16px !important;
  border: none !important;
  background: transparent !important;
  vertical-align: middle !important;
  box-sizing: border-box;
}

@media (min-width: 1031px) {
  body.page-question .main-content .question-form > .of-inner > table td:first-child,
  body.page-question .main-content .question-form > table td:first-child,
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:first-child,
  body.page-orderstate .main-content .utility-form--orderstate > table td:first-child {
    width: 128px;
    font-weight: 700 !important;
    color: #334155 !important;
    font-size: 15px !important;
    text-align: right !important;
    white-space: nowrap;
    padding-right: 10px !important;
  }

  body.page-question .main-content .question-form > .of-inner > table td:nth-child(3),
  body.page-question .main-content .question-form > table td:nth-child(3),
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:nth-child(3),
  body.page-orderstate .main-content .utility-form--orderstate > table td:nth-child(3) {
    padding-left: 8px !important;
    font-size: 14px !important;
    color: var(--text-l) !important;
    line-height: 1.5;
  }
}

@media (min-width: 1031px) {
  body.page-question .main-content .question-form > .of-inner > table tr:not(.question-content-row):not(:has(td[colspan])),
  body.page-question .main-content .question-form > table tr:not(.question-content-row):not(:has(td[colspan])) {
    grid-template-columns: 128px minmax(0, 320px) minmax(0, 1fr);
  }

  body.page-question .main-content .question-form > .of-inner > table tr:not(.question-content-row):not(:has(td[colspan])) > td:nth-child(2),
  body.page-question .main-content .question-form > table tr:not(.question-content-row):not(:has(td[colspan])) > td:nth-child(2) {
    max-width: 320px !important;
  }

  body.page-question .main-content .question-form > .of-inner > table tr:not(.question-content-row):not(:has(td[colspan])) > td:nth-child(3),
  body.page-question .main-content .question-form > table tr:not(.question-content-row):not(:has(td[colspan])) > td:nth-child(3) {
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    font-size: 13px !important;
    color: #64748b !important;
  }
}

@media (min-width: 1031px) {
  /* 問題表單 colspan=2 跨到最右（與 cart 地址列一致） */
  body.page-question .main-content .question-form td[colspan="2"] {
    grid-column: 2 / -1;
  }

  body.page-orderstate .main-content .utility-form--orderstate td[colspan="2"] {
    grid-column: 2 / span 2;
  }

  body.page-question .main-content .question-form td[colspan="3"],
  body.page-orderstate .main-content .utility-form--orderstate td[colspan="3"] {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 1030px) {
  body.page-question .main-content .question-form td[colspan="2"] {
    grid-column: 2 / -1 !important;
  }
  body.page-question .main-content .question-form td[colspan="3"],
  body.page-orderstate .main-content .utility-form--orderstate td[colspan="3"] {
    grid-column: 1 / -1 !important;
  }
  body.page-question .main-content .question-form tr.question-order-detail-row{
    display:block !important;
    width:100% !important;
  }
  body.page-question .main-content .question-form tr.question-order-detail-row > td{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
}

body.page-question .main-content .question-form .question-title-cell {
  width: auto !important;
}

body.page-question .main-content .question-form .question-title-cell select,
body.page-question .main-content .question-form .question-title-select {
  width: 100% !important;
  max-width: 320px !important;
  min-width: 0 !important;
  text-align: left !important;
}

@media (min-width: 1031px) {
  body.page-question .main-content .question-form .question-content-row {
    grid-template-columns: 128px minmax(0, 1fr) !important;
    align-items: start;
  }

  body.page-question .main-content .question-form .question-content-row > td:first-child {
    padding-top: 14px !important;
  }

  body.page-question .main-content .question-form .question-content-row .question-content-cell,
  body.page-question .main-content .question-form .question-content-cell {
    grid-column: 2 / -1 !important;
    width: 100% !important;
    min-width: 0;
    padding: 12px 16px !important;
  }
}

body.page-question .main-content .question-form .question-content-row .question-content-cell textarea[name="content"],
body.page-question .main-content .question-form .question-content-cell textarea[name="content"] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 220px;
  display: block;
  margin: 0;
  box-sizing: border-box;
}

body.page-question .main-content .question-form .question-content-row .question-content-cell font[color="Brown"],
body.page-question .main-content .question-form .question-content-cell font[color="Brown"] {
  display: block;
  margin-top: 10px;
  color: #b45309 !important;
  line-height: 1.65;
}

body.page-question .main-content .question-form .question-addr-inline {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
body.page-question .main-content .question-form .question-addr-inline #addr_zip {
  width: 64px !important;
  max-width: 64px !important;
  flex: 0 0 auto;
  text-align: center;
  color: #64748b;
  background: #f8fafc;
  display: inline-block;
  margin-right: 0;
}
body.page-question .main-content .question-form .question-addr-inline #addr_county,
body.page-question .main-content .question-form .question-addr-inline #addr_zone {
  width: auto !important;
  max-width: 160px !important;
  flex: 1 1 0;
  min-width: 90px;
  display: inline-block;
  margin-right: 0;
}

body.page-question .main-content .question-form #addr_info {
  max-width: 500px !important;
  width: 100% !important;
  margin-top: 6px;
}

body.page-question .main-content .question-form #ex_addr,
body.page-orderstate .main-content .utility-form--orderstate #ex_addr {
  display: block;
  margin-top: 8px;
  background: #fff1f2;
  border: 2px solid #fb7185;
  border-radius: 10px;
  padding: 8px 12px;
  box-shadow: 0 4px 14px rgba(244, 63, 94, .12);
}

body.page-question .main-content .question-form .g-recaptcha,
body.page-orderstate .main-content .utility-form--orderstate .g-recaptcha {
  transform: scale(.96);
  transform-origin: left top;
}

body.page-question .main-content .question-form input[type="submit"],
body.page-orderstate .main-content .utility-form--orderstate input[type="submit"] {
  padding: 10px 36px !important;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-d) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  max-width: none !important;
  width: auto !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, .2);
}

body.page-question .main-content .question-form tr:last-child td,
body.page-orderstate .main-content .utility-form--orderstate tr:last-child td {
  padding-top: 14px !important;
  padding-bottom: 18px !important;
}

body.page-question .main-content .question-form tr:last-child td:nth-child(2),
body.page-orderstate .main-content .utility-form--orderstate tr:last-child td:nth-child(2) {
  text-align: left;
}

body.page-orderstate .main-content .utility-form--orderstate input[type="text"],
body.page-orderstate .main-content .utility-form--orderstate input[type="email"],
body.page-orderstate .main-content .utility-form--orderstate input:not([type]) {
  width: 100% !important;
  max-width: 400px;
  padding: 10px 12px;
  border: 1.5px solid #dbe3ee;
  border-radius: 10px;
  font-family: var(--font);
  font-size: 14px;
  color: var(--text);
  background: #fff;
  box-sizing: border-box;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body.page-orderstate .main-content .utility-form--orderstate input[type="text"]:focus,
body.page-orderstate .main-content .utility-form--orderstate input[type="email"]:focus,
body.page-orderstate .main-content .utility-form--orderstate input:not([type]):focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

body.page-question .main-content .question-form input[type="text"],
body.page-question .main-content .question-form input[type="email"],
body.page-question .main-content .question-form input:not([type]),
body.page-question .main-content .question-form select,
body.page-question .main-content .question-form textarea {
  width: 100% !important;
  max-width: 320px;
  padding: 10px 12px;
  border: 1.5px solid #dbe3ee;
  border-radius: 10px;
  font-family: var(--font);
  font-size: 14px;
  color: var(--text);
  background: #fff;
  box-sizing: border-box;
  text-align: left !important;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

body.page-question .main-content .question-form input[type="text"]:focus,
body.page-question .main-content .question-form input[type="email"]:focus,
body.page-question .main-content .question-form input:not([type]):focus,
body.page-question .main-content .question-form select:focus,
body.page-question .main-content .question-form textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

body.page-question .main-content .question-form .question-content-row td:first-child,
body.page-orderstate .main-content .utility-form--orderstate td:first-child {
  text-align: right;
}

body.page-question .main-content .question-form tr.question-notice-row {
  grid-column: 1 / -1 !important;
  display: block !important;
  width: 100% !important;
  grid-template-columns: none !important;
  min-height: auto !important;
  border-bottom: none !important;
}

body.page-question .main-content .question-form tr.question-notice-row td {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  grid-column: auto !important;
  padding: 0 10px 8px !important;
  border: none !important;
  background: transparent !important;
  text-align: left !important;
}

body.page-question .main-content .question-notice-box {
  border: none;
  background: transparent;
  padding: 16px 0 0;
  box-shadow: none;
  text-align: left !important;
}

body.page-question .main-content .question-notice-list {
  margin: 0;
  padding-left: 1.05em;
  color: #334155;
  font-size: 14px;
  line-height: 1.6;
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal !important;
  max-width: 100%;
  text-align: left !important;
}

body.page-question .main-content .question-notice-list li {
  margin: 0 0 8px;
  padding-bottom: 8px;
  border-bottom: 1px dashed #cbd5e1;
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal !important;
  max-width: 100%;
  text-align: left !important;
}

body.page-question .main-content .question-notice-list li:last-child {
  border-bottom: 1px dashed #cbd5e1;
  padding-bottom: 8px;
}

body.page-question .main-content .question-notice-list li::marker {
  color: #2563eb;
  font-weight: 700;
}

body.page-question .main-content .question-notice-list a {
  display: inline;
  color: #2563eb;
  text-decoration: underline;
  text-underline-offset: 2px;
  overflow-wrap: break-word;
  word-break: break-word;
  white-space: normal !important;
}

/* 驗證碼行：窄輸入框 + 圖片固定在右邊 — 與 cart 表單一致 */
body.page-question .main-content .question-form > .of-inner > table tr:has(td:nth-child(3) a img),
body.page-question .main-content .question-form > table tr:has(td:nth-child(3) a img) {
  grid-template-columns: 128px 120px auto !important;
}
body.page-question .main-content .question-form > .of-inner > table tr:has(td:nth-child(3) a img) input,
body.page-question .main-content .question-form > table tr:has(td:nth-child(3) a img) input {
  max-width: 120px !important;
}

/* 驗證碼行：≤1030px 保持 3 列（圖片始終在右側），與 cart 表單統一 */
@media(max-width:1030px) {
  body.page-question .main-content .question-form > .of-inner > table tr:has(td:nth-child(3) a img),
  body.page-question .main-content .question-form > table tr:has(td:nth-child(3) a img) {
    grid-template-columns: 110px 120px auto !important;
  }
  body.page-question .main-content .question-form > .of-inner > table tr:has(td:nth-child(3) a img) input,
  body.page-question .main-content .question-form > table tr:has(td:nth-child(3) a img) input {
    max-width: 120px !important;
  }
}

/* === 問題單欄位寬度限制 === */
/* 問題標題 select max 200px */
body.page-question .main-content .question-form select[name="type"],
body.page-question .main-content .question-form .question-title-cell select,
body.page-question .main-content .question-form .question-title-select {
  max-width: 200px !important;
}
/* 姓名 input max 200px */
body.page-question .main-content .question-form input[name="name"] {
  max-width: 200px !important;
}
/* 地址 input max 500px */
body.page-question .main-content .question-form input[name="addr_info"] {
  max-width: 500px !important;
}
/* E-Mail input max 300px */
body.page-question .main-content .question-form input[name="email"] {
  max-width: 300px !important;
}
/* 聯絡手機 input max 200px */
body.page-question .main-content .question-form input[name="mobile"] {
  max-width: 200px !important;
}
/* 問題內容 textarea max 500px */
body.page-question .main-content .question-form textarea[name="content"],
body.page-question .main-content .question-form .question-content-cell textarea[name="content"],
body.page-question .main-content .question-form .question-content-row .question-content-cell textarea[name="content"] {
  max-width: 500px !important;
}
/* 訂單編號 select max 200px */
body.page-question .main-content .question-form select[name="order_select"] {
  max-width: 200px !important;
}

/* === 手機版（≤768px）：所有欄位填滿容器寬度 === */
@media (max-width: 768px) {
  body.page-question .main-content .question-form select[name="type"],
  body.page-question .main-content .question-form .question-title-cell select,
  body.page-question .main-content .question-form .question-title-select,
  body.page-question .main-content .question-form input[name="name"],
  body.page-question .main-content .question-form input[name="email"],
  body.page-question .main-content .question-form input[name="mobile"],
  body.page-question .main-content .question-form input[name="addr_info"],
  body.page-question .main-content .question-form #addr_info,
  body.page-question .main-content .question-form textarea[name="content"],
  body.page-question .main-content .question-form .question-content-cell textarea[name="content"],
  body.page-question .main-content .question-form .question-content-row .question-content-cell textarea[name="content"],
  body.page-question .main-content .question-form select[name="order_select"] {
    max-width: 100% !important;
    width: 100% !important;
  }
  /* addr_zip 固定 64px，不拉滿 */
  body.page-question .main-content .question-form #addr_zip {
    max-width: 64px !important;
    width: 64px !important;
  }
  /* submit 按鈕滿寬 */
  body.page-question .main-content .question-form input[type="submit"] {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* === 訂購表單欄位寬度限制 === */
/* 姓名 input max 200px */
body.page-cart .main-content .order-form input[name="name"],
body.page-order .main-content .order-form input[name="name"] {
  max-width: 200px !important;
}
/* 地址 input max 500px */
body.page-cart .main-content .order-form input[name="addr_info"],
body.page-order .main-content .order-form input[name="addr_info"],
body.page-cart .main-content .order-form #addr_info {
  max-width: 500px !important;
}
/* E-Mail input max 300px */
body.page-cart .main-content .order-form input[name="email"],
body.page-order .main-content .order-form input[name="email"] {
  max-width: 300px !important;
}
/* 聯絡手機 input max 200px */
body.page-cart .main-content .order-form input[name="mobile"],
body.page-order .main-content .order-form input[name="mobile"] {
  max-width: 200px !important;
}
/* 送達時段 select max 200px */
body.page-cart .main-content .order-form select[name="time"],
body.page-order .main-content .order-form select[name="time"] {
  max-width: 200px !important;
}
/* 備註 textarea max 500px */
body.page-cart .main-content .order-form textarea[name="memo"],
body.page-order .main-content .order-form textarea[name="memo"] {
  max-width: 500px !important;
}

@media (max-width: 768px) {
  body.page-question .main-content .question-form > .of-inner > table,
  body.page-question .main-content .question-form > table,
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table,
  body.page-orderstate .main-content .utility-form--orderstate > table {
    display: flex !important;
    flex-wrap: wrap;
  }

  body.page-question .main-content .question-form > .of-inner > table tr,
  body.page-question .main-content .question-form > table tr,
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table tr,
  body.page-orderstate .main-content .utility-form--orderstate > table tr {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    grid-template-columns: none !important;
  }

  body.page-question .main-content .question-form > .of-inner > table td:first-child,
  body.page-question .main-content .question-form > table td:first-child,
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:first-child,
  body.page-orderstate .main-content .utility-form--orderstate > table td:first-child {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    order: 1 !important;
    text-align: left !important;
    padding: 8px 12px 4px !important;
    font-weight: 600;
    color: var(--text);
  }

  body.page-question .main-content .question-form > .of-inner > table td:nth-child(2),
  body.page-question .main-content .question-form > table td:nth-child(2),
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:nth-child(2),
  body.page-orderstate .main-content .utility-form--orderstate > table td:nth-child(2) {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    order: 2 !important;
    display: block !important;
    text-align: left !important;
    padding: 0 12px 8px !important;
  }

  body.page-question .main-content .question-form td[colspan="2"],
  body.page-orderstate .main-content .utility-form--orderstate td[colspan="2"] {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    order: 2 !important;
    grid-column: auto !important;
    display: block !important;
    text-align: left !important;
    padding: 0 12px 8px !important;
  }

  body.page-question .main-content .question-form > .of-inner > table td:nth-child(3),
  body.page-question .main-content .question-form > table td:nth-child(3),
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table td:nth-child(3),
  body.page-orderstate .main-content .utility-form--orderstate > table td:nth-child(3) {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    order: 3 !important;
    display: block !important;
    padding: 0 12px 4px !important;
    font-size: 14px !important;
    color: var(--text-l) !important;
    text-align: left !important;
    white-space: normal !important;
  }

  body.page-question .main-content .question-form > .of-inner > table select,
  body.page-question .main-content .question-form > .of-inner > table input[type="text"],
  body.page-question .main-content .question-form > .of-inner > table input[type="email"],
  body.page-question .main-content .question-form > .of-inner > table textarea,
  body.page-question .main-content .question-form > table select,
  body.page-question .main-content .question-form > table input[type="text"],
  body.page-question .main-content .question-form > table input[type="email"],
  body.page-question .main-content .question-form > table textarea,
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table select,
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table input[type="text"],
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table input[type="email"],
  body.page-orderstate .main-content .utility-form--orderstate > .of-inner > table textarea,
  body.page-orderstate .main-content .utility-form--orderstate > table select,
  body.page-orderstate .main-content .utility-form--orderstate > table input[type="text"],
  body.page-orderstate .main-content .utility-form--orderstate > table input[type="email"],
  body.page-orderstate .main-content .utility-form--orderstate > table textarea {
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
    display: block !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.page-question .main-content .question-form tr.question-notice-row {
    grid-column: 1 / -1 !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: none !important;
    min-height: auto !important;
    border-bottom: none !important;
  }

  body.page-question .main-content .question-form tr.question-notice-row td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    grid-column: auto !important;
    padding: 0 12px 8px !important;
    text-align: left !important;
  }

  body.page-question .main-content .question-notice-box {
    padding: 9px 10px 7px;
    text-align: left !important;
  }

  body.page-question .main-content .question-notice-list {
    font-size: 13px;
    line-height: 1.55;
    text-align: left !important;
    white-space: normal;
    overflow-x: visible;
  }

  /* 手機版驗證碼行：按 cart 表單排序 — 圖片在上，輸入框在下 */
  body.page-question .main-content .question-form > .of-inner > table tr:has(td:nth-child(3) a img) > td:nth-child(2),
  body.page-question .main-content .question-form > table tr:has(td:nth-child(3) a img) > td:nth-child(2) {
    order: 3 !important;
  }
  body.page-question .main-content .question-form > .of-inner > table tr:has(td:nth-child(3) a img) > td:nth-child(3),
  body.page-question .main-content .question-form > table tr:has(td:nth-child(3) a img) > td:nth-child(3) {
    order: 2 !important;
    text-align: left !important;
    padding: 0 12px 4px !important;
  }

  /* 問題單手機版：提示字放在標題下方，跟訂購表單一樣 */
  body.page-question .main-content .question-form > .of-inner > table td:nth-child(3),
  body.page-question .main-content .question-form > table td:nth-child(3) {
    order: 2 !important;
  }
  body.page-question .main-content .question-form > .of-inner > table td:nth-child(2),
  body.page-question .main-content .question-form > table td:nth-child(2) {
    order: 3 !important;
  }
}

/* === 訂購說明頁：read.htm 現代化覆寫 === */
body.page-read .main-content > table#table1,
body.page-read .main-content table#table1 {
  max-width: 1000px;
  margin: 0 auto 24px;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.page-read .main-content > table#table1 td,
body.page-read .main-content table#table1 td {
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

body.page-read .main-content > table#table1 td[background],
body.page-read .main-content table#table1 td[background*="bg_03"] {
  padding: 14px 18px !important;
  background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%) !important;
  border: 1px solid var(--border) !important;
  border-bottom: none !important;
  border-radius: 18px 18px 0 0 !important;
  box-shadow: var(--sh-soft);
}

body.page-read .main-content > table#table1 td[background] font,
body.page-read .main-content table#table1 td[background*="bg_03"] font {
  color: var(--primary-d) !important;
  font-weight: 800 !important;
  font-size: 16px !important;
  letter-spacing: .02em;
}

body.page-read .main-content > table#table1 td[bgcolor="#ccffff"],
body.page-read .main-content table#table1 td[bgcolor="#ccffff"] {
  background: #fff !important;
  border: 1px solid var(--border) !important;
  border-top: none !important;
  border-radius: 0 0 18px 18px !important;
  box-shadow: var(--sh-soft);
  padding: 20px 22px !important;
  color: var(--text) !important;
  line-height: 1.9;
  font-size: 15px !important;
}

body.page-read .main-content > table#table1 td[bgcolor="#ccffff"] hr,
body.page-read .main-content table#table1 td[bgcolor="#ccffff"] hr {
  border: 0;
  border-top: 1px solid #e2e8f0;
  margin: 12px 0;
}

body.page-read .main-content > table#table1 td[bgcolor="#ccffff"] a,
body.page-read .main-content table#table1 td[bgcolor="#ccffff"] a {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}

body.page-read .main-content > table#table1 td[bgcolor="#ccffff"] b,
body.page-read .main-content table#table1 td[bgcolor="#ccffff"] b,
body.page-read .main-content > table#table1 td[bgcolor="#ccffff"] font,
body.page-read .main-content table#table1 td[bgcolor="#ccffff"] font {
  font-size: 15px !important;
  line-height: 1.9;
}

body.page-read .main-content > table#table1 td[bgcolor="#ccffff"] span[style*="background-color: #FFFF00"] {
  padding: 1px 4px;
  border-radius: 4px;
}

@media (max-width: 768px) {
  body.page-read .main-content > table#table1,
  body.page-read .main-content table#table1 {
    max-width: 100%;
  }

  body.page-read .main-content > table#table1 td[background],
  body.page-read .main-content table#table1 td[background*="bg_03"] {
    padding: 12px 14px !important;
    border-radius: 16px 16px 0 0 !important;
  }

  body.page-read .main-content > table#table1 td[bgcolor="#ccffff"],
  body.page-read .main-content table#table1 td[bgcolor="#ccffff"] {
    padding: 16px 14px !important;
    border-radius: 0 0 16px 16px !important;
    font-size: 14px !important;
  }
}


/* 全站載入遮罩：阻止載入時誤點 */
html.page-loading,
html.page-loading body {
  overflow: hidden !important;
}

html.page-loading .main-wrap,
html.page-loading .site-header,
html.page-loading .site-footer,
html.page-loading .search-mask,
html.page-loading .sidebar-overlay {
  pointer-events: none !important;
}

html.page-loading .page-loader {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at center, rgba(255,255,255,.92) 0%, rgba(248,250,252,.98) 55%, rgba(226,232,240,.98) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

html.page-loading .page-loader-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 24px 28px;
  border-radius: 22px;
  background: rgba(255,255,255,.75);
  box-shadow: 0 18px 60px rgba(15, 23, 42, .12);
  border: 1px solid rgba(37, 99, 235, .12);
}

html.page-loading .page-loader-logo {
  display: flex;
  align-items: center;
  gap: 7px;
  animation: pageLoaderLogoIn .5s cubic-bezier(.16,1,.3,1) both;
}

html.page-loading .page-loader-mark {
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -1px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 1;
  animation: pageLoaderPulse 1.6s ease-in-out infinite;
}

html.page-loading .page-loader-sub {
  font-size: 1.1rem;
  color: var(--primary);
  font-weight: 700;
  white-space: nowrap;
  letter-spacing: 1px;
  animation: pageLoaderPulse 1.6s ease-in-out infinite .15s;
}

html.page-loading .page-loader-spinner {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 3px solid rgba(37, 99, 235, .12);
  border-top-color: var(--primary);
  animation: pageLoaderSpin .7s linear infinite;
}

html.page-loading .page-loader-text {
  font-size: .85rem;
  color: var(--text-l);
  font-weight: 600;
  letter-spacing: .04em;
}

html.page-loaded .page-loader {
  position: fixed;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .3s ease, visibility 0s linear .3s;
}

@keyframes pageLoaderSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes pageLoaderLogoIn {
  from { opacity: 0; transform: scale(.8) translateY(6px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes pageLoaderPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .65; transform: scale(.97); }
}

/* ===== Cart Summary Clean Override ===== */
.page-cart .main-content {
  padding-bottom: 160px !important;
}
/* PayPal 付款模式表单较短，减少底部间距 */
.page-cart .main-content:has(.modern-cart-form.payway-paypal) {
  padding-bottom: 80px !important;
}

.page-cart .modern-cart-form .of-inner > table {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
}

.page-cart .modern-cart-form .of-inner > table td {
  background: transparent !important;
}

.page-cart .main-content td[align="right"] {
  padding: 0 !important;
  background: transparent !important;
  vertical-align: top !important;
}

/* 購物車表格標題行強制垂直置中（避免被上方 align="right" 覆蓋） */
.page-cart .main-content table.grid tr.title td[align="right"] {
  vertical-align: middle !important;
}

/* 購物車表格資料行價格列強制垂直置中 */
.page-cart .main-content table.grid tr td[align="right"] {
  vertical-align: middle !important;
}

/* 購物車表格 hover 時，價格列（align="right"）也要統一變色 */
.page-cart .main-content table.grid tr:hover td[align="right"] {
  background: #f8fafc !important;
}

/* cart 表單寬度與上方購物車表格總計對齊 */
.page-cart .main-content form.order-form.modern-cart-form {
  width: 100% !important;
  max-width: 1000px !important;
  margin: 0 auto 18px !important;
  padding: 0 !important;
}

/* 隱藏購物車總計內層 table 的空白第一欄，讓總計區填滿寬度 */
.page-cart .main-content > table:first-child table[width="100%"] > tbody > tr > td:first-child:empty {
  display: none !important;
}

/* 購物車總計區填滿 100% 寬度（只針對包含 cart-summary 的 td，避免影響商品列表的價格列） */
.page-cart .main-content td[align="right"]:has(> div.cart-summary) {
  width: 100% !important;
}

.page-cart .main-content td[align="right"] > div.cart-summary {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.page-cart .main-content td[align="right"] > div.cart-summary,
.page-cart .main-content div[align="right"].cart-summary {
  display: block !important;
  width: min(100%, 1000px) !important;
  margin: 0 auto !important;
  padding: 4px 12px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 28px rgba(15,23,42,.08) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.page-cart .main-content > table:first-child,
.page-cart .main-content table[width="100%"]:first-of-type {
  width: 100% !important;
  max-width: 1000px !important;
  margin: 0 auto 18px !important;
}

.page-cart .main-content td[align="right"] > div.cart-summary::before,
.page-cart .main-content div[align="right"].cart-summary::before {
  content: '\8cfc\7269\8eca\5408\8a08' !important;
  display: block !important;
  margin-bottom: 4px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  color: #475569 !important;
}

.page-cart .main-content td[align="right"] > div > font,
.page-cart .main-content div[align="right"] > font,
.page-cart .main-content td[align="right"] > div > div,
.page-cart .main-content div[align="right"] > div {
  font-size: 14px !important;
  line-height: 1.35 !important;
}

.page-cart .main-content td[align="right"] > div font[color="Brown"],
.page-cart .main-content div[align="right"] font[color="Brown"] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-right: 8px !important;
  padding: 4px 10px !important;
  background: #fff7ed !important;
  color: #9a3412 !important;
  border-radius: 999px !important;
}

.page-cart .main-content td[align="right"] > div font[color="blue"],
.page-cart .main-content div[align="right"] font[color="blue"] {
  color: #1d4ed8 !important;
  font-weight: 600 !important;
}

/* 購物車總計新排版 */
.page-cart .main-content td[align="right"] > div.cart-summary {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  min-width: 0;
  padding: 4px 12px;
  background: #ffffff !important;
  border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,.08) !important;
  border: 1px solid #e2e8f0 !important;
  margin: 0 !important;
}

.page-cart .main-content td[align="right"] > div.cart-summary::before {
  text-align: right;
  margin-bottom: 2px;
  padding-bottom: 2px;
  border-bottom: 1px solid #e2e8f0;
}

.cart-summary-row,
.cart-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 2px 0;
  border-bottom: 1px solid #f1f5f9;
  font-size: 14px;
  line-height: 1.3;
}

.cart-summary-row:last-of-type {
  border-bottom: none;
}

.cart-summary-total {
  border-top: 2px solid #e2e8f0;
  border-bottom: none;
  margin-top: 1px;
  padding-top: 4px;
  font-weight: 700;
  font-size: 15px;
}

.cart-summary-label {
  color: #64748b;
  text-align: left;
  white-space: nowrap;
}

.cart-summary-value {
  color: #334155;
  text-align: right;
  white-space: nowrap;
}

.cart-summary-value font[color="red"] {
  color: #dc2626 !important;
  font-size: 14px !important;
  font-variant-numeric: tabular-nums;
}

.cart-summary-total font[color="red"] {
  color: #dc2626 !important;
  font-size: 16px !important;
  font-variant-numeric: tabular-nums;
}

/* 購物車折扣提示 - 綠色膠囊標籤 */
.cart-discount-hint {
  margin: 2px 0 6px 0;
  padding: 0;
  background: transparent;
  border-left: none;
  border-radius: 0;
  text-align: right;
}
.cart-discount-hint .cart-discount-text {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f0fdf4;
  color: #15803d;
  border: 1px solid #bbf7d0;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

.cart-blue-label {
  display: inline-block;
  text-align: center;
  background: #dbeafe;
  color: #1d4ed8;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 13px;
  font-family: var(--font);
  font-weight: 600;
  margin: 0 2px;
  vertical-align: middle;
}

.cart-discount-hint .cart-discount-amount,
.cart-discount-hint .cart-discount-save {
  color: #15803d;
  font-weight: 700;
}

@media (max-width: 768px) {
  .cart-discount-hint {
    text-align: right;
    font-size: 13px;
    padding: 6px 10px;
  }
}

/* 購物車滿額進度提示 - 未達標藍色提示條 */
.cart-progress-hint {
  margin: 2px 0 6px 0;
  padding: 0;
  background: transparent;
  border: none;
  text-align: right;
}
.cart-progress-hint .cart-progress-text {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #eff6ff;
  color: #2563eb;
  border: 1px solid #bfdbfe;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}
@media (max-width: 768px) {
  .cart-progress-hint .cart-progress-text {
    font-size: 12px;
    padding: 5px 10px;
    gap: 8px;
    white-space: normal;
  }
}

/* 購物車促銷提示 */
.cart-promo-hint {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 18px auto 0;
  padding: 12px 24px;
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  border: 1.5px solid #fbbf24;
  border-radius: 12px;
  color: #78350f;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  box-shadow: 0 4px 12px rgba(251, 191, 36, .12);
  text-align: center;
  max-width: 90%;
}

.cart-promo-hint .cart-promo-icon {
  font-size: 20px;
  line-height: 1;
  flex-shrink: 0;
}

.cart-promo-hint .cart-promo-text {
  display: inline;
}

.cart-promo-hint .cart-promo-price {
  color: #dc2626;
  font-weight: 700;
  font-size: 16px;
}

.cart-promo-hint .cart-promo-highlight {
  color: #1d4ed8;
  font-style: normal;
  font-weight: 600;
  background: #dbeafe;
  padding: 2px 8px;
  border-radius: 4px;
  margin: 0 2px;
}

@media (max-width: 768px) {
  .cart-promo-hint {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    font-size: 14px;
    margin: 14px 10px 0;
    text-align: left;
    max-width: none;
  }
  .cart-promo-hint .cart-promo-price {
    font-size: 15px;
  }
}

.page-cart .main-content td[align="right"] > div.cart-summary #amount_disk,
.page-cart .main-content td[align="right"] > div.cart-summary #amount_total {
  font-size: 16px !important;
  font-weight: 700 !important;
}

.page-cart .main-content td[align="right"] > div #amount_disk,
.page-cart .main-content div[align="right"] #amount_disk {
  display: inline-block !important;
  margin-left: 4px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}

.page-cart .main-content td[align="right"] > div #amount_ems,
.page-cart .main-content div[align="right"] #amount_ems,
.page-cart .main-content td[align="right"] > div #amount_mj,
.page-cart .main-content div[align="right"] #amount_mj,
.page-cart .main-content td[align="right"] > div #amount_sm,
.page-cart .main-content div[align="right"] #amount_sm,
.page-cart .main-content td[align="right"] > div #amount_ol,
.page-cart .main-content div[align="right"] #amount_ol,
.page-cart .main-content td[align="right"] > div #amount_pp,
.page-cart .main-content div[align="right"] #amount_pp,
.page-cart .main-content td[align="right"] > div #amount_hd_item,
.page-cart .main-content div[align="right"] #amount_hd_item {
  margin-top: 4px !important;
}

.page-cart #amount_total_caption {
  display: inline-block !important;
  margin-top: 12px !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #1d4ed8, #4f46e5) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.page-cart #amount_total {
  display: inline-block !important;
  margin-top: 12px !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  color: #dc2626 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.8) !important;
}

.page-cart .main-content td[align="right"] > div hr,
.page-cart .main-content div[align="right"] hr {
  border: 0 !important;
  border-top: 1px solid rgba(226,232,240,.9) !important;
  margin: 14px 0 !important;
}

body.page-cart .main-content .order-form {
  max-width: 760px;
  margin: 0 auto 24px;
  font-family: var(--font);
}

body.page-cart .main-content .order-form > .of-inner,
body.page-cart .main-content .order-form > table {
  width: 100%;
}

body.page-cart .main-content .order-form > .of-inner > table,
body.page-cart .main-content .order-form > table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 18px !important;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .08) !important;
}

body.page-cart .main-content .order-form > .of-inner > table tr,
body.page-cart .main-content .order-form > table tr {
  display: grid;
  grid-template-columns: 128px minmax(0, 400px) minmax(0, 1fr);
  align-items: center;
  gap: 0;
  border-bottom: 1px solid #eef2f7;
  min-height: 56px;
}

/* 覆蓋 .modern-cart-form 的 radio 行 grid，與其他欄位對齊；第三列 auto 讓提示文字緊貼 radio 框位 */
body.page-cart .main-content .order-form > .of-inner > table tr.radio-row,
body.page-cart .main-content .order-form > table tr.radio-row,
body.page-cart .main-content .order-form > .of-inner > table tr:has(input[type="radio"]),
body.page-cart .main-content .order-form > table tr:has(input[type="radio"]) {
    grid-template-columns: 128px minmax(0, 400px) auto !important;
    align-items: start;
}

/* colspan=2 正確跨列（地址、備註） */
body.page-cart .main-content .order-form td[colspan="2"] {
    grid-column: 2 / -1;
}

/* 備註欄位使用 2 列佈局 */
body.page-cart .main-content .order-form tr:has(textarea[name="memo"]) {
    grid-template-columns: 128px minmax(0, 1fr) !important;
}
body.page-cart .main-content .order-form tr:has(textarea[name="memo"]) td[colspan="2"] {
    grid-column: 2 / -1;
}
body.page-cart .main-content .order-form tr:has(textarea[name="memo"]) textarea {
    max-width: 500px !important;
}

body.page-cart .main-content .order-form > .of-inner > table td,
body.page-cart .main-content .order-form > table td {
  padding: 12px 16px !important;
  border: none !important;
  background: transparent !important;
  vertical-align: middle !important;
  box-sizing: border-box;
}

body.page-cart .main-content .order-form > .of-inner > table td:first-child,
body.page-cart .main-content .order-form > table td:first-child {
  width: 128px;
  font-weight: 700 !important;
  color: #334155 !important;
  font-size: 15px !important;
  text-align: right !important;
  white-space: nowrap;
  padding-right: 10px !important;
}

/* radio 行提示文字靠左、垂直置中 */
body.page-cart .main-content .order-form > .of-inner > table tr.radio-row td:nth-child(3),
body.page-cart .main-content .order-form > table tr.radio-row td:nth-child(3),
body.page-cart .main-content .order-form > .of-inner > table tr:has(input[type="radio"]) td:nth-child(3),
body.page-cart .main-content .order-form > table tr:has(input[type="radio"]) td:nth-child(3) {
  padding-left: 2px !important;
  text-align: left !important;
  align-self: center;
  max-width: 260px;
}

body.page-cart .main-content .order-form > .of-inner > table td:nth-child(3),
body.page-cart .main-content .order-form > table td:nth-child(3) {
  padding-left: 8px !important;
  font-size: 14px !important;
  color: var(--text-l) !important;
  line-height: 1.5;
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
  text-align: left !important;
}

/* 簡單欄位（姓名/E-Mail/手機/驗證碼等）：桌面版 3 列，提示字在右邊 */
body.page-cart .main-content .order-form > .of-inner > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)),
body.page-cart .main-content .order-form > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)) {
  grid-template-columns: 128px minmax(0, 320px) minmax(0, 1fr);
}

/* 窄螢幕（第三列太擠）→ 2 列，全部提示字移到輸入框下方對齊（排除驗證碼行） */
@media(max-width:1030px) {
  body.page-cart .main-content .order-form > .of-inner > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)),
  body.page-cart .main-content .order-form > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)) {
    grid-template-columns: 128px minmax(0, 320px);
  }
  body.page-cart .main-content .order-form > .of-inner > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)) > td:nth-child(3),
  body.page-cart .main-content .order-form > table tr:not(:has(input[type="radio"])):not(:has(td[colspan])):not(:has(textarea)):not(:has(td:nth-child(3) a img)) > td:nth-child(3) {
    grid-column: 2;
    align-self: start;
    padding-left: 1em !important;
    padding-top: 0;
    margin-top: -8px;
    font-size: 13px !important;
    max-width: 320px !important;
  }
  /* radio 行也切 2 列，提示字移到 radio 標籤下方 */
  body.page-cart .main-content .order-form > .of-inner > table tr.radio-row,
  body.page-cart .main-content .order-form > table tr.radio-row,
  body.page-cart .main-content .order-form > .of-inner > table tr:has(input[type="radio"]),
  body.page-cart .main-content .order-form > table tr:has(input[type="radio"]) {
    grid-template-columns: 128px auto !important;
  }
  body.page-cart .main-content .order-form > .of-inner > table tr.radio-row > td:nth-child(3),
  body.page-cart .main-content .order-form > table tr.radio-row > td:nth-child(3),
  body.page-cart .main-content .order-form > .of-inner > table tr:has(input[type="radio"]) > td:nth-child(3),
  body.page-cart .main-content .order-form > table tr:has(input[type="radio"]) > td:nth-child(3) {
    grid-column: 2;
    align-self: start;
    padding-left: 1em !important;
    padding-top: 2px;
    margin-top: -6px;
    font-size: 13px !important;
    text-align: left !important;
  }
}

/* 驗證碼行：窄輸入框 + 圖片始終固定在右邊，不受 2 列切換影響 */
body.page-cart .main-content .order-form > .of-inner > table tr:has(td:nth-child(3) a img),
body.page-cart .main-content .order-form > table tr:has(td:nth-child(3) a img) {
  grid-template-columns: 128px 120px auto !important;
}
body.page-cart .main-content .order-form > .of-inner > table tr:has(td:nth-child(3) a img) input,
body.page-cart .main-content .order-form > table tr:has(td:nth-child(3) a img) input {
  max-width: 120px !important;
}

body.page-cart .main-content .order-form input[type="text"],
body.page-cart .main-content .order-form input[type="email"],
body.page-cart .main-content .order-form input:not([type]),
body.page-cart .main-content .order-form select,
body.page-cart .main-content .order-form textarea {
  width: 100% !important;
  max-width: 400px;
  padding: 8px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  font-family: var(--font);
  font-size: 14px;
  color: var(--text);
  background: #fff;
  line-height: 1.5;
  box-sizing: border-box;
  transition: all .2s ease;
}

body.page-cart .main-content .order-form input[type="text"]:focus,
body.page-cart .main-content .order-form input[type="email"]:focus,
body.page-cart .main-content .order-form input:not([type]):focus,
body.page-cart .main-content .order-form select:focus,
body.page-cart .main-content .order-form textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

body.page-cart .main-content .order-form input[type="submit"] {
  padding: 10px 36px !important;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-d) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  max-width: none !important;
  width: auto !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, .2);
}

body.page-cart .main-content .order-form tr:last-child td {
  padding-top: 14px !important;
  padding-bottom: 18px !important;
}

body.page-cart .main-content .order-form tr:last-child td:nth-child(2) {
  text-align: left;
}

body.page-cart .main-content .order-form #addr_zip {
  width: 60px !important;
  max-width: 60px !important;
  text-align: center;
  color: #64748b;
  background: #f8fafc;
  display: inline-block;
  margin-right: 4px;
}

body.page-cart .main-content .order-form #addr_county,
body.page-cart .main-content .order-form #addr_zone {
  width: auto !important;
  max-width: 160px !important;
  display: inline-block;
  margin-right: 4px;
}

/* 超商取貨時隱藏郵遞區號/縣市/地區（桌面版） */
body.page-cart .main-content .order-form.payway-supermarket .cart-addr-inline #addr_zip,
body.page-cart .main-content .order-form.payway-supermarket .cart-addr-inline #addr_county,
body.page-cart .main-content .order-form.payway-supermarket .cart-addr-inline #addr_zone {
  display: none !important;
}

body.page-cart .main-content .order-form #addr_info {
  max-width: 500px !important;
  width: 100% !important;
  margin-top: 6px;
}

body.page-cart .main-content .order-form #ex_addr {
  display: block;
  margin-top: 8px;
  background: #fff1f2;
  border: 2px solid #fb7185;
  border-radius: 10px;
  padding: 8px 12px;
  box-shadow: 0 4px 14px rgba(244, 63, 94, .12);
}

body.page-cart .main-content .order-form .g-recaptcha {
  transform: scale(.96);
  transform-origin: left top;
}

@media (max-width: 768px) {
  body.page-cart .main-content .order-form,
  body.page-cart .main-content form.order-form.modern-cart-form {
    max-width: 100% !important;
    width: 100% !important;
  }

  body.page-cart .main-content > table:first-child,
  body.page-cart .main-content table[width="100%"]:first-of-type {
    max-width: 100% !important;
    width: 100% !important;
  }

  body.page-cart .main-content .order-form > .of-inner > table,
  body.page-cart .main-content .order-form > table {
    display: flex !important;
    flex-wrap: wrap;
  }

  body.page-cart .main-content .order-form > .of-inner > table tr,
  body.page-cart .main-content .order-form > table tr {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    grid-template-columns: none !important;
  }

  body.page-cart .main-content .order-form > .of-inner > table td:first-child,
  body.page-cart .main-content .order-form > table td:first-child {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 1 !important;
    text-align: left !important;
    padding: 8px 12px 4px !important;
    font-weight: 600;
    color: var(--text);
  }

  body.page-cart .main-content .order-form > .of-inner > table td:nth-child(3),
  body.page-cart .main-content .order-form > table td:nth-child(3) {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 2 !important;
    display: block !important;
    padding: 0 12px 4px !important;
    font-size: 14px !important;
    color: var(--text-l) !important;
    text-align: left !important;
    white-space: normal !important;
  }

  body.page-cart .main-content .order-form > .of-inner > table td:nth-child(2),
  body.page-cart .main-content .order-form > table td:nth-child(2) {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 3 !important;
    padding: 0 12px 8px !important;
  }

  body.page-cart .main-content .order-form td[colspan="2"] {
    flex: 0 0 100% !important;
    width: 100% !important;
    order: 3 !important;
    grid-column: auto !important;
    padding: 0 12px 8px !important;
  }

  /* 所有輸入欄位手機版：強制 100% 寬度，覆蓋 max-width:400px */
  body.page-cart .main-content .order-form > .of-inner > table select,
  body.page-cart .main-content .order-form > .of-inner > table input[type="text"],
  body.page-cart .main-content .order-form > .of-inner > table input[type="email"],
  body.page-cart .main-content .order-form > .of-inner > table input[type="tel"],
  body.page-cart .main-content .order-form > .of-inner > table input:not([type]),
  body.page-cart .main-content .order-form > .of-inner > table textarea,
  body.page-cart .main-content .order-form > table select,
  body.page-cart .main-content .order-form > table input[type="text"],
  body.page-cart .main-content .order-form > table input[type="email"],
  body.page-cart .main-content .order-form > table input[type="tel"],
  body.page-cart .main-content .order-form > table input:not([type]),
  body.page-cart .main-content .order-form > table textarea {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 防止表單整體水平溢出 */
  body.page-cart .main-content .order-form,
  .modern-cart-form .of-inner {
    overflow-x: hidden;
  }

  /* 購物車商品列表：手機版改為 auto layout，避免 <nobr> 撐爆欄寬 */
  body.page-cart .main-content table.grid {
    table-layout: auto !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  body.page-cart .main-content table.grid nobr,
  body.page-cart .main-content table.grid tr td nobr {
    white-space: normal !important;
  }
  body.page-cart .main-content table.grid tr td,
  body.page-cart .main-content table.grid tr.title td {
    padding: 8px 6px !important;
  }
  body.page-cart .main-content table.grid tr td:nth-child(3),
  body.page-cart .main-content table.grid tr.title td:nth-child(3) {
    display: none !important;
  }
  body.page-cart .main-content table.grid tr td:first-child,
  body.page-cart .main-content table.grid tr.title td:first-child {
    display: none !important;
  }
  body.page-cart .main-content table.grid tr td:nth-child(2),
  body.page-cart .main-content table.grid tr.title td:nth-child(2) {
    width: 100% !important;
    min-width: 0 !important;
  }
  body.page-cart .main-content table.grid tr td:nth-child(4),
  body.page-cart .main-content table.grid tr.title td:nth-child(4) {
    width: auto !important;
    min-width: 55px !important;
    max-width: 70px !important;
    text-align: right !important;
  }
  body.page-cart .main-content table.grid tr td:nth-child(5),
  body.page-cart .main-content table.grid tr.title td:nth-child(5) {
    width: 60px !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  body.page-cart .main-content table.grid .cart-title {
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    font-size: 13px !important;
  }

  /* 手機版隱藏商品表頭「商品」二字，改為簡稱，避免排版撐爆 */
  body.page-cart .main-content table.grid tr.title td:nth-child(2),
  body.page-cart .main-content table.grid tr.title td:nth-child(4) {
    font-size: 0 !important;
    text-align: center !important;
  }
  body.page-cart .main-content table.grid tr.title td:nth-child(2)::before {
    content: "名稱";
    font-size: 12px;
    font-weight: 600;
    color: var(--text);
  }
  body.page-cart .main-content table.grid tr.title td:nth-child(4)::before {
    content: "價格";
    font-size: 12px;
    font-weight: 600;
    color: var(--text);
  }

  /* 購物車總計：手機版避免 value 被撐出畫面 */
  body.page-cart .main-content td[align="right"] > div.cart-summary,
  body.page-cart .main-content div[align="right"].cart-summary {
    padding: 4px 8px !important;
  }
  body.page-cart .main-content .cart-summary-row,
  body.page-cart .main-content .cart-summary-total {
    flex-wrap: nowrap !important;
    align-items: flex-end !important;
    gap: 8px !important;
    padding: 6px 0 !important;
  }
  body.page-cart .main-content .cart-summary-label {
    text-align: left !important;
    flex: 1 1 auto !important;
    white-space: normal !important;
    word-break: break-word !important;
    min-width: 0 !important;
  }
  body.page-cart .main-content .cart-summary-value {
    text-align: right !important;
    flex: 0 0 auto !important;
    white-space: normal !important;
    word-break: break-word !important;
    min-width: 0 !important;
  }
  body.page-cart .main-content .cart-summary-total > span:first-child {
    text-align: left !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    min-width: 0 !important;
  }
  body.page-cart .main-content .cart-summary-total > span:last-child {
    text-align: right !important;
    flex: 0 0 auto !important;
    white-space: normal !important;
    word-break: break-word !important;
    min-width: 0 !important;
  }
  body.page-cart .main-content .cart-summary-row .cart-special-label,
  body.page-cart .main-content .cart-summary-row .cart-blue-label {
    font-size: 12px !important;
    padding: 1px 4px !important;
  }
  body.page-cart .main-content .cart-discount-hint {
    text-align: right !important;
    font-size: 12px !important;
  }
}

/* 超窄螢幕 (≤480px)：reCAPTCHA 縮小 + 按鈕垂直堆疊 */
@media (max-width: 480px) {
  body.page-cart .main-content .order-form .g-recaptcha,
  .modern-cart-form .g-recaptcha {
    transform: scale(0.82);
    transform-origin: left top;
    margin-bottom: -10px;
  }

  .modern-cart-form input[type="submit"],
  .modern-cart-form input[type="reset"] {
    display: block !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-bottom: 8px;
    text-align: center;
  }
}

/* ===== Question Confirm Modal Content Preview ===== */
/* Question Confirm Overlay — full-field modal */
.question-confirm-overlay .cc-box {
  max-width: 520px;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}
.question-confirm-overlay .qc-scroll-area {
  max-height: calc(90vh - 180px);
  overflow-y: auto;
  padding-right: 8px;
  margin-right: -4px;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.question-confirm-overlay .qc-scroll-area::-webkit-scrollbar { width: 6px; }
.question-confirm-overlay .qc-scroll-area::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }
.question-confirm-overlay .qc-scroll-area::-webkit-scrollbar-track { background: transparent; }
.question-confirm-overlay .qc-content-preview { margin-top: 14px; }
.question-confirm-overlay .qc-content-label { font-size: 14px; color: #64748b; margin-bottom: 8px; font-weight: 500; }
.question-confirm-overlay .qc-content-text { font-size: 14px; color: #1e293b; line-height: 1.6; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 12px; max-height: 240px; overflow-y: auto; word-break: break-word; white-space: pre-wrap; }
.question-confirm-overlay .qc-value-order { font-weight: 600; color: #1e293b; }
.question-confirm-overlay .cc-actions { flex-shrink: 0; margin-top: 16px; }
@media (max-width: 480px) {
  .question-confirm-overlay .cc-box { max-height: 95vh; }
  .question-confirm-overlay .qc-scroll-area { max-height: calc(95vh - 160px); }
  .question-confirm-overlay .qc-content-text { max-height: 180px; padding: 10px; font-size: 13px; }
}


.page-cart .main-content a[onclick*="cart_clear"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 8px 12px 0 !important;
  text-decoration: none !important;
}

.page-cart .main-content a[href*="history.go(-1)"]::before,
.page-cart .main-content a[onclick*="cart_clear"]::before {
  min-width: 132px !important;
  padding: 12px 24px !important;
  border-radius: 999px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  box-shadow: 0 10px 24px rgba(37,99,235,.18) !important;
}

.page-cart .main-content a[href*="history.go(-1)"]::before {
  content: '← 繼續購物' !important;
}

.page-cart .main-content a[onclick*="cart_clear"]::before {
  content: '清空購物車' !important;
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
}

.page-cart .main-content a[onclick*="cart_clear"]:hover::before {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
}

/* Cart 清空購物車按鈕 */
.cart-clear-bar {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 10px;
}

.cart-clear-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: #dc2626;
  background: #fef2f2;
  border: 1.5px solid #fecaca;
  cursor: pointer;
  transition: all .15s ease;
  line-height: 1;
}

.cart-clear-btn::before {
  content: '\2715';
  font-size: 14px;
  line-height: 1;
}

.cart-clear-btn:hover {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 12px rgba(220, 38, 38, .3);
  transform: translateY(-1px);
}

/* Cart 清空 Header 按鈕 (方案B 灰色細邊框) — 低調版 v1130 */
.cart-clear-btn--header {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1;
  color: #6b7280;
  background: transparent;
  border: 1px solid #d1d5db;
  cursor: pointer;
  white-space: nowrap;
  transition: all .15s ease;
  position: relative;
  right: 24px;
}
.cart-clear-btn--header::before {
  content: none;
}
.cart-clear-btn--header:hover {
  background: #fef2f2;
  color: #dc2626;
  border-color: #dc2626;
  transform: none;
  box-shadow: none;
}
@media(min-width:769px){
  .cart-clear-btn--header{ right: 42px; }
  .cart-th-name{ text-align:center !important; }
}

/* Cart 移除確認 Modal */
.cart-remove-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.cart-remove-modal.active {
  display: flex;
}

.cart-remove-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .55);
  backdrop-filter: blur(4px);
}

.cart-remove-modal-box {
  position: relative;
  background: #fff;
  border-radius: 16px;
  padding: 28px 32px;
  width: 100%;
  max-width: 400px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .2);
  text-align: center;
  animation: cart-remove-modal-in .2s ease;
}

@keyframes cart-remove-modal-in {
  from {
    opacity: 0;
    transform: translateY(-10px) scale(.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.cart-remove-modal-title {
  font-size: 19px;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 14px;
}

.cart-remove-modal-body {
  font-size: 15px;
  color: #dc2626;
  line-height: 1.7;
  margin-bottom: 26px;
  word-break: break-word;
}

.cart-remove-modal-body #cart-remove-name {
  color: #475569;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.65;
  letter-spacing: .015em;
  word-break: break-word;
}

.cart-remove-modal-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
}

.cart-remove-btn-primary,
.cart-remove-btn-default {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 26px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  border: none;
  transition: all .15s ease;
  line-height: 1;
}

.cart-remove-btn-primary {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  color: #fff;
  box-shadow: 0 4px 12px rgba(220, 38, 38, .25);
}

.cart-remove-btn-primary:hover {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
  color:#fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(220, 38, 38, .35);
}

.cart-remove-btn-default {
  background: #f1f5f9;
  color: #334155;
}

.cart-remove-btn-default:hover {
  background: #e2e8f0;
  color:#334155;
  transform: translateY(-1px);
}

/* Cart remove × button hover */
a.cart-remove-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  text-decoration: none;
  transition: all .15s;
}
a.cart-remove-btn span {
  color: #999;
  font-size: 18px;
  transition: color .15s;
}
a.cart-remove-btn:hover {
  background: #fef2f2;
}
a.cart-remove-btn:hover span {
  color: #dc2626 !important;
}

@media (max-width: 480px) {
  .cart-remove-modal-box {
    padding: 24px 20px;
  }
  .cart-remove-modal-actions {
    flex-direction: column;
  }
  .cart-remove-btn-primary,
  .cart-remove-btn-default {
    width: 100%;
  }
}


/* ===== Question Type Alert Popup ===== */
.q-type-alert-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10002;
  background: rgba(0, 0, 0, .45);
  align-items: center;
  justify-content: center;
}
.q-type-alert-overlay.active {
  display: flex;
}
.q-type-alert-box {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, .18);
  padding: 28px 32px 20px;
  text-align: center;
  max-width: 380px;
  width: 90%;
}
.q-type-alert-icon {
  font-size: 36px;
  color: #f59e0b;
  margin-bottom: 10px;
}
.q-type-alert-text {
  font-size: 1.05rem;
  font-weight: 600;
  color: #374151;
  margin-bottom: 18px;
  line-height: 1.5;
}
.q-type-alert-btn {
  background: #2563eb;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 28px;
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s;
}
.q-type-alert-btn:hover {
  background: #1d4ed8;
}


/* ===== Mini Cart Remove Modal (above cart-dropdown) ===== */
#mini-cart-remove-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10003;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
#mini-cart-remove-modal.active { display: flex; }
#mini-cart-remove-modal .mini-cart-remove-overlay {
  position: absolute; inset: 0; background: rgba(15, 23, 42, .55); backdrop-filter: blur(4px);
}
#mini-cart-remove-modal .mini-cart-remove-box {
  position: relative; background: #fff; border-radius: 16px; padding: 28px 32px;
  width: 100%; max-width: 400px; box-shadow: 0 24px 60px rgba(0, 0, 0, .2);
  text-align: center; animation: cart-remove-modal-in .2s ease;
}
#mini-cart-remove-modal .mini-cart-remove-title {
  font-size: 19px; font-weight: 700; color: #1e293b; margin-bottom: 14px;
}
#mini-cart-remove-modal .mini-cart-remove-body {
  font-size: 15px; color: #dc2626; line-height: 1.7; margin-bottom: 26px; word-break: break-word;
}
#mini-cart-remove-modal .mini-cart-remove-body .mini-cart-remove-name {
  color: #475569; font-weight: 400; font-size: 14px; line-height: 1.65; letter-spacing: .015em; word-break: break-word;
}
#mini-cart-remove-modal .mini-cart-remove-actions {
  display: flex; justify-content: center; gap: 12px;
}
#mini-cart-remove-modal .mini-cart-remove-btn-primary,
#mini-cart-remove-modal .mini-cart-remove-btn-default {
  display: inline-flex; align-items: center; justify-content: center; padding: 11px 26px; border-radius: 10px;
  font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: none; border: none;
  transition: all .15s ease; line-height: 1;
}
#mini-cart-remove-modal .mini-cart-remove-btn-primary {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); color: #fff;
  box-shadow: 0 4px 12px rgba(220, 38, 38, .25);
}
#mini-cart-remove-modal .mini-cart-remove-btn-primary:hover {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%); color:#fff; transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(220, 38, 38, .35);
}
#mini-cart-remove-modal .mini-cart-remove-btn-default {
  background: #f1f5f9; color: #334155;
}
#mini-cart-remove-modal .mini-cart-remove-btn-default:hover {
  background: #e2e8f0; color:#334155; transform: translateY(-1px);
}
@media (max-width: 480px) {
  #mini-cart-remove-modal .mini-cart-remove-box { padding: 24px 20px; }
  #mini-cart-remove-modal .mini-cart-remove-actions { flex-direction: column; }
  #mini-cart-remove-modal .mini-cart-remove-btn-primary,
  #mini-cart-remove-modal .mini-cart-remove-btn-default { width: 100%; }
}
/* ===== Cart Confirm Modal (寄出前確認對話框) ===== */
.cart-confirm-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10004;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.cart-confirm-overlay.active { display: flex; }
.cart-confirm-overlay .cc-backdrop {
  position: absolute; inset: 0; background: rgba(15, 23, 42, .5);
}
.cart-confirm-overlay .cc-box {
  position: relative; background: #fff; border-radius: 16px; padding: 24px 28px;
  width: 100%; max-width: 400px; box-shadow: 0 24px 60px rgba(0, 0, 0, .2);
  animation: cc-in .2s ease;
}
@keyframes cc-in { from { opacity: 0; transform: scale(.95) translateY(8px); } to { opacity: 1; transform: scale(1) translateY(0); } }
.cart-confirm-overlay .cc-title {
  font-size: 18px; font-weight: 700; color: #1e293b; margin-bottom: 16px; text-align: center;
}
.cart-confirm-overlay .cc-row {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 7px 0; font-size: 14px; border-bottom: 1px solid #f1f5f9;
}
.cart-confirm-overlay .cc-row:last-of-type { border-bottom: none; }
.cart-confirm-overlay .cc-label { color: #64748b; flex-shrink: 0; margin-right: 12px; }
.cart-confirm-overlay .cc-value { font-weight: 500; color: #1e293b; text-align: right; word-break: break-all; }
.cart-confirm-overlay .cc-total {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 0 0; margin-top: 6px; border-top: 2px solid #e2e8f0;
  font-size: 18px; font-weight: 700;
}
.cart-confirm-overlay .cc-total .cc-price { color: #dc2626; }
.cart-confirm-overlay .cc-actions {
  display: flex; gap: 12px; margin-top: 20px;
}
.cart-confirm-overlay .cc-btn {
  flex: 1; padding: 12px; border-radius: 10px; font-size: 15px; font-weight: 600;
  cursor: pointer; border: none; transition: all .15s ease; line-height: 1;
}
.cart-confirm-overlay .cc-btn-cancel {
  background: #f1f5f9; color: #334155;
}
.cart-confirm-overlay .cc-btn-cancel:hover {
  background: #e2e8f0; transform: translateY(-1px);
}
.cart-confirm-overlay .cc-btn-submit {
  background: #16a34a; color: #fff; box-shadow: 0 4px 12px rgba(22, 163, 74, .25);
}
.cart-confirm-overlay .cc-btn-submit:hover {
  background: #15803d; transform: translateY(-1px); box-shadow: 0 6px 16px rgba(22, 163, 74, .35);
}
@media (max-width: 480px) {
  .cart-confirm-overlay .cc-box { padding: 20px 18px; }
  .cart-confirm-overlay .cc-actions { flex-direction: column; }
  .cart-confirm-overlay .cc-btn { width: 100%; }
}
/* ===== Order/Question Success Card (提交後確認頁) ===== */
.order-success-card {
  max-width: 640px;
  margin: 20px auto 24px;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(15, 23, 42, .10);
  border: 1px solid rgba(226, 232, 240, .8);
  font-family: var(--font);
  animation: osCardIn .4s cubic-bezier(.16, 1, .3, 1) both;
}

@keyframes osCardIn {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}

/* --- Header --- */
.order-success-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 32px 24px 24px;
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 50%, #bbf7d0 100%);
  border-bottom: 1px solid #e2e8f0;
}

.order-success-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
  color: #fff;
  font-size: 28px;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(34, 197, 94, .25);
  animation: osIconPop .5s cubic-bezier(.34, 1.56, .64, 1) .1s both;
}

@keyframes osIconPop {
  from { opacity: 0; transform: scale(.5); }
  to { opacity: 1; transform: scale(1); }
}

.order-success-title {
  font-size: 1.4rem;
  font-weight: 800;
  color: #15803d;
  letter-spacing: .02em;
  text-align: center;
}

.order-success-subtitle {
  font-size: .9rem;
  color: #4ade80;
  font-weight: 600;
}

/* Compact header variant for question success (icon + title inline) */
.order-success-header.order-success-header--compact {
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 14px;
  padding: 20px 24px;
  text-align: left;
}

.order-success-header--compact .order-success-icon {
  width: 44px;
  height: 44px;
  font-size: 22px;
  box-shadow: 0 6px 18px rgba(34, 197, 94, .22);
  flex-shrink: 0;
  margin-top: 2px;
}

.order-success-header--compact .order-success-title {
  flex: 1;
  text-align: left;
  font-size: 1.05rem;
  line-height: 1.6;
  font-weight: 700;
  max-width: none;
}

/* --- Body (detail rows) --- */
.order-success-body {
  padding: 8px 0;
}

.order-success-row {
  display: flex;
  align-items: flex-start;
  padding: 11px 24px;
  border-bottom: 1px solid #f1f5f9;
  gap: 12px;
  transition: background .15s ease;
}

.order-success-row:hover {
  background: #f8fafc;
}

.order-success-row:last-child {
  border-bottom: none;
}

.order-success-row--stat {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}

.os-stat-line {
  font-size: 14px;
  font-weight: 500;
  color: #1e293b;
  line-height: 1.6;
  white-space: nowrap;
}

.os-label {
  flex: 0 0 100px;
  font-size: 13px;
  font-weight: 700;
  color: #64748b;
  text-align: right;
  line-height: 1.6;
  padding-top: 1px;
}

.os-value {
  flex: 1;
  font-size: 14px;
  color: #1e293b;
  font-weight: 500;
  line-height: 1.6;
  word-break: break-word;
}

.os-highlight {
  color: var(--primary);
  font-weight: 800;
  font-size: 1.1rem;
}

.os-highlight-cod {
  color: #9a3412;
  font-weight: 800;
  font-size: 1.1rem;
}

.os-highlight-paypal {
  color: #1e40af;
  font-weight: 800;
  font-size: 1.1rem;
}

.os-badge {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
}
/* 貨到付款 / 超商取貨付款 */
.os-badge-cod {
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  border: 1px solid #fed7aa;
  color: #9a3412 !important;
}
/* OneDrive雲端下載(PayPal) */
.os-badge-paypal {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border: 1px solid #bfdbfe;
  color: #1e40af !important;
}
/* 舊 os-badge 兼容（如有直接用 class=os-badge 的） */
.os-badge:not(.os-badge-cod):not(.os-badge-paypal) {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-d) 100%);
  color: #fff !important;
  font-weight: 700;
  line-height: 1.6;
  white-space: nowrap;
}

/* --- Total row --- */
.os-total-row {
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%) !important;
  border-bottom: 2px solid #f59e0b !important;
  align-items: center !important;
  gap: 12px;
}

.os-total-row .os-label {
  font-size: 1.1rem;
  font-weight: 800;
  color: #92400e;
}

.os-total-row .os-value {
}

.os-total {
  font-size: 1.6rem !important;
  font-weight: 900 !important;
  color: #d97706 !important;
  letter-spacing: 0.5px;
}

/* --- Content row (for question content / order content) --- */
.os-content-row {
  flex-direction: column;
  gap: 4px;
}

.os-content-row .os-label {
  text-align: left;
  flex: none;
}

.os-content-row .os-value {
  background: #f8fafc;
  border-radius: 8px;
  padding: 10px 14px;
  border: 1px solid #e2e8f0;
}

/* Question content displayed as plain text (no box) */
.os-question-content {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  white-space: pre-wrap;
}

/* --- Notice banner (top of card) --- */
.order-success-notice {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 22px 24px;
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  border-bottom: 1px solid #fed7aa;
}

.order-success-notice--paypal {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border-bottom-color: #bfdbfe;
}

.osn-icon {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #f59e0b;
  color: #fff;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  box-shadow: 0 4px 12px rgba(245, 158, 11, .25);
}

.order-success-notice--paypal .osn-icon {
  background: #3b82f6;
  box-shadow: 0 4px 12px rgba(59, 130, 246, .25);
}

.osn-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.osn-title {
  font-size: 15px;
  font-weight: 800;
  line-height: 1.5;
  color: #9a3412;
}

.order-success-notice--paypal .osn-title {
  color: #1e40af;
}

.osn-text {
  font-size: 13px;
  line-height: 1.7;
  color: #9a3412;
  font-weight: 500;
}

.order-success-notice--paypal .osn-text {
  color: #1e40af;
}

.osn-highlight {
  display: inline;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
  color: #7c2d12;
}

.order-success-notice--paypal .osn-highlight {
  color: #1e3a8a;
}

/* --- Body section title --- */
.order-success-body-title {
  padding: 20px 24px 0;
  font-size: 1.1rem;
  font-weight: 800;
  color: #1e293b;
  display: flex;
  align-items: center;
  gap: 10px;
}

.order-success-body-title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 20px;
  background: linear-gradient(180deg, #3b82f6, #1d4ed8);
  border-radius: 2px;
}

/* --- Order items list (simple text + dashed separator) --- */
.order-success-row--items {
  align-items: center;
}

.order-simple-items {
  flex: 1;
  width: 100%;
  font-size: 13px;
  max-width: 100%;
  padding: 0;
}

.order-simple-item {
  padding: 8px 0;
  border-bottom: 1px dashed #cbd5e1;
  line-height: 1.6;
  color: #334155;
}

.order-simple-item:last-child {
  border-bottom: 1px dashed #cbd5e1;
}

.osi-number,
.osi-title {
  display: inline;
}

.osi-number {
  font-family: "Courier New", monospace;
  font-weight: 700;
  color: #2563eb;
  margin-right: 8px;
}

.osi-title {
  font-weight: 500;
  word-break: break-word;
}

/* --- Hide storage type when PayPal/OneDrive selected (mobile override) --- */
#tr_sendtype.xyz-hide {
  display: none !important;
}

/* --- Footer --- */
.order-success-footer {
  padding: 12px 24px;
  text-align: right;
  font-size: 12px;
  color: #94a3b8;
  border-top: 1px solid #f1f5f9;
  background: #fafbfc;
}

/* --- Mobile responsive --- */
@media (max-width: 640px) {
  .order-success-card {
    margin: 12px 8px;
    border-radius: 14px;
  }

  .order-success-header {
    padding: 24px 16px 18px;
  }

  .order-success-header.order-success-header--compact {
    padding: 14px 16px;
    gap: 12px;
    align-items: flex-start;
  }

  .order-success-header--compact .order-success-icon {
    width: 36px;
    height: 36px;
    font-size: 18px;
    margin-top: 2px;
  }

  .order-success-icon {
    width: 48px;
    height: 48px;
    font-size: 24px;
  }

  .order-success-title {
    font-size: 1rem;
    line-height: 1.55;
  }

  .order-success-header--compact .order-success-title {
    font-size: .95rem;
  }

  .order-success-row {
    flex-direction: column;
    gap: 4px;
    padding: 10px 16px;
  }

  .os-label {
    flex: none;
    text-align: left;
    font-size: 12px;
  }

  .os-value {
    font-size: 13px;
  }

  .os-highlight {
    font-size: 1rem;
  }

  .os-highlight-cod {
    font-size: 1rem;
  }

  .os-highlight-paypal {
    font-size: 1rem;
  }

  .os-total {
    font-size: 1.3rem !important;
  }

  .order-success-notice {
    padding: 16px 16px;
    gap: 12px;
  }

  .osn-icon {
    width: 32px;
    height: 32px;
    font-size: 16px;
  }

  .osn-title {
    font-size: 14px;
  }

  .osn-text {
    font-size: 12px;
  }

  .order-success-body-title {
    padding: 16px 16px 0;
    font-size: 1rem;
  }

  .order-simple-item {
    padding: 8px 0;
  }

  .osi-number {
    display: inline;
  }

  .order-success-row--items {
    flex-direction: column;
    gap: 8px;
  }

  .order-success-row--items .os-label {
    text-align: left;
    flex: none;
  }

  .order-success-footer {
    padding: 10px 16px;
    font-size: 11px;
  }
}

/* =========================================================================
   Read Guide (訂購說明) — modern card-based layout
   ========================================================================= */
.read-guide {
  max-width: 860px;
  margin: 0 auto;
  padding: 8px 0 40px;
}

/* Card grid */
.read-guide-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

@media (min-width: 768px) {
  .read-guide-grid {
    grid-template-columns: 1fr 1fr;
  }
  .read-card--highlight,
  .read-card--warning,
  .read-card--success {
    grid-column: span 2;
  }
  .read-card--full {
    grid-column: span 2;
  }
}

/* Individual cards */
.read-card {
  display: flex;
  gap: 16px;
  padding: 20px 22px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.2s, transform 0.15s;
}

.read-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

/* Numbered badge */
.read-card-num {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
  background: #94a3b8;
}

.read-card--info .read-card-num      { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.read-card--highlight .read-card-num { background: linear-gradient(135deg, #f59e0b, #d97706); }
.read-card--warning .read-card-num   { background: linear-gradient(135deg, #ef4444, #dc2626); }
.read-card--success .read-card-num   { background: linear-gradient(135deg, #22c55e, #16a34a); }
.read-card--onedrive .read-card-num  { background: linear-gradient(135deg, #3b82f6, #1e40af); }

/* Card body */
.read-card-body {
  flex: 1;
  min-width: 0;
}

.read-card-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 8px;
}

.read-card-text {
  font-size: 14px;
  color: #475569;
  line-height: 1.7;
  margin: 0 0 6px;
}

.read-card-text:last-child {
  margin-bottom: 0;
}

/* Inline brand icons for read-card */
.brand-ico {
  display: inline-block;
  width: 18px;
  height: 18px;
  object-fit: contain;
  vertical-align: -3px;
  margin-right: 2px;
}

.read-card-text b {
  color: #1e293b;
}

.read-card-text a {
  color: #2563eb;
  text-decoration: none;
  font-weight: 600;
}

.read-card-text a:hover {
  text-decoration: underline;
}

/* Alert text (warnings within cards) */
.read-card-alert {
  color: #dc2626;
  background: #fef2f2;
  padding: 8px 12px;
  border-radius: 8px;
  border-left: 3px solid #ef4444;
  margin-top: 8px;
}
.read-alert-icon {
  display: inline-block;
  width: 1.1em;
  height: 1.1em;
  vertical-align: -0.18em;
  margin-right: 4px;
  color: #dc2626;
  flex-shrink: 0;
}

/* Card type accents */
.read-card--onedrive {
  border-color: #93c5fd;
  background: linear-gradient(135deg, #eff6ff 0%, #fff 60%);
}

.read-card--highlight {
  border-color: #fde68a;
  background: linear-gradient(135deg, #fffbeb 0%, #fff 60%);
}

.read-card--warning {
  border-color: #fecaca;
  background: linear-gradient(135deg, #fef2f2 0%, #fff 60%);
}

.read-card--success {
  border-color: #bbf7d0;
  background: linear-gradient(135deg, #f0fdf4 0%, #fff 60%);
}

.read-card--contact {
  border-color: #cbd5e1;
  background: linear-gradient(135deg, #f8fafc 0%, #fff 60%);
  justify-content: center;
}

.read-card-body--contact {
  text-align: center;
}

.read-card-text--contact {
  font-size: 15px;
  color: #475569;
  margin: 0;
}

.read-card-text--contact a {
  color: #2563eb;
  text-decoration: none;
  font-weight: 700;
}

.read-card-text--contact a:hover {
  text-decoration: underline;
}

/* Action link in cards */
.read-card-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 8px 16px;
  background: linear-gradient(135deg, #22c55e, #16a34a);
  color: #fff !important;
  font-size: 13px;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: opacity 0.2s, transform 0.15s;
}

.read-card-link:hover {
  opacity: 0.9;
  transform: translateX(2px);
  text-decoration: none;
}

/* Discount table (card #8) */
.read-discount-table {
  margin: 10px 0;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
}

.read-discount-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.read-discount-row:last-child {
  border-bottom: none;
}

.read-discount-threshold {
  font-size: 14px;
  font-weight: 700;
  color: #1e293b;
  min-width: 120px;
}

.read-discount-arrow {
  color: #94a3b8;
  font-size: 1.1rem;
}

.read-discount-amount {
  font-size: 14px;
  font-weight: 700;
  color: #16a34a;
}

.read-discount-row--note {
  background: #fffbeb;
  font-size: 13px;
  color: #92400e;
  justify-content: center;
}

.read-discount-row--note span {
  font-weight: 500;
}

/* Footer */
.read-guide-footer {
  margin-top: 28px;
  padding: 20px 24px;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  text-align: center;
}

.read-guide-footer p {
  margin: 0;
  font-size: 14px;
  color: #64748b;
  line-height: 1.7;
}

.read-guide-footer a {
  color: #2563eb;
  text-decoration: none;
  font-weight: 600;
}

.read-guide-footer a:hover {
  text-decoration: underline;
}

/* Mobile responsive */
@media (max-width: 640px) {
  .read-card {
    padding: 16px 14px;
    gap: 12px;
  }

  .read-card-num {
    width: 30px;
    height: 30px;
    font-size: 0.95rem;
  }

  .read-card-title {
    font-size: 0.95rem;
  }

  .read-card-text {
    font-size: 13px;
  }

  .read-discount-row {
    flex-wrap: wrap;
    padding: 10px 12px;
  }

  .read-discount-threshold {
    min-width: auto;
  }
}

/* mega-menu removed per user request */
.mega-menu-btn,.mega-menu{display:none!important}

/* === iOS Safari 點擊位移預防 v2026070604 === */

/* 1. 移除觸控灰色高亮 — 所有元素 */
*{-webkit-tap-highlight-color:transparent}

/* 2. touch-action — 移除 300ms 點擊延遲，禁用雙擊縮放 */
a,button,input[type="submit"],input[type="button"],input[type="reset"],label,[role="button"],.hdr-search-btn,.cart-btn,.prod-buy,.suggest-item,.search-hot-tag,.cat-toggle,.cat-links a,.hdr-nav-link,.hdr-back,.pagination-wrap a,.pagination-wrap span{touch-action:manipulation}

/* 3. 手機版所有 input/textarea/select font-size ≥ 16px — 防止 iOS 自動放大頁面 */
@media(max-width:768px){
  input[type="text"],input[type="email"],input[type="tel"],input[type="password"],
  input[type="search"],input[type="number"],input[type="url"],input:not([type]),
  textarea,select{
    font-size:16px!important
  }
  /* 搜索框 — 確保 ≥16px */
  .header-bar.search-mode .hdr-search input{font-size:16px!important}
  /* 搜索按鈕文字不需要 16px（是圖示按鈕），但 input 必須 */
  .hdr-search input{font-size:16px!important}
  /* 分頁 select */
  .pagination-wrap select{font-size:16px!important}
}

/* 4. overscroll-behavior — 搜索結果/下拉滾動不連動 body */
.search-suggest,.search-hot,#div_searcher_list,.sidebar,.cat-links{
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch
}

/* 5. body — 防止 iOS 橡皮筋效果 */
body{overscroll-behavior-y:none}

/* 6. GPU 加速 — 固定/sticky 元素防止 iOS 滾動跳動 */
.cart-sticky-total{
  will-change:transform
}
.site-header,.header-bar,.search-suggest,.search-hot{
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden
}

/* 7. iOS input/textarea 預設樣式重置 — 移除圓角和陰影 */
input[type="text"],input[type="email"],input[type="tel"],input[type="password"],
input[type="search"],input[type="number"],input[type="url"],input:not([type]),
textarea{
  -webkit-appearance:none;
  appearance:none
}

/* 8. 防止 iOS focus 自動滾動到 input — body-locked 時禁用 touch-action */
body.body-locked{
  touch-action:none;
  position:fixed;
  width:100%
}
body.body-locked .header-bar,
body.body-locked .hdr-search{
  touch-action:manipulation
}

/* === 桌面版訂購單付款方式標籤佈局 v2026072030 === */
/* 寬度 >1030px 時，付款方式三個標籤排在同一行，提示文字移到標籤下方 */
@media(min-width:1031px){
  body.page-cart .main-content .order-form > .of-inner > table tr:has(#payway_default),
  body.page-cart .main-content .order-form > table tr:has(#payway_default) {
    grid-template-columns: 128px 1fr !important;
    align-items: start !important;
  }
  body.page-cart .main-content .order-form > .of-inner > table tr:has(#payway_default) td:first-child,
  body.page-cart .main-content .order-form > table tr:has(#payway_default) td:first-child {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
    align-self: start;
  }
  body.page-cart .main-content .order-form > .of-inner > table tr:has(#payway_default) td:nth-child(2),
  body.page-cart .main-content .order-form > table tr:has(#payway_default) td:nth-child(2) {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    align-items: center;
  }
  body.page-cart .main-content .order-form > .of-inner > table tr:has(#payway_default) td:nth-child(2) label,
  body.page-cart .main-content .order-form > table tr:has(#payway_default) td:nth-child(2) label {
    flex-shrink: 0;
    white-space: nowrap;
  }
  body.page-cart .main-content .order-form > .of-inner > table tr:has(#payway_default) td:nth-child(3),
  body.page-cart .main-content .order-form > table tr:has(#payway_default) td:nth-child(3) {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    padding-top: 4px !important;
    padding-left: 16px !important;
    align-self: start;
    font-size: 14px !important;
    color: var(--text-l) !important;
    text-align: left !important;
  }
}

/* 9. 搜索建議面板 — iOS 點擊穿透預防 */
.search-suggest.open,.search-hot.open{
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain
}

/* 10. radio label — 防止 iOS 點擊區域問題 */
.modern-cart-form label:has(input[type="radio"]),
.modern-cart-form label.checked{
  touch-action:manipulation;
  -webkit-user-select:none;
  user-select:none
}

/* ===== Member System CSS ===== */
.member-main{
  padding:12px 0 24px;
}
.page-member-auth .member-main{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:32px;
}
.member-card{
  width:auto;
  max-width:1000px;
  margin:0 auto;
  background:var(--surface);
  border-radius:var(--r-lg);
  box-shadow:var(--sh2);
  padding:36px 32px;
}
.member-card.wide{width:auto;max-width:1000px}
.member-card.compact{width:100%;max-width:380px;flex:none}
.page-member-auth .member-card{width:100%;max-width:440px;flex:none}
.member-title{
  font-size:1.5rem;
  font-weight:700;
  color:var(--text);
  margin-bottom:24px;
  text-align:center;
}
.member-form{display:flex;flex-direction:column;gap:18px}
.member-field{display:flex;flex-direction:column;gap:6px}
.member-field label{
  font-size:.9rem;
  font-weight:600;
  color:var(--text);
}
.member-field input,
.member-field select{
  padding:11px 14px;
  border:1.5px solid var(--border);
  border-radius:var(--r);
  font-size:1rem;
  font-family:var(--font);
  color:var(--text);
  background:var(--surface);
  transition:var(--tr);
  width:100%;
}
.member-field input:focus{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
.member-field-short{
  max-width:260px;
}
.member-password-field{
  width:100%;
  max-width:100%;
}
.member-password-field input{
  max-width:100%;
}
.member-password-input-wrap{position:relative;display:flex;align-items:center}
.member-password-input-wrap input{width:100%;padding-right:42px}
.member-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-l);border-radius:50%;padding:0}
.member-eye:hover{background:var(--bg2);color:var(--text)}
.member-eye svg{width:18px;height:18px}
.member-form .ex_validator {
  display:block;
  font-size:14px;
  font-weight:700;
  line-height:1.35;
  color:#dc2626;
  margin-top:6px;
}
.member-form .ex_validator a{
  color:#2563eb;
  text-decoration:underline;
  cursor:pointer;
}
.member-form .ex_validator a:hover{
  color:#1d4ed8;
}
.member-hint{
  display:block;
  font-size:12px;
  color:#9ca3af;
  margin-top:4px;
}
.member-field-name label{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.member-hint-inline{
  font-size:11px;
  color:#c1c5cb;
  font-weight:400;
  margin-left:6px;
  letter-spacing:0.01em;
}
.member-field input:disabled{
  background:#e2e8f0;
  color:#94a3b8;
  cursor:not-allowed;
  border-color:#cbd5e1;
}
.member-field-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.member-checkbox{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:.875rem;
  color:var(--text-l);
  cursor:pointer;
  font-weight:400!important;
}
.member-checkbox input{
  width:16px;
  height:16px;
  accent-color:var(--primary);
}
.member-link{
  font-size:.875rem;
  color:var(--link);
  text-decoration:none;
  transition:var(--tr);
}
.member-link:hover{color:var(--link-h);text-decoration:underline}
.member-req{color:var(--red);font-weight:400}
.member-hint{
  font-size:.8rem;
  color:var(--text-l);
  margin-bottom:-6px;
}
.member-divider{
  height:1px;
  background:var(--border);
  margin:8px 0;
}
/* Member Address */
.member-address-section{margin-top:0}
.member-address-title{font-size:.85rem;font-weight:600;color:#64748b;margin-bottom:16px}
.member-address-block{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.member-address-field{display:flex;flex-direction:column;gap:6px}
.member-address-field label{font-size:.85rem;font-weight:600;color:var(--text)}
.member-address-field select{padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--r);font-size:1rem;font-family:var(--font);color:var(--text);background:var(--surface);cursor:pointer;width:100%}
.member-address-field select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.member-address-field input{padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--r);font-size:1rem;font-family:var(--font);color:var(--text);background:var(--surface);width:100%}
.member-address-field input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
#m_addr_zip{width:80px;text-align:center}
#m_addr_county,#m_addr_zone{width:auto;min-width:130px;max-width:180px}
#m_addr_info{width:100%;min-width:100%}
@media (max-width:480px){
  .member-address-block{flex-direction:column;align-items:stretch}
  #m_addr_zip,#m_addr_county,#m_addr_zone{width:100%;max-width:100%;min-width:100%}
}
.member-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 28px;
  border-radius:var(--r);
  font-size:1rem;
  font-weight:600;
  font-family:var(--font);
  cursor:pointer;
  border:none;
  transition:var(--tr);
  text-decoration:none;
  margin-top:6px;
}
.member-btn-primary{
  background:var(--primary);
  color:#fff;
  box-shadow:0 2px 8px rgba(37,99,235,.3);
}
.member-btn-primary:hover{
  background:var(--primary-d);
  box-shadow:0 4px 16px rgba(37,99,235,.4);
  transform:translateY(-1px);
}
.member-btn-secondary{
  background:var(--surface);
  color:var(--primary);
  border:1.5px solid var(--primary);
}
.member-btn-secondary:hover{
  background:var(--primary);
  color:#fff;
}
.member-alert-ok{
  background:#f0fdf4;
  border:1px solid #bbf7d0;
  color:#15803d;
  padding:12px 16px;
  border-radius:var(--r);
  font-size:.9rem;
  margin-bottom:18px;
  min-height:77px;
}
.member-alert-err{
  background:#fef2f2;
  border:1px solid #fecaca;
  color:#dc2626;
  padding:12px 16px;
  border-radius:var(--r);
  font-size:.9rem;
  margin-bottom:18px;
  min-height:77px;
}
.member-turnstile{
  display:flex;
  justify-content:center;
  margin:8px 0 18px;
}
.member-nav{
  display:flex;
  gap:8px;
  max-width:1000px;
  margin:0 auto 24px;
  flex-wrap:wrap;
  justify-content:center;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  padding:8px;
  box-shadow:0 2px 12px rgba(0,0,0,.06);
}
.member-nav a{
  padding:8px 22px;
  border-radius:24px;
  font-size:.875rem;
  font-weight:600;
  color:#475569;
  text-decoration:none;
  background:#f1f5f9;
  border:1.5px solid transparent;
  transition:var(--tr);
}
.member-nav a:hover{
  background:#e0e7ff;
  color:#3730a3;
}
.member-nav a.active{
  background:linear-gradient(135deg,#2563eb,#3b82f6);
  color:#fff;
  border-color:transparent;
  box-shadow:0 2px 8px rgba(37,99,235,.3);
}
.member-nav a.logout{
  background:#fff1f2;
  color:#dc2626;
  border-color:#fecdd3;
}
.member-nav a.logout:hover{
  background:#ffe4e6;
  color:#b91c1c;
  border-color:#fda4af;
}
.member-nav a.logout.active{
  background:linear-gradient(135deg,#dc2626,#ef4444);
  color:#fff;
  border-color:transparent;
  box-shadow:0 2px 8px rgba(220,38,38,.3);
}
.member-profile-header{
  display:flex;
  align-items:center;
  gap:20px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  padding:24px;
  max-width:1000px;
  margin:0 auto 16px;
}
.member-avatar{
  width:64px;
  height:64px;
  border-radius:50%;
  background:linear-gradient(135deg,#7c3aed,#2563eb);
  color:#fff;
  font-size:26px;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.member-profile-info{
  flex:1;
  min-width:0;
}
.member-profile-name{
  font-size:18px;
  font-weight:600;
  color:#1e293b;
  margin-bottom:4px;
}
.member-profile-email{
  font-size:13px;
  color:#64748b;
  margin-bottom:8px;
}
.member-profile-badges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.member-badge-tag{
  padding:4px 12px;
  border-radius:20px;
  font-size:12px;
  font-weight:500;
}
.member-badge-type{
  background:#f0fdf4;
  color:#15803d;
  border:1px solid #bbf7d0;
}
.member-badge-date{
  background:#eff6ff;
  color:#1d4ed8;
  border:1px solid #bfdbfe;
}
.member-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  max-width:1000px;
  margin:0 auto 16px;
}
.member-stat-item{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:12px;
  padding:16px;
  text-align:center;
}
.member-stat-num{
  font-size:24px;
  font-weight:600;
  color:#2563eb;
  margin-bottom:4px;
  font-variant-numeric:tabular-nums;
}
.member-stat-num.member-stat-pending{
  color:#d97706;
}
.member-stat-num.member-stat-shipped{
  color:#059669;
}
.member-stat-label{
  font-size:13px;
  color:#64748b;
}
.member-recent-orders{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  padding:20px;
  max-width:1000px;
  margin:0 auto 16px;
}
.member-recent-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:16px;
}
.member-recent-title{
  font-size:15px;
  font-weight:600;
  color:#1e293b;
}
.member-recent-link{
  font-size:13px;
  color:#2563eb;
  text-decoration:none;
}
.member-recent-link:hover{
  text-decoration:underline;
}
.member-recent-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px;
  background:#f8fafc;
  border-radius:10px;
  margin-bottom:8px;
}
.member-recent-item:last-child{
  margin-bottom:0;
}
.member-recent-item-left{
  min-width:0;
}
.member-recent-sn{
  font-size:13px;
  font-weight:600;
  color:#1e293b;
  margin-bottom:2px;
}
.member-recent-meta{
  font-size:12px;
  color:#64748b;
}
.member-recent-item-right{
  text-align:right;
  flex-shrink:0;
}
.member-recent-amount{
  font-size:14px;
  font-weight:600;
  color:#1e293b;
  margin-bottom:4px;
  font-variant-numeric:tabular-nums;
}
.member-stat-badge{
  display:inline-block;
  padding:2px 8px;
  border-radius:10px;
  font-size:12px;
  font-weight:500;
}
.member-stat-badge-pending{
  background:#fffbeb;
  color:#d97706;
}
.member-stat-badge-shipped{
  background:#eff6ff;
  color:#2563eb;
}
.member-stat-badge-done{
  background:#f0fdf4;
  color:#059669;
}
.member-form-section{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
}
.member-form-section-icon{
  width:36px;
  height:36px;
  border-radius:10px;
  background:#eff6ff;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#2563eb;
  font-size:16px;
  flex-shrink:0;
}
.member-form-section-title{
  font-size:15px;
  font-weight:600;
  color:#1e293b;
}
.member-form-section-desc{
  font-size:12px;
  color:#64748b;
}
.member-field-row-2col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.member-orders{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.member-order-item{
  border:1.5px solid var(--border);
  border-radius:12px;
  background:var(--surface);
  overflow:hidden;
  transition:var(--tr);
}
.member-order-item:hover{
  border-color:var(--border-strong);
  box-shadow:0 4px 20px rgba(0,0,0,.06);
}
.member-order-main{
  display:flex;
  gap:16px;
  padding:16px 18px;
}
.member-order-icon{
  width:44px;
  height:44px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.3rem;
  flex-shrink:0;
}
.member-order-icon.shipping{background:#eff6ff;color:var(--primary)}
.member-order-icon.digital{background:#f5f3ff;color:#7c3aed}
.member-order-icon.done{background:#f0fdf4;color:#16a34a}
.member-order-body{flex:1;min-width:0}
.member-order-body-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.member-order-sn{
  font-weight:700;
  font-size:.88rem;
  color:var(--text);
}
.member-order-sn-cod{color:#9a3412}
.member-order-sn-paypal{color:#1e40af}
.member-order-date{
  font-size:.78rem;
  color:var(--text-l);
}
.member-badge{
  display:inline-block;
  padding:3px 12px;
  border-radius:20px;
  font-size:.78rem;
  font-weight:600;
  white-space:nowrap;
}
.member-badge-cod{
  background:linear-gradient(135deg,#fff7ed,#ffedd5);
  border:1px solid #fed7aa;
  color:#9a3412;
}
.member-badge-paypal{
  background:linear-gradient(135deg,#eff6ff,#dbeafe);
  border:1px solid #bfdbfe;
  color:#1e40af;
}
.member-order-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 18px;
  background:var(--surface-soft);
  border-top:1px solid var(--border-l);
  gap:10px;
  flex-wrap:wrap;
}
.member-order-footer-left{
  display:flex;
  align-items:center;
  gap:8px;
}
.member-order-footer-right{
  display:flex;
  align-items:center;
  gap:12px;
}
.member-order-total{
  font-size:1.05rem;
  font-weight:700;
  color:var(--red);
  font-variant-numeric:tabular-nums;
}
/* 訂單詳細資訊展開面板 — 方案C */
.member-order-detail{
  max-height:0;
  overflow:hidden;
  opacity:0;
  transition:max-height .35s ease,opacity .3s ease,margin .3s ease,padding .3s ease;
  margin-top:0;
  padding:0 16px;
}
.member-order-detail.open{
  max-height:2000px;
  opacity:1;
  margin-top:12px;
  padding:6px 16px 14px;
}
/* 三段式區塊 */
.mod-block{
  background:var(--surface);
  border:1px solid var(--border-l);
  border-radius:12px;
  padding:16px;
  margin-bottom:12px;
}
.mod-block:last-child{margin-bottom:0}
.mod-block-title{
  font-size:.85rem;
  font-weight:700;
  color:var(--text);
  padding-bottom:10px;
  border-bottom:1px solid var(--border-l);
  margin-bottom:10px;
  text-align:left !important;
}
.mod-block-list{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.mod-block-row{
  display:flex;
  gap:12px;
  align-items:flex-start;
  font-size:.85rem;
  padding:9px 0;
  border-bottom:1px solid var(--border-l);
  line-height:1.5;
}
.mod-block-row:last-child{border-bottom:none}
.mod-block-key{
  color:var(--text-l);
  font-weight:600;
  white-space:nowrap;
  flex-shrink:0;
  min-width:78px;
}
.mod-block-val{
  color:var(--text);
  word-break:break-word;
  flex:0 1 auto;
  line-height:1.5;
}
/* 產品明細標頭 */
.mod-products-header{
  font-size:.75rem;
  font-weight:700;
  color:var(--text-l);
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:8px;
}
/* 產品明細容器 */
.mod-products{
  background:var(--surface-soft);
  border:1px solid var(--border-l);
  border-radius:8px;
  overflow:hidden;
  margin-bottom:14px;
}
/* 儲存類型氣泡 */
.mod-storage-badge{
  display:inline-flex;align-items:center;
  font-size:.75rem;font-weight:600;padding:2px 10px;border-radius:10px;
}
.mod-storage-cd{background:#f5f3ff;color:#6d28d9;border:1px solid #ddd6fe}
.mod-storage-dvd{background:#ecfeff;color:#0e7490;border:1px solid #cffafe}
.mod-storage-dvd9{background:#fef3c7;color:#b45309;border:1px solid #fde68a}
.mod-storage-usb{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe}
/* 每行產品 */
.mod-product-line{
  display:grid;
  grid-template-columns:95px 1fr;
  align-items:baseline;
  gap:4px 12px;
  padding:10px 14px;
  border-bottom:1px dashed var(--border);
  font-size:.85rem;
}
.mod-product-line:last-child{border-bottom:none}
.mod-product-pid{
  font-family:Consolas,monospace;
  font-size:.78rem;
  color:var(--text-l);
  white-space:nowrap;
}
.mod-product-name{
  color:var(--text);
  flex:1;
  min-width:0;
  word-break:break-all;
  overflow-wrap:break-word;
  text-align:left;
  white-space:normal !important;
}
#order_content_display{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
#order_content_display.open{
  display:block !important;
}
.mod-product-qty{
  font-size:.82rem;
  color:var(--text-l);
  white-space:nowrap;
}
/* 碟片統計 */
.member-order-toggle{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:5px 14px;
  font-size:.78rem;
  font-weight:600;
  color:var(--primary);
  background:transparent;
  border:1px solid var(--primary);
  border-radius:20px;
  cursor:pointer;
  transition:all .2s;
  white-space:nowrap;
}
.member-order-toggle:hover{
  background:var(--primary);
  color:#fff;
}
/* 碟片統計 */
.mod-disc-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  flex-wrap:wrap;
  padding:12px 14px;
  background:var(--surface-soft);
  border:1px solid var(--border-l);
  border-radius:8px;
  font-size:.82rem;
  color:var(--text);
  width:100%;
  box-sizing:border-box;
}
.mod-disc-summary .mod-disc-total{
  margin-left:auto;
  font-weight:700;
  color:var(--text);
}
.mod-disc-summary .mod-disc-amount{
  font-size:1rem;
  font-weight:700;
  color:var(--red);
  font-variant-numeric:tabular-nums;
}
/* 備註區塊 */
.mod-memo{
  font-size:.85rem;
  color:var(--text);
  padding:10px 14px;
  background:var(--surface-soft);
  border:1px solid var(--border-l);
  border-radius:8px;
  line-height:1.6;
  text-align:left !important;
}
.member-order-status{
  font-size:.8rem;
  color:var(--text-l);
  padding:2px 10px;
  border-radius:6px;
  background:var(--bg2);
}
/* 訂單動態狀態標籤 */
.member-order-status-row{
  margin-bottom:6px;
}
.member-order-dynstat{
  display:inline-block;
  font-size:.78rem;
  font-weight:600;
  padding:3px 12px;
  border-radius:20px;
  letter-spacing:.02em;
}
.member-dynstat-wait{
  color:#b45309;
  background:#fffbeb;
  border:1px solid #fde68a;
}
.member-dynstat-prep{
  color:#be185d;
  background:#fdf2f8;
  border:1px solid #fbcfe8;
}
.member-dynstat-shipped{
  color:#047857;
  background:#ecfdf5;
  border:1px solid #a7f3d0;
}
.member-dynstat-done{
  color:#6b7280;
  background:#f9fafb;
  border:1px solid #e5e7eb;
}
.member-dynstat-onedrive{
  color:#7c3aed;
  background:#f5f3ff;
  border:1px solid #ddd6fe;
}
.member-empty{
  text-align:center;
  color:var(--text-dim);
  padding:48px 16px;
  font-size:1rem;
}
/* Header member buttons */
.hdr-member-link{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:6px 14px;
  border-radius:20px;
  font-size:.82rem;
  font-weight:600;
  color:var(--primary);
  background:rgba(37,99,235,.06);
  text-decoration:none;
  transition:var(--tr);
  white-space:nowrap;
}
.hdr-member-link:hover{
  background:var(--primary);
  color:#fff;
}
.hdr-member-link.hdr-member-logout{
  color:var(--text-l);
  background:var(--bg2);
}
.hdr-member-link.hdr-member-logout:hover{
  background:var(--red);
  color:#fff;
}
/* Mobile */
@media(max-width:1030px){
  .member-card{
    padding:24px 18px;
    margin:0 12px;
  }
  .member-main{
    padding:6px 0 24px;
  }
  .page-member-auth .member-main{
    padding-top:20px
  }
  .member-nav{
    margin:0 12px 20px;
    overflow-x:auto;
    flex-wrap:nowrap;
    -webkit-overflow-scrolling:touch;
    justify-content:center;
    border-radius:14px;
    padding:6px;
  }
  .member-nav a{
    padding:7px 16px;
    font-size:.82rem;
    white-space:nowrap;
  }
  .member-profile-header{
    padding:16px;
    gap:14px;
    margin:0 12px 16px;
  }
  .member-avatar{
    width:52px;
    height:52px;
    font-size:22px;
  }
  .member-profile-name{
    font-size:16px;
  }
  .member-stats{
    gap:8px;
    margin:0 12px 16px;
  }
  .member-stat-item{
    padding:12px 8px;
  }
  .member-stat-num{
    font-size:20px;
  }
  .member-recent-orders{
    padding:16px;
    margin:0 12px 16px;
  }
  .member-recent-item{
    padding:10px;
  }
}
@media(max-width:500px){
  .member-card{
    padding:20px 14px;
    border-radius:var(--r);
  }
  .member-title{font-size:1.25rem}
  .member-field input{font-size:16px!important}
  .member-order-item{border-radius:10px}
  .member-order-main{padding:14px}
  .member-order-body-top{flex-direction:column}
  .member-order-footer{flex-direction:column;align-items:flex-start;gap:8px}
  .member-main{padding:6px 0 24px;
  }
  .mod-block{padding:12px}
  .mod-block-title{font-size:.82rem}
  .mod-block-key{min-width:66px;font-size:.8rem}
  .mod-block-row{font-size:.82rem;gap:8px}
  .mod-product-line{padding:8px 10px;gap:4px 8px}
  .mod-product-name{min-width:80px;font-size:.82rem}
  .mod-product-line{display:grid;grid-template-columns:1fr;gap:2px}
  .mod-product-name{width:100%;flex:none}
  .mod-disc-summary{font-size:.78rem;padding:10px}
  .member-field-row-2col{
    grid-template-columns:1fr;
    gap:0;
  }
  .member-recent-item{
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }
  .member-recent-item-right{
    text-align:left;
  }
  .member-recent-amount{
    display:inline-block;
    margin-right:8px;
  }
}
/* ===== Favorite Heart Button (Product Page) — unified with favorites list ===== */
.disk-fav-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border-radius:999px;
  border:1.5px solid #e2e8f0;
  background:#fff;
  cursor:pointer;
  padding:12px 20px;
  min-height:46px;
  font-size:.88rem;
  font-weight:800;
  color:#475569;
  transition:all .22s ease;
  flex-shrink:0;
  letter-spacing:.03em;
  white-space:nowrap;
}
.disk-fav-btn:hover{
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.disk-fav-btn .fav-icon{
  width:16px;
  height:16px;
  color:#94a3b8;
  transition:all .22s ease;
}
.disk-fav-btn.fav-active{
  background:#fff;
  border-color:#ef4444;
  color:#ef4444;
}
.disk-fav-btn.fav-active .fav-icon{
  color:#ef4444;
  fill:#ef4444;
}
.disk-fav-btn.fav-active:hover{
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
/* ===== Favorites List Page (Member Center) ===== */
.fav-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:20px;
}
.fav-card{
  position:relative;
  border:1px solid #e2e8f0;
  border-radius:12px;
  padding:16px;
  background:#fff;
  transition:all .2s ease;
}
.fav-card:hover{
  border-color:#3b82f6;
  box-shadow:0 2px 12px rgba(59,130,246,.12);
}
.fav-card-link{
  display:block;
  text-decoration:none;
  color:inherit;
}
.fav-card-number{
  font-size:.8rem;
  color:#64748b;
  margin-bottom:6px;
  font-weight:600;
}
.fav-card-title{
  font-size:.92rem;
  color:#0f172a;
  line-height:1.4;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.fav-remove-btn{
  position:absolute;
  top:8px;
  right:8px;
  width:30px;
  height:30px;
  border-radius:50%;
  border:none;
  background:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  transition:all .2s ease;
}
.fav-remove-btn svg{
  width:16px;
  height:16px;
  color:#cbd5e1;
  transition:all .2s ease;
}
.fav-remove-btn:hover{
  background:#fef2f2;
}
.fav-remove-btn:hover svg{
  color:#ef4444;
  fill:#ef4444;
}
@media(max-width:768px){
  .fav-grid{
    grid-template-columns:repeat(2,1fr);
    gap:12px;
  }
  .fav-card{
    padding:12px;
  }
  .fav-card-title{
    font-size:.85rem;
  }
}
.member-favorites-full{width:100%;max-width:1000px;background:transparent;box-shadow:none;border-radius:0;padding:0;margin:0 auto}
.member-favorites-full .addin-cards{width:100%;margin:0}
.member-favorites-full .fav-list-header{margin-top:0;margin-bottom:6px}
.fav-list-header{display:flex;align-items:center;justify-content:space-between;margin-top:12px;margin-bottom:6px}
.fav-count{font-size:13px;color:#64748b;font-weight:500}
.fav-progress-bar{width:100%;height:6px;background:#f1f5f9;border-radius:3px;overflow:hidden;margin-bottom:20px}
.fav-progress-fill{height:100%;background:#3b82f6;border-radius:3px;transition:width .3s ease}
.fav-group{border:0.5px solid #e2e8f0;border-radius:8px;overflow:hidden;margin-bottom:12px;background:#fff}
.fav-group-header{display:flex;align-items:center;gap:8px;padding:10px 14px;background:#f8fafc;border-bottom:0.5px solid #e2e8f0;cursor:pointer;user-select:none;transition:background .15s}
.fav-group-header:hover{background:#f1f5f9}
.fav-group-header.collapsed{border-bottom:none}
.fav-group-arrow{transition:transform .2s ease;flex-shrink:0;color:#64748b}
.fav-group-header.collapsed .fav-group-arrow{transform:rotate(-90deg)}
.fav-group-name{font-size:13px;font-weight:500;color:#1e293b}
.fav-group-count{font-size:11px;color:#fff;background:#3b82f6;padding:1px 8px;border-radius:10px;font-weight:500;flex-shrink:0}
.fav-group-items{display:block}
.fav-group-items.hidden{display:none}
.fav-list-heart{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;background:#fff;border:1.5px solid #ef4444;color:#ef4444;cursor:pointer;padding:0;transition:all .22s ease;box-shadow:none;position:relative;overflow:hidden}
.fav-list-heart:hover{background:#fff;border-color:#ef4444;color:#ef4444;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.fav-list-heart:active{background:#fff;border-color:#ef4444;color:#ef4444;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.fav-list-heart svg{width:17px;height:17px;fill:currentColor;transition:var(--tr)}
.fav-list-more{padding:6px 14px;background:#fafbfc;font-size:11px;color:#94a3b8;cursor:pointer;border-bottom:0.5px solid #f1f5f9}
.fav-list-more:hover{color:#64748b}
@media(max-width:768px){
  .fav-list-heart{width:34px;height:34px;border-radius:10px}
  .disk-fav-btn{padding:8px 14px;min-height:36px;font-size:.78rem}
  .disk-fav-btn .fav-icon{width:14px;height:14px}
  .disk-buy-btn,.disk-buy-btn-secondary{padding:8px 16px;min-height:36px;font-size:.78rem}
  .disk-buy-btn svg,.disk-buy-btn-secondary svg{width:16px;height:16px}
.fav-group-name{font-size:12px}
.fav-group-header{padding:8px 12px}
}

/* ===== 問題單訂單查詢詳情面板（Question Order Query） ===== */
.lch-oq-line{display:flex;gap:8px;font-size:13px;align-items:flex-start;flex-wrap:wrap}
.lch-oq-pid{color:#3b82f6;font-weight:600;flex-shrink:0;width:70px}
.lch-oq-name{color:#334155;flex:1;min-width:0;word-break:break-all;overflow-wrap:anywhere;word-wrap:break-word}
/* 電腦版（>1030px）：訂單編號行與一般行使用相同 grid 佈局，確保標題和欄位對齊 */
@media (min-width: 1031px) {
  body.page-question .main-content .question-form .of-inner > table tr.question-orderid-row,
  body.page-question .main-content .question-form table tr.question-orderid-row{
    display:grid !important;
    grid-template-columns:128px minmax(0,320px) minmax(0,1fr) !important;
    align-items:center !important;
    gap:0 !important;
    min-height:56px
  }
  /* 訂單編號行第三欄：按鈕+提示文字不換行 */
  body.page-question .question-orderid-row td:nth-child(3){
    white-space:nowrap
  }
  /* 訂單查詢按鈕與提示文字間距 */
  body.page-question .question-orderid-row td:nth-child(3) #order_view_btn{
    margin-right:6px
  }
}
  overflow-wrap:anywhere;
}

/* === No orders: hide order-id row (overrides all breakpoints) === */
body.page-question .main-content .question-form .of-inner > table tr.question-orderid-row.lch-no-orders,
body.page-question .main-content .question-form table tr.question-orderid-row.lch-no-orders,
body.page-question .main-content .question-form .of-inner > table tr.question-order-detail-row.lch-no-orders,
body.page-question .main-content .question-form table tr.question-order-detail-row.lch-no-orders{
  display:none !important
}
