:root {
  color-scheme: light;
  --parcel-surface: #f9f9ff;
  --parcel-surface-dim: #cadbfc;
  --parcel-surface-bright: #f9f9ff;
  --parcel-surface-container-lowest: #ffffff;
  --parcel-surface-container-low: #f0f3ff;
  --parcel-surface-container: #e7eeff;
  --parcel-surface-container-high: #dfe8ff;
  --parcel-surface-container-highest: #d6e3ff;
  --parcel-on-surface: #091c35;
  --parcel-on-surface-variant: #434654;
  --parcel-inverse-surface: #20314b;
  --parcel-inverse-on-surface: #ecf0ff;
  --parcel-outline: #737685;
  --parcel-outline-variant: #c3c6d6;
  --parcel-primary: #003d9b;
  --parcel-primary-container: #0052cc;
  --parcel-on-primary: #ffffff;
  --parcel-primary-fixed: #dae2ff;
  --parcel-primary-fixed-dim: #b2c5ff;
  --parcel-secondary: #825500;
  --parcel-secondary-container: #feaa00;
  --parcel-secondary-fixed: #ffddb3;
  --parcel-tertiary: #7b2600;
  --parcel-error: #ba1a1a;
  --parcel-error-container: #ffdad6;
  --parcel-success: #0052cc;
  --parcel-primary-rgb: 0, 61, 155;
  --parcel-primary-container-rgb: 0, 82, 204;
  --parcel-secondary-container-rgb: 254, 170, 0;
  --parcel-on-surface-rgb: 9, 28, 53;
  --parcel-inverse-surface-rgb: 32, 49, 75;
  --parcel-inverse-on-surface-rgb: 236, 240, 255;
  --parcel-outline-rgb: 115, 118, 133;
  --parcel-outline-variant-rgb: 195, 198, 214;
  --parcel-success-rgb: 0, 82, 204;
  --parcel-error-rgb: 186, 26, 26;
  --bs-body-bg: var(--parcel-surface);
  --bs-body-color: var(--parcel-on-surface);
  --bs-secondary-color: var(--parcel-on-surface-variant);
  --bs-tertiary-bg: var(--parcel-surface-container-low);
  --bs-border-color: var(--parcel-outline-variant);
  --bs-primary: var(--parcel-primary);
  --bs-primary-rgb: var(--parcel-primary-rgb);
  --bs-secondary: var(--parcel-secondary);
  --bs-secondary-rgb: 130, 85, 0;
  --bs-success: var(--parcel-success);
  --bs-success-rgb: var(--parcel-success-rgb);
  --bs-info: var(--parcel-primary-container);
  --bs-info-rgb: var(--parcel-primary-container-rgb);
  --bs-warning: var(--parcel-secondary-container);
  --bs-warning-rgb: var(--parcel-secondary-container-rgb);
  --bs-danger: var(--parcel-error);
  --bs-danger-rgb: var(--parcel-error-rgb);
  --bs-light: var(--parcel-surface-container-low);
  --bs-light-rgb: 240, 243, 255;
  --bs-dark: var(--parcel-inverse-surface);
  --bs-dark-rgb: var(--parcel-inverse-surface-rgb);
  --bs-link-color: var(--parcel-primary);
  --bs-link-color-rgb: var(--parcel-primary-rgb);
  --bs-link-hover-color: var(--parcel-primary-container);
  --bs-link-hover-color-rgb: var(--parcel-primary-container-rgb);
}

body {
  background:
    radial-gradient(circle at top left, rgba(var(--parcel-primary-rgb), 0.1), transparent 32rem),
    linear-gradient(
      135deg,
      var(--parcel-surface) 0%,
      var(--parcel-surface-container-low) 48%,
      var(--parcel-surface-container) 100%
    );
  color: var(--parcel-on-surface);
}

.bg-light,
.bg-body-tertiary {
  background-color: var(--parcel-surface) !important;
}

.bg-dark,
.navbar.bg-dark {
  background-color: var(--parcel-inverse-surface) !important;
}

.card,
.modal-content,
.dropdown-menu,
.list-group-item {
  color: var(--parcel-on-surface);
  background-color: var(--parcel-surface-container-lowest);
  border-color: var(--parcel-outline-variant);
}

.card,
.modal-content,
.dropdown-menu {
  box-shadow: 0 12px 32px -26px rgba(var(--parcel-on-surface-rgb), 0.28);
}

.card-header,
.card-footer,
.table-light {
  color: var(--parcel-on-surface);
  background-color: var(--parcel-surface-container-low);
  border-color: var(--parcel-outline-variant);
}

.text-secondary,
.form-text,
.small.text-muted {
  color: var(--parcel-on-surface-variant) !important;
}

.form-control,
.form-select {
  color: var(--parcel-on-surface);
  background-color: var(--parcel-surface-container-lowest);
  border-color: var(--parcel-outline-variant);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--parcel-primary-container);
  box-shadow: 0 0 0 0.2rem rgba(var(--parcel-primary-rgb), 0.16);
}

.btn-primary {
  --bs-btn-bg: var(--parcel-primary);
  --bs-btn-border-color: var(--parcel-primary);
  --bs-btn-hover-bg: var(--parcel-primary-container);
  --bs-btn-hover-border-color: var(--parcel-primary-container);
  --bs-btn-active-bg: var(--parcel-primary-container);
  --bs-btn-active-border-color: var(--parcel-primary-container);
}

.btn-outline-primary {
  --bs-btn-color: var(--parcel-primary);
  --bs-btn-border-color: var(--parcel-primary);
  --bs-btn-hover-bg: var(--parcel-primary);
  --bs-btn-hover-border-color: var(--parcel-primary);
  --bs-btn-active-bg: var(--parcel-primary-container);
  --bs-btn-active-border-color: var(--parcel-primary-container);
}

.btn-outline-secondary {
  --bs-btn-color: var(--parcel-on-surface-variant);
  --bs-btn-border-color: var(--parcel-outline-variant);
  --bs-btn-hover-color: var(--parcel-on-surface);
  --bs-btn-hover-bg: var(--parcel-surface-container);
  --bs-btn-hover-border-color: var(--parcel-outline);
}

.badge.text-bg-primary,
.text-bg-primary {
  color: var(--parcel-on-primary) !important;
  background-color: var(--parcel-primary) !important;
}

.badge.text-bg-success,
.text-bg-success {
  color: var(--parcel-on-primary) !important;
  background-color: var(--parcel-success) !important;
}

.badge.text-bg-warning,
.text-bg-warning {
  color: #291800 !important;
  background-color: var(--parcel-secondary-container) !important;
}

.badge.text-bg-danger,
.text-bg-danger {
  color: #ffffff !important;
  background-color: var(--parcel-error) !important;
}

.badge.text-bg-light,
.text-bg-light {
  color: var(--parcel-on-surface) !important;
  background-color: var(--parcel-surface-container-low) !important;
}

.table {
  --bs-table-color: var(--parcel-on-surface);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--parcel-outline-variant);
  --bs-table-striped-bg: rgba(var(--parcel-primary-rgb), 0.035);
  --bs-table-hover-bg: rgba(var(--parcel-primary-rgb), 0.065);
}

.page-link {
  color: var(--parcel-primary);
  background-color: var(--parcel-surface-container-lowest);
  border-color: var(--parcel-outline-variant);
}

.page-link:hover {
  color: var(--parcel-primary-container);
  background-color: var(--parcel-surface-container-low);
}

.active > .page-link,
.page-link.active {
  color: var(--parcel-on-primary);
  background-color: var(--parcel-primary);
  border-color: var(--parcel-primary);
}

.progress {
  background-color: var(--parcel-surface-container-high);
}

.progress-bar {
  background-color: var(--parcel-primary-container);
}