:root{
    --brand:#006136;
    --brand-dark:#004f2d;
    --brand-deep:#004626;
    --brand-2:#087948;
    --brand-soft:#e9f5ee;
    --brand-soft-2:#dff1e6;
    --gold:#e9e177;
    --gold-strong:#f0c230;
    --gold-soft:#fff7db;
    --bg:#f7f8f8;
    --surface:#ffffff;
    --text:#1f2924;
    --muted:#7b8580;
    --border:#e5e9e7;
    --sidebar:228px;
    --topbar:74px;
    --shadow:0 4px 16px rgba(20,48,34,.045);
}

*{box-sizing:border-box}
html,body{min-height:100%}
body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
    font-size:14px;
    -webkit-font-smoothing:antialiased;
}
a{color:var(--brand)}
.text-brand{color:var(--brand)!important}
.text-gold{color:#a47b00!important}
.bg-brand{background:var(--brand)!important}

.btn{border-radius:7px;font-weight:600;font-size:13px;min-height:38px}
.btn-brand{
    --bs-btn-bg:var(--brand);
    --bs-btn-border-color:var(--brand);
    --bs-btn-hover-bg:var(--brand-dark);
    --bs-btn-hover-border-color:var(--brand-dark);
    --bs-btn-active-bg:var(--brand-dark);
    --bs-btn-active-border-color:var(--brand-dark);
    --bs-btn-color:#fff;
}
.btn-outline-brand{color:var(--brand);border-color:#a9cbb9;background:#fff}
.btn-outline-brand:hover{color:#fff;background:var(--brand);border-color:var(--brand)}
.btn-soft-brand{background:var(--brand-soft);color:var(--brand);border:1px solid #cce4d6}
.btn-gold{background:var(--gold-strong);border-color:var(--gold-strong);color:#3c371a}
.btn-gold:hover{background:#dfb21f;border-color:#dfb21f;color:#2f2b16}

.form-control,.form-select{
    border-color:#dfe4e1;
    min-height:40px;
    font-size:13px;
    border-radius:7px;
    box-shadow:none;
}
.form-control:focus,.form-select:focus{
    border-color:#7aaf93;
    box-shadow:0 0 0 .2rem rgba(0,97,54,.09);
}
.form-label{font-weight:650;color:#49534e;font-size:14px;margin-bottom:6px}
.form-label.required:after{content:" *";color:#dc3545}

/* Shell */
.sidebar{
    position:fixed;
    left:0;top:0;bottom:0;
    width:var(--sidebar);
    background:linear-gradient(180deg,#00613a 0%,#00562f 56%,#004f2c 100%);
    z-index:1040;
    display:flex;
    flex-direction:column;
    transition:.25s ease;
    color:#fff;
    box-shadow:8px 0 24px rgba(0,70,38,.04);
}
.brand{
    min-height:122px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px 20px 13px;
    text-decoration:none;
}
.brand img{
    width:115px;
    height:88px;
    object-fit:contain;
    border-radius:50%;
    filter:drop-shadow(0 3px 7px rgba(0,0,0,.08));
}
.side-nav{
    padding:4px 12px 16px;
    overflow:auto;
    flex:1;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.2) transparent;
}
.side-nav .nav-link{
    display:flex;
    align-items:center;
    gap:12px;
    color:rgba(255,255,255,.91);
    padding:11px 13px;
    border-radius:8px;
    margin:3px 0;
    font-weight:600;
    text-decoration:none;
    transition:.18s ease;
}
.side-nav .nav-link>i:first-child{font-size:18px;width:21px;text-align:center;color:#d9eee3}
.side-nav .nav-link span{flex:1}
.side-nav .nav-chevron{font-size:16px!important;width:auto!important;color:rgba(255,255,255,.8)!important}
.side-nav .nav-link:hover{background:rgba(255,255,255,.08);color:#fff}
.side-nav .nav-link.active{
    background:rgba(255,255,255,.105);
    color:var(--gold);
    font-weight:750;
}
.side-nav .nav-link.active>i:first-child{color:var(--gold)}
.sidebar-support{
    margin:10px 13px 16px;
    padding:15px 13px;
    border:1px solid rgba(255,255,255,.13);
    background:rgba(255,255,255,.045);
    border-radius:9px;
    color:#fff;
}
.support-head{display:flex;align-items:center;gap:10px}
.support-icon{width:33px;height:33px;border-radius:8px;display:grid;place-items:center;color:var(--gold-strong);font-size:21px;background:rgba(255,255,255,.06)}
.support-head small{display:block;font-size:10px;color:rgba(255,255,255,.72);line-height:1.2}
.support-head strong{display:block;color:var(--gold-strong);font-size:17px;line-height:1.25;margin-top:2px}
.sidebar-support>a{display:block;color:rgba(255,255,255,.75);text-decoration:none;font-size:10.5px;margin-top:10px;white-space:nowrap}

.main{
    margin-left:var(--sidebar);
    min-height:100vh;
    transition:.25s ease;
    display:flex;
    flex-direction:column;
}
.topbar{
    height:var(--topbar);
    background:#fff;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    padding:0 24px;
    position:sticky;
    top:0;
    z-index:1020;
}
.topbar-left{display:flex;align-items:center;gap:13px;min-width:250px}
.topbar-title{font-size:18px;line-height:1;margin:0;font-weight:760;color:#171d1a}
.icon-btn{
    width:38px;height:38px;
    border:0;
    background:transparent;
    border-radius:8px;
    font-size:20px;
    color:#303a35;
    display:inline-grid;
    place-items:center;
}
.icon-btn:hover{background:#f3f6f4}
.top-search{
    margin:0 auto;
    position:relative;
    width:min(390px,34vw);
}
.top-search>i,.input-icon>i{
    position:absolute;
    left:13px;top:50%;
    transform:translateY(-50%);
    color:#77817c;
    z-index:2;
}
.top-search input{
    width:100%;
    border:1px solid #dfe4e1;
    background:#fff;
    border-radius:7px;
    padding:9px 72px 9px 39px;
    outline:0;
    font-size:12px;
    min-height:38px;
}
.top-search input:focus{border-color:#91b5a1;box-shadow:0 0 0 3px rgba(0,97,54,.06)}
.top-search kbd{
    position:absolute;
    right:8px;top:50%;
    transform:translateY(-50%);
    border:1px solid #e0e4e2;
    border-radius:5px;
    background:#f8f9f8;
    color:#8a918d;
    box-shadow:none;
    font-family:inherit;
    font-size:9px;
    padding:3px 6px;
}
.top-actions{display:flex;align-items:center;gap:5px;margin-left:18px}
.notification-count{
    position:absolute;
    right:1px;top:0;
    min-width:17px;height:17px;
    display:grid;place-items:center;
    padding:0 4px;
    border:2px solid #fff;
    background:var(--gold-strong);
    color:#3d3514;
    border-radius:20px;
    font-size:8px;
    font-weight:800;
}
.user-menu{
    display:flex;
    align-items:center;
    gap:9px;
    border:0;
    background:transparent;
    color:#2f3733;
    padding:4px 4px 4px 8px;
    min-width:0;
}
.user-menu.dropdown-toggle:after{margin-left:8px;color:#59625d}
.user-avatar{
    width:36px;height:36px;
    border-radius:50%;
    background:var(--brand);
    color:#fff;
    display:grid;place-items:center;
    font-weight:800;
    font-size:12px;
}
.user-copy{text-align:left;line-height:1.2;max-width:145px}
.user-copy strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-copy small{display:block;color:#858d89;font-size:11.5px;margin-top:3px}

.content{padding:18px 20px 28px;flex:1;min-width:0}
.footer{padding:14px 20px;color:#9aa19d;font-size:13px;border-top:1px solid var(--border);background:#fff}
.page-intro{margin:0 0 14px}
.page-intro p{margin:0;color:var(--muted);font-size:12px}

/* Common panels */
.card-panel{
    background:#fff;
    border:1px solid var(--border);
    border-radius:9px;
    padding:17px;
    box-shadow:var(--shadow);
}
.card-title-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
.card-title-row h3,.section-title h3{font-size:14px;margin:0;font-weight:760;color:#202824}
.card-title-row p,.section-title p{font-size:13px;color:var(--muted);margin:3px 0 0}
.section-title{display:flex;align-items:center;gap:10px;margin-bottom:15px}
.section-number{width:29px;height:29px;border-radius:7px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-weight:800;font-size:13px}

/* Dashboard */
.dashboard-toolbar{display:flex;justify-content:flex-end;align-items:center;margin-bottom:12px}
.date-range-btn{
    min-height:35px;
    display:flex;
    align-items:center;
    gap:7px;
    padding:7px 10px;
    background:#fff;
    border:1px solid var(--border);
    color:#3b443f;
    border-radius:7px;
    font-size:13px;
    font-weight:600;
}
.date-range-btn i{font-size:15px}
.stats-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px}
.stat-card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:8px;
    padding:15px 14px;
    display:flex;
    align-items:flex-start;
    gap:11px;
    box-shadow:var(--shadow);
    min-width:0;
}
.stat-icon{width:40px;height:40px;border-radius:8px;display:grid;place-items:center;font-size:20px;flex:0 0 auto}
.bg-soft-green{background:#e4f3e8;color:#17934e}
.bg-soft-yellow{background:#fff2cf;color:#e4a500}
.bg-soft-blue{background:#e9f2ff;color:#347bd2}
.bg-soft-red{background:#fdeeee;color:#d55757}
.stat-copy{min-width:0;flex:1}
.stat-card span{display:block;color:#66716b;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-card strong{display:block;font-size:21px;line-height:1.15;margin:5px 0 8px;color:#171d1a}
.stat-card small{font-size:11.5px;color:#8b9690;white-space:nowrap}
.stat-card small.up{color:#198754;font-weight:650}
.stat-card small.down{color:#d55757;font-weight:650}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(270px,1fr) minmax(245px,.82fr);gap:11px;margin-top:11px}
.dashboard-bottom{display:grid;grid-template-columns:minmax(0,3.2fr) minmax(250px,.82fr);gap:11px;margin-top:11px}
.chart-box{height:235px}
.chart-box.donut{height:178px}
.chart-filter{min-height:31px;font-size:10px;border-radius:6px;width:auto;padding-top:4px;padding-bottom:4px}
.chart-legend-inline{display:flex;gap:15px;align-items:center;margin-left:auto;margin-right:10px;font-size:11.5px;color:#666f6a}
.chart-legend-inline span{display:flex;align-items:center;gap:5px}
.chart-legend-inline i{width:9px;height:3px;border-radius:3px;display:inline-block}
.chart-legend-inline .green{background:var(--brand)}
.chart-legend-inline .yellow{background:#e9ad00}
.vehicle-wrap{display:grid;grid-template-columns:minmax(140px,.95fr) minmax(150px,1.05fr);gap:12px;align-items:center;min-height:220px}
.donut-legend{display:flex;flex-direction:column;gap:13px;margin:0}
.donut-legend span{display:grid;grid-template-columns:14px minmax(0,1fr) auto;align-items:center;gap:4px;color:#5b655f;font-size:11.5px}
.donut-legend b{font-size:11.5px;color:#303833;font-weight:650}
.legend-dot{width:9px;height:9px;border-radius:2px}
.dot-green{background:#0f8c50}.dot-yellow{background:#efae00}.dot-deep{background:#00613a}.dot-gray{background:#cdd3d0}.dot-blue{background:#4b8fd7}
.status-list{display:flex;flex-direction:column;gap:9px;margin-top:2px}
.status-row{display:grid;grid-template-columns:27px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:31px}
.status-row .status-icon{width:25px;height:25px;border-radius:7px;display:grid;place-items:center;font-size:13px}
.status-row span:nth-child(2){font-size:10.5px;color:#515a55}
.status-count{min-width:43px;text-align:center;border-radius:6px;padding:4px 6px;font-size:10px;font-weight:750}
.status-yellow .status-icon,.status-yellow .status-count{background:#fff2cf;color:#b47a00}
.status-blue .status-icon,.status-blue .status-count{background:#e8f2ff;color:#3277c9}
.status-green .status-icon,.status-green .status-count{background:#e5f4e9;color:#15854a}
.status-red .status-icon,.status-red .status-count{background:#fde8e8;color:#d94c4c}
.dashboard-orders.card-panel{padding:0}
.dashboard-orders .card-title-row{padding:14px 16px 9px;margin:0}
.dashboard-orders .table-responsive{padding:0 10px}
.dashboard-orders .table{margin:0}
.data-table-lite th,.orders-table th{
    font-size:14.5px;
    text-transform:none;
    color:#525b56;
    white-space:nowrap;
    border-bottom-color:#e6ebe8;
    background:#f8f9f8;
    font-weight:700;
}
.data-table-lite td{border-bottom-color:#edf0ee;font-size:9.8px;color:#343d38;vertical-align:middle}
.data-table-lite tbody tr:last-child td{border-bottom:0}
.order-code{color:var(--brand);font-weight:700;text-decoration:none}
.table-action{width:27px;height:27px;display:grid;place-items:center;border-radius:6px;background:#f6f8f7;color:var(--brand);border:1px solid #e8ecea;text-decoration:none}
.status-badge{display:inline-flex;padding:4px 7px;border-radius:5px;font-size:11.5px;font-weight:650;white-space:nowrap}
.status-badge.success{background:#e2f4e7;color:#16864b}.status-badge.warning{background:#fff0cc;color:#b27a08}.status-badge.info{background:#e5f1ff;color:#3576bd}.status-badge.danger{background:#fde5e5;color:#d74f4f}
.table-footer-lite{display:flex;justify-content:space-between;align-items:center;padding:12px 16px 14px;color:#8a938e;font-size:11.5px}
.pagination-lite{display:flex;align-items:center;gap:5px}
.pagination-lite a,.pagination-lite span{width:27px;height:27px;border:1px solid #e0e5e2;border-radius:5px;display:grid;place-items:center;text-decoration:none;color:#59625d;background:#fff;font-size:10px}
.pagination-lite .active{background:var(--brand);border-color:var(--brand);color:#fff}
.quick-panel{padding:15px}
.quick-actions{display:flex;flex-direction:column;gap:6px}
.quick-action{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:38px;
    padding:7px 9px;
    border-radius:5px;
    background:#f8f9f8;
    color:#3f4843;
    text-decoration:none;
    font-size:10.5px;
    transition:.15s ease;
}
.quick-action:hover{background:#f1f5f2;color:var(--brand)}
.quick-action i{font-size:17px;color:var(--brand)}
.quick-action.gold i{color:#e1a000}
.quick-action.blue i{color:#3b83d3}
.promo-card{
    margin-top:11px;
    min-height:140px;
    border-radius:8px;
    padding:18px 15px;
    position:relative;
    overflow:hidden;
    color:#fff;
    background:linear-gradient(135deg,#047446,#005a35);
}
.promo-card:after{content:"";position:absolute;right:-35px;bottom:-55px;width:150px;height:150px;border:25px solid rgba(233,225,119,.13);border-radius:50%}
.promo-card h4{font-size:12px;margin:0 0 8px;font-weight:800}
.promo-card p{font-size:10px;color:#e3eee8;line-height:1.6;margin-bottom:13px;max-width:150px}
.promo-card .btn{position:relative;z-index:2;min-height:30px;font-size:11.5px;padding:5px 11px}

/* Forms and operational pages */
.input-icon{position:relative}.input-icon .form-control{padding-left:38px}
.search-wide{min-width:360px}
.filter-panel{margin-bottom:13px}
.table-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;gap:13px}
.selected-count{font-size:13px;color:#87918c}
.orders-table{font-size:15px}
.orders-table td{white-space:nowrap;border-color:#edf0ee;vertical-align:middle}
.order-meta{line-height:1.25}.order-meta small{display:block;color:#8a949c}
.action-menu .btn{padding:3px 7px;min-height:28px}.action-menu .dropdown-menu{font-size:13px;min-width:190px}.action-menu .dropdown-item{padding:7px 12px}.action-menu .dropdown-item i{width:20px;color:#6d7982}
.package-table th{white-space:nowrap;color:#68736d;font-size:10px;background:#f8faf9}.package-table td{padding:7px 5px}.package-table .form-control{min-width:76px;padding:6px 7px;min-height:34px;font-size:12px}.package-table .name-input{min-width:150px}.package-calc{font-weight:700;color:#53605a;font-size:13px}
.package-total{display:flex;justify-content:flex-end;gap:28px;border-top:1px solid #edf0f2;margin-top:13px;padding-top:14px}.package-total div{text-align:right}.package-total span{display:block;font-size:10px;color:#8c9691}.package-total strong{font-size:13px}.text-orange{color:#e87536!important}.vnd-total{background:#e9f7f0;border:1px solid #cbe8da;border-radius:7px;padding:9px 11px}.vnd-total span{display:block;font-size:9px;color:#638576}.vnd-total strong{display:block;text-align:right;color:#14734e;font-size:14px}.form-actions{display:flex;justify-content:flex-end;gap:10px;padding:20px 0 5px}
.select2-container{width:100%!important}.select2-container .select2-selection--single{height:40px;border-color:#dce3e8;border-radius:7px}.select2-container .select2-selection--single .select2-selection__rendered{line-height:38px}.select2-container .select2-selection--multiple{min-height:40px;border-color:#dce3e8;border-radius:7px}
.permission-table th{white-space:nowrap;font-size:13px;color:#657169}.permission-table td{font-size:12px}.permission-table input[type=checkbox]{width:17px;height:17px;accent-color:var(--brand)}.module-row td{background:#f2f7f4;color:var(--brand);font-weight:800;font-size:13px!important}
.profile-card{padding:26px}.profile-avatar{position:relative;width:112px;margin:0 auto 14px}.profile-avatar img{width:112px;height:112px;border-radius:50%;background:#eef2f2;border:5px solid #f6f8f8}.profile-avatar button{position:absolute;right:3px;bottom:4px;width:34px;height:34px;border-radius:50%;border:3px solid white;background:var(--brand);color:white}.profile-card h3{font-size:17px;margin-bottom:3px}.profile-card p{color:var(--muted)}.profile-meta{text-align:left;display:grid;gap:13px}.profile-meta div{display:flex;justify-content:space-between}.profile-meta span{color:var(--muted)}.profile-meta strong{font-size:13px}
.modal-content{border:0;border-radius:10px;box-shadow:0 20px 60px rgba(27,55,41,.16)}.modal-header{border-bottom-color:#edf0ee}.modal-footer{border-top-color:#edf0ee}

/* Login */
.login-body{background:#fff;min-height:100vh}
.login-grid{min-height:100vh;display:grid;grid-template-columns:minmax(440px,42%) 1fr}
.login-form-pane{display:flex;align-items:center;justify-content:center;padding:50px}
.login-box{width:100%;max-width:420px}
.login-brand{display:flex;align-items:center;gap:11px;margin-bottom:48px}.login-brand img{width:62px;height:62px;border-radius:50%}.login-brand strong{display:block;color:var(--brand);font-size:20px}.login-brand span{display:block;color:#9e8925;font-size:13px;font-weight:800;letter-spacing:3px}.login-box h1{font-size:28px;font-weight:800;color:var(--brand)}.login-box p{color:var(--muted)}.login-box .input-icon input{padding-left:41px;padding-right:40px}.login-box .input-icon button{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#8c969e}.link-green{color:var(--brand);text-decoration:none;font-size:12px}.demo-note{margin-top:15px;background:#f4f8f6;border:1px dashed #b7d4c9;padding:9px;border-radius:7px;color:#547266;font-size:13px}.login-copy{margin-top:35px;color:#a3abb1;font-size:13px}.login-visual{position:relative;background:url('/assets/img/authentication-bg.jpg') center/cover no-repeat;display:flex;align-items:flex-end;padding:70px;color:#fff;overflow:hidden}.login-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,97,54,.22),rgba(0,70,38,.93))}.login-visual-content{position:relative;z-index:1;max-width:700px}.eyebrow{color:var(--gold);font-size:12px;letter-spacing:3px;font-weight:800;margin-bottom:14px}.login-visual h2{font-size:42px;line-height:1.15;font-weight:800}.login-visual p{font-size:16px;color:#dbe9e4}.visual-stats{display:flex;gap:45px;margin-top:35px;border-top:1px solid rgba(255,255,255,.2);padding-top:25px}.visual-stats strong{display:block;font-size:20px;color:var(--gold)}.visual-stats span{font-size:13px;color:#d5e3de}

/* Sidebar state / responsive */
.sidebar-collapsed .sidebar{transform:translateX(-100%)}
.sidebar-collapsed .main{margin-left:0}
@media(max-width:1360px){
    .stats-grid{grid-template-columns:repeat(3,1fr)}
    .dashboard-grid{grid-template-columns:1.45fr 1fr}.dashboard-grid>.card-panel:last-child{grid-column:1/-1}
    .status-list{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
    .status-row{grid-template-columns:26px 1fr auto}
}
@media(max-width:1120px){
    .top-search{width:min(330px,31vw)}
    .dashboard-bottom{grid-template-columns:1fr}
    .quick-panel-wrap{display:grid;grid-template-columns:1fr 1fr;gap:11px}
    .promo-card{margin-top:0}
}
@media(max-width:992px){
    .sidebar{transform:translateX(-100%);box-shadow:0 0 30px rgba(0,0,0,.18)}
    .main{margin-left:0}
    .sidebar-open .sidebar{transform:translateX(0)}
    .topbar-left{min-width:auto}
    .topbar-title{font-size:16px}
    .content{padding:16px}
    .login-grid{grid-template-columns:1fr}.login-visual{display:none}
    .search-wide{min-width:240px}
    .dashboard-grid{grid-template-columns:1fr}.dashboard-grid>.card-panel:last-child{grid-column:auto}
    .status-list{display:flex}
}
@media(max-width:760px){
    .stats-grid{grid-template-columns:repeat(2,1fr)}
    .top-search{display:none}
    .user-copy{display:none!important}
    .table-toolbar{align-items:stretch;flex-direction:column}.table-toolbar>div{flex-wrap:wrap}.search-wide{min-width:100%;width:100%}
    .vehicle-wrap{grid-template-columns:1fr}.chart-box.donut{height:155px}.donut-legend{display:grid;grid-template-columns:1fr 1fr}
    .quick-panel-wrap{grid-template-columns:1fr}
    .promo-card{margin-top:11px}
}
@media(max-width:520px){
    :root{--topbar:64px}
    .topbar{padding:0 12px}.content{padding:12px}
    .stats-grid{grid-template-columns:1fr}.stat-card strong{font-size:22px}
    .topbar-title{max-width:155px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .package-total{justify-content:space-between;gap:8px}.login-form-pane{padding:28px}.visual-stats{gap:20px}
    .dashboard-toolbar{justify-content:stretch}.date-range-btn{width:100%;justify-content:center}
}

/* Orders pagination */
.orders-pagination-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding:13px 2px 0;
    margin-top:8px;
    border-top:1px solid #edf0ee;
}
.orders-pagination-summary{font-size:10.5px;color:#7a8580;white-space:nowrap}
.orders-pagination-summary strong{color:#39433e;font-weight:750}
.pagination-page-text{color:#9aa39f;margin-left:4px}
.orders-pagination-controls{display:flex;align-items:center;justify-content:flex-end;gap:7px;min-width:0}
.page-size-label{font-size:10.5px;color:#7a8580;white-space:nowrap}
.page-size-select{width:70px;min-height:31px;padding-top:3px;padding-bottom:3px;font-size:10.5px;border-color:#dfe5e2}
.orders-pagination{display:flex;align-items:center;gap:5px;margin-left:5px;white-space:nowrap}
.orders-pagination button{
    width:30px;
    height:30px;
    padding:0;
    border:1px solid #dfe5e2;
    border-radius:6px;
    display:inline-grid;
    place-items:center;
    background:#fff;
    color:#55615a;
    font-size:10.5px;
    font-weight:650;
    transition:.15s ease;
}
.orders-pagination button:hover:not(:disabled):not(.active){border-color:#9fc9b5;color:var(--brand);background:#f4faf7}
.orders-pagination button.active{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 3px 8px rgba(0,97,54,.18)}
.orders-pagination button:disabled{opacity:.38;cursor:not-allowed;background:#f6f7f7}
.orders-pagination .page-nav-btn i{font-size:15px}
.page-ellipsis{width:20px;text-align:center;color:#98a19d;font-size:13px;font-weight:700}
@media(max-width:860px){
    .orders-pagination-footer{align-items:flex-start;flex-direction:column}
    .orders-pagination-controls{width:100%;justify-content:space-between;flex-wrap:wrap}
    .orders-pagination{margin-left:auto}
}
@media(max-width:520px){
    .orders-pagination-summary{white-space:normal}
    .pagination-page-text{display:block;margin:3px 0 0}
    .orders-pagination{width:100%;margin:4px 0 0;overflow-x:auto;padding-bottom:3px;justify-content:flex-start}
}

/* Google Translate language switcher */
.language-switcher{position:relative}
.language-btn{
    min-width:68px;height:38px;
    display:inline-flex;align-items:center;justify-content:center;gap:6px;
    border:1px solid #e0e5e2;background:#fff;color:#34413a;
    border-radius:8px;padding:0 9px;font-size:13px;font-weight:750;
    transition:.16s ease;
}
.language-btn:hover,.language-btn[aria-expanded="true"]{border-color:#a7cab6;background:var(--brand-soft);color:var(--brand)}
.language-btn>i{font-size:17px;color:var(--brand)}
.language-btn.dropdown-toggle:after{margin-left:1px;font-size:9px;color:#7a8580}
.language-menu{width:205px;max-height:380px;overflow:auto;padding:6px;border:1px solid var(--border);border-radius:9px}
.language-item{display:flex;align-items:center;gap:9px;border-radius:6px;padding:8px 9px;font-size:12px;color:#35413b}
.language-item:hover{background:#f2f7f4;color:var(--brand)}
.language-item.active,.language-item:active{background:var(--brand-soft);color:var(--brand);font-weight:700}
.language-flag{font-size:17px;line-height:1;width:23px;text-align:center}
.language-check{font-size:16px;color:var(--brand);font-weight:800}
.google-translate-engine{position:fixed!important;left:-9999px!important;top:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
.goog-te-banner-frame.skiptranslate,iframe.goog-te-banner-frame,.VIpgJd-ZVi9od-ORHb-OEVmcd{display:none!important}
body{top:0!important}
html{top:0!important}
.goog-tooltip,.goog-tooltip:hover{display:none!important}
.goog-text-highlight{background:transparent!important;box-shadow:none!important}
.login-language{position:fixed;right:22px;top:20px;z-index:20}
.login-language .language-btn{background:rgba(255,255,255,.96);box-shadow:0 4px 18px rgba(0,50,28,.08)}

@media(max-width:767.98px){
    .language-btn{min-width:42px;padding:0 7px}
    .language-btn>span{font-size:10px}
    .language-menu{width:195px}
    .login-language{right:12px;top:12px}
}

.invoice-filter-dropdown .dropdown-menu {
    min-width: 310px;
}

.invoice-filter-option {
    min-width: 54px;
    border: 0;
}

.invoice-check-icon {
    display: none;
}

.btn-check:checked + .invoice-filter-option .invoice-check-icon {
    display: inline-block;
}

.btn-check:checked + .invoice-filter-option {
    background: #cfcfcf;
    color: #222;
}

@media (hover: hover) and (pointer: fine) {

    #bulkActions:hover > .dropdown-menu {
        display: block;
        margin-top: 0;
    }

}

/* =========================================================
   ORDER ENTRY FORM
   Form lên đơn lớn, dễ nhìn, dễ thao tác.
   Chỉ áp dụng cho #orderForm.order-entry-form để không làm
   thay đổi kích thước form ở các màn hình khác.
   ========================================================= */

.order-entry-form{
    --order-control-height:52px;
    --order-control-radius:10px;
    --order-card-radius:14px;
    --order-focus:0 0 0 4px rgba(0,97,54,.10);
    --order-soft-border:#dce5e0;
}

.order-entry-form .card-panel{
    padding:24px;
    border-color:#dfe6e2;
    border-radius:var(--order-card-radius);
    box-shadow:0 8px 28px rgba(23,55,39,.055);
}

.order-entry-form .order-info-card{
    margin-bottom:4px;
}

.order-entry-form .section-title{
    gap:12px;
    margin-bottom:22px;
}

.order-entry-form .section-number{
    width:36px;
    height:36px;
    flex:0 0 36px;
    border-radius:9px;
    font-size:15px;
}

.order-entry-form .section-title h3{
    font-size:17px;
    line-height:1.25;
    font-weight:800;
    color:#18231e;
}

.order-entry-form .section-title p{
    margin-top:4px;
    font-size:13.5px;
    line-height:1.35;
    color:#87918c;
}

.order-entry-form .form-label{
    margin-bottom:8px;
    color:#35423b;
    font-size:13.5px;
    font-weight:750;
}

.order-entry-form .form-control,
.order-entry-form .form-select{
    min-height:var(--order-control-height);
    padding:10px 14px;
    border:1px solid var(--order-soft-border);
    border-radius:var(--order-control-radius);
    background-color:#fff;
    color:#222d27;
    font-size:15px;
    line-height:1.35;
    transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}

.order-entry-form .form-control::placeholder{
    color:#9aa49f;
    opacity:1;
}

.order-entry-form .form-control:hover,
.order-entry-form .form-select:hover{
    border-color:#b8cbc0;
}

.order-entry-form .form-control:focus,
.order-entry-form .form-select:focus{
    border-color:#5f9d7d;
    box-shadow:var(--order-focus);
}

.order-entry-form textarea.form-control{
    min-height:118px;
    padding-top:13px;
    resize:vertical;
    line-height:1.55;
}

.order-entry-form .input-group > .form-control{
    min-width:0;
}

.order-entry-form .input-group > .btn{
    min-width:52px;
    min-height:var(--order-control-height);
    border-color:var(--order-soft-border);
    border-radius:0 var(--order-control-radius) var(--order-control-radius) 0;
    font-size:18px;
}

.order-entry-form #clearCustomer{
    width:52px;
    height:52px;
    min-height:52px;
    padding:0;
    display:grid;
    place-items:center;
    border-radius:10px;
    font-size:19px;
}

.order-entry-form .form-text{
    margin-top:7px;
    font-size:12.5px;
    line-height:1.4;
}

.order-entry-form .select2-container .select2-selection--single{
    height:var(--order-control-height);
    border:1px solid var(--order-soft-border);
    border-radius:var(--order-control-radius);
    background:#fff;
}

.order-entry-form .select2-container .select2-selection--single:hover{
    border-color:#b8cbc0;
}

.order-entry-form .select2-container--focus .select2-selection--single,
.order-entry-form .select2-container--open .select2-selection--single{
    border-color:#5f9d7d;
    box-shadow:var(--order-focus);
}

.order-entry-form .select2-container .select2-selection--single .select2-selection__rendered{
    height:50px;
    padding:0 42px 0 14px;
    line-height:50px;
    color:#27322c;
    font-size:15px;
}

.order-entry-form .select2-container .select2-selection--single .select2-selection__arrow{
    width:36px;
    height:50px;
    right:5px;
}

.order-entry-form .select2-container .select2-selection--single .select2-selection__placeholder{
    color:#9aa49f;
}

/* Kiện & thể tích */
.order-entry-form .order-package-card .table-responsive{
    margin-bottom:14px;
    border:1px solid #e4ebe7;
    border-radius:12px;
    background:#fff;
    overflow-x:auto;
}

.order-entry-form .package-table{
    min-width:1040px;
    margin:0;
}

.order-entry-form .package-table thead th{
    padding:12px 9px;
    border-bottom:1px solid #dfe7e2;
    background:#f6f9f7;
    color:#5a6861;
    font-size:13px;
    font-weight:800;
    letter-spacing:.01em;
    vertical-align:middle;
}

.order-entry-form .package-table td{
    padding:10px 6px;
    border-bottom-color:#edf1ef;
    vertical-align:middle;
}

.order-entry-form .package-table tbody tr:last-child td{
    border-bottom:0;
}

.order-entry-form .package-table .form-control{
    min-width:88px;
    min-height:46px;
    padding:8px 9px;
    border-radius:8px;
    font-size:14px;
}

.order-entry-form .package-table .name-input{
    min-width:185px;
}

.order-entry-form .package-calc{
    min-width:76px;
    color:#29352e;
    font-size:14px;
    font-weight:800;
    white-space:nowrap;
}

.order-entry-form .remove-package{
    width:38px;
    height:38px;
    min-height:38px;
    padding:0;
    display:grid;
    place-items:center;
    border-radius:8px;
    font-size:18px;
    text-decoration:none;
}

.order-entry-form #addPackage{
    min-height:44px;
    padding:9px 14px;
    border-radius:9px;
    font-size:14px;
}

.order-entry-form .package-total{
    display:grid;
    grid-template-columns:repeat(3,minmax(120px,1fr));
    gap:10px;
    margin-top:16px;
    padding:12px;
    border:1px solid #e2ebe6;
    border-radius:12px;
    background:#f8fbf9;
}

.order-entry-form .package-total > div{
    min-width:0;
    padding:7px 10px;
    text-align:right;
}

.order-entry-form .package-total span{
    margin-bottom:4px;
    color:#86918b;
    font-size:11.5px;
}

.order-entry-form .package-total strong{
    color:#202b25;
    font-size:16px;
    font-weight:800;
}

/* Thông tin hàng + chi hộ */
.order-entry-form .order-cost-card h6{
    margin:0 0 14px!important;
    color:#26332c;
    font-size:16px;
    font-weight:800;
}

.order-entry-form .order-cost-card hr{
    margin:20px 0;
    border-color:#dfe6e2;
    opacity:1;
}

.order-entry-form .order-cost-card .row.g-2{
    --bs-gutter-x:12px;
    --bs-gutter-y:12px;
}

.order-entry-form .vnd-total{
    min-height:var(--order-control-height);
    padding:8px 13px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    border:1px solid #bfe1d0;
    border-radius:10px;
    background:#edf8f2;
}

.order-entry-form .vnd-total span{
    margin-bottom:2px;
    color:#688276;
    font-size:10.5px;
    font-weight:650;
}

.order-entry-form .vnd-total strong{
    color:#0d7047;
    font-size:17px;
    font-weight:850;
}

/* Thanh hành động luôn dễ với tới khi form dài */
.order-entry-form .form-actions{
    position:sticky;
    bottom:0;
    z-index:20;
    margin:20px -20px -28px;
    padding:14px 20px;
    border-top:1px solid rgba(220,229,224,.95);
    background:rgba(247,248,248,.94);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.order-entry-form .form-actions .btn{
    min-height:48px;
    padding:10px 20px;
    border-radius:10px;
    font-size:14px;
}

.order-entry-form .form-actions .btn[type="submit"]{
    min-width:170px;
    font-weight:800;
    box-shadow:0 6px 16px rgba(0,97,54,.16);
}

/* Laptop: vẫn giữ form thoáng nhưng không chiếm quá nhiều chiều cao */
@media(max-width:1399.98px){
    .order-entry-form{
        --order-control-height:50px;
    }

    .order-entry-form .card-panel{
        padding:20px;
    }

    .order-entry-form .section-title{
        margin-bottom:18px;
    }

    .order-entry-form .select2-container .select2-selection--single{
        height:50px;
    }

    .order-entry-form .select2-container .select2-selection--single .select2-selection__rendered{
        height:48px;
        line-height:48px;
    }

    .order-entry-form .select2-container .select2-selection--single .select2-selection__arrow{
        height:48px;
    }
}

/* Tablet / màn hình hẹp */
@media(max-width:991.98px){
    .order-entry-form .card-panel{
        padding:18px;
    }

    .order-entry-form .order-detail-grid{
        --bs-gutter-y:16px;
    }

    .order-entry-form .package-table{
        min-width:980px;
    }

    .order-entry-form .form-actions{
        margin-left:-16px;
        margin-right:-16px;
        margin-bottom:-28px;
        padding-left:16px;
        padding-right:16px;
    }
}

/* Mobile */
@media(max-width:767.98px){
    .order-entry-form{
        --order-control-height:50px;
    }

    .order-entry-form .card-panel{
        padding:16px;
        border-radius:12px;
    }

    .order-entry-form .section-title h3{
        font-size:16px;
    }

    .order-entry-form .section-title p{
        font-size:12.5px;
    }

    .order-entry-form .form-control,
    .order-entry-form .form-select,
    .order-entry-form .select2-container .select2-selection--single .select2-selection__rendered{
        font-size:16px;
    }

    .order-entry-form .package-total{
        grid-template-columns:1fr;
        gap:4px;
    }

    .order-entry-form .package-total > div{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:12px;
        padding:7px 8px;
        text-align:left;
    }

    .order-entry-form .package-total span{
        margin:0;
    }

    .order-entry-form .form-actions{
        gap:8px;
    }

    .order-entry-form .form-actions .btn{
        flex:1;
        min-width:0;
    }
}

@media(max-width:420px){
    .order-entry-form .form-actions{
        flex-direction:column-reverse;
    }

    .order-entry-form .form-actions .btn{
        width:100%;
    }
}
     /* ============================
        Order detail modal
     ============================ */
 #orderDetailModal .modal-dialog {
     max-width: min(1500px, calc(100vw - 40px));
 }

#orderDetailModal .modal-content {
    background: #f7f9f8;
    border-radius: 16px;
    overflow: hidden;
}

#orderDetailModal .modal-header {
    background: #fff;
    border-bottom: 1px solid #e7ece9 !important;
}

#orderDetailModal .modal-title {
    font-size: 20px;
    color: #1f2924;
}

.order-detail-body {
    padding: 20px;
}

.order-detail-section {
    margin-bottom: 20px;
}

.order-detail-section:last-child {
    margin-bottom: 0;
}

.order-detail-heading {
    margin: 0 0 10px;
    color: #202824;
    font-size: 17px;
    font-weight: 800;
}

.order-detail-card {
    background: #fff;
    border: 1px solid #dfe5e2;
    border-radius: 13px;
    padding: 18px;
}

.order-detail-info-grid {
    display: grid;
    grid-template-columns: minmax(170px, 220px) minmax(0, 1fr);
    gap: 13px 18px;
    align-items: center;
}

.order-detail-label {
    color: #5f6964;
    font-size: 14px;
    font-weight: 750;
}

.order-detail-value {
    min-width: 0;
    color: #2a322e;
    font-size: 14px;
    word-break: break-word;
}

.order-detail-table-wrap {
    overflow-x: auto;
}

.order-detail-table {
    min-width: 1120px;
    margin: 0;
}

.order-detail-table thead th {
    padding: 13px 12px;
    background: #f5f7fa;
    border-bottom: 1px solid #e4e8e6;
    color: #333b37;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.order-detail-table tbody td {
    padding: 14px 12px;
    color: #343c38;
    font-size: 13px;
    border-bottom: 1px solid #edf0ee;
    vertical-align: middle;
    white-space: nowrap;
}

.order-detail-table tbody tr:last-child td {
    border-bottom: 0;
}

.order-detail-subtitle {
    margin: 0 0 12px;
    color: #515aa1;
    font-size: 15px;
    font-weight: 800;
}

.order-detail-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e4e9e6;
}

.order-detail-summary-item {
    padding: 13px 15px;
    background: #f7f8fa;
    border: 1px solid #dfe3e1;
    border-radius: 9px;
}

.order-detail-summary-item span {
    display: block;
    margin-bottom: 5px;
    color: #6a726e;
    font-size: 12px;
    font-weight: 700;
}

.order-detail-summary-item strong {
    color: #079447;
    font-size: 15px;
    font-weight: 850;
}

.order-detail-payment-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
}

.order-detail-payment-col + .order-detail-payment-col {
    padding-left: 28px;
    border-left: 1px solid #dde2df;
}

.order-detail-money-row {
    display: grid;
    grid-template-columns: minmax(130px, 230px) minmax(0, 1fr);
    gap: 12px;
    padding: 8px 0;
    align-items: center;
}

.order-detail-money-row span:first-child {
    color: #656d69;
    font-size: 13px;
    font-weight: 750;
}

.order-detail-money-row span:last-child,
.order-detail-money-row strong {
    color: #333b37;
    font-size: 14px;
}

.order-detail-money-row .order-detail-money-total {
    color: #079447;
    font-size: 15px;
    font-weight: 850;
}

.order-detail-loading {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.order-detail-loading-box {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #617069;
    font-size: 14px;
    font-weight: 650;
}

.order-detail-empty {
    padding: 50px 20px;
    text-align: center;
    color: #7e8983;
}

@media (max-width: 767.98px) {
    #orderDetailModal .modal-dialog {
        max-width: calc(100vw - 16px);
        margin: 8px auto;
    }

    .order-detail-body {
        padding: 12px;
    }

    .order-detail-card {
        padding: 14px;
    }

    .order-detail-info-grid {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .order-detail-value {
        margin-bottom: 8px;
    }

    .order-detail-summary {
        grid-template-columns: 1fr;
    }

    .order-detail-payment-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .order-detail-payment-col + .order-detail-payment-col {
        padding-left: 0;
        padding-top: 18px;
        border-left: 0;
        border-top: 1px solid #dde2df;
    }

    .order-detail-money-row {
        grid-template-columns: 1fr auto;
    }
}
     /* Giữ nguyên vùng cuộn ngang; menu được đưa ra ngoài vùng cuộn khi mở. */
 .orders-drag-scroll {
     cursor: grab;
     overflow-x: auto;
 }

.orders-drag-scroll.is-dragging {
    cursor: grabbing;
    user-select: none;
}

.orders-drag-scroll a,
.orders-drag-scroll button,
.orders-drag-scroll input,
.orders-drag-scroll textarea,
.orders-drag-scroll select,
.orders-drag-scroll label,
.orders-drag-scroll .select2-container {
    cursor: auto;
}

/* Menu tạm được gắn vào body nên không bị .table-responsive cắt. */
body > .orders-action-floating-menu {
    z-index: 1090;
    min-width: 255px;
    max-width: calc(100vw - 20px);
    max-height: calc(100vh - 24px);
    overflow-y: auto;
    overscroll-behavior: contain;
}

body > .orders-action-floating-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
}