/* Light Blue共通テーマ。ポータル・公開ダウンロードのWeb画面で共用する。 */
.light-blue-navbar,
.light-blue-theme {
  --lb-primary: #0055ad;
  --lb-accent: #008bf2;
  --lb-pale: #f0f9ff;
  --lb-border: #c0e4ff;
  font-family: Arial, "Yu Gothic", Meiryo, sans-serif;
}

/* ロゴ・名称・権限別メニューの構成は維持し、青のアクセントで統一する。 */
.light-blue-navbar.navbar {
  border-top: 4px solid var(--lb-primary);
  border-bottom-color: var(--lb-border) !important;
  background: #fff !important;
  box-shadow: 0 3px 12px rgba(0, 85, 173, .08);
}
.light-blue-navbar .navbar-brand { color: var(--lb-primary); }
.light-blue-navbar .navbar-nav .nav-link {
  color: #233d57 !important;
  border-radius: 8px;
}
.light-blue-navbar .navbar-nav .nav-link:hover,
.light-blue-navbar .navbar-nav .nav-link:focus-visible,
.light-blue-navbar .navbar-nav .nav-link.show {
  color: var(--lb-primary) !important;
  background-color: var(--lb-pale);
  box-shadow: inset 0 0 0 1px var(--lb-border);
}
.light-blue-navbar .dropdown-menu {
  border-color: var(--lb-border);
  border-radius: 12px;
  padding: .5rem;
  box-shadow: 0 8px 24px rgba(0, 85, 173, .12);
}
.light-blue-navbar .dropdown-item { border-radius: 6px; padding-block: .5rem; }
.light-blue-navbar .dropdown-item:hover,
.light-blue-navbar .dropdown-item:focus { background: var(--lb-pale); color: var(--lb-primary); }

/* 本文はカード・見出し・表を整え、従来の機能別色分けも淡い色調で残す。 */
.light-blue-theme { color: #202124; line-height: 1.65; }
.light-blue-theme h1 {
  color: var(--lb-primary);
  border-left: 5px solid var(--lb-primary);
  padding: .6rem 1rem;
  margin-bottom: 1.25rem;
  background: var(--lb-pale);
  border-radius: 0 12px 12px 0;
  font-weight: 700;
}
.light-blue-theme :is(main > section, .light-blue-schedules > section) {
  background: #f8f8fb;
  border: 1px solid #dce3ea !important;
  border-radius: 12px !important;
  padding: 1.25rem !important;
  margin-bottom: 1.25rem !important;
}
.light-blue-theme :is(main > section, .light-blue-schedules > section).bg-primary-subtle { background: #f0f9ff !important; border-top: 4px solid #0055ad !important; }
.light-blue-theme :is(main > section, .light-blue-schedules > section).bg-success-subtle { background: #f2f8f5 !important; border-top: 4px solid #38785b !important; }
.light-blue-theme :is(main > section, .light-blue-schedules > section).bg-info-subtle { background: #eaf7fc !important; border-top: 4px solid #008bf2 !important; }
.light-blue-theme :is(main > section, .light-blue-schedules > section).bg-warning-subtle { background: #fff9e9 !important; border-top: 4px solid #9b721c !important; }
/* 出社申請の赤系も共通カードと同じ淡さに揃え、対象日選択の青系と区別する。 */
.light-blue-theme :is(main > section, .light-blue-schedules > section).bg-danger-subtle { background: #fff7f7 !important; border-top: 4px solid #a65d68 !important; }
.light-blue-theme h2 { font-weight: 700; margin-bottom: 1rem; }
.light-blue-theme h3 { color: var(--lb-primary); font-weight: 700; }
.light-blue-theme .form-label { font-weight: 600; }
.light-blue-theme .form-control,
.light-blue-theme .form-select { border-radius: 8px; border-color: #8b9aaa; min-height: 2.5rem; }
.light-blue-theme .form-control:not(:disabled):not([readonly]):hover,
.light-blue-theme .form-select:not(:disabled):hover { border-color: var(--lb-primary); background-color: #fafdff; }
.light-blue-theme .btn { border-radius: 8px; padding: .45rem .9rem; }
.light-blue-theme .btn-primary {
  --bs-btn-bg: #0055ad; --bs-btn-border-color: #0055ad;
  --bs-btn-hover-bg: #004389; --bs-btn-hover-border-color: #004389;
  --bs-btn-active-bg: #00366e; --bs-btn-active-border-color: #00366e;
  background-color: var(--bs-btn-bg); border-color: var(--bs-btn-border-color);
}
.light-blue-theme .btn-primary:hover { background-color: var(--bs-btn-hover-bg); border-color: var(--bs-btn-hover-border-color); }
.light-blue-theme .btn-primary:active { background-color: var(--bs-btn-active-bg); border-color: var(--bs-btn-active-border-color); }
.light-blue-theme .btn-outline-primary { --bs-btn-color: #0055ad; --bs-btn-border-color: #0055ad; --bs-btn-hover-bg: #0055ad; --bs-btn-hover-border-color: #0055ad; }
.light-blue-theme .table { --bs-table-striped-bg: #f0f9ff; --bs-table-hover-bg: #c0e4ff; }
.light-blue-theme .table thead th { background: #e1f0fc; color: #163d65; padding-block: .65rem; }
.light-blue-theme .table td { padding-block: .55rem; }
.light-blue-theme .table-responsive { border: 1px solid #d5e1eb; border-radius: 8px; background: #fff; }
.light-blue-theme .table-responsive .table { margin-bottom: 0; }
.light-blue-theme .modal-content { border-radius: 12px; }
.light-blue-theme .modal-header { background: var(--lb-pale); }
/* 警告・削除・成功の意味色は変更しない。操作の識別はキーボードでも可能にする。 */
.light-blue-navbar :is(a, button):focus-visible,
.light-blue-theme :is(a, button, input, select):focus-visible {
  outline: 3px solid #0055ad; outline-offset: 3px;
}
@media (max-width: 575.98px) {
  .light-blue-theme :is(main > section, .light-blue-schedules > section) { padding: .9rem !important; }
  .light-blue-theme h1 { font-size: 1.4rem; }
}

/* 共通カード・一覧・選択状態。警告や危険操作のBootstrap色は保持する。 */
.light-blue-theme .card { border-color: #dce3ea; border-radius: 12px; }
.light-blue-theme .card-header:not([class*="bg-"]):not(.text-white) { background-color: #f0f9ff; }
.light-blue-theme .form-check-input:checked { background-color: #0055ad; border-color: #0055ad; }
.light-blue-theme .page-link { color: #0055ad; }
.light-blue-theme .active > .page-link { color: white; background-color: #0055ad; border-color: #0055ad; }
.light-blue-theme .btn-sm { padding: .25rem .5rem; font-size: .875em; }
.light-blue-theme .form-control:disabled, .light-blue-theme .form-select:disabled { background: #e9ecef; }
.light-blue-theme .table thead.table-dark th { background: #163d65; color: white; }
.light-blue-theme .table.table-dark thead th { background: #163d65; color: white; }
/* 公開画面はBootstrap非依存のため、既存構造に同じ色・角丸を適用する。 */
.light-blue-theme .site-header { background: white; border-top: 4px solid #0055ad; border-bottom-color: #c0e4ff; }
.light-blue-theme .site-title { color: #0055ad; }
.light-blue-theme .site-footer { background: #f0f9ff; }
.light-blue-theme .site-header ~ main .btn:not([class*="btn-"]) { background: #0055ad; border-color: #0055ad; }
.light-blue-theme .site-header ~ main .btn:not([class*="btn-"]):hover { background: #004389; }
.light-blue-theme .item input[type=checkbox] { accent-color: #0055ad; }
@media print {
  .light-blue-theme h1 { background: white; color: black; }
}