
/* ================================================================
   현장공무 ERP v0.71 FIX4
   Dashboard / navigation / PC / tablet / mobile responsive QA pass
   ================================================================ */

html.erp071-ui {
  --erp071-content-max: 1760px;
}

/* ----- PC consistency ----- */
@media (min-width:1181px) {
  html.erp071-ui .content {
    width:100%;
    max-width:var(--erp071-content-max);
    margin-left:auto;
    margin-right:auto;
  }

  html.erp071-ui .metric-grid {
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
  }

  html.erp071-ui .dashboard-grid,
  html.erp071-ui .dashboard-grid.lower {
    grid-template-columns:minmax(0,1.72fr) minmax(330px,.78fr)!important;
    gap:16px!important;
    align-items:start!important;
  }

  html.erp071-ui .dashboard-grid > *,
  html.erp071-ui .dashboard-grid.lower > * {
    min-width:0;
  }

  html.erp071-ui .erp071-dashboard-chart-grid {
    grid-template-columns:minmax(0,1.35fr) minmax(265px,.65fr);
  }

  html.erp071-ui .alert-list {
    min-height:0!important;
  }

  html.erp071-ui .quick-panel {
    min-height:0;
  }
}

/* ----- tablet / small notebook ----- */
@media (max-width:1180px) and (min-width:761px) {
  html.erp071-ui .metric-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }

  html.erp071-ui .dashboard-grid,
  html.erp071-ui .dashboard-grid.lower {
    grid-template-columns:1fr!important;
    gap:14px!important;
  }

  html.erp071-ui .erp071-dashboard-chart-grid {
    grid-template-columns:minmax(0,1.25fr) minmax(250px,.75fr)!important;
  }

  html.erp071-ui .top-actions {
    min-width:0;
  }

  html.erp071-ui .global-search {
    max-width:270px;
  }
}

/* ----- all widths: links / tables / cards ----- */
html.erp071-ui .content .text-button,
html.erp071-ui .content .round-arrow,
html.erp071-ui .quick-panel button {
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

html.erp071-ui .content .text-button {
  min-height:30px;
  padding:5px 7px;
  border-radius:7px;
}

html.erp071-ui .content .round-arrow {
  min-width:34px;
  min-height:34px;
}

html.erp071-ui .data-table-wrap,
html.erp071-ui .table-wrap,
html.erp071-ui .erp51-doc-table-wrap,
html.erp071-ui .attendance-admin-table,
html.erp071-ui .attendance-history,
html.erp071-ui .erp55-table-wrap,
html.erp071-ui .erp64-table-wrap {
  max-width:100%;
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
}

html.erp071-ui table {
  max-width:100%;
}

/* Dashboard list and chart visual balance */
html.erp071-ui .dashboard-grid .panel,
html.erp071-ui .dashboard-grid.lower .panel,
html.erp071-ui .quick-panel {
  overflow:hidden;
}

html.erp071-ui .alert-row {
  min-width:0;
}

html.erp071-ui .alert-row > div {
  min-width:0;
}

html.erp071-ui .alert-row b,
html.erp071-ui .alert-row span {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* ----- mobile ----- */
@media (max-width:760px) {
  html.erp071-ui,
  html.erp071-ui body {
    width:100%;
    max-width:100%;
    overflow-x:hidden;
    overscroll-behavior-y:none;
  }

  html.erp071-ui body {
    padding-bottom:calc(72px + env(safe-area-inset-bottom,0px));
  }

  html.erp071-ui .app-shell,
  html.erp071-ui .main-panel,
  html.erp071-ui .content {
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }

  html.erp071-ui .topbar {
    width:100%;
    min-height:60px;
    padding:7px 8px 7px 57px!important;
    gap:5px;
  }

  html.erp071-ui .topbar .location {
    flex:0 0 auto;
    min-width:0;
  }

  html.erp071-ui .topbar .location > b {
    max-width:86px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  html.erp071-ui .top-actions {
    flex:1;
    min-width:0;
    justify-content:flex-end;
    gap:5px;
  }

  html.erp071-ui .site-switcher {
    flex:1 1 auto;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:6px 8px!important;
  }

  html.erp071-ui .site-switcher select,
  html.erp071-ui .site-switcher > b {
    width:100%;
    min-width:0;
    max-width:none!important;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  html.erp071-ui .account-chip {
    flex:0 0 38px;
    width:38px;
    height:38px;
    min-width:38px;
    padding:0!important;
  }

  html.erp071-ui .content {
    padding:16px 11px calc(94px + env(safe-area-inset-bottom,0px))!important;
  }

  html.erp071-ui .page-header {
    align-items:stretch!important;
    gap:10px!important;
    margin-bottom:15px!important;
  }

  html.erp071-ui .page-header h1,
  html.erp071-ui .erp59-page-header h1 {
    font-size:21px!important;
    line-height:1.3;
  }

  html.erp071-ui .page-header p,
  html.erp071-ui .erp59-page-header p {
    font-size:10.5px!important;
    line-height:1.55;
  }

  html.erp071-ui .page-header .header-buttons,
  html.erp071-ui .header-buttons {
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px!important;
    width:100%;
  }

  html.erp071-ui .page-header .header-buttons > button,
  html.erp071-ui .header-buttons > button {
    width:100%;
    min-height:42px;
    margin:0!important;
  }

  /* Dashboard: 2x2 summary, then one-column working cards */
  html.erp071-ui .metric-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html.erp071-ui .metric-card {
    min-height:96px;
    padding:12px!important;
  }

  html.erp071-ui .metric-card h2 {
    font-size:17px!important;
    overflow-wrap:anywhere;
  }

  html.erp071-ui .metric-card small {
    font-size:8.5px!important;
  }

  html.erp071-ui .dashboard-grid,
  html.erp071-ui .dashboard-grid.lower {
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:11px!important;
  }

  html.erp071-ui .dashboard-grid > *,
  html.erp071-ui .dashboard-grid.lower > * {
    min-width:0!important;
    width:100%!important;
  }

  html.erp071-ui .dashboard-grid .panel,
  html.erp071-ui .dashboard-grid.lower .panel,
  html.erp071-ui .quick-panel {
    border-radius:12px!important;
  }

  html.erp071-ui .panel-head {
    gap:8px;
    padding-left:13px!important;
    padding-right:13px!important;
  }

  html.erp071-ui .panel-head h2 {
    font-size:13px!important;
  }

  html.erp071-ui .panel-head p {
    font-size:9px!important;
  }

  html.erp071-ui .content .text-button {
    flex:0 0 auto;
    min-height:36px;
    padding:7px 8px;
    font-size:10px;
  }

  /* Dashboard charts */
  html.erp071-ui .erp071-dashboard-chart-grid {
    grid-template-columns:1fr!important;
    gap:9px!important;
    margin:0 11px 12px!important;
  }

  html.erp071-ui .erp071-chart-card {
    padding:12px 11px 10px!important;
  }

  html.erp071-ui .erp071-bar-chart {
    height:132px!important;
    gap:4px!important;
  }

  html.erp071-ui .erp071-bar-value {
    font-size:8px!important;
  }

  html.erp071-ui .erp071-donut-wrap {
    grid-template-columns:104px minmax(0,1fr)!important;
    gap:10px!important;
    min-height:112px!important;
  }

  html.erp071-ui .erp071-donut {
    width:96px!important;
    height:96px!important;
  }

  html.erp071-ui .erp071-donut-center b {
    font-size:11px!important;
  }

  html.erp071-ui .erp071-legend-row {
    grid-template-columns:8px 28px minmax(0,1fr) 34px!important;
    gap:5px!important;
    font-size:9px!important;
  }

  /* Cost/site row */
  html.erp071-ui .site-cost-list {
    padding:0 11px 12px!important;
  }

  html.erp071-ui .cost-row {
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    padding:12px 0!important;
  }

  html.erp071-ui .cost-money {
    text-align:left!important;
  }

  /* Five-person risk list */
  html.erp071-ui .alert-list {
    padding-left:11px!important;
    padding-right:11px!important;
  }

  html.erp071-ui .alert-row {
    grid-template-columns:9px minmax(0,1fr) 36px!important;
    gap:8px!important;
    min-height:54px!important;
    padding:7px 0!important;
  }

  html.erp071-ui .alert-row .round-arrow {
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    min-height:36px!important;
  }

  html.erp071-ui .erp071-alert-pager {
    margin-left:11px!important;
    margin-right:11px!important;
    padding-bottom:8px!important;
  }

  html.erp071-ui .erp071-alert-page-buttons {
    max-width:100%;
    overflow-x:auto;
    scrollbar-width:none;
  }

  html.erp071-ui .erp071-alert-page-buttons::-webkit-scrollbar {
    display:none;
  }

  html.erp071-ui .erp071-alert-page-buttons button {
    min-width:34px!important;
    width:34px;
    height:34px!important;
    flex:0 0 34px;
  }

  /* Recent labor: keep useful columns, allow intentional horizontal swipe */
  html.erp071-ui .dashboard-grid.lower .panel.wide > table {
    display:table;
    width:620px!important;
    min-width:620px!important;
    max-width:none!important;
    margin:0;
  }

  html.erp071-ui .dashboard-grid.lower .panel.wide {
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
  }

  html.erp071-ui .dashboard-grid.lower .panel.wide > .panel-head {
    position:sticky;
    left:0;
    z-index:2;
    min-width:calc(100vw - 22px);
    background:#fff;
  }

  /* Quick tasks */
  html.erp071-ui .quick-panel {
    padding:12px!important;
  }

  html.erp071-ui .quick-panel > h2 {
    margin:2px 0 8px!important;
    font-size:13px!important;
  }

  html.erp071-ui .quick-panel > button {
    min-height:52px!important;
    padding:9px 8px!important;
  }

  /* All list pages */
  html.erp071-ui .record-filter-grid,
  html.erp071-ui .record-filter-grid.without-team,
  html.erp071-ui .erp59-filter-grid,
  html.erp071-ui .erp61-filter-grid,
  html.erp071-ui .erp64-filter-grid,
  html.erp071-ui .erp51-doc-filters {
    grid-template-columns:1fr!important;
  }

  html.erp071-ui .filter-period-field,
  html.erp071-ui .wide {
    grid-column:auto!important;
  }

  html.erp071-ui input:not([type="checkbox"]):not([type="radio"]),
  html.erp071-ui select,
  html.erp071-ui textarea {
    font-size:16px!important; /* prevents iOS auto zoom */
  }

  html.erp071-ui button,
  html.erp071-ui .erp071-fix4-tap-target {
    touch-action:manipulation;
  }

  html.erp071-ui .erp071-pagination {
    margin-bottom:13px!important;
  }

  html.erp071-ui .erp071-page-number,
  html.erp071-ui .erp071-page-nav {
    min-width:38px!important;
    height:38px!important;
  }

  /* Bottom mobile nav / floating buttons do not overlap content */
  html.erp071-ui .erp52-mobile-nav {
    min-height:64px;
    padding-bottom:calc(5px + env(safe-area-inset-bottom,0px))!important;
  }

  html.erp071-ui .erp50-mobile-logout {
    bottom:calc(76px + env(safe-area-inset-bottom,0px))!important;
  }

  html.erp071-ui .erp51-unread-floating {
    bottom:calc(124px + env(safe-area-inset-bottom,0px))!important;
  }

  body.erp-mobile-sidebar-open .sidebar {
    width:min(320px,88vw)!important;
  }
}

/* Very small phones */
@media (max-width:360px) {
  html.erp071-ui .metric-grid {
    grid-template-columns:1fr!important;
  }

  html.erp071-ui .page-header .header-buttons,
  html.erp071-ui .header-buttons {
    grid-template-columns:1fr!important;
  }

  html.erp071-ui .site-switcher > span,
  html.erp071-ui .site-switcher .sync-state {
    display:none;
  }

  html.erp071-ui .erp071-donut-wrap {
    grid-template-columns:92px minmax(0,1fr)!important;
  }
}
