@font-face{font-family:LeaveThai;src:url('/assets/logo-studio-thai.ttf') format('truetype');font-display:swap}
@media screen{
html:root{--ink:#183629;--navy:#183629;--muted:#50685b;--line:#d8e4dc;--blue:#287a4e;--lgs-ink:#183629;--lgs-muted:#50685b;--lgs-blue:#287a4e;--lgs-blue-dark:#185c39;--lgs-navy:#183629;--lgs-line:#d8e4dc;--lgs-canvas:#f6f8f7;--lgs-shadow:none;--lgs-radius:18px;--leave-blue:#287a4e;--leave-blue-deep:#185c39;--leave-yellow:#8eaf99;--leave-yellow-soft:#eef7f0;--leave-line:#d8e4dc;--leave-ink:#183629}
html body{font:16px/1.65 LeaveThai,system-ui,sans-serif!important;background:#f6f8f7;color:#183629}body :is(button,input,select,textarea){font-family:inherit;min-height:44px;max-width:100%}body :is(input[type=checkbox],input[type=radio]){min-height:0;accent-color:#287a4e}body :is(input,select,textarea){border-color:#c5d8cb!important;color:#183629;border-radius:10px!important}body :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #287a4e!important;outline-offset:3px}body :is(h1,h2,h3){letter-spacing:0;line-height:1.5}body h1{font-size:29px}body h2{font-size:22px}body :is(.primary,.primary-button,.login-button,.approve,.install-button){background:#287a4e!important;color:#fff!important;box-shadow:none!important;border-radius:10px!important;transform:none}body :is(.primary,.approve,.login-button):hover{background:#185c39!important;filter:none;transform:none}body :is(.outline,.secondary,.staff-detail-button){border-color:#c5d8cb!important;color:#185c39!important;box-shadow:none;background:#fff;border-radius:10px}body :disabled{cursor:not-allowed}
body .auth-screen{background:#f6f8f7!important;padding:32px 20px}body .login-card{background:#fff;border:1px solid #d8e4dc;border-radius:20px;box-shadow:0 8px 24px #18362906!important;width:min(480px,100%);padding:32px;gap:20px}body .login-card h1{font-size:28px}body .login-brand,body .login-card p,body .login-help{color:#50685b;line-height:1.7}body .login-logo{object-fit:contain;box-shadow:none}body .login-card label{font-size:15px}body .login-button{margin-top:8px}
body .app-shell{background:#f6f8f7}body .sidebar{background:#fff;color:#183629;border-right:1px solid #d8e4dc;box-shadow:none}body .sidebar .brand{color:#183629}body .sidebar :is(.company,.brand small){color:#50685b}body .sidebar nav{padding-top:18px}body .sidebar nav button{min-height:48px;color:#385747;border-radius:10px;white-space:normal;line-height:1.6}body .sidebar nav button.active{color:#185c39!important;background:#eef7f0!important;box-shadow:inset 3px 0 0 #4b9766!important}body .sidebar nav button.active span{color:#185c39!important}body .sidebar nav button:hover{background:#f2f7f3}body .workspace>header{background:#fff!important;border-bottom:1px solid #d8e4dc;box-shadow:none;backdrop-filter:none;padding:16px 24px;gap:16px}body .profile{gap:12px;flex-wrap:wrap}body .profile-account{min-width:0;color:#183629}body .profile-account small{color:#50685b}body .avatar{background:#eef7f0;color:#185c39}body :is(.refresh-button,.bell-button,.signout,.menu){background:#fff;color:#385747;border:1px solid #d8e4dc;border-radius:10px;min-width:44px}body .signout{padding:8px 12px}body .workspace>.content{padding:30px clamp(20px,3vw,40px);max-width:1450px;margin:auto;width:100%}body .title-row{gap:20px;flex-wrap:wrap;margin-bottom:24px}body .title-row p{color:#50685b;line-height:1.7}
body :is(.panel,.leave-score-panel,.quota,.stats>article,.stats>div,.settings-overview>article,.report-stats>article){background:#fff;border:1px solid #d8e4dc;border-radius:18px;box-shadow:none!important}body :is(.panel-head,.leave-score-head){padding:22px 24px;border-color:#d8e4dc}body :is(.panel-head h2,.leave-score-head h2){font-size:21px}body :is(.leave-score-head p,.leave-score-head small,.leave-score-head label){color:#50685b}body :is(.stats,.lower-grid,.settings-overview){gap:20px}body :is(.stats>article,.stats>div){padding:22px}body .rings{gap:18px}body .ring{box-shadow:none}body :is(.leave-score-card,.leave-owner-kpis>article,.employee-meta>span,.employee-balance-card,.leave-detail-balance){background:#f8fbf9;border-color:#d8e4dc;box-shadow:none}body :is(.leave-score-table th,.leave-owner-table th,.staff-head,.approval-head,.report-head){background:#f2f6f3;color:#50685b;border-color:#d8e4dc}body :is(.leave-score-table td,.leave-owner-table td){border-color:#e4ece7}body :is(.leave-score-table-wrap,.report-table,.staff-panel,.my-list){border-color:#d8e4dc}body :is(.staff-row,.my-row,.report-row){padding:20px 24px;border-color:#e4ece7;gap:16px}body .staff-filters{gap:12px;margin-bottom:20px}body .staff-search{border-color:#c5d8cb;border-radius:10px;min-height:44px}body .staff-search input{border:0!important;box-shadow:none!important}body .staff-search:focus-within{outline:3px solid #287a4e;outline-offset:2px}body :is(.report-filters,.my-leave-filters){gap:14px;margin-bottom:22px}body :is(.person,.mini-icon.blue-bg,.settings-icon.blue){background:#eef7f0;color:#185c39}
body :is(.my-leave-main,.my-leave-period,.my-leave-status-cell){min-width:0}body .my-leave-reason{color:#385747;line-height:1.7;overflow-wrap:anywhere}body .leave-month-group{margin-bottom:24px;border-color:#d8e4dc}body .leave-month-group>header{background:#f2f6f3;color:#183629}body .empty-list{color:#50685b;padding:32px 20px;line-height:1.7}body .approval-tabs{gap:10px;margin-bottom:20px}body .approval-tabs button{min-height:44px;box-shadow:none}body .approval-reminder{box-shadow:none;background:#fff9eb;border-color:#e4cf9d}body .approval-actions{gap:10px;flex-wrap:wrap}body :is(.approval-actions button,.detail,.attachment-button){min-height:44px}body .detail{color:#185c39;border-color:#c5d8cb}body .calendar{box-shadow:none}body .calendar .today-button{color:#185c39;border-color:#c5d8cb}body .calendar-page-grid{gap:24px}
body .modal-bg{background:#18362966;padding:20px}body .modal{background:#fff;color:#183629;border:1px solid #d8e4dc;border-radius:18px;box-shadow:0 12px 40px #1836291a;padding:28px;max-height:calc(100dvh - 40px)}body .modal h2{font-size:24px}body .close{min-width:44px;min-height:44px;background:#eef7f0;color:#185c39;border-radius:10px;top:16px;right:16px}body .form-row{gap:20px}body .leave-choice-grid{gap:12px}body .leave-choice-field{margin-bottom:22px}body .leave-choice-field :is(button,label){border-color:#d8e4dc;box-shadow:none;border-radius:12px}body .leave-choice-field :is(button,label)[aria-checked=true]{border-color:#287a4e;background:#eef7f0}body :is(.leave-section-heading,.leave-choice-legend){color:#183629}body :is(.leave-choice-help,.leave-date-help,.file-help){color:#50685b;line-height:1.7}body :is(.leave-draft-summary,.confirm-summary,.confirm-summary-grid){background:#f6f9f7;border-color:#d8e4dc;box-shadow:none}body .modal-actions{gap:12px;flex-wrap:wrap;margin-top:24px}body .modal-actions button{min-height:44px}body .detail-grid{gap:16px;overflow-wrap:anywhere}body .employee-summary{padding-right:38px}body .employee-summary h2{overflow-wrap:anywhere}body :is(.employee-meta,.employee-balance-grid){gap:14px}body .employee-history-row{padding:16px;gap:14px}body .leave-detail-drawer{background:#fff;color:#183629;border-left:1px solid #d8e4dc;box-shadow:none}body .leave-detail-head{background:#fff;border-color:#d8e4dc;padding:24px;gap:16px}body .leave-detail-close{min-width:44px;min-height:44px;color:#185c39;background:#eef7f0}body .leave-detail-section{padding:24px;border-color:#d8e4dc}body :is(.leave-detail-request,.leave-detail-policy){border-color:#d8e4dc;background:#f8fbf9}body .leave-detail-request-grid{gap:14px}body .install-app{background:#fff;border-color:#d8e4dc;box-shadow:none}
body #logo-studio-universal-hub-back{position:static!important;transform:none!important;box-shadow:none!important;background:#fff!important;border:1px solid #c5d8cb;border-radius:10px;min-height:44px;padding:9px 12px;font:600 14px/1.5 LeaveThai,system-ui;white-space:normal!important}body #logo-studio-universal-hub-back,body #logo-studio-universal-hub-back *{color:#185c39!important}body .login-card #logo-studio-universal-hub-back{display:flex;justify-content:center;margin-top:18px}
@media(max-width:1050px){body .profile{gap:8px}body .profile-account{max-width:240px}body .staff-filters{grid-template-columns:repeat(2,minmax(0,1fr))}body .staff-search{grid-column:1/-1}}
@media(max-width:760px){body .workspace>header{position:static!important;padding:16px;align-items:flex-start;gap:12px}body .profile{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));flex:1;min-width:0;gap:10px}body .profile-account{grid-column:1/-1;grid-row:1;max-width:none;justify-content:flex-start;text-align:left;width:100%}body .profile-account>span:last-child{display:block!important;min-width:0}body .profile-account strong{white-space:normal;overflow-wrap:anywhere}body .profile .signout,body .profile #logo-studio-universal-hub-back{width:100%;font-size:14px}body .workspace>.content{padding:24px 16px}body h1,body .title-row h1{font-size:25px}body h2{font-size:21px}body :is(.panel-head,.leave-score-head){padding:20px 16px;gap:16px;flex-wrap:wrap}body :is(.stats,.report-stats){grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}body :is(.stats>article,.stats>div){padding:16px;min-width:0}body :is(.stats strong,.stats b){overflow-wrap:anywhere}body :is(.lower-grid,.calendar-page-grid){grid-template-columns:minmax(0,1fr);gap:24px}body .leave-score-head{align-items:stretch;flex-direction:column}body .leave-score-head label{width:100%}body :is(.staff-row,.my-row,.report-row){padding:20px 16px;gap:14px}body .my-row{grid-template-columns:minmax(0,1fr)!important}body :is(.my-leave-status-cell,.my-leave-period){width:100%}body .my-row>button{width:100%}body .staff-filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}body .staff-filters>span{grid-column:1/-1;text-align:left}body .staff-filters select{min-width:0;width:100%}body .report-filters{flex-wrap:wrap}body .report-filters label{flex:1 1 130px;min-width:0}body .approval-actions>*{flex:1 1 110px;white-space:normal}body .approval-reminder{padding:18px 16px}body .modal{padding:24px 18px;max-width:calc(100vw - 24px);width:100%}body .modal-bg{padding:12px}body .modal h2{font-size:22px;padding-right:40px}body .modal .close{top:12px;right:12px}body .form-row{grid-template-columns:minmax(0,1fr);gap:18px}body .leave-choice-grid{grid-template-columns:minmax(0,1fr)!important}body .detail-grid{grid-template-columns:minmax(0,1fr);gap:8px}body .detail-grid>strong,body .detail-grid>div{margin-bottom:12px}body .employee-summary{grid-template-columns:40px minmax(0,1fr);padding-right:30px;gap:12px}body .employee-summary h2{padding-right:0;font-size:21px}body .employee-meta,body .employee-balance-grid{grid-template-columns:minmax(0,1fr)}body .leave-detail-head{padding:20px 16px}body .leave-detail-head>div{min-width:0}body .leave-detail-head h2{font-size:22px;overflow-wrap:anywhere}body .leave-detail-close{flex:0 0 44px}body .leave-detail-section{padding:20px 16px}body .leave-detail-request-grid{grid-template-columns:minmax(0,1fr)}body .modal-actions>button{flex:1 1 110px}body .install-app{margin:16px}}
html body :is(button.primary,.approve,.login-button,.install-button){background:#287a4e!important;box-shadow:none!important}html body :is(button.primary,.approve,.login-button):hover{background:#185c39!important}body #logo-studio-universal-hub-back{z-index:auto!important}body :is(input,select,textarea):focus{box-shadow:none!important}body .leave-choice-field .leave-choice-button.is-selected{background:#eef7f0!important;border-color:#287a4e!important;box-shadow:none!important;color:#185c39}body .leave-choice-check{color:#185c39}body .leave-score-kpis{gap:14px}body .leave-score-kpis article{background:#f8fbf9;border-color:#d8e4dc;padding:16px}body .leave-score-kpis .leave-score-main{background:#eef7f0!important;border-color:#b8d0c0!important}body .leave-score-main b{color:#185c39}body .leave-score-note{color:#50685b;background:#f2f6f3}body .leave-score-head{padding:0 0 12px}body .leave-score-panel{padding:24px}
@media(max-width:760px){body .leave-score-panel{padding:20px 16px}body .leave-score-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}body .leave-score-kpis article{padding:14px;min-width:0}body .leave-score-kpis b{font-size:21px}body .leave-score-kpis small{font-size:13px!important}body .leave-request-modal .modal-actions{position:static;background:#fff;padding:16px 0 0;box-shadow:none}body .leave-request-modal .modal-actions>.primary{flex-basis:100%;order:-1}}
body .workspace>header{height:auto!important;min-height:0}body .medical-no-certificate input{accent-color:#287a4e!important}
body .calm-native-file-input{position:absolute!important;width:1px!important;height:1px!important;min-height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}body .calm-file-picker{display:inline-flex;align-items:center;justify-content:center;width:max-content;max-width:100%;min-height:44px;margin-top:8px;padding:9px 16px;border:1px solid #9ebda8;border-radius:10px;background:#fff;color:#185c39;font-weight:700;cursor:pointer}body .calm-file-picker:hover{background:#eef7f0}body .calm-file-picker:focus-visible{outline:3px solid #287a4e;outline-offset:3px}body .selected-file{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px!important}body .selected-file span{min-width:0;overflow-wrap:anywhere}body .selected-file button{min-width:64px}
body :is(.leave-detail-head,.panel-head,.leave-score-head,.leave-month-group>header){height:auto!important;min-height:0}body .leave-detail-head{align-items:flex-start}body .leave-detail-head>div{min-width:0}body .leave-detail-summary>article{background:#f8fbf9;border-color:#d8e4dc}
@media(max-width:760px){body .leave-detail-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px}body .leave-detail-summary>article{min-width:0;padding:14px}body .leave-detail-summary>article:last-child{grid-column:1/-1;background:#eef7f0;border-color:#b8d0c0}}
@media(max-width:760px){body .leave-score-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}body .leave-owner-table{display:block;min-width:0!important;width:100%}body .leave-owner-table thead{display:none}body .leave-owner-table tbody{display:block}body .leave-owner-table tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:20px 16px;border:1px solid #d8e4dc;border-radius:14px;margin:0 0 16px;background:#fff}body .leave-owner-table td{display:block;min-width:0!important;width:auto!important;max-width:none;border:0;padding:0;white-space:normal;overflow-wrap:anywhere}body .leave-owner-table td::before{content:attr(data-label);display:block;font-size:13px;color:#50685b;margin-bottom:6px}body .leave-owner-table td:first-child,body .leave-owner-table td:nth-child(4),body .leave-owner-table td:nth-child(5),body .leave-owner-table td[colspan]{grid-column:1/-1}body .leave-owner-table td:first-child::before,body .leave-owner-table td[colspan]::before{display:none}body .leave-person-button{padding:0;min-height:44px;width:100%;text-align:left}body .leave-person-button b{font-size:16px;overflow-wrap:anywhere}body .leave-detail-link{min-height:44px;width:100%;white-space:normal;border:1px solid #c5d8cb;border-radius:10px;background:#fff;color:#185c39;margin-top:12px}}
body .staff-field{display:block;min-width:0;width:100%}body .staff-field-caption{display:none}body .staff-field>input,body .staff-field>select{width:100%}
html body .login-logo{width:72px!important;max-width:100%;height:auto;max-height:72px;object-fit:contain;margin:0 auto 16px}
@media(min-width:1280px){body :is(.staff-head,.staff-row){grid-template-columns:minmax(180px,1.4fr) minmax(90px,.8fr) minmax(145px,1fr) minmax(100px,1fr) minmax(104px,.9fr) 80px 84px;gap:16px;padding-inline:24px}body .staff-field input[type=date]{padding-inline:10px}}
@media(min-width:761px) and (max-width:1279px){body .staff-head{display:none}body .staff-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}body .staff-name{grid-column:1/-1}body .staff-field-caption{display:block;color:#50685b;font-size:13px;font-weight:500}body .staff-field{display:grid;gap:6px}}
@media(max-width:1180px){body .staff-field{display:grid;gap:6px}body .staff-field-caption{display:block;color:#50685b;font-size:13px;font-weight:500}body .staff-name>div{width:100%}}
body .calendar .today-button{background:#eef7f0;color:#185c39}body .week .today{background:#287a4e}body .month-leave-row strong{overflow-wrap:anywhere}
@media(max-width:760px){body .calendar-page-grid{margin:0}body .calendar .week{min-width:0!important;width:100%;grid-template-columns:repeat(7,minmax(0,1fr));padding:0 8px}body .calendar .week>*{min-width:0;font-size:13px}body .full-calendar .week>*,body .full-calendar .week .today{height:48px}body .calendar .week>b{height:36px}body .calendar .week .today{max-width:100%}body .calendar .legend{flex-wrap:wrap;gap:8px;padding:18px 12px;line-height:1.7}body .calendar .panel-head>div{display:flex;flex-wrap:wrap;gap:8px}body .calendar .panel-head button{min-width:44px;margin:0}body .full-calendar .week .holiday-label{font-size:11px!important;bottom:2px;left:1px;right:1px}body .month-leave-row{padding:18px 16px;gap:12px}}
body :is(.settings-overview strong,.report-stats strong,.staff-count strong){color:#185c39}body .approval-tabs button.active{background:#eef7f0;color:#185c39;border-color:#9ebda8}body .approval-tabs button.active b{background:#287a4e}body .report-filters label{min-width:0}body .report-filters select{width:100%;min-width:0}
@media(max-width:760px){body .approval-row>.when{display:grid;gap:6px}body .approval-row>:is(.pending,.approved,.rejected){display:block;justify-self:start;white-space:normal}body .approval-row .approval-actions>.detail{display:inline-flex;align-items:center;justify-content:center}body .approval-row .approval-actions{gap:10px}body .report-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}body .report-filters label{width:100%}body .report-filters select{padding-left:10px;padding-right:24px}}
@media(max-width:760px){body .report-row>:is(.pending,.approved,.rejected){display:block;justify-self:start;white-space:normal}}
@media(max-width:360px){body .report-filters{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){body *{scroll-behavior:auto!important;transition:none!important}}
}