/*
 * CSSVC 見やすさの調整（AdminLTE の後に読み込む）
 *
 * - 文字を少し大きく、行間を広くする
 * - 文字と背景のコントラスト比を 4.5 以上にする（WCAG 2.2 AA）
 *   AdminLTE の標準色は info 2.15・warning 2.19・success 3.18・primary 3.67 で基準に届かない
 * - キーボードで操作している場所が分かるようにする
 */

:root {
  --cssvc-info: #00718f;      /* 白文字とのコントラスト 5.59 */
  --cssvc-primary: #2c6e98;   /* 5.54 */
  --cssvc-success: #00733e;   /* 5.96 */
  --cssvc-danger: #c0392b;    /* 5.44 */
  --cssvc-teal: #1b6f6f;      /* 5.92 */
  --cssvc-warning: #f39c12;   /* 濃い文字と組み合わせる（7.52） */
  --cssvc-text: #1f2a30;
  --cssvc-muted: #5f6b73;     /* 白背景で 5.47 */
  --cssvc-focus: #ffbf47;
}

/* ---------- 文字 ---------- */
body,
.content-wrapper,
.main-footer {
  font-size: 15px;
  line-height: 1.7;
  color: var(--cssvc-text);
}
.content-header > h1 {
  font-size: 26px;
  font-weight: 700;
}
.content-header > h1 > small {
  font-size: 15px;
  color: var(--cssvc-muted);
}
.box-title {
  font-weight: 700;
}
.text-muted,
.help-block,
.box-comment .text-muted,
.description-text {
  color: var(--cssvc-muted) !important;
}
.table > tbody > tr > td,
.table > thead > tr > th {
  padding: 10px 8px;
  vertical-align: middle;
}

/* ---------- ボタン・ラベル・背景色 ---------- */
.btn-info, .label-info, .bg-aqua, .callout.callout-info, .alert-info {
  background-color: var(--cssvc-info) !important;
  border-color: var(--cssvc-info) !important;
  color: #fff !important;
}
.btn-primary, .label-primary, .bg-light-blue, .callout.callout-primary {
  background-color: var(--cssvc-primary) !important;
  border-color: var(--cssvc-primary) !important;
  color: #fff !important;
}
.btn-success, .label-success, .bg-green, .callout.callout-success, .alert-success {
  background-color: var(--cssvc-success) !important;
  border-color: var(--cssvc-success) !important;
  color: #fff !important;
}
.btn-danger, .label-danger, .bg-red, .callout.callout-danger, .alert-danger {
  background-color: var(--cssvc-danger) !important;
  border-color: var(--cssvc-danger) !important;
  color: #fff !important;
}
.bg-teal, .bg-teal-active {
  background-color: var(--cssvc-teal) !important;
  color: #fff !important;
}
.bg-aqua-active { background-color: #005d75 !important; color: #fff !important; }
.bg-green-active { background-color: #005c31 !important; color: #fff !important; }
.bg-light-blue-active { background-color: #24597b !important; color: #fff !important; }
.bg-red-active { background-color: #a5311f !important; color: #fff !important; }
.bg-yellow-active { background-color: #e08e0b !important; color: #1f1f1f !important; }
.widget-user-header a,
.widget-user-header .widget-user-desc {
  color: #fff !important;
}
/* 黄色の背景には濃い文字を使う */
.btn-warning, .label-warning, .bg-yellow, .callout.callout-warning, .alert-warning {
  background-color: var(--cssvc-warning) !important;
  border-color: #d68910 !important;
  color: #1f1f1f !important;
}
.callout.callout-warning a,
.bg-yellow a {
  color: #1f1f1f !important;
}
.btn:hover, .btn:focus {
  filter: brightness(0.9);
}
.small-box .icon {
  color: rgba(0, 0, 0, 0.25);
}
.small-box > .small-box-footer {
  color: #fff;
  background: rgba(0, 0, 0, 0.25);
}

/* 文章の中のリンクは下線で見分けられるようにする */
.content a:not(.btn):not(.label),
.callout a {
  text-decoration: underline;
}
/* 地図の操作ボタン（＋・－など）には下線を付けない */
.content .leaflet-control a,
.content .leaflet-bar a {
  text-decoration: none !important;
}

/* ---------- 表 ---------- */
/* 幅が足りないときは、表だけを横にスクロールさせる */
.dataTables_wrapper {
  overflow-x: auto;
}
.dataTables_wrapper .dataTables_filter input {
  font-size: 15px;
  padding: 6px 10px;
  height: auto;
}
.dataTables_wrapper .dataTables_info {
  color: var(--cssvc-muted);
}

/* ---------- お知らせ（新しい調査） ---------- */
.cssvc-news {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
.cssvc-news li {
  padding: 12px 15px;
  border-bottom: 1px solid #eef1f3;
}
.cssvc-news li:last-child {
  border-bottom: none;
}
.cssvc-news .label {
  margin-right: 8px;
  font-size: 12px;
}
.cssvc-news a {
  font-weight: 700;
}

/* ---------- 調査ページの操作ボタン ---------- */
.cssvc-actions {
  margin-bottom: 15px;
}
.cssvc-actions .btn {
  font-weight: 700;
  white-space: normal;
}

/* ---------- フッター ---------- */
.main-footer {
  font-size: 14px;
  color: var(--cssvc-muted);
}

/* ---------- サイドメニュー ---------- */
.skin-black .sidebar-menu > li > a {
  font-size: 15px;
  padding-top: 14px;
  padding-bottom: 14px;
}
.skin-black .sidebar-menu > li.header {
  color: #b8c7ce;
}

/* ---------- キーボードでの操作位置 ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible {
  outline: 3px solid var(--cssvc-focus) !important;
  outline-offset: 2px;
  box-shadow: 0 0 0 5px #1f1f1f !important;
}

/* ---------- 入力欄 ---------- */
.form-control {
  font-size: 15px;
  height: auto;
  padding: 8px 12px;
}
label {
  font-weight: 700;
}

/* ---------- 地図 ---------- */
#map {
  border-radius: 4px;
}
.leaflet-popup-content {
  font-size: 14px;
  line-height: 1.6;
}

/* ---------- スマートフォン ---------- */
@media (max-width: 767px) {
  .content-header > h1 {
    font-size: 22px;
  }
  .content {
    padding: 10px;
  }
  .table-responsive,
  .dataTables_wrapper {
    overflow-x: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---------- 画面内の案内文 ---------- */
.cssvc-guide {
  background: #eef6fb;
  border-left: 4px solid var(--cssvc-info);
  padding: 10px 14px;
  margin-bottom: 16px;
  font-size: 15px;
}

/* ======== トップページ（ゲスト向け）======== */
/* 導入 */
.cssvc-hero {
  background: linear-gradient(135deg, #e8f3ee 0%, #e3eef6 100%);
  border-radius: 8px;
  padding: 24px 24px 20px;
  margin-bottom: 22px;
}
.cssvc-hero-title {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 700;
  color: #1b4b36;
}
.cssvc-hero-lead {
  margin: 0 0 14px;
  font-size: 16px;
  max-width: 44em;
}
.cssvc-hero-actions {
  margin: 0;
}
.cssvc-hero-actions .btn {
  margin: 4px 6px 4px 0;
  font-weight: 700;
}

/* 活動の状況（数値） */
.cssvc-stats {
  margin-bottom: 8px;
}
.cssvc-stats .small-box h3 {
  font-size: 30px;
  font-weight: 700;
}
.cssvc-stats .small-box h3 sup {
  font-size: 15px;
  margin-left: 2px;
}
.cssvc-stats .small-box p {
  font-size: 14px;
}

/* 見出し */
.cssvc-section-head {
  margin: 26px 0 14px;
  font-size: 20px;
  font-weight: 700;
  padding-left: 12px;
  border-left: 6px solid var(--cssvc-info);
}
.cssvc-section-head small {
  font-size: 14px;
  color: var(--cssvc-muted);
  font-weight: 400;
}

/* 調査カード */
.cssvc-card-grid { margin-bottom: 8px; }
.cssvc-card {
  background: #fff;
  border: 1px solid #dce4e3;
  border-top: 5px solid #bdbdbd;
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 20px;
  height: calc(100% - 20px);
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}
.cssvc-card.is-active { border-top-color: var(--cssvc-success); }
.cssvc-card.is-closed { opacity: 0.92; }
.cssvc-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  flex-wrap: wrap;
  gap: 4px;
}
.cssvc-card-head .label { font-size: 12px; }
.cssvc-card-reports {
  font-size: 13px;
  color: var(--cssvc-muted);
  white-space: nowrap;
}
.cssvc-card-title {
  margin: 2px 0 8px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
}
.cssvc-card-meta {
  font-size: 13px;
  color: var(--cssvc-muted);
  margin-bottom: 10px;
}
.cssvc-card-desc {
  font-size: 14px;
  margin-bottom: 14px;
  flex-grow: 1;
}
.cssvc-card .btn {
  font-weight: 700;
}

/* ======== 調査ページ：ゲスト向けの参加のおさそい ======== */
.cssvc-join {
  background: #eef9f1;
  border: 1px solid #bfe3cc;
  border-left: 5px solid var(--cssvc-success);
  border-radius: 8px;
  padding: 16px 18px;
  margin-bottom: 18px;
}
.cssvc-join-text {
  font-size: 16px;
  margin: 0 0 12px;
}
.cssvc-join-note {
  font-size: 13px;
  color: var(--cssvc-muted);
}
.cssvc-join-actions {
  margin: 0;
}
.cssvc-join-actions .btn {
  font-weight: 700;
  margin: 4px 6px 4px 0;
}