/* =========================
   hera color (Bootstrap 5.3)
   ========================= */
@charset "utf-8";

/* ---- Theme tokens ---- */
:root {
  --thema_color: #663366;         /* メイン：深紫 */
  --thema_color-600: #552b55;
  --thema_color-700: #442244;

  --link_color: #823282;
  --link_visited_color: #5E225E;

  --ring: rgba(130, 50, 130, .45);

  --footer-grad-1: #1b1520;       /* パープル系の暗グレー */
  --footer-grad-2: #2a1f30;
  --footer-grad-3: #3d2b45;
  --footer-link: #cba4d6;
  --footer-link-hover: #fff;
}

@media (prefers-color-scheme: dark) {
  :root {
    --thema_color: #663366;
    --thema_color-600: #552b55;
    --thema_color-700: #442244;

    --link_color: #F8D1F8;
    --link_visited_color: #A87FA8;
    --footer-link: #e2c6eb;
  }
}

/* ---- Focus ring ---- */
.btn-primary:focus,
.btn-primary:active,
.btn-primary:focus-visible {
  box-shadow: 0 0 0 .25rem var(--ring);
}

/* =========================
   Header（立体感グラデ）
   ========================= */
.head_bg_color {
  position: relative;
  background: linear-gradient(
    to bottom right,
    rgba(102, 51, 102, 0.95) 0%,  /* 上：濃い紫 */
    #884488 50%,                  /* 中間：やや明るい赤紫 */
    var(--thema_color) 100%       /* 下：ブランドカラー */
  );
  color: #fff;
}
.head_bg_color::before {
  content:"";
  position:absolute; inset:0 0 auto 0; height:1px;
  background: linear-gradient(90deg,#4A1572 0%, #a4508b 100%);
  opacity:.45; pointer-events:none;
}
.head_bg_color .row { padding-top:8px; padding-bottom:8px; }

/* サイトメニュータブ */
span.site_menu_hera { background-color: var(--thema_color); }
span.site_menu_hera a { color: #fff !important; }

/* =========================
   Links / Buttons
   ========================= */
a:link,
a.list-group-item { color: var(--link_color); }
a:visited { color: var(--link_visited_color); }

a.btn.btn-primary,
a.btn.btn-danger,
#page-top > a:link { color: #fff !important; }

/* Page top button */
.pagetopbutton,
#page-top > a.btn,
#page-top > a.btn.btn-primary {
  background-color: var(--thema_color) !important;
  border-color: var(--thema_color-600);
  color:#fff;
}

/* =========================
   Footer（青みグレー寄り暗紫グラデ）
   ========================= */
.footer {
  background: linear-gradient(135deg,
    var(--footer-grad-1) 0%,
    var(--footer-grad-2) 40%,
    var(--footer-grad-3) 100%
  ) !important;
  color: #ddd;
}
.footer a { color: var(--footer-link); }
.footer a:hover { color: var(--footer-link-hover); }

.footer_trout { display:none; }
footer li > a { color:#FFFF80 !important; } /* 既存踏襲 */

/* =========================
   Pagination
   ========================= */
.pagination .page-item.active .page-link {
  background-color: #823282;
  border-color: #5E225E;
  color: #fff;
}
.pagination .page-link {
  color: #823282;
  border-color: rgba(130,50,130,.25);
}
.pagination .page-link:hover {
  color: #5E225E;
  border-color: rgba(130,50,130,.4);
}
.pagination .page-item.disabled .page-link { opacity:.5; }

/* ブログページ専用色（維持） */
#blog_main .page-link {
  background-color:#009900;
  color:#fff;
  border-color:#006600;
}
#blog_main .page-link:hover { background-color:#009900; }
#blog_main li.page-item.disabled { opacity:.2; }
#blog .btn-primary {
  background-color:#009900;
  border-color:#006600;
  color:#fff;
}

/* =========================
   Dark mode accents
   ========================= */
@media (prefers-color-scheme: dark) {
  .head_bg_color {
    background: linear-gradient(
      to bottom right,
      #442244 0%,
      #5c2e5c 50%,
      #331933 100%
    );
  }

  .badge-warning,.btn-warning {
    background-color:#9E9D24; border-color:#827717; color:#fff;
  }
  .badge-primary,.btn-primary {
    background-color:#1565C0; border-color:#0D47A1; color:#fff;
  }
  .badge-success,.btn-success {
    background-color:#2E7D32; border-color:#1B5E20; color:#fff;
  }
  .badge-danger,.btn-danger {
    background-color:#C62828; border-color:#B71C1C; color:#fff;
  }
}