/**
 * Flowee — 手機版（≤767px）與平板直向輔助
 * 電腦／平板橫向由 desktop.css 負責
 */

body.is-mobile .mob-app {
  max-width: 480px;
  margin: 0 auto;
}

body.is-mobile .desk-only { display: none !important; }
body.is-mobile .mob-only { display: revert; }

body.is-mobile #page-booking .wrap,
body.is-mobile #page-member .wrap {
  max-width: 480px;
  margin: 0 auto;
}

/* ══════════════════════════════════════════════
   iPad／平板直向（768–1099，非側欄模式）
   全寬、加大觸控、月曆更疏朗
   ══════════════════════════════════════════════ */
body.is-tablet.is-mobile {
  --tablet-pad: 20px;
  background: #f3f4f6;
}

body.is-tablet.is-mobile .mob-app {
  max-width: none !important;
  width: 100%;
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  box-shadow: none;
}

body.is-tablet.is-mobile .mob-header {
  padding-left: max(16px, env(safe-area-inset-left));
  padding-right: max(16px, env(safe-area-inset-right));
  height: 56px;
}

body.is-tablet.is-mobile .mob-main {
  padding-left: var(--tablet-pad);
  padding-right: var(--tablet-pad);
  max-width: 920px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}

body.is-tablet.is-mobile .mob-nav {
  max-width: none !important;
  left: 0 !important;
  right: 0 !important;
  transform: none !important;
  width: 100% !important;
  height: calc(64px + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

body.is-tablet.is-mobile .mob-nav-item {
  font-size: 11px;
  gap: 4px;
  min-height: 52px;
}

body.is-tablet.is-mobile .mob-nav-ico {
  font-size: 22px;
}

body.is-tablet.is-mobile .mob-cal-grid {
  grid-auto-rows: minmax(96px, auto);
}

body.is-tablet.is-mobile .mob-cal-grid .mob-cal-day {
  min-height: 96px;
  padding: 8px;
}

body.is-tablet.is-mobile .page-feature-overlay,
body.is-tablet.is-mobile .page-overlay {
  max-width: none !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 !important;
}

body.is-tablet.is-mobile .page-feature-overlay.open,
body.is-tablet.is-mobile .page-overlay.active {
  max-width: 720px;
  margin-left: auto !important;
  margin-right: auto !important;
  left: 0 !important;
  right: 0 !important;
  border-left: 1px solid #e5e7eb;
  border-right: 1px solid #e5e7eb;
  box-shadow: 0 0 40px rgba(15, 23, 42, 0.06);
}

body.is-tablet.is-mobile .hc-overlay-body,
body.is-tablet.is-mobile .hc-menu-card {
  max-width: 100%;
}

body.is-tablet.is-mobile .hc-menu-row {
  padding: 16px 16px;
  min-height: 64px;
}

body.is-tablet.is-mobile .mob-fab {
  right: 28px;
  bottom: calc(80px + env(safe-area-inset-bottom, 0px));
  width: 60px;
  height: 60px;
}

/* 平板直向：會員／定金列表更疏 */
body.is-tablet.is-mobile .member-card,
body.is-tablet.is-mobile .deposit-card {
  padding: 16px;
}

/* 平板橫向但尚未達桌面寬：略放大內容區 */
body.is-tablet.is-landscape.is-mobile .mob-main {
  max-width: 1000px;
}

/* iPad 直向：設定／功能頁雙欄感 */
body.is-tablet.is-mobile .hc-menu-card {
  border-radius: 14px;
  overflow: hidden;
}

body.is-tablet.is-mobile .page-home {
  background: #fff;
  border-radius: 14px;
  padding: 12px;
  border: 1px solid #e5e7eb;
}

body.is-tablet.is-mobile .page-home .mob-cal-toolbar {
  padding-bottom: 12px;
}

@media (min-width: 834px) {
  body.is-tablet.is-mobile .members-list,
  body.is-tablet.is-mobile #depositsList {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  body.is-tablet.is-mobile .member-card,
  body.is-tablet.is-mobile .deposit-card {
    margin: 0;
  }
}

/* 直向 iPad：頂欄與主區留白更均勻 */
body.is-tablet.is-portrait.is-mobile .mob-main {
  padding-top: 8px;
}