/* ============================================================
   手機端底部導覽列（Pinkoi App 版型）
   全站載入：真實商城所有頁面 + /demo/ + /discover/ 靜態頁共用。
   僅在 <=921px 出現；桌面完全不渲染。
   ============================================================ */

:root{
  --tab-bg:#FFFFFF;
  --tab-line:#E7E2D9;
  --tab-ink:#7A858B;
  --tab-active:#EA7F7B;
  --tab-active-ink:#10567B;
}
body.pinkoi-home[data-theme="lacquer"]{
  --tab-bg:#F8F2E6; --tab-line:#D6C5A6; --tab-ink:#8A7A66;
  --tab-active:#9B2C20; --tab-active-ink:#33201A;
}
body.page-demo{
  --tab-bg:#151211; --tab-line:#332A25; --tab-ink:#8A7D72;
  --tab-active:#C8462F; --tab-active-ink:#E8C9A0;
}
body.page-discover{
  --tab-bg:#F8F2E6; --tab-line:#D6C5A6; --tab-ink:#8A7A66;
  --tab-active:#9B2C20; --tab-active-ink:#33201A;
}

.pk-tabbar{display:none}

@media (max-width:921px){
  body,body.pinkoi-home{padding-bottom:calc(62px + env(safe-area-inset-bottom)) !important}
  .pk-tabbar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:80;
    background:var(--tab-bg);
    border-top:1px solid var(--tab-line);
    padding-bottom:env(safe-area-inset-bottom);
    box-shadow:0 -3px 14px rgba(28,43,51,.07);
  }
  .pk-tab{
    flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;height:60px;color:var(--tab-ink);font-size:10px;letter-spacing:.04em;
    text-decoration:none;position:relative;
  }
  .pk-tab svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .pk-tab.on{color:var(--tab-active)}
  .pk-tab.on::before{
    content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
    width:26px;height:2px;background:var(--tab-active);border-radius:0 0 2px 2px;
  }
  .pk-tab-cart-count{
    position:absolute;top:6px;left:calc(50% + 8px);
    min-width:15px;height:15px;border-radius:8px;
    background:var(--tab-active);color:#fff;font-size:9px;line-height:15px;text-align:center;padding:0 3px;
  }
  /* Astra 頁尾在手機上留白，避免被 Tab 蓋住 */
  .site-footer{padding-bottom:12px}
}
