/* ===== テーマカラー ===== */
:root {
  --theme:        #8080A0;
  --theme-dark:   #6B6B8C;
  --theme-darker: #565676;
  --theme-light:  #A0A0C0;
  --theme-pale:   #EDEDF3;
  --theme-bg:     #F5F5FA;
  --text-on-theme: #FFFFFF;
}

/* ===== 共通 ===== */
body {
  font-family: -apple-system, "Segoe UI", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  background: var(--theme-bg);
  color: #2c2c3c;
}

/* ===== ナビバー ===== */
.navbar.navbar-themed {
  background: var(--theme) !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}
.navbar.navbar-themed .navbar-brand,
.navbar.navbar-themed .nav-link,
.navbar.navbar-themed .navbar-text {
  color: var(--text-on-theme) !important;
}
.navbar.navbar-themed .nav-link:hover {
  color: #fff !important;
  background: rgba(255,255,255,.12);
  border-radius: 4px;
}
.navbar.navbar-themed .btn-outline-light:hover {
  background: rgba(255,255,255,.2);
  border-color: #fff;
}

/* ===== ボタン（Bootstrapの primary を上書き） ===== */
.btn-primary {
  background-color: var(--theme) !important;
  border-color: var(--theme) !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  background-color: var(--theme-dark) !important;
  border-color: var(--theme-dark) !important;
  box-shadow: 0 0 0 .2rem rgba(128,128,160,.25) !important;
}
.btn-outline-primary {
  color: var(--theme) !important;
  border-color: var(--theme) !important;
}
.btn-outline-primary:hover, .btn-outline-primary:active, .btn-outline-primary.active {
  background-color: var(--theme) !important;
  border-color: var(--theme) !important;
  color: #fff !important;
}
a { color: var(--theme-dark); }
a:hover { color: var(--theme-darker); }

/* ===== カード ===== */
.card { border-color: #e3e3eb; }
.card-header.themed {
  background: var(--theme) !important;
  color: var(--text-on-theme);
  border-bottom: none;
}
.card-header.themed h1,
.card-header.themed h2,
.card-header.themed a { color: var(--text-on-theme) !important; }
.card-header.themed a:hover { color: #f0f0ff !important; }

/* テーブル */
.table-themed > thead { background: var(--theme); color: #fff; }
.table-themed > thead th { background: var(--theme); color: #fff; border-color: var(--theme-dark); }

/* アラート（メッセージ） */
.alert-success { background: #e6f4ea; color: #1e5128; border-color: #cfe5d6; }
.alert-info    { background: var(--theme-pale); color: var(--theme-darker); border-color: #d6d6e3; }

/* ===== flatpickr（テーマカラー適応） ===== */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover {
  background: var(--theme); border-color: var(--theme); color: #fff;
}
.flatpickr-day.inRange {
  background: var(--theme-pale); border-color: var(--theme-pale); color: var(--theme-darker);
  box-shadow: -5px 0 0 var(--theme-pale), 5px 0 0 var(--theme-pale);
}
.flatpickr-day.today { border-color: var(--theme); }
.flatpickr-day.today:hover { background: var(--theme-light); color: #fff; border-color: var(--theme); }
.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-weekdays, span.flatpickr-weekday {
  background: var(--theme); color: #fff;
}
span.flatpickr-weekday { color: rgba(255,255,255,.85); }
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg { fill: #fff; }
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg { fill: #f0f0ff; }
.numInputWrapper:hover { background: rgba(255,255,255,.1); }

/* ===== フォームアクションボタン（同一幅） ===== */
.form-action-btn {
  min-width: 110px;
  text-align: center;
}

/* ===== バッジ ===== */
.badge.bg-theme { background: var(--theme-dark) !important; color: #fff; }

/* ===== プログレスバー ===== */
.progress-bar.bg-theme { background-color: var(--theme) !important; }
.card.completed-project {
  background-color: #ececec;
}
.card.completed-project .card-body {
  background-color: transparent;
}

/* ===== フォーム入力フォーカス ===== */
.form-control:focus, .form-select:focus {
  border-color: var(--theme-light);
  box-shadow: 0 0 0 .25rem rgba(128,128,160,.45);
}

/* ===== ログイン画面 ===== */
.login-wrap {
  background: linear-gradient(135deg, var(--theme) 0%, var(--theme-darker) 100%);
  min-height: 100vh;
}
.login-card { box-shadow: 0 10px 30px rgba(86,86,118,.3); }
.login-brand { color: var(--theme); }

/* ===== LF Ticket 追加 ===== */
.ticket-key {
  font-family: SFMono-Regular, Consolas, "Liberation Mono", monospace;
  color: var(--theme-darker);
  white-space: nowrap;
}
.color-chip {
  display: inline-block; width: 10px; height: 10px;
  border-radius: 50%; margin-right: 6px; vertical-align: middle;
  border: 1px solid rgba(0,0,0,.1);
}

/* ステータス */
.badge-status { font-weight: 600; }
.badge-status-open        { background: #e89432; color: #212529; }
.badge-status-in_progress { background: #2471a3; color: #fff; }
.badge-status-resolved    { background: #1e8449; color: #fff; }
.badge-status-closed      { background: #6c757d; color: #fff; }

/* 優先度 */
.badge-priority-high   { background: #c0392b; color: #fff; }
.badge-priority-normal { background: var(--theme-dark); color: #fff; }
.badge-priority-low    { background: #adb5bd; color: #212529; }

/* 期限 */
.row-overdue, .row-overdue a { color: #c0392b; }
.row-due-today, .row-due-today a { color: #a85a14; }

/* 更新履歴 */
.activity-item {
  background: #fff;
  border-left: 3px solid var(--theme-light);
  padding: 8px 12px;
  margin-bottom: 8px;
  border-radius: 0 4px 4px 0;
}
.login-container { max-width: 420px; }
.th-label { width: 30%; }

/* フォーカス表示（キーボード操作） */
.navbar-themed .nav-link:focus-visible,
.navbar-themed .navbar-brand:focus-visible,
.navbar-themed .btn:focus-visible,
.navbar-themed .navbar-toggler:focus-visible { outline: 2px solid #fff; outline-offset: 2px; box-shadow: none; }
.navbar.navbar-themed .nav-link.active { background: rgba(255,255,255,.18); border-radius: 4px; }
.navbar-themed .navbar-toggler { border-color: rgba(255,255,255,.6); }
.navbar-themed .navbar-toggler-icon { filter: invert(1) brightness(2); }

/* チケット */
.nav-key-search { width: 200px; }
.watchers-box {
  border: 1px solid #dee2e6; border-radius: .25rem; padding: 6px 10px; min-height: 38px; background: #fff;
}
.watchers-box.is-invalid { border-color: #dc3545; }
.ticket-text, .activity-comment { white-space: normal; overflow-wrap: anywhere; font-size: .925rem; }
.activity-comment { background: var(--theme-bg); border-radius: 4px; padding: 6px 10px; }
.ticket-props dd { margin-bottom: .5rem; }
@media (max-width: 991.98px) { .nav-key-search { width: 100%; } }
.ticket-badges .badge { font-size: .8rem; }
.activity-item.activity-new { border-left-color: #e89432; background: #fff8ec; }

/* 候補リスト（担当者の絞り込み・お知らせ先の @ 候補） */
.lf-combo { position: relative; }
.lf-combo-list {
  position: absolute; z-index: 1050; left: 0; right: 0; top: 100%;
  max-height: 240px; overflow-y: auto;
  margin: 2px 0 0; padding: 4px 0; list-style: none;
  background: #fff; border: 1px solid #d6d6e3; border-radius: .25rem;
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
  font-size: .875rem;
}
.lf-combo-list li { padding: 4px 10px; cursor: pointer; }
.lf-combo-list li.active, .lf-combo-list li:hover { background: var(--theme-pale); color: var(--theme-darker); }
.watchers-preview .badge { font-weight: 500; }
.lf-combo-list li.lf-combo-more { color: #6c757d; cursor: default; font-size: .8rem; background: none; }

/* 一覧 */
.nav-pills-themed .nav-link { color: var(--theme-darker); }
.nav-pills-themed .nav-link.active { background: var(--theme-dark); color: #fff; }
.ticket-table td { vertical-align: middle; }
.ticket-title-cell { min-width: 16rem; }
.table-themed .sort-link { color: #fff; text-decoration: none; }
.table-themed .sort-link:hover { text-decoration: underline; }
.card-header.themed .badge.bg-light { color: var(--theme-darker) !important; }
.activity-day { border-bottom: 1px solid #e3e3eb; padding-bottom: 4px; }
.filter-form .form-check-input { margin-top: .2rem; }
.summary-badges .badge, .status-count-badges .badge { font-size: .85rem; padding: .4em .7em; text-decoration: none; }
.nav-pills-themed .tab-count { opacity: .8; font-size: .85em; }
.nav-tabs .nav-link { color: var(--theme-dark); }
.nav-tabs .nav-link.active { color: var(--theme-darker); font-weight: 600; }
.card-header.themed .color-chip { border-color: #fff; }
/* プロジェクトごとのカードで列幅を揃える */
.ticket-table .col-key { width: 7.5rem; }
.ticket-table .col-status { width: 7rem; }
.ticket-table .col-priority { width: 5.5rem; }
.ticket-table .col-due { width: 7.5rem; }
.ticket-table .col-updated { width: 9rem; }
.ticket-table .col-person { width: 8rem; }
@media (max-width: 767.98px) {
  .ticket-title-cell { min-width: 7rem; }
  .ticket-table .col-key { width: 4.8rem; }
  .ticket-table .col-priority { width: 4.2rem; }
  .ticket-table .col-due { width: 5.6rem; }
  .ticket-table td, .ticket-table th { font-size: .8rem; }
}

/* チケット登録・編集：項目名を左に置くコンパクトなレイアウト（A案） */
.hf {
  display: grid;
  grid-template-columns: 6.5rem minmax(0, 1fr);
  column-gap: .6rem;
  align-items: center;
}
.hf > label {
  margin: 0;
  text-align: right;
  font-size: .85rem;
  color: #555;
  line-height: 1.2;
}
.hf.hf-top > label { align-self: start; padding-top: .35rem; }
/* 3 列行の 2・3 列目はラベル幅を詰める */
@media (min-width: 992px) { .hf.hf-short { grid-template-columns: 4.5rem minmax(0, 1fr); } }
.hf-offset { margin-left: 7.1rem; }
.ticket-form-grid textarea { resize: vertical; }
@media (max-width: 575.98px) {
  .hf { grid-template-columns: 1fr; row-gap: .15rem; }
  .hf > label { text-align: left; padding-top: 0; }
  .hf-offset { margin-left: 0; }
}

/* チェックボックス・スイッチをテーマ色に（LF Gantt と同じ見た目） */
.form-check-input:checked { background-color: var(--theme); border-color: var(--theme); }
.form-check-input:focus { border-color: var(--theme-light); box-shadow: 0 0 0 .25rem rgba(128,128,160,.25); }
.form-switch .form-check-input:focus:not(:checked) {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23a0a0c0'/%3e%3c/svg%3e");
}
.form-check-label, .form-check-input { cursor: pointer; }
.lf-combo-wrap { position: relative; }
.lf-combo-toggle {
  position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
  border: 0; background: transparent; color: #6c757d; padding: 0 .4rem; line-height: 1; cursor: pointer;
}
.lf-combo-toggle:hover { color: var(--theme-darker); }

/* 担当者欄の案内は入力欄の下に重ねて出す（下の項目を押し下げない） */
.lf-combo-hint {
  position: absolute; left: 0; right: 0; top: 100%; z-index: 1040; margin-top: 2px;
  background: #fff5f5; border: 1px solid #f1b0b7; color: #a71d2a; border-radius: .25rem;
  font-size: .8rem; padding: 2px 8px;
}
/* タッチ操作では候補行と ▼ を押しやすい大きさに */
@media (pointer: coarse) {
  .lf-combo-list li { min-height: 40px; display: flex; align-items: center; }
  .lf-combo-toggle { width: 40px; height: 100%; }
}