/*==============================================================================
    الديوان (Al-Diwan) — Government Administrative Communications Theme
    Palette: Navy (#0B2447) + Gold (#C9A227)
    Layered on top of Modern Admin (Bootstrap 4). Works for LTR and RTL.
    Keep this file last in the stylesheet order.
==============================================================================*/

:root {
    --gov-navy-900: #071A35;
    --gov-navy-800: #0B2447;
    --gov-navy-700: #0F2C57;
    --gov-navy-600: #19376D;
    --gov-navy-500: #2A4E8F;
    --gov-navy-100: #E8EDF6;

    --gov-gold-600: #A8851C;
    --gov-gold-500: #C9A227;
    --gov-gold-400: #E3C463;
    --gov-gold-100: #FBF3DC;

    --gov-bg: #F4F6FA;
    --gov-surface: #FFFFFF;
    --gov-border: #E5E9F0;
    --gov-border-soft: #EDF1F6;

    --gov-text: #1B2A41;
    --gov-muted: #6B7A90;
    --gov-faint: #94A3B8;

    --gov-success: #12805C;
    --gov-success-bg: #E3F4EE;
    --gov-danger: #B3261E;
    --gov-danger-bg: #FBEAE9;
    --gov-warning: #A8851C;
    --gov-warning-bg: #FBF3DC;
    --gov-info: #1C6FA8;
    --gov-info-bg: #E6F1F9;

    --gov-radius: 10px;
    --gov-radius-lg: 14px;
    --gov-shadow-sm: 0 1px 2px rgba(11, 36, 71, .06), 0 1px 3px rgba(11, 36, 71, .04);
    --gov-shadow: 0 2px 8px rgba(11, 36, 71, .07), 0 1px 3px rgba(11, 36, 71, .05);
    --gov-shadow-lg: 0 12px 32px rgba(11, 36, 71, .12);

    --gov-font: 'Cairo', 'Segoe UI', Tahoma, sans-serif;
}

/*------------------------------------------------------------------
  1. Base
------------------------------------------------------------------*/
html, body,
body.vertical-layout,
.header-navbar,
.main-menu,
.main-menu .navigation,
.card, .modal, .dropdown-menu, .table, .btn, .form-control,
.select2-container, .swal2-popup, .toast, #toast-container > div {
    font-family: var(--gov-font) !important;
}

body {
    background-color: var(--gov-bg) !important;
    color: var(--gov-text);
    font-size: .875rem;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 { color: var(--gov-navy-800); font-weight: 700; }

a { color: var(--gov-navy-600); }
a:hover, a:focus { color: var(--gov-navy-500); }

::selection { background: var(--gov-gold-100); color: var(--gov-navy-800); }

/* Scrollbars */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; box-shadow: none; }
::-webkit-scrollbar-thumb { background: #C3CDDC; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--gov-navy-500); }

/* Loader overlay */
#loaderOverlay { background-color: rgba(244, 246, 250, .9) !important; }
.loader {
    border: 6px solid var(--gov-navy-100) !important;
    border-top: 6px solid var(--gov-gold-500) !important;
    width: 46px !important;
    height: 46px !important;
}

/*------------------------------------------------------------------
  2. Top navbar
------------------------------------------------------------------*/
.header-navbar.navbar-dark.bg-primary,
.header-navbar.bg-primary {
    background: var(--gov-navy-800) !important;
    background-image: linear-gradient(90deg, var(--gov-navy-900) 0%, var(--gov-navy-800) 55%, var(--gov-navy-700) 100%) !important;
    border-bottom: 3px solid var(--gov-gold-500) !important;
    box-shadow: 0 2px 12px rgba(7, 26, 53, .18) !important;
}

.header-navbar { min-height: 62px; }
.header-navbar .navbar-wrapper { min-height: 62px; }

.header-navbar .navbar-brand { display: flex; align-items: center; }
.header-navbar .brand-logo { max-height: 34px; width: auto; }
.header-navbar .brand-text {
    color: #fff !important;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: .2px;
    margin: 0 .6rem;
    padding-top: 0;
}

.header-navbar .nav-link,
.header-navbar .navbar-nav .nav-link,
.header-navbar .dropdown-toggle,
.header-navbar .user-name,
.header-navbar i {
    color: rgba(255, 255, 255, .88) !important;
}
.header-navbar .nav-link:hover,
.header-navbar .dropdown-toggle:hover { color: var(--gov-gold-400) !important; }

.header-navbar .nav-item > a.nav-link {
    border-radius: 8px;
    transition: background-color .15s ease;
}
.header-navbar .nav-item > a.nav-link:hover { background-color: rgba(255, 255, 255, .08); }

/* mega-dropdown app name pill */
.header-navbar .mega-dropdown > a.dropdown-toggle {
    font-weight: 600;
    border-inline-start: 1px solid rgba(255, 255, 255, .18);
    margin-inline-start: .35rem;
}

/* Search input inside navbar */
.header-navbar .search-input .input {
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
    color: #fff;
    border-radius: 8px;
}
.header-navbar .search-input .input::placeholder { color: rgba(255, 255, 255, .6); }

/* Avatar */
.header-navbar .avatar img {
    border: 2px solid var(--gov-gold-500);
    border-radius: 50%;
    background: #fff;
}

/* Navbar dropdown menus */
.header-navbar .dropdown-menu {
    border: 1px solid var(--gov-border);
    border-radius: var(--gov-radius);
    box-shadow: var(--gov-shadow-lg);
    padding: .4rem;
    margin-top: .5rem;
}
.dropdown-menu .dropdown-item {
    color: var(--gov-text);
    border-radius: 7px;
    padding: .5rem .8rem;
    font-weight: 500;
}
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
    background-color: var(--gov-navy-100);
    color: var(--gov-navy-800);
}
.dropdown-menu .dropdown-item.active-language {
    color: var(--gov-muted);
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    pointer-events: none;
    border-bottom: 1px solid var(--gov-border-soft);
    border-radius: 0;
    margin-bottom: .25rem;
}
.dropdown-menu .dropdown-item.active-language:empty { display: none; }
.dropdown-divider { border-top-color: var(--gov-border-soft); }

/*------------------------------------------------------------------
  3. Sidebar (main menu)
------------------------------------------------------------------*/
.main-menu,
.main-menu.menu-light,
.main-menu.menu-fixed {
    background: var(--gov-navy-700) !important;
    background-image: linear-gradient(180deg, var(--gov-navy-700) 0%, var(--gov-navy-900) 100%) !important;
    border: 0 !important;
    box-shadow: 0 0 24px rgba(7, 26, 53, .14) !important;
}
.main-menu.menu-light .main-menu-content { background: transparent !important; }

.main-menu .navigation { background: transparent !important; padding: .75rem .55rem 2rem; }

.main-menu .navigation > li > a,
.main-menu .navigation li a {
    color: rgba(255, 255, 255, .82) !important;
    font-weight: 500;
    font-size: .975rem;
    line-height: 1.5;
    border-radius: 9px;
    padding: .72rem .9rem !important;
    margin: 2px 0;
    transition: background-color .15s ease, color .15s ease;
}

.main-menu .navigation li a .menu-title { font-size: inherit; }

.main-menu .navigation li a i {
    color: rgba(255, 255, 255, .6) !important;
    font-size: 1.2rem;
    transition: color .15s ease;
}

.main-menu.menu-light .navigation > li > a:hover,
.main-menu .navigation li a:hover {
    background-color: rgba(255, 255, 255, .07) !important;
    color: #fff !important;
}
.main-menu .navigation li a:hover i { color: var(--gov-gold-400) !important; }

/* Active item — gold accent */
.main-menu.menu-light .navigation > li.active > a,
.main-menu .navigation li.active > a,
.main-menu .navigation li.nav-item.active > a {
    background: linear-gradient(90deg, rgba(201, 162, 39, .22) 0%, rgba(201, 162, 39, .06) 100%) !important;
    color: #fff !important;
    font-weight: 700;
    box-shadow: none !important;
    position: relative;
}
.main-menu .navigation li.active > a i { color: var(--gov-gold-500) !important; }

.main-menu .navigation li.active > a::before {
    content: "";
    position: absolute;
    top: 18%;
    bottom: 18%;
    width: 3px;
    border-radius: 3px;
    background: var(--gov-gold-500);
}
html[data-textdirection="ltr"] .main-menu .navigation li.active > a::before { left: -.55rem; }
html[data-textdirection="rtl"] .main-menu .navigation li.active > a::before { right: -.55rem; }

/* Sub-menus */
.main-menu .navigation .menu-content,
.main-menu.menu-light .navigation .menu-content {
    background: rgba(0, 0, 0, .18) !important;
    border-radius: 9px;
    padding: .25rem;
    margin: 2px 0 6px;
}
.main-menu .navigation .menu-content li a {
    font-size: .9rem;
    padding: .55rem .85rem !important;
    color: rgba(255, 255, 255, .72) !important;
}

/* has-sub arrow */
.main-menu .navigation li.has-sub > a:after { color: rgba(255, 255, 255, .45); }

/* Section headers, if any */
.main-menu .navigation > li.navigation-header {
    color: var(--gov-gold-400) !important;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 1.1rem .9rem .4rem;
}

/*------------------------------------------------------------------
  4. Content area
------------------------------------------------------------------*/
/* vertical-menu.css already offsets .app-content by ~70px to clear the fixed
   navbar, so adding navbar-height padding here doubled the gap. This is just
   the breathing room under the bar. */
.app-content.content { background: transparent; padding-top: 1.25rem; }
.content-wrapper { padding: 0 .5rem; }

.content-header-title,
.content-header .content-header-title { color: var(--gov-navy-800); font-weight: 700; }

.breadcrumb { background: transparent; padding: .4rem 0; font-size: .8rem; }
.breadcrumb-item a { color: var(--gov-muted); }
.breadcrumb-item.active { color: var(--gov-navy-800); font-weight: 600; }

/*------------------------------------------------------------------
  5. Cards
------------------------------------------------------------------*/
.card {
    background: var(--gov-surface);
    border: 1px solid var(--gov-border) !important;
    border-radius: var(--gov-radius-lg) !important;
    box-shadow: var(--gov-shadow) !important;
    margin-bottom: 1.5rem;
}

.card .card-header {
    background: transparent;
    border-bottom: 1px solid var(--gov-border-soft);
    padding: 1.1rem 1.25rem .9rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.card .card-header .card-title {
    color: var(--gov-navy-800);
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0;
    position: relative;
    padding-inline-start: .75rem;
    line-height: 1.4;
}
.card .card-header .card-title::before {
    content: "";
    position: absolute;
    top: .15em;
    bottom: .15em;
    width: 4px;
    border-radius: 4px;
    background: var(--gov-gold-500);
}
html[data-textdirection="ltr"] .card .card-header .card-title::before { left: 0; }
html[data-textdirection="rtl"] .card .card-header .card-title::before { right: 0; }

.card .card-header .heading-elements { position: static; display: flex; gap: .4rem; flex-wrap: wrap; }
.card .card-content { padding: 0; }
.card .card-body { padding: 1.25rem; }
.card.px-1 { padding-left: 0 !important; padding-right: 0 !important; }

/*------------------------------------------------------------------
  6. Tables
------------------------------------------------------------------*/
.table {
    color: var(--gov-text);
    margin-bottom: 0;
    background: var(--gov-surface);
}

.table thead th,
.table.table-bordered thead th {
    background: #F7F9FC !important;
    color: var(--gov-navy-800) !important;
    font-weight: 700;
    font-size: .78rem;
    letter-spacing: .3px;
    text-transform: none;
    border-top: 0 !important;
    border-bottom: 2px solid var(--gov-navy-100) !important;
    vertical-align: middle;
    white-space: nowrap;
}

.table tfoot th {
    background: #F7F9FC !important;
    color: var(--gov-muted) !important;
    font-weight: 600;
    font-size: .75rem;
    border-top: 2px solid var(--gov-navy-100) !important;
    border-bottom: 0 !important;
}

.table td, .table th { border-color: var(--gov-border-soft) !important; vertical-align: middle; }
.table.table-bordered td, .table.table-bordered th { border: 1px solid var(--gov-border-soft) !important; }

.table.table-striped tbody tr:nth-of-type(odd) { background-color: #FBFCFE; }
.table tbody tr { transition: background-color .12s ease; }
.table tbody tr:hover { background-color: var(--gov-navy-100) !important; }

.table.table-sm td, .table.table-sm th { padding: .62rem .8rem; }

/* Rounded table shell */
.card .card-content > .table,
.card .card-content > .dataTables_wrapper .table { border-radius: 0; }

.table-responsive { border-radius: var(--gov-radius); }

/*------------------------------------------------------------------
  7. Badges — soft, legible pills
------------------------------------------------------------------*/
.badge {
    font-weight: 600;
    font-size: .72rem;
    letter-spacing: .1px;
    padding: .38em .7em;
    border-radius: 999px;
    border: 1px solid transparent;
    vertical-align: middle;
}
.badge.badge-sm { font-size: .68rem; padding: .3em .62em; }

.badge-primary { background: var(--gov-navy-100) !important; color: var(--gov-navy-800) !important; border-color: #D2DCEE !important; }
.badge-success { background: var(--gov-success-bg) !important; color: var(--gov-success) !important; border-color: #C4E6DA !important; }
.badge-danger  { background: var(--gov-danger-bg) !important;  color: var(--gov-danger) !important;  border-color: #F2CFCD !important; }
.badge-warning { background: var(--gov-warning-bg) !important; color: var(--gov-warning) !important; border-color: #EEDFAE !important; }
.badge-info    { background: var(--gov-info-bg) !important;    color: var(--gov-info) !important;    border-color: #C9E0F1 !important; }
.badge-secondary { background: #EEF1F6 !important; color: var(--gov-muted) !important; border-color: var(--gov-border) !important; }

/*------------------------------------------------------------------
  8. Buttons
------------------------------------------------------------------*/
.btn {
    font-family: var(--gov-font) !important;
    font-weight: 600;
    border-radius: 8px;
    padding: .5rem 1rem;
    letter-spacing: .1px;
    box-shadow: none !important;
    transition: transform .12s ease, background-color .15s ease, border-color .15s ease;
}
.btn:active { transform: translateY(1px); }
.btn.btn-sm { padding: .38rem .8rem; font-size: .78rem; border-radius: 7px; }

.btn-primary { background-color: var(--gov-navy-800) !important; border-color: var(--gov-navy-800) !important; color: #fff !important; }
.btn-primary:hover, .btn-primary:focus { background-color: var(--gov-navy-600) !important; border-color: var(--gov-navy-600) !important; }

.btn-warning { background-color: var(--gov-gold-500) !important; border-color: var(--gov-gold-500) !important; color: #2A2100 !important; }
.btn-warning:hover, .btn-warning:focus { background-color: var(--gov-gold-600) !important; border-color: var(--gov-gold-600) !important; color: #fff !important; }

.btn-success { background-color: var(--gov-success) !important; border-color: var(--gov-success) !important; color: #fff !important; }
.btn-success:hover { background-color: #0D6B4C !important; border-color: #0D6B4C !important; }

.btn-danger { background-color: var(--gov-danger) !important; border-color: var(--gov-danger) !important; color: #fff !important; }
.btn-danger:hover { background-color: #941D17 !important; border-color: #941D17 !important; }

.btn-info { background-color: var(--gov-info) !important; border-color: var(--gov-info) !important; color: #fff !important; }
.btn-info:hover { background-color: #175C8C !important; border-color: #175C8C !important; }

.btn-secondary { background-color: #EEF1F6 !important; border-color: var(--gov-border) !important; color: var(--gov-text) !important; }

.btn-outline-primary { color: var(--gov-navy-800) !important; border-color: var(--gov-navy-800) !important; background: transparent !important; }
.btn-outline-primary:hover { background: var(--gov-navy-800) !important; color: #fff !important; }

/*------------------------------------------------------------------
  9. Forms
------------------------------------------------------------------*/
label, .form-group label { color: var(--gov-navy-800); font-weight: 600; font-size: .82rem; margin-bottom: .35rem; }

.form-control, .custom-select {
    border: 1px solid var(--gov-border) !important;
    border-radius: 8px !important;
    color: var(--gov-text);
    font-size: .875rem;
    padding: .55rem .8rem;
    height: auto;
    background-color: #fff;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus, .custom-select:focus {
    border-color: var(--gov-navy-500) !important;
    box-shadow: 0 0 0 3px rgba(42, 78, 143, .13) !important;
}
.form-control::placeholder { color: var(--gov-faint); }

.form-control.is-invalid, .form-control.error { border-color: var(--gov-danger) !important; }
.invalid-feedback, .text-danger, span.error { color: var(--gov-danger) !important; font-size: .78rem; }

/* Select2 */
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple {
    border: 1px solid var(--gov-border) !important;
    border-radius: 8px !important;
    min-height: 40px !important;
    padding: .2rem .3rem;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: var(--gov-navy-100) !important;
    border: 1px solid #D2DCEE !important;
    color: var(--gov-navy-800) !important;
    border-radius: 999px !important;
    padding: .1rem .6rem !important;
    font-size: .78rem;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--gov-navy-600) !important;
}
.select2-dropdown { border-color: var(--gov-border) !important; border-radius: 8px !important; box-shadow: var(--gov-shadow-lg); }

/*------------------------------------------------------------------
  10. Modals
------------------------------------------------------------------*/
.modal-content {
    border: 0 !important;
    border-radius: var(--gov-radius-lg) !important;
    box-shadow: var(--gov-shadow-lg) !important;
    overflow: hidden;
}
.modal-header {
    background: var(--gov-navy-800);
    border-bottom: 3px solid var(--gov-gold-500);
    padding: 1rem 1.25rem;
}
.modal-header .modal-title { color: #fff; font-weight: 700; font-size: 1rem; }
.modal-header .close { color: #fff; opacity: .8; text-shadow: none; font-size: 1.6rem; }
.modal-header .close:hover { opacity: 1; color: var(--gov-gold-400); }
.modal-body { padding: 1.35rem 1.25rem; }
.modal-footer { border-top: 1px solid var(--gov-border-soft); padding: .9rem 1.25rem; }

/*------------------------------------------------------------------
  11. DataTables
------------------------------------------------------------------*/
.dataTables_wrapper { padding: 1rem 1.25rem 1.25rem; }
.dataTables_wrapper .dt-buttons { margin-bottom: .85rem; }
.dataTables_wrapper .dataTables_filter { margin-bottom: .85rem; }
.dataTables_wrapper .dataTables_filter label { color: var(--gov-navy-800); font-weight: 600; }
.dataTables_wrapper .dataTables_filter input {
    border: 1px solid var(--gov-border) !important;
    border-radius: 8px !important;
    padding: .45rem .75rem !important;
    margin-inline-start: .5rem;
    min-width: 220px;
    background: #fff;
}
.dataTables_wrapper .dataTables_filter input:focus {
    border-color: var(--gov-navy-500) !important;
    box-shadow: 0 0 0 3px rgba(42, 78, 143, .13);
    outline: 0;
}
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after { color: var(--gov-navy-500); opacity: .6; }
.dataTables_empty { color: var(--gov-muted) !important; padding: 2.5rem 1rem !important; font-weight: 500; }

/*------------------------------------------------------------------
  12. Pagination
------------------------------------------------------------------*/
.pagination { gap: .25rem; }
.pagination .page-link {
    border: 1px solid var(--gov-border);
    border-radius: 8px !important;
    color: var(--gov-navy-800);
    font-weight: 600;
    padding: .4rem .75rem;
    min-width: 38px;
    text-align: center;
}
.pagination .page-link:hover { background: var(--gov-navy-100); border-color: #D2DCEE; }
.pagination .page-item.active .page-link {
    background: var(--gov-navy-800) !important;
    border-color: var(--gov-navy-800) !important;
    color: #fff !important;
}
.pagination .page-item.disabled .page-link { color: var(--gov-faint); background: #F7F9FC; }

/*------------------------------------------------------------------
  13. Alerts / toasts
------------------------------------------------------------------*/
.alert { border: 1px solid transparent; border-radius: var(--gov-radius); font-weight: 500; }
.alert-success { background: var(--gov-success-bg); color: var(--gov-success); border-color: #C4E6DA; }
.alert-danger  { background: var(--gov-danger-bg);  color: var(--gov-danger);  border-color: #F2CFCD; }
.alert-warning { background: var(--gov-warning-bg); color: var(--gov-warning); border-color: #EEDFAE; }
.alert-info    { background: var(--gov-info-bg);    color: var(--gov-info);    border-color: #C9E0F1; }

#toast-container > div { border-radius: var(--gov-radius) !important; box-shadow: var(--gov-shadow-lg) !important; opacity: 1 !important; }

/*------------------------------------------------------------------
  14. Footer
------------------------------------------------------------------*/
.footer.footer-light,
footer.footer {
    background: var(--gov-surface) !important;
    border-top: 1px solid var(--gov-border) !important;
    box-shadow: none !important;
    color: var(--gov-muted);
    font-size: .8rem;
    padding: .75rem 0;
}
footer.footer a { color: var(--gov-navy-700) !important; }

/*------------------------------------------------------------------
  15. Utilities
------------------------------------------------------------------*/
.gov-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    padding: .9rem 1.25rem;
    border-bottom: 1px solid var(--gov-border-soft);
    background: #FBFCFE;
}
.gov-empty {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--gov-muted);
}
.gov-empty i { font-size: 2.5rem; color: var(--gov-faint); display: block; margin-bottom: .75rem; }

/*==============================================================================
  16. Managements organization tree
==============================================================================*/

/* View switcher */
.gov-view-switch .btn {
    background: #fff;
    border: 1px solid var(--gov-border);
    color: var(--gov-muted);
    font-weight: 600;
    padding: .38rem .85rem;
    box-shadow: none !important;
}
.gov-view-switch .btn:hover { background: var(--gov-navy-100); color: var(--gov-navy-800); }
.gov-view-switch .btn.active {
    background: var(--gov-navy-800) !important;
    border-color: var(--gov-navy-800) !important;
    color: #fff !important;
}
.gov-view-switch .btn i { margin-inline-end: .25rem; }

/* Toolbar above the tree */
.gov-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem;
    padding: .9rem 1.25rem;
    border-bottom: 1px solid var(--gov-border-soft);
    background: #FBFCFE;
}
.gov-tree-search { position: relative; flex: 1 1 240px; max-width: 340px; }
.gov-tree-search i {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gov-faint);
    font-size: 1rem;
    pointer-events: none;
}
html[data-textdirection="ltr"] .gov-tree-search i { left: .7rem; }
html[data-textdirection="rtl"] .gov-tree-search i { right: .7rem; }
html[data-textdirection="ltr"] .gov-tree-search .form-control { padding-left: 2.2rem; }
html[data-textdirection="rtl"] .gov-tree-search .form-control { padding-right: 2.2rem; }

.gov-tree-actions { display: flex; gap: .4rem; }
.gov-tree-total { margin-inline-start: auto; color: var(--gov-muted); font-size: .8rem; }
.gov-tree-total strong { color: var(--gov-navy-800); font-size: .95rem; }

/* Tree lists */
.gov-tree-wrap { padding-bottom: .5rem; }
.gov-tree, .gov-tree-children { list-style: none; margin: 0; padding: 0; }
.gov-tree { padding: 1rem 1.25rem; }

.gov-tree-children {
    position: relative;
    margin-top: .25rem;
    padding-inline-start: 1.4rem;
}
/* vertical connector */
.gov-tree-children::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 1.1rem;
    width: 2px;
    background: var(--gov-navy-100);
    border-radius: 2px;
}
html[data-textdirection="ltr"] .gov-tree-children::before { left: .45rem; }
html[data-textdirection="rtl"] .gov-tree-children::before { right: .45rem; }

.gov-tree-item { position: relative; margin-bottom: .35rem; }

/* horizontal connector into each child node */
.gov-tree-children > .gov-tree-item::before {
    content: "";
    position: absolute;
    top: 1.45rem;
    width: .85rem;
    height: 2px;
    background: var(--gov-navy-100);
}
html[data-textdirection="ltr"] .gov-tree-children > .gov-tree-item::before { left: -.95rem; }
html[data-textdirection="rtl"] .gov-tree-children > .gov-tree-item::before { right: -.95rem; }

.gov-tree-item.collapsed > .gov-tree-children { display: none; }
.gov-tree-item.collapsed > .gov-node .gov-node-toggle i { transform: rotate(-90deg); }
html[data-textdirection="rtl"] .gov-tree-item.collapsed > .gov-node .gov-node-toggle i { transform: rotate(90deg); }

/* Node card */
.gov-node {
    display: flex;
    align-items: center;
    gap: .65rem;
    background: #fff;
    border: 1px solid var(--gov-border);
    border-radius: var(--gov-radius);
    padding: .6rem .8rem;
    box-shadow: var(--gov-shadow-sm);
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.gov-node:hover {
    border-color: var(--gov-navy-500);
    box-shadow: var(--gov-shadow);
}

/* Root nodes read as the top of the hierarchy */
.gov-node.is-root {
    background: linear-gradient(90deg, rgba(11, 36, 71, .04) 0%, rgba(255, 255, 255, 0) 60%);
    border-color: #D2DCEE;
}
html[data-textdirection="ltr"] .gov-node.is-root { border-left: 4px solid var(--gov-gold-500); }
html[data-textdirection="rtl"] .gov-node.is-root { border-right: 4px solid var(--gov-gold-500); }
.gov-node.is-root .gov-node-title { font-size: .98rem; }

/* Toggle chevron */
.gov-node-toggle {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--gov-navy-100);
    border: 0;
    border-radius: 6px;
    color: var(--gov-navy-700);
    cursor: pointer;
    padding: 0;
    transition: background-color .15s ease;
}
.gov-node-toggle:hover { background: #D2DCEE; }
.gov-node-toggle:focus { outline: 2px solid var(--gov-navy-500); outline-offset: 1px; }
.gov-node-toggle i { font-size: .8rem; transition: transform .18s ease; }
.gov-node-toggle.is-leaf { background: transparent; cursor: default; }

/* Icon */
.gov-node-icon {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: var(--gov-navy-800);
    color: var(--gov-gold-400);
    font-size: 1.05rem;
}
.gov-node:not(.is-root) .gov-node-icon { background: var(--gov-navy-100); color: var(--gov-navy-700); }

/* Body */
.gov-node-body { flex: 1 1 auto; min-width: 0; }
.gov-node-title {
    color: var(--gov-navy-800);
    font-weight: 700;
    font-size: .9rem;
    line-height: 1.4;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
}
.gov-node-count {
    background: var(--gov-navy-100);
    color: var(--gov-navy-600);
    font-size: .68rem;
    font-weight: 600;
    padding: .12em .55em;
    border-radius: 999px;
}
.gov-node-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .3rem;
    margin-top: .3rem;
}
.gov-node-note {
    font-size: .72rem;
    color: var(--gov-muted);
    cursor: help;
    border-bottom: 1px dashed var(--gov-border);
}

/* Actions */
.gov-node-actions { flex: 0 0 auto; display: flex; gap: .3rem; opacity: 0; transition: opacity .15s ease; }
.gov-node:hover .gov-node-actions,
.gov-node:focus-within .gov-node-actions { opacity: 1; }
.gov-node-actions .btn { padding: .28rem .5rem; line-height: 1; }
.gov-node-actions .btn i { font-size: .9rem; }

/* Search highlight */
.gov-tree-item.gov-match > .gov-node {
    border-color: var(--gov-gold-500);
    box-shadow: 0 0 0 3px rgba(201, 162, 39, .18);
}

@media (max-width: 767px) {
    .gov-node-actions { opacity: 1; }
    .gov-tree { padding: .75rem .6rem; }
    .gov-tree-children { padding-inline-start: 1rem; }
    .gov-tree-total { width: 100%; margin-inline-start: 0; }
}

/*==============================================================================
  17. Login / blank pages
==============================================================================*/
body.blank-page {
    background: var(--gov-navy-900) !important;
    background-image:
        radial-gradient(circle at 15% 15%, rgba(201, 162, 39, .14) 0%, transparent 42%),
        radial-gradient(circle at 85% 80%, rgba(42, 78, 143, .38) 0%, transparent 45%),
        linear-gradient(140deg, var(--gov-navy-900) 0%, var(--gov-navy-800) 60%, #0A2350 100%) !important;
}
body.blank-page .content-wrapper,
body.blank-page .app-content { background: transparent !important; }

body.blank-page .card {
    border: 0 !important;
    border-radius: 16px !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .35) !important;
    overflow: hidden;
}
body.blank-page .card-header { border-bottom: 0; padding-bottom: .25rem; }
body.blank-page .card-title { font-size: 1.15rem; }

/* Gold rule across the top of the login card */
body.blank-page .card::before {
    content: "";
    display: block;
    height: 4px;
    background: linear-gradient(90deg, var(--gov-gold-500) 0%, var(--gov-gold-400) 50%, var(--gov-gold-500) 100%);
}

body.blank-page .card-footer { background: transparent; border-top: 1px solid var(--gov-border-soft); }
body.blank-page .btn-primary { width: 100%; padding: .65rem 1rem; font-size: .95rem; }

/*==============================================================================
  18. Sidebar — neutralise the template's light-menu backgrounds

  components.css assumes a light sidebar and paints these white/grey, which
  makes the text unreadable on the navy panel:
      .navigation > li.open > a   -> background: whitesmoke; color: #545766
      .navigation > li .active    -> background: #F0F0F0
      .navigation > li > ul       -> background: #FFFFFF
==============================================================================*/

/* Open (expanded) parent item */
.main-menu.menu-light .navigation > li.open > a,
.main-menu .navigation > li.open > a {
    background: rgba(255, 255, 255, .06) !important;
    color: #fff !important;
    border-left: 0 !important;
    border-right: 0 !important;
    font-weight: 600;
}
.main-menu.menu-light .navigation > li.open > a i,
.main-menu .navigation > li.open > a i { color: var(--gov-gold-400) !important; }

/* Submenu container */
.main-menu.menu-light .navigation > li > ul,
.main-menu.menu-light .navigation > li ul,
.main-menu .navigation > li > ul,
.main-menu.menu-light ul.menu-popout {
    background: rgba(0, 0, 0, .22) !important;
    border-radius: 9px;
    padding: .25rem !important;
    margin: 2px 0 6px !important;
}

/* Any nested list item — kill the grey block */
.main-menu.menu-light .navigation > li li,
.main-menu.menu-light .navigation > li ul li,
.main-menu.menu-light .navigation > li .active,
.main-menu.menu-light .navigation > li ul .active,
.main-menu .navigation li.active {
    background: transparent !important;
}

/* Active item inside an open section */
.main-menu.menu-light .navigation > li .active > a,
.main-menu.menu-light .navigation > li ul .active > a,
.main-menu.menu-light .navigation > li.active > a,
.main-menu .navigation li.active > a {
    background: linear-gradient(90deg, rgba(201, 162, 39, .26) 0%, rgba(201, 162, 39, .07) 100%) !important;
    color: #fff !important;
    font-weight: 700 !important;
}
.main-menu.menu-light .navigation > li .active > a i,
.main-menu.menu-light .navigation > li.active > a i,
.main-menu .navigation li.active > a i { color: var(--gov-gold-500) !important; }

/* Hover states inside submenus */
.main-menu.menu-light .navigation > li ul li > a:hover,
.main-menu.menu-light .navigation > li ul .hover > a {
    background: rgba(255, 255, 255, .07) !important;
    color: #fff !important;
}

/* Collapse arrow */
.main-menu .navigation li.has-sub > a:after,
.main-menu .navigation li.open > a:after { color: rgba(255, 255, 255, .55) !important; }

/*==============================================================================
  19. Modals as side drawers

  Every modal in this project is markup'd as `.modal.animated.zoomInDown`
  (animate.css). That animation is neutralised here and replaced with a
  slide-in panel anchored to the inline-end edge.
==============================================================================*/

/* Kill the animate.css zoom on the modal shell */
.modal.animated,
.modal.animated.zoomInDown {
    animation: none !important;
    -webkit-animation: none !important;
}

.modal { overflow: hidden !important; padding: 0 !important; }

.modal-backdrop { background-color: #05122A; }
.modal-backdrop.show { opacity: .55; }

/* The panel itself */
.modal .modal-dialog {
    position: fixed;
    top: 0;
    bottom: 0;
    margin: 0 !important;
    width: 100%;
    max-width: 560px;
    height: 100%;
    display: flex;
}
html[data-textdirection="ltr"] .modal .modal-dialog { right: 0; }
html[data-textdirection="rtl"] .modal .modal-dialog { left: 0; }

.modal .modal-dialog.modal-lg { max-width: 780px; }
.modal .modal-dialog.modal-xl { max-width: 1080px; }
.modal .modal-dialog.modal-sm { max-width: 420px; }

.modal .modal-content {
    height: 100%;
    width: 100%;
    border: 0 !important;
    border-radius: 0 !important;
    display: flex;
    flex-direction: column;
    min-height: 0;
}
html[data-textdirection="ltr"] .modal .modal-content { box-shadow: -20px 0 55px rgba(5, 18, 42, .3) !important; }
html[data-textdirection="rtl"] .modal .modal-content { box-shadow:  20px 0 55px rgba(5, 18, 42, .3) !important; }

/* Most modals wrap header/body/footer in a <form> — it must flex too */
.modal .modal-content > form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.modal .modal-header {
    flex: 0 0 auto;
    border-bottom: 3px solid var(--gov-gold-500);
    padding: 1.05rem 1.4rem;
    align-items: center;
}
.modal .modal-header .modal-title { font-size: 1.02rem; font-weight: 700; letter-spacing: .1px; }
.modal .modal-header .modal-title i { margin-inline-end: .4rem; opacity: .9; }
.modal .modal-header .close {
    margin: 0;
    padding: 0;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    line-height: 1;
    transition: background-color .15s ease;
}
.modal .modal-header .close:hover { background: rgba(255, 255, 255, .15); }

/* Contextual header colours, mapped onto the palette */
.modal .modal-header.bg-primary { background-color: var(--gov-navy-800) !important; }
.modal .modal-header.bg-success { background-color: var(--gov-success) !important; }
.modal .modal-header.bg-danger  { background-color: var(--gov-danger) !important; }
.modal .modal-header.bg-warning { background-color: var(--gov-gold-600) !important; }
.modal .modal-header.bg-info    { background-color: var(--gov-info) !important; }

.modal .modal-body {
    flex: 1 1 auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 1.4rem;
    background: var(--gov-surface);
}
.modal .modal-body .form-group { margin-bottom: 1.1rem; }

.modal .modal-footer {
    flex: 0 0 auto;
    background: #FBFCFE;
    border-top: 1px solid var(--gov-border);
    padding: .9rem 1.4rem;
    gap: .5rem;
}

/* ---- Slide animation -----------------------------------------------------
   Bootstrap only reflows before adding .show when the modal carries .fade,
   so the transition path is used when js_scripts adds it, and the keyframe
   fallback covers any modal that does not.                                */

/* Resting (off-screen) position. These are direction-scoped, so every rule
   that moves the panel back on screen must match or beat their specificity
   of (0,4,1) — a bare `.modal.fade.show .modal-dialog` is (0,4,0) and loses,
   which leaves the drawer parked off-screen with only the backdrop visible. */
html[data-textdirection="ltr"] .modal.fade .modal-dialog { transform: translateX(100%); }
html[data-textdirection="rtl"] .modal.fade .modal-dialog { transform: translateX(-100%); }
.modal.fade .modal-dialog { transition: transform .38s cubic-bezier(.32, .72, 0, 1); }

html[data-textdirection="ltr"] .modal.fade.show .modal-dialog,
html[data-textdirection="rtl"] .modal.fade.show .modal-dialog { transform: translateX(0); }

@keyframes govDrawerInLtr { from { transform: translateX(100%); }  to { transform: translateX(0); } }
@keyframes govDrawerInRtl { from { transform: translateX(-100%); } to { transform: translateX(0); } }

html[data-textdirection="ltr"] .modal:not(.fade).show .modal-dialog {
    animation: govDrawerInLtr .38s cubic-bezier(.32, .72, 0, 1) both;
}
html[data-textdirection="rtl"] .modal:not(.fade).show .modal-dialog {
    animation: govDrawerInRtl .38s cubic-bezier(.32, .72, 0, 1) both;
}

@media (prefers-reduced-motion: reduce) {
    .modal.fade .modal-dialog { transition: none; }
    html[data-textdirection="ltr"] .modal.show .modal-dialog,
    html[data-textdirection="rtl"] .modal.show .modal-dialog { animation: none; transform: translateX(0); }
}

@media (max-width: 575px) {
    .modal .modal-dialog,
    .modal .modal-dialog.modal-lg,
    .modal .modal-dialog.modal-xl { max-width: 100%; }
}

/*------------------------------------------------------------------
  18b. Expand indicator for sections that hold a submenu

  The blade markup never adds the template's .has-sub class, so the
  chevron is derived from the markup itself. Browsers without :has()
  simply render no arrow.
------------------------------------------------------------------*/
.main-menu .navigation > li:has(> ul.menu-content) > a {
    position: relative;
}
.main-menu .navigation > li:has(> ul.menu-content) > a::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 7px;
    height: 7px;
    border-right: 2px solid rgba(255, 255, 255, .5);
    border-bottom: 2px solid rgba(255, 255, 255, .5);
    transform: translateY(-70%) rotate(45deg);
    transition: transform .2s ease, border-color .2s ease;
}
html[data-textdirection="ltr"] .main-menu .navigation > li:has(> ul.menu-content) > a::after { right: 1rem; }
html[data-textdirection="rtl"] .main-menu .navigation > li:has(> ul.menu-content) > a::after { left: 1rem; }

.main-menu .navigation > li:has(> ul.menu-content) > a:hover::after { border-color: var(--gov-gold-400); }

.main-menu .navigation > li.open:has(> ul.menu-content) > a::after {
    transform: translateY(-25%) rotate(225deg);
    border-color: var(--gov-gold-500);
}

/* The card-title gold rule belongs to page cards, not the login card */
body.blank-page .card .card-header .card-title::before { display: none; }
body.blank-page .card .card-header .card-title { padding-inline-start: 0; }
body.blank-page .card .card-header { display: block; border-bottom: 0; padding-bottom: 0; }
body.blank-page .card-subtitle { margin-top: .35rem; letter-spacing: .2px; }


/* Actions dropdown in the transactions table.
   The column sits at the far edge of an RTL table, so the menu used to be
   placed outside the viewport (the markup compensated with a hard-coded
   right:-278px). data-boundary="viewport" lets Popper shift it back in;
   these rules just keep it readable and stop it forcing a scrollbar. */
.gov-actions-menu {
    min-width: 240px;
    max-width: min(92vw, 320px);
    z-index: 1030;
}

/* data-display="static" keeps Popper off this menu, so these win outright.
   The actions column sits at the inline-start edge of the table, so the menu
   has to open inward or it lands outside the viewport. */
html[data-textdirection="rtl"] .gov-actions-menu { left: 0 !important; right: auto !important; }
html[data-textdirection="ltr"] .gov-actions-menu { right: 0 !important; left: auto !important; }
.gov-actions-menu { transform: none !important; top: 100% !important; }
.gov-actions-menu .dropdown-item { display: flex; align-items: center; gap: .5rem; }
.gov-actions-menu .dropdown-item i { width: 16px; text-align: center; flex: 0 0 auto; }
.gov-actions-menu form { margin: 0; }
.gov-actions-menu form .dropdown-item { width: 100%; background: none; border: 0; text-align: inherit; cursor: pointer; }

/*==============================================================================
  21. Advanced search panel
==============================================================================*/
.gov-filter-card .card-header { padding-bottom: 1.1rem; }
.gov-filter-card .card-title i { color: var(--gov-gold-600); margin-inline-end: .35rem; }

.gov-filter-count {
    display: inline-block;
    background: var(--gov-navy-100);
    color: var(--gov-navy-700);
    font-size: .72rem;
    font-weight: 700;
    padding: .18em .65em;
    border-radius: 999px;
    margin-inline-start: .5rem;
    vertical-align: middle;
}

.gov-collapse-btn {
    background: var(--gov-navy-100);
    border: 0;
    border-radius: 8px;
    width: 30px;
    height: 30px;
    color: var(--gov-navy-700);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.gov-collapse-btn:hover { background: #D2DCEE; }

/* Auto-fitting grid: no more hand-placed col-md-4 rows that leave holes */
.gov-filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 1rem 1.1rem;
    align-items: start;
}
.gov-filter-grid .form-group { margin-bottom: 0; min-width: 0; }
.gov-filter-grid .gov-col-wide { grid-column: span 2; }
.gov-filter-grid .gov-col-narrow { max-width: 100%; }

@media (max-width: 575px) {
    .gov-filter-grid { grid-template-columns: 1fr; }
    .gov-filter-grid .gov-col-wide { grid-column: span 1; }
}

.gov-filter-form .form-control { background: #fff; }

.gov-filter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--gov-border-soft);
}
.gov-filter-actions .btn i { margin-inline-end: .3rem; }

/* The card header is a flex row; keep its action side aligned to the edge */
.card > .card-header > .heading-elements {
    position: static;
    display: flex;
    align-items: center;
    gap: .4rem;
    margin-inline-start: auto;
    top: auto; right: auto; left: auto;
}
.card > .card-header > .heading-elements .btn { white-space: nowrap; }
.card > .card-header > .heading-elements .btn i { margin-inline-end: .3rem; }
.card > .card-header .heading-elements-toggle { display: none; }

/*==============================================================================
  22. Dashboard

  Chart colours come from the dataviz validator run against this white card
  surface: categorical slots 1–2 for the two-series trend, a single-hue ordinal
  ramp (#86b6ef → #0d366b) for ordered stages and age bands, slot-1 alone for
  nominal bars. Text never wears a series colour.
==============================================================================*/
.gov-dash-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: 1.25rem;
}
.gov-dash-title { margin: 0; font-size: 1.35rem; font-weight: 800; color: var(--gov-navy-800); }
.gov-dash-scope { color: var(--gov-muted); font-size: .82rem; margin-top: .25rem; }
.gov-dash-scope i { color: var(--gov-gold-600); margin-inline-end: .25rem; }
.gov-dash-scope strong { color: var(--gov-navy-700); }
.gov-dash-user { color: var(--gov-muted); font-size: .85rem; }
.gov-dash-user strong { color: var(--gov-navy-800); }

/* ---- KPI tiles ---------------------------------------------------------- */
.gov-kpi-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}
@media (min-width: 768px)  { .gov-kpi-row { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1600px) { .gov-kpi-row { grid-template-columns: repeat(8, 1fr); } }
.gov-kpi {
    background: var(--gov-surface);
    border: 1px solid var(--gov-border);
    border-radius: var(--gov-radius-lg);
    box-shadow: var(--gov-shadow);
    padding: 1rem 1.1rem 1.1rem;
    position: relative;
    overflow: hidden;
}
.gov-kpi::before {
    content: "";
    position: absolute;
    top: 0; inset-inline-start: 0;
    width: 100%; height: 3px;
    background: var(--gov-navy-500);
}
.gov-kpi--good::before     { background: #0ca30c; }
.gov-kpi--warning::before  { background: #fab219; }
.gov-kpi--critical::before { background: #d03b3b; }

.gov-kpi-head { display: flex; align-items: center; gap: .5rem; margin-bottom: .55rem; }
.gov-kpi-icon {
    width: 28px; height: 28px; flex: 0 0 auto;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 8px; font-size: .95rem;
    background: var(--gov-navy-100); color: var(--gov-navy-700);
}
.gov-kpi--good .gov-kpi-icon     { background: var(--gov-success-bg); color: var(--gov-success); }
.gov-kpi--warning .gov-kpi-icon  { background: var(--gov-warning-bg); color: var(--gov-warning); }
.gov-kpi--critical .gov-kpi-icon { background: var(--gov-danger-bg);  color: var(--gov-danger); }

.gov-kpi-label { font-size: .78rem; font-weight: 600; color: var(--gov-muted); line-height: 1.3; }
.gov-kpi-value {
    font-size: 1.9rem;
    font-weight: 800;
    line-height: 1.1;
    color: var(--gov-navy-800);      /* value ink, never the series colour */
}
.gov-kpi-unit { font-size: .8rem; font-weight: 600; color: var(--gov-muted); margin-inline-start: .25rem; }

.gov-meter { margin-top: .6rem; height: 6px; border-radius: 999px; background: var(--gov-navy-100); overflow: hidden; }
.gov-meter > span { display: block; height: 100%; border-radius: 999px; background: #0ca30c; }

/* ---- legend & swatches --------------------------------------------------- */
.gov-legend { display: inline-flex; gap: .9rem; flex-wrap: wrap; }
.gov-legend-item { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; color: var(--gov-text); }
.gov-swatch { width: 10px; height: 10px; border-radius: 3px; display: inline-block; flex: 0 0 auto; }

/* ---- charts -------------------------------------------------------------- */
.gov-chart-box { position: relative; height: 300px; }

/* Stacked pipeline bar — 2px surface gap between segments */
.gov-stack { display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: var(--gov-navy-100); margin-bottom: 1rem; }
.gov-stack-seg { display: block; height: 100%; }
.gov-stack-seg + .gov-stack-seg { box-shadow: inset 2px 0 0 var(--gov-surface); }
html[data-textdirection="rtl"] .gov-stack-seg + .gov-stack-seg { box-shadow: inset -2px 0 0 var(--gov-surface); }

.gov-stage-table { margin: 0; font-size: .82rem; }
.gov-stage-table td { border: 0 !important; padding: .35rem .3rem; }

/* Horizontal bars */
.gov-hbars { display: flex; flex-direction: column; gap: .6rem; }
.gov-hbar { display: grid; grid-template-columns: minmax(90px, 38%) 1fr auto; align-items: center; gap: .6rem; }
.gov-hbar-label {
    font-size: .8rem; color: var(--gov-text);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gov-hbar-track { position: relative; height: 10px; border-radius: 4px; background: var(--gov-navy-100); overflow: hidden; }
/* Data end rounded, baseline end square — and a floor so a value of 1 still
   reads as a bar rather than collapsing into a dot. */
.gov-hbar-fill { position: absolute; top: 0; height: 100%; min-width: 6px; background: #2a78d6; }
html[data-textdirection="ltr"] .gov-hbar-fill { left: 0; border-radius: 0 4px 4px 0; }
html[data-textdirection="rtl"] .gov-hbar-fill { right: 0; border-radius: 4px 0 0 4px; }

/* Two-segment workload bar: done + open, separated by a 2px surface gap */
.gov-hbar-split { display: flex; height: 10px; border-radius: 4px; overflow: hidden; background: var(--gov-navy-100); }
.gov-hbar-split > span { display: block; height: 100%; }
.gov-hbar-split > span + span { box-shadow: inset 2px 0 0 var(--gov-surface); }
html[data-textdirection="rtl"] .gov-hbar-split > span + span { box-shadow: inset -2px 0 0 var(--gov-surface); }
.gov-hbar-value { font-size: .8rem; font-weight: 700; color: var(--gov-navy-800); min-width: 2.2em; text-align: end; }

/* ---- report tables ------------------------------------------------------- */
.gov-report-table { margin: 0; font-size: .82rem; }
.gov-report-table thead th {
    background: #F7F9FC !important;
    border-bottom: 2px solid var(--gov-navy-100) !important;
    border-top: 0 !important;
    font-size: .74rem; white-space: nowrap;
}
.gov-report-table td { vertical-align: middle; border-color: var(--gov-border-soft) !important; }
.gov-report-table tbody tr:hover { background: #FBFCFE; }

.gov-num { font-variant-numeric: tabular-nums; }
.gov-small { font-size: .74rem; }
.gov-muted { color: var(--gov-muted); }

.gov-chip {
    display: inline-flex; align-items: center; gap: .25rem;
    font-size: .7rem; font-weight: 700;
    padding: .18em .55em; border-radius: 999px;
    border: 1px solid transparent;
}
.gov-chip--critical { background: var(--gov-danger-bg); color: var(--gov-danger); border-color: #F2CFCD; }

@media (max-width: 575px) {
    .gov-kpi-row { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
    .gov-kpi-value { font-size: 1.6rem; }
    .gov-hbar { grid-template-columns: minmax(70px, 45%) 1fr auto; }
}

/*==============================================================================
  23. Transaction row panel (tasks + documents + assign)

  Replaces three nested Bootstrap cards with solid blue/green/yellow header
  bars. Same information and the same actions — flatter chrome, real column
  headings instead of bare icons, and content-driven height instead of a fixed
  310px box that sliced the last row in half.
==============================================================================*/
.gov-txn-panel { background: #F7F9FC; border-top: 1px solid var(--gov-border); }

.gov-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 0;
    align-items: stretch;
}
.gov-panel--single { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 1199px) { .gov-panel { grid-template-columns: minmax(0, 1fr); } }

.gov-panel-col { padding: .9rem 1.1rem 1.1rem; min-width: 0; }
.gov-panel-aside { background: var(--gov-surface); border-inline-start: 1px solid var(--gov-border); }
@media (max-width: 1199px) {
    .gov-panel-aside { border-inline-start: 0; border-top: 1px solid var(--gov-border); }
}

/* Section headings: a rule and a label, not a saturated bar */
.gov-sec-head {
    display: flex;
    align-items: center;
    gap: .45rem;
    font-size: .8rem;
    font-weight: 700;
    color: var(--gov-navy-800);
    padding-bottom: .5rem;
    margin-bottom: .6rem;
    border-bottom: 2px solid var(--gov-navy-100);
}
.gov-sec-head i { color: var(--gov-gold-600); font-size: .95rem; }
.gov-sec-head--sub { margin-top: 1rem; }
.gov-sec-count {
    background: var(--gov-navy-100);
    color: var(--gov-navy-700);
    font-size: .68rem;
    font-weight: 700;
    padding: .1em .5em;
    border-radius: 999px;
}
.gov-sec-actions { margin-inline-start: auto; display: flex; gap: .35rem; flex-wrap: wrap; }
.gov-sec-actions .btn { padding: .25rem .6rem; font-size: .74rem; }
.gov-sec-actions .btn i { margin-inline-end: .2rem; }

/* Task table — content height, capped, not a fixed box */
.gov-sec-scroll {
    max-height: 290px;
    overflow: auto;
    border: 1px solid var(--gov-border);
    border-radius: var(--gov-radius);
    background: var(--gov-surface);
}
.gov-panel-table { margin: 0; font-size: .8rem; }
.gov-panel-table thead th {
    background: #FBFCFE !important;
    border-bottom: 1px solid var(--gov-border) !important;
    border-top: 0 !important;
    font-size: .72rem;
    font-weight: 700;
    color: var(--gov-navy-800) !important;
    white-space: nowrap;
    position: sticky; top: 0; z-index: 1;
}
.gov-panel-table td { border-color: var(--gov-border-soft) !important; vertical-align: middle; padding: .45rem .6rem; }
.gov-panel-table tbody tr:hover { background: #FBFCFE; }
.gov-task-name { font-weight: 600; color: var(--gov-navy-800); }
.gov-note-dot { color: var(--gov-gold-600); margin-inline-start: .3rem; cursor: help; }

.gov-count-btn {
    display: inline-block;
    min-width: 24px;
    padding: .12em .45em;
    border-radius: 999px;
    background: var(--gov-navy-100);
    color: var(--gov-navy-700);
    font-size: .72rem;
    font-weight: 700;
    cursor: pointer;
    transition: background-color .15s ease;
}
.gov-count-btn:hover { background: #D2DCEE; }

.gov-panel-empty { color: var(--gov-muted); font-size: .8rem; text-align: center; display: block; padding: 1.1rem .5rem; }

/* Document chips */
.gov-doc-strip {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    max-height: 104px;
    overflow: auto;
}
.gov-doc-chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    max-width: 240px;
    padding: .35rem .6rem;
    background: var(--gov-surface);
    border: 1px solid var(--gov-border);
    border-radius: 999px;
    font-size: .76rem;
    color: var(--gov-text) !important;
    text-decoration: none !important;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.gov-doc-chip:hover { border-color: var(--gov-navy-500); box-shadow: var(--gov-shadow-sm); }
.gov-doc-chip i { font-size: 1rem; color: var(--gov-navy-600); flex: 0 0 auto; }
.gov-doc-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gov-doc-ext {
    flex: 0 0 auto;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .3px;
    color: var(--gov-muted);
    background: var(--gov-navy-100);
    padding: .1em .4em;
    border-radius: 4px;
}

/* Assign form */
.gov-assign .form-group { margin-bottom: .75rem; }
.gov-assign label { font-size: .76rem; margin-bottom: .25rem; }
.gov-assign .form-control { font-size: .82rem; padding: .45rem .65rem; }
.gov-assign textarea.form-control { min-height: 70px; }
.gov-assign .btn-block i { margin-inline-end: .3rem; }

.gov-panel-loading {
    padding: 2rem 1rem;
    text-align: center;
    color: var(--gov-muted);
    font-size: .85rem;
}

.gov-task-status {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .7rem;
    font-weight: 700;
    padding: .22em .6em;
    border-radius: 999px;
    border: 1px solid transparent;
    white-space: nowrap;
}
.gov-task-status--open { background: var(--gov-warning-bg); color: var(--gov-warning); border-color: #EEDFAE; }
.gov-task-status--done { background: var(--gov-success-bg); color: var(--gov-success); border-color: #C4E6DA; }