/* ===================================
   レイアウト
   =================================== */

/* ========================================
   共通コンテナ
======================================== */

/* メインコンテンツ */
.main-content {
  flex: 1;
  overflow: hidden;
  height: calc(100vh - var(--header-height) - env(safe-area-inset-top));
  position: relative;
  z-index: 1;
}

/* メインコンテナ（掲示板・ナレッジ・議事録共通） */
.main-container {
  padding: 24px;
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

/* ========================================
   スクロール制御
======================================== */

/* デフォルト: すべてのスクロールを無効化 */
html,
body {
  overflow: hidden;
}

.app {
  animation: pageIn 0.2s ease-out;
  height: 100vh;
  height: 100dvh; /* iOS 対応：動的ビューポート */
  padding-top: env(safe-area-inset-top); /* ステータスバー分を確保 */
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* スクロールラッパー（デフォルトは無効） */
.scroll-wrapper {
  flex: 1;
  overflow: hidden;
  overflow-x: hidden;
  margin-top: calc(
    var(--header-height) + var(--action-bar-height) + env(safe-area-inset-top)
  );
  padding-top: 2rem;
}

@media (max-width: 767px) {
  body.bulletin-page .scroll-wrapper {
    margin-top: calc(var(--header-height) + 44px);
    padding-top: var(--space-sm);
    padding-bottom: 80px;
    box-sizing: border-box;
  }
}

/* 通常ページのみスクロール有効 */
body.bulletin-page .scroll-wrapper,
body.bulletin-page .scroll-wrapper--no-action-bar,
body.minutes-page .scroll-wrapper,
body.knowledge-page .scroll-wrapper,
body.user-management-page .scroll-wrapper,
body.organization-master-page .scroll-wrapper,
body.news-page .scroll-wrapper {
  overflow-y: auto;
}

/* action-bar なしページ用 */
.scroll-wrapper--no-action-bar {
  margin-top: calc(var(--header-height) + env(safe-area-inset-top));
  padding-top: var(--space-md);
  padding-bottom: var(--space-2xl);
  overflow-y: auto;
  overflow-x: hidden;
  height: calc(100vh - var(--header-height) - env(safe-area-inset-top));
  min-height: -webkit-fill-available;
  box-sizing: border-box;
}

/* ========================================
   ナレッジ詳細（特別処理）
======================================== */

body.knowledge-detail-page .app {
  overflow: hidden;
}

body.knowledge-detail-page .main-container {
  margin-top: 0;
  padding: 0;
  overflow-y: auto;
  overflow-x: hidden;
  height: calc(100vh - var(--header-height));
  min-height: -webkit-fill-available;
  width: 100vw !important;
  max-width: none !important;
  position: fixed;
  top: var(--header-height);
  left: 0;
  right: 0;
  padding-bottom: env(safe-area-inset-bottom);
  box-sizing: border-box;
}

body.knowledge-detail-page .knowledge-detail {
  max-width: 900px;
  margin: 0 auto;
  padding: 24px 16px 4rem 16px;
  padding-bottom: calc(4rem + env(safe-area-inset-bottom));
}

body.minutes-page .scroll-wrapper {
  padding-bottom: calc(var(--space-2xl) + env(safe-area-inset-bottom));
  box-sizing: border-box;
}

/* iOSのSafari対応 */
@supports (-webkit-touch-callout: none) {
  body.knowledge-detail-page .main-container {
    height: -webkit-fill-available;
  }
}

/* ========================================
   ページ遷移アニメーション
======================================== */

@keyframes pageIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.nav-link {
  transition: opacity 0.15s ease-out;
}

.nav-link:active {
  opacity: 0.7;
}

/* ========================================
   トークン通知アニメーション
======================================== */

@keyframes slideInRight {
  from {
    transform: translateX(400px);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slideOutRight {
  from {
    transform: translateX(0);
    opacity: 1;
  }

  to {
    transform: translateX(400px);
    opacity: 0;
  }
}

.token-notification {
  font-family: var(--font-family);
}

body.news-page .scroll-wrapper {
  margin-top: calc(var(--header-height) + env(safe-area-inset-top));
  padding-top: 0;
}

@media (max-width: 767px) {
  body.news-page .scroll-wrapper {
    margin-top: var(--header-height);
    padding-top: 0;
    padding-bottom: calc(var(--space-2xl) + env(safe-area-inset-bottom));
    box-sizing: border-box;
  }
}