@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

/*
 * DRL LMS enterprise theme
 * Remove this stylesheet link to restore the previous LMS presentation.
 */

:root {
  --enterprise-font: "Inter", "Segoe UI", Arial, sans-serif;
  --enterprise-bg: #0c1218;
  --enterprise-sidebar: #0a1016;
  --enterprise-surface: #121b23;
  --enterprise-surface-raised: #17222c;
  --enterprise-surface-muted: #0f171e;
  --enterprise-border: #293845;
  --enterprise-border-strong: #3a4d5c;
  --enterprise-text: #eef3f6;
  --enterprise-muted: #9baab6;
  --enterprise-subtle: #718390;
  --enterprise-accent: #69add4;
  --enterprise-accent-hover: #86c1e3;
  --enterprise-accent-soft: #152d3c;
  --enterprise-success: #48ad79;
  --enterprise-warning: #d3a943;
  --enterprise-danger: #db6670;
  --enterprise-radius: 6px;
  --enterprise-control-height: 42px;
}

html,
body,
button,
input,
select,
textarea,
.btn,
.form-control,
.form-select,
.form-check-label,
.dropdown-menu,
.table,
.navbar {
  font-family: var(--enterprise-font) !important;
  letter-spacing: 0 !important;
}

html {
  color-scheme: dark;
}

body,
body.admin-page,
body.driver-portal-page {
  background-color: var(--enterprise-bg);
  color: var(--enterprise-text);
  font-size: 0.9375rem;
  line-height: 1.5;
}

body.admin-page,
body.driver-portal-page {
  background-image: none !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
body.admin-page h1,
body.admin-page h2,
body.admin-page h3,
body.admin-page h4,
body.admin-page h5,
body.admin-page h6,
.driver-page-header h1,
.driver-form-heading h2 {
  font-family: var(--enterprise-font) !important;
  font-style: normal;
  letter-spacing: 0 !important;
  text-transform: none;
}

h1,
body.admin-page h1,
.driver-page-header h1 {
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 700;
  line-height: 1.15;
}

h2,
body.admin-page h2,
.driver-form-heading h2 {
  font-size: 1.25rem;
  font-weight: 650;
}

h3,
body.admin-page h3 {
  font-size: 1.05rem;
  font-weight: 650;
}

p,
.text-muted,
.form-text,
.driver-page-header p,
body.admin-page .text-muted,
body.admin-page .form-text {
  color: var(--enterprise-muted) !important;
}

.admin-eyebrow,
.driver-page-kicker,
.driver-kicker,
.driver-sidebar-label,
.admin-nav-label,
.admin-stat-label,
.driver-metric span,
.driver-form-heading + span {
  color: var(--enterprise-subtle) !important;
  font-family: var(--enterprise-font) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase;
}

/* Application shell */
.admin-sidebar,
.driver-sidebar {
  border-right: 1px solid var(--enterprise-border) !important;
  background: var(--enterprise-sidebar) !important;
  box-shadow: none !important;
}

.admin-brand-area,
.driver-sidebar-brand {
  border-bottom-color: var(--enterprise-border) !important;
}

.admin-nav,
.driver-sidebar-nav {
  padding-right: 10px !important;
  padding-left: 10px !important;
}

.admin-nav-link,
.admin-nav-toggle,
.driver-sidebar-link,
.driver-sidebar-menu-toggle {
  min-height: 40px;
  border: 1px solid transparent !important;
  border-radius: 4px !important;
  color: #b8c4cd !important;
  font-family: var(--enterprise-font) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  text-transform: none !important;
}

.admin-nav-link i,
.admin-nav-toggle i,
.driver-sidebar-link i,
.driver-sidebar-menu-toggle i {
  color: #708696 !important;
}

.admin-nav-link:hover,
.admin-nav-link:focus-visible,
.admin-nav-toggle:hover,
.admin-nav-toggle:focus-visible,
.driver-sidebar-link:hover,
.driver-sidebar-link:focus-visible,
.driver-sidebar-menu-toggle:hover,
.driver-sidebar-menu-toggle:focus-visible {
  border-color: var(--enterprise-border) !important;
  background: #111b23 !important;
  color: var(--enterprise-text) !important;
}

.admin-nav-link.active,
.admin-nav-toggle.active,
.driver-sidebar-link.active,
.driver-sidebar-menu-toggle.active {
  border-color: #28475b !important;
  background: var(--enterprise-accent-soft) !important;
  box-shadow: inset 3px 0 0 var(--enterprise-accent) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

.admin-subnav,
.driver-sidebar-subnav {
  border-left-color: var(--enterprise-border) !important;
}

.admin-subnav-link,
.driver-sidebar-link.driver-subnav-link {
  min-height: 34px;
  color: #91a1ad !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
}

.admin-subnav-link.active,
.driver-sidebar-link.driver-subnav-link.active {
  background: transparent !important;
  box-shadow: inset 2px 0 0 var(--enterprise-accent) !important;
  color: var(--enterprise-text) !important;
}

.admin-sidebar-footer,
.driver-sidebar-footer {
  border-top-color: var(--enterprise-border) !important;
  background: var(--enterprise-sidebar) !important;
}

.admin-mobile-bar,
.driver-mobile-bar {
  border-bottom: 1px solid var(--enterprise-border) !important;
  background: var(--enterprise-sidebar) !important;
}

body.admin-page .admin-workspace,
.driver-page-shell {
  color: var(--enterprise-text);
}

@media (min-width: 921px) {
  body.driver-portal-page .driver-sidebar-nav .driver-sidebar-link,
  body.driver-portal-page .driver-sidebar-nav .driver-sidebar-menu-toggle,
  body.driver-portal-page .driver-sidebar-nav .driver-sidebar-nested-toggle,
  body.driver-portal-page .driver-sidebar-nav .driver-subnav-link {
    font-weight: 800 !important;
  }
}

@media (min-width: 921px) {
  body.admin-page .admin-sidebar {
    border-right: 0 !important;
    border-bottom: 1px solid var(--enterprise-border) !important;
  }

  body.admin-page .admin-brand-area {
    border-right: 1px solid var(--enterprise-border) !important;
    border-bottom: 0 !important;
  }

  body.admin-page .admin-nav {
    padding: 0 6px !important;
  }

  body.admin-page .admin-nav > .admin-nav-group > .admin-nav-link,
  body.admin-page .admin-nav-menu > .admin-nav-toggle,
  body.admin-page .admin-sidebar-footer .admin-nav-link {
    min-height: 78px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-weight: 800 !important;
  }

  body.admin-page .admin-subnav-link {
    font-weight: 800 !important;
  }

  body.admin-page .admin-nav > .admin-nav-group > .admin-nav-link:hover,
  body.admin-page .admin-nav > .admin-nav-group > .admin-nav-link:focus-visible,
  body.admin-page .admin-nav-menu > .admin-nav-toggle:hover,
  body.admin-page .admin-nav-menu > .admin-nav-toggle:focus-visible,
  body.admin-page .admin-nav-menu.open > .admin-nav-toggle {
    border: 0 !important;
    background: transparent !important;
    color: var(--enterprise-accent) !important;
  }

  body.admin-page .admin-nav > .admin-nav-group > .admin-nav-link.active,
  body.admin-page
    .admin-nav-menu.active-parent
    > .admin-nav-toggle {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--enterprise-accent) !important;
  }

  body.admin-page .admin-subnav-link.active {
    box-shadow: none !important;
    color: var(--enterprise-accent) !important;
  }

  body.admin-page .admin-sidebar-footer {
    border-top: 0 !important;
    border-left: 1px solid var(--enterprise-border) !important;
  }
}

.admin-page-header,
.driver-page-header {
  margin-bottom: 20px !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid var(--enterprise-border) !important;
}

.admin-page-header p,
.driver-page-header p {
  margin-top: 6px !important;
  margin-bottom: 0 !important;
  font-size: 0.9375rem !important;
}

/* Surfaces and panels */
.card,
body.admin-page .card,
.driver-tool-panel,
.driver-form-panel,
.driver-action-note,
.driver-metrics,
.driver-metric,
.admin-alert-panel,
.driver-approval-dialog,
.registration-success-dialog,
[class$="-panel"],
[class$="-card"] {
  border-color: var(--enterprise-border) !important;
  border-radius: var(--enterprise-radius) !important;
  background-color: var(--enterprise-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.card-header,
body.admin-page .card-header,
.driver-form-heading,
.admin-alert-panel > header,
.driver-approval-dialog > header {
  border-bottom: 1px solid var(--enterprise-border) !important;
  background: var(--enterprise-surface-muted) !important;
  color: var(--enterprise-text) !important;
}

.card-body,
body.admin-page .card-body {
  background: transparent !important;
}

.driver-action-note {
  border-left: 3px solid var(--enterprise-accent) !important;
}

.driver-metrics {
  overflow: hidden;
  gap: 0 !important;
}

.driver-metric {
  min-height: 86px !important;
  border: 0 !important;
  border-right: 1px solid var(--enterprise-border) !important;
}

.driver-metric:last-child {
  border-right: 0 !important;
}

.driver-metric-icon {
  width: 24px !important;
  height: 24px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--enterprise-accent) !important;
}

.driver-metric strong,
.admin-stat-value,
body.admin-page .row.g-4.mb-4 > [class*="col-"] > .card h2 {
  color: var(--enterprise-text) !important;
  font-family: var(--enterprise-font) !important;
  font-weight: 700 !important;
}

/* Forms and controls */
.form-control,
.form-select,
body.admin-page .form-control,
body.admin-page .form-select,
.driver-portal-page .form-control,
.driver-portal-page .form-select,
input,
select,
textarea {
  min-height: var(--enterprise-control-height);
  border: 1px solid var(--enterprise-border-strong) !important;
  border-radius: 4px !important;
  background-color: #0d151c !important;
  color: var(--enterprise-text) !important;
  box-shadow: none !important;
}

textarea {
  min-height: 110px;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
  color: #687b89 !important;
  opacity: 1;
}

.form-control:focus,
.form-select:focus,
body.admin-page .form-control:focus,
body.admin-page .form-select:focus,
.driver-portal-page .form-control:focus,
.driver-portal-page .form-select:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--enterprise-accent) !important;
  outline: 3px solid rgba(105, 173, 212, 0.16) !important;
  outline-offset: 0;
}

label,
.form-label,
body.admin-page .form-label,
.registration-field label {
  color: #b5c1ca !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

input[type="checkbox"],
input[type="radio"] {
  min-height: auto;
  accent-color: var(--enterprise-accent);
}

/* Buttons and actions */
.btn,
body.admin-page .btn,
.registration-actions .btn,
button[class*="button"],
a[class*="button"] {
  min-height: 40px;
  border-radius: 4px !important;
  font-family: var(--enterprise-font) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
}

.btn-primary,
.btn-success,
body.admin-page .btn-primary,
body.admin-page .btn-success,
.registration-actions .btn,
button.primary,
a.primary {
  border-color: var(--enterprise-accent) !important;
  background: var(--enterprise-accent) !important;
  color: #09131a !important;
}

.btn-primary:hover,
.btn-primary:focus-visible,
.btn-success:hover,
.btn-success:focus-visible,
body.admin-page .btn-primary:hover,
body.admin-page .btn-primary:focus-visible,
body.admin-page .btn-success:hover,
body.admin-page .btn-success:focus-visible {
  border-color: var(--enterprise-accent-hover) !important;
  background: var(--enterprise-accent-hover) !important;
}

.btn-secondary,
.btn-outline-secondary,
.btn-outline-primary,
.btn-outline-dark,
body.admin-page .btn-secondary,
body.admin-page .btn-outline-secondary,
body.admin-page .btn-outline-primary,
body.admin-page .btn-outline-dark {
  border-color: var(--enterprise-border-strong) !important;
  background: transparent !important;
  color: #d5dde3 !important;
}

.btn-danger,
.btn-outline-danger,
body.admin-page .btn-danger,
body.admin-page .btn-outline-danger {
  border-color: #8d3d47 !important;
  background: #351b22 !important;
  color: #f2b7bc !important;
}

.btn-sm,
body.admin-page .btn-sm {
  min-height: 34px;
  padding: 6px 10px !important;
  font-size: 0.8125rem !important;
}

/* Tables and data density */
.table,
body.admin-page .table,
table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--enterprise-text);
  border-color: var(--enterprise-border) !important;
  color: var(--enterprise-text) !important;
  font-size: 0.875rem;
}

.table thead th,
table thead th {
  padding: 11px 12px !important;
  border-color: var(--enterprise-border) !important;
  background: var(--enterprise-surface-muted) !important;
  color: #8fa2b0 !important;
  font-family: var(--enterprise-font) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.035em !important;
  text-transform: uppercase;
}

.table tbody td,
table tbody td {
  padding: 12px !important;
  border-color: var(--enterprise-border) !important;
  background: transparent !important;
  vertical-align: middle;
}

.table tbody tr:hover td,
table tbody tr:hover td {
  background: #15212a !important;
}

/* Status and feedback */
.badge,
[class*="status"] {
  border-radius: 3px !important;
  font-family: var(--enterprise-font) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

.alert,
[class*="message"].success,
[class*="message"].error {
  border-radius: 4px !important;
  background-image: none !important;
}

.alert-success,
[class*="message"].success {
  border-color: #286a4b !important;
  background: #102a20 !important;
  color: #9bd6b7 !important;
}

.alert-danger,
[class*="message"].error {
  border-color: #793742 !important;
  background: #2d171d !important;
  color: #edabb2 !important;
}

.alert-warning {
  border-color: #725e2c !important;
  background: #292311 !important;
  color: #e2ca83 !important;
}

/* Dialogs */
.modal-content,
[role="dialog"],
.registration-success-dialog,
.driver-approval-dialog {
  border: 1px solid var(--enterprise-border-strong) !important;
  border-radius: var(--enterprise-radius) !important;
  background-color: var(--enterprise-surface) !important;
  background-image: none !important;
  box-shadow: 0 22px 65px rgba(0, 0, 0, 0.48) !important;
}

.modal-header,
.modal-footer,
.registration-success-header,
.registration-success-actions {
  border-color: var(--enterprise-border) !important;
  background: var(--enterprise-surface-muted) !important;
}

/* Empty states should read as ordinary workflow states, not feature cards. */
.driver-empty-state,
.registration-empty-state,
.dashboard-empty-state,
.news-empty-state,
.penalty-empty-state,
.rulebook-empty-state,
.team-empty-state {
  border: 1px solid var(--enterprise-border) !important;
  border-radius: var(--enterprise-radius) !important;
  background: rgba(15, 23, 30, 0.72) !important;
  color: var(--enterprise-muted) !important;
  box-shadow: none !important;
}

.driver-empty-state-title,
.driver-empty-state h2,
[class*="empty-state"] strong {
  color: var(--enterprise-text) !important;
  font-family: var(--enterprise-font) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  text-transform: none !important;
}

/* Scrollbars */
* {
  scrollbar-color: #405461 #0d151c;
  scrollbar-width: thin;
}

@media (max-width: 760px) {
  body,
  body.admin-page,
  body.driver-portal-page {
    font-size: 0.9rem;
  }

  .admin-page-header,
  .driver-page-header {
    margin-bottom: 16px !important;
    padding-bottom: 14px !important;
  }

  .driver-metric {
    border-right: 0 !important;
    border-bottom: 1px solid var(--enterprise-border) !important;
  }

  .driver-metric:last-child {
    border-bottom: 0 !important;
  }
}
@media (min-width: 921px) {
  body.driver-portal-page
    .driver-sidebar-nav
    > .driver-sidebar-link:hover,
  body.driver-portal-page
    .driver-sidebar-nav
    > .driver-sidebar-link:focus-visible,
  body.driver-portal-page .driver-sidebar-nav > .driver-sidebar-link.active,
  body.driver-portal-page
    .driver-sidebar-nav
    > .driver-sidebar-menu
    > .driver-sidebar-menu-toggle:hover,
  body.driver-portal-page
    .driver-sidebar-nav
    > .driver-sidebar-menu
    > .driver-sidebar-menu-toggle:focus-visible,
  body.driver-portal-page .driver-sidebar-nav > .driver-sidebar-menu > .driver-sidebar-menu-toggle.active {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #77b7dc !important;
  }

  body.admin-page .admin-nav > .admin-nav-group > .admin-nav-link:hover,
  body.admin-page
    .admin-nav
    > .admin-nav-group
    > .admin-nav-link:focus-visible,
  body.admin-page .admin-nav > .admin-nav-group > .admin-nav-link.active,
  body.admin-page .admin-nav-menu > .admin-nav-toggle:hover,
  body.admin-page .admin-nav-menu > .admin-nav-toggle:focus-visible,
  body.admin-page .admin-nav-menu.active-parent > .admin-nav-toggle {
    border-color: transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #77b7dc !important;
  }
}
