@charset "UTF-8";
/**===============================================================
   [overrides] bootstrap
==================================================================
   @description
       Bootstrap / Rider(style.bundle.css, plugins.bundle.css) の
       標準クラスへの上書きはこのファイルに限定する。

       注意: @layer は使わない。Riderバンドルが <link>（レイヤー外）で
       読み込まれており、レイヤー外のCSSはレイヤー内より常に優先される
       ため、このファイルを @layer に入れると全ルールが無効になる
       （2026-08-16 実測確認済み）。読み込み順と詳細度で上書きする。
=================================================================*/

/* ------------------------------------------------------------------
 * .nav-link — ヘッダーの「院長/事務長様へ」
 * DSのText Link色（Secondary #23669C）。
 * `.navbar-nav .nav-link` が既定色を持つため詳細度を上げる。
 * SP側のリンクは .navbar-nav の外にあるので .navbar 起点にする。
 * 末尾の外部リンクアイコンも `.ki-duotone` が独自に色を持つため一緒に指定する。
 * ------------------------------------------------------------------ */
.navbar .nav-link.text-link,
.navbar .nav-link.text-link .ki-duotone {
  color: var(--bs-link-color);
}

.navbar .nav-link.text-link:hover,
.navbar .nav-link.text-link:hover .ki-duotone {
  color: var(--bs-link-hover-color);
}

/* ------------------------------------------------------------------
 * .ki-duotone — ヘッダーのベル
 * 「院長/事務長様へ」と同じText Link色に揃える。
 * keenicons は `.ki-duotone` 自身が color:var(--bs-text-muted) を持ち
 * 親の色を継承しないため、アイコン側に直接指定する。
 * デュオトーンの濃淡は path ごとの opacity で表現されるので色は1つでよい。
 * ------------------------------------------------------------------ */
.nav-news-feed-button .ki-duotone {
  color: var(--bs-link-color);
}

/* ------------------------------------------------------------------
 * .btn-close — お知らせフィードのCloseボタン
 * サイズ変更
 * ------------------------------------------------------------------ */
.nav-news-feed .btn-close {
    width: 8px;
    height: 8px;
    background-size: cover;
}

/* ------------------------------------------------------------------
 * .btn-secondary — お知らせフィードの「切替タブ」「未読だけ表示」ボタン
 * DS Tertiary 相当の配色。
 * ------------------------------------------------------------------ */
.nav-news-feed .btn-secondary {
  border: none !important;
  background-color: var(--bs-gray-100) !important;
  color: var(--bs-text-secondary) !important;
}

.nav-news-feed .btn.btn-secondary:hover:not(.btn-active) {
  border: none !important;
  background-color: var(--bs-secondary-clarity) !important;
  color: var(--bs-secondary) !important;
}

.nav-news-feed .nav-line-tabs .nav-item .nav-link {
  border-color: var(--bs-text-gray-300);
  color: var(--bs-text-gray-300);
}

.nav-news-feed .nav-line-tabs .nav-item .nav-link:hover,
.nav-news-feed .nav-line-tabs .nav-item .nav-link.active {
  border-color: var(--bs-secondary) !important;
  color: var(--bs-text-gray-800) !important;
}

/* ------------------------------------------------------------------
 * .alert — アラート先頭のアイコン
 * アラート内のアイコンは Icon MD(30px) を標準とする。
 * keenicons は自身が font-size:1rem を持ち親から継承しないため、
 * ここで一括指定しておけばマークアップ側でのサイズ指定は不要になる。
 * 本文中のインラインアイコンを巻き込まないよう直下の子に限定する。
 * ------------------------------------------------------------------ */
.alert > .ki-duotone,
.alert > .ki-outline,
.alert > .ki-solid {
  font-size: 30px;
  line-height: 1;
}

/* ------------------------------------------------------------------
 * .breadcrumb — パンくず (v2.layouts.breadcrumb_top)
 * Figma: pankuzu Navigation — 区切り "/" は #B5B5C3、現在地は #3F4254
 * Rider は .breadcrumb-item:after を区切りに使うが色指定を持たない。
 * ------------------------------------------------------------------ */
/* 区切り "/" は Text-icon/Disabled */
.breadcrumb .breadcrumb-item:after {
  color: var(--bs-text-gray-400);
}

/* 最終要素以外は Text-icon/Secondary。
   Bladeは中間要素にも .active を付けてしまうため、classではなく位置で判定する。
   色はパレット(--bs-gray-*)ではなく意味トークンを参照する。 */
.breadcrumb .breadcrumb-item,
.breadcrumb .breadcrumb-item a {
  color: var(--bs-text-secondary);
}

/* 現在地（最終要素）は Text-icon/Primary */
.breadcrumb .breadcrumb-item:last-child,
.breadcrumb .breadcrumb-item:last-child a {
  color: var(--bs-text-primary);
}

.breadcrumb .breadcrumb-item a:hover {
  color: var(--bs-primary);
}

/* badge [お知らせ・ベルマークのお知らせリスト共通]
  -------------------------------------------------------------- */
.badge.app-news-badge {
  background-color: #777;
  color: #FFF;
}
.badge.app-news-badge.important {
  background-color: var(--bs-danger);
  color: var(--bs-danger-inverse);
}
.badge.app-news-badge.news,
.badge.app-news-badge.seminar,
.badge.app-news-badge.update,
.badge.app-news-badge.columns,
.badge.app-news-badge.campaign {
  background-color: #E8F4F8; /* TODO: css変数があれば差し替え、なければ作成 */
  color: #54C1F3
}
.badge.app-news-badge.feature {
  background-color: var(--bs-danger-light);
  color: var(--bs-danger);
}
.badge.app-news-badge.system {
  background-color: var(--bs-secondary-inverse);
  color: var(--bs-secondary);
}

/* news/index [動画サイト：お知らせ一覧]
   hoverの調整
  -------------------------------------------------------------- */
#page-news .app-news-list-item a:hover {
  background-color: var(--bs-gray-100);
}
#page-news .app-news-list-item a:hover .app-news-title {
  text-decoration: none !important;
}

/* btn [お知らせ・TinyMCEエディタプレビュー]
  -------------------------------------------------------------- */
#news-editor-add-button-preview .btn,
.tox-dialog .news-template-item .btn {
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: .375rem .75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: .25rem;
  transition: color .15s
      ease-in-out, background-color .15s
      ease-in-out, border-color .15s
      ease-in-out, box-shadow .15s
      ease-in-out;
  text-decoration: none;
  border-radius: 50vw;
  padding: 0.375rem 1rem;
  pointer-events: none;
}
#news-editor-add-button-preview .btn-info,
.tox-dialog .news-template-item .btn-info {
  background-color: #f26565;
  border-color: #fb7968;
  color: #fff;
}
#news-editor-add-button-preview .btn-success,
.tox-dialog .news-template-item .btn-success {
  background-color: #28a745;
  border-color: #28a745;
  color: #fff;
}
#news-editor-add-button-preview .btn-secondary,
.tox-dialog .news-template-item .btn-secondary {
  background-color: #fff;
  border-color: #ccc;
  color: #333;
}