[data-theme="bright"] body { background: #f4f6f8; }
.razor-nav { background: #14213d; }
.card { border: 0; box-shadow: 0 8px 28px rgba(20, 33, 61, .08); }
.file-row { font-variant-numeric: tabular-nums; }
/* Text, not a password field, so the browser does not offer to save a download password. */
.secret-input { -webkit-text-security: disc; }

.theme-toggle {
  width: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.when-violet { display: none !important; }
[data-theme="violet"] .when-bright { display: none !important; }
[data-theme="violet"] .when-violet { display: inline-block !important; }

html[data-theme="violet"] {
  min-height: 100%;
  background-color: #100818;
  background-image:
    radial-gradient(1100px 520px at 8% -12%, rgba(124, 58, 237, .28), transparent 58%),
    radial-gradient(800px 480px at 100% 0%, rgba(88, 28, 135, .35), transparent 52%);
  background-repeat: no-repeat;
  background-attachment: fixed;
  color-scheme: dark;
  --bs-body-color: #f6f1ff;
  --bs-body-color-rgb: 246, 241, 255;
  --bs-body-bg: #100818;
  --bs-body-bg-rgb: 16, 8, 24;
  --bs-emphasis-color: #fff;
  --bs-emphasis-color-rgb: 255, 255, 255;
  --bs-secondary-color: rgba(214, 196, 242, .78);
  --bs-secondary-color-rgb: 214, 196, 242;
  --bs-secondary-rgb: 196, 176, 224;
  --bs-tertiary-color: rgba(214, 196, 242, .55);
  --bs-secondary-bg: #32204c;
  --bs-secondary-bg-rgb: 50, 32, 76;
  --bs-tertiary-bg: #27183a;
  --bs-tertiary-bg-rgb: 39, 24, 58;
  --bs-border-color: rgba(196, 160, 255, .24);
  --bs-border-color-translucent: rgba(196, 160, 255, .18);
  --bs-heading-color: #f8f4ff;
  --bs-link-color: #e0c4ff;
  --bs-link-hover-color: #f3e8ff;
  --bs-link-color-rgb: 224, 196, 255;
  --bs-link-hover-color-rgb: 243, 232, 255;
  --bs-primary: #a855f7;
  --bs-primary-rgb: 168, 85, 247;
  --bs-form-invalid-color: #ffb4c0;
  --bs-form-invalid-border-color: #ff8fa3;
}

[data-theme="violet"] body {
  background: transparent;
}

[data-theme="violet"] .razor-nav {
  background: linear-gradient(180deg, #1a0c2c 0%, #12081e 100%);
  border-bottom: 1px solid rgba(192, 132, 252, .32);
  box-shadow: 0 10px 30px rgba(4, 0, 12, .45);
}

[data-theme="violet"] .card {
  --bs-card-bg: #1c102c;
  --bs-card-color: #f6f1ff;
  --bs-card-border-color: rgba(196, 160, 255, .18);
  background-color: #1c102c;
  color: #f6f1ff;
  border: 1px solid rgba(196, 160, 255, .16);
  box-shadow: 0 18px 50px rgba(4, 0, 12, .5);
}

[data-theme="violet"] .form-control,
[data-theme="violet"] .form-select {
  background-color: #140c22;
  border-color: rgba(196, 160, 255, .28);
  color: #f6f1ff;
}

[data-theme="violet"] .form-control:focus,
[data-theme="violet"] .form-select:focus {
  background-color: #140c22;
  border-color: #c084fc;
  box-shadow: 0 0 0 .25rem rgba(168, 85, 247, .28);
  color: #f6f1ff;
}

[data-theme="violet"] .form-control:-webkit-autofill {
  -webkit-text-fill-color: #f6f1ff;
  caret-color: #f6f1ff;
  box-shadow: 0 0 0 1000px #140c22 inset;
}

[data-theme="violet"] .btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #7c3aed;
  --bs-btn-border-color: #7c3aed;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #6d28d9;
  --bs-btn-hover-border-color: #6d28d9;
  --bs-btn-focus-shadow-rgb: 168, 85, 247;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #5b21b6;
  --bs-btn-active-border-color: #5b21b6;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #7c3aed;
  --bs-btn-disabled-border-color: #7c3aed;
  color: #fff;
  background-color: #7c3aed;
  border-color: #7c3aed;
}

[data-theme="violet"] .btn-primary:hover,
[data-theme="violet"] .btn-primary:focus-visible {
  color: #fff;
  background-color: #6d28d9;
  border-color: #6d28d9;
}

[data-theme="violet"] .btn-primary:focus-visible {
  box-shadow: 0 0 0 .25rem rgba(168, 85, 247, .5);
}

[data-theme="violet"] .btn-outline-primary {
  --bs-btn-color: #e0c4ff;
  --bs-btn-border-color: #c084fc;
  --bs-btn-hover-color: #1c102c;
  --bs-btn-hover-bg: #e0c4ff;
  --bs-btn-hover-border-color: #e0c4ff;
  --bs-btn-focus-shadow-rgb: 192, 132, 252;
  --bs-btn-active-color: #1c102c;
  --bs-btn-active-bg: #e0c4ff;
  --bs-btn-active-border-color: #e0c4ff;
  --bs-btn-disabled-color: #e0c4ff;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #c084fc;
  color: #e0c4ff;
  background-color: transparent;
  border-color: #c084fc;
}

[data-theme="violet"] .btn-outline-primary:hover,
[data-theme="violet"] .btn-outline-primary:focus-visible {
  color: #1c102c;
  background-color: #e0c4ff;
  border-color: #e0c4ff;
}

[data-theme="violet"] .btn-outline-secondary {
  --bs-btn-color: #ddd0f4;
  --bs-btn-border-color: rgba(214, 196, 242, .45);
  --bs-btn-hover-color: #1c102c;
  --bs-btn-hover-bg: #ddd0f4;
  --bs-btn-hover-border-color: #ddd0f4;
  --bs-btn-focus-shadow-rgb: 214, 196, 242;
  --bs-btn-active-color: #1c102c;
  --bs-btn-active-bg: #ddd0f4;
  --bs-btn-active-border-color: #ddd0f4;
  --bs-btn-disabled-color: #ddd0f4;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: rgba(214, 196, 242, .45);
  color: #ddd0f4;
  background-color: transparent;
  border-color: rgba(214, 196, 242, .45);
}

[data-theme="violet"] .btn-outline-secondary:hover,
[data-theme="violet"] .btn-outline-secondary:focus-visible {
  color: #1c102c;
  background-color: #ddd0f4;
  border-color: #ddd0f4;
}

[data-theme="violet"] .list-group {
  --bs-list-group-bg: #241433;
  --bs-list-group-color: #f6f1ff;
  --bs-list-group-border-color: rgba(196, 160, 255, .2);
}

[data-theme="violet"] .table {
  --bs-table-color: #f6f1ff;
  --bs-table-bg: transparent;
  --bs-table-border-color: rgba(196, 160, 255, .2);
  --bs-table-striped-color: #f6f1ff;
  --bs-table-hover-color: #f6f1ff;
  --bs-table-hover-bg: rgba(168, 85, 247, .08);
}

.login-pending .form-control { pointer-events: none; opacity: .7; }
.login-spin {
  display: inline-block;
  width: .9em;
  height: .9em;
  margin-right: .45rem;
  vertical-align: -0.1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: login-spin .7s linear infinite;
}
@keyframes login-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .login-spin { animation: none; }
}