:root{
  --vg-font-sans: Inter, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --vg-surface: #ffffff;
  --vg-surface-soft: #fbfbfd;
  --vg-border-soft: rgba(148,163,184,.24);
  --vg-shadow-soft: 0 8px 24px rgba(15,23,42,.06);
}
body{font-family:var(--vg-font-sans);}
.panel-card,.kpi-card,.header-card,.sidebar-theme-card,.sidebar-user-box,.table-card{box-shadow:var(--vg-shadow-soft);}
.section-title,.header-title,.kpi-label,.gm-combo-title{letter-spacing:.01em;}
.btn-panel,.btn-theme-toggle,.amount-toggle-btn{font-weight:600;}
.table-top-scrollbar{background:#eef2f7;border:1px solid var(--vg-border-soft);border-radius:999px;height:14px;margin:0 0 10px;overflow-x:auto;overflow-y:hidden;}
.table-top-scrollbar-inner{height:1px;}
.table-top-scrollbar::-webkit-scrollbar{height:12px;}
.table-top-scrollbar::-webkit-scrollbar-thumb{background:#94a3b8;border-radius:999px;}
.dt-container .dt-buttons .btn{margin-right:.35rem;}
.dt-container .dt-search input{border-radius:10px;border:1px solid rgba(148,163,184,.35);padding:.4rem .65rem;}
.dt-scroll-body thead th{position:sticky;top:0;z-index:20;background:#f8fafc !important;}
.dt-scroll-head thead th{background:#f8fafc !important;}

/* GM/Home sales KPI card spacing stabilization */
.home-summary-gm .gm-kpi-combo-card,
.gm-kpi-combo-row .gm-kpi-combo-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
}

.home-summary-gm .gm-combo-title,
.gm-kpi-combo-row .gm-combo-title {
  display: flex !important;
  align-items: flex-start !important;
  line-height: 1.18 !important;
  min-height: 2.45rem !important;
  margin-bottom: .5rem !important;
}

.home-summary-gm .gm-combo-metric-group,
.gm-kpi-combo-row .gm-combo-metric-group {
  margin-top: 0 !important;
  gap: .5rem !important;
  align-content: start !important;
}

.home-summary-gm .gm-combo-metric-item,
.gm-kpi-combo-row .gm-combo-metric-item {
  min-width: 0;
}

.home-summary-gm .gm-combo-metric-item .kpi-label,
.gm-kpi-combo-row .gm-combo-metric-item .kpi-label {
  margin-bottom: .12rem !important;
}

.home-summary-gm .gm-combo-metric-item .kpi-value,
.gm-kpi-combo-row .gm-combo-metric-item .kpi-value {
  line-height: 1.04 !important;
  margin: 0 0 .08rem !important;
}

.home-summary-gm .gm-combo-metric-item .trend-split,
.gm-kpi-combo-row .gm-combo-metric-item .trend-split,
.home-summary-gm .gm-combo-percent,
.gm-kpi-combo-row .gm-combo-percent {
  white-space: normal;
}

.home-summary-gm > .row > [class*="col-"],
.gm-kpi-combo-row > [class*="col-"] {
  display: flex;
}

@media (max-width: 1399.98px) {
  .home-summary-gm .gm-combo-title,
  .gm-kpi-combo-row .gm-combo-title {
    min-height: 2.7rem !important;
  }
}

@media (max-width: 1199.98px) {
  .home-summary-gm .gm-combo-title,
  .gm-kpi-combo-row .gm-combo-title {
    min-height: auto !important;
  }
}

/* 2026-04-25 Full project UI improvement pack */
:root{
  --vg-radius: 18px;
  --vg-radius-sm: 12px;
  --vg-ring: rgba(212,175,55,.28);
  --vg-head-bg: linear-gradient(180deg,#fffaf0,#f8fafc);
}
.panel-card,.table-card,.filter-card,.chart-card{
  border-radius: var(--vg-radius) !important;
  border:1px solid rgba(212,175,55,.18) !important;
}
.filter-grid,.advanced-filter-grid,.gm-filter-grid,.home-filter-grid{
  gap: .75rem !important;
  align-items:end !important;
}
.form-label,.filter-label{font-size:.78rem!important;font-weight:700!important;color:#7a5a16!important;margin-bottom:.25rem!important;}
.form-select,.form-control,.multi-select-trigger{
  min-height:36px!important;border-radius:10px!important;border-color:rgba(148,163,184,.32)!important;
  box-shadow:none!important;background-color:#fff!important;
}
.form-select:focus,.form-control:focus,.multi-select-trigger:focus{border-color:var(--gold)!important;box-shadow:0 0 0 .18rem var(--vg-ring)!important;}
.report-toolbar,.gm-report-toolbar,.table-toolbar{
  position:sticky;top:0;z-index:35;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);
  border:1px solid rgba(212,175,55,.18);border-radius:14px;padding:.55rem .65rem;margin-bottom:.7rem;
}
.report-toolbar-controls,.gm-report-toolbar-right{width:100%;display:flex!important;align-items:center!important;gap:.5rem!important;flex-wrap:wrap!important;}
.report-buttons-host,.dt-buttons,#gmReportButtonsHost{display:flex!important;gap:.35rem!important;flex-wrap:wrap!important;align-items:center!important;}
.dt-buttons .btn,.dt-buttons button{border-radius:10px!important;font-size:.78rem!important;padding:.35rem .55rem!important;}
.table-responsive,.report-table-shell,.gm-report-table-wrap{border-radius:14px!important;border:1px solid rgba(148,163,184,.20);background:#fff;}
.custom-table,.gm-report-table{font-size:.82rem!important;border-collapse:separate!important;border-spacing:0!important;}
.custom-table th,.custom-table td,.gm-report-table th,.gm-report-table td{padding:.44rem .55rem!important;vertical-align:middle!important;white-space:nowrap!important;}
.dt-scroll-head thead th,.custom-table thead th,.gm-report-table thead th{
  background:var(--vg-head-bg)!important;color:#111827!important;font-weight:800!important;border-bottom:1px solid rgba(148,163,184,.35)!important;
  box-shadow:inset 0 -1px 0 rgba(212,175,55,.20);position:sticky!important;top:0!important;z-index:30!important;
}
.report-total-head-row th{
  background:#fff8df!important;color:#111827!important;font-weight:800!important;position:sticky!important;z-index:31!important;
}
.report-total-head-row-final th{top:38px!important;}
.report-total-head-row-generic th{top:76px!important;}
.report-total-head-row-branded th{top:114px!important;}
.sticky-col{position:sticky!important;z-index:20!important;box-shadow:2px 0 0 rgba(148,163,184,.15)!important;}
thead .sticky-col,.dt-scroll-head .sticky-col{z-index:45!important;}
.report-total-head-row .sticky-col{z-index:46!important;}
tbody .sticky-col{background:#fffdf9!important;}
.table-highlight{background:#fffdf9!important;}
.table-card:fullscreen,.panel-card:fullscreen,.gm-report-fullscreen:fullscreen,.inventory-report-fullscreen:fullscreen{
  background:#fff!important;padding:16px!important;overflow:auto!important;width:100vw!important;height:100vh!important;
}
.table-card:fullscreen .dt-scroll-body,.panel-card:fullscreen .dt-scroll-body{max-height:calc(100vh - 185px)!important;height:calc(100vh - 185px)!important;}
.table-card:fullscreen .report-toolbar,.panel-card:fullscreen .gm-report-toolbar{top:0!important;margin-bottom:.5rem!important;}
.table-card:fullscreen .custom-table,.panel-card:fullscreen .gm-report-table{font-size:.78rem!important;}
.table-card:fullscreen .custom-table th,.table-card:fullscreen .custom-table td,.panel-card:fullscreen .gm-report-table th,.panel-card:fullscreen .gm-report-table td{padding:.34rem .42rem!important;}
.dt-scroll-body{scrollbar-color:#9ca3af #eef2f7;}
.dt-scroll-body::-webkit-scrollbar,.table-responsive::-webkit-scrollbar{height:12px;width:12px;}
.dt-scroll-body::-webkit-scrollbar-thumb,.table-responsive::-webkit-scrollbar-thumb{background:#9ca3af;border-radius:999px;}
.dt-scroll-body::-webkit-scrollbar-track,.table-responsive::-webkit-scrollbar-track{background:#eef2f7;}
@media (max-width:991.98px){
  .report-toolbar-controls,.gm-report-toolbar-right{align-items:stretch!important;}
  .report-toolbar-controls>.btn,.gm-report-toolbar-right>.btn,.dt-buttons .btn{flex:1 1 auto;}
  .custom-category-paging{width:100%;justify-content:stretch!important;display:grid!important;grid-template-columns:repeat(3,1fr);}
  .custom-page-btn{width:100%;}
}
@media (max-width:575.98px){
  .panel-card,.table-card{border-radius:14px!important;padding:.75rem!important;}
  .custom-table,.gm-report-table{font-size:.74rem!important;}
  }

/* Excel-like column filter / sort controls */
.vg-filterable-th{position:relative!important;padding-left:10px!important;padding-right:38px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:150px;text-align:left!important;}
.vg-filterable-th:first-child{min-width:190px;text-align:left!important;}
.dt-scroll-head th.vg-filterable-th,.dataTables_scrollHead th.vg-filterable-th,.custom-table th.vg-filterable-th,.gm-report-table th.vg-filterable-th{text-align:left!important;justify-content:flex-start!important;}
.dt-scroll-head th.vg-filterable-th .dt-column-title,.dataTables_scrollHead th.vg-filterable-th .dt-column-title{display:block;text-align:left!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.vg-excel-filter{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;z-index:10;background:#fffdf6;border-radius:7px;}
.vg-excel-filter-btn{width:19px;height:19px;border:1px solid rgba(143,106,18,.35);border-radius:6px;background:#fffdf6;color:#8f6a12;display:inline-flex;align-items:center;justify-content:center;font-size:11px;line-height:1;box-shadow:0 1px 4px rgba(143,106,18,.08);cursor:pointer;}
.vg-excel-filter-btn i{pointer-events:none;}
.dt-scroll-body thead .vg-excel-filter,.report-total-head-row .vg-excel-filter{display:none!important;}
.vg-excel-filter-btn:hover,.vg-excel-filter.is-open .vg-excel-filter-btn{background:#f0c64f;color:#111827;border-color:#8f6a12;}
.vg-excel-filter.is-filtered .vg-excel-filter-btn{background:#e8f0ff;color:#0b5ed7;border-color:#6ea8fe;}
.vg-excel-filter-menu{display:none;position:fixed;background:#fff;border:1px solid #eadfca;border-radius:12px;box-shadow:0 18px 45px rgba(17,24,39,.18);z-index:2147483000;padding:7px;color:#111827;text-align:left;font-size:11.5px;font-weight:500;overflow:hidden;}
.vg-excel-filter-menu.show{display:block;}
.vg-excel-filter-title{font-weight:800;color:#8f6a12;margin:1px 2px 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.vg-filter-sort-row{display:grid;grid-template-columns:1fr 1fr;gap:6px}.vg-filter-action{width:100%;border:1px solid #eadfca;background:#fff;border-radius:9px;padding:6px;text-align:left;font-weight:700;color:#374151;display:flex;align-items:center;gap:5px;justify-content:center;}
.vg-filter-action:hover{background:#fff8e6;color:#8f6a12;}
.vg-filter-divider{height:1px;background:#efe6d2;margin:7px 0;}
.vg-filter-search{width:100%;border:1px solid #eadfca;border-radius:10px;padding:7px 8px;outline:none;margin-bottom:6px;}
.vg-filter-search:focus{border-color:#d4af37;box-shadow:0 0 0 3px rgba(212,175,55,.16);}
.vg-filter-select-row{display:flex;gap:6px;margin-bottom:8px;}
.vg-filter-select-row button,.vg-filter-clear,.vg-filter-apply{border:1px solid #eadfca;background:#fffdf6;border-radius:9px;padding:6px 9px;font-weight:700;color:#374151;}
.vg-filter-select-row button:hover,.vg-filter-clear:hover{background:#fff8e6;color:#8f6a12;}
.vg-filter-values{max-height:105px;overflow:auto;border:1px solid #f0e7d6;border-radius:10px;padding:4px;background:#fffefa;}
.vg-filter-value{display:flex;gap:7px;align-items:center;padding:4px 6px;border-radius:8px;cursor:pointer;white-space:normal;color:#1f2937;}
.vg-filter-value:hover{background:#fff8e6;}
.vg-filter-value input{accent-color:#d4af37;flex:0 0 auto;}
.vg-filter-value span{overflow:hidden;text-overflow:ellipsis;}
.vg-filter-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:6px;position:sticky;bottom:0;background:#fff;padding-top:5px;}
.vg-filter-apply{background:linear-gradient(135deg,#8f6a12,#d4af37);color:#111827;border-color:#d4af37;}
.vg-filter-apply:hover{filter:brightness(.98);}
.dt-scroll-head{overflow:hidden!important;}


.common-filter-toggle {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 38px;
    padding: .45rem .9rem;
    border: 1px solid rgba(164, 126, 37, .28);
    border-radius: 999px;
    background: #fffdf7;
    color: #6f5207;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(164, 126, 37, .08);
    cursor: pointer;
    user-select: none;
}
.common-filter-toggle input {
    width: 16px;
    height: 16px;
    accent-color: #a47e25;
}
.common-filter-toggle:has(input:checked) {
    background: linear-gradient(135deg, #fff7d8, #fffdf7);
    border-color: rgba(164, 126, 37, .55);
    color: #0a4f7a;
}

.common-filter-status {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: .25rem .75rem;
    border-radius: 999px;
    background: #eef9f5;
    color: #047857;
    font-weight: 700;
    font-size: .85rem;
    border: 1px solid rgba(4, 120, 87, .18);
}
.common-filter-locked {
    opacity: .62;
}
.common-filter-locked .multi-select-dropdown,
.common-filter-locked select {
    pointer-events: none;
}
.common-filter-locked .form-label::after {
    content: "  (Common)";
    color: #047857;
    font-weight: 700;
    font-size: .78rem;
}

/* Shipping Order Status summary table update */
.shipping-summary-total-row td {
    font-weight: 800;
    background: #f8fafc;
}
.shipping-summary-total-row:first-child td {
    background: #fff7ed;
}
.shipping-summary-customer-row:hover td {
    background: #fff7e6;
}
.shipping-customer-link {
    border: 0;
    background: transparent;
    padding: 0;
    color: #0f3b73;
    font-weight: 800;
    text-decoration: underline;
    cursor: pointer;
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.shipping-customer-link:hover {
    color: #9a5b00;
}
.shipping-summary-filters .form-select {
    min-width: 128px;
}

/* Shipping Order Status final alignment and standard table controls */
.shipping-status-table-area {
    padding: 12px 14px 14px;
    border: 1px solid #dfe8f3;
    border-radius: 16px;
    background: #fff;
}
.shipping-status-table-shell {
    max-height: 430px;
    overflow: auto;
    border: 1px solid #e3e8ef;
    border-radius: 12px;
}
#shippingStatusTable thead th {
    position: sticky;
    top: 0;
    z-index: 6;
}
#shippingStatusTable tbody tr:nth-child(1) td {
    position: sticky;
    top: 36px;
    z-index: 5;
    background: #fff7e6 !important;
    box-shadow: inset 0 -1px 0 #e4d7bd;
}
#shippingStatusTable tbody tr:nth-child(2) td {
    position: sticky;
    top: 72px;
    z-index: 5;
    background: #f8fafc !important;
    box-shadow: inset 0 -1px 0 #dbe3ee;
}
#shippingStatusTable tbody tr:nth-child(3) td {
    position: sticky;
    top: 108px;
    z-index: 5;
    background: #f8fafc !important;
    box-shadow: inset 0 -1px 0 #dbe3ee;
}
#shippingStatusTable th:first-child,
#shippingStatusTable td:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    position: sticky;
    left: 0;
}
#shippingStatusTable tbody tr.shipping-summary-customer-row td:first-child {
    z-index: 5;
    background: #fff;
    box-shadow: 2px 0 0 rgba(148,163,184,.16);
}
#shippingStatusTable thead th:first-child {
    z-index: 9;
    box-shadow: 2px 0 0 rgba(148,163,184,.16);
}
#shippingStatusTable tbody tr.shipping-summary-total-row td:first-child {
    z-index: 8;
    box-shadow: 2px 0 0 rgba(148,163,184,.16);
}
.shipping-th-filter {
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 800;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}
.shipping-th-filter i {
    font-size: 11px;
    color: #9a6a10;
    opacity: .75;
}
.shipping-th-filter.active i,
.shipping-th-filter:hover i {
    opacity: 1;
    color: #0d6efd;
}
.shipping-status-card[data-shipping-card="All"] {
    border-color: #d8b86a;
    background: linear-gradient(180deg, #fffdf6 0%, #fff8e4 100%);
}

.shipping-info-bar {
    width: 100%;
    flex: 0 0 auto;
    align-self: stretch;
    display: none;
}
.shipping-info-bar.is-visible {
    display: block;
}
.shipping-date-range-summary {
    display: none;
    width: 100%;
    margin: 0;
    padding: 0.65rem 0.95rem;
    border-radius: 10px;
    background: linear-gradient(180deg, #fffdf6 0%, #fff8e8 100%);
    border: 1px solid rgba(212, 175, 55, 0.28);
    font-size: 0.86rem;
    color: #6f5f48;
    line-height: 1.5;
    box-sizing: border-box;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    word-break: normal;
}
.shipping-date-range-summary.is-visible {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}
.shipping-date-range-summary .shipping-info-icon {
    flex: 0 0 auto;
    color: #8f6a12;
    font-size: 1rem;
    line-height: 1;
}
.shipping-date-range-summary .shipping-info-text {
    flex: 1 1 auto;
    min-width: 0;
}
.shipping-date-range-summary strong {
    color: #805b12;
}
.shipping-status-toolbar {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 12px;
}
.shipping-filter-bar {
    display: flex;
    align-items: flex-end;
    flex-wrap: nowrap;
    gap: 10px 12px;
    padding: 12px 14px;
    border: 1px solid #e4ebf4;
    border-radius: 12px;
    background: linear-gradient(180deg, #fbfcfe 0%, #f6f9fc 100%);
    overflow-x: auto;
}
.shipping-summary-filters,
.shipping-date-filters {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}
.shipping-filter-divider {
    width: 1px;
    height: 34px;
    align-self: flex-end;
    margin: 0 2px;
    background: #d8e2ee;
    flex: 0 0 1px;
}
.shipping-orders-excel-btn {
    white-space: nowrap;
    align-self: flex-end;
}
.shipping-filter-item {
    width: 132px;
    flex: 0 0 132px;
    min-width: 0;
}
.shipping-filter-item .form-label {
    font-size: 11px;
    font-weight: 800;
    color: #805b12;
    margin-bottom: 4px !important;
    white-space: nowrap;
}
.shipping-filter-item .form-select,
.shipping-filter-item .form-control {
    width: 100% !important;
    min-width: 0 !important;
    height: 34px;
    border-radius: 10px;
    font-size: 12px;
}
.shipping-filter-item--date {
    width: 148px;
    flex: 0 0 148px;
}
.shipping-search-box {
    flex: 0 0 200px;
    width: 200px;
    max-width: 100%;
}
.shipping-search-box .form-label {
    font-size: 11px;
    font-weight: 800;
    color: #805b12;
    margin-bottom: 4px !important;
}
.shipping-search-box .form-control {
    height: 34px;
    border-radius: 10px;
    font-size: 12px;
}
.shipping-actions-bar {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    flex-wrap: nowrap;
    padding: 10px 14px;
    border: 1px solid #e4ebf4;
    border-radius: 12px;
    background: #fff;
}
.shipping-view-paging {
    margin-left: 0;
    flex: 0 0 auto;
}
.shipping-export-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    flex: 0 0 auto;
}
.shipping-actions-bar .shipping-search-box,
.shipping-search-box--inline {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    margin-left: auto;
}
.shipping-actions-bar .shipping-search-box .form-label,
.shipping-search-box--inline .form-label {
    margin-bottom: 0 !important;
    white-space: nowrap;
    flex: 0 0 auto;
}
.shipping-actions-bar .shipping-search-box .form-control,
.shipping-search-box--inline .form-control {
    width: 190px !important;
    min-width: 160px;
    flex: 0 0 190px;
}
@media (max-width: 1100px) {
    .shipping-actions-bar,
    .shipping-filter-bar {
        flex-wrap: wrap;
    }
    .shipping-filter-divider {
        display: none;
    }
    .shipping-actions-bar .shipping-search-box,
    .shipping-search-box--inline {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
    }
    .shipping-actions-bar .shipping-search-box .form-control,
    .shipping-search-box--inline .form-control {
        flex: 1 1 auto;
        width: auto !important;
        min-width: 0;
    }
    .shipping-date-range-summary {
        white-space: normal;
    }
}
@media (max-width: 768px) {
    .shipping-filter-item,
    .shipping-filter-item--date {
        flex: 1 1 calc(50% - 10px);
        width: auto;
    }
}

/* Customer Type filter alignment - Sales Order Dashboard */
.salesorder-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(180px, 1fr)) !important;
    gap: 1rem !important;
    align-items: end !important;
}
.salesorder-filter-grid .filter-box { min-width: 0 !important; width: 100% !important; }
.salesorder-filter-grid .dashboard-reset-filter-box { grid-column: auto !important; }
.multi-select-panel-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .75rem !important;
    width: 100% !important;
}
.multi-select-panel-actions .multi-select-check {
    display: inline-flex !important;
    align-items: center !important;
    gap: .4rem !important;
    margin: 0 !important;
    min-width: 0 !important;
}
.multi-select-panel-actions .multi-select-clear { margin-left: auto !important; padding: 0 !important; }
@media (max-width: 1199.98px) { .salesorder-filter-grid { grid-template-columns: repeat(2, minmax(180px, 1fr)) !important; } }
@media (max-width: 575.98px) { .salesorder-filter-grid { grid-template-columns: 1fr !important; } }