:root {
  font-size: var(--theme-default-font-size);
  --theme-default-font-size: 16px;
  --theme-font-serif: "Noto Serif", "Noto Serif SC", Georgia, serif;
  --theme-font-sans: "Noto Sans", "Noto Sans SC", Helvetica, sans-serif;
  --bs-body-font-family: var(--theme-font-serif);
  --bs-border-radius: 0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-border-radius-xl: 0;
  --bs-border-radius-xxl: 0;
}

/* =====================================================
   Bootstrap 5 — Complete Color Override
   Primary:   #075f73
   Info:      #afccd0
   Link:      #075f73  /  hover: #526e7c
   ===================================================== */

/* ─── CSS custom properties ──────────────────────────── */
:root {
  --bs-primary: #075f73;
  --bs-primary-rgb: 7, 95, 115;

  --bs-info: #afccd0;
  --bs-info-rgb: 175, 204, 208;

  --bs-link-color: #075f73;
  --bs-link-color-rgb: 7, 95, 115;
  --bs-link-hover-color: #054e5f;
  --bs-link-hover-color-rgb: 5, 78, 95;

  /* Derived shades */
  --bs-primary-dark: #054e5f;
  --bs-primary-darker: #044550;
  --bs-primary-light: #d0e8ed;
  --bs-primary-border: #a8d0d8;
  --bs-primary-focus-shadow: rgba(7, 95, 115, 0.25);

  --bs-info-dark: #94b5ba;
  --bs-info-darker: #7d9ea3;
  --bs-info-light: #eaf4f5;
  --bs-info-border: #c5e2e5;
  --bs-info-text: #4a7880;
  --bs-info-focus-shadow: rgba(175, 204, 208, 0.25);
}

/* ─── Links ──────────────────────────────────────────── */
a {
  color: var(--bs-link-color);
  text-decoration-color: var(--bs-link-color);
}

a:hover {
  color: var(--bs-link-hover-color);
  text-decoration-color: var(--bs-link-hover-color);
}

a:focus-visible {
  outline-color: var(--bs-link-color);
}

/* ─── Solid buttons ──────────────────────────────────── */
.btn.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary-dark);
  --bs-btn-hover-border-color: var(--bs-primary-dark);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-primary-darker);
  --bs-btn-active-border-color: var(--bs-primary-darker);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
}

.btn.btn-primary:hover {
  background-color: var(--bs-primary-dark);
  border-color: var(--bs-primary-dark);
}

.btn.btn-primary:active,
.btn.btn-primary.active {
  background-color: var(--bs-primary-darker);
  border-color: var(--bs-primary-darker);
}

.btn.btn-primary:disabled,
.btn.btn-primary.disabled {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  opacity: 0.65;
}

.btn.btn-primary:focus,
.btn.btn-primary:focus-visible {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

.btn.btn-info {
  --bs-btn-color: #212529;
  --bs-btn-bg: var(--bs-info);
  --bs-btn-border-color: var(--bs-info);
  --bs-btn-hover-color: #212529;
  --bs-btn-hover-bg: var(--bs-info-dark);
  --bs-btn-hover-border-color: var(--bs-info-dark);
  --bs-btn-active-color: #212529;
  --bs-btn-active-bg: var(--bs-info-darker);
  --bs-btn-active-border-color: var(--bs-info-darker);
  --bs-btn-disabled-color: #212529;
  --bs-btn-disabled-bg: var(--bs-info);
  --bs-btn-disabled-border-color: var(--bs-info);
  --bs-btn-focus-shadow-rgb: var(--bs-info-rgb);
  background-color: var(--bs-info);
  border-color: var(--bs-info);
  color: #212529;
}

.btn.btn-info:hover {
  background-color: var(--bs-info-dark);
  border-color: var(--bs-info-dark);
}

.btn.btn-info:active,
.btn.btn-info.active {
  background-color: var(--bs-info-darker);
  border-color: var(--bs-info-darker);
}

.btn.btn-info:disabled,
.btn.btn-info.disabled {
  background-color: var(--bs-info);
  border-color: var(--bs-info);
  opacity: 0.65;
}

.btn.btn-info:focus,
.btn.btn-info:focus-visible {
  background-color: var(--bs-info);
  border-color: var(--bs-info);
  box-shadow: 0 0 0 0.25rem var(--bs-info-focus-shadow);
}

/* ─── Outline buttons ────────────────────────────────── */
.btn.btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-primary-darker);
  --bs-btn-active-border-color: var(--bs-primary-darker);
  --bs-btn-disabled-color: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  background-color: transparent;
  border-color: var(--bs-primary);
  color: var(--bs-primary);
}

.btn.btn-outline-primary:hover {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
}

.btn.btn-outline-primary:active,
.btn.btn-outline-primary.active {
  background-color: var(--bs-primary-darker);
  border-color: var(--bs-primary-darker);
  color: #fff;
}

.btn.btn-outline-primary:disabled,
.btn.btn-outline-primary.disabled {
  background-color: transparent;
  border-color: var(--bs-primary);
  color: var(--bs-primary);
  opacity: 0.65;
}

.btn.btn-outline-primary:focus,
.btn.btn-outline-primary:focus-visible {
  box-shadow: 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

.btn.btn-outline-info {
  --bs-btn-color: var(--bs-info);
  --bs-btn-border-color: var(--bs-info);
  --bs-btn-hover-color: #212529;
  --bs-btn-hover-bg: var(--bs-info);
  --bs-btn-hover-border-color: var(--bs-info);
  --bs-btn-active-color: #212529;
  --bs-btn-active-bg: var(--bs-info-darker);
  --bs-btn-active-border-color: var(--bs-info-darker);
  --bs-btn-disabled-color: var(--bs-info);
  --bs-btn-disabled-border-color: var(--bs-info);
  --bs-btn-focus-shadow-rgb: var(--bs-info-rgb);
  background-color: transparent;
  border-color: var(--bs-info);
  color: var(--bs-info);
}

.btn.btn-outline-info:hover {
  background-color: var(--bs-info);
  border-color: var(--bs-info);
  color: #212529;
}

.btn.btn-outline-info:active,
.btn.btn-outline-info.active {
  background-color: var(--bs-info-darker);
  border-color: var(--bs-info-darker);
  color: #212529;
}

.btn.btn-outline-info:disabled,
.btn.btn-outline-info.disabled {
  background-color: transparent;
  border-color: var(--bs-info);
  color: var(--bs-info);
  opacity: 0.65;
}

.btn.btn-outline-info:focus,
.btn.btn-outline-info:focus-visible {
  box-shadow: 0 0 0 0.25rem var(--bs-info-focus-shadow);
}

/* ─── Badges ─────────────────────────────────────────── */
.badge.bg-primary {
  background-color: var(--bs-primary);
  color: #fff;
}

.badge.bg-info {
  background-color: var(--bs-info);
  color: #212529;
}

/* ─── Alerts ─────────────────────────────────────────── */
.alert.alert-primary {
  --bs-alert-color: var(--bs-primary-darker);
  --bs-alert-bg: var(--bs-primary-light);
  --bs-alert-border-color: var(--bs-primary-border);
  background-color: var(--bs-primary-light);
  border-color: var(--bs-primary-border);
  color: var(--bs-primary-darker);
}

.alert.alert-primary .alert-link {
  color: var(--bs-primary-darker);
}

.alert.alert-info {
  --bs-alert-color: var(--bs-info-text);
  --bs-alert-bg: var(--bs-info-light);
  --bs-alert-border-color: var(--bs-info-border);
  background-color: var(--bs-info-light);
  border-color: var(--bs-info-border);
  color: var(--bs-info-text);
}

.alert.alert-info .alert-link {
  color: var(--bs-info-text);
}

/* ─── Form controls ──────────────────────────────────── */
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

.form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.form-check-input:checked:focus {
  box-shadow: 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

.form-range::-webkit-slider-thumb {
  background-color: var(--bs-primary);
}

.form-range::-moz-range-thumb {
  background-color: var(--bs-primary);
}

.form-range:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

.form-range:focus::-moz-range-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

/* ─── Input groups ───────────────────────────────────── */
.input-group-text {
  color: var(--bs-primary);
  border-color: var(--bs-primary);
}

/* ─── Nav links ──────────────────────────────────────── */
.nav-link {
  color: var(--bs-primary);
}

.nav-link:hover,
.nav-link:focus {
  color: var(--bs-link-hover-color);
}

.nav-link.active {
  color: var(--bs-primary-darker);
}

/* ─── Nav pills ──────────────────────────────────────── */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: var(--bs-primary);
  color: #fff;
}

/* ─── Nav tabs ───────────────────────────────────────── */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: var(--bs-primary);
  border-color: #dee2e6 #dee2e6 #fff;
}

/* ─── Navbar ─────────────────────────────────────────── */
.navbar-light .navbar-brand,
.navbar-light .navbar-brand:hover,
.navbar-light .navbar-brand:focus {
  color: var(--bs-primary);
}

.navbar-light .navbar-nav .nav-link {
  color: var(--bs-primary);
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus {
  color: var(--bs-link-hover-color);
}

.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .show > .nav-link {
  color: var(--bs-primary-darker);
}

/* ─── Pagination ─────────────────────────────────────── */
.page-link {
  color: var(--bs-primary);
}

.page-link:hover {
  color: var(--bs-link-hover-color);
}

.page-link:focus {
  box-shadow: 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

.page-item.active .page-link {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
}

/* ─── Breadcrumb ─────────────────────────────────────── */
.breadcrumb-item a {
  color: var(--bs-primary);
}

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

.breadcrumb-item.active {
  color: var(--bs-link-hover-color);
}

/* ─── Dropdowns ──────────────────────────────────────── */
.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--bs-primary-light);
  color: var(--bs-primary-darker);
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: var(--bs-primary);
  color: #fff;
}

/* ─── List group ─────────────────────────────────────── */
.list-group-item-action:hover,
.list-group-item-action:focus {
  color: var(--bs-primary-darker);
  background-color: var(--bs-primary-light);
}

.list-group-item-action:active {
  background-color: var(--bs-primary-border);
  color: var(--bs-primary-darker);
}

.list-group-item.active {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
}

.list-group-item-primary {
  background-color: var(--bs-primary-light);
  color: var(--bs-primary-darker);
}

.list-group-item-info {
  background-color: var(--bs-info-light);
  color: var(--bs-info-text);
}

/* ─── Progress bar ───────────────────────────────────── */
.progress-bar {
  background-color: var(--bs-primary);
}

.progress-bar.bg-info {
  background-color: var(--bs-info);
}

/* ─── Spinners ───────────────────────────────────────── */
.spinner-border.text-primary,
.spinner-grow.text-primary {
  color: var(--bs-primary);
}

.spinner-border.text-info,
.spinner-grow.text-info {
  color: var(--bs-info);
}

/* ─── Tooltips ───────────────────────────────────────── */
.tooltip.bs-tooltip-primary .tooltip-inner {
  background-color: var(--bs-primary);
}

/* ─── Popovers ───────────────────────────────────────── */
.popover-header {
  background-color: var(--bs-primary);
  color: #fff;
  border-bottom-color: var(--bs-primary-dark);
}

/* ─── Accordion ──────────────────────────────────────── */
.accordion-button:not(.collapsed) {
  color: var(--bs-primary);
  background-color: var(--bs-primary-light);
  box-shadow: inset 0 -1px 0 var(--bs-primary-focus-shadow);
}

.accordion-button:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

/* ─── Tables ─────────────────────────────────────────── */
.table-primary {
  --bs-table-color: var(--bs-primary-darker);
  --bs-table-bg: var(--bs-primary-light);
  --bs-table-border-color: var(--bs-primary-border);
  --bs-table-striped-color: var(--bs-primary-darker);
  --bs-table-active-color: var(--bs-primary-darker);
  --bs-table-hover-color: var(--bs-primary-darker);
}

.table-info {
  --bs-table-color: var(--bs-info-text);
  --bs-table-bg: var(--bs-info-light);
  --bs-table-border-color: var(--bs-info-border);
  --bs-table-striped-color: var(--bs-info-text);
  --bs-table-active-color: var(--bs-info-text);
  --bs-table-hover-color: var(--bs-info-text);
}

/* ─── Offcanvas & modals ─────────────────────────────── */
.modal .btn-close:focus,
.offcanvas .btn-close:focus {
  box-shadow: 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

/* ─── Close button ───────────────────────────────────── */
.btn-close:focus {
  box-shadow: 0 0 0 0.25rem var(--bs-primary-focus-shadow);
}

/* ─── Text & background utilities ───────────────────── */
.text-primary { color: var(--bs-primary); }
.text-info    { color: var(--bs-info)   ; }

.bg-primary { background-color: var(--bs-primary) !important; }
.bg-info    { background-color: var(--bs-info) !important; }

.border-primary { border-color: var(--bs-primary) !important; }
.border-info    { border-color: var(--bs-info) !important; }

.link-primary { color: var(--bs-primary); }
.link-primary:hover,
.link-primary:focus { color: var(--bs-link-hover-color); }

.link-info { color: var(--bs-info); }
.link-info:hover,
.link-info:focus { color: var(--bs-info-dark); }


@media screen and (min-width: 768px) {

}

@media screen and (min-width: 992px) {
  :root {
    --theme-default-font-size: 18px;
  }
}

@media screen and (min-width: 1200px) {

}

@media screen and (min-width: 1400px) {

}