/**
 * assets/css/user-theme.css
 *
 * ユーザー向けフロント（survey/・mypage/・company/）専用の配色テーマ。
 * 利用者に看護師の女性が多いことを踏まえ、ローズピンク系のやわらかい配色にする。
 *
 * 読み込み順: core.css → demo.css → custom.css → user-theme.css（本ファイル）
 * admin/ 配下（管理画面）には読み込ませないこと。
 *
 * ※ LINE関連ボタン（#06C755系）はインラインstyleで直接指定されており本CSSでは触らない。
 * ※ alert-danger等の意味色（エラー赤・成功緑）はBootstrap既定のまま変更しない。
 */

/* Zen Maru Gothic は各ヘッダの<link>で読み込み済み(ここでの@importは二重読み込みになるため行わない) */

:root {
  --user-theme-primary:      #d95c85;
  --user-theme-primary-hover:#c24d74;
  --user-theme-primary-bg:   #fbe9f0;
  --user-theme-primary-text: #c24d74;
}

body {
  background-color: #fdf6f8;
  font-family: 'Zen Maru Gothic', 'Inter', sans-serif;
}

/* ===== やわらかさの演出 ===== */
.card {
  border-radius: 1rem;
  box-shadow: 0 4px 16px rgba(217, 92, 133, .08);
  border: none;
}

.btn {
  border-radius: 0.75rem;
}

.form-control,
.form-select {
  border-radius: 0.65rem;
}

/* ===== 一般リンク（ナビゲーションは既存のまま） ===== */
a:not(.nav-link):not(.dropdown-item):not(.navbar-brand):not(.btn):not(.page-link) {
  color: var(--user-theme-primary);
}
a:not(.nav-link):not(.dropdown-item):not(.navbar-brand):not(.btn):not(.page-link):hover {
  color: var(--user-theme-primary-hover);
}

/* ===== テキスト・背景色（プライマリ） ===== */
.text-primary {
  color: var(--user-theme-primary) !important;
}

.bg-primary {
  background-color: var(--user-theme-primary) !important;
}

.bg-label-primary {
  background-color: var(--user-theme-primary-bg) !important;
  color: var(--user-theme-primary-text) !important;
}

/* ===== バッジ ===== */
.badge.bg-primary {
  background-color: var(--user-theme-primary) !important;
}
.badge.bg-label-primary {
  background-color: var(--user-theme-primary-bg) !important;
  color: var(--user-theme-primary-text) !important;
}

/* ===== ボタン（primary） ===== */
.btn-primary {
  background-color: var(--user-theme-primary);
  border-color: var(--user-theme-primary);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-check:checked + .btn-primary,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
  background-color: var(--user-theme-primary-hover) !important;
  border-color: var(--user-theme-primary-hover) !important;
}
.btn-primary:focus,
.btn-primary.focus,
.btn-check:focus + .btn-primary {
  box-shadow: 0 0 0 0.2rem rgba(217, 92, 133, .35) !important;
}

/* ===== ボタン（outline-primary） ===== */
.btn-outline-primary {
  color: var(--user-theme-primary);
  border-color: var(--user-theme-primary);
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
  background-color: var(--user-theme-primary) !important;
  border-color: var(--user-theme-primary) !important;
  color: #fff !important;
}
.btn-outline-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(217, 92, 133, .25) !important;
}

/* ===== プログレスバー ===== */
.progress-bar {
  background-color: var(--user-theme-primary);
}

/* ===== フォーム ===== */
.form-control:focus,
.form-select:focus {
  border-color: var(--user-theme-primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(217, 92, 133, .25) !important;
}

.form-check-input:checked {
  background-color: var(--user-theme-primary) !important;
  border-color: var(--user-theme-primary) !important;
}
.form-check-input:focus {
  border-color: var(--user-theme-primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(217, 92, 133, .25) !important;
}

/* ===== タブUI（survey/auth.php のログイン/新規登録タブ等） ===== */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: var(--user-theme-primary) !important;
  color: #fff !important;
}
.nav-tabs .nav-link.active {
  color: var(--user-theme-primary-text);
  border-color: var(--user-theme-primary);
}

/* ===== ページネーション（mypage/responses.php・point_history.php） ===== */
.page-link {
  color: var(--user-theme-primary);
}
.page-link:hover,
.page-link:focus {
  color: var(--user-theme-primary-hover);
  box-shadow: 0 0 0 0.2rem rgba(217, 92, 133, .2);
}
.page-item.active .page-link {
  background-color: var(--user-theme-primary) !important;
  border-color: var(--user-theme-primary) !important;
}
