/**
 * Activity ページ専用 CSS
 * slug: activity
 * body class: .page-id-XXX または .page-template-page-activity
 *
 * ルール追加時は必ずページスコープを付けること。
 * 例: body.page-template-page-activity .ms-activity { ... }
 *     body[class*="page-id-"] .ms-activity { ... }
 *
 * style_part_01.css: 移行対象なし（共通セレクタのみ）
 * style_part_02.css: 移行対象なし
 * style_part_03.css: 移行対象なし（共通コンポーネント）
 * style_part_04.css: Activity ページレイアウト・ヒーロー等を移行
 * style_part_05.css: 移行対象なし
 * style_part_06.css: 移行対象なし（About ページ内の.ms-activity用）
 * style_part_07.css: 移行対象なし
 */

/* ===== レイアウト統一 ===== */
body.page-template-page-activity .ms-activity.l-container,
body[class*="page-id-"] .ms-activity.l-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 16px;
}

@media (min-width: 1025px) {
  body.page-template-page-activity .ms-activity.l-container > *,
  body[class*="page-id-"] .ms-activity.l-container > * {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 1024px) {
  body.page-template-page-activity .ms-activity.l-container > *,
  body[class*="page-id-"] .ms-activity.l-container > * {
    width: 100%;
  }
}

/* ===== 活動報告ページ専用のセクションクラス ===== */
body.page-template-page-activity .ms-activity-section,
body[class*="page-id-"] .ms-activity-section {
  width: 100%;
  margin-bottom: 50px;
  margin-top: 20px;
}

@media (min-width: 1025px) {
  body.page-template-page-activity .ms-activity-section,
  body[class*="page-id-"] .ms-activity-section {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
  }
}

@media (max-width: 1024px) {
  body.page-template-page-activity .ms-activity-section,
  body[class*="page-id-"] .ms-activity-section {
    width: 100%;
  }
}

body.page-template-page-activity .ms-activity-section:first-of-type,
body[class*="page-id-"] .ms-activity-section:first-of-type {
  margin-top: 0;
}

/* ===== アーカイブ・更新情報セクションの幅（他セクションと同じ幅に統一） ===== */
/* タブレット以上：ヒーローなどと同じ 80% 幅 */
@media (min-width: 769px) {
  body.page-template-page-activity .ms-activity .ms-archive-section,
  body.page-template-page-activity .ms-activity .ms-update-info,
  body[class*="page-id-"] .ms-activity .ms-archive-section,
  body[class*="page-id-"] .ms-activity .ms-update-info {
    width: 80% !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* スマホのみ 100% */
@media (max-width: 768px) {
  body.page-template-page-activity .ms-activity .ms-archive-section,
  body.page-template-page-activity .ms-activity .ms-update-info,
  body[class*="page-id-"] .ms-activity .ms-archive-section,
  body[class*="page-id-"] .ms-activity .ms-update-info {
    width: 100% !important;
  }
}

/* ===== ヒーローセクション ===== */
body.page-template-page-activity .ms-activity .ms-hero,
body[class*="page-id-"] .ms-activity .ms-hero {
  text-align: center;
  margin-bottom: 40px;
  background: linear-gradient(135deg, #fff7ee 0%, #ffe0bf 100%);
  border-radius: 16px;
  padding: 40px 20px;
  position: relative;
  overflow: hidden;
}

body.page-template-page-activity .ms-activity .ms-hero::before,
body[class*="page-id-"] .ms-activity .ms-hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(45deg, rgba(243, 152, 0, 0.05) 0%, rgba(243, 152, 0, 0.1) 100%);
  pointer-events: none;
}

body.page-template-page-activity .ms-activity .ms-hero .entry-title,
body[class*="page-id-"] .ms-activity .ms-hero .entry-title {
  font-size: clamp(28px, 5vw, 42px);
  margin-bottom: 20px;
  color: #222;
  position: relative;
  z-index: 1;
}

body.page-template-page-activity .ms-activity .ms-hero .ms-lead,
body[class*="page-id-"] .ms-activity .ms-hero .ms-lead {
  font-size: clamp(16px, 2.5vw, 20px);
  line-height: 1.6;
  margin-bottom: 0;
  position: relative;
  z-index: 1;
}

/* ===== 活動報告一覧 ===== */
body.page-template-page-activity .ms-activity-list,
body[class*="page-id-"] .ms-activity-list {
  margin-bottom: 40px;
}

/* ===== カードの幅設定 ===== */
body.page-template-page-activity .ms-activity .ms-archive-card,
body[class*="page-id-"] .ms-activity .ms-archive-card {
  width: 100%;
  max-width: 100%;
}

body.page-template-page-activity .ms-activity .ms-update-card,
body[class*="page-id-"] .ms-activity .ms-update-card {
  width: 100%;
  max-width: 100%;
}