/* Keep the existing colours and components; align the shared header and filters. */
#layout-navbar .navbar-nav-right { width: 100%; min-width: 0; }
#layout-navbar .navbar-nav { gap: 8px; align-items: center; }
#layout-navbar .navbar-dropdown.dropdown-user > .nav-link {
  display: flex !important; align-items: center; gap: 8px;
  width: auto !important; min-width: 140px; height: 44px !important;
  padding: 4px 10px !important; border-radius: 9px;
}
#layout-navbar .dropdown-user .avatar { width: 34px; height: 34px; flex: 0 0 34px; }
#layout-navbar .dashboard-header-user-copy { display: flex !important; margin: 0; }
#layout-navbar .dashboard-header-user-chevron { position: static !important; margin-left: auto; }
#layout-navbar .dropdown-user > a::before, #layout-navbar .dropdown-user > a::after { display: none !important; }
#layout-navbar .app-header-action { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; }
html:not(.customizer-hide) .ociu-filter-form {
  display: grid !important; grid-template-columns: 140px minmax(180px,1.2fr) minmax(180px,1.2fr) minmax(165px,1fr) minmax(170px,1.1fr) auto !important;
  gap: 12px !important; align-items: end;
}
html:not(.customizer-hide) .ociu-filter-field { min-width: 0; padding-left: 36px !important; }
.ociu-filter-field label { display: block; line-height: 1.35; white-space: nowrap; margin-bottom: 5px; }
html:not(.customizer-hide) .ociu-filter-leading-icon { width: 29px !important; height: 34px !important; bottom: 0; }
.ociu-filter-field .form-select, .ociu-filter-field .form-control { width: 100%; min-width: 0; height: 36px; }
html:not(.customizer-hide) .ociu-filter-actions { display: flex; gap: 8px; align-items: center; flex-wrap: nowrap; width: auto; }
html:not(.customizer-hide) .ociu-filter-clear-btn { display: inline-flex; width: auto !important; min-width: 92px; gap: 5px; white-space: nowrap; padding: 0 8px !important; }
html:not(.customizer-hide) .ociu-filter-search-btn { flex: 0 0 36px; }
[class*="card-border-shadow-"] a, [class*="card-border-shadow-"] a:hover, [class*="card-border-shadow-"] a:focus, [class*="card-border-shadow-"] a:visited { color: inherit !important; text-decoration: none !important; }
.pending-message-table a.action-btn { display: inline-flex !important; padding: 0; text-decoration: none !important; }
.pending-message-table a.action-btn .view-btn, .pending-message-table a.action-btn .edit-btn {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 8px; border: 1px solid #cddff9;
  background: #edf4ff; color: #285cc5; cursor: pointer;
}
.pending-message-table a.action-btn .edit-btn { color: #a66008; background: #fff6e6; border-color: #efd9b6; }
.pending-message-table a.action-btn:hover .view-btn { background: #dceaff; }
.pending-message-table a.action-btn i { font-size: 15px; color: inherit !important; }
.sidebar-help-card { cursor: default; }
@media (min-width:1200px) and (max-width:1550px), (min-width:768px) and (max-width:1199px) {
  html:not(.customizer-hide) .ociu-filter-form { grid-template-columns: minmax(175px,.8fr) minmax(210px,1.2fr) minmax(180px,1fr) !important; }
  html:not(.customizer-hide) .ociu-filter-actions { justify-content: flex-end; }
}
@media (max-width:767px) {
  html:not(.customizer-hide) .ociu-filter-form { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 12px !important; }
  .ociu-filter-search-field { grid-column: 1 / -1; }
  html:not(.customizer-hide) .ociu-filter-actions { grid-column: 1 / -1; }
  .ociu-filter-field label { white-space: normal; min-height: 2.7em; display:flex; align-items:end; }
  #layout-navbar .navbar-nav { gap: 4px; }
  #layout-navbar .navbar-dropdown.dropdown-user > .nav-link { min-width: 100px; }
  #layout-navbar .app-header-action { width: 28px; }
}
@media (max-width:359px) {
  html:not(.customizer-hide) .ociu-filter-form { grid-template-columns: minmax(0,1fr) !important; }
  .ociu-filter-field label { min-height: 0; }
}

/* Compact filters remain a single scrollable row on smaller screens. */
html:not(.customizer-hide) .ociu-filter-card { overflow-x: auto; }
html:not(.customizer-hide) .ociu-filter-form { grid-template-columns: 110px minmax(125px,1fr) minmax(150px,1.25fr) minmax(145px,1fr) minmax(145px,1.1fr) auto !important; min-width: 890px; gap: 8px !important; }
html:not(.customizer-hide) .ociu-filter-field { padding-left: 0 !important; grid-column:auto !important; }
html:not(.customizer-hide) .ociu-filter-leading-icon { display:none !important; }
html:not(.customizer-hide) .ociu-filter-actions { grid-column:auto !important; }
html:not(.customizer-hide) .ociu-filter-field label { min-height:0; white-space:nowrap; font-size:10px; }
.header-projects { flex-shrink:0; }
@media(max-width:600px) { #layout-navbar { flex-wrap:wrap; } #layout-navbar .navbar-nav-right { width:auto; flex:1; } #layout-navbar .app-header-action { display:none; } #layout-navbar .dropdown-user > .nav-link { min-width:55px !important; } #layout-navbar .dashboard-header-user-copy { display:none !important; } .header-projects .btn { padding:6px 8px; } }
@media(min-width:992px) {
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tr { grid-template-rows:repeat(3,minmax(25px,auto)) !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table thead tr { grid-template-rows:42px !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-person,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-sn,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-station,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-history,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-document,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-action { grid-row:1 / span 3 !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody .message-col-direction { grid-row:3 !important; justify-content:center; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody .message-col-pending { grid-row:2 !important; gap:10px !important; justify-content:space-between; font-size:11px; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody .message-col-last-action { grid-row:3 !important; font-size:10px; }
}
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-document { display:flex !important; align-items:center; justify-content:center; gap:12px; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-document::before,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-pending::before,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-direction::before { content:none !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-last-action,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-last-action * { color:#d32f2f !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-direction i { font-size:23px; color:#3269da; }

html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody td::before { content:none !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody .message-col-person { padding:8px 10px 25px !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody .message-col-history { padding:8px 10px !important; align-self:stretch !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody .message-col-last-action { padding:0 10px 5px 86px !important; }

@media(min-width:992px) {
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody tr { min-height:108px !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-person p { margin:0 !important; line-height:1.35; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-person p:last-child { margin:3px 0 0 !important; }
}
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-document a[title="View Word"] { background:#3478f6 !important; }

/* Keep direction beside the status and both dates within the person cell. */
.message-direction-icon { font-size:22px; color:#3269da; margin-left:10px; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-updated { color:#d32f2f !important; font-size:10px; white-space:nowrap; margin:2px 0 0 !important; }
@media(min-width:992px) {
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody tr { grid-template-rows:repeat(2,minmax(28px,auto)) !important; min-height:94px !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-person,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-sn,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-station,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-history,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-document,
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-action { grid-row:1 / span 2 !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table tbody .message-col-person { padding:7px 10px !important; }
}

/* Shared header and clear, consistent controls. */
html:not(.customizer-hide) #layout-navbar { display:flex !important; flex-wrap:nowrap !important; gap:12px; overflow:visible !important; }
html:not(.customizer-hide) #layout-navbar .header-projects { flex:1 1 0 !important; min-width:0; display:flex !important; }
html:not(.customizer-hide) #layout-navbar .header-projects a { flex:1 1 50%; text-align:center; min-width:0; padding:9px 6px; }
html:not(.customizer-hide) #layout-navbar .navbar-nav-right { flex:0 0 auto !important; width:auto !important; }
html:not(.customizer-hide) body #layout-navbar .navbar-dropdown.dropdown-user > .nav-link { display:flex !important; width:auto !important; min-width:110px !important; }
html:not(.customizer-hide) body #layout-navbar .dashboard-header-user-copy { display:flex !important; }
html:not(.customizer-hide) body #layout-navbar .dropdown-menu { z-index:1100; }
html:not(.customizer-hide) #layout-menu .menu-item.open > .menu-link,
html:not(.customizer-hide) #layout-menu .menu-item.active > .menu-link,
html:not(.customizer-hide) #layout-menu .menu-item > .menu-link:hover { color:#fff !important; }
html:not(.customizer-hide) #layout-menu .menu-item.open > .menu-link *,
html:not(.customizer-hide) #layout-menu .menu-item.active > .menu-link * { color:inherit !important; }
.message-updated,.message-col-pending { font-weight:700 !important; }
html:not(.customizer-hide) body #criminalForm { max-width:1100px; margin:auto; padding:24px; border-radius:12px; }
html:not(.customizer-hide) body #criminalForm .form-header { font-size:20px !important; margin:0 0 22px; text-align:left; }
.upload-preview { position:relative; margin-top:10px; border:1px solid #d8e0ec; border-radius:9px; display:flex; align-items:center; gap:12px; padding:12px 32px 12px 12px; min-height:74px; word-break:break-word; }
.upload-preview img { width:65px; height:65px; object-fit:cover; border-radius:6px; }
.upload-preview strong { padding:10px; background:#edf2ff; color:#355ec7; border-radius:5px; }
.upload-remove { position:absolute; right:5px; top:2px; border:0; background:transparent; font-size:23px; color:#d43d3d; }
.detail-photo { width:76px; height:76px; object-fit:cover; border-radius:9px; }
.detail-information > div { display:grid; grid-template-columns:110px 1fr; gap:12px; padding:10px 0; border-bottom:1px solid #e5e9f0; }
.detail-information dt { font-size:13px; font-weight:500; color:#69758b; }
.detail-information dd { margin:0; overflow-wrap:anywhere; }
.document-preview { width:100%; height:420px; border:1px solid #e5e9f0; border-radius:8px; }
#document-edit[hidden] { display:none !important; }
.dark-style body,.dark-style .content-wrapper { background:#171d30 !important; color:#d9e0ef; }
.dark-style .card,.dark-style .ociu-filter-card,.dark-style #criminalForm,.dark-style .message-list-titlebar,.dark-style #layout-navbar { background:#252e46 !important; color:#d9e0ef !important; }
.dark-style .form-input,.dark-style .form-control,.dark-style .form-select { background:#1b2338 !important; color:#d9e0ef !important; border-color:#46516b !important; }
.dark-style .pending-message-table tr,.dark-style .pending-message-table td,.dark-style .pending-message-table th { background:#252e46 !important; color:#d9e0ef !important; border-color:#46516b !important; }
.dark-style .pending-message-table .text-black,.dark-style .pending-message-table .text-gray-800,.dark-style .pending-message-table .text-gray-600 { color:#d9e0ef !important; }
@media(max-width:767px){
html:not(.customizer-hide) #layout-navbar { gap:5px; }
html:not(.customizer-hide) #layout-navbar .navbar-dropdown.dropdown-user > .nav-link { min-width:36px !important; padding:0 !important; }
html:not(.customizer-hide) #layout-navbar .dashboard-header-user-copy { display:none !important; }
html:not(.customizer-hide) #layout-navbar .header-projects a { font-size:11px; padding:8px 3px; }
#layout-navbar .layout-menu-toggle { margin-right:0 !important; }
}

html:not(.customizer-hide) body #layout-navbar .navbar-nav > li { display:block !important; }

html body .swal2-actions button[style*="display: none"] { display:none !important; }
html:not(.customizer-hide) body #criminalForm .form-header { padding:0 0 14px !important; background:transparent !important; border-radius:0; border-bottom:1px solid #e1e6ef; text-transform:none !important; }

/* Shared component sizing, identical on every screen. */
html:not(.customizer-hide) body #layout-navbar .navbar-dropdown.dropdown-user > .nav-link { height:44px !important; padding:4px 8px !important; border:0 !important; background:transparent !important; box-shadow:none !important; }
html:not(.customizer-hide) body #layout-navbar .avatar { width:36px !important; height:36px !important; flex:0 0 36px !important; border-radius:50% !important; background:#e9eef8; padding:4px; overflow:hidden; }
html:not(.customizer-hide) body #layout-navbar .avatar img { width:100% !important; height:100% !important; border-radius:50% !important; object-fit:contain !important; }
html:not(.customizer-hide) body #layout-navbar li[data-count] { position:relative !important; }
html:not(.customizer-hide) body #layout-navbar li[data-count]::after { position:absolute !important; top:-2px !important; right:-4px !important; font-size:9px; }
html:not(.customizer-hide) .ociu-filter-form { grid-template-columns:140px 165px 190px 185px 200px auto !important; min-width:1060px !important; }
html:not(.customizer-hide) body #criminalForm .source-readonly { background:#edf0f4 !important; color:#737d8c !important; cursor:default; }
.entry-upload-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:24px; }
.entry-remarks { grid-column:span 3; }
html:not(.customizer-hide) #criminalForm textarea { min-height:72px; resize:vertical; }
.upload-preview strong { flex-shrink:0; white-space:nowrap; }
.upload-preview span { min-width:0; overflow-wrap:anywhere; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-empty-row { display:block !important; min-height:140px !important; height:auto !important; width:100% !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-empty-cell { display:flex !important; width:100% !important; min-height:140px !important; padding:32px !important; justify-content:center !important; align-items:center !important; border:0 !important; white-space:normal !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-person > div { width:100%; min-width:0; align-items:flex-start; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .photo-container { width:48px !important; min-width:48px !important; flex:0 0 48px !important; margin-right:12px; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .photo-container img { width:44px !important; height:44px !important; margin:0 !important; object-fit:cover; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-person > div > div:last-child { min-width:0; flex:1; overflow-wrap:anywhere; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-col-document { flex-wrap:wrap !important; align-content:center; gap:6px !important; }
html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-updated { flex:0 0 100%; white-space:normal !important; font-size:9px; text-align:center; }
html:not(.customizer-hide) body.message-detail-page .detail-preview-column .card-body { padding:12px; }
html:not(.customizer-hide) body.message-detail-page .ociu-pdf-viewer { height:calc(100vh - 135px) !important; min-height:480px !important; }
html:not(.customizer-hide) body.message-detail-page #pdf-viewer[hidden] { display:none !important; }
html:not(.customizer-hide) body.message-detail-page .ociu-pdf-canvas-stage canvas[hidden] { display:none !important; }
.note-status-grid { min-width:760px; grid-template-columns:140px repeat(5,minmax(115px,1fr)) !important; }
.journey-status { display:inline-block; font-size:12px; padding:7px 9px; border-radius:6px; }
.journey-status.is-current { background:#fff1c2; color:#946300; }
.journey-status.is-done { background:#ddf6e8; color:#18714b; }
.journey-status.is-waiting { background:#edf0f6; color:#68758b; }
.history-table td { font-size:13px; }
@media(max-width:767px){.entry-upload-grid { grid-template-columns:1fr; } .entry-remarks { grid-column:1 / -1; } .message-detail-page .ociu-pdf-toolbar { flex-wrap:wrap; height:auto; min-height:46px; } }

html:not(.customizer-hide) body #layout-navbar .navbar-nav > li[data-count]::after { content:attr(data-count); display:grid; place-items:center; min-width:17px; height:17px; padding:0 2px; background:#ed4058; color:#fff; border:2px solid #fff; border-radius:10px; line-height:1; }
html:not(.customizer-hide) body #layout-navbar li[data-count="0"]::after { display:none !important; }

@media(max-width:991px){html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-empty-row { display:table-row !important; } html:not(.customizer-hide) body.message-list-page.message-list-page .pending-message-table .message-empty-cell { display:table-cell !important; height:140px; text-align:center; vertical-align:middle; }}
@media(max-width:600px){
  html:not(.customizer-hide) body #layout-navbar .dashboard-header-user-copy { display:none !important; }
  html:not(.customizer-hide) body #layout-navbar .navbar-nav-right { flex:0 0 auto !important; width:auto !important; }
  html:not(.customizer-hide) body #layout-navbar .app-header-action { display:flex !important; width:30px !important; padding:4px !important; }
  html:not(.customizer-hide) body #layout-navbar .header-projects { flex:1 1 auto !important; min-width:0; }
  html:not(.customizer-hide) body #layout-navbar .header-projects .btn { padding:6px 3px !important; font-size:11px !important; white-space:nowrap; }
}
html:not(.customizer-hide) body.message-detail-page .content-wrapper > .container-xxl { margin-top:0 !important; padding-top:14px !important; padding-bottom:14px !important; }
@media(min-width:1200px){
  html:not(.customizer-hide) body.message-detail-page { overflow:auto; }
  html:not(.customizer-hide) body.message-detail-page .layout-wrapper,
  html:not(.customizer-hide) body.message-detail-page .layout-container,
  html:not(.customizer-hide) body.message-detail-page .layout-page { height:auto; min-height:100vh; }
  html:not(.customizer-hide) body.message-detail-page .layout-page,
  html:not(.customizer-hide) body.message-detail-page .content-wrapper { overflow:visible; }
}
/* Let long upload forms scroll independently of the PDF page size. */
html:has(body.message-detail-page) { overflow-y:auto !important; height:auto !important; }
html:not(.customizer-hide) body.message-detail-page { overflow-y:auto !important; height:auto !important; }
html:not(.customizer-hide) body.message-detail-page .layout-wrapper,
html:not(.customizer-hide) body.message-detail-page .layout-container,
html:not(.customizer-hide) body.message-detail-page .layout-page,
html:not(.customizer-hide) body.message-detail-page .content-wrapper { overflow:visible !important; height:auto !important; max-height:none !important; }
.ociu-processing-overlay { position:fixed; inset:0; z-index:3000; display:flex; align-items:center; justify-content:center; background:rgba(20,30,55,.48); }
.ociu-processing-overlay[hidden] { display:none !important; }
.ociu-processing-box { background:#fff; color:#243451; border-radius:12px; padding:28px 36px; text-align:center; box-shadow:0 12px 35px #182a4b33; }
.ociu-processing-spinner { width:38px; height:38px; margin:0 auto 16px; border:4px solid #e7e4ff; border-top-color:#7367f0; border-radius:50%; animation:ociu-spin .8s linear infinite; }
@keyframes ociu-spin { to { transform:rotate(360deg); } }
