/* ========================================
   議事録ページ専用スタイル
======================================== */

/* ==========================================
   議事録専用：日付を右寄せ
========================================== */
.card-header {
  justify-content: flex-end;
}

/* ==========================================
   新規作成ボタン
========================================== */
.minutes-page .primary-button {
  background: var(--color-bg-primary);
  color: var(--color-text-primary);
  border: 1px solid var(--color-border);
}

.minutes-page .primary-button:hover {
  background: var(--color-text-primary);
  color: var(--color-bg-primary);
  border: 1px solid var(--color-text-primary);
}

/* ==========================================
   PC版 アクションバー
========================================== */
.minutes-page .action-bar-desktop {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  width: 100%;
}

.minutes-page .action-bar-mobile {
  display: none !important;
}

.minutes-page .scroll-wrapper {
  padding-top: 0;
}

/* ==========================================
   スマホ版
========================================== */
@media (max-width: 767px) {

  .minutes-page .action-bar {
    position: fixed;
    top: var(--header-height);
    left: 0;
    right: 0;
    z-index: 100;
    background: var(--color-bg-primary);
    border-bottom: 1px solid var(--color-border);
    padding: 8px 12px;
    height: auto !important;
  }

  .minutes-page .action-bar-desktop {
    display: none !important;
  }

  .minutes-page .action-bar-mobile {
    display: flex !important;
    flex-direction: column;
    gap: 8px;
    width: 100%;
  }

  .minutes-page .action-bar-row {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
  }

  .minutes-page .search-input {
    height: 32px;
    background: var(--color-bg-input);
    flex: 1;
  }

  .minutes-page .scroll-wrapper {
    margin-top: calc(var(--header-height) + 52px);
    padding-top: 0;
  }

  .minutes-page .cards-grid {
    flex-direction: column;
    padding: 0;
    gap: 12px;
  }

  .minutes-page .card {
    padding: 16px;
  }

  .minutes-page .tag-list {
    gap: 6px;
  }

  .minutes-page .tag {
    padding: 4px 10px;
    font-size: 11px;
  }

  .minutes-page .participants {
    gap: 6px;
    flex-wrap: wrap;
  }

  .minutes-page .participant {
    font-size: 12px;
  }
}