/* 全画面共通: ヘッダー表示/非表示トグル（案件詳細・編集の方式を統一）。
   目立つ色付きの固定ボタン。ヘッダー表示中は青、非表示中は緑。 */
.app-header-toggle-button {
  position: fixed;
  top: 8px;
  right: 12px;
  z-index: 4000;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  color: #ffffff;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  border: none;
  border-radius: 16px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.45);
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.app-header-toggle-button:hover {
  background: linear-gradient(135deg, #1d4ed8, #1e40af);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.5);
}
.app-header-toggle-button:focus-visible {
  outline: 2px solid #93c5fd;
  outline-offset: 2px;
}
/* 折りたたみ中は緑にして状態を明示 */
.app-header-toggle-button.is-collapsed {
  background: linear-gradient(135deg, #059669, #047857);
  box-shadow: 0 2px 8px rgba(5, 150, 105, 0.45);
}
.app-header-toggle-button.is-collapsed:hover {
  background: linear-gradient(135deg, #047857, #065f46);
}
.app-header-toggle-button .header-toggle-icon {
  display: inline-block;
  transition: transform 0.2s ease;
}
.app-header-toggle-button.is-collapsed .header-toggle-icon {
  transform: rotate(-90deg);
}