/* =====================================================================
   DDIR "Command Deck" theme override for licence-check.org
   ---------------------------------------------------------------------
   Loaded AFTER assets/css/style.css + Bootstrap so it wins the cascade.
   This file is a VISUAL RESKIN only — no layout/logic assumptions.
   High specificity + !important are used deliberately because the base
   template ships many `!important` rules of its own.
   Palette + type mirror the approved Command Deck mockup.
   ===================================================================== */

:root{
  /* ground / surfaces */
  --dd-bg:#060a14;            /* navy ground            */
  --dd-panel:#0b1120;         /* header / sidebar panel  */
  --dd-surface:#0f172a;       /* cards, inputs           */
  --dd-elevated:#131c30;      /* row hover, pills        */
  --dd-raised:#182238;        /* raised hover            */
  --dd-logo-teal:#012630;     /* logo lockup backdrop (sampled from logo-main.png) */

  /* hairlines */
  --dd-border:rgba(51,65,85,.55);
  --dd-border-soft:rgba(51,65,85,.32);
  --dd-border-strong:rgba(148,163,184,.40);

  /* text */
  --dd-text:#cdd6e4;
  --dd-muted:#8595ad;
  --dd-dim:#5b6b85;
  --dd-title:#f1f5f9;

  /* accents */
  --dd-gold:#d4a853;
  --dd-gold-dim:rgba(212,168,83,.13);
  --dd-gold-line:rgba(212,168,83,.32);
  --dd-blue:#3b82f6;
  --dd-blue-bright:#60a5fa;
  --dd-blue-dim:rgba(59,130,246,.14);

  /* semantic */
  --dd-green:#22c55e;   --dd-green-dim:rgba(34,197,94,.12);
  --dd-amber:#f59e0b;   --dd-amber-dim:rgba(245,158,11,.13);
  --dd-red:#ef4444;     --dd-red-dim:rgba(239,68,68,.12);

  /* type */
  --dd-serif:"DM Serif Display",Georgia,"Times New Roman",serif;
  --dd-sans:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --dd-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}

/* =====================================================================
   1. GLOBAL GROUND + TYPOGRAPHY
   ===================================================================== */
html,
body{
  background:var(--dd-bg) !important;
  color:var(--dd-text) !important;
  font-family:var(--dd-sans) !important;
  -webkit-font-smoothing:antialiased;
}

.main-wrapper,
.page-wrapper,
.content{
  background:var(--dd-bg) !important;
  color:var(--dd-text);
}

/* Headings → serif, title colour */
h1,h2,h3,h4,h5,h6,
.page-title,
.page-header h3,
.card-title,
.card-box h4,
.morning-user h2,
.cardBeforeCardinnerSection h3{
  font-family:var(--dd-serif) !important;
  color:var(--dd-title) !important;
  font-weight:400 !important;
  letter-spacing:.2px;
}

a{ color:var(--dd-blue-bright); }
a:hover{ color:var(--dd-blue); }

/* keep bootstrap muted/text helpers legible on dark */
.text-muted{ color:var(--dd-muted) !important; }
.text-dark{ color:var(--dd-text) !important; }
hr{ border-color:var(--dd-border-soft) !important; }

/* monospace / tabular data */
code,kbd,pre,samp,.mono{
  font-family:var(--dd-mono) !important;
}
code,kbd{
  color:var(--dd-blue-bright) !important;
  background:var(--dd-elevated) !important;
  border:1px solid var(--dd-border-soft) !important;
  border-radius:6px;
  padding:1px 6px;
}
.mono{ font-variant-numeric:tabular-nums; }

/* =====================================================================
   2. HEADER (top bar) + branded logo cell
   ===================================================================== */
.header{
  background:var(--dd-panel) !important;
  border-bottom:1px solid var(--dd-border-soft) !important;
  box-shadow:none !important;
}

/* logo-main.png carries its own dark-teal backdrop; blend the cell so
   no white/teal seam shows against the panel */
.header-left{
  background:var(--dd-logo-teal) !important;
  border-right:1px solid var(--dd-border-soft) !important;
}
.header-left .logo,
.header-left img{
  background:transparent !important;
}
.header-left img{
  max-height:50px !important;
  border-radius:9px;
}

/* toggle buttons */
#toggle_btn:hover,
#mobile_btn:hover{
  background:var(--dd-elevated) !important;
}
#toggle_btn img,
#mobile_btn img{
  filter:invert(1) brightness(.85);
  opacity:.75 !important;
}

/* user identity block */
.user-names h5{ color:var(--dd-title) !important; }
.user-names span{ color:var(--dd-muted) !important; }
.user-profile-list > a.user-link:hover{ background:var(--dd-elevated) !important; }
.user-img{
  border-color:var(--dd-gold-line) !important;
  background:var(--dd-surface) !important;
}
.header .mobile-user-menu > a{ color:var(--dd-muted) !important; }

/* =====================================================================
   3. SIDEBAR / NAVIGATION
   ===================================================================== */
.sidebar{
  background:var(--dd-panel) !important;
  border-right:1px solid var(--dd-border-soft) !important;
}
.sidebar-menu .menu-title{
  color:var(--dd-gold) !important;
  opacity:.8;
}

/* top-level links */
.sidebar-menu > ul > li > a{
  color:var(--dd-muted) !important;
  font-weight:500 !important;
}
.sidebar-menu > ul > li > a:hover{
  background:var(--dd-elevated) !important;
  color:var(--dd-text) !important;
  transform:none !important;
}

/* icon pill */
.sidebar .menu-side{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border-soft) !important;
}
.sidebar .menu-side i{ color:var(--dd-muted) !important; }

/* ACTIVE top-level item → gold */
.sidebar-menu > ul > li.active > a,
.sidebar-menu > ul > li.submenu.active > a{
  background:var(--dd-gold-dim) !important;
  color:var(--dd-gold) !important;
  border:1px solid var(--dd-gold-line) !important;
  box-shadow:inset 3px 0 0 var(--dd-gold) !important;
  font-weight:600 !important;
}
.sidebar-menu > ul > li.active > a .menu-side,
.sidebar-menu > ul > li.submenu.active > a .menu-side{
  background:var(--dd-gold-dim) !important;
  border-color:var(--dd-gold-line) !important;
}
.sidebar-menu > ul > li.active > a .menu-side i,
.sidebar-menu > ul > li.submenu.active > a .menu-side i{
  color:var(--dd-gold) !important;
}

/* submenu arrow chevrons */
.sidebar-menu li.submenu > a .menu-arrow::before{
  border-right-color:var(--dd-dim) !important;
  border-bottom-color:var(--dd-dim) !important;
}
.sidebar-menu li.submenu.active > a .menu-arrow::before{
  border-right-color:var(--dd-gold) !important;
  border-bottom-color:var(--dd-gold) !important;
}

/* submenu list */
.sidebar-menu li.submenu > ul{
  border-left:1px solid var(--dd-border-soft) !important;
}
.sidebar-menu li.submenu > ul > li > a{
  color:var(--dd-dim) !important;
  font-weight:500 !important;
}
.sidebar-menu li.submenu > ul > li > a:hover{
  background:var(--dd-elevated) !important;
  color:var(--dd-text) !important;
}
.sidebar-menu li.submenu > ul > li > a.active{
  background:transparent !important;
  color:var(--dd-gold) !important;
  font-weight:600 !important;
}

/* logout */
.sidebar .logout-btn{ border-top:1px solid var(--dd-border-soft) !important; }
.sidebar .logout-btn a{ color:#f08a8a !important; }
.sidebar .logout-btn a:hover{
  background:var(--dd-red-dim) !important;
}

/* scrollbar */
.sidebar .sidebar-inner::-webkit-scrollbar-thumb{
  background:rgba(148,163,184,.18) !important;
  border:3px solid var(--dd-panel) !important;
}

/* =====================================================================
   4. CONTENT — page header / breadcrumbs / hero
   ===================================================================== */
.page-header .breadcrumb,
.breadcrumb{
  background:transparent !important;
}
.breadcrumb-item,
.breadcrumb-item a{ color:var(--dd-muted) !important; text-decoration:none; }
.breadcrumb-item a:hover{ color:var(--dd-blue-bright) !important; }
.breadcrumb-item.active{ color:var(--dd-title) !important; }
.breadcrumb-item + .breadcrumb-item::before{ color:var(--dd-dim) !important; }
.breadcrumb-item i,
.breadcrumb i{ color:var(--dd-dim) !important; }

.good-morning-blk,
.cardBeforeCardSection,
.cardBeforeCardinnerSection{
  background:transparent !important;
}

/* =====================================================================
   5. CARDS  (bootstrap .card + template .card-box + dashboard widgets)
   ===================================================================== */
.card,
.card-box,
.dash-widget,
.card.card-table{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border) !important;
  border-radius:14px !important;
  color:var(--dd-text) !important;
  box-shadow:none !important;
}
.card-body,
.card-box .card-body{
  background:transparent !important;
  color:var(--dd-text) !important;
}
.card-header{
  background:var(--dd-panel) !important;
  border-bottom:1px solid var(--dd-border-soft) !important;
  color:var(--dd-title) !important;
}
.card-footer{
  background:var(--dd-panel) !important;
  border-top:1px solid var(--dd-border-soft) !important;
}
.card-title,
.card-box h4{ color:var(--dd-title) !important; }

/* Dashboard KPI widgets */
.dash-widget{
  position:relative;
  overflow:hidden;
  border-left:3px solid var(--dd-gold) !important;
}
.dash-widget:hover{
  background:var(--dd-elevated) !important;
  box-shadow:none !important;
}
.dash-content h2,
.dash-content h2 .counter-up,
.dash-content h2 .counter{
  font-family:var(--dd-serif) !important;
  color:var(--dd-title) !important;
}
.dash-content h4{ color:var(--dd-text) !important; font-family:var(--dd-sans) !important; }
.dash-content p{ color:var(--dd-dim) !important; }
a.text-dark .dash-content h2,
a.text-dark .dash-content h4{ color:var(--dd-title) !important; }
a.text-dark:hover{ color:inherit !important; }
.dash-boxs,
.dash-box{
  background:var(--dd-gold-dim) !important;
  border:1px solid var(--dd-gold-line) !important;
}
.dash-boxs i,
.dash-box i{ color:var(--dd-gold) !important; }

/* alert-active KPI stays red-tinted but dark */
.dash-widget.alert-active{
  background:var(--dd-red-dim) !important;
  border-left-color:var(--dd-red) !important;
}
.dash-widget.alert-active h2,
.dash-widget.alert-active h4,
.dash-widget.alert-active p{ color:#fca5a5 !important; }

/* =====================================================================
   6. TABLES  (bootstrap .table + template + datatables)
   ===================================================================== */
.table,
table.dataTable,
.custom-table,
.comman-table{
  color:var(--dd-text) !important;
  border-color:var(--dd-border-soft) !important;
  --bs-table-bg:transparent;
  --bs-table-color:var(--dd-text);
  --bs-table-border-color:var(--dd-border-soft);
  --bs-table-striped-bg:rgba(148,163,184,.04);
  --bs-table-striped-color:var(--dd-text);
  --bs-table-hover-bg:var(--dd-elevated);
  --bs-table-hover-color:var(--dd-title);
  background:transparent !important;
}
.table thead th,
table.dataTable thead th,
.custom-table thead th,
.comman-table thead th{
  color:var(--dd-dim) !important;
  background:var(--dd-panel) !important;
  font-weight:600 !important;
  text-transform:uppercase;
  letter-spacing:.06em;
  border-bottom:1px solid var(--dd-border) !important;
  border-top:none !important;
}
.table td,
.table th,
table.dataTable td,
table.dataTable th,
.custom-table tbody td,
.comman-table tbody td{
  border-color:var(--dd-border-soft) !important;
  color:var(--dd-text) !important;
  background-color:transparent !important;
}
.table tbody tr:hover > *,
table.dataTable tbody tr:hover > *,
.custom-table tbody tr:hover,
.custom-table tbody tr:hover > *{
  background:var(--dd-elevated) !important;
  color:var(--dd-title) !important;
}
.table-bordered,
.table-bordered > :not(caption) > * > *{
  border-color:var(--dd-border-soft) !important;
}

/* action icon buttons inside tables */
.custom-table td.text-center a{
  background:var(--dd-elevated) !important;
  color:var(--dd-text) !important;
}
.custom-table td.text-center a:hover{ background:var(--dd-raised) !important; }
.custom-table td.text-center a.text-danger{ background:var(--dd-red-dim) !important; }

/* DataTables chrome (length / filter / info / paginate) */
.dataTables_wrapper,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate{
  color:var(--dd-muted) !important;
}
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select,
.show-entire .dataTables_filter input,
.show-entire .dataTables_length select{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button{
  color:var(--dd-muted) !important;
  background:transparent !important;
  border:1px solid var(--dd-border-soft) !important;
  border-radius:8px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
  background:var(--dd-blue) !important;
  border-color:var(--dd-blue) !important;
  color:#fff !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover{
  background:var(--dd-elevated) !important;
  color:var(--dd-text) !important;
  border-color:var(--dd-border) !important;
}

/* =====================================================================
   7. BUTTONS
   ===================================================================== */
.btn-primary{
  background:var(--dd-blue) !important;
  border-color:var(--dd-blue) !important;
  color:#fff !important;
}
.btn-primary:hover,
.btn-primary:focus{
  background:#2f6fe0 !important;
  border-color:#2f6fe0 !important;
}
.btn-secondary,
.btn-default,
.btn-light,
.btn-white,
.btn-outline-secondary{
  background:var(--dd-elevated) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
}
.btn-secondary:hover,
.btn-default:hover,
.btn-light:hover,
.btn-white:hover,
.btn-outline-secondary:hover{
  background:var(--dd-raised) !important;
  color:var(--dd-title) !important;
}
.btn-success{ background:var(--dd-green) !important; border-color:var(--dd-green) !important; color:#04210f !important; }
.btn-danger{ background:var(--dd-red) !important; border-color:var(--dd-red) !important; color:#fff !important; }
.btn-warning{ background:var(--dd-amber) !important; border-color:var(--dd-amber) !important; color:#241704 !important; }
.btn-info{ background:var(--dd-blue-bright) !important; border-color:var(--dd-blue-bright) !important; color:#041025 !important; }
.btn-link{ color:var(--dd-blue-bright) !important; }
/* gold brand CTA helper (opt-in) */
.btn-gold{ background:var(--dd-gold) !important; border-color:var(--dd-gold) !important; color:#241a05 !important; font-weight:600 !important; }

/* =====================================================================
   8. FORMS  (inputs / selects / textareas / labels / select2)
   ===================================================================== */
.form-control,
.form-select,
input.form-control,
textarea.form-control,
select.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="date"],
input[type="tel"],
input[type="url"],
textarea,
select{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
}
.form-control::placeholder,
input::placeholder,
textarea::placeholder{ color:var(--dd-dim) !important; }

.form-control:focus,
.form-select:focus,
input:focus,
textarea:focus,
select:focus{
  background:var(--dd-surface) !important;
  border-color:var(--dd-blue) !important;
  color:var(--dd-title) !important;
  box-shadow:0 0 0 3px var(--dd-blue-dim) !important;
}

/* labels */
label,
.form-label,
.local-forms label,
.focus-label,
.col-form-label{ color:var(--dd-muted) !important; }
.login-danger,
.text-danger{ color:#f08a8a !important; }

/* checkbox / radio accent */
.form-check-input{
  background-color:var(--dd-surface) !important;
  border-color:var(--dd-border) !important;
}
.form-check-input:checked{
  background-color:var(--dd-blue) !important;
  border-color:var(--dd-blue) !important;
}

/* input-group add-ons */
.input-group-text{
  background:var(--dd-elevated) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-muted) !important;
}

/* ---- select2 ---- */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  color:var(--dd-text) !important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder{
  color:var(--dd-dim) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b{
  border-color:var(--dd-muted) transparent transparent transparent !important;
}
.select2-dropdown{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field{
  background:var(--dd-elevated) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
}
.select2-container--default .select2-results__option{
  color:var(--dd-text) !important;
  background:transparent !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option[aria-selected="true"]{
  background:var(--dd-blue-dim) !important;
  color:var(--dd-title) !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
  background:var(--dd-blue-dim) !important;
  border:1px solid var(--dd-blue) !important;
  color:var(--dd-text) !important;
}

/* =====================================================================
   9. BADGES / PILLS
   ===================================================================== */
.badge{ font-weight:500; letter-spacing:.3px; }
.badge.bg-success,
.badge-success{ color:#bbf7d0 !important; background:var(--dd-green-dim) !important; border:1px solid rgba(34,197,94,.3) !important; }
.badge.bg-warning,
.badge-warning{ color:#fde68a !important; background:var(--dd-amber-dim) !important; border:1px solid rgba(245,158,11,.32) !important; }
.badge.bg-danger,
.badge-danger{ color:#fecaca !important; background:var(--dd-red-dim) !important; border:1px solid rgba(239,68,68,.3) !important; }
.badge.bg-info,
.badge-info{ color:#bfdbfe !important; background:var(--dd-blue-dim) !important; border:1px solid rgba(59,130,246,.32) !important; }
.badge.bg-primary,
.badge-primary{ color:#bfdbfe !important; background:var(--dd-blue-dim) !important; border:1px solid rgba(59,130,246,.32) !important; }
.badge.bg-secondary,
.badge.bg-light,
.badge-secondary{ color:var(--dd-text) !important; background:var(--dd-elevated) !important; border:1px solid var(--dd-border) !important; }
.flag-chip{
  background:var(--dd-elevated) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
  box-shadow:none !important;
}

/* =====================================================================
   10. DROPDOWNS / MODALS / PAGINATION / ALERTS
   ===================================================================== */
.dropdown-menu{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border) !important;
  box-shadow:0 20px 60px rgba(0,0,0,.45) !important;
}
.dropdown-item{ color:var(--dd-text) !important; }
.dropdown-item:hover,
.dropdown-item:focus{ background:var(--dd-elevated) !important; color:var(--dd-title) !important; }
.dropdown-divider{ border-color:var(--dd-border-soft) !important; }
.user-profile-list .dropdown-menu{ border:1px solid var(--dd-border) !important; }
.user-profile-list .dropdown-menu .dropdown-item:hover{ background:var(--dd-elevated) !important; }

.modal-content{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
  border-radius:14px !important;
}
.modal-header{ border-bottom:1px solid var(--dd-border-soft) !important; }
.modal-footer{ border-top:1px solid var(--dd-border-soft) !important; }
.modal-title{ color:var(--dd-title) !important; font-family:var(--dd-serif) !important; }
.btn-close{ filter:invert(1) grayscale(1) brightness(1.4); }

.pagination .page-link{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border-soft) !important;
  color:var(--dd-muted) !important;
}
.pagination .page-link:hover{ background:var(--dd-elevated) !important; color:var(--dd-text) !important; }
.pagination .page-item.active .page-link{
  background:var(--dd-blue) !important;
  border-color:var(--dd-blue) !important;
  color:#fff !important;
}
.pagination .page-item.disabled .page-link{ background:var(--dd-panel) !important; color:var(--dd-dim) !important; }

.alert-success{ background:var(--dd-green-dim) !important; border:1px solid rgba(34,197,94,.3) !important; color:#bbf7d0 !important; }
.alert-danger{ background:var(--dd-red-dim) !important; border:1px solid rgba(239,68,68,.3) !important; color:#fecaca !important; }
.alert-warning{ background:var(--dd-amber-dim) !important; border:1px solid rgba(245,158,11,.32) !important; color:#fde68a !important; }
.alert-info{ background:var(--dd-blue-dim) !important; border:1px solid rgba(59,130,246,.32) !important; color:#bfdbfe !important; }

/* SweetAlert2 popups (light-flash guard) */
.swal2-popup{ background:var(--dd-surface) !important; color:var(--dd-text) !important; border:1px solid var(--dd-border) !important; }
.swal2-title,.swal2-html-container{ color:var(--dd-text) !important; }

/* =====================================================================
   11. LOGIN / LANDING (entry screen dark card)
   ===================================================================== */
.main-wrapper.login-body{
  background:radial-gradient(1200px 600px at 50% 0%,#0f2a3a 0%,var(--dd-bg) 55%,#04070e 100%) !important;
}
.login-body .landing-header img{
  border-radius:18px;
  border:1px solid var(--dd-border-soft);
  max-width:210px !important;
}
.login-body .promo-content h1{ font-family:var(--dd-serif) !important; color:var(--dd-title) !important; }
.login-body .promo-content,
.login-body .promo-content .lead,
.login-body .promo-content p{ color:var(--dd-text) !important; }
.login-body .price-tag-landing{
  background:var(--dd-gold-dim) !important;
  border:1px solid var(--dd-gold-line) !important;
  color:var(--dd-gold) !important;
}
.login-body .feature-list-landing i{ color:var(--dd-green) !important; }

/* dark login card */
.login-body .loginbox{
  background:var(--dd-surface) !important;
  border:1px solid var(--dd-border) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.55) !important;
}
.login-body .loginbox h3{ font-family:var(--dd-serif) !important; color:var(--dd-title) !important; }
.login-body .loginbox .form-label{ color:var(--dd-muted) !important; }
.login-body .loginbox .form-control{
  background:var(--dd-elevated) !important;
  border:1px solid var(--dd-border) !important;
  color:var(--dd-text) !important;
}
.login-body .loginbox .form-control:focus{
  border-color:var(--dd-blue) !important;
  box-shadow:0 0 0 3px var(--dd-blue-dim) !important;
}
.login-body .loginbox a.text-muted{ color:var(--dd-muted) !important; }
.login-body .loginbox a.text-muted:hover{ color:var(--dd-text) !important; }

/* primary landing button → Command Deck blue */
.btn-primary-landing{
  background:var(--dd-blue) !important;
  color:#fff !important;
}
.btn-primary-landing:hover{ background:#2f6fe0 !important; }

/* =====================================================================
   12. ERROR PAGES
   ===================================================================== */
.error-pages,
.main-wrapper.error-wrapper{
  background:var(--dd-bg) !important;
  color:var(--dd-text) !important;
}

/* =====================================================================
   13. CLICK-THROUGH DETAIL CARDS  (Identity Snapshot + profile/quick-check)
   ---------------------------------------------------------------------
   These custom classes (.identity-snapshot / .idv-* / .section-block /
   .section-title / .doc-*) were styled LIGHT in style.css (white cards,
   navy/grey text) and the reskin never overrode them, so they rendered
   as unreadable light cards on the dark Command Deck theme.

   Shared by:
     - Drivers/driver-profile.blade.php   (route driver/driver-show/{id})
     - Drivers/quick-check-result.blade.php
   One override here fixes both.

   PRINT-SAFE: driver-profile.blade.php is a print report ("Print Identity"
   / "Print Full Report"). style.css keeps these cards WHITE under
   @media print. Everything below is scoped to @media screen ONLY, so the
   printed page falls back to style.css's white paper untouched.

   NO !important on colour/background here on purpose: source order +
   equal specificity already wins over style.css, and staying non-important
   lets inline colours survive — the red "⚠ Photocard Expired" pill
   (inline #dc3545) and the green/red status text in quick-check-result.
   ===================================================================== */
@media screen{

  /* section cards → dark surface */
  .driver-profile .section-block,
  .identity-snapshot{
    background:var(--dd-surface);
    border:1px solid var(--dd-border);
    box-shadow:0 14px 40px rgba(0,0,0,.35);
  }

  /* card header / title band → clean titled divider */
  .driver-profile .section-title,
  .section-title{
    background:transparent;
    border-bottom:1px solid var(--dd-border-soft);
    color:var(--dd-title);
  }
  .section-subtitle{
    color:var(--dd-muted);
  }

  /* Identity-snapshot field tiles */
  .idv-item{
    background:var(--dd-elevated);
    border:1px solid var(--dd-border-soft);
  }
  .idv-label{
    color:var(--dd-muted);
  }
  .idv-value{
    color:var(--dd-text);
  }

  /* topbar pills (base #f1f5f9). Non-!important so the inline red
     "Photocard Expired" pill (background:#dc3545) still wins. */
  .idv-pill{
    background:var(--dd-elevated);
    color:var(--dd-text);
    border:1px solid var(--dd-border-soft);
  }

  /* copy button */
  .idv-copy{
    background:var(--dd-elevated);
    border:1px solid var(--dd-border);
    color:var(--dd-blue-bright);
  }
  .idv-copy:hover{
    background:var(--dd-blue);
    border-color:var(--dd-blue);
    color:#fff;
  }
  /* .idv-copy.copied (green success) is already legible on dark — left as-is */

  /* Document / grey-fleet tiles inside the cards */
  .driver-profile .doc-card{
    background:var(--dd-elevated);
    border:1px solid var(--dd-border-soft);
  }
  .driver-profile .doc-title{
    color:var(--dd-muted);
  }
  .driver-profile .doc-empty{
    background:var(--dd-surface);
    color:var(--dd-muted);
  }

  /* The login-page card class (.loginbox) is reused OUTSIDE the login screen
     (e.g. Quick Check) where the `.login-body .loginbox` dark skin doesn't
     apply, so it falls back to style.css's white card. style.css declares
     `.loginbox{background:#ffffff !important; color:#333 !important}` — so
     unlike the idv-* overrides above, these MUST carry !important to win.
     (Safe here: the card has no inline status colours to preserve.) */
  .content .loginbox{
    background:var(--dd-surface) !important;
    border:1px solid var(--dd-border) !important;
    color:var(--dd-text) !important;
  }
  .content .loginbox h3{ color:var(--dd-title) !important; }
  .content .loginbox label{ color:var(--dd-muted) !important; }
}

/* =====================================================================
   14. PRINT-BODY GUARD
   ---------------------------------------------------------------------
   The dark ground `html,body{background:var(--dd-bg)}` above is loaded
   media="all", so without this it would win over style.css's white
   print body and "Print Full Report" would come out on a dark page with
   invisible light body text. Force white paper + dark default text for
   print; the report cards (style.css) already fall back to white here.
   ===================================================================== */
@media print{
  html, body{
    background:#fff !important;
    color:#111 !important;
  }
}