:root {
  --prh-bg: #f4f6ff;
  --prh-surface: #ffffff;
  --prh-surface-2: #f9faff;
  --prh-text: #1f2340;
  --prh-muted: #5d6488;
  --prh-accent: #7b3ff2;
  --prh-accent-hover: #6532ca;
  --prh-accent-soft: #9b6bff;
  --prh-border: #4169e1;
  --prh-button: #ff8c1a;
  --prh-button-hover: #e67d00;
}

body {
  background: linear-gradient(140deg, #f9f7ff 0%, var(--prh-bg) 55%, #eef4ff 100%);
  color: var(--prh-text);
  min-height: 100vh;
}

.navbar.bg-dark {
  background: linear-gradient(90deg, #5f2fcb 0%, #7b3ff2 100%) !important;
  border-bottom: 1px solid #5128ad;
}

.navbar-brand,
.nav-link,
.form-label,
h1,
h2,
h3,
.h4,
.h5,
.h6,
.table,
label,
code,
.small,
small {
  color: var(--prh-text);
}

.text-muted,
.text-light-emphasis,
.msg-meta {
  color: var(--prh-muted) !important;
}

.nav-link {
  color: #f3ecff !important;
}

.nav-link.active,
.nav-link:hover {
  color: #ffd8ff !important;
}

.card,
.accordion-item,
.list-group-item,
.modal-content {
  background: linear-gradient(180deg, var(--prh-surface) 0%, var(--prh-surface-2) 100%) !important;
  border: 2px solid var(--prh-border) !important;
  color: var(--prh-text) !important;
  box-shadow: 0 10px 24px rgba(65, 105, 225, 0.14);
}

.card-header,
.accordion-button {
  background: rgba(123, 63, 242, 0.08) !important;
  color: var(--prh-text) !important;
  border-bottom: 1px solid rgba(65, 105, 225, 0.35) !important;
}

.accordion-button:not(.collapsed) {
  background: rgba(123, 63, 242, 0.16) !important;
}

.btn,
.btn-primary,
.btn-success,
.btn-warning {
  background: var(--prh-button) !important;
  border-color: var(--prh-button) !important;
  color: #fff !important;
}

.btn:hover,
.btn-primary:hover,
.btn-success:hover,
.btn-warning:hover {
  background: var(--prh-button-hover) !important;
  border-color: var(--prh-button-hover) !important;
  color: #fff !important;
}

.btn-outline-primary,
.btn-outline-light,
.btn-outline-secondary {
  border-color: var(--prh-accent) !important;
  color: var(--prh-accent) !important;
  background: #fff !important;
}

.btn-outline-primary:hover,
.btn-outline-light:hover,
.btn-outline-secondary:hover {
  background: var(--prh-accent) !important;
  color: #fff !important;
}

.btn-outline-danger {
  border-color: #dc3545 !important;
  color: #dc3545 !important;
  background: #fff !important;
}

.form-control,
.form-select,
textarea {
  background: #ffffff !important;
  border: 1px solid rgba(65, 105, 225, 0.55) !important;
  color: var(--prh-text) !important;
}

.form-control:focus,
.form-select:focus,
textarea:focus {
  border-color: var(--prh-accent) !important;
  box-shadow: 0 0 0 0.2rem rgba(123, 63, 242, 0.2) !important;
}

.table {
  --bs-table-bg: #ffffff;
  --bs-table-striped-bg: #f2f4ff;
  --bs-table-color: var(--prh-text);
  --bs-table-border-color: rgba(65, 105, 225, 0.45);
}

.table thead th {
  background: #eaf0ff !important;
  color: #1c2250 !important;
  border-color: rgba(65, 105, 225, 0.55) !important;
}

.table td,
.table th {
  color: var(--prh-text) !important;
}

.table-week td,
.table-week th,
.table-responsive .table td,
.table-responsive .table th {
  background-color: #fff !important;
}

.slot-own {
  background: #e9fff4 !important;
}

.slot-other {
  background: #fff1f1 !important;
}

.slot-autodj {
  background: #fff9df !important;
}

.alert-success { background: #e9f8ef; color: #11663c; border-color: #8dd5af; }
.alert-danger { background: #ffe9ec; color: #8d1f30; border-color: #f3a8b4; }
.alert-info { background: #eaf1ff; color: #244a9b; border-color: #a7c0ff; }
.alert-warning { background: #fff3d9; color: #855f00; border-color: #ffd58a; }

code {
  background: #f1ecff;
  border: 1px solid rgba(123, 63, 242, 0.3);
  color: #4d2f9f !important;
  padding: 2px 6px;
  border-radius: 6px;
}

/* Navbar layout fix for longer menu labels */
.nav-main-links {
  flex-wrap: wrap;
  gap: 0.25rem 0.35rem;
}

.nav-main-links .nav-link {
  white-space: nowrap;
  padding: 0.35rem 0.65rem !important;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
}

.nav-main-links .nav-link.active,
.nav-main-links .nav-link:hover {
  background: rgba(255, 255, 255, 0.18);
}

.nav-user-tools {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.nav-user-name {
  white-space: nowrap;
}

@media (max-width: 991.98px) {
  .nav-main-links {
    margin-top: 0.5rem;
  }

  .nav-main-links .nav-link {
    border-radius: 0.5rem;
    white-space: normal;
  }

  .nav-user-tools {
    margin-top: 0.75rem;
    justify-content: flex-start;
  }
}