/* Important rules in this layer outrank legacy unlayered !important rules.
   Roles describe screen text; there are no rules outside screen media. */
@font-face{font-family:Sarabun;font-style:normal;font-weight:400;font-display:swap;src:url('./sarabun-thai-400-normal-CH-UbWgg.woff') format('woff');unicode-range:U+0E00-0E7F,U+200C-200D,U+25CC}
@font-face{font-family:"TH Sarabun New";font-style:normal;font-weight:400;font-display:swap;src:url('./nb1/THSarabun.ttf') format('truetype')}
@font-face{font-family:Sarabun;font-style:normal;font-weight:400;font-display:swap;src:url('./sarabun-latin-400-normal-DmguIS-7.woff') format('woff');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@layer phasuta-typography {
  @media screen {
    :root {
      --ph-font-family: Sarabun, "TH Sarabun New", "Leelawadee UI", Tahoma, Arial, sans-serif;
      --ph-font-page:22px; --ph-font-heading:16px; --ph-font-item:16px;
      --ph-font-body:14px; --ph-font-label:13px; --ph-font-small:12px;
      --ph-font-control:14px; --ph-font-navigation:14px; --ph-font-status:12px;
      --ph-font-code:13px; --ph-font-metric:22px;
      --ph-weight-page:700; --ph-weight-heading:700; --ph-weight-item:700;
      --ph-weight-body:400; --ph-weight-label:400; --ph-weight-small:400;
      --ph-weight-control:400; --ph-weight-navigation:600; --ph-weight-status:600;
      --ph-weight-code:600; --ph-weight-metric:700;
    }
    html[data-screen-typography] {font-size:16px !important}
    html[data-screen-typography] body {font-size:var(--ph-font-body) !important; font-family:var(--ph-font-family) !important}
    [data-ph-type] {
      font-family:var(--ph-font-family) !important;
      font-size:var(--ph-role-size,var(--ph-font-body)) !important;
      font-weight:var(--ph-role-weight,var(--ph-weight-body)) !important;
      line-height:1.45 !important;
    }
    [data-ph-type="page"]{--ph-role-size:var(--ph-font-page);--ph-role-weight:var(--ph-weight-page)}
    [data-ph-type="heading"]{--ph-role-size:var(--ph-font-heading);--ph-role-weight:var(--ph-weight-heading)}
    [data-ph-type="item"]{--ph-role-size:var(--ph-font-item);--ph-role-weight:var(--ph-weight-item)}
    [data-ph-type="body"]{--ph-role-size:var(--ph-font-body);--ph-role-weight:var(--ph-weight-body)}
    [data-ph-type="label"]{--ph-role-size:var(--ph-font-label);--ph-role-weight:var(--ph-weight-label)}
    [data-ph-type="small"]{--ph-role-size:var(--ph-font-small);--ph-role-weight:var(--ph-weight-small)}
    [data-ph-type="control"]{--ph-role-size:var(--ph-font-control);--ph-role-weight:var(--ph-weight-control)}
    [data-ph-type="navigation"]{--ph-role-size:var(--ph-font-navigation);--ph-role-weight:var(--ph-weight-navigation)}
    [data-ph-type="status"]{--ph-role-size:var(--ph-font-status);--ph-role-weight:var(--ph-weight-status)}
    [data-ph-type="code"]{--ph-role-size:var(--ph-font-code);--ph-role-weight:var(--ph-weight-code);font-variant-numeric:tabular-nums}
    [data-ph-type="metric"]{--ph-role-size:var(--ph-font-metric);--ph-role-weight:var(--ph-weight-metric);font-variant-numeric:tabular-nums}
    [data-ph-type="item"],[data-ph-type="code"],[data-ph-type="metric"]{overflow-wrap:anywhere}
    [data-ph-caption="label"]::after {font-family:var(--ph-font-family)!important;font-size:var(--ph-font-label)!important;font-weight:var(--ph-weight-label)!important}
    :is(input,select,textarea,button)[data-ph-type],a[data-ph-type="control"] {
      min-height:calc(var(--ph-font-control) * 1.45 + 12px) !important;
      max-width:100%; box-sizing:border-box;
    }
    :is(input[type="checkbox"],input[type="radio"])[data-ph-type] {min-height:0 !important}
    /* Keep the hidden native date input from widening the whole page. */
    input.pst-thai-date-native {width:1px!important;min-width:0!important;max-width:1px!important;height:1px!important;min-height:0!important;padding:0!important;border:0!important;clip-path:inset(50%)!important;overflow:hidden!important}
    :is(.org-unit > header,.employee-person,.company-file-identity,.bank-identity) {height:auto !important}
    :is(.org-unit,.panel-head,.system-setting-row,.org-readiness,.employee-person,.item-name,.asset-name) {min-width:0}
    .org-unit > header {min-height:calc(var(--ph-font-body) * 2.9 + 8px)}
    [data-ph-type="status"] {height:auto !important;white-space:normal !important}
    :is(.entry-tabs,.control-tabs,.cost-tabs,.employee-subtabs,.system-category-tabs) {flex-wrap:wrap !important}
    :is(.entry-tabs,.control-tabs,.cost-tabs,.employee-subtabs) button {white-space:normal !important;height:auto !important}
    :is(.section-intro,.panel-head,.org-top-grid,.org-bottom-grid)>* {min-width:0}
    .organization-workspace .org-readiness .panel-head {display:block !important}
    .organization-workspace .org-readiness .panel-head p {max-width:none !important}
    .portal-card {transform:none !important}
    @media(min-width:1101px) {
      .job-register-row {grid-template-columns:110px minmax(140px,8fr) minmax(110px,1fr) minmax(110px,1fr) 100px 105px!important}
    }
    .typography-editor {display:grid;gap:16px}
    .typography-family {display:grid;gap:5px;max-width:360px}
    .typography-table {width:100%;border-collapse:collapse;table-layout:fixed}
    .typography-table :is(th,td) {padding:12px 10px;border-bottom:1px solid #dce3e0;text-align:left;vertical-align:middle}
    .typography-table th {background:#edf4f1}
    .typography-table th:nth-child(1){width:27%}
    .typography-table th:nth-child(2){width:39%}
    .typography-table th:nth-child(3){width:14%}
    .typography-table th:nth-child(4){width:20%}
    .typography-table small {display:block;margin-top:4px}
    .typography-table :is(input,select) {width:100%;min-width:0}
    .typography-sample {display:block;overflow-wrap:anywhere;font-size:var(--ph-preview-size)!important;font-weight:var(--ph-preview-weight)!important;font-family:var(--ph-preview-family)!important;line-height:1.45!important}
    .typography-save-row {display:flex;gap:12px;align-items:end;flex-wrap:wrap}
    .typography-save-row label {display:grid;flex:1 1 360px;gap:6px}
    .typography-save-row input {width:100%}
    .typography-feedback {margin:0;min-height:1.45em;color:#195442}
    .typography-feedback.error {color:#a72828}
    .typography-location-registry {display:grid;gap:12px;margin-top:18px}
    .typography-registry-controls {display:flex;align-items:end;gap:12px;flex-wrap:wrap}
    .typography-registry-controls label {display:grid;gap:5px;min-width:min(280px,100%)}
    .typography-registry-status {margin:0;color:#517078}
    .typography-registry-list {display:grid;gap:7px}
    .typography-registry-row {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px;border:1px solid #d6e0dc;border-radius:7px;background:#fbfcfb;min-width:0}
    .typography-registry-row>div {display:grid;gap:2px;min-width:0}
    .typography-registry-row span,.typography-registry-row small {overflow-wrap:anywhere;color:#546c70}
    @media(max-width:760px) {
      .typography-table :is(thead){display:none}
      .typography-table,.typography-table tbody,.typography-table tr,.typography-table td {display:block;width:100%;box-sizing:border-box}
      .typography-table tr {padding:10px 0;border-bottom:1px solid #ccd8d1}
      .typography-table td {padding:6px 8px;border:0}
      .typography-table td[data-title]::before {content:attr(data-title);display:block;font-size:var(--ph-font-label);margin-bottom:4px}
      .typography-save-row button {flex:1 1 auto}
    }
  }
}