/* マカセタ Ver.0.3: SWELLを土台にしつつ、受講画面は独立したLMS UIとして表示 */
body.makaseta-app-page{background:#F4F7FA!important;color:#1D2939}
body.makaseta-app-page #header,
body.makaseta-app-page .l-header,
body.makaseta-app-page header#header,
body.makaseta-app-page #footer,
body.makaseta-app-page .l-footer,
body.makaseta-app-page footer#footer,
body.makaseta-app-page .p-breadcrumb,
body.makaseta-app-page .c-pageTitle,
body.makaseta-app-page .l-mainContent__inner>.c-pageTitle,
body.makaseta-app-page .l-sidebar,
body.makaseta-app-page #sidebar{display:none!important}
body.makaseta-app-page #content,
body.makaseta-app-page .l-content,
body.makaseta-app-page .l-container,
body.makaseta-app-page .l-mainContent,
body.makaseta-app-page .l-mainContent__inner,
body.makaseta-app-page .post_content,
body.makaseta-app-page .entry-content{max-width:none!important;width:100%!important;margin:0!important;padding:0!important}
body.makaseta-app-page .l-content{display:block!important}
body.makaseta-app-page #content{padding:0!important}
body.makaseta-app-page main{min-width:0}
body.makaseta-app-page .post_content>p:empty{display:none}

.mak-app-shell{min-height:100vh;display:grid;grid-template-columns:236px minmax(0,1fr);grid-template-rows:68px auto;grid-template-areas:"header header" "sidebar main";background:#F4F7FA}
.mak-app-header{grid-area:header;position:sticky;top:0;z-index:60;height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 28px;background:#fff;border-bottom:1px solid #E3E8EE;box-shadow:0 1px 8px rgba(13,43,77,.03)}
.mak-app-brand{display:flex;align-items:baseline;gap:10px;text-decoration:none!important;color:#0D2B4D!important}
.mak-app-brand strong{font-size:24px;font-weight:900;letter-spacing:.06em}.mak-app-brand small{font-size:9px;letter-spacing:.2em;color:#5B738E;font-weight:700}
.mak-app-header-actions{display:flex;align-items:center;gap:18px;font-size:13px}.mak-header-search{border:1px solid #E3E8EE;border-radius:8px;padding:8px 14px;text-decoration:none!important;color:#234D7A!important;background:#F8FAFC}.mak-user-name{font-weight:700;color:#0D2B4D}
.mak-app-sidebar{grid-area:sidebar;position:sticky;top:68px;height:calc(100vh - 68px);background:#0D2B4D;padding:22px 14px;overflow:auto}
.mak-app-nav{display:grid;gap:6px}.mak-app-nav a{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:8px;color:#EAF1F7!important;text-decoration:none!important;font-size:14px;font-weight:700}.mak-app-nav a:hover{background:rgba(255,255,255,.10)}.mak-nav-icon{width:20px;text-align:center;color:#AFC1D2}
.mak-app-main{grid-area:main;min-width:0;padding:0 10px 54px}
.mak-app-main>.mak-wrap,.mak-app-main>.mak-course-single{max-width:1240px;margin-left:auto;margin-right:auto}
.mak-app-main .mak-wrap{padding-top:28px}

body.makaseta-login-page{background:linear-gradient(145deg,#F8FAFC,#EAF1F7)!important;min-height:100vh}
body.makaseta-login-page #content,body.makaseta-login-page .l-content{min-height:100vh;display:grid!important;place-items:center}
body.makaseta-login-page .mak-login{width:min(100%,500px)}

@media(max-width:900px){
 .mak-app-shell{display:block;padding-top:60px;padding-bottom:64px}
 .mak-app-header{position:fixed;inset:0 0 auto 0;height:60px;padding:0 16px}.mak-app-brand strong{font-size:21px}.mak-app-brand small{display:none}.mak-header-search{display:none}.mak-user-name{font-size:12px}
 .mak-app-sidebar{position:fixed;z-index:70;left:0;right:0;bottom:0;top:auto;height:64px;padding:0;background:#0D2B4D}
 .mak-app-nav{height:64px;display:flex;justify-content:space-around;align-items:stretch;gap:0}.mak-app-nav a{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:6px 3px;border-radius:0;font-size:9px;text-align:center}.mak-nav-icon{width:auto;font-size:16px}
 .mak-app-main{padding:0 0 24px}.mak-app-main .mak-wrap{padding-top:18px}
}

/* =========================================================
   Ver.0.6.1 — SWELL完全フルスクリーン対応
   マカセタ画面をテーマのコンテンツ幅から独立させ、viewport全面に表示
========================================================= */

/* body class が付いた場合のSWELL標準UI非表示 */
body.makaseta-app-page #header,
body.makaseta-app-page .l-header,
body.makaseta-app-page .p-header,
body.makaseta-app-page .c-gnav,
body.makaseta-app-page #gnav,
body.makaseta-app-page .l-fixHeader,
body.makaseta-app-page .p-fixHeader,
body.makaseta-app-page #footer,
body.makaseta-app-page .l-footer,
body.makaseta-app-page .p-footer,
body.makaseta-app-page .p-breadcrumb,
body.makaseta-app-page .c-pageTitle,
body.makaseta-app-page .l-sidebar,
body.makaseta-app-page #sidebar,
body.makaseta-app-page .p-articleHead,
body.makaseta-app-page .post_content + .c-postThumb,
body.makaseta-app-page .l-mainContent__inner > .p-articleHead {
  display:none!important;
}

/* body class が何らかの理由で付かない場合も、Chrome/Safari等では自動判定 */
body:has(.mak-app-shell) #header,
body:has(.mak-app-shell) .l-header,
body:has(.mak-app-shell) .p-header,
body:has(.mak-app-shell) .c-gnav,
body:has(.mak-app-shell) #gnav,
body:has(.mak-app-shell) .l-fixHeader,
body:has(.mak-app-shell) .p-fixHeader,
body:has(.mak-app-shell) #footer,
body:has(.mak-app-shell) .l-footer,
body:has(.mak-app-shell) .p-footer,
body:has(.mak-app-shell) .p-breadcrumb,
body:has(.mak-app-shell) .c-pageTitle,
body:has(.mak-app-shell) .l-sidebar,
body:has(.mak-app-shell) #sidebar,
body:has(.mak-app-shell) .p-articleHead {
  display:none!important;
}

/* SWELL / Gutenberg の幅・余白制限を徹底解除 */
body.makaseta-app-page,
body:has(.mak-app-shell) {
  overflow-x:hidden!important;
  background:#F4F7FA!important;
}

body.makaseta-app-page #body_wrap,
body.makaseta-app-page #content,
body.makaseta-app-page .l-content,
body.makaseta-app-page .l-container,
body.makaseta-app-page .l-mainContent,
body.makaseta-app-page .l-mainContent__inner,
body.makaseta-app-page .post_content,
body.makaseta-app-page .entry-content,
body.makaseta-app-page .c-postContent,
body.makaseta-app-page article,
body:has(.mak-app-shell) #body_wrap,
body:has(.mak-app-shell) #content,
body:has(.mak-app-shell) .l-content,
body:has(.mak-app-shell) .l-container,
body:has(.mak-app-shell) .l-mainContent,
body:has(.mak-app-shell) .l-mainContent__inner,
body:has(.mak-app-shell) .post_content,
body:has(.mak-app-shell) .entry-content,
body:has(.mak-app-shell) .c-postContent,
body:has(.mak-app-shell) article {
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}

/* 親要素が中央寄せの固定幅でも、viewport全幅へブレイクアウト */
.mak-app-shell {
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  min-height:100vh!important;
}

/* 右側メインは残り幅を全面使用。中央寄せの1240px制限を解除 */
.mak-app-main {
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  padding:0 28px 54px!important;
}

.mak-app-main > .mak-wrap,
.mak-app-main > .mak-course-single,
.mak-app-main .mak-wrap,
.mak-app-main .mak-course-single {
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

.mak-app-main .mak-wrap {
  padding:28px 0 0!important;
}

/* 契約・会社管理などのカードも広い画面で自然に使う */
.mak-app-main .mak-card,
.mak-app-main .mak-learning,
.mak-app-main .mak-empty {
  max-width:none!important;
}

/* 管理バー表示中は、その分だけviewport高さを調整 */
body.admin-bar .mak-app-shell { min-height:calc(100vh - 32px)!important; }
body.admin-bar .mak-app-header { top:32px!important; }
body.admin-bar .mak-app-sidebar { top:100px!important; height:calc(100vh - 100px)!important; }

@media(max-width:900px){
  .mak-app-shell{
    width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
  }
  .mak-app-main{padding:0 14px 24px!important}
  .mak-app-main .mak-wrap{padding-top:18px!important}
  body.admin-bar .mak-app-header{top:46px!important}
  body.admin-bar .mak-app-sidebar{top:auto!important;height:64px!important}
}


/* =========================================================
   Ver.0.6.2 — アプリナビゲーション整理 / ログアウト
========================================================= */
.mak-logout{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:7px 12px;
  border:1px solid #D8E1EA;
  border-radius:8px;
  background:#fff;
  color:#5B738E!important;
  text-decoration:none!important;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}
.mak-logout:hover{background:#F4F7FA;color:#0D2B4D!important}

/* SWELLがメニュー未設定時に固定ページ一覧を自動表示しても、
   マカセタのアプリ画面ではテーマ側ナビを一切見せない。 */
body.makaseta-app-page .l-header__inner,
body.makaseta-app-page .p-globalNav,
body.makaseta-app-page .p-spMenu,
body.makaseta-app-page .l-header__gnav,
body.makaseta-app-page nav[aria-label="グローバルナビゲーション"],
body:has(.mak-app-shell) .l-header__inner,
body:has(.mak-app-shell) .p-globalNav,
body:has(.mak-app-shell) .p-spMenu,
body:has(.mak-app-shell) .l-header__gnav,
body:has(.mak-app-shell) nav[aria-label="グローバルナビゲーション"]{
  display:none!important;
}

@media(max-width:900px){
  .mak-app-header-actions{gap:8px}
  .mak-user-name{display:none}
  .mak-logout{min-height:32px;padding:6px 9px;font-size:11px}
}

/* Ver.0.6.3: ログイン画面は完全スタンドアロン */
body.makaseta-login-page #header,body.makaseta-login-page .l-header,body.makaseta-login-page .p-header,body.makaseta-login-page .c-gnav,body.makaseta-login-page #gnav,body.makaseta-login-page .l-fixHeader,body.makaseta-login-page .p-fixHeader,body.makaseta-login-page #footer,body.makaseta-login-page .l-footer,body.makaseta-login-page .p-footer,body.makaseta-login-page .p-breadcrumb,body.makaseta-login-page .c-pageTitle,body.makaseta-login-page .p-articleHead,body.makaseta-login-page .l-sidebar,body.makaseta-login-page #sidebar{display:none!important}
body.makaseta-login-page #content,body.makaseta-login-page .l-content,body.makaseta-login-page .l-container,body.makaseta-login-page .l-mainContent,body.makaseta-login-page .l-mainContent__inner,body.makaseta-login-page .post_content,body.makaseta-login-page .entry-content,body.makaseta-login-page article{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}

/* Ver.0.6.4: 認証ページはSWELLのh2/見出し装飾を含め完全に独立 */
body.makaseta-login-page .mak-auth-shell h1,
body.makaseta-login-page .mak-auth-shell h2,
body.makaseta-login-page .mak-auth-shell h3{background:none!important;border:0!important;border-left:0!important;border-bottom:0!important;box-shadow:none!important;padding:0!important}
body.makaseta-login-page .mak-auth-shell .mak-auth-title:before,
body.makaseta-login-page .mak-auth-shell .mak-auth-title:after{display:none!important;content:none!important}

/* =========================================================
   Ver.0.6.8 — 認証ページはSWELLヘッダー/メニューを強制排除
========================================================= */
body.makaseta-login-page header,
body.makaseta-login-page #header,
body.makaseta-login-page .l-header,
body.makaseta-login-page .p-header,
body.makaseta-login-page .l-fixHeader,
body.makaseta-login-page .p-fixHeader,
body.makaseta-login-page .c-gnav,
body.makaseta-login-page #gnav,
body.makaseta-login-page .p-globalNav,
body.makaseta-login-page .l-header__gnav,
body.makaseta-login-page nav[aria-label="グローバルナビゲーション"],
body:has(.mak-auth-shell) header,
body:has(.mak-auth-shell) #header,
body:has(.mak-auth-shell) .l-header,
body:has(.mak-auth-shell) .p-header,
body:has(.mak-auth-shell) .l-fixHeader,
body:has(.mak-auth-shell) .p-fixHeader,
body:has(.mak-auth-shell) .c-gnav,
body:has(.mak-auth-shell) #gnav,
body:has(.mak-auth-shell) .p-globalNav,
body:has(.mak-auth-shell) .l-header__gnav,
body:has(.mak-auth-shell) nav[aria-label="グローバルナビゲーション"]{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
}
body.makaseta-login-page main,
body:has(.mak-auth-shell) main{margin-top:0!important;padding-top:0!important}
body.makaseta-login-page #body_wrap,
body:has(.mak-auth-shell) #body_wrap{padding-top:0!important;margin-top:0!important}

/* 制作管理者ログインはURL直打ち時のみ。公開ログインからは導線を出さない */
body.makaseta-user-login-page .mak-admin-login-link{display:none!important}

/* =========================================================
   Ver.0.6.8 — 認証画面を完全フルビューポート化・上余白圧縮
========================================================= */
html:has(body.makaseta-login-page),
body.makaseta-login-page,
html:has(.mak-auth-shell),
body:has(.mak-auth-shell){
  width:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  margin:0!important;
  padding:0!important;
  background:radial-gradient(circle at 50% 0,#fff 0,#F5F8FB 46%,#EAF1F7 100%)!important;
}

body.makaseta-login-page #content,
body.makaseta-login-page .l-content,
body.makaseta-login-page .l-container,
body.makaseta-login-page .l-mainContent,
body.makaseta-login-page .l-mainContent__inner,
body.makaseta-login-page .post_content,
body.makaseta-login-page .entry-content,
body.makaseta-login-page article,
body:has(.mak-auth-shell) #content,
body:has(.mak-auth-shell) .l-content,
body:has(.mak-auth-shell) .l-container,
body:has(.mak-auth-shell) .l-mainContent,
body:has(.mak-auth-shell) .l-mainContent__inner,
body:has(.mak-auth-shell) .post_content,
body:has(.mak-auth-shell) .entry-content,
body:has(.mak-auth-shell) article{
  width:100%!important;
  max-width:none!important;
  min-height:100%!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
}

body.makaseta-login-page .mak-auth-shell,
body:has(.mak-auth-shell) .mak-auth-shell{
  position:relative!important;
  left:50%!important;
  width:100vw!important;
  max-width:none!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  margin:0 0 0 -50vw!important;
  padding:10px 16px 14px!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
  background:radial-gradient(circle at 50% 0,#fff 0,#F5F8FB 46%,#EAF1F7 100%)!important;
  box-sizing:border-box!important;
}

body.makaseta-login-page .mak-auth-card,
body:has(.mak-auth-shell) .mak-auth-card{
  margin:8px auto 0!important;
}

@media (max-height:820px) and (min-width:701px){
  body.makaseta-login-page .mak-auth-shell,
  body:has(.mak-auth-shell) .mak-auth-shell{padding-top:4px!important;padding-bottom:6px!important}
  body.makaseta-login-page .mak-auth-card,
  body:has(.mak-auth-shell) .mak-auth-card{margin-top:2px!important;padding-top:20px!important;padding-bottom:20px!important}
}