/*
 * 2026-10-30：登入、註冊、忘記密碼、重設密碼「整頁打開」時的版面（Facebook／LINE 登入回來、論壇「再登入一次」、直接打開網址）。
 * 小視窗（論壇、官網把這幾頁放在框架裡）不受影響：下面每一條都只對 html.m2-full 生效，
 * m2-full 是頁面在 <head> 裡判斷「不在框架裡」才加的（mmc2-fullpage.php）。
 * 顏色、字體、形狀照媽媽經設計系統（mamaclub.life design/tokens）與 daisyUI cupcake 主題（mmc2-login.css 最後一段的值）。
 */
.m2f-bar{display:none}

.m2-full body{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;padding-bottom:48px;box-sizing:border-box;background:#FBF7F1}
.m2-full body:has(.grecaptcha-badge){padding-bottom:80px}

/* 頁首：跟官網頁首一樣的和紙底、髮絲線，左邊媽媽經標誌（回官網首頁），右邊回去的路 */
.m2-full .m2f-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;height:64px;margin:0 0 40px;padding:0 40px;box-sizing:border-box;background:rgba(251,247,241,.97);border-bottom:1px solid rgba(58,54,48,.12)}
.m2f-logo{display:flex;flex:none;border-radius:8px}
.m2f-logo img{display:block;width:auto;height:30px}
.m2f-back{display:inline-flex;align-items:center;gap:2px;min-height:44px;padding:0 6px 0 2px;border-radius:999px;color:#3A3630;font-size:15px;line-height:1.4;text-decoration:none;white-space:nowrap}
.m2f-back:hover{color:#823A53}
.m2f-logo:focus-visible,.m2f-back:focus-visible{outline:2px solid #3A3630;outline-offset:2px}

/* 標題用官網的圓體 */
.m2-full .m2a-hero__t,.m2-full .m2r-title{font-family:'Zen Maru Gothic','Noto Sans TC',sans-serif;font-weight:700;letter-spacing:.02em}
.m2-full .m2a-hero__d{color:#5A5248}
.m2-full .wppop-logo,.m2-full .wppop-logotxt,.m2-full .wppop-logotxt2,.m2-full .wppop-txt-slogan,.m2-full .wppop-regisstep{display:none}

/* 表單放在畫面中間（上下置中，太高時照常往下捲） */
.m2-full .wppop-area{width:100%;margin:auto;box-sizing:border-box}

/* 忘記密碼、重設密碼：標誌已經在頁首，卡片裡不再放一次 */
.m2-full .m2r-logo{display:none}
.m2-full .m2r-logo+.m2r-title,.m2-full .m2r-logo+.m2r-steps{margin-top:0}

/* 平板以上：白色卡片（daisyUI 卡片圓角 1rem、髮絲線、極輕陰影） */
@media (min-width:560px){
  .m2-full .wppop-area{position:relative;max-width:480px;padding:0;overflow:hidden;background:#fff;border:1px solid rgba(58,54,48,.12);border-radius:16px;box-shadow:0 6px 18px -8px rgba(58,54,48,.18)}
  .m2-full .wppop-area.m2r{max-width:440px;padding:40px 40px 28px}
  /* 品牌區：會員招募用的淡桃紅漸層（accent-100 → 200），在卡片最上面 */
  .m2-full .m2a-hero{margin:0;padding:22px 32px;border-radius:0;background:linear-gradient(135deg,#FAF1F3,#F3E0E6)}
  .m2-full .wppop-login-area .wppop-signarea,.m2-full .wppop-regisarea{padding:24px 32px 32px}
  .m2-full .wppop-regisarea{position:relative}
}

/* 電腦：左邊品牌區、右邊表單 */
@media (min-width:900px){
  .m2-full .wppop-area:not(.m2r){max-width:920px}
  /* 「登入中」時程式會把這塊藏起來（style 裡的 display:none），那時不能硬改成格線；臉書登入回來時它帶 display:block，要蓋過 */
  .m2-full .wppop-login-area:not([style*="none"]){display:grid!important;grid-template-columns:minmax(0,5fr) minmax(0,6fr);min-height:540px}
  .m2-full .wppop-login-area>*{grid-column:2;grid-row:1;align-self:center}
  .m2-full .wppop-login-area>.m2a-hero{grid-column:1;align-self:stretch;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;padding:56px 48px}
  .m2-full .m2a-hero img{width:168px}
  .m2-full .m2a-hero__t{margin:28px 0 0;font-size:34px;line-height:1.4;color:#823A53}
  .m2-full .m2a-hero__d{margin:12px 0 0;max-width:20em;font-size:16px;line-height:1.85}
  .m2-full .wppop-login-area .wppop-signarea,.m2-full .wppop-regisarea{padding:48px 56px}
}

/* 手機：不加卡片外框，跟小視窗一樣直接放在和紙底上；頁首矮一點 */
@media (max-width:559px){
  .m2-full .m2f-bar{height:56px;margin-bottom:8px;padding:0 16px}
  .m2-full .m2f-logo img{height:26px}
  .m2-full .wppop-area{margin:0 auto}
  .m2-full .wppop-area.m2r{padding-top:24px}
}
@media (max-width:359px){
  .m2-full .m2f-bar{padding:0 12px}
  .m2-full .m2f-back{font-size:14px}
}