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

/* ==========================================================================
   custom.css — dashboard redesign (visual layer only)
   Loaded LAST in dashboard/layouts/header.blade.php so it overrides
   dbAssets/build/css/custom.ar.min.css. No markup / logic / data changes.
   Sections:
    0. Design tokens          6. Tables & row actions
    1. Base & canvas          7. Forms, select2, datepicker
    2. Sidebar                8. Cards, panels, modals, tabs
    3. Top bar & dropdowns    9. Badges, status pills, alerts, pagination
    4. Page header/breadcrumb 10. Feature blocks (dashboard, lines, trips…)
    5. Buttons                11. Login, scrollbars, responsive
   ========================================================================== */

/* 0. TOKENS ---------------------------------------------------------------- */
:root {
  --primary: #0448a2;
  --dark-primary: #00b8f1;
  --app-primary: #0448a2;
  --app-primary-600: #033a85;
  --app-primary-soft: rgba(4, 72, 162, .09);
  --app-secondary: #00b8f1;
  --app-secondary-light: #dff6fd;

  --c-bg: #f2f6fc;
  --c-surface: #ffffff;
  --c-surface-2: #f8f9fd;
  --c-line: #e6e9f2;
  --c-line-soft: #eff1f7;
  --c-text: #0b1220;
  --c-text-2: #111827;
  --c-muted: #1f2937;

  --c-success: #059669;
  --c-success-soft: rgba(5, 150, 105, .12);
  --c-warning: #d97706;
  --c-warning-soft: rgba(217, 119, 6, .13);
  --c-danger: #e11d48;
  --c-danger-soft: rgba(225, 29, 72, .11);
  --c-info: #0891c7;
  --c-info-soft: rgba(0, 184, 241, .14);

  --side-bg: #ffffff;
  --side-bg-2: #041f4a;
  --side-text: #b5c7e6;
  --side-line: rgba(255, 255, 255, .07);

  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --sh-xs: 0 1px 2px rgba(15, 23, 42, .05);
  --sh-sm: 0 4px 14px -6px rgba(15, 23, 42, .12);
  --sh-md: 0 16px 36px -20px rgba(15, 23, 42, .28);
  --ring: 0 0 0 4px rgba(4, 72, 162, .15);
}

/* 1. BASE & CANVAS --------------------------------------------------------- */
html body,
body.nav-md,
body.nav-sm {
  background: var(--c-bg) !important;
  color: var(--c-text);
  font-family: 'Tajawal', sans-serif;
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
* { font-family: 'Tajawal', sans-serif; }
.fa, .fa *, [class^="fa-"], [class*=" fa-"] { font-family: FontAwesome !important; }

::selection { background: rgba(4, 72, 162, .2); }
a { color: var(--app-primary); transition: color .15s ease; }
a:hover { color: var(--app-primary-600); }
h1, h2, h3, h4, h5, h6 { color: var(--c-text); font-weight: 700; letter-spacing: -.01em; }
hr { border-color: var(--c-line); opacity: 1; }
.text-muted { color: var(--c-muted) !important; }
.container.body { background: transparent; }

body .right_col {
  background: transparent !important;
  border: 0 !important;
  min-height: calc(100vh - 62px);
  padding-top: 22px;
  padding-bottom: 32px;
}
body .right_col.bg-white { background: transparent !important; }
body .list-page { max-width: 1280px; }

/* 2. SIDEBAR (light) -------------------------------------------------------- */
body .left_col,
body .left_col .scroll-view { background: transparent !important; }
body .left_col {
  background: #ffffff !important;
  border-left: 1px solid var(--c-line);
  box-shadow: -12px 0 32px -24px rgba(4, 72, 162, .35);
}
body .left_col .left_col,
body .left_col .scroll-view {
  background: transparent !important; box-shadow: none !important; border: 0 !important; width: 100%;
}
body .left_col * { text-align: right !important; }
body .nav.side-menu > li.active::before { display: none !important; }
body .nav.child_menu li,
body .nav.child_menu li:hover,
body .nav.child_menu li.active,
body .nav.child_menu li.current-page { background: transparent !important; }

/* brand block */
body .navbar.nav_title {
  float: none; width: auto !important; height: 84px; margin: 12px 14px 6px !important;
  border-radius: 16px; min-height: 0;
  background: #fff url('images/login-logo.png') center / 178px auto no-repeat !important;
  border: 1px solid #e3edfb !important;
}
body.nav-sm .navbar.nav_title { display: none; }

body .main_menu_side { padding: 10px 12px 40px !important; }
body .menu_section { margin: 0 !important; }
body .nav.side-menu { padding: 0; margin: 0; list-style: none; }
body .nav.side-menu > li { margin: 0 0 3px; }
body #sidebar-menu hr { display: none; }

/* parent rows */
body .nav.side-menu > li > a {
  position: relative;
  display: flex !important; align-items: center; gap: 12px;
  min-height: 44px; padding: 8px 12px !important; margin: 0 !important;
  border-radius: 12px !important;
  color: #334155 !important;
  font-size: 14.5px !important; font-weight: 600 !important; line-height: 1.3;
  transition: background .15s ease, color .15s ease;
}
body .nav.side-menu > li > a > i:first-child {
  flex: 0 0 34px; width: 34px; height: 34px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; background: #eef4fd; box-shadow: none;
  font-size: 16px !important; color: var(--app-primary) !important;
  text-align: center !important;
  transition: background .15s ease, color .15s ease;
}
body .nav.side-menu > li > a:hover { background: #f3f7fe !important; color: var(--app-primary) !important; }
body .nav.side-menu > li > a:hover > i:first-child { background: #dfeafb; }

body .side-menu a span.fa {
  margin: 0 auto 0 0 !important; float: none !important; position: static;
  font-size: 11px !important; color: #a3b1c8 !important;
  transition: transform .2s ease, color .2s ease;
}
body .side-menu li.active > a span.fa { color: var(--app-primary) !important; transform: rotate(-180deg); }

/* open / active group */
body .nav.side-menu > li.active > a {
  background: #eaf2fe !important; color: var(--app-primary) !important;
  box-shadow: none !important; text-shadow: none !important;
}
body .nav.side-menu > li.active > a > i:first-child {
  background: linear-gradient(135deg, var(--app-primary), #0a6cc4);
  color: #fff !important; box-shadow: 0 10px 18px -10px rgba(4, 72, 162, .8);
}
body .nav.side-menu > li.active > a::before {
  content: ""; position: absolute; right: -12px; top: 10px; bottom: 10px; width: 4px;
  border-radius: 4px 0 0 4px; background: var(--app-secondary);
}

/* sub-items */
body .nav.child_menu { margin: 4px 0 8px; padding: 2px 0; border: 0; background: transparent; position: relative; }
body .nav.child_menu > li { margin: 1px 0; padding: 0 !important; }
body .nav.child_menu li a,
body .nav.child_menu > li > a {
  display: flex !important; align-items: center; gap: 10px;
  padding: 9px 14px 9px 10px !important; margin: 0 !important; margin-inline-start: 34px !important;
  border-radius: 10px;
  color: #1f2937 !important; font-size: 13.5px !important; font-weight: 500 !important;
  transition: background .15s ease, color .15s ease;
}
body .nav.child_menu li a::before {
  content: ""; flex: 0 0 6px; width: 6px; height: 6px; margin: 0; border-radius: 50%;
  background: #cbd5e6; transition: background .15s ease, transform .15s ease;
}
body .nav.child_menu li a:hover { background: #f3f7fe !important; color: var(--app-primary) !important; }
body .nav.child_menu li a:hover::before { background: var(--app-secondary); transform: scale(1.3); }
body .nav.child_menu li.current-page > a,
body li.current-page > a {
  background: var(--app-primary) !important; color: #fff !important; font-weight: 700 !important;
  box-shadow: 0 12px 20px -12px rgba(4, 72, 162, .85);
}
body .nav.child_menu li.current-page > a::before,
body li.current-page > a::before { background: #7fd8f7 !important; box-shadow: 0 0 0 3px rgba(255, 255, 255, .2); transform: none; }

/* collapsed rail */
body.nav-sm .nav.side-menu > li > a { justify-content: center; padding: 8px 0 !important; }
body.nav-sm .nav.side-menu > li > a > i:first-child { flex: 0 0 38px; width: 38px; height: 38px; font-size: 18px !important; margin: 0 auto; }
body.nav-sm .nav.side-menu > li.active > a::before { right: -12px; }
body.nav-sm .nav.child_menu { background: #fff; border: 1px solid var(--c-line); border-radius: 12px; padding: 6px; box-shadow: var(--sh-md); }
body.nav-sm .nav.child_menu li a { margin-inline-start: 0 !important; }

/* 3. TOP BAR & DROPDOWNS --------------------------------------------------- */
body .top_nav { background: transparent; }
body .nav_menu {
  background: rgba(255, 255, 255, .86) !important;
  backdrop-filter: saturate(160%) blur(12px);
  -webkit-backdrop-filter: saturate(160%) blur(12px);
  border-bottom: 1px solid var(--c-line) !important;
  min-height: 62px;
  box-shadow: 0 6px 24px -20px rgba(15, 23, 42, .5);
}
body .nav.toggle a#menu_toggle {
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px;
  color: var(--c-text-2);
  background: var(--c-surface-2);
  border: 1px solid var(--c-line);
  transition: .15s ease;
}
body .nav.toggle a#menu_toggle { line-height: 1; padding: 0; }
body .nav.toggle a#menu_toggle i { line-height: 1; display: block; text-align: center !important; margin: 0; font-size: 17px; }
body .nav.toggle a#menu_toggle:hover { color: var(--app-primary); background: var(--app-primary-soft); border-color: transparent; }
body .top_nav .navbar-right { margin: 0; padding: 0; list-style: none; gap: 6px; }
body .top_nav .user-profile {
  color: var(--c-text) !important;
  font-weight: 600;
  padding: 5px 12px 5px 8px !important;
  border-radius: 999px;
  border: 1px solid var(--c-line);
  background: var(--c-surface);
  display: inline-flex; align-items: center; gap: 6px;
  transition: .15s ease;
}
body .top_nav .user-profile:hover { background: var(--c-surface-2); box-shadow: var(--sh-sm); }
body .top_nav .user-profile img { border: 2px solid #fff; box-shadow: 0 0 0 1px var(--c-line); }

body .dropdown-menu {
  border: 1px solid var(--c-line) !important;
  border-radius: var(--r-md) !important;
  box-shadow: var(--sh-md) !important;
  padding: 8px !important;
  background: #fff;
}
body .dropdown-item,
body .lang-item,
body .acct-item {
  border-radius: 10px;
  padding: 9px 12px;
  font-weight: 500;
  color: var(--c-text-2);
  transition: .15s ease;
}
body .dropdown-item:hover,
body .lang-item:hover,
body .acct-item:hover { background: var(--c-surface-2); color: var(--app-primary); }
body .acct-item--danger:hover { background: var(--c-danger-soft); color: var(--c-danger); }
body .acct-head { padding: 10px 12px; }
body .acct-head__name { font-weight: 700; color: var(--c-text); }
body .acct-head__sub { color: var(--c-muted); font-size: .8rem; }
body .acct-divider { background: var(--c-line-soft); height: 1px; margin: 6px 0; }
body .lang-menu__head { color: var(--c-muted); font-size: .75rem; font-weight: 700; letter-spacing: .04em; padding: 4px 12px 8px; }

body .notif-bell {
  width: 40px; height: 40px; border-radius: 12px;
  background: var(--c-surface-2); border: 1px solid var(--c-line);
  display: inline-flex; align-items: center; justify-content: center;
  transition: .15s ease;
}
body .notif-bell:hover { background: var(--app-primary-soft); border-color: transparent; }
body .top_nav .info-number .badge,
body #notification_counter {
  background: var(--c-danger) !important;
  box-shadow: 0 4px 10px -3px rgba(225, 29, 72, .6) !important;
  border: 2px solid #fff;
}
body .notif-menu { border-radius: var(--r-lg) !important; overflow: hidden; padding: 0 !important; }
body .notif-head { background: var(--c-surface-2); border-bottom: 1px solid var(--c-line-soft); }
body .notif-head__title { font-weight: 800; color: var(--c-text); }
body .notif-item { border-bottom: 1px solid var(--c-line-soft); transition: background .15s ease; }
body .notif-item:hover { background: var(--c-surface-2); }
body .notif-item__icon { border-radius: 12px; background: var(--app-primary-soft); color: var(--app-primary); }
body .notif-item__dot { background: var(--app-primary); }

/* 4. PAGE HEADER & BREADCRUMB --------------------------------------------- */
body .breadcrumb-glass-wrapper { padding: 0 !important; margin-bottom: 14px !important; }
body .breadcrumb-glass {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  padding: 0 !important;
  font-size: .85rem;
}
body .breadcrumb-item-glass a { color: var(--c-muted) !important; font-weight: 500; }
body .breadcrumb-item-glass a:hover { color: var(--app-primary) !important; }
body .breadcrumb-item-glass i { color: var(--app-primary) !important; }
body .breadcrumb-glass .breadcrumb-item-glass:last-of-type a { color: var(--c-text) !important; font-weight: 700; }
body .breadcrumb-sep { color: #c3cadb; }

body .page-head { margin: 2px 0 20px; }
body .page-head__title h4,
body .page-head__title h2 { margin: 0; font-size: 1.45rem; font-weight: 800; color: var(--c-text); }
body .page-head__icon {
  width: 50px; height: 50px; border-radius: 16px;
  background: linear-gradient(135deg, var(--app-primary), #00b8f1) !important;
  color: #fff !important;
  font-size: 20px;
  box-shadow: 0 12px 22px -10px rgba(4, 72, 162, .7);
}
body .page-head__actions { gap: 10px; }

/* 5. BUTTONS --------------------------------------------------------------- */
body .pbtn {
  padding: 10px 18px;
  border-radius: 12px;
  font-weight: 700;
  font-size: .86rem;
  letter-spacing: .01em;
  border: 0;
  box-shadow: 0 8px 18px -10px rgba(15, 23, 42, .5);
}
body .pbtn:hover { transform: translateY(-2px); filter: brightness(1.06); }
body .pbtn:active { transform: translateY(0); }
body .pbtn--primary { background: var(--app-primary) !important; color: #fff !important; box-shadow: 0 10px 20px -10px rgba(4, 72, 162, .8); }
body .pbtn--green   { background: var(--c-success) !important; color: #fff !important; box-shadow: 0 10px 20px -10px rgba(5, 150, 105, .8); }
body .pbtn--blue    { background: var(--c-info) !important; color: #fff !important; box-shadow: 0 10px 20px -10px rgba(2, 132, 199, .8); }
body .pbtn--amber   { background: var(--c-warning) !important; color: #fff !important; box-shadow: 0 10px 20px -10px rgba(217, 119, 6, .8); }
body .pbtn--red     { background: var(--c-danger) !important; color: #fff !important; box-shadow: 0 10px 20px -10px rgba(225, 29, 72, .8); }

body .btn {
  border-radius: 12px;
  font-weight: 600;
  padding: 8px 18px;
  border-width: 1px;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
}
body .btn:focus { box-shadow: var(--ring) !important; }
body .btn-primary { background: var(--app-primary); border-color: var(--app-primary); color: #fff; }
body .btn-primary:hover, body .btn-primary:focus { background: var(--app-primary-600); border-color: var(--app-primary-600); }
body .btn-success { background: var(--c-success); border-color: var(--c-success); }
body .btn-danger  { background: var(--c-danger);  border-color: var(--c-danger); }
body .btn-warning { background: var(--c-warning); border-color: var(--c-warning); color: #fff; }
body .btn-info    { background: var(--c-info);    border-color: var(--c-info);    color: #fff; }
body .btn-secondary { background: #64748b; border-color: #64748b; }
body .btn-outline-primary { color: var(--app-primary); border-color: rgba(4, 72, 162, .35); background: transparent; }
body .btn-outline-primary:hover { background: var(--app-primary); border-color: var(--app-primary); color: #fff; }
body .btn-outline-secondary { color: var(--c-text-2); border-color: var(--c-line); background: #fff; }
body .btn-outline-secondary:hover { background: var(--c-surface-2); color: var(--c-text); border-color: #cfd6e6; }
body .btn-outline-danger { color: var(--c-danger); border-color: rgba(225, 29, 72, .35); }
body .btn-outline-danger:hover { background: var(--c-danger); border-color: var(--c-danger); color: #fff; }
body .btn-sm { padding: 6px 12px; border-radius: 10px; font-size: .82rem; }
body .btn-close, body .close { opacity: .55; transition: opacity .15s ease; }
body .close:hover { opacity: 1; }
body .close { background: var(--c-surface-2); width: 32px; height: 32px; border-radius: 10px; line-height: 1; padding: 0 !important; }

/* 6. TABLES & ROW ACTIONS -------------------------------------------------- */
body .page-card,
body .right_col .x_panel,
body .right_col .card {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-line) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-md) !important;
}
body .page-card { padding: 20px 22px; }

body .table-responsive { border-radius: var(--r-md); }
body .clean-table thead th,
body .right_col .x_panel table.table thead th,
body .right_col .card table.table thead th,
body .right_col .x_panel table.table-bordered > thead > tr > th {
  background: var(--c-surface-2) !important;
  color: var(--c-muted) !important;
  font-size: .74rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 13px 16px !important;
  border-bottom: 1px solid var(--c-line) !important;
  white-space: nowrap;
}
body .clean-table thead th:first-child { border-radius: 0 12px 12px 0; }
body .clean-table thead th:last-child  { border-radius: 12px 0 0 12px; }
body .clean-table tbody td,
body .right_col .x_panel table.table tbody td,
body .right_col .card table.table tbody td {
  padding: 14px 16px !important;
  color: var(--c-text) !important;
  border-bottom: 1px solid var(--c-line-soft) !important;
  vertical-align: middle !important;
  font-size: .92rem;
}
body .clean-table tbody tr,
body .right_col table.table tbody tr { transition: background .12s ease; }
body .clean-table tbody tr:hover td,
body .right_col table.table tbody tr:hover td { background: #f6f7fd !important; }
body .clean-table tbody tr:last-child td { border-bottom: 0 !important; }

/* highlighted rows (keep meaning, refresh colours) */
body .car-row--expired td { background: var(--c-danger-soft) !important; }
body .mp-row--due td      { background: var(--c-danger-soft) !important; }
body .mp-row--near td     { background: var(--c-warning-soft) !important; }
body .notif-row--unread td { background: var(--app-primary-soft) !important; font-weight: 600; }

/* key/value detail tables */
body .right_col .x_panel table.table-bordered,
body .right_col table.table-bordered {
  border: 1px solid var(--c-line) !important;
  border-radius: var(--r-md) !important;
}
body .right_col .x_panel table.table-bordered > tbody > tr > th {
  background: var(--c-surface-2) !important;
  color: var(--c-muted) !important;
  font-weight: 700 !important;
  border-bottom: 1px solid var(--c-line-soft) !important;
}

/* row action icons */
body .ibtn {
  border-radius: 10px;
  border: 1px solid var(--c-line);
  background: #fff;
  box-shadow: var(--sh-xs);
}
body .ibtn:hover { transform: translateY(-1px); box-shadow: var(--sh-sm); }
body .ibtn--edit { color: var(--app-primary); }
body .ibtn--edit:hover { background: var(--app-primary-soft); border-color: var(--app-primary); }
body .ibtn--del  { color: var(--c-danger); }
body .ibtn--del:hover { background: var(--c-danger-soft); border-color: var(--c-danger); }
body .ibtn--view { color: var(--c-info); }
body .ibtn--view:hover { background: var(--c-info-soft); border-color: var(--c-info); }
body .ibtn--on   { color: var(--c-success); }
body .ibtn--on:hover { background: var(--c-success-soft); border-color: var(--c-success); }
body .ibtn--off, body .ibtn--doc { color: var(--c-warning); }
body .ibtn--off:hover, body .ibtn--doc:hover { background: var(--c-warning-soft); border-color: var(--c-warning); }
body .ibtn--stmt { color: var(--c-success); }
body .ibtn--gallery { color: var(--app-secondary); }

/* DataTables */
body .dataTables_wrapper .dataTables_filter input,
body .dataTables_wrapper .dataTables_length select {
  border: 1px solid var(--c-line); border-radius: 10px; padding: 6px 10px; background: #fff;
}
body .dataTables_wrapper .dataTables_paginate .paginate_button.current,
body .page-item.active .page-link {
  background: var(--app-primary) !important; border-color: var(--app-primary) !important; color: #fff !important; border-radius: 10px;
}

/* 7. FORMS ----------------------------------------------------------------- */
body .adm-label,
body .form-label,
body .sp-label,
body .se-label,
body label.col-form-label {
  color: var(--c-text-2);
  font-weight: 700;
  font-size: .84rem;
  margin-bottom: 6px;
}
body .form-control,
body .form-select,
body .right_col .card-body .form-control,
body .right_col .card-body .form-select,
body textarea.form-control,
body .sp-field,
body input[type="text"].form-control {
  border: 1px solid var(--c-line) !important;
  border-radius: 12px !important;
  background-color: #fff;
  color: var(--c-text);
  min-height: 44px;
  padding: 9px 14px;
  font-size: .93rem;
  box-shadow: var(--sh-xs);
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
body textarea.form-control { min-height: 100px; }
body .form-control::placeholder, body input::placeholder, body textarea::placeholder { color: #a7b1c4 !important; opacity: 1; }
body .form-control:hover, body .form-select:hover { border-color: #cbd3e5 !important; }
body .form-control:focus, body .form-select:focus,
body .right_col .card-body .form-control:focus,
body .right_col .card-body .form-select:focus,
body .sp-field:focus {
  border-color: var(--app-primary) !important;
  box-shadow: var(--ring) !important;
  background: #fff;
  outline: 0;
}
body .form-control:disabled, body .form-control[readonly] { background: var(--c-surface-2); color: var(--c-muted); }
body input[type="file"].form-control { padding: 7px 10px; }
body input[type="file"].form-control::file-selector-button {
  background: var(--app-primary-soft); color: var(--app-primary); border: 0; border-radius: 9px;
  padding: 6px 12px; margin-inline-end: 12px; font-weight: 700; cursor: pointer;
}
body input[type="checkbox"], body input[type="radio"] { accent-color: var(--app-primary); }
body .is-invalid, body .form-control.is-invalid { border-color: var(--c-danger) !important; }
body .is-invalid:focus { box-shadow: 0 0 0 4px rgba(225, 29, 72, .12) !important; }
body .invalid-feedback { color: var(--c-danger); font-size: .8rem; font-weight: 600; }
body .required, body .se-req, body .sp-req { color: var(--c-danger); }
body .input-group .form-control { border-radius: 12px 0 0 12px !important; }
body .input-group > .btn, body .input-group-addon { border-radius: 0 12px 12px 0; }

body .adm-filters {
  background: var(--c-surface-2);
  border: 1px solid var(--c-line-soft);
  border-radius: var(--r-md);
  padding: 14px 16px 16px;
}

/* select2 */
body .select2-container--default .select2-selection--single,
body .select2-container--default .select2-selection--multiple {
  min-height: 44px;
  border: 1px solid var(--c-line) !important;
  border-radius: 12px !important;
  background: #fff;
  box-shadow: var(--sh-xs);
}
body .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 42px; padding-inline: 14px; color: var(--c-text); }
body .select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px; }
body .select2-container--default.select2-container--focus .select2-selection--multiple,
body .select2-container--default.select2-container--open .select2-selection--single { border-color: var(--app-primary) !important; box-shadow: var(--ring); }
body .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--app-primary-soft); color: var(--app-primary); border: 0; border-radius: 8px; font-weight: 600; padding: 2px 8px;
}
body .select2-dropdown { border: 1px solid var(--c-line); border-radius: 12px; box-shadow: var(--sh-md); overflow: hidden; }
body .select2-container--default .select2-results__option--highlighted[aria-selected],
body .select2-container--default .select2-results__option--highlighted { background: var(--app-primary) !important; }

/* datepicker */
body .datepicker { border-radius: var(--r-md); box-shadow: var(--sh-md); border: 1px solid var(--c-line); padding: 8px; }
body .datepicker table tr td.active,
body .datepicker table tr td.active:hover,
body .datepicker table tr td span.active { background: var(--app-primary) !important; border-radius: 8px; text-shadow: none; }
body .datepicker table tr td, body .datepicker table tr td span { border-radius: 8px; }

/* 8. CARDS, PANELS, MODALS, TABS ------------------------------------------ */
body .right_col .card > .card-header,
body .right_col .x_panel > .border-bottom,
body .right_col .x_panel .x_title {
  background: transparent !important;
  border-bottom: 1px solid var(--c-line-soft) !important;
  padding: 18px 22px !important;
}
body .right_col .card > .card-body { padding: 20px 22px !important; }
body .right_col .card .card-header h3,
body .right_col .card .card-header h4,
body .right_col .x_panel h3 { font-weight: 800 !important; color: var(--c-text) !important; font-size: 1.12rem !important; }
body .right_col .card>.card-header h3::before,
body .right_col .card>.card-header h4::before,
body .right_col .x_panel>.border-bottom h3::before,
body .right_col .x_panel .x_content h3::before {
  width: 4px; background: linear-gradient(var(--app-primary), var(--app-secondary));
}
body .right_col .card-header .btn.rounded-circle {
  background: var(--app-primary) !important; color: #fff !important; box-shadow: 0 10px 20px -10px rgba(4, 72, 162, .8) !important;
}
body .se-card, body .sp-card, body .imp-card {
  background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg); box-shadow: var(--sh-md); overflow: hidden;
}
body .se-card__head, body .sp-card__head, body .imp-card__head {
  background: var(--c-surface-2); border-bottom: 1px solid var(--c-line-soft);
}
body .se-card__head i, body .sp-card__head i { color: var(--app-primary); }
body .se-btn--primary, body .sp-btn--primary {
  background: var(--app-primary) !important; color: #fff !important; border-radius: 12px; border: 0; font-weight: 700;
  box-shadow: 0 10px 20px -10px rgba(4, 72, 162, .8);
}
body .sp-btn--ghost { border-radius: 12px; border: 1px solid var(--c-line); background: #fff; color: var(--c-text-2); }
body .sp-head__icon { background: var(--app-primary-soft); color: var(--app-primary); border-radius: 14px; }

body .modal-backdrop.show { opacity: .55; background: #031a40; }
body .modal-content { border-radius: var(--r-lg) !important; box-shadow: 0 40px 90px -30px rgba(15, 23, 42, .6) !important; }
body .modal-header { background: var(--c-surface-2) !important; border-bottom: 1px solid var(--c-line-soft) !important; padding: 18px 24px !important; }
body .modal-title, body .modal-header .modal-title { color: var(--c-text) !important; font-size: 1.1rem !important; font-weight: 800 !important; }
body .modal-header .modal-title.text-primary { color: var(--app-primary) !important; }
body .modal-body { color: var(--c-text); font-size: .95rem; padding: 22px 24px !important; }
body .modal-footer { background: #fff; border-top: 1px solid var(--c-line-soft) !important; padding: 14px 24px !important; }
body .modal-footer .btn + .btn { margin-inline-start: 0; }

body .nav-pills .nav-link,
body .nav-tabs .nav-link {
  color: var(--c-text-2); font-weight: 700; border-radius: 12px; padding: 9px 18px; border: 0;
  transition: .15s ease;
}
body .nav-pills .nav-link:hover, body .nav-tabs .nav-link:hover { background: var(--c-surface-2); color: var(--app-primary); }
body .nav-pills .nav-link.active, body .nav-tabs .nav-link.active {
  background: var(--app-primary) !important; color: #fff !important; box-shadow: 0 10px 20px -12px rgba(4, 72, 162, .9);
}
body .nav-tabs { border-bottom: 1px solid var(--c-line); gap: 4px; }

/* 9. BADGES, STATUS, ALERTS, PAGINATION ----------------------------------- */
body .badge { border-radius: 8px; padding: 5px 10px; font-weight: 700; font-size: .74rem; letter-spacing: .01em; }
body .badge.bg-success, body .badge-success { background: var(--c-success-soft) !important; color: var(--c-success) !important; }
body .badge.bg-danger,  body .badge-danger  { background: var(--c-danger-soft) !important;  color: var(--c-danger) !important; }
body .badge.bg-warning, body .badge-warning { background: var(--c-warning-soft) !important; color: var(--c-warning) !important; }
body .badge.bg-info,    body .badge-info    { background: var(--c-info-soft) !important;    color: var(--c-info) !important; }
body .badge.bg-primary, body .badge-primary { background: var(--app-primary-soft) !important; color: var(--app-primary) !important; }
body .badge.bg-secondary, body .badge-secondary { background: #eef1f6 !important; color: var(--c-text-2) !important; }
body .badge.bg-dark, body .badge-dark { background: #e2e8f0 !important; color: #0f172a !important; }

body .adm-status {
  border-radius: 999px; font-weight: 700; padding: 5px 12px; font-size: .78rem;
}
body .adm-status--on  { background: var(--c-success-soft) !important; color: var(--c-success) !important; }
body .adm-status--off { background: var(--c-danger-soft) !important;  color: var(--c-danger) !important; }
body .adm-status--on .adm-status__dot  { background: var(--c-success) !important; box-shadow: 0 0 0 3px rgba(5, 150, 105, .2); }
body .adm-status--off .adm-status__dot { background: var(--c-danger) !important;  box-shadow: 0 0 0 3px rgba(225, 29, 72, .2); }
body .role-pill, body .adm-role-pill, body .wl-chip { border-radius: 999px; background: var(--app-primary-soft); color: var(--app-primary); font-weight: 700; }
body .adm-avatar { border-radius: 14px; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--c-line); }
body .adm-user__name { font-weight: 700; color: var(--c-text); }
body .adm-user__email, body .adm-user__phone { color: var(--c-muted); }

body .alert { border: 0; border-radius: var(--r-md); padding: 13px 18px; font-weight: 600; }
body .alert-success { background: var(--c-success-soft); color: #047857; }
body .alert-danger  { background: var(--c-danger-soft);  color: #be123c; }
body .alert-warning { background: var(--c-warning-soft); color: #b45309; }
body .alert-info    { background: var(--c-info-soft);    color: #0369a1; }
body .dash-flash {
  border-radius: var(--r-md); border: 1px solid var(--c-line); background: #fff; box-shadow: var(--sh-sm);
}
body .dash-flash--success { border-color: rgba(5, 150, 105, .3); background: #f0fdf7; }
body .dash-flash--error   { border-color: rgba(225, 29, 72, .3);  background: #fff5f7; }
body .dash-flash--success .dash-flash__icon { background: var(--c-success); color: #fff; }
body .dash-flash--error .dash-flash__icon   { background: var(--c-danger);  color: #fff; }
body .dash-flash__title { font-weight: 800; }

body .cmp-pagination { padding-top: 14px; border-top: 1px solid var(--c-line-soft); margin-top: 10px; }
body .cmp-pg-info { color: var(--c-muted); }
body .cmp-pg-link {
  border-radius: 10px !important; border: 1px solid var(--c-line); background: #fff; color: var(--c-text-2);
  min-width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; transition: .15s ease;
}
body a.cmp-pg-link:hover { background: var(--app-primary-soft); color: var(--app-primary); border-color: transparent; }
body .cmp-pg-item.active .cmp-pg-link,
body .cmp-pg-item.is-active .cmp-pg-link {
  background: var(--app-primary) !important; color: #fff !important; border-color: var(--app-primary) !important;
  box-shadow: 0 8px 16px -8px rgba(4, 72, 162, .8);
}
body .cmp-pg-item.is-disabled .cmp-pg-link { opacity: .45; }

/* 10. FEATURE BLOCKS ------------------------------------------------------- */
/* dashboard home */
body .dash-hero {
  background: linear-gradient(120deg, #032a66 0%, #0448a2 55%, #00b8f1 135%) !important;
  border-radius: 24px; padding: 28px 32px;
  box-shadow: 0 30px 60px -32px rgba(3, 42, 102, .9);
  position: relative; overflow: hidden;
}
body .dash-hero::after {
  content: ""; position: absolute; left: -60px; top: -80px; width: 240px; height: 240px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255, 255, 255, .22), transparent);
}
body .dash-hero__title { color: #fff; font-size: 1.6rem; font-weight: 800; }
body .dash-hero__sub { opacity: .85; }
body .dash-hero__icon { background: rgba(255, 255, 255, .16); width: 64px; height: 64px; border-radius: 20px; display: flex; align-items: center; justify-content: center; }
body .dash-section__title { font-weight: 800; color: var(--c-text); }

body .stat-card {
  border-radius: var(--r-lg); border: 1px solid var(--c-line); background: #fff; box-shadow: var(--sh-sm); padding: 20px;
}
body .stat-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); border-color: rgba(4, 72, 162, .25); }
body .stat-card__icon { border-radius: 16px; }
body .stat-card__num { font-weight: 800; color: var(--c-text); font-size: 1.8rem; }
body .stat-card__label { color: var(--c-muted); font-weight: 700; }
body .sc-purple .stat-card__icon { background: rgba(4, 72, 162, .12); color: #0448a2; }
body .sc-teal   .stat-card__icon { background: rgba(0, 184, 241, .14); color: #00b8f1; }
body .sc-green  .stat-card__icon { background: var(--c-success-soft); color: var(--c-success); }
body .sc-amber  .stat-card__icon { background: var(--c-warning-soft); color: var(--c-warning); }
body .sc-blue   .stat-card__icon { background: var(--c-info-soft); color: var(--c-info); }

/* contract lines / trips / assignments cards */
body .cline, body .ctrip, body .cassign, body .cstat, body .imp-stat, body .reply-card, body .clines-wrap {
  border-radius: var(--r-lg); border: 1px solid var(--c-line); background: #fff; box-shadow: var(--sh-sm);
}
body .cline__head, body .cassign__top { background: var(--c-surface-2); border-bottom: 1px solid var(--c-line-soft); }
body .cline__icon, body .cassign__car-icon { background: var(--app-primary-soft); color: var(--app-primary); border-radius: 12px; }
body .cline__name, body .cassign__plate { font-weight: 800; color: var(--c-text); }
body .cline__id, body .cassign__car-code { color: var(--c-muted); font-weight: 700; }
body .cline__bar > *, body .cstat__bar > * { background: linear-gradient(90deg, var(--app-primary), var(--app-secondary)) !important; border-radius: 99px; }
body .ctrip--go   { border-inline-start: 4px solid var(--c-success); }
body .ctrip--back { border-inline-start: 4px solid var(--c-warning); }
body .imp-stat__num { font-weight: 800; }
body .imp-stat--ok .imp-stat__num { color: var(--c-success); }
body .imp-stat--err .imp-stat__num { color: var(--c-danger); }
body .imp-pill--ok { background: var(--c-success-soft); color: var(--c-success); }
body .imp-pill--err { background: var(--c-danger-soft); color: var(--c-danger); }

/* map / car locations */
body .worker-map-layout .left-rail,
body .worker-map-layout .right-filters,
body .worker-map-layout .map-topbar { border-radius: var(--r-lg) !important; border: 1px solid var(--c-line); box-shadow: var(--sh-md); background: #fff; }
body .worker-map-layout .map-stage { border-radius: var(--r-lg); overflow: hidden; }

/* roles / permissions */
body .permission-item, body .permission-grid > * { border-radius: 12px; }
body .permission-item { background: var(--c-surface-2); border: 1px solid var(--c-line-soft); padding: 10px 14px; }
body .role-form .form-check-input:checked { background-color: var(--app-primary); border-color: var(--app-primary); }

/* misc */
body .ln_solid, body .ln-solid { border-top: 1px solid var(--c-line); }
body .img-thumbnail { border-radius: 14px; border: 1px solid var(--c-line); box-shadow: var(--sh-xs); }
body .progress { display: none; }
body .breadcrumb li::after { color: var(--c-muted); }
body .toast-success { background-color: var(--c-success) !important; }
body .toast-error   { background-color: var(--c-danger) !important; }
body .tooltip-inner { background: #0f172a; border-radius: 8px; font-weight: 600; }

/* 10a. DASHBOARD HOME ------------------------------------------------------ */
body .dash-wrap { max-width: 1280px; padding-top: 6px !important; }
body .dash-hero {
  min-height: 150px; padding: 30px 36px; margin-bottom: 30px;
  background:
    radial-gradient(380px 260px at 12% 0%, rgba(0, 184, 241, .55), transparent 65%),
    radial-gradient(300px 300px at 100% 120%, rgba(255, 255, 255, .12), transparent 60%),
    linear-gradient(120deg, #032a66 0%, #0448a2 60%, #0a6cc4 100%) !important;
}
body .dash-hero::before {
  content: ""; position: absolute; right: -40px; bottom: -70px; width: 220px; height: 220px; border-radius: 50%;
  border: 30px solid rgba(255, 255, 255, .07);
}
body .dash-hero::after { left: auto; right: 140px; top: -110px; opacity: .6; }
body .dash-hero__text, body .dash-hero__icon { position: relative; z-index: 1; }
body .dash-hero__title { font-size: 1.85rem; font-weight: 800; margin-bottom: 8px; }
body .dash-hero__sub {
  display: inline-flex; align-items: center; gap: 8px; margin: 0; opacity: 1;
  background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 999px; padding: 5px 14px; font-size: .86rem; font-weight: 600; color: #e6f4ff;
}
body .dash-hero__sub::before { content: "\f073"; font-family: FontAwesome !important; font-size: .85rem; opacity: .9; }
body .dash-hero__icon {
  width: 84px; height: 84px; border-radius: 26px; font-size: 34px; color: #fff;
  background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .25);
  backdrop-filter: blur(6px); box-shadow: 0 20px 36px -18px rgba(0, 0, 0, .5);
}

body .dash-section__title {
  display: flex; align-items: center; gap: 10px; font-size: 1.15rem; font-weight: 800; margin: 0 4px 16px;
}
body .dash-section__title::before {
  content: ""; width: 5px; height: 22px; border-radius: 4px;
  background: linear-gradient(var(--app-primary), var(--app-secondary));
}

body .dash-section .stat-card {
  position: relative; overflow: hidden; gap: 16px; padding: 20px 22px; min-height: 96px;
  --sc: var(--app-primary); --sc-soft: rgba(4, 72, 162, .10);
  border-radius: 20px; background: #fff; border: 1px solid var(--c-line);
  box-shadow: var(--sh-sm);
}
body .dash-section .stat-card::before {
  content: ""; position: absolute; right: 0; top: 18px; bottom: 18px; width: 4px;
  border-radius: 4px 0 0 4px; background: var(--sc); opacity: 0; transition: opacity .2s ease;
}
body .dash-section .stat-card::after {
  content: "\f104"; font-family: FontAwesome !important;
  margin-inline-start: auto; width: 32px; height: 32px; flex: 0 0 32px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--c-surface-2); color: var(--c-muted); font-size: 16px;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
body .dash-section .stat-card:hover {
  transform: translateY(-4px); border-color: transparent;
  box-shadow: 0 24px 40px -22px rgba(4, 72, 162, .45);
}
body .dash-section .stat-card:hover::before { opacity: 1; }
body .dash-section .stat-card:hover::after { background: var(--sc); color: #fff; transform: translateX(-3px); }
body .dash-section .stat-card .stat-card__icon {
  width: 56px; height: 56px; border-radius: 18px; font-size: 22px;
  background: var(--sc-soft) !important; color: var(--sc) !important;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
body .dash-section .stat-card:hover .stat-card__icon { background: var(--sc) !important; color: #fff !important; transform: scale(1.06) rotate(-4deg); }
body .dash-section .stat-card__label { font-size: 1rem; font-weight: 800; color: var(--c-text); }

/* cycle brand-friendly accents across the shortcut cards */
body .dash-section .row > [class*="col"]:nth-child(6n+1) .stat-card { --sc: #0448a2; --sc-soft: rgba(4, 72, 162, .10); }
body .dash-section .row > [class*="col"]:nth-child(6n+2) .stat-card { --sc: #0891c7; --sc-soft: rgba(0, 184, 241, .14); }
body .dash-section .row > [class*="col"]:nth-child(6n+3) .stat-card { --sc: #059669; --sc-soft: rgba(5, 150, 105, .12); }
body .dash-section .row > [class*="col"]:nth-child(6n+4) .stat-card { --sc: #7c3aed; --sc-soft: rgba(124, 58, 237, .11); }
body .dash-section .row > [class*="col"]:nth-child(6n+5) .stat-card { --sc: #d97706; --sc-soft: rgba(217, 119, 6, .13); }
body .dash-section .row > [class*="col"]:nth-child(6n+6) .stat-card { --sc: #e11d48; --sc-soft: rgba(225, 29, 72, .10); }
@media (max-width: 575px) {
  body .dash-hero { padding: 22px 20px; min-height: 0; }
  body .dash-hero__title { font-size: 1.3rem; }
  body .dash-hero__icon { width: 56px; height: 56px; font-size: 24px; border-radius: 18px; }
}

/* 10a-2. DASHBOARD INSIGHTS (KPIs, charts, attention list) ----------------- */
body .dash-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin: 0 0 24px; }
body .dash-kpis .kpi { min-width: 0; }
body .dash-kpis--n6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body .dash-kpis--n5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1199px) { body .dash-kpis--n5 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
body .dash-kpis--n4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body .dash-kpis--n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 1500px) {
  body .dash-kpis--n6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (max-width: 991px) { body .dash-kpis--n4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { body .dash-panel--attention { grid-row: span 2; } }
body .kpi {
  --k: #0448a2; --k-soft: rgba(4, 72, 162, .10);
  position: relative; display: flex; align-items: center; gap: 14px; padding: 18px 18px;
  background: #fff; border: 1px solid var(--c-line); border-radius: 20px; box-shadow: var(--sh-sm);
  text-decoration: none; overflow: hidden; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body .kpi::after {
  content: ""; position: absolute; left: -26px; bottom: -34px; width: 110px; height: 110px; border-radius: 50%;
  background: var(--k-soft); transition: transform .3s ease;
}
body .kpi:hover { transform: translateY(-4px); box-shadow: 0 24px 40px -22px var(--k); border-color: transparent; }
body .kpi:hover::after { transform: scale(1.35); }
body .kpi__icon {
  position: relative; z-index: 1; flex: 0 0 52px; width: 52px; height: 52px; border-radius: 17px;
  display: inline-flex; align-items: center; justify-content: center; font-size: 21px;
  background: var(--k); color: #fff; box-shadow: 0 14px 22px -12px var(--k);
}
body .kpi__body { position: relative; z-index: 1; display: flex; flex-direction: column; min-width: 0; }
body .kpi__label { font-size: .8rem; font-weight: 700; color: var(--c-muted); }
body .kpi__value { font-size: 1.9rem; font-weight: 800; color: var(--c-text); line-height: 1.15; letter-spacing: -.02em; }
body .kpi__sub { font-size: .76rem; font-weight: 600; color: var(--c-text-2); opacity: .8; }
body .kpi--blue   { --k: #0448a2; --k-soft: rgba(4, 72, 162, .09); }
body .kpi--cyan   { --k: #0891c7; --k-soft: rgba(0, 184, 241, .14); }
body .kpi--green  { --k: #059669; --k-soft: rgba(5, 150, 105, .12); }
body .kpi--violet { --k: #6d28d9; --k-soft: rgba(124, 58, 237, .10); }
body .kpi--amber  { --k: #d97706; --k-soft: rgba(217, 119, 6, .13); }
body .kpi--rose   { --k: #e11d48; --k-soft: rgba(225, 29, 72, .10); }

body .dash-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 18px; margin-bottom: 30px; }
body .dash-panel {
  grid-column: span 4; min-width: 0; display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--c-line); border-radius: 22px; box-shadow: var(--sh-sm); padding: 18px 20px 20px;
}
body .dash-panel--wide { grid-column: span 8; }
body .dash-panel--full { grid-column: 1 / -1; }
body .dash-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 16px; }
body .dash-panel__head h3 {
  margin: 0; font-size: 1rem; font-weight: 800; color: var(--c-text); display: flex; align-items: center; gap: 10px;
}
body .dash-panel__head h3 i {
  width: 34px; height: 34px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--app-primary-soft); color: var(--app-primary); font-size: 15px;
}
body .dash-panel__link {
  font-size: .78rem; font-weight: 700; color: var(--app-primary); background: var(--app-primary-soft);
  border-radius: 999px; padding: 4px 12px; white-space: nowrap; text-decoration: none; transition: .15s ease;
}
body .dash-panel__link:hover { background: var(--app-primary); color: #fff; }
body .dash-panel__count {
  min-width: 26px; height: 26px; padding: 0 8px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--c-danger); color: #fff; font-size: .78rem; font-weight: 800;
}
body .dash-panel > .dash-donut, body .dash-panel > .dash-bars, body .dash-panel > .dash-week, body .dash-panel > .dash-att, body .dash-panel > .dash-ok { flex: 1; }
body .dash-panel > .dash-bars { align-content: space-evenly; }
body .dash-panel > .dash-att { align-content: start; }
body .dash-empty { color: var(--c-muted); font-weight: 600; padding: 18px 4px; text-align: center !important; }

/* donut */
body .dash-donut { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; justify-content: center; }
body .dash-donut__ring {
  --size: 150px; flex: 0 0 var(--size); width: var(--size); height: var(--size); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; box-shadow: 0 16px 30px -18px rgba(4, 72, 162, .5);
}
body .dash-donut__hole {
  width: calc(var(--size) - 44px); height: calc(var(--size) - 44px); border-radius: 50%; background: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.1;
  box-shadow: inset 0 0 0 1px var(--c-line-soft);
}
body .dash-donut__hole * { text-align: center !important; }
body .dash-donut__hole strong { font-size: 1.7rem; font-weight: 800; color: var(--c-text); }
body .dash-donut__hole span { font-size: .74rem; font-weight: 700; color: var(--c-muted); }
body .dash-legend { list-style: none; margin: 0; padding: 0; flex: 1 1 130px; min-width: 130px; display: grid; gap: 9px; }
body .dash-legend li { display: flex; align-items: center; gap: 9px; font-size: .86rem; }
body .dash-legend__dot { width: 10px; height: 10px; border-radius: 4px; flex: 0 0 10px; }
body .dash-legend__label { color: var(--c-text-2); font-weight: 600; flex: 1; }
body .dash-legend__n { font-weight: 800; color: var(--c-text); background: var(--c-surface-2); border-radius: 8px; padding: 1px 9px; }

/* horizontal bars */
body .dash-bars { display: grid; gap: 16px; padding-top: 4px; }
body .dash-bars__row { display: grid; grid-template-columns: 92px 1fr 34px; align-items: center; gap: 12px; }
body .dash-bars__label { font-size: .84rem; font-weight: 700; color: var(--c-text-2); }
body .dash-bars__track { height: 12px; border-radius: 99px; background: var(--c-surface-2); overflow: hidden; box-shadow: inset 0 0 0 1px var(--c-line-soft); }
body .dash-bars__fill { display: block; height: 100%; border-radius: 99px; transition: width .6s ease; }
body .dash-bars__n { font-weight: 800; color: var(--c-text); text-align: left !important; }

/* 7-day columns */
body .dash-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; align-items: end; height: 176px; padding-top: 6px; }
body .dash-week__col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; height: 100%; }
body .dash-week__col * { text-align: center !important; }
body .dash-week__n { font-size: .78rem; font-weight: 800; color: var(--c-text-2); }
body .dash-week__bar { flex: 1; width: 100%; max-width: 30px; display: flex; align-items: flex-end; background: var(--c-surface-2); border-radius: 10px; overflow: hidden; }
body .dash-week__bar span { display: block; width: 100%; border-radius: 10px; background: linear-gradient(180deg, var(--app-secondary), var(--app-primary)); transition: height .6s ease; }
body .dash-week__col.is-today .dash-week__bar span { background: linear-gradient(180deg, #fb7185, #e11d48); }
body .dash-week__col.is-today .dash-week__d { color: var(--c-danger); }
body .dash-week__d { font-size: .72rem; font-weight: 700; color: var(--c-muted); }

/* attention */
body .dash-att { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
body .dash-att__row {
  --t: #0448a2; --t-soft: rgba(4, 72, 162, .09);
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; text-decoration: none;
  background: var(--c-surface-2); border: 1px solid var(--c-line-soft); transition: .15s ease;
}
body .dash-att__row:hover { background: #fff; border-color: var(--t); transform: translateX(-3px); box-shadow: 0 10px 20px -14px var(--t); }
body .dash-att__icon { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: var(--t-soft); color: var(--t); }
body .dash-att__label { flex: 1; font-size: .86rem; font-weight: 700; color: var(--c-text); line-height: 1.4; }
body .dash-att__n { min-width: 30px; height: 30px; padding: 0 9px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: .86rem; background: var(--t); color: #fff; }
body .dash-att--rose   { --t: #e11d48; --t-soft: rgba(225, 29, 72, .10); }
body .dash-att--amber  { --t: #d97706; --t-soft: rgba(217, 119, 6, .13); }
body .dash-att--cyan   { --t: #0891c7; --t-soft: rgba(0, 184, 241, .14); }
body .dash-att--violet { --t: #6d28d9; --t-soft: rgba(124, 58, 237, .10); }
body .dash-att--blue   { --t: #0448a2; --t-soft: rgba(4, 72, 162, .09); }
body .dash-ok {
  display: flex; align-items: center; justify-content: center; gap: 10px; padding: 26px 10px; border-radius: 16px;
  background: var(--c-success-soft); color: #047857; font-weight: 700;
}
body .dash-ok i { font-size: 22px; }

/* documents table + latest complaints */
body .dash-table thead th { font-size: .7rem !important; }
body .dash-table tbody td { padding: 11px 14px !important; }
body .dash-table a { font-weight: 700; color: var(--c-text); text-decoration: none; }
body .dash-table a:hover { color: var(--app-primary); }
body .dash-plate {
  display: inline-block; direction: ltr; font-weight: 800; font-size: .8rem; letter-spacing: .04em; padding: 2px 10px;
  border-radius: 8px; border: 2px solid #cbd5e6; background: #fff; color: var(--c-text);
}
body .dash-cmp {
  display: flex; align-items: center; gap: 12px; padding: 11px 6px; border-bottom: 1px solid var(--c-line-soft);
  text-decoration: none; transition: background .15s ease;
}
body .dash-cmp:last-child { border-bottom: 0; }
body .dash-cmp:hover { background: var(--c-surface-2); border-radius: 12px; }
body .dash-cmp__dot { flex: 0 0 10px; width: 10px; height: 10px; border-radius: 50%; }
body .dash-cmp__dot.is-open { background: var(--c-danger); box-shadow: 0 0 0 4px rgba(225, 29, 72, .15); }
body .dash-cmp__dot.is-closed { background: var(--c-success); box-shadow: 0 0 0 4px rgba(5, 150, 105, .15); }
body .dash-cmp__body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
body .dash-cmp__name { font-weight: 800; color: var(--c-text); font-size: .9rem; }
body .dash-cmp__text { color: var(--c-muted); font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body .dash-cmp__date { color: var(--c-muted); font-size: .76rem; font-weight: 700; direction: ltr; white-space: nowrap; }

@media (max-width: 1199px) {
  body .dash-panel, body .dash-panel--wide { grid-column: span 6; }
}
@media (max-width: 767px) {
  body .dash-panel, body .dash-panel--wide { grid-column: 1 / -1; }
  body .dash-kpis, body .dash-kpis[class*="--n"] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  body .kpi { padding: 14px; gap: 10px; }
  body .kpi__icon { flex-basis: 42px; width: 42px; height: 42px; font-size: 17px; border-radius: 14px; }
  body .kpi__value { font-size: 1.5rem; }
}

/* 10b. USERS (admin/users: index · create · edit · show) ------------------ */
/* -- index -- */
body .adm-user { gap: 14px; }
body .adm-avatar {
  width: 50px; height: 50px; border-radius: 16px;
  background: var(--app-primary-soft); color: var(--app-primary);
  box-shadow: 0 0 0 3px #fff, 0 0 0 4px var(--c-line), 0 10px 18px -10px rgba(4, 72, 162, .5);
  font-size: 18px;
}
body .adm-avatar--empty { background: linear-gradient(135deg, var(--app-primary), var(--app-secondary)); color: #fff; box-shadow: 0 10px 18px -10px rgba(4, 72, 162, .7); }
body .adm-user__name { font-size: .98rem; font-weight: 800; color: var(--c-text); line-height: 1.3; }
body .adm-user__email { font-size: .82rem; color: var(--c-muted); direction: ltr; text-align: right !important; }
body .adm-user__phone {
  display: inline-flex; align-items: center; gap: 4px; margin-top: 3px;
  background: var(--c-surface-2); border: 1px solid var(--c-line-soft); border-radius: 8px;
  padding: 1px 8px; font-size: .76rem; color: var(--c-text-2); direction: ltr;
}
body .adm-user__phone i { color: var(--app-primary); }
body .adm-role-pill {
  gap: 6px; padding: 6px 13px; font-size: .8rem; font-weight: 700;
  background: var(--app-primary-soft); color: var(--app-primary); border: 1px solid rgba(4, 72, 162, .12);
}
body .adm-role-pill i { color: var(--app-secondary); }
body .adm-status-wrap { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; }
body .adm-status-btn {
  border-radius: 999px; padding: 5px 12px; font-size: .76rem; font-weight: 700; background: #fff;
  transition: .15s ease;
}
body .adm-status-btn--on  { color: var(--c-success); border-color: rgba(5, 150, 105, .3); background: #fff; }
body .adm-status-btn--on:hover  { background: var(--c-success-soft); }
body .adm-status-btn--off { color: var(--c-danger); border-color: rgba(225, 29, 72, .28); background: #fff; }
body .adm-status-btn--off:hover { background: var(--c-danger-soft); }
body .adm-locked {
  width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; background: var(--c-surface-2); color: var(--c-muted); border: 1px solid var(--c-line-soft);
}
body .adm-table td .ibtn { width: 38px; height: 38px; }
body .ibtn:has(.fa-eye)     { color: var(--c-info); }
body .ibtn:has(.fa-eye):hover { background: var(--c-info-soft); border-color: var(--c-info); }
body .ibtn:has(.fa-history) { color: var(--c-warning); }
body .ibtn:has(.fa-history):hover { background: var(--c-warning-soft); border-color: var(--c-warning); }
body .adm-table tbody td:first-child { color: var(--c-muted); font-weight: 700; }

/* -- create / edit (x_panel forms) -- */
body .right_col .x_panel { padding: 8px 10px 20px !important; }
body .x_content h3.section,
body .x_content .section {
  display: flex; align-items: center; gap: 12px;
  font-size: 1.25rem !important; font-weight: 800 !important; color: var(--c-text) !important;
  padding: 14px 4px 18px !important; margin: 0 0 22px !important;
  border-bottom: 1px solid var(--c-line-soft) !important;
}
body .right_col .x_panel .x_content h3.section::before {
  content: "\f007"; font-family: FontAwesome !important; position: static !important; transform: none !important;
  width: 44px !important; height: 44px !important; flex: 0 0 44px; border-radius: 14px;
  display: inline-flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 400;
  background: linear-gradient(135deg, var(--app-primary), var(--app-secondary)); color: #fff;
  box-shadow: 0 12px 20px -10px rgba(4, 72, 162, .7);
}
body .right_col .x_panel .x_content h3.section {
  display: flex !important; width: auto !important; position: static !important;
  padding: 6px 4px 18px !important; margin: 0 12px 22px !important; color: var(--c-text) !important;
}
body .field.item.form-group { margin-bottom: 20px; padding-inline: 12px; }
body .field.item > label.col-form-label {
  width: 100%; max-width: 100%; flex: none; padding: 0 !important; margin: 0 0 7px;
  font-size: .86rem !important; font-weight: 700 !important; color: var(--c-text-2) !important;
  text-align: right !important;
}
body .field.item > div[class*="col-"] { width: 100%; max-width: 100%; flex: none; padding: 0 !important; }
body .field.item .show-hide {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  color: #9aa9c4; cursor: pointer; line-height: 1; display: inline-flex;
}
body .field.item .show-hide .fs-5 { font-size: 1rem !important; }
body .field.item .show-hide:hover { color: var(--app-primary); }
body .field.item .position-relative .form-control { padding-left: 42px; }
body .field.item .form-check {
  display: flex; align-items: center; gap: 10px; margin: 0; padding: 11px 14px;
  background: var(--c-surface-2); border: 1px solid var(--c-line-soft); border-radius: 12px; min-height: 44px;
}
body .field.item .form-check-input { float: none; margin: 0; flex: 0 0 auto; border-color: #b9c6dc; }
body .field.item .form-check-input:checked { background-color: var(--app-primary); border-color: var(--app-primary); }
body .field.item .form-check-label { margin: 0; color: var(--c-text-2); font-weight: 600; font-size: .88rem; }
body .x_content .ln-solid { border-top: 1px dashed var(--c-line); margin: 10px 12px 22px; height: 0; }
body .x_content form > .form-group .btn,
body .x_content .btn.bg-btn-primary,
body .x_content button.bg-btn-primary {
  background: linear-gradient(135deg, var(--app-primary), #0a6cc4 60%, var(--app-secondary) 140%) !important;
  color: #fff !important; border: 0 !important; border-radius: 14px !important;
  min-height: 48px; min-width: 170px; padding: 11px 32px !important; font-weight: 800; font-size: .95rem;
  box-shadow: 0 16px 28px -14px rgba(4, 72, 162, .85);
}
body .x_content .btn.bg-btn-primary:hover { filter: brightness(1.07); transform: translateY(-2px); }
body .x_content form > .form-group { padding-inline: 12px; }
body .x_content form > .form-group > [class*="col-"] { padding: 0; max-width: none; }
body .x_content .password_section { padding-inline: 12px; }
body .x_content .password_section .col-form-label { font-weight: 700; color: var(--c-text-2); }
body .x_content form > .row.mb-3:has(#changePassword),
body .x_content .form-group:has(#changePassword) {
  background: var(--c-surface-2); border: 1px solid var(--c-line-soft); border-radius: 12px; padding: 12px 16px; margin-inline: 12px;
}
body .x_content .text-danger.small { font-weight: 600; }

/* -- show (profile card + key/value tiles) -- */
body .right_col .card > .card-header h4 { display: inline-flex; align-items: center; gap: 12px; }
body .right_col .card > .card-header h4 .fa {
  width: 42px; height: 42px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--app-primary-soft); color: var(--app-primary); margin: 0 !important; font-size: 17px;
}
body .right_col .card > .card-header h4::before { display: none; }
body .right_col .card > .card-header { padding-right: 22px !important; }
body .right_col .card-header .btn-sm { border-radius: 12px; padding: 8px 16px; font-weight: 700; }
body .right_col .card-header .btn-secondary { background: #fff; color: var(--c-text-2); border: 1px solid var(--c-line); }
body .right_col .card-header .btn-secondary:hover { background: var(--c-surface-2); color: var(--c-text); }

body .right_col .card-body .row.g-4 > .col-md-3.text-center {
  position: relative; align-self: flex-start; padding: 0 !important;
  background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg); overflow: hidden;
  box-shadow: var(--sh-sm); padding-bottom: 24px !important;
}
body .right_col .card-body .row.g-4 > .col-md-3.text-center::before {
  content: ""; display: block; height: 92px; margin-bottom: -50px;
  background: linear-gradient(120deg, #032a66, var(--app-primary) 60%, var(--app-secondary) 140%);
}
body .right_col .card-body .row.g-4 > .col-md-3.text-center > img,
body .right_col .card-body .row.g-4 > .col-md-3.text-center > .rounded-circle {
  position: relative; border: 5px solid #fff !important; box-shadow: 0 16px 30px -14px rgba(3, 42, 102, .6) !important;
  margin-bottom: 14px !important;
}
body .right_col .card-body .row.g-4 > .col-md-3.text-center,
body .right_col .card-body .row.g-4 > .col-md-3.text-center * { text-align: center !important; }
body .right_col .card-body .row.g-4 > .col-md-3.text-center .text-muted { padding-inline: 14px; word-break: break-all; }
body .right_col .card-body .row.g-4 > .col-md-3.text-center h5 { font-weight: 800; padding-inline: 14px; }
body .right_col .card-body .row.g-4 > .col-md-3.text-center .text-muted { direction: ltr; }

body .right_col .card-body .col-md-9:has(> .mb-3.row > label.fw-bold) {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; align-content: start;
}
body .right_col .card-body .col-md-9 > .mb-3.row {
  display: block; margin: 0 !important; padding: 13px 16px;
  background: var(--c-surface-2); border: 1px solid var(--c-line-soft); border-radius: 14px;
  transition: border-color .15s ease, background .15s ease;
}
body .right_col .card-body .col-md-9 > .mb-3.row:hover { background: #fff; border-color: #cfe0f6; }
body .right_col .card-body .col-md-9 > .mb-3.row > label {
  display: block; width: 100%; max-width: 100%; padding: 0 0 4px !important;
  font-size: .74rem; font-weight: 800 !important; color: var(--c-muted); text-transform: uppercase; letter-spacing: .04em;
}
body .right_col .card-body .col-md-9 > .mb-3.row > [class*="col-"] { width: 100%; max-width: 100%; padding: 0; }
body .right_col .card-body .col-md-9 .form-control-plaintext { padding: 0; font-weight: 700; color: var(--c-text); font-size: .98rem; min-height: 0; }
body .right_col .card-body .col-md-9 .badge { font-size: .78rem; padding: 6px 12px; }
@media (max-width: 767px) {
  body .right_col .card-body .col-md-9:has(> .mb-3.row > label.fw-bold) { grid-template-columns: 1fr; }
}

/* 11. LOGIN, SCROLLBARS, RESPONSIVE --------------------------------------- */
/* LOGIN — split screen: brand panel (left) + form card (right) ---------------
   Panel + logo are pure CSS (body pseudo-elements); markup is untouched.
   Only pages that contain .login-wrap get the split layout. */
body.login {
  --lg-blue: #0448a2;
  --lg-cyan: #00b8f1;
  background: #f4f8fd !important;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
}
body.login:has(.login-wrap)::before {
  content: "";
  position: fixed; inset: 0 auto 0 0; width: 46%;
  background:
    radial-gradient(520px 420px at 82% 8%, rgba(0, 184, 241, .55), transparent 62%),
    radial-gradient(460px 460px at 8% 96%, rgba(0, 184, 241, .35), transparent 60%),
    linear-gradient(155deg, #032a66 0%, #0448a2 60%, #0a6cc4 100%);
  border-radius: 0 44px 44px 0;
  box-shadow: 30px 0 80px -40px rgba(3, 42, 102, .7);
  z-index: 0;
}
/* soft rings decoration */
body.login:has(.login-wrap)::after {
  content: "";
  position: fixed; left: 23%; top: 50%;
  width: 470px; height: 470px; max-width: 40vw; max-height: 40vw;
  transform: translate(-50%, -50%);
  border-radius: 38px;
  background: #fff url('images/login-logo.png') center / 88% no-repeat;
  box-shadow:
    0 0 0 14px rgba(255, 255, 255, .10),
    0 0 0 34px rgba(255, 255, 255, .06),
    0 40px 80px -30px rgba(0, 0, 0, .55);
  z-index: 1;
}
body.login .login-wrap {
  position: relative; z-index: 2;
  margin-left: 46%;
  min-height: 100vh;
  padding: 32px clamp(20px, 5vw, 72px);
}
body.login .login-card {
  max-width: 440px;
  background: transparent;
  border: 0; box-shadow: none;
  padding: 0;
}
/* the panel already shows the logo; keep the card logo only on small screens */
body.login .login-logo { display: none; }

body.login .login-title {
  font-size: 1.85rem; font-weight: 800; color: #0b1f44;
  text-align: right !important; line-height: 1.35; margin: 0 0 8px;
}
body.login .login-subtitle {
  color: #1f2937; text-align: right !important; font-size: .98rem; margin: 0 0 30px;
}
body.login .login-field { margin-bottom: 20px; }
body.login .login-field label { color: #24324f; font-weight: 700; font-size: .86rem; }
body.login .login-input input {
  height: 54px; border: 1.5px solid #dbe4f1; border-radius: 16px;
  background: #fff; font-size: .97rem; color: #0b1f44;
  box-shadow: 0 6px 16px -12px rgba(4, 72, 162, .35);
  transition: border-color .18s ease, box-shadow .18s ease;
}
body.login .login-input input:hover { border-color: #b9c9e2; }
body.login .login-input input:focus {
  border-color: var(--lg-blue);
  box-shadow: 0 0 0 5px rgba(4, 72, 162, .12), 0 8px 18px -12px rgba(4, 72, 162, .5);
}
body.login .login-input input:focus ~ .login-icon { color: var(--lg-blue); }
body.login .login-icon, body.login .login-toggle { color: #9aa9c4; }
body.login .login-toggle:hover { color: var(--lg-blue); }
body.login .login-options { margin: 6px 0 26px; }
body.login .login-remember { color: #475569; font-weight: 600; }
body.login .login-remember input { accent-color: var(--lg-blue); }
body.login .login-forgot { color: var(--lg-blue); font-weight: 700; }
body.login .login-forgot:hover { color: var(--lg-cyan); text-decoration: none; }
body.login .login-btn {
  height: 56px; border: 0; border-radius: 16px;
  background: linear-gradient(135deg, var(--lg-blue) 0%, #0a6cc4 60%, var(--lg-cyan) 130%);
  color: #fff; font-weight: 800; font-size: 1.02rem; letter-spacing: .01em;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  box-shadow: 0 20px 34px -16px rgba(4, 72, 162, .85);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
body.login .login-btn:hover {
  transform: translateY(-2px); filter: brightness(1.06);
  box-shadow: 0 26px 40px -16px rgba(4, 72, 162, .9);
}
body.login .login-btn:active { transform: translateY(0); }
body.login .login-footer {
  color: #8a98b2; opacity: 1; text-align: right !important; margin-top: 34px;
  padding-top: 18px; border-top: 1px solid #e3eaf5; font-size: .82rem;
}
body.login .login-back { color: var(--lg-blue); font-weight: 700; }
body.login .login-back-wrap { text-align: right !important; }
body.login .dash-flash { border-radius: 14px; margin-bottom: 18px; }

/* reset / new-password pages (no .login-wrap): keep them clean and centred */
body.login:not(:has(.login-wrap)) {
  background: linear-gradient(160deg, #032a66 0%, #0448a2 60%, #0a6cc4 100%) !important;
}
body.login:not(:has(.login-wrap)) .card { border: 0; border-radius: 26px; box-shadow: 0 50px 100px -40px rgba(0, 0, 0, .7); }

/* tablet / phone: single column, logo returns inside the card */
@media (max-width: 991px) {
  body.login:has(.login-wrap)::before {
    inset: 0 0 auto 0; width: 100%; height: 230px; border-radius: 0 0 40px 40px;
  }
  body.login:has(.login-wrap)::after { display: none; }
  body.login .login-wrap { margin-left: 0; align-items: flex-start; padding-top: 70px; }
  body.login .login-card {
    background: #fff; padding: 30px 24px 22px; border-radius: 28px;
    box-shadow: 0 40px 80px -36px rgba(3, 42, 102, .55);
  }
  body.login .login-logo { display: flex; margin-bottom: 14px; }
  body.login .login-logo img { max-height: 72px; }
  body.login .login-title { font-size: 1.4rem; text-align: center !important; }
  body.login .login-subtitle { text-align: center !important; }
  body.login .login-footer { text-align: center !important; }
}

/* scrollbars */
* { scrollbar-width: thin; scrollbar-color: #c3cadb transparent; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: #c3cadb; border-radius: 99px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: #a3adc4; background-clip: padding-box; border: 2px solid transparent; }
body .left_col ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .18); background-clip: padding-box; border: 2px solid transparent; }
body .left_col * { scrollbar-color: rgba(255, 255, 255, .2) transparent; }

@media (max-width: 991px) {
  body .right_col { padding: 16px 12px 28px !important; }
  body .page-card { padding: 14px; }
  body .page-head__title h4, body .page-head__title h2 { font-size: 1.2rem; }
  body .dash-hero { padding: 20px; border-radius: 20px; }
  body .right_col .card > .card-header,
  body .right_col .card > .card-body { padding: 14px 16px !important; }
  body .modal-header, body .modal-body, body .modal-footer { padding-inline: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}
@media print {
  body .left_col, body .top_nav, body .page-head__actions { display: none !important; }
  body .right_col { margin: 0 !important; }
}

/* 10d. CLIENT-CARS SINGLE CAR (line · car · driver · employees · rides) ---- */
body .right_col:has(#ridesTable) .page-head__title { flex-wrap: wrap; gap: 12px; }
body .right_col:has(#ridesTable) .page-head__title > div:last-child { margin-inline-start: auto; }
body .right_col:has(#ridesTable) .page-head .btn.btn-primary {
  background: linear-gradient(135deg, var(--app-primary), #0a6fd6) !important; border: 0 !important; color: #fff !important;
  border-radius: 12px; padding: 9px 20px; font-weight: 800; box-shadow: 0 8px 18px -10px var(--app-primary);
}
body .right_col:has(#ridesTable) .page-head .btn.btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }

body .right_col:has(#ridesTable) .page-card { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }

/* info cards */
body .right_col:has(#ridesTable) .cline {
  border: 1px solid var(--c-line); border-radius: 18px; background: #fff;
  box-shadow: var(--sh-sm, 0 6px 20px -14px rgba(4,72,162,.25)); overflow: hidden;
}
body .right_col:has(#ridesTable) .cline__head {
  background: #fff; border-bottom: 1px solid var(--c-line-soft, #eef1f7); padding: 14px 20px; position: relative;
}
body .right_col:has(#ridesTable) .cline__head::after {
  content: ""; position: absolute; inset-inline-start: 0; top: 14px; bottom: 14px; width: 4px;
  border-radius: 0 4px 4px 0; background: linear-gradient(180deg, var(--app-primary), var(--app-secondary));
}
body .right_col:has(#ridesTable) .cline__icon {
  width: 40px; height: 40px; border-radius: 12px; font-size: 1.05rem;
  background: linear-gradient(135deg, rgba(4,72,162,.1), rgba(0,184,241,.14)); color: var(--app-primary);
}
body .right_col:has(#ridesTable) .cline__name { font-size: 1.02rem; font-weight: 800; color: var(--c-text); }
body .right_col:has(#ridesTable) .cline__body { background: #fff; padding: 16px 20px 10px; }

/* key / value tiles */
body .right_col:has(#ridesTable) .cline__body .row > [class*="col-md-"]:not(.ctrip) {
  display: flex; flex-direction: column; gap: 3px; margin-bottom: 12px !important;
}
body .right_col:has(#ridesTable) .cline__body .row > [class*="col-md-"]:not(.ctrip) > .text-muted {
  font-size: .76rem; font-weight: 700 !important; color: var(--c-muted) !important; margin: 0 !important; letter-spacing: .2px;
}
body .right_col:has(#ridesTable) .cline__body .row > [class*="col-md-"]:not(.ctrip) > .text-dark {
  font-size: .98rem; font-weight: 800; color: var(--c-text) !important;
  background: var(--c-bg); border: 1px solid var(--c-line-soft, #eef1f7); border-radius: 10px; padding: 8px 12px; min-height: 38px;
}

/* trip chip */
body .right_col:has(#ridesTable) .ctrip {
  display: grid !important; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px;
  border-radius: 12px; padding: 10px 14px; font-size: .92rem; align-self: end; margin-bottom: 12px !important;
  border: 1px solid transparent; border-inline-start-width: 4px;
}
body .right_col:has(#ridesTable) .ctrip--go   { background: #ecfbf3; color: #0b6b43; border-color: #c9f0dc; border-inline-start-color: var(--c-success); }
body .right_col:has(#ridesTable) .ctrip--back { background: #fff6e8; color: #935a05; border-color: #fbe3b8; border-inline-start-color: var(--c-warning); }
body .right_col:has(#ridesTable) .ctrip__map {
  width: 32px; height: 32px; border-radius: 10px; background: #fff; color: var(--app-primary);
  display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(4,72,162,.15);
}
body .right_col:has(#ridesTable) .ctrip__map:hover { background: var(--app-primary); color: #fff; }

/* section titles (employees / rides) */
body .right_col:has(#ridesTable) .card-title { margin-bottom: 12px !important; }
body .right_col:has(#ridesTable) .card-title h4 {
  font-size: 1.02rem; font-weight: 800; color: var(--c-text); display: flex; align-items: center; gap: 10px;
}
body .right_col:has(#ridesTable) .card-title h4::before {
  content: ""; width: 4px; height: 20px; border-radius: 4px; background: linear-gradient(180deg, var(--app-primary), var(--app-secondary));
}
body .right_col:has(#ridesTable) .pbtn--primary {
  background: linear-gradient(135deg, var(--app-primary), #0a6fd6) !important; color: #fff !important;
  border-radius: 12px; padding: 8px 16px; font-weight: 800; box-shadow: 0 8px 18px -12px var(--app-primary);
}
body .right_col:has(#ridesTable) .pbtn--primary:hover { filter: brightness(1.08); }

/* tables */
body .right_col:has(#ridesTable) .table-responsive {
  background: #fff; border: 1px solid var(--c-line); border-radius: 16px; box-shadow: var(--sh-sm, 0 6px 20px -14px rgba(4,72,162,.25)); overflow: hidden;
}
body .right_col:has(#ridesTable) .table-responsive > table { margin: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
body .right_col:has(#ridesTable) .table thead th {
  background: var(--c-bg) !important; color: var(--c-muted); font-size: .76rem; font-weight: 800; padding: 11px 16px !important;
  border-bottom: 1px solid var(--c-line) !important; white-space: nowrap;
}
body .right_col:has(#ridesTable) .table tbody td { padding: 11px 16px !important; font-size: .9rem; border-color: var(--c-line-soft, #eef1f7) !important; }
body .right_col:has(#ridesTable) .table tbody tr:hover td { background: #f6faff; }
body .right_col:has(#ridesTable) .table a { color: var(--app-primary); font-weight: 700; }
body .right_col:has(#ridesTable) #live-indicator {
  background: #eaf6ff !important; color: var(--app-primary) !important; border-radius: 99px; padding: 7px 12px; font-weight: 700;
}
@media (max-width: 767px) {
  body .right_col:has(#ridesTable) .page-head__title > div:last-child { margin-inline-start: 0; width: 100%; }
  body .right_col:has(#ridesTable) .cline__body { padding: 14px 14px 6px; }
}
body .right_col:has(#ridesTable) .cline__id { display: flex !important; flex-direction: row !important; align-items: center; gap: 12px; }
body .right_col:has(#ridesTable) .cline__head { padding-inline-start: 22px; }

/* 10e. CONTRACTS (index polish · show page: details grid + line cards) ----- */
body .adm-page:has(#myTable) .adm-table td .fa-car { color: var(--app-primary); margin-inline-end: 4px; }

/* show: details card -> tile grid */
body .right_col:has(.clines-wrap) .card { border: 1px solid var(--c-line) !important; border-radius: 18px !important; background: #fff; box-shadow: var(--sh-sm, 0 6px 20px -14px rgba(4,72,162,.25)) !important; overflow: hidden; margin-bottom: 18px !important; }
body .right_col:has(.clines-wrap) .card-header { background: #fff !important; border-bottom: 1px solid var(--c-line-soft, #eef1f7) !important; padding: 14px 20px !important; position: relative; }
body .right_col:has(.clines-wrap) .card-header::after { content: ""; position: absolute; inset-inline-start: 0; top: 14px; bottom: 14px; width: 4px; border-radius: 0 4px 4px 0; background: linear-gradient(180deg, var(--app-primary), var(--app-secondary)); }
body .right_col:has(.clines-wrap) .card-header h4,
body .right_col:has(.clines-wrap) .card-header h5 { font-size: 1.05rem; font-weight: 800; color: var(--c-text); }
body .right_col:has(.clines-wrap) .card-header h4 i,
body .right_col:has(.clines-wrap) .card-header h5 i { color: var(--app-primary); margin-inline-end: 6px; }
body .right_col:has(.clines-wrap) .card-header .btn-secondary {
  background: #fff !important; color: var(--app-primary) !important; border: 1px solid var(--c-line) !important; border-radius: 10px; font-weight: 700;
}
body .right_col:has(.clines-wrap) .card-header .btn-secondary:hover { border-color: var(--app-primary) !important; background: var(--app-primary-soft) !important; }

body .right_col:has(.clines-wrap) .card:not(.clines-wrap) > .card-body { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; padding: 18px 20px !important; }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) > .card-body > :not(.row) { grid-column: 1 / -1; }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) > .card-body > .row {
  display: flex; flex-direction: column; gap: 4px; margin: 0 !important; padding: 12px 14px;
  background: var(--c-bg); border: 1px solid var(--c-line-soft, #eef1f7); border-radius: 12px;
}
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) > .card-body > .row > [class*="col-"] { width: 100% !important; max-width: 100%; flex: none; padding: 0 !important; }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) > .card-body > .row > label { font-size: .76rem; font-weight: 700 !important; color: var(--c-muted); padding: 0 !important; margin: 0 !important; }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) .form-control-plaintext { padding: 0 !important; font-weight: 800; color: var(--c-text); font-size: .98rem; min-height: 0; }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) .form-control-plaintext a { color: var(--app-primary); }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) .badge.bg-success { background: var(--c-success-soft) !important; color: var(--c-success) !important; border-radius: 99px; padding: 6px 12px; font-weight: 800; }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) .badge.bg-danger { background: var(--c-danger-soft) !important; color: var(--c-danger) !important; border-radius: 99px; padding: 6px 12px; font-weight: 800; }
body .right_col:has(.clines-wrap) .btn-outline-primary { border-radius: 10px; font-weight: 700; color: var(--app-primary); border-color: var(--app-primary); width: fit-content; }
body .right_col:has(.clines-wrap) .btn-outline-primary:hover { background: var(--app-primary); color: #fff; }

/* lines section: kill leftover purple */
body .right_col:has(.clines-wrap) .clines-count { background: var(--app-primary-soft); color: var(--app-primary); }
body .right_col:has(.clines-wrap) .cline { border-radius: 16px; }
body .right_col:has(.clines-wrap) .cline.is-full { border-color: #bfe6f7; }
body .right_col:has(.clines-wrap) .cline__icon { background: linear-gradient(135deg, rgba(4,72,162,.1), rgba(0,184,241,.14)); color: var(--app-primary); }
body .right_col:has(.clines-wrap) .cline__badge { background: var(--c-warning-soft); color: var(--c-warning); }
body .right_col:has(.clines-wrap) .cline__body { background: var(--c-bg); }
body .right_col:has(.clines-wrap) .cassign { border: 1px solid var(--c-line); border-radius: 14px; }
body .right_col:has(.clines-wrap) .cassign__car-icon { background: var(--app-primary-soft); color: var(--app-primary); }
body .right_col:has(.clines-wrap) .cday.is-on { background: linear-gradient(135deg, var(--app-primary), #0a6fd6); color: #fff; }
body .right_col:has(.clines-wrap) .cassign--add i { background: var(--app-primary-soft); color: var(--app-primary); }
body .right_col:has(.clines-wrap) .cassign--add:hover { border-color: var(--app-primary); color: var(--app-primary); }
body .right_col:has(.clines-wrap) .cline__id { display: flex !important; flex-direction: row !important; align-items: center; gap: 12px; }
body .right_col:has(.clines-wrap) .ctrip { border: 1px solid transparent !important; border-radius: 12px; box-shadow: inset 4px 0 0 var(--c-success); background: #ecfbf3; color: #0b6b43; }
body .right_col:has(.clines-wrap) .ctrip--back { box-shadow: inset 4px 0 0 var(--c-warning); background: #fff6e8; color: #935a05; }
body .right_col:has(.clines-wrap) .cassign__top { background: transparent !important; border: 0 !important; padding: 0 !important; }
body .right_col:has(.clines-wrap) .cassign__car-code { color: var(--app-primary) !important; font-weight: 800; }
body .right_col:has(.clines-wrap) .cassign__plate { color: var(--c-muted); font-weight: 700; }

/* 10e-2. CONTRACT LINES: no grey — white cards with soft brand-blue tints --- */
body .right_col:has(.clines-wrap) .cline { background: #fff; border-color: #d9e9fb; }
body .right_col:has(.clines-wrap) .cline__head { background: linear-gradient(180deg, #f1f8ff 0%, #fff 100%) !important; border-bottom: 1px solid #e3eefb !important; }
body .right_col:has(.clines-wrap) .cline__body { background: #f7fbff !important; }
body .right_col:has(.clines-wrap) .cassign { background: #fff; border-color: #dbeafb; box-shadow: 0 10px 22px -18px rgba(4,72,162,.45); }
body .right_col:has(.clines-wrap) .cassign__plate { color: #111827; }
body .right_col:has(.clines-wrap) .cday { background: #eaf4ff; color: #1f2937; }
body .right_col:has(.clines-wrap) .cday.is-on { background: linear-gradient(135deg, var(--app-primary), #0a6fd6); color: #fff; }
body .right_col:has(.clines-wrap) .cline__bar { background: #dcecfb !important; }
body .right_col:has(.clines-wrap) .cline__cap-row { color: var(--app-primary); font-weight: 800; }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) > .card-body > .row { background: #f4f9ff; border-color: #dfeafa; }
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) > .card-body > .row > label,
body .right_col:has(.clines-wrap) .card:not(.clines-wrap) .text-muted { color: #1f2937 !important; }


/* 12. BLACK TEXT INSTEAD OF GREY (whole dashboard) ------------------------- */
body,
body .right_col,
body .right_col p,
body .right_col td,
body .right_col li,
body .right_col label,
body .right_col small,
body .right_col .small,
body .right_col .text-muted,
body .right_col .text-secondary,
body .right_col .form-label,
body .right_col .col-form-label,
body .right_col .form-control-plaintext { color: #0b1220; }
body .right_col .text-muted,
body .right_col .text-secondary,
body .right_col small,
body .right_col .small { color: #1f2937 !important; }
body .right_col .table thead th,
body .right_col .clean-table thead th,
body .right_col .adm-table thead th,
body .right_col .adm-label { color: #111827 !important; }
body .right_col .cstat__nums span,
body .right_col .cstat__hint,
body .right_col .cline__meta,
body .right_col .cassign__meta,
body .right_col .cline__id,
body .right_col .cassign__car-code { color: #111827; }
body .right_col .cday:not(.is-on) { color: #1f2937; }
body .right_col .ctrip__label,
body .right_col .ctrip__time { color: inherit; }
body ::placeholder { color: #374151 !important; opacity: 1; }
body .right_col .breadcrumb-item, body .right_col .breadcrumb-item a { color: #1f2937; }
body .btn-secondary { background: #1f2937; border-color: #1f2937; color: #fff; }

/* 10f. CUSTOMER STATEMENT (summary banner · tabs · ledger · totals) -------- */
body .right_col:has(.nav-tabs .fa-calculator) .card { border: 1px solid var(--c-line) !important; border-radius: 18px !important; background: #fff; box-shadow: var(--sh-sm, 0 6px 20px -14px rgba(4,72,162,.25)) !important; overflow: hidden; }
body .right_col:has(.nav-tabs .fa-calculator) .card-header { background: #fff !important; border-bottom: 1px solid var(--c-line-soft) !important; padding: 14px 20px !important; position: relative; }
body .right_col:has(.nav-tabs .fa-calculator) .card-header::after { content: ""; position: absolute; inset-inline-start: 0; top: 14px; bottom: 14px; width: 4px; border-radius: 0 4px 4px 0; background: linear-gradient(180deg, var(--app-primary), var(--app-secondary)); }
body .right_col:has(.nav-tabs .fa-calculator) .card-header h4 { font-size: 1.05rem; font-weight: 800; }
body .right_col:has(.nav-tabs .fa-calculator) .card-header h4 i { color: var(--app-primary); }
body .right_col:has(.nav-tabs .fa-calculator) .card-body { padding: 18px 22px; }

/* balance banner */
body .right_col:has(.nav-tabs .fa-calculator) .alert.d-flex {
  border: 1px solid transparent !important; border-radius: 16px; padding: 18px 22px; position: relative; overflow: hidden;
}
body .right_col:has(.nav-tabs .fa-calculator) .alert-warning { background: linear-gradient(135deg, #fff7e8, #fff) !important; border-color: #fbe3b8 !important; color: #7a4a05 !important; }
body .right_col:has(.nav-tabs .fa-calculator) .alert-success { background: linear-gradient(135deg, #eafaf2, #fff) !important; border-color: #c5efd9 !important; color: #08653f !important; }
body .right_col:has(.nav-tabs .fa-calculator) .alert.d-flex .fs-4 { font-size: 1.9rem !important; font-weight: 800; letter-spacing: -.5px; line-height: 1.2; margin: 2px 0 6px; }
body .right_col:has(.nav-tabs .fa-calculator) .alert.d-flex small { color: #0b1220 !important; font-weight: 700; }
body .right_col:has(.nav-tabs .fa-calculator) .alert .btn-outline-dark {
  background: #fff; color: var(--app-primary); border: 1px solid var(--c-line); border-radius: 12px; font-weight: 800; padding: 8px 16px;
}
body .right_col:has(.nav-tabs .fa-calculator) .alert .btn-outline-dark:hover { border-color: var(--app-primary); background: var(--app-primary-soft); color: var(--app-primary); }

/* tabs */
body .right_col:has(.nav-tabs .fa-calculator) .nav-tabs { gap: 6px; padding: 5px; background: #eef5fd; border-radius: 14px; width: fit-content; border: 0 !important; }
body .right_col:has(.nav-tabs .fa-calculator) .nav-tabs .nav-item { background: transparent !important; border: 0 !important; margin: 0; }
body .right_col:has(.nav-tabs .fa-calculator) .nav-tabs .nav-link { border: 0 !important; border-radius: 10px !important; padding: 8px 18px; font-weight: 800; color: #111827; background: transparent; }
body .right_col:has(.nav-tabs .fa-calculator) .nav-tabs .nav-link.active { background: linear-gradient(135deg, var(--app-primary), #0a6fd6) !important; color: #fff !important; box-shadow: 0 8px 16px -10px var(--app-primary); }

/* headings + tables */
body .right_col:has(.nav-tabs .fa-calculator) .card-body h5 { font-weight: 800; display: flex; align-items: center; gap: 10px; }
body .right_col:has(.nav-tabs .fa-calculator) .card-body h5::before { content: ""; width: 4px; height: 20px; border-radius: 4px; background: linear-gradient(180deg, var(--app-primary), var(--app-secondary)); }
body .right_col:has(.nav-tabs .fa-calculator) .table-responsive { border: 1px solid var(--c-line); border-radius: 16px; overflow: hidden; background: #fff; }
body .right_col:has(.nav-tabs .fa-calculator) .table-responsive > table { margin: 0 !important; }
body .right_col:has(.nav-tabs .fa-calculator) tr.bg-light > td { background: #f4f9ff !important; }
body .right_col:has(.nav-tabs .fa-calculator) .badge.bg-light { background: var(--app-primary-soft) !important; color: var(--app-primary) !important; border-radius: 99px; padding: 6px 12px; font-weight: 800; }
body .right_col:has(.nav-tabs .fa-calculator) .btn-success { background: linear-gradient(135deg, #059669, #10b981) !important; border: 0 !important; border-radius: 10px; font-weight: 800; }
body .right_col:has(.nav-tabs .fa-calculator) .btn-outline-success { border-radius: 10px; font-weight: 800; color: var(--c-success); border-color: var(--c-success); }
body .right_col:has(.nav-tabs .fa-calculator) .btn-outline-success:hover { background: var(--c-success); color: #fff; }

/* ledger totals */
body .right_col:has(.nav-tabs .fa-calculator) .adm-table tfoot td { background: #f4f9ff !important; border-top: 1px solid #e0ecfa !important; padding: 10px 16px !important; font-variant-numeric: tabular-nums; color: #0b1220; }
body .right_col:has(.nav-tabs .fa-calculator) .adm-table tfoot tr.fw-bold:not(.table-active) td { background: #e8f2fd !important; }
body .right_col:has(.nav-tabs .fa-calculator) .adm-table tfoot tr.table-active td { background: linear-gradient(135deg, var(--app-primary), #0a6fd6) !important; color: #fff !important; font-size: 1.02rem; border: 0 !important; }

/* 10g. TODAY'S CARS LIST (10-column trips table) --------------------------- */
body .adm-page:has(#myTable thead th:nth-child(10)) .page-head__title h4 { letter-spacing: 0; }
body .adm-page:has(#myTable thead th:nth-child(10)) .table-responsive { border: 1px solid var(--c-line); border-radius: 16px; background: #fff; overflow-x: auto; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable { margin: 0 !important; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable thead th { white-space: nowrap; font-size: .76rem; padding: 12px 14px !important; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td { padding: 12px 14px !important; font-size: .9rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:hover td { background: #f6faff; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(1) { font-weight: 800; color: var(--app-primary); }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(2) { font-weight: 800; letter-spacing: .3px; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(4),
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(5) { font-weight: 700; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(8) { font-weight: 800; color: var(--app-primary); }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(9) { font-weight: 800; text-align: center; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable thead th:nth-child(9) { text-align: center; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(6) .ibtn,
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(7) .ibtn { color: var(--app-secondary); }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable thead th { color: #111827 !important; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td { color: #0b1220 !important; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(1),
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody td:nth-child(8) { color: var(--app-primary) !important; }

/* 10g-2. TODAY'S CARS: tell go (ذهاب) from back (عودة) --------------------- */
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/go"]) td:first-child   { box-shadow: inset -4px 0 0 var(--c-success); }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/back"]) td:first-child { box-shadow: inset -4px 0 0 var(--c-warning); }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/go"]) td:nth-child(8) {
  color: #0b6b43 !important; background: #ecfbf3; font-weight: 800; box-shadow: none;
}
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/back"]) td:nth-child(8) {
  color: #935a05 !important; background: #fff6e8; font-weight: 800;
}
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/go"]) td:nth-child(8)::before,
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/back"]) td:nth-child(8)::before {
  font-family: FontAwesome; font-weight: normal; margin-inline-end: 7px; display: inline-block;
}
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/go"]) td:nth-child(8)::before   { content: "\f062"; color: var(--c-success); }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/back"]) td:nth-child(8)::before { content: "\f063"; color: var(--c-warning); }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/go"]):hover td:nth-child(8)   { background: #dcf6e8; }
body .adm-page:has(#myTable thead th:nth-child(10)) #myTable tbody tr:has(td:last-child a[href$="/back"]):hover td:nth-child(8) { background: #ffedd0; }