/* PHIMAI HEALTH | ผู้พัฒนาระบบ : นายวิษณุ เสาะสาย | ตำแหน่ง : เจ้าพนักงานธุรการ */
/* Scoped E-Office layout: use all available content width, keep site navigation. */
body:has(.office-ui) .shell-main{min-width:0;max-width:none}
body:has(.office-ui) #mainContent{width:100%!important;max-width:none!important;margin-inline:0!important;padding-inline:clamp(12px,2vw,32px)!important;box-sizing:border-box}
.office-ui{width:100%!important;max-width:none!important;margin-inline:0!important;min-width:0;box-sizing:border-box;padding:0 0 24px;color:#183c35}
.office-ui *,.office-ui *::before,.office-ui *::after{box-sizing:border-box}
.office-ui .office-hero{width:100%;max-width:none;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:clamp(20px,3vw,36px);border-radius:20px;margin-bottom:24px;background:linear-gradient(120deg,#075c57,#137d70);color:white;box-shadow:0 8px 28px #103e3510}
.office-ui .office-hero>div:first-child{flex:1 1 340px;min-width:0}
.office-ui .office-hero h1{color:inherit;font-size:clamp(1.45rem,2.4vw,2.2rem);line-height:1.5;margin:8px 0;overflow-wrap:anywhere}
.office-ui .office-hero p{margin:0;line-height:1.8;color:#e0f3ed;overflow-wrap:anywhere}
.office-ui .office-eyebrow{font-size:.75rem;letter-spacing:.12em;font-weight:600}
.office-ui .office-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;min-width:0;max-width:100%}
.office-ui .office-actions .btn{white-space:normal;overflow-wrap:anywhere;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.office-ui .office-panel{width:100%;max-width:none!important;min-width:0;padding:clamp(18px,2.4vw,30px);margin-bottom:20px;border:1px solid #dce8e3;border-radius:18px;background:#fff;box-shadow:0 5px 22px #173d3507}
.office-ui .office-panel .row>*{min-width:0}
.office-ui .office-filter{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,300px) auto;align-items:end;gap:16px}
.office-ui :is(input,select,textarea){max-width:100%;min-width:0}
.office-ui :is(.form-control,.form-select){width:100%;min-height:46px;border-radius:11px;line-height:1.6}
.office-ui textarea.form-control{min-height:220px;resize:vertical}
.office-ui label{line-height:1.7;overflow-wrap:anywhere}
.office-ui .office-filter label,.office-ui .office-form .row label{display:block;margin-bottom:6px}
.office-ui .office-detail-title{font-size:clamp(1.25rem,2vw,1.8rem);line-height:1.6;overflow-wrap:anywhere}
.office-ui :is(.office-meta,.office-body,.office-file strong,.office-file small,.office-file-remove){overflow-wrap:anywhere;word-break:normal}
.office-ui .office-body{max-width:100%;line-height:1.9}
.office-ui .office-body :is(img,video,iframe){max-width:100%}
.office-ui .office-metrics{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}
.office-ui .office-metrics>span{padding:10px 16px;background:#edf7f2;border-radius:12px}
.office-ui .office-file{display:flex;align-items:center;gap:16px;min-width:0;padding:16px 0;border-bottom:1px solid #e6eee9}
.office-ui .office-file>.flex-grow-1{flex:1 1 0;min-width:0}
.office-ui .office-file small{display:block;color:#60766c}
.office-ui .office-file form{flex:none;margin:0}
.office-ui .office-file-icon{flex:none;max-width:70px;padding:12px;background:#edf6f1;color:#08685a;border-radius:12px;font-size:.8rem;font-weight:700}
.office-ui .office-file-remove{display:block;padding:8px 0}
.office-ui :is(.table-responsive,.table-wrap,.office-table-wrap){width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.office-ui table{width:100%;margin-bottom:0}
.office-ui th,.office-ui td{vertical-align:middle;padding:14px;line-height:1.7}
.office-ui th{white-space:nowrap}
.office-ui td{overflow-wrap:anywhere}
.office-ui .office-danger summary{cursor:pointer;min-height:44px;line-height:1.8}
@media(min-width:1600px){.office-ui .office-form .row{--bs-gutter-x:2rem}}
@media(max-width:1199.98px){
 .office-ui .office-hero{align-items:flex-start}
 .office-ui .office-hero>.office-actions{flex:1 1 100%}
 .office-ui .office-filter{grid-template-columns:minmax(0,1fr) minmax(180px,240px) auto}
}
@media(max-width:767.98px){
 body:has(.office-ui) #mainContent{padding-inline:12px!important}
 .office-ui .office-hero{border-radius:16px;padding:22px 18px;gap:18px;margin-bottom:18px}
 .office-ui .office-hero>div:first-child{flex-basis:100%}
 .office-ui .office-panel{border-radius:14px;padding:18px 14px}
 .office-ui .office-filter{grid-template-columns:minmax(0,1fr)}
 .office-ui .office-actions>.btn{flex:1 1 150px}
 .office-ui .office-filter>.btn{width:100%;min-height:46px}
 .office-ui .office-file{flex-wrap:wrap;gap:12px}
 .office-ui .office-file form{flex-basis:100%}
 .office-ui .office-file form .btn{width:100%;min-height:46px}
 .office-ui :is(.form-control,.form-select){font-size:16px}
 .office-ui th,.office-ui td{padding:12px}
 .office-ui .office-metrics>span{flex:1 1 130px}
}
@media(max-width:374.98px){.office-ui .office-actions>.btn{flex-basis:100%}.office-ui .office-file-icon{max-width:55px;padding:9px}}

/* office and office-edit render navigation with showSidebar=false. */
body.office-edit-fullwidth .shell-main{margin-left:0!important;margin-inline-start:0!important;width:100%!important;max-width:none!important;min-width:0}
body.office-edit-fullwidth #mainContent{width:100%!important;max-width:none!important;margin-inline:0!important;padding-inline:clamp(12px,2vw,32px)!important}
body.office-edit-fullwidth .office-ui{width:100%!important;max-width:none!important}
@media(max-width:767.98px){body.office-edit-fullwidth #mainContent{padding-inline:12px!important}}
