/* Noir theme — obsidian black with warm gold accents.
 * Loaded after mikhmon-modern.css, only when the selected theme is "noir".
 * Redeclaring the shared custom properties here re-colors every rule in
 * mikhmon-modern.css that already reads them (background/text/border/muted).
 * Rules below only exist for the handful of accents that file hardcodes in
 * blue instead of a variable — semantic status colors (green/red/yellow for
 * ok/error/warning) are intentionally left untouched so they still mean the
 * same thing at a glance. */
:root {
  --mk-bg: #000000;
  --mk-surface: #0d0d0d;
  --mk-surface-raised: #181818;
  --mk-border: rgba(255, 255, 255, .16);
  --mk-text: #f5f5f0;
  --mk-muted: #9c9a94;
  --mk-primary: #d4af37;
  --mk-primary-deep: #8a6a1a;
}

body {
  background: radial-gradient(circle at 88% -10%, #2a2210 0, transparent 32rem), var(--mk-bg);
}

::-webkit-scrollbar-thumb { background: #2c2c2c; border-color: var(--mk-bg); }

.navbar { background: rgba(0, 0, 0, .94); box-shadow: 0 6px 24px rgba(0, 0, 0, .4); }
.navbar-hover:hover { background: rgba(212, 175, 55, .14); color: #fff; }

.sidenav { background: linear-gradient(180deg, #0f0f0f, #000000); box-shadow: 12px 0 28px rgba(0, 0, 0, .35); }

.sidenav-brand {
  color: #0b0b0b;
  background: linear-gradient(135deg, #d4af37, #8a6a1a);
}

.sidenav .card-header { color: #f3e6bb; background: rgba(212, 175, 55, .1); }
.dropdown-btn, .sidenav a { color: #c9c6bd; }
.sidenav i { color: #d4af37; }
.dropdown-btn:hover, .sidenav a:hover { background: rgba(212, 175, 55, .14); color: #fff; }
.sidenav .active { background: linear-gradient(90deg, rgba(138, 106, 26, .75), rgba(20, 20, 20, .8)); color: #fff; }
.sidenav .dropdown-container { border-left-color: rgba(212, 175, 55, .28); }

.router-voucher-count { color: #f3e6bb; }
.router-session-title { color: #f5f5f0; }
.router-search-suggestions { color: #e4d59a; }
.router-group-toggle { background: rgba(212, 175, 55, .08); }
.router-group-toggle > .fa-folder { color: #d4af37; }
.router-group-count { color: #f3e6bb; background: rgba(212, 175, 55, .22); }
.router-group-input { background: rgba(0, 0, 0, .6); }

.customer-editor { background: linear-gradient(135deg, rgba(212, 175, 55, .16), rgba(20, 20, 20, .4)); border-color: rgba(212, 175, 55, .22); }
.customer-editor h4, .customer-account-list h4 { color: #f3e6bb; }
.customer-group-picker { background: rgba(0, 0, 0, .3); }
.customer-group-picker-title { color: #e4d59a; }
.customer-group-toggle span { background: rgba(20, 20, 20, .7); }
.customer-group-toggle:hover span { border-color: rgba(212, 175, 55, .55); color: #f3e6bb; }
.customer-group-toggle.is-active span { color: #0b0b0b; background: rgba(212, 175, 55, .8); border-color: #d4af37; box-shadow: 0 0 0 1px rgba(212, 175, 55, .25); }
.customer-permissions > span { color: #e4d59a; }
.customer-account-list h4 span { color: #f3e6bb; background: rgba(212, 175, 55, .22); }
.customer-account { background: rgba(0, 0, 0, .35); }
.customer-account summary { color: #f3e6bb; }
.customer-account summary small { color: #d4af37; }
.customer-notice { color: #f3e6bb; background: rgba(212, 175, 55, .16); border-color: rgba(212, 175, 55, .28); }

.router-health-check { color: #f3e6bb; background: rgba(30, 24, 4, .55); border-color: rgba(212, 175, 55, .5); }
.router-health-check:hover { color: #fff; background: rgba(138, 106, 26, .55); border-color: #d4af37; }
.router-health-backdrop { background: rgba(0, 0, 0, .82); }
.router-health-dialog { background: linear-gradient(145deg, #141414, #000000); border-color: rgba(212, 175, 55, .25); }
.router-health-eyebrow { color: #d4af37; }
.router-health-header h3 { color: #f5f5f0; }
.router-health-loading > .fa { color: #d4af37; }
.router-health-loading strong, .router-health-error strong { color: #f5f5f0; }
.router-health-overview, .router-health-system, .router-health-issue-section { background: rgba(20, 20, 20, .55); }
.router-health-overview h4, .router-health-system h4, .router-health-issue-section h4 { color: #f5f5f0; }
.router-health-quick-check { background: rgba(0, 0, 0, .3); }
.router-health-quick-check strong { color: #f0efe9; }
.router-health-pair { background: rgba(0, 0, 0, .28); }
.router-health-pair-value { color: #f0efe9; }
.router-health-section { background: rgba(20, 20, 20, .45); }
.router-health-section-heading strong { color: #f0efe9; }
.router-health-table { background: rgba(0, 0, 0, .25); }
.router-health-table th { color: #e4d59a; background: rgba(24, 24, 24, .6); }
.router-health-table td { color: #dcdad2; }
.router-health-empty { background: rgba(0, 0, 0, .25); }
.router-health-issue-copy strong { color: #f0efe9; }

.box, .card { background: rgba(13, 13, 13, .96); box-shadow: 0 10px 28px rgba(0, 0, 0, .32); }
.box-group-icon { color: #d4af37; background: rgba(212, 175, 55, .12); border-color: rgba(212, 175, 55, .2); }

.form-control, .group-item { background: #0a0a0a; }
.form-control:focus, .group-item:focus { box-shadow: 0 0 0 .2rem rgba(212, 175, 55, .18); }
.meks-login-logo { background: #0d0d0d; }
.table-hover:hover tbody tr:hover { background: rgba(212, 175, 55, .08); }