/* 현장공무 ERP v0.58 - PC / tablet / mobile responsive optimization layer.
   Existing feature logic is intentionally untouched. */
:root{
  --erp58-content-max:1760px;
  --erp58-radius:14px;
  --erp58-touch:42px;
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
.content{
  width:100%;
  max-width:var(--erp58-content-max);
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}
.panel,.metric-card,.attendance-check-card,.attendance-today-card,
.erp48-widget,.erp48-metric,.erp53-cost-panel{
  min-width:0;
}
.page-header h1{line-height:1.22}
.page-header p{max-width:960px}
button,input,select,textarea{font-family:inherit}
button{min-height:38px}
input:not([type=checkbox]):not([type=radio]),select{min-height:40px}
textarea{resize:vertical}
.table-wrap,.erp51-doc-table-wrap,.erp55-table-wrap,.attendance-history,.attendance-admin-table{
  width:100%;max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;
}
.table-wrap table,.erp51-doc-table-wrap table,.erp55-table-wrap table,.attendance-history table,.attendance-admin-table table{
  width:100%;
}
.table-wrap thead th,.erp51-doc-table-wrap thead th,.erp55-table-wrap thead th,.attendance-history thead th,.attendance-admin-table thead th{
  position:sticky;top:0;z-index:2;background:#f7f9fc;
}
.full-table tbody tr:hover,.erp55-table-wrap tbody tr:hover,.erp51-doc-table-wrap tbody tr:hover{background:#f8fbff}
.erp48-modal,.erp55-modal{
  box-sizing:border-box;
  width:min(1040px,calc(100vw - 48px));
  max-height:min(90dvh,920px);
  overflow:auto;
}
.erp55-contract-cost-grid,.erp56-summary-grid,.erp53-form-grid,.erp51-cost-inputs,.erp51-cost-totals{
  min-width:0;
}
.erp55-contract-cost-grid>* ,.erp56-summary-grid>* ,.erp53-form-grid>* ,.erp51-cost-inputs>* ,.erp51-cost-totals>*{min-width:0}

/* Large desktop: use horizontal space but keep forms readable. */
@media (min-width:1440px){
  .content{padding-left:32px!important;padding-right:32px!important}
  .page-header{gap:18px}
  .erp48-modal,.erp55-modal{width:min(1120px,calc(100vw - 80px))}
  .erp55-contract-cost-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .erp56-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}

/* Notebook / tablet landscape. */
@media (min-width:761px) and (max-width:1180px){
  .content{padding:24px 20px!important}
  .page-header{gap:12px!important}
  .erp48-modal,.erp55-modal{width:min(920px,calc(100vw - 32px));max-height:92dvh}
  .erp55-contract-cost-grid,.erp56-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .erp53-form-grid,.erp51-cost-inputs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .erp55-table-wrap,.table-wrap{border-radius:12px}
}

/* Mobile */
@media (max-width:760px){
  :root{--erp58-touch:46px}
  html,body,#root{width:100%;max-width:100%;min-width:0}
  body{font-size:14px;padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}
  .main-panel,.content{min-width:0!important;max-width:100%!important}
  .content{padding:12px 10px calc(96px + env(safe-area-inset-bottom,0px))!important}

  .topbar{
    min-height:60px!important;height:auto!important;padding:8px 8px 8px 56px!important;
    flex-wrap:wrap!important;row-gap:6px!important;column-gap:6px!important;
  }
  .topbar .location{min-width:0;max-width:100%}
  .topbar .location>*{min-width:0}
  .top-actions{width:100%!important;max-width:100%!important;display:flex!important;gap:6px!important}
  .site-switcher{flex:1 1 190px!important;max-width:none!important;min-width:0!important}
  .site-switcher select,.site-switcher>b{max-width:100%!important;width:100%;text-overflow:ellipsis;overflow:hidden}
  .account-chip{flex:0 0 auto!important}

  .page-header{margin-bottom:14px!important;gap:8px!important}
  .page-header h1{font-size:20px!important;letter-spacing:-.5px!important;word-break:keep-all}
  .page-header p{font-size:11px!important;line-height:1.5;margin:0}
  .page-header .header-buttons,.header-buttons{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));width:100%!important;gap:7px!important}
  .page-header .header-buttons>button,.header-buttons>button,.page-header>button{width:100%!important;min-height:var(--erp58-touch)!important;margin:0!important}

  button,input:not([type=checkbox]):not([type=radio]),select{min-height:var(--erp58-touch)!important}
  input,select,textarea{font-size:16px!important;max-width:100%;box-sizing:border-box}
  textarea{min-height:92px!important}
  label{word-break:keep-all}

  .panel,.metric-card,.attendance-check-card,.attendance-today-card,.erp53-cost-panel{
    border-radius:12px!important;max-width:100%;overflow:hidden;
  }
  .panel{padding-left:12px!important;padding-right:12px!important}
  .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .metric-card{padding:12px!important;min-height:88px!important}
  .metric-card b,.metric-card strong{font-size:clamp(16px,5vw,22px)}

  .dashboard-grid,.dashboard-grid.lower,.settings-grid,.education-summary,.labor-summary,.report-cards,
  .progress-summary.linked-summary,.linked-cost-grid,.progress-category-grid,.vendor-grid,.form-grid,.single-form-grid,
  .user-create-grid,.erp55-contract-cost-grid,.erp56-summary-grid,.erp53-form-grid,.erp51-cost-inputs,.erp51-cost-totals,
  .erp48-contract-metrics,.erp55-bulk-summary{
    grid-template-columns:1fr!important;
  }

  .erp48-attendance-tabs,.erp53-subtabs{
    display:flex!important;max-width:100%;overflow-x:auto!important;flex-wrap:nowrap!important;gap:6px!important;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px;
  }
  .erp48-attendance-tabs::-webkit-scrollbar,.erp53-subtabs::-webkit-scrollbar{display:none}
  .erp48-attendance-tabs>*,.erp53-subtabs>*{flex:0 0 auto!important;white-space:nowrap;min-height:42px!important}

  .table-wrap,.erp51-doc-table-wrap,.erp55-table-wrap,.attendance-history,.attendance-admin-table{
    margin-left:0!important;margin-right:0!important;border-radius:10px;overflow-x:auto!important;
    box-shadow:inset -12px 0 12px -16px rgba(15,23,42,.35);
  }
  .full-table,.erp55-table-wrap table,.erp51-doc-table-wrap table{min-width:720px!important;font-size:11px!important}
  .full-table th,.full-table td,.erp55-table-wrap th,.erp55-table-wrap td,.erp51-doc-table-wrap th,.erp51-doc-table-wrap td{
    padding:9px 8px!important;white-space:nowrap;
  }
  .table-wrap thead th,.erp51-doc-table-wrap thead th,.erp55-table-wrap thead th{top:0}

  .erp48-overlay,.erp55-overlay{padding:0!important;align-items:flex-end!important}
  .erp48-modal,.erp55-modal{
    width:100%!important;max-width:none!important;max-height:94dvh!important;margin:0!important;
    border-radius:18px 18px 0 0!important;padding:14px 12px calc(18px + env(safe-area-inset-bottom,0px))!important;
    overflow:auto!important;
  }
  .erp48-modal-head,.erp55-modal-head{
    position:sticky;top:-14px;z-index:8;background:#fff;padding-top:12px;padding-bottom:10px;margin-top:-12px;
  }
  .erp48-form-grid{grid-template-columns:1fr!important}
  .erp48-form-grid .wide{grid-column:auto!important}
  .erp55-upload-actions,.erp51-doc-actions,.erp51-alert-actions{
    display:grid!important;grid-template-columns:1fr!important;gap:7px!important;
  }
  .erp55-upload-actions button,.erp51-doc-actions button,.erp51-alert-actions button{width:100%!important}

  .erp52-mobile-menu-button{width:44px!important;height:44px!important;left:8px!important;top:calc(8px + env(safe-area-inset-top,0px))!important}
  .erp52-mobile-nav{padding:5px 5px calc(5px + env(safe-area-inset-bottom,0px))!important}
  .erp52-mobile-nav button{min-height:56px!important;border-radius:10px!important;font-size:10px!important}
  .erp52-mobile-nav button .erp52-nav-icon{font-size:20px!important}
  body.erp-mobile-sidebar-open .sidebar{width:min(340px,90vw)!important}
  body.erp-mobile-sidebar-open .nav-item{min-height:46px!important;font-size:13px!important;padding:11px 12px!important}
  body.erp-mobile-sidebar-open .nav-group-title{font-size:11px!important;min-height:38px}

  .erp50-mobile-logout{bottom:calc(80px + env(safe-area-inset-bottom,0px))!important}
  .erp51-unread-floating{left:10px!important;right:10px!important;width:auto!important;bottom:calc(132px + env(safe-area-inset-bottom,0px))!important}

  .leaflet-container,.attendance-map-canvas{max-width:100%!important;height:min(52dvh,360px)!important}
}

@media (max-width:390px){
  .content{padding-left:8px!important;padding-right:8px!important}
  .metric-grid{grid-template-columns:1fr!important}
  .page-header .header-buttons,.header-buttons{grid-template-columns:1fr!important}
  .top-actions{flex-wrap:wrap!important}
  .site-switcher{flex-basis:100%!important}
  .erp52-mobile-nav button{font-size:9px!important}
}

@media (orientation:landscape) and (max-height:520px) and (max-width:900px){
  .erp48-modal,.erp55-modal{max-height:96dvh!important;border-radius:12px!important}
  .erp52-mobile-nav button{min-height:48px!important}
  .content{padding-bottom:76px!important}
}
