#app .leave-overview{border:1.5px solid #a6b9cf;box-shadow:none;overflow:hidden}
#app .leave-overview>.card-head{background:#fff;border-bottom:1px solid #b6c7db;border-top:4px solid #315b87;gap:12px;padding:20px 22px}
#app .leave-overview .card-head h2{color:#183b61;font-size:20px;font-weight:700}
#app .leave-overview .card-head p{color:#4b6078;font-size:16px;line-height:1.5;margin-top:6px}
#app .leave-overview-caption{font-size:14px;font-weight:500;color:#4b6078;white-space:nowrap}
#app .leave-overview .desktop-table-bar{background:#f5f8fc;color:#4b6078;border-color:#c2cfe0}
#app .leave-overview .desktop-table-scroll{max-height:none;overscroll-behavior:auto}
#app .leave-overview-table{width:100%;table-layout:fixed}
#app .leave-overview-table th,#app .leave-overview-table td{padding:13px 10px!important;white-space:normal;line-height:1.5;vertical-align:middle}
#app .leave-overview-table thead th{background:#e7eef7;color:#244765;font-size:15px;border-bottom:1px solid #b6c7db}
#app .leave-overview-table th:nth-child(1){width:18%}
#app .leave-overview-table th:nth-child(2){width:9%}
#app .leave-overview-table th:nth-child(3){width:8%}
#app .leave-overview-table th:nth-child(4){width:11%}
#app .leave-overview-table th:nth-child(5){width:11%}
#app .leave-overview-table th:nth-child(6){width:19%}
#app .leave-overview-table th:nth-child(7){width:24%}
#app .leave-overview-table th:nth-child(n+2):nth-child(-n+5){text-align:center}
#app .leave-overview-table th:nth-child(n+2):nth-child(-n+4){padding-left:6px!important;padding-right:6px!important}
#app .leave-overview .leave-overview-table thead .desktop-sort{white-space:normal;line-height:1.5;color:inherit;font-size:15px;height:auto;min-height:28px}
#app .leave-overview .leave-overview-table th:nth-child(n+2):nth-child(-n+5) .desktop-sort{justify-content:center;gap:2px}
#app .leave-overview .desktop-sort::after{color:#506b89;margin-left:3px}
#app .leave-overview-table th.leave-head-sick{background:#e6eefb;color:#294e86}
#app .leave-overview-table th.leave-head-personal{background:#e2f0ea;color:#1c6250}
#app .leave-overview-table th.leave-head-vacation{background:#ede7f6;color:#614587}
#app .leave-overview-table tbody tr{background:#fff;opacity:1}
#app .leave-overview-table tbody tr:nth-child(even){background:#f7f9fc}
#app .leave-overview-table tbody td{border-bottom:1px solid #c7d3e2;color:#203f60;font-size:16px}
#app .leave-overview-table tbody tr:last-child td{border-bottom:0}
#app .leave-overview-table .leave-person strong{display:block;font-size:18px;font-weight:700;color:#193b61}
#app .leave-overview-table .leave-person small{display:block!important;margin:3px 0 0!important;color:#50637a;font-size:14px;line-height:1.5}
#app .leave-used,#app .leave-total-cell{text-align:center}
#app .leave-count{display:inline-grid;place-items:center;min-width:34px;height:34px;border-radius:7px;font-weight:700;font-size:18px}
#app .leave-sick{--leave-ink:#294e86;--leave-bg:#e6eefb}
#app .leave-personal{--leave-ink:#1c6250;--leave-bg:#e2f0ea}
#app .leave-vacation{--leave-ink:#614587;--leave-bg:#ede7f6}
#app .leave-count{color:var(--leave-ink);background:var(--leave-bg)}
#app .leave-zero,#app .leave-none{color:#52667d;font-weight:400;font-size:16px}
#app .leave-total{display:inline-flex;align-items:baseline;gap:4px;padding:5px 9px;border-radius:7px;background:#dfe9f7;color:#214e85;font-size:15px;white-space:nowrap}
#app .leave-total b{font-size:18px;font-weight:700}
#app .leave-dates>span{display:block;font-size:16px;overflow-wrap:anywhere}
#app .leave-balance-inline{display:flex;gap:5px;flex-wrap:wrap}
#app .leave-remaining{display:inline-flex;align-items:baseline;gap:5px;background:var(--leave-bg);color:var(--leave-ink);border:1px solid #c5cedb;border-radius:6px;padding:3px 6px;white-space:nowrap;font-size:14px;line-height:1.5}
#app .leave-remaining b{font-size:16px;font-weight:700}
#app .leave-quota-note{padding:12px 20px;border-top:1px solid #b6c7db;background:#f5f8fc;color:#4b6078;font-size:14px;line-height:1.6}
#app .leave-strip{border:1.5px solid #a6b9cf}
#app .leave-strip .ls-item{background:#fff;border-color:#c0cede}
#app .leave-strip .ls-item span,#app .leave-strip .ls-item strong em{color:#4b6078}
#app .leave-strip .ls-item strong{color:#193b61}
#app .leave-strip .ls-today{background:#eef5f3}
@media(max-width:700px){
 #app .leave-overview>.card-head{padding:14px;align-items:flex-start}
 #app .leave-overview .card-head h2{font-size:18px}
 #app .leave-overview .card-head p{font-size:14px}
 #app .leave-overview-caption{display:none}
 #app .leave-overview .table-wrap{overflow:visible}
 #app .leave-overview .leave-overview-table.stack tbody{gap:0;padding:0;display:block}
 #app .leave-overview .leave-overview-table.stack tbody tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px 8px;padding:13px 14px;border:0;border-bottom:1.5px solid #b6c7db;border-radius:0;box-shadow:none}
 #app .leave-overview .leave-overview-table.stack tbody tr:last-child{border-bottom:0}
 #app .leave-overview .leave-overview-table.stack td{display:block!important;min-width:0;padding:0!important;border:0;font-size:16px}
 #app .leave-overview .leave-overview-table.stack td::before{color:#52667d;font-size:14px;line-height:1.5;font-weight:400}
 #app .leave-overview .leave-overview-table.stack .leave-person{grid-column:1/3;grid-row:1}
 #app .leave-overview .leave-overview-table.stack .leave-total-cell{grid-column:3;grid-row:1;text-align:right;align-self:start}
 #app .leave-overview .leave-overview-table.stack .leave-total-cell::before{display:none}
 #app .leave-overview .leave-overview-table.stack .leave-used{text-align:left;grid-row:2}
 #app .leave-overview .leave-overview-table.stack .leave-count{height:28px;min-width:30px;font-size:16px}
 #app .leave-overview .leave-overview-table.stack .leave-dates{grid-column:1/-1;grid-row:3;display:flex!important;align-items:baseline;gap:6px;flex-wrap:wrap}
 #app .leave-overview .leave-overview-table.stack .leave-dates::before{content:'วันที่ลา';display:block}
 #app .leave-overview .leave-overview-table.stack .leave-balance-cell{grid-column:1/-1;grid-row:4;padding-top:7px!important;border-top:1px solid #d0dbe8}
 #app .leave-overview .leave-overview-table.stack .leave-balance-cell::before{content:'คงเหลือทั้งปี';display:block;margin-bottom:4px}
 #app .leave-overview .leave-overview-table.stack td.mobile-row-toggle-cell{display:none!important}
 #app .leave-quota-note{padding:12px 14px}
}