:root {
  --educ-purple: #302e6b;
  --educ-purple-deep: #26245e;
  --educ-purple-soft: #eeedf8;
  --educ-yellow: #ffc800;
  --educ-ink: #20202f;
  --educ-muted: #686979;
  --educ-page: #f5f5f8;
  --educ-border: #e1e1e9;
  --educ-success: #17674e;
}

body {
  min-height: 100vh;
  background: var(--educ-page);
  color: var(--educ-ink);
  font-family: "Noto Sans JP", "Hiragino Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a { color: var(--educ-purple); }
a:hover { color: var(--educ-purple-deep); }

.required-mark::after { content: " *"; color: #bf1f35; }
a:focus, button:focus, input:focus, select:focus, textarea:focus {
  outline: 3px solid rgba(255, 200, 0, .72);
  outline-offset: 2px;
}

.site-header {
  position: relative;
  z-index: 2;
  min-height: 78px;
  background: var(--educ-purple-deep);
  box-shadow: 0 2px 12px rgba(31, 30, 76, .18);
}
.site-header .container { min-height: 78px; }
.site-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  text-decoration: none;
}
.site-brand:hover { color: #fff; }
.site-brand-mark {
  display: grid;
  place-items: center;
  width: 56px;
  height: 52px;
  padding: 5px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 2px 7px rgba(0,0,0,.16);
}
.site-brand-logo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
}
.site-brand-title { display: grid; line-height: 1.25; }
.site-brand-title strong { font-size: .98rem; font-weight: 700; letter-spacing: .02em; }
.site-brand-title span { margin-top: 3px; color: rgba(255,255,255,.68); font-size: .72rem; }
.site-header .navbar-toggler { border-color: rgba(255,255,255,.42); }
.site-header .navbar-nav { gap: 2px; }
.site-header .nav-link {
  padding: .6rem .7rem !important;
  border-radius: .45rem;
  color: rgba(255,255,255,.78) !important;
  font-size: .91rem;
  white-space: nowrap;
}
.site-header .nav-link:hover, .site-header .nav-link:focus { color: #fff !important; background: rgba(255,255,255,.11); }
.site-header .btn-link.nav-link { border: 0; }
.site-header .nav-user {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 13rem;
  min-height: 42px;
  padding: .3rem .7rem;
  overflow: hidden;
  color: rgba(255,255,255,.78);
  font-size: .82rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: default;
}
.site-header .nav-user-label { margin-bottom: 2px; color: rgba(255,255,255,.52); font-size: .66rem; letter-spacing: .05em; }
.site-header .dropdown-menu { min-width: 10rem; border: 1px solid var(--educ-border); border-radius: .7rem; box-shadow: 0 8px 24px rgba(30,29,67,.16); }
.site-header .dropdown-item { padding: .55rem .9rem; color: var(--educ-ink); font-size: .9rem; }
.site-header .dropdown-item:hover, .site-header .dropdown-item:focus { background: var(--educ-purple-soft); color: var(--educ-purple-deep); }

@media (min-width: 992px) {
  .site-header .navbar-nav { flex-wrap: nowrap; align-items: center; }
}

main.container { max-width: 1180px; padding-top: 2rem !important; padding-bottom: 2rem !important; }
h1, h2, h3, h4, h5, h6 { color: var(--educ-ink); font-weight: 650; }
h1.h4, h2.h4 { font-size: 1.45rem; }

.card {
  border: 1px solid var(--educ-border);
  border-radius: .9rem;
  box-shadow: 0 3px 15px rgba(35, 34, 72, .045);
}
.card-header { border-bottom-color: var(--educ-border); background: #fff; font-weight: 650; }
.table { --bs-table-bg: transparent; --bs-table-border-color: var(--educ-border); }
.table > :not(caption) > * > * { padding-top: .85rem; padding-bottom: .85rem; }
.form-control, .form-select { border-color: #cfcfda; border-radius: .55rem; min-height: 2.55rem; }
.form-control:focus, .form-select:focus { border-color: var(--educ-purple); box-shadow: 0 0 0 .22rem rgba(48,46,107,.16); }
.form-check-input:checked { background-color: var(--educ-purple); border-color: var(--educ-purple); }
.btn { border-radius: .55rem; font-weight: 600; padding: .52rem .85rem; }
.btn-primary { --bs-btn-bg: var(--educ-purple); --bs-btn-border-color: var(--educ-purple); --bs-btn-hover-bg: var(--educ-purple-deep); --bs-btn-hover-border-color: var(--educ-purple-deep); --bs-btn-active-bg: var(--educ-purple-deep); --bs-btn-active-border-color: var(--educ-purple-deep); --bs-btn-disabled-bg: var(--educ-purple); --bs-btn-disabled-border-color: var(--educ-purple); }
.btn-outline-primary { --bs-btn-color: var(--educ-purple); --bs-btn-border-color: var(--educ-purple); --bs-btn-hover-bg: var(--educ-purple); --bs-btn-hover-border-color: var(--educ-purple); --bs-btn-active-bg: var(--educ-purple-deep); --bs-btn-active-border-color: var(--educ-purple-deep); }
.badge { padding: .45em .65em; border-radius: 999px; font-weight: 600; }
.alert { border-radius: .8rem; border-width: 1px; }
.status-badge { font-size: .85em; }

.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.35rem; }
.page-heading .eyebrow { margin-bottom: .35rem; color: var(--educ-purple); font-size: .73rem; font-weight: 750; letter-spacing: .08em; }
.page-heading h1 { margin: 0; }
.dashboard-stat { position: relative; overflow: hidden; }
.dashboard-stat::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--educ-yellow); }
.dashboard-stat .stat-number { color: var(--educ-purple-deep); font-size: 1.65rem; font-weight: 750; }
.student-guide-card { border-left: 4px solid var(--educ-yellow); }
.site-footer { max-width: 1180px; color: var(--educ-muted); }
.site-footer hr { border-color: var(--educ-border); }

.login-layout { min-height: calc(100vh - 184px); align-items: center; }
.login-card { overflow: hidden; }
.login-brand-panel { padding: 2rem 1.75rem 1.5rem; background: linear-gradient(135deg, #292764, #3b397f); color: #fff; }
.login-logo-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 112px;
  padding: 10px 14px;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,.14);
}
.login-logo-frame img { display: block; width: min(300px, 100%); height: 88px; object-fit: contain; object-position: center; }
.login-brand-panel p { margin: .8rem 0 0; color: rgba(255,255,255,.76); font-size: .88rem; }

@media (max-width: 991.98px) {
  .site-header .navbar-collapse { padding: .7rem 0 1rem; }
  .site-header .navbar-nav { border-top: 1px solid rgba(255,255,255,.14); padding-top: .55rem; }
}
@media (max-width: 575.98px) {
  .site-header, .site-header .container { min-height: 68px; }
  .site-brand-mark { width: 48px; height: 44px; padding: 4px; border-radius: 10px; }
  .site-brand-title span { display: none; }
  .site-brand-title strong { font-size: .86rem; }
  main.container { padding-top: 1.35rem !important; }
  .page-heading { align-items: start; flex-direction: column; }
  .page-heading .btn { width: 100%; }
  .login-brand-panel { padding: 1.5rem; }
}
