/* Al-Misbaah Fleet Management System: LubeLogger UI theme (data/themes/almisbaah.css).
   Brand pass 2026-09-29, website values 2026-09-30 (www.al-misbaah.org is the brand source; docs/brand/al-misbaah-tokens.css):
   light theme on ground #F7F6F0, white cards with #E0DED8 lines, the accent orange #E9582E square buttons with white text
   (deep orange #B83F1B hover), ink #0D0901 text, stone #4F4D4B secondary text. Dark theme unchanged.
   Type: Geist body and headings (headings 500, tight tracking), Epilogue 600 buttons. Colours, type and shape only. */
/* fonts self hosted on this origin by brandproxy (/__am/fonts.css): Geist and Epilogue, no Google Fonts */
@import url('/__am/fonts.css?v=20260930');

:root, [data-bs-theme="light"] {
  --bs-body-font-family: 'Geist', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --bs-body-bg: #F7F6F0;
  --bs-body-bg-rgb: 247, 246, 240;
  --bs-body-color: #0D0901;
  --bs-body-color-rgb: 13, 9, 1;
  --bs-emphasis-color: #0D0901;
  --bs-secondary-color: #4F4D4B;
  --bs-tertiary-bg: #EEECE6;
  --bs-secondary-bg: #EEECE6;
  --bs-primary: #E9582E;
  --bs-primary-rgb: 233, 88, 46;
  --bs-primary-text-emphasis: #8A2E14;
  --bs-primary-bg-subtle: #FCD3B1;
  --bs-primary-border-subtle: #F4B98C;
  --bs-link-color: #B83F1B;
  --bs-link-color-rgb: 184, 63, 27;
  --bs-link-hover-color: #8A2E14;
  --bs-link-hover-color-rgb: 138, 46, 20;
  --bs-focus-ring-color: rgba(233,88,46, 0.25);
  --bs-border-color: #E0DED8;
}
[data-bs-theme="dark"] {
  --bs-body-font-family: 'Geist', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --bs-body-bg: #0D0901;
  --bs-body-bg-rgb: 13, 9, 1;
  --bs-body-color: #F7F6F0;
  --bs-body-color-rgb: 247, 246, 240;
  --bs-emphasis-color: #FFFFFF;
  --bs-secondary-bg: #1E1A14;
  --bs-tertiary-bg: #17130D;
  --bs-primary: #E9582E;
  --bs-primary-rgb: 236, 90, 48;
  --bs-primary-text-emphasis: #F6A58C;
  --bs-primary-bg-subtle: #3A170C;
  --bs-primary-border-subtle: #8A2E14;
  --bs-link-color: #F38862;
  --bs-link-color-rgb: 243, 136, 98;
  --bs-link-hover-color: #F9D81D;
  --bs-link-hover-color-rgb: 249, 216, 29;
  --bs-focus-ring-color: rgba(233,88,46, 0.35);
  --bs-border-color: #3A342B;
}

body { font-family: var(--bs-body-font-family); }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .display-1, .display-2, .display-3,
.display-4, .display-5, .display-6, .modal-title, .card-title {
  font-family: 'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight: 500;
  letter-spacing: -0.02em;
}

/* Buttons: lantern orange with ink text (keeps AA contrast) */
.btn-primary {
  --bs-btn-color: #0D0901;
  --bs-btn-bg: #E9582E;
  --bs-btn-border-color: #E9582E;
  --bs-btn-hover-color: #0D0901;
  --bs-btn-hover-bg: #F07550;
  --bs-btn-hover-border-color: #F07550;
  --bs-btn-focus-shadow-rgb: 236, 90, 48;
  --bs-btn-active-color: #0D0901;
  --bs-btn-active-bg: #D94C24;
  --bs-btn-active-border-color: #D94C24;
  --bs-btn-disabled-color: #0D0901;
  --bs-btn-disabled-bg: #E9582E;
  --bs-btn-disabled-border-color: #E9582E;
}
.btn-outline-primary {
  --bs-btn-color: #B83E1B;
  --bs-btn-border-color: #E9582E;
  --bs-btn-hover-color: #0D0901;
  --bs-btn-hover-bg: #E9582E;
  --bs-btn-hover-border-color: #E9582E;
  --bs-btn-active-color: #0D0901;
  --bs-btn-active-bg: #D94C24;
  --bs-btn-active-border-color: #D94C24;
}
[data-bs-theme="dark"] .btn-outline-primary { --bs-btn-color: #F38862; }
.btn-secondary {
  --bs-btn-bg: #4F4D4B;
  --bs-btn-border-color: #4F4D4B;
  --bs-btn-hover-bg: #3C3A38;
  --bs-btn-hover-border-color: #3C3A38;
}

/* Form controls, tabs, badges, pagination */
.form-control:focus, .form-select:focus, .form-check-input:focus {
  border-color: #F39A7D;
  box-shadow: 0 0 0 0.25rem rgba(233,88,46, 0.25);
}
.form-check-input:checked { background-color: #E9582E; border-color: #E9582E; }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: #E9582E; color: #0D0901; }
.nav-tabs .nav-link.active { border-bottom: 3px solid #E9582E !important; }
.lubelogger-tab .nav-link.active { color: #B83E1B; }
[data-bs-theme="dark"] .lubelogger-tab .nav-link.active { color: #F9D81D; }
.text-primary { color: #B83E1B !important; }
[data-bs-theme="dark"] .text-primary { color: #F38862 !important; }
.bg-primary { background-color: #E9582E !important; }
.badge.bg-primary, .badge.text-bg-primary { color: #0D0901 !important; }
.page-link { color: var(--bs-link-color); }
.active > .page-link, .page-link.active { background-color: #E9582E; border-color: #E9582E; color: #0D0901; }
.btn-check:checked + .dropdown-item, :not(.btn-check) + .dropdown-item:active,
.dropdown-item.active, .dropdown-item:active { background-color: #E9582E; color: #0D0901; }
.progress-bar { background-color: #E9582E; }

/* Logo swaps to the light lockup in dark mode */
[data-bs-theme="dark"] img.lubelogger-logo[src$="fleet-management-logo.svg"] { content: url('/brand/fleet-management-logo-dark.svg'); }
[data-bs-theme="dark"] img.lubelogger-logo[src$="fleet-management-mark.svg"] { content: url('/brand/fleet-management-mark-dark.svg'); }

/* LubeLogger uses the warning style for Login and highlights: flame yellow with ink text */
.btn-warning {
  --bs-btn-color: #0D0901;
  --bs-btn-bg: #F9D81D;
  --bs-btn-border-color: #F9D81D;
  --bs-btn-hover-color: #0D0901;
  --bs-btn-hover-bg: #FBE15A;
  --bs-btn-hover-border-color: #FBE15A;
  --bs-btn-active-color: #0D0901;
  --bs-btn-active-bg: #E5C40C;
  --bs-btn-active-border-color: #E5C40C;
}

/* Brand pass, light theme: the website's surfaces and buttons (values 2026-09-30) */
[data-bs-theme="light"] .card, [data-bs-theme="light"] .modal-content, [data-bs-theme="light"] .dropdown-menu,
[data-bs-theme="light"] .list-group-item, [data-bs-theme="light"] .form-control, [data-bs-theme="light"] .form-select { background-color: #ffffff; }
[data-bs-theme="light"] .card, [data-bs-theme="light"] .modal-content { border-color: #E0DED8; border-radius: 12px; }
[data-bs-theme="light"] .form-control, [data-bs-theme="light"] .form-select { border-color: #BBBAB8; border-radius: 4px; }
[data-bs-theme="light"] .table { --bs-table-bg: #ffffff; --bs-table-border-color: #E9E8E2; }
[data-bs-theme="light"] .table > thead { --bs-table-bg: #F7F6F0; color: #4F4D4B; }
[data-bs-theme="light"] .navbar, [data-bs-theme="light"] header.border-bottom { background-color: #ffffff; }
[data-bs-theme="light"] h1, [data-bs-theme="light"] h2, [data-bs-theme="light"] h3, [data-bs-theme="light"] h4,
[data-bs-theme="light"] .modal-title, [data-bs-theme="light"] .card-title { font-family: 'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; font-weight: 500; letter-spacing: -0.02em; color: #0D0901; }
[data-bs-theme="light"] .btn-primary, [data-bs-theme="light"] .btn-warning {
  --bs-btn-color: #ffffff; --bs-btn-bg: #E9582E; --bs-btn-border-color: #E9582E;
  --bs-btn-hover-color: #ffffff; --bs-btn-hover-bg: #B83F1B; --bs-btn-hover-border-color: #B83F1B;
  --bs-btn-active-color: #ffffff; --bs-btn-active-bg: #B83F1B; --bs-btn-active-border-color: #B83F1B;
  --bs-btn-disabled-color: #ffffff; --bs-btn-disabled-bg: #E9582E; --bs-btn-disabled-border-color: #E9582E;
  --bs-btn-focus-shadow-rgb: 233, 88, 46; border-radius: 0; font-family: 'Epilogue', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif; font-weight: 600;
}
[data-bs-theme="light"] .btn-outline-primary { --bs-btn-color: #B83F1B; --bs-btn-border-color: #E9582E; --bs-btn-hover-color: #ffffff; --bs-btn-hover-bg: #E9582E; --bs-btn-active-color: #ffffff; --bs-btn-active-bg: #B83F1B; border-radius: 0; font-family: 'Epilogue', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif; font-weight: 600; }
[data-bs-theme="light"] .btn-secondary { --bs-btn-color: #0D0901; --bs-btn-bg: #EEECE6; --bs-btn-border-color: #E0DED8; --bs-btn-hover-color: #0D0901; --bs-btn-hover-bg: #E0DED8; --bs-btn-hover-border-color: #CFCDC6; border-radius: 0; font-family: 'Epilogue', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif; font-weight: 600; }
[data-bs-theme="light"] .nav-pills .nav-link.active, [data-bs-theme="light"] .nav-pills .show > .nav-link { background-color: #FCD3B1; color: #0D0901; }
[data-bs-theme="light"] .lubelogger-tab .nav-link.active, [data-bs-theme="light"] .text-primary { color: #B83F1B !important; }
[data-bs-theme="light"] .badge.bg-primary, [data-bs-theme="light"] .badge.text-bg-primary { background-color: #FCD3B1 !important; color: #0D0901 !important; border-radius: 50px; }
[data-bs-theme="light"] .active > .page-link, [data-bs-theme="light"] .page-link.active,
[data-bs-theme="light"] .dropdown-item.active, [data-bs-theme="light"] .dropdown-item:active { background-color: #E9582E; border-color: #E9582E; color: #ffffff; }
[data-bs-theme="light"] .form-check-input:checked { background-color: #E9582E; border-color: #E9582E; }
[data-bs-theme="light"] .form-control:focus, [data-bs-theme="light"] .form-select:focus { border-color: #B83F1B; box-shadow: 0 0 0 3px rgba(233,88,46,.35); }
[data-bs-theme="light"] .btn:focus-visible { box-shadow: 0 0 0 3px rgba(233,88,46,.35); }
/* website shape (2026-09-30): the sign in box is a white card with 12px corners and the card line; buttons 14px as on the website */
[data-bs-theme="light"] .border.rounded.shadow { background-color: #ffffff; border-color: #E0DED8 !important; border-radius: 12px !important; }
[data-bs-theme="light"] .btn-primary, [data-bs-theme="light"] .btn-warning, [data-bs-theme="light"] .btn-secondary, [data-bs-theme="light"] .btn-outline-primary { font-size: 14px; }

/* ---- Sign in page (CEO 2026-09-30, before the Monday launch) ----
   brandproxy's /__am/fleet.js puts "Sign in with Al-Misbaah" first, folds the username and password form behind a text
   link, and sets data-am-signin and data-am-ready on the html element. Until that script has run the card stays unseen
   (so the old order never flashes); if the script never arrives the card shows by itself after a moment, unchanged. */
@keyframes am-reveal { to { opacity: 1; } }
html:not([data-am-ready]) .lubelogger-body-container .border.rounded.shadow.p-5 { opacity: 0; animation: am-reveal 0s linear 1.5s forwards; }
html[data-am-signin] .border.rounded.shadow.p-5 { padding: 2rem 1.5rem !important; }
html[data-am-signin] .border.rounded.shadow.p-5 > div { max-width: none !important; width: min(300px, calc(100vw - 96px)); }
html[data-am-signin] .border.rounded.shadow.p-5 img.lubelogger-logo { display: block; margin: 0 auto 1.25rem; max-width: 100%; }
html[data-am-signin] .btn.am-btn-main {
  --bs-btn-color: #ffffff; --bs-btn-bg: #E9582E; --bs-btn-border-color: #E9582E;
  --bs-btn-hover-color: #ffffff; --bs-btn-hover-bg: #B83F1B; --bs-btn-hover-border-color: #B83F1B;
  --bs-btn-active-color: #ffffff; --bs-btn-active-bg: #B83F1B; --bs-btn-active-border-color: #B83F1B;
  --bs-btn-focus-shadow-rgb: 233, 88, 46;
  margin-top: 0 !important; min-height: 48px; padding: 12px 16px; border-radius: 0;
  font-family: 'Epilogue', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif; font-weight: 600; font-size: 14px; line-height: 1.3;
  letter-spacing: 0; text-transform: uppercase;
}
html[data-am-signin] .am-link {
  display: block; margin: 0.5rem auto 0; padding: 10px 6px; min-height: 44px;
  -webkit-appearance: none; appearance: none; background: none; border: 0;
  font-family: 'Geist', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif; font-size: 14px; font-weight: 400; line-height: 1.4;
  color: var(--bs-link-color); text-decoration: underline; text-underline-offset: 3px; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
html[data-am-signin] .am-link:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(233,88,46,.35); }
html[data-am-signin] #am-local { margin-top: 0.5rem; text-align: left; }
html[data-am-signin] #am-local[hidden], html[data-am-signin] #am-local [hidden] { display: none !important; }
html[data-am-signin] #am-local .form-group, html[data-am-signin] #am-local .form-check { margin-bottom: 0.5rem; }
/* the username and password button is the second choice: an outline in the text colour */
html[data-am-signin] .btn.am-btn-second {
  --bs-btn-color: var(--bs-body-color); --bs-btn-bg: transparent; --bs-btn-border-color: var(--bs-body-color);
  --bs-btn-hover-color: var(--bs-body-color); --bs-btn-hover-bg: var(--bs-tertiary-bg); --bs-btn-hover-border-color: var(--bs-body-color);
  --bs-btn-active-color: var(--bs-body-color); --bs-btn-active-bg: var(--bs-tertiary-bg); --bs-btn-active-border-color: var(--bs-body-color);
  --bs-btn-focus-shadow-rgb: 233, 88, 46;
  min-height: 44px; border-radius: 0;
  font-family: 'Epilogue', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif; font-weight: 600; font-size: 14px; text-transform: uppercase;
}
html[data-am-signin] #am-local .btn-link { font-size: 14px; }