/*
 * Global UI fixes for shared pickers/dropdowns.
 * Loaded after app.css so common payment, purchase, sale and modal screens stay consistent.
 */

.bootstrap-datetimepicker-widget,
.datepicker-dropdown,
.daterangepicker,
.ui-datepicker {
    z-index: 3000 !important;
    background: #fff !important;
    border: 1px solid #d7dee8 !important;
    border-radius: 6px !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18) !important;
    color: #111827 !important;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    width: 380px !important;
    min-width: 380px !important;
    max-width: calc(100vw - 24px);
    padding: 10px 12px !important;
    overflow: hidden !important;
}

.bootstrap-datetimepicker-widget:before,
.bootstrap-datetimepicker-widget:after,
.datepicker-dropdown:before,
.datepicker-dropdown:after {
    display: none !important;
}

.bootstrap-datetimepicker-widget table,
.datepicker-dropdown table,
.ui-datepicker table {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    table-layout: fixed !important;
    background: #fff !important;
}

.bootstrap-datetimepicker-widget .datepicker,
.bootstrap-datetimepicker-widget .datepicker-days,
.bootstrap-datetimepicker-widget .datepicker-months,
.bootstrap-datetimepicker-widget .datepicker-years,
.bootstrap-datetimepicker-widget .datepicker-decades,
.bootstrap-datetimepicker-widget .datepicker-days table,
.bootstrap-datetimepicker-widget .datepicker-months table,
.bootstrap-datetimepicker-widget .datepicker-years table,
.bootstrap-datetimepicker-widget .datepicker-decades table {
    width: 100% !important;
    max-width: 100% !important;
}

.bootstrap-datetimepicker-widget table th,
.bootstrap-datetimepicker-widget table td,
.datepicker-dropdown table th,
.datepicker-dropdown table td,
.ui-datepicker table th,
.ui-datepicker table td {
    height: 34px !important;
    line-height: 34px !important;
    padding: 0 !important;
    border: 0 !important;
    background: #fff !important;
    color: #111827 !important;
    text-align: center !important;
    vertical-align: middle !important;
    min-width: 0 !important;
    max-width: none !important;
    width: 14.285714% !important;
}

.bootstrap-datetimepicker-widget table th.picker-switch,
.bootstrap-datetimepicker-widget table td.separator {
    width: auto !important;
}

.bootstrap-datetimepicker-widget .datepicker-months table td,
.bootstrap-datetimepicker-widget .datepicker-years table td,
.bootstrap-datetimepicker-widget .datepicker-decades table td {
    width: auto !important;
}

.bootstrap-datetimepicker-widget table th,
.datepicker-dropdown table th,
.ui-datepicker table th {
    font-weight: 700 !important;
}

.bootstrap-datetimepicker-widget .picker-switch,
.datepicker-dropdown .datepicker-switch,
.ui-datepicker .ui-datepicker-title {
    color: #111827 !important;
    font-weight: 700 !important;
}

.bootstrap-datetimepicker-widget .prev,
.bootstrap-datetimepicker-widget .next,
.datepicker-dropdown .prev,
.datepicker-dropdown .next,
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    color: #111827 !important;
    cursor: pointer !important;
}

.bootstrap-datetimepicker-widget table td.day,
.bootstrap-datetimepicker-widget table td span,
.datepicker-dropdown table td.day,
.datepicker-dropdown table td span,
.ui-datepicker table td a {
    border-radius: 5px !important;
    cursor: pointer !important;
}

.bootstrap-datetimepicker-widget table td.day:hover,
.bootstrap-datetimepicker-widget table td span:hover,
.datepicker-dropdown table td.day:hover,
.datepicker-dropdown table td span:hover,
.ui-datepicker table td a:hover {
    background: #eef5ff !important;
    color: #111827 !important;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover,
.bootstrap-datetimepicker-widget table td span.active,
.datepicker-dropdown table td.active,
.datepicker-dropdown table td.active:hover,
.datepicker-dropdown table td span.active,
.ui-datepicker table td .ui-state-active {
    background: #1677d2 !important;
    color: #fff !important;
    text-shadow: none !important;
}

.bootstrap-datetimepicker-widget table td.old,
.bootstrap-datetimepicker-widget table td.new,
.datepicker-dropdown table td.old,
.datepicker-dropdown table td.new {
    color: #8b95a1 !important;
}

.bootstrap-datetimepicker-widget .datepicker,
.bootstrap-datetimepicker-widget .timepicker,
.bootstrap-datetimepicker-widget .timepicker-picker,
.daterangepicker .calendar-table {
    background: #fff !important;
}

.bootstrap-datetimepicker-widget .timepicker-picker table td {
    height: 34px !important;
    line-height: 34px !important;
}

.bootstrap-datetimepicker-widget a,
.bootstrap-datetimepicker-widget .btn,
.datepicker-dropdown a,
.daterangepicker a {
    color: #1677d2 !important;
}

.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker .ranges li.active {
    background: #1677d2 !important;
    color: #fff !important;
}

.modal .bootstrap-datetimepicker-widget,
.modal .datepicker-dropdown,
.modal .daterangepicker,
.modal .ui-datepicker {
    z-index: 3000 !important;
}

@media (max-width: 480px) {
    .bootstrap-datetimepicker-widget.dropdown-menu,
    .datepicker-dropdown {
        left: 8px !important;
        right: 8px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none;
    }
}

.metal-breakdown {
    min-width: 115px;
    line-height: 1.65;
    white-space: nowrap;
    text-align: left;
}

.metal-breakdown strong {
    font-weight: 700;
}
/* Desktop collapsed navigation remains usable as an icon rail. */
@media screen and (min-width:1024px) {
    body.sidebar-icon-mode .side-bar { display:flex !important; width:68px !important; min-width:68px; flex-basis:68px; }
    body.sidebar-icon-mode .side-bar > a:first-child { padding:10px 8px; }
    body.sidebar-icon-mode .side-bar-heading { font-size:0 !important; gap:0 !important; justify-content:center; }
    body.sidebar-icon-mode .side-bar-heading > span { display:none; }
    body.sidebar-icon-mode #side-bar { padding:10px 7px; overflow-x:hidden; }
    body.sidebar-icon-mode #side-bar > a,
    body.sidebar-icon-mode #side-bar .drop_down { width:46px; min-height:44px; padding:10px; justify-content:center; gap:0; }
    body.sidebar-icon-mode #side-bar > a > span,
    body.sidebar-icon-mode #side-bar .drop_down > span,
    body.sidebar-icon-mode #side-bar .drop_down > .svg,
    body.sidebar-icon-mode #side-bar .chiled { display:none !important; }
    body.sidebar-icon-mode #side-bar > div.tw-bg-gray-200 { padding-bottom:0; }
    body.sidebar-icon-mode #side-bar > a > svg,
    body.sidebar-icon-mode #side-bar .drop_down > svg:not(.svg) { width:21px; height:21px; }
}
/* Keep listing searches visible at the left edge, before wide table columns. */
/* Compact navigation; preserve the existing menu and collapse behaviour. */
@media screen {
    body.hold-transition, body.hold-transition * {
        scrollbar-width: thin;
        scrollbar-color: #b2bdcd #f2f5f9;
    }
    body.hold-transition ::-webkit-scrollbar { width:7px; height:7px; }
    body.hold-transition ::-webkit-scrollbar-track { background:#f2f5f9; }
    body.hold-transition ::-webkit-scrollbar-thumb { background:#b2bdcd; border:1px solid #f2f5f9; border-radius:8px; }
    body.hold-transition ::-webkit-scrollbar-thumb:hover { background:#8594ab; }
    body.hold-transition ::-webkit-scrollbar-corner { background:#f2f5f9; }
    .side-bar { border-right:1px solid #e5eaf2; box-shadow:2px 0 12px rgba(30,48,78,.025); }
    .side-bar > a:first-child { padding:10px 12px; }
    .side-bar .side-bar-heading { margin:0; gap:10px !important; font-size:16px; line-height:1.4; min-width:0; }
    .side-bar .side-bar-heading img { width:34px !important; height:34px; object-fit:contain; flex-shrink:0; background:#fff; padding:2px; }
    #side-bar { padding:12px 10px; background:#fbfcfe; border-right:0; }
    #side-bar > * + * { margin-top:4px !important; margin-bottom:0 !important; }
    #side-bar > a, #side-bar .drop_down { min-height:40px; padding:9px 11px; gap:10px; border-radius:8px; color:#526078; font-size:13px; line-height:20px; letter-spacing:0; }
    #side-bar > a:hover, #side-bar .drop_down:hover { background:#edf1f7; color:#263750; }
    #side-bar a:focus-visible { outline:2px solid #6366f1; outline-offset:-2px; }
    #side-bar > a > svg, #side-bar .drop_down > svg:not(.svg) { width:19px; height:19px; flex-shrink:0; }
    #side-bar > a > i, #side-bar .drop_down > i { width:19px; text-align:center; font-size:16px; flex-shrink:0; }
    #side-bar > div.tw-bg-gray-200 { background:#f0f3fc; border-radius:9px; padding-bottom:5px; }
    #side-bar > a.tw-text-primary-700, #side-bar .drop_down.tw-text-primary-700 { background:#e9edff; color:#4549b9; font-weight:600; box-shadow:inset 3px 0 #6366f1; }
    #side-bar .chiled { margin:2px 0 5px; padding-left:32px; padding-right:6px; }
    #side-bar .chiled > .tw-absolute { left:20px; background:#dce3ef; }
    #side-bar .chiled a { padding:7px 9px; min-height:34px; margin:2px 0 !important; border-radius:6px; color:#637089; font-size:13px; line-height:20px; letter-spacing:0; }
    #side-bar .chiled a:hover { background:#e9eef7; color:#263750; }
    #side-bar .chiled a.tw-text-primary-700 { background:#fff; color:#4549b9; font-weight:600; box-shadow:0 1px 3px rgba(30,48,78,.07); }
}
.dataTables_wrapper .list-table-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 20px;
    margin-bottom: 20px;
    max-width: 100%;
}
.dataTables_wrapper .dataTables_filter {
    float: none !important;
    text-align: left !important;
    max-width: 100%;
}
.dataTables_wrapper > .dataTables_filter {
    clear: both;
    margin-bottom: 12px;
}
.dataTables_wrapper .list-table-toolbar > .dataTables_filter,
.dataTables_wrapper .list-table-toolbar > .dataTables_length,
.dataTables_wrapper .list-table-toolbar > .dt-buttons {
    float: none !important;
    text-align: left !important;
    margin: 0;
    min-width: 0;
    max-width: 100%;
}
.dataTables_wrapper .list-table-toolbar label {
    margin-bottom: 0;
    white-space: normal;
}
.dataTables_wrapper .dataTables_filter input[type="search"] {
    width: 200px;
    max-width: 100%;
    margin-left: 0;
    box-sizing: border-box;
}
.dataTables_wrapper .girvi-account-tools > .dataTables_filter {
    order: -1;
}

body.sidebar-navy {
    --sidebar-surface: #0c1d32;
    --sidebar-border: #263b53;
    --sidebar-brand: #f5f1e7;
    --sidebar-text: #e0e8f2;
    --sidebar-scroll: #405771;
    --sidebar-hover: #192f49;
    --sidebar-group: #11263e;
    --sidebar-selected: #203a57;
    --sidebar-child: #b9c9db;
    --sidebar-child-hover: #1b334e;
    --sidebar-line: #36516e;
    --sidebar-accent: #edca78;
    --sidebar-selected-child: #f5d994;
    --sidebar-focus-text: #fff;
    --sidebar-chevron: #94a8bd;
}
body.sidebar-navy.sidebar-light {
    --sidebar-surface: #ffffff;
    --sidebar-border: #dbe3ed;
    --sidebar-brand: #16283e;
    --sidebar-text: #263c55;
    --sidebar-scroll: #9daec1;
    --sidebar-hover: #edf3fa;
    --sidebar-group: #f6f8fb;
    --sidebar-selected: #dceafa;
    --sidebar-child: #485e74;
    --sidebar-child-hover: #e9f1fa;
    --sidebar-line: #c8d6e4;
    --sidebar-accent: #876110;
    --sidebar-selected-child: #493913;
    --sidebar-focus-text: #152d49;
    --sidebar-chevron: #566b80;
}
.sidebar-theme-toggle {
    position: absolute;
    top: 16px;
    right: 12px;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--sidebar-border);
    border-radius: 7px;
    background: var(--sidebar-group);
    color: var(--sidebar-text);
}
.sidebar-theme-toggle:hover, .sidebar-theme-toggle:focus-visible { background: var(--sidebar-hover); }
.sidebar-light .sidebar-theme-toggle .fa-sun, body:not(.sidebar-light) .sidebar-theme-toggle .fa-moon { display: none; }
@media screen and (min-width: 1024px) {
    body.sidebar-navy:not(.sidebar-peek) .sidebar-theme-toggle { visibility: hidden; }
}
@media print { .sidebar-theme-toggle { display: none; } }
/* Midnight Navy navigation: a stable desktop rail with an expanding overlay. */
@media screen {
    body.sidebar-navy .side-bar { background:var(--sidebar-surface); border-right:1px solid var(--sidebar-border); color:var(--sidebar-text); }
    body.sidebar-navy .side-bar > a:first-child { background:var(--sidebar-surface) !important; border-color:var(--sidebar-border); min-height:64px; justify-content:flex-start; padding:12px 52px 12px 16px; }
    body.sidebar-navy .side-bar-heading { color:var(--sidebar-brand); font-weight:600; width:100%; }
    body.sidebar-navy .sidebar-brand-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    body.sidebar-navy #side-bar { background:var(--sidebar-surface); padding:10px; overflow-x:hidden; scrollbar-color:var(--sidebar-scroll) var(--sidebar-surface); }
    body.sidebar-navy #side-bar::-webkit-scrollbar { width:5px; }
    body.sidebar-navy #side-bar::-webkit-scrollbar-track { background:var(--sidebar-surface); }
    body.sidebar-navy #side-bar::-webkit-scrollbar-thumb { background:var(--sidebar-scroll); border:0; border-radius:5px; }
    body.sidebar-navy #side-bar > a, body.sidebar-navy #side-bar .drop_down { color:var(--sidebar-text); min-height:43px; border-radius:7px; font-weight:500; }
    body.sidebar-navy #side-bar > a > svg, body.sidebar-navy #side-bar .drop_down > svg:not(.svg),
    body.sidebar-navy #side-bar > a > i, body.sidebar-navy #side-bar .drop_down > i { color:#e8c574; }
    body.sidebar-navy #side-bar .drop_down > .svg { color:var(--sidebar-chevron); }
    body.sidebar-navy #side-bar > a:hover, body.sidebar-navy #side-bar .drop_down:hover { background:var(--sidebar-hover); color:var(--sidebar-focus-text); }
    body.sidebar-navy #side-bar > div.tw-bg-gray-200 { background:var(--sidebar-group); }
    body.sidebar-navy #side-bar > a.tw-text-primary-700, body.sidebar-navy #side-bar .drop_down.tw-text-primary-700 { color:var(--sidebar-focus-text); background:var(--sidebar-selected); box-shadow:inset 3px 0 var(--sidebar-accent); }
    body.sidebar-navy #side-bar .chiled a { color:var(--sidebar-child); }
    body.sidebar-navy #side-bar .chiled a:hover { color:var(--sidebar-focus-text); background:var(--sidebar-child-hover); }
    body.sidebar-navy #side-bar .chiled a.tw-text-primary-700 { color:var(--sidebar-selected-child); background:var(--sidebar-selected); box-shadow:none; }
    body.sidebar-navy #side-bar .chiled > .tw-absolute { background:var(--sidebar-line); }
    body.sidebar-navy #side-bar a:focus-visible { outline:2px solid var(--sidebar-accent); outline-offset:-2px; }
}
@media screen and (min-width:1024px) {
    body.sidebar-navy .side-bar { position:fixed; top:0; bottom:0; left:0; z-index:60; display:flex !important; flex-direction:column; width:68px !important; min-width:68px; height:100%; transition:width .18s ease,box-shadow .18s ease; overflow:hidden; }
    body.sidebar-navy > .tw-flex > main { margin-left:68px; }
    body.sidebar-navy.sidebar-peek .side-bar { width:280px !important; box-shadow:12px 0 30px rgba(3,15,30,.25); }
    body.sidebar-navy:not(.sidebar-peek) .side-bar > a:first-child { padding:12px 17px; }
    body.sidebar-navy:not(.sidebar-peek) .side-bar-heading { gap:0 !important; font-size:0; }
    body.sidebar-navy:not(.sidebar-peek) .side-bar-heading > span { display:none; }
    body.sidebar-navy:not(.sidebar-peek) #side-bar { padding:10px 8px; }
    body.sidebar-navy:not(.sidebar-peek) #side-bar > a,
    body.sidebar-navy:not(.sidebar-peek) #side-bar .drop_down { width:46px; padding:11px 12px; gap:0; justify-content:center; }
    body.sidebar-navy:not(.sidebar-peek) #side-bar > a > span,
    body.sidebar-navy:not(.sidebar-peek) #side-bar .drop_down > span,
    body.sidebar-navy:not(.sidebar-peek) #side-bar .drop_down > .svg,
    body.sidebar-navy:not(.sidebar-peek) #side-bar .chiled { display:none !important; }
    body.sidebar-navy:not(.sidebar-peek) #side-bar > div.tw-bg-gray-200 { padding-bottom:0; }
    body.sidebar-navy:not(.sidebar-peek) #side-bar > .tw-uppercase { font-size:0; padding:0; height:1px; background:var(--sidebar-border); margin:12px 4px !important; }
    body.sidebar-navy.sidebar-peek #side-bar > a > span,
    body.sidebar-navy.sidebar-peek #side-bar .drop_down > span { white-space:normal; overflow:visible; line-height:19px; }
}
@media (prefers-reduced-motion:reduce) {
    body.sidebar-navy .side-bar { transition:none; }
}

/* Override legacy light focus/active utilities inside navy navigation only. */
@media screen {
    body.sidebar-navy #side-bar > a,
    body.sidebar-navy #side-bar .drop_down { background-color:transparent !important; color:var(--sidebar-text) !important; }
    body.sidebar-navy #side-bar > a:hover,
    body.sidebar-navy #side-bar > a:focus,
    body.sidebar-navy #side-bar > a:active,
    body.sidebar-navy #side-bar .drop_down:hover,
    body.sidebar-navy #side-bar .drop_down:focus,
    body.sidebar-navy #side-bar .drop_down:active { background-color:var(--sidebar-hover) !important; color:var(--sidebar-focus-text) !important; }
    body.sidebar-navy #side-bar > a.tw-text-primary-700,
    body.sidebar-navy #side-bar .drop_down.tw-text-primary-700 { background-color:var(--sidebar-selected) !important; color:var(--sidebar-focus-text) !important; }
    body.sidebar-navy #side-bar .chiled a:focus,
    body.sidebar-navy #side-bar .chiled a:active { background-color:var(--sidebar-child-hover) !important; color:var(--sidebar-focus-text) !important; }
    body.sidebar-navy #side-bar .chiled a.tw-text-primary-700 { background-color:var(--sidebar-selected) !important; color:var(--sidebar-selected-child) !important; }
}

/* Colour-coded module badges, shared by expanded navigation and icon rail. */
@media screen {
    body.sidebar-navy #side-bar .sidebar-module-icon {
        color: var(--module-icon-colour) !important;
        background: var(--module-icon-background);
        width: 30px !important;
        height: 30px !important;
        min-width: 30px;
        padding: 5px;
        box-sizing: border-box;
        border-radius: 9px;
        flex-shrink: 0;
        transition: background-color .15s ease;
    }
    body.sidebar-navy #side-bar i.sidebar-module-icon {
        font-size: 18px;
        line-height: 20px;
        text-align: center;
    }
}
@media screen and (min-width: 1024px) {
    body.sidebar-navy:not(.sidebar-peek) #side-bar > a,
    body.sidebar-navy:not(.sidebar-peek) #side-bar .drop_down {
        padding: 7px 8px;
    }
}

/* Long column menus stay inside the viewport and remain keyboard-scrollable. */
.dt-button-collection.column-visibility-scroll {
    overflow-y: auto !important;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}
.dt-button-collection.column-visibility-scroll::-webkit-scrollbar { width: 6px; }
.dt-button-collection.column-visibility-scroll::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 6px;
}
