/* Local site theme: colors sampled from the supplied Cognitive Center logo. */
:root {
  --cc-blue: #0caee0;
  --cc-blue-dark: #087ba7;
  --cc-blue-deep: #075b7b;
  --cc-ice: #a8def3;
  --cc-amber: #ffb84d;
  --cc-ink: #182b39;
  --cc-muted: #627786;
  --cc-line: #d9eaf2;
  --cc-paper: #ffffff;
  --cc-wash: #f4fbfe;
}
html { scroll-behavior: smooth; }
body.site-body {
  color: var(--cc-ink);
  font-family: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: linear-gradient(180deg, #f7fcff 0, #fff 340px);
}
a { color: var(--cc-blue-deep); text-underline-offset: 3px; }
a:hover { color: #07445d; }
:focus-visible { outline: 3px solid var(--cc-amber); outline-offset: 3px; }
.site-header {
  position: relative;
  z-index: 2;
  background: rgba(255,255,255,.96);
  border-top: 4px solid var(--cc-blue);
  border-bottom: 1px solid var(--cc-line);
  box-shadow: 0 8px 28px rgba(14, 80, 108, .055);
}
.site-header::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -2px;
  width: min(18vw, 220px);
  height: 3px;
  background: linear-gradient(90deg, var(--cc-blue), var(--cc-ice) 55%, var(--cc-amber));
}
.site-header-inner { min-height: 82px; padding-top: .6rem; padding-bottom: .6rem; }
.site-brand { display: inline-flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--cc-ink); min-width: 0; }
.site-brand:hover { color: var(--cc-ink); }
.site-brand-mark {
  display: grid;
  place-items: center;
  flex: 0 0 62px;
  width: 62px;
  height: 60px;
  overflow: hidden;
  border-radius: 13px;
  background: #050505;
  box-shadow: 0 4px 13px rgba(12, 105, 146, .18);
}
.site-brand-mark img { display: block; width: 58px; height: auto; }
.site-brand-copy { display: flex; flex-direction: column; min-width: 0; }
.site-brand-copy strong { font-size: 1.08rem; letter-spacing: .04em; }
.site-brand-copy small { color: var(--cc-muted); font-size: .67rem; letter-spacing: .06em; }
.site-nav { max-width: 100%; }
.site-nav a { color: #314c5c; text-decoration: none; border-radius: .55rem; padding: .38rem .62rem; font-size: .9rem; font-weight: 550; }
.site-nav a:hover, .site-nav a:focus-visible { color: var(--cc-blue-deep); background: #e8f7fd; }
.site-logout { margin: 0 0 0 .25rem; }
.site-main { position: relative; min-width: 0; }
.site-main::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  width: 270px;
  height: 190px;
  pointer-events: none;
  opacity: .7;
  background: radial-gradient(circle at 86% 24%, rgba(255,184,77,.28) 0 2px, transparent 3px),
              radial-gradient(circle at 53% 53%, rgba(12,174,224,.22) 0 2px, transparent 3px);
  background-size: 34px 34px, 42px 42px;
  mask-image: linear-gradient(90deg,transparent,#000);
}
.site-main h1, .site-main h2 { color: var(--cc-ink); font-weight: 700; letter-spacing: .01em; }
.site-main h1:not(.login-title) { margin-bottom: 1rem; }
.site-main h2 { padding-left: .7rem; border-left: 3px solid var(--cc-amber); }
.site-main p, .site-main li, .site-main dd { overflow-wrap: anywhere; }
.site-main .text-muted { color: var(--cc-muted) !important; }
.site-main .border.rounded, .site-main .card {
  border-color: var(--cc-line) !important;
  border-radius: .85rem !important;
  background: var(--cc-paper);
  box-shadow: 0 8px 25px rgba(12, 83, 111, .045);
}
.site-main .list-group { gap: .45rem; }
.site-main .list-group-item {
  border: 1px solid var(--cc-line);
  border-radius: .72rem !important;
  background: rgba(255,255,255,.97);
  box-shadow: 0 4px 14px rgba(12, 83, 111, .035);
}
.site-main .list-group-item:hover { border-color: #b5ddeb; background: #fbfeff; }
.site-main .table-responsive { border: 1px solid var(--cc-line); border-radius: .85rem; background: #fff; box-shadow: 0 8px 25px rgba(12, 83, 111, .04); }
.site-main .table { margin-bottom: 0; --bs-table-bg: transparent; --bs-table-border-color: var(--cc-line); }
.site-main .table thead { background: #eaf8fd; color: #244e61; }
.site-main .table th, .site-main .table td { padding: .8rem .9rem; vertical-align: middle; }
.site-main .table tbody tr:hover { background: #f8fcff; }
.site-main .alert-info { color: #184d65; background: #edf9fe; border-color: #c6e8f5; }
.site-main .alert-info a { font-weight: 650; }
.site-main form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.site-main form select, .site-main form textarea {
  max-width: 100%;
  border: 1px solid #c9dce7;
  border-radius: .58rem;
}
.site-main form input:not([type=checkbox]):not([type=radio]):not([type=hidden]):focus,
.site-main form select:focus, .site-main form textarea:focus {
  border-color: var(--cc-blue);
  box-shadow: 0 0 0 .22rem rgba(12,174,224,.16);
}
.site-main form p { max-width: 100%; }
.site-main form p > label { display: block; margin-bottom: .35rem; font-weight: 600; }
.btn-primary, .btn-success {
  --bs-btn-bg: var(--cc-blue-dark);
  --bs-btn-border-color: var(--cc-blue-dark);
  --bs-btn-hover-bg: var(--cc-blue-deep);
  --bs-btn-hover-border-color: var(--cc-blue-deep);
  --bs-btn-active-bg: var(--cc-blue-deep);
  --bs-btn-active-border-color: var(--cc-blue-deep);
}
.btn-outline-primary {
  --bs-btn-color: var(--cc-blue-deep);
  --bs-btn-border-color: var(--cc-blue-dark);
  --bs-btn-hover-bg: var(--cc-blue-dark);
  --bs-btn-hover-border-color: var(--cc-blue-dark);
  --bs-btn-active-bg: var(--cc-blue-deep);
  --bs-btn-active-border-color: var(--cc-blue-deep);
}
.btn-warning { --bs-btn-bg: var(--cc-amber); --bs-btn-border-color: var(--cc-amber); }
.btn { border-radius: .58rem; font-weight: 600; }
.site-main details { border-left: 2px solid var(--cc-ice); padding-left: .8rem; }
.site-main summary { cursor: pointer; color: var(--cc-blue-deep); font-weight: 600; }
.site-footer { color: var(--cc-muted); border-top: 1px solid var(--cc-line); background: #fff; }
.site-footer .container-xxl { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.2rem; }
.site-footer a { color: var(--cc-muted); }

/* Login uses the original black logo as a deliberate, contained accent. */
.login-page .site-main { display: flex; align-items: center; padding-top: clamp(2rem,6vh,5rem) !important; padding-bottom: clamp(2rem,6vh,5rem) !important; }
.login-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  width: min(100%, 1100px);
  min-height: 610px;
  margin-inline: auto;
  overflow: hidden;
  border: 1px solid var(--cc-line);
  border-radius: 1.25rem;
  background: #fff;
  box-shadow: 0 26px 70px rgba(20, 81, 105, .13);
}
.login-visual {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 2rem;
  color: #d7f2fc;
  background: radial-gradient(circle at 22% 15%, #102b3a 0, #07131b 43%, #03080c 100%);
  position: relative;
}
.login-visual::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 145px;
  height: 5px;
  background: linear-gradient(90deg,var(--cc-blue),var(--cc-ice),var(--cc-amber));
}
.login-visual-top { align-self: flex-start; display: flex; align-items: center; gap: .65rem; color: var(--cc-ice); font-size: .7rem; letter-spacing: .2em; }
.login-visual-line { width: 22px; height: 2px; background: var(--cc-amber); }
.login-logo { display: block; width: min(100%, 440px); height: auto; max-height: 480px; object-fit: contain; margin-block: auto; }
.login-visual-caption { margin: 0; align-self: flex-start; color: #aacddd; font-size: .9rem; letter-spacing: .1em; }
.login-panel { display: flex; justify-content: center; align-items: center; padding: clamp(2rem,5vw,4.5rem); background: #fff; }
.login-form-wrap { width: 100%; max-width: 360px; }
.login-eyebrow { display: inline-block; margin-bottom: 1rem; color: var(--cc-blue-deep); font-size: .74rem; font-weight: 700; letter-spacing: .11em; }
.login-eyebrow span { color: var(--cc-amber); padding-inline: .2rem; }
.login-title { font-size: clamp(1.9rem,3vw,2.5rem); margin-bottom: .6rem; }
.login-intro { color: var(--cc-muted); margin-bottom: 2rem; }
.login-form .form-label { font-weight: 650; color: #31495a; }
.login-form .form-control { min-height: 48px; background: #fcfeff; }
.login-submit { min-height: 48px; display: flex; align-items: center; justify-content: center; gap: .6rem; }
.login-submit span { font-size: 1.3rem; line-height: 1; }
.login-register { border-top: 1px solid var(--cc-line); margin-top: 2rem; padding-top: 1.2rem; color: var(--cc-muted); }
.login-register a { font-weight: 700; }
@media (max-width: 991.98px) {
  .site-header-inner { align-items: flex-start !important; }
  .site-nav { width: 100%; }
}
@media (max-width: 767.98px) {
  .site-brand-mark { flex-basis: 50px; width: 50px; height: 50px; border-radius: 10px; }
  .site-brand-mark img { width: 48px; }
  .site-brand-copy strong { font-size: .98rem; }
  .site-brand-copy small { font-size: .59rem; letter-spacing: 0; }
  .site-nav { gap: .15rem !important; }
  .site-nav a { padding: .3rem .5rem; font-size: .84rem; }
  .site-main { padding-top: 1.5rem !important; }
  .login-shell { grid-template-columns: 1fr; min-height: 0; }
  .login-visual { min-height: 250px; padding: 1rem 1.5rem 1.2rem; }
  .login-logo { width: min(67vw,230px); max-height: 200px; }
  .login-visual-top { font-size: .58rem; }
  .login-visual-caption { font-size: .75rem; }
  .login-panel { padding: 2rem 1.5rem 2.4rem; }
  .login-intro { margin-bottom: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
