*{box-sizing:border-box}body{margin:0;background:#f4f7fb;color:#172033;font:14px/1.5 Inter,Segoe UI,Arial,sans-serif}a{color:inherit;text-decoration:none}aside{position:fixed;inset:0 auto 0 0;width:240px;background:#101827;color:#dbe5f5;padding:24px 16px;display:flex;flex-direction:column}.brand{padding:0 12px 24px}.brand b{display:block;font-size:27px;color:#fff}.brand span{font-size:12px;color:#91a2bb}nav{display:grid;gap:5px}nav a{padding:11px 12px;border-radius:9px}nav a:hover{background:#1d2a3e;color:#fff}.sidefoot{margin-top:auto;display:flex;justify-content:space-between;gap:8px;padding:14px 12px;border-top:1px solid #29364a}.sidefoot a{color:#8fc7ff}.app{margin-left:240px;padding:28px;max-width:1600px}header{display:flex;justify-content:space-between;margin-bottom:22px}h1{margin:0;font-size:26px}header p{margin:3px 0;color:#77849a}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.card{background:#fff;border:1px solid #e3e9f2;border-radius:14px;padding:18px;box-shadow:0 4px 18px #1f34500a}.metric b{display:block;font-size:25px;margin-top:7px}.muted{color:#77849a}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:9px;padding:10px 14px;font-weight:650;cursor:pointer;background:#e9eef5}.btn.primary{background:#1769e0;color:#fff}.btn.danger{background:#ffe8e8;color:#a92727}.btn.good{background:#e2f7ea;color:#16723a}.table-wrap{overflow:auto;background:#fff;border:1px solid #e3e9f2;border-radius:14px}table{border-collapse:collapse;width:100%;min-width:760px}th,td{padding:12px 14px;border-bottom:1px solid #edf1f6;text-align:left}th{background:#f8fafc;color:#58667b;font-size:12px;text-transform:uppercase}tr:last-child td{border:0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid .wide{grid-column:1/-1}label{display:grid;gap:6px;font-weight:600}input,select,textarea{width:100%;padding:10px 11px;border:1px solid #ccd6e4;border-radius:9px;background:#fff;font:inherit}textarea{min-height:80px}.alert{padding:12px 14px;border-radius:10px;margin-bottom:16px}.alert.success{background:#e7f8ed;color:#176b36}.alert.error{background:#ffe8e8;color:#9d2929}.badge{display:inline-block;padding:3px 8px;border-radius:20px;background:#eef3f8}.right{text-align:right}.install{display:grid;place-items:center;min-height:100vh;background:#edf4ff}.install-card{width:min(760px,92vw);background:#fff;padding:32px;border-radius:18px;box-shadow:0 20px 60px #254a7c20}.login{display:grid;place-items:center;min-height:100vh}.login .card{width:min(420px,92vw)}.actions{display:flex;gap:6px;flex-wrap:wrap}.kpi-good{color:#16723a}.kpi-bad{color:#b33636}@media(max-width:900px){aside{position:static;width:auto}.app{margin:0;padding:16px}.grid{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}}
.att-buttons{display:flex;gap:6px;flex-wrap:wrap}.att-choice input{display:none}.att-choice span{display:inline-block;padding:8px 13px;border:1px solid #ccd3dd;border-radius:8px;cursor:pointer}.att-choice input:checked+span{font-weight:700;outline:2px solid currentColor}

.two-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}.two-cols>*{min-width:0}.two-cols .table-wrap table{min-width:0;width:100%}@media(max-width:900px){.two-cols{grid-template-columns:1fr}}

.login-premium{min-height:100vh;background:linear-gradient(135deg,#0e1728 0%,#172a49 48%,#edf4ff 48%,#f7f9fc 100%);padding:24px}
.login-shell{width:min(900px,94vw);min-height:520px;display:grid;grid-template-columns:1.05fr .95fr;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 28px 80px #0c183340}
.login-hero{padding:54px;background:linear-gradient(145deg,#111c30,#1c3c68);color:#fff;display:flex;flex-direction:column;justify-content:center}
.login-logo{width:64px;height:64px;border-radius:18px;background:#fff;color:#1769e0;display:grid;place-items:center;font-size:25px;font-weight:800;margin-bottom:24px}
.login-hero h1{font-size:44px}.login-hero p{color:#bdd0e9;font-size:17px}.login-features{display:grid;gap:12px;margin-top:34px}.login-features span{padding:11px 14px;border:1px solid #ffffff26;border-radius:10px;background:#ffffff0b}
.login-panel{padding:58px 48px;display:flex;flex-direction:column;justify-content:center}.login-panel h2{font-size:30px;margin:0}.login-panel form{display:grid;gap:18px;margin-top:26px}.login-btn{width:100%;padding:13px}
.inline-edit{display:flex;gap:8px;align-items:center}.inline-edit input{min-width:220px}
button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:700px){.login-shell{grid-template-columns:1fr}.login-hero{display:none}.login-panel{padding:34px 24px}}

/* Compact fund summary on daily cashflow */
.fund-summary-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.fund-summary-row .card{padding:10px 12px;border-radius:10px;min-width:0}
.fund-summary-row .metric span{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fund-summary-row .metric b{font-size:16px;margin-top:3px;white-space:nowrap}
.pay-inline{display:flex!important;gap:6px;align-items:center;flex-wrap:nowrap!important}
.pay-inline select{width:auto;min-width:150px}
.admin-unlocked{font-weight:400!important}
#secret-admin-trigger{cursor:default;user-select:none;white-space:nowrap}
.secret-pin-input{width:110px!important;padding:5px 7px!important;border-radius:6px!important;font-size:12px!important}
@media(max-width:1200px){.fund-summary-row{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.fund-summary-row{grid-template-columns:repeat(2,minmax(0,1fr))}}

#secret-note-label{user-select:none;cursor:default}

/* Bố cục 2 hàng x 3 cột cho form Khoản Thu/Chi */
.cash-entry-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:end}
.cash-entry-grid>label{min-width:0;align-self:stretch}
.cash-entry-grid>label>input,.cash-entry-grid>label>select{height:42px}
.cash-entry-grid .money-type{min-height:42px;align-items:center}
.cash-entry-grid .cash-submit-cell{display:flex;gap:8px;align-items:flex-end;min-height:42px;grid-column:2 / span 2;grid-row:2}.cash-entry-grid .cash-date-cell{grid-column:1;grid-row:2}
.cash-entry-grid .cash-submit-cell .btn{height:42px}
@media(max-width:900px){.cash-entry-grid{grid-template-columns:1fr}.cash-entry-grid .cash-submit-cell{align-items:center}}

/* Giao diện gọn hơn */
nav{gap:2px}nav a{padding:8px 12px}.app{padding-top:22px}header{margin-bottom:16px}.toolbar{margin-bottom:11px}.card{padding:14px}.table-wrap+ .table-wrap{margin-top:10px!important}
/* Màu radio Thu / Chi */
.money-type .income-choice input:checked+span{color:#16723a;border-color:#16723a;outline-color:#16723a;background:#f1faf4}
.money-type .expense-choice input:checked+span{color:#d97706;border-color:#d97706;outline-color:#d97706;background:#fff7ed}
/* Chấm công: chia danh sách thành hai bảng song song */
.attendance-two-tables{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.attendance-two-tables .table-wrap{min-width:0}.attendance-table{min-width:0}.attendance-table th,.attendance-table td{padding:9px 10px}.attendance-table td:first-child{width:36%}.attendance-table .att-buttons{flex-wrap:nowrap}.attendance-table .att-choice span{padding:6px 9px}
/* Form Thưởng/Phạt/Ứng: 4 cột hàng 1, 3 cột hàng 2 */
.adjustment-entry-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:10px 12px;align-items:end}.adjustment-entry-grid>label:nth-of-type(-n+4){grid-column:span 3}.adjustment-entry-grid>label:nth-of-type(5),.adjustment-entry-grid>label:nth-of-type(6),.adjustment-entry-grid>.form-submit-cell{grid-column:span 4}.adjustment-entry-grid input,.adjustment-entry-grid select,.adjustment-entry-grid .btn{height:42px}.form-submit-cell{display:flex;align-items:flex-end}.form-submit-cell .btn{width:100%}
/* Chuyển quỹ: 3 cột x 2 hàng */
.transfer-entry-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px;align-items:end}.transfer-entry-grid input,.transfer-entry-grid select,.transfer-entry-grid .btn{height:42px}
@media(max-width:900px){.attendance-two-tables{grid-template-columns:1fr}.adjustment-entry-grid,.transfer-entry-grid{grid-template-columns:1fr}.adjustment-entry-grid>label:nth-of-type(n),.adjustment-entry-grid>.form-submit-cell{grid-column:auto}}

/* Nhận xe */
.receive-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 14px;align-items:end}.receive-form .wide{grid-column:1/-1}.receive-form input,.receive-form select{height:42px}.receive-actions{display:flex;gap:8px}.receive-search{display:flex;gap:8px;align-items:center;margin-left:auto}.receive-search input{width:min(420px,42vw);height:42px}.receive-search .btn{height:42px}.receive-note{max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.receive-card textarea{min-height:90px}@media(max-width:1000px){.receive-form{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.receive-form{grid-template-columns:1fr}.receive-form .wide{grid-column:auto}.receive-search{width:100%;margin-left:0;flex-wrap:wrap}.receive-search input{width:100%}}
/* Chi tiết nhận xe + báo giá động */
.receive-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.receive-summary>div{padding:9px 11px;background:#f8fafc;border-radius:9px}.receive-summary span{display:block;color:#77849a;font-size:12px;margin-bottom:2px}.receive-summary b{font-size:14px}.receive-summary .summary-wide{grid-column:span 2}.quote-card{padding:0;overflow:hidden}.quote-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}.quote-head h3{margin:0}.quote-head p{margin:3px 0 0}.quote-table{min-width:1120px}.quote-table th,.quote-table td{padding:8px}.quote-table input,.quote-table select{height:38px;padding:7px 8px}.quote-table th:first-child,.quote-table td:first-child{width:48px;text-align:center}.quote-table th:nth-child(3){width:120px}.quote-table th:nth-child(4){width:90px}.quote-table th:nth-child(5){width:140px}.quote-table th:nth-child(6){width:140px}.quote-table th:last-child{width:72px}.quote-table tfoot td{background:#f8fafc;font-size:15px}.quote-actions{padding:14px 16px;display:flex;justify-content:flex-end}@media(max-width:900px){.receive-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.receive-summary{grid-template-columns:1fr}.receive-summary .summary-wide{grid-column:auto}.quote-head{align-items:flex-start;flex-direction:column}}

/* Chi tiết nhận xe: compact summary + separated quote action buttons */
.receive-summary{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;margin-bottom:10px;padding:10px 12px}
.receive-summary>div{padding:5px 8px;border-radius:7px;min-width:0}
.receive-summary span{font-size:11px;margin-bottom:1px;line-height:1.15}
.receive-summary b{font-size:13px;line-height:1.25;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.receive-summary .summary-wide{grid-column:span 3}
.quote-head{padding:10px 14px;gap:14px}
.quote-head p{margin:2px 0 0}
.quote-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
@media(max-width:1100px){.receive-summary{grid-template-columns:repeat(4,minmax(0,1fr))}.receive-summary .summary-wide{grid-column:span 2}}
@media(max-width:700px){.receive-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.receive-summary .summary-wide{grid-column:span 2}}
@media(max-width:480px){.receive-summary{grid-template-columns:1fr}.receive-summary .summary-wide{grid-column:auto}.receive-summary b{white-space:normal}.quote-head-actions{width:100%}}

/* Khoản thu/chi: báo rõ khi chưa chọn loại */
.cash-type-field{display:grid;gap:6px;align-self:stretch}.cash-field-label{font-weight:600}.cash-type-error{font-size:12px;font-weight:650;color:#b42318;margin-top:1px}.money-type.money-type-invalid span{border-color:#d92d20;background:#fff4f3}.money-type.money-type-invalid{border-radius:9px;outline:2px solid #fecdca;outline-offset:3px}

/* Chấm công: ngày và hai nút luôn cùng hàng trên màn hình đủ rộng */
.attendance-date-toolbar{flex-wrap:nowrap}.attendance-date-toolbar input[type=date]{width:220px;flex:0 0 220px}.attendance-date-toolbar .btn{white-space:nowrap;flex:0 0 auto}
@media(max-width:560px){.attendance-date-toolbar{flex-wrap:wrap}.attendance-date-toolbar input[type=date]{width:100%;flex:1 1 100%}}

/* Sidebar sáng, dễ quét menu */
aside{background:#f7f9fc;color:#26364d;border-right:1px solid #dfe6ef;box-shadow:5px 0 18px #22364d0a}
.brand{padding-bottom:18px;border-bottom:1px solid #e2e8f0;margin-bottom:8px}
.brand b{color:#173a69}
.brand span{color:#7b899d}
nav{gap:3px;overflow-y:auto;padding-right:2px}
nav a{display:flex;align-items:center;gap:8px;color:#45556c;border:1px solid transparent;transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease}
nav a:hover{background:#edf3fa;color:#173a69;border-color:#dce6f2}
nav a.active{background:#e7f0fb;color:#1557a5;border-color:#c8dbf1;font-weight:700;box-shadow:inset 3px 0 0 #1769e0}
nav a.nav-favorite{color:#273d59;font-weight:650}
nav a.nav-favorite.active{color:#1557a5}
.nav-star{display:inline-grid;place-items:center;width:16px;min-width:16px;color:#d99a00;font-size:13px;line-height:1}
.sidefoot{border-top:1px solid #dfe6ef;color:#708096;background:#f7f9fc}
.sidefoot a{color:#1769e0;font-weight:650}
.admin-unlocked{color:inherit!important}
@media(max-width:900px){aside{box-shadow:none;border-right:0;border-bottom:1px solid #dfe6ef}}
/* Thu chi ngày: THU xanh lá, CHI da cam */
.daily-cash-panel h3{margin:0 0 10px;font-weight:750}
.daily-cash-income h3,.daily-cash-income .daily-cash-amount{color:#15803d}
.daily-cash-expense h3,.daily-cash-expense .daily-cash-amount{color:#d97706}
.daily-cash-income .table-wrap{border-color:#bbdfc8}
.daily-cash-expense .table-wrap{border-color:#f2c99b}
.daily-cash-income th{background:#edf9f1;color:#166534}
.daily-cash-expense th{background:#fff5e8;color:#c45b08}
.daily-cash-amount{font-weight:750}


/* Sidebar vừa phải: dấu sao ở cuối, khoảng cách menu cân đối */
nav{gap:2px}
nav a{padding:7px 10px;min-height:34px;line-height:1.25;gap:7px}
nav a .nav-label{min-width:0;flex:1 1 auto}
.nav-star{margin-left:auto;flex:0 0 16px;width:16px;min-width:16px;font-size:12px}


/* Bộ lọc danh sách: ô tìm kiếm và nút trên cùng một hàng */
.list-search-inline{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
.list-search-inline input[name=q]{width:min(520px,55vw);min-width:260px;flex:0 1 520px;height:42px}
.list-search-inline .btn{height:42px;white-space:nowrap;flex:0 0 auto}
@media(max-width:620px){.list-search-inline{flex-wrap:wrap}.list-search-inline input[name=q]{width:100%;min-width:0!important;flex:1 1 100%}}

/* Bảng lương: tháng + nút Xem cùng hàng */
.payroll-filter{flex-wrap:nowrap}
.payroll-filter input[type=month]{width:190px;flex:0 0 190px;height:42px}
.payroll-filter .btn{height:42px;white-space:nowrap;flex:0 0 auto}
@media(max-width:520px){.payroll-filter{flex-wrap:wrap}.payroll-filter input[type=month]{width:100%;flex:1 1 100%}}

/* Cài đặt khác: mỗi khối chỉ một hàng trên màn hình rộng */
.settings-inline{display:flex;align-items:flex-end;gap:10px;flex-wrap:nowrap}
.settings-inline>label{min-width:0;flex:1 1 0}
.settings-inline input,.settings-inline select,.settings-inline .btn{height:42px}
.settings-inline>div{display:flex;align-items:flex-end;flex:0 0 auto}
.settings-inline>div .btn{white-space:nowrap}
.settings-add-row>label:first-of-type{flex:1.5 1 0}
@media(max-width:1100px){.settings-main-row{flex-wrap:wrap}.settings-main-row>label{flex:1 1 180px}}
@media(max-width:760px){.settings-inline{flex-wrap:wrap}.settings-inline>label{flex:1 1 100%}.settings-inline>div{width:100%}.settings-inline>div .btn{width:100%}}

.salary-month-toolbar{flex-wrap:nowrap;align-items:center}
.salary-month-toolbar input[type=month]{width:190px;flex:0 0 190px;height:42px}
.salary-month-toolbar .btn{height:42px;white-space:nowrap;flex:0 0 auto}
.salary-month-toolbar .muted{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:680px){.salary-month-toolbar{flex-wrap:wrap}.salary-month-toolbar input[type=month]{width:100%;flex:1 1 100%}.salary-month-toolbar .muted{white-space:normal}}

.brand-sub{display:flex;align-items:center;gap:7px;white-space:nowrap}
.brand-sub>span{font-size:12px}
.daily-date-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:nowrap}
.daily-date-toolbar input[type=date]{width:auto;min-width:155px}
.gx-x1{opacity:.5}
.gx-x1[hidden]{display:none!important}
.gx-x2{opacity:.5}

.cash-entry-funds{margin-bottom:12px}
.gx-x1{align-self:end}
.gx-x1 .gx-x2{height:42px;width:100%}


/* Chấm công: trạng thái được chọn dùng viền xanh lá */
.attendance-table .att-choice input:checked+span{color:#16723a;border-color:#16723a;outline:1px solid #16723a;background:#f1faf4}

/* Xem công tháng */
.attendance-month-table .attendance-month-head th{color:#16723a}
.attendance-month-table .attendance-month-total{color:#c62828}

.attendance-month-table .attendance-zero{opacity:.5}


.money-type .income-choice input:checked+span,.money-type .expense-choice input:checked+span{outline:1px solid currentColor!important}

/* GaraX: menu thu gon tren dien thoai */
.gx-menu-toggle,.gx-menu-backdrop{display:none}
@media(max-width:900px){
 body{overflow-x:hidden}
 .gx-menu-toggle{display:inline-flex;position:fixed;right:12px;top:12px;z-index:1002;align-items:center;justify-content:center;gap:7px;background:#1769e0;color:white;border:0;border-radius:9px;padding:9px 12px;font:600 14px Arial,sans-serif;box-shadow:0 3px 15px #0002;cursor:pointer;min-height:40px}
 .gx-menu-toggle span:first-child{font-size:19px;line-height:1}
 aside#gx-sidebar{position:fixed!important;inset:0 auto 0 0!important;width:min(290px,85vw)!important;height:100dvh;z-index:1001;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;transform:translateX(-105%);transition:transform .2s ease;box-shadow:6px 0 25px #0002;border:0;padding:20px 14px;background:#101827}
 .gx-menu-open aside#gx-sidebar{transform:translateX(0)}
 .gx-menu-backdrop{position:fixed;inset:0;background:#0008;z-index:1000}
 .gx-menu-open .gx-menu-backdrop{display:block}
 .gx-menu-open{overflow:hidden}
 .app{margin:0!important;padding:62px 12px 18px!important;width:100%;max-width:100%;min-width:0}
 .app header{padding-right:0}
 .app header h1{font-size:23px}
}
@media(prefers-reduced-motion:reduce){aside#gx-sidebar{transition:none!important}}