/* 현장공무 ERP v0.52 - mobile-only usability layer.
   Desktop layout is intentionally untouched. */
.erp52-mobile-nav,.erp52-mobile-menu-button{display:none}

@media (max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
  .app-shell,.main-panel{width:100%;min-width:0!important;max-width:100%;margin-left:0!important}

  /* The original toggle lives inside the transformed drawer on some browsers,
     so an independent trigger is provided outside the sidebar. */
  .sidebar .sidebar-toggle{display:none!important}
  .erp52-mobile-menu-button{
    position:fixed;left:10px;top:calc(10px + env(safe-area-inset-top,0px));z-index:1450;
    display:grid;place-items:center;width:40px;height:40px;border:1px solid #dbe3ec;border-radius:12px;
    background:#fff;color:#263548;box-shadow:0 5px 18px rgba(20,34,52,.16);font-size:20px;font-weight:800;
    -webkit-tap-highlight-color:transparent;touch-action:manipulation
  }
  body.erp-mobile-sidebar-open .erp52-mobile-menu-button{color:#fff;background:#263548;border-color:#263548}

  .topbar{
    min-height:58px;height:auto;padding:7px 10px 7px 58px!important;gap:7px;align-items:center;
    position:sticky;top:0;z-index:850;background:rgba(255,255,255,.96);backdrop-filter:blur(8px)
  }
  .topbar .location{min-width:0;flex:1}
  .top-actions{min-width:0;max-width:100%;gap:5px}
  .site-switcher{min-width:0!important;max-width:min(62vw,290px)!important}
  .site-switcher select,.site-switcher>b{max-width:100%!important;min-width:0;text-overflow:ellipsis}
  .account-chip{min-width:38px;justify-content:center;padding-left:6px;padding-right:6px}

  .content{padding:16px 12px calc(92px + env(safe-area-inset-bottom,0px))!important;min-width:0}
  .page-header{display:flex;flex-direction:column!important;align-items:stretch!important;gap:11px!important;margin-bottom:16px!important}
  .page-header h1{font-size:21px!important;line-height:1.3;margin-bottom:4px}
  .page-header p{font-size:11px!important;line-height:1.55}
  .page-header .header-buttons,.header-buttons{width:100%;display:flex;flex-wrap:wrap;gap:8px}
  .page-header .header-buttons>button,.header-buttons>button{min-height:42px;flex:1 1 auto}

  button,input,select,textarea{font-size:16px}
  button,.nav-item,.attendance-action{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  input:not([type=checkbox]):not([type=radio]),select{min-height:44px}
  textarea{min-height:96px}

  .panel,.metric-card,.attendance-check-card,.attendance-today-card,.erp48-widget,.erp48-metric{border-radius:12px}
  .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{
    grid-template-columns:1fr!important
  }
  .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .metric-card{min-width:0;padding:13px!important}

  .table-wrap,.erp51-doc-table-wrap,.attendance-history,.attendance-admin-table{max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  .full-table{min-width:680px}
  table{font-size:11px}

  .erp48-overlay{padding:0!important;align-items:flex-end!important}
  .erp48-modal{width:100%!important;max-width:none!important;max-height:92dvh!important;border-radius:18px 18px 0 0!important;padding:17px 14px calc(18px + env(safe-area-inset-bottom,0px))!important}
  .erp48-form-grid{grid-template-columns:1fr!important}
  .erp48-form-grid .wide{grid-column:auto!important}

  /* Existing mobile logout remains available without overlapping the navigation. */
  .erp50-mobile-logout{right:12px!important;bottom:calc(78px + env(safe-area-inset-bottom,0px))!important;z-index:1350!important}
  .erp51-unread-floating{bottom:calc(126px + env(safe-area-inset-bottom,0px))!important}

  .erp52-mobile-nav{
    position:fixed;left:0;right:0;bottom:0;z-index:1400;display:grid;
    grid-template-columns:repeat(auto-fit,minmax(64px,1fr));
    padding:5px 7px calc(5px + env(safe-area-inset-bottom,0px));
    background:rgba(255,255,255,.98);border-top:1px solid #dfe5ec;
    box-shadow:0 -7px 24px rgba(25,39,57,.10);backdrop-filter:blur(10px)
  }
  .erp52-mobile-nav button{
    min-width:0;min-height:54px;border:0;border-radius:11px;background:transparent;color:#677386;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:4px 2px;
    font-family:inherit;font-size:10px;font-weight:700;cursor:pointer
  }
  .erp52-mobile-nav button .erp52-nav-icon{font-size:19px;line-height:1.05}
  .erp52-mobile-nav button.active{color:#2166c2;background:#edf4ff}
  .erp52-mobile-nav button:active{transform:translateY(1px)}
  .erp52-mobile-nav button[hidden]{display:none!important}

  body.erp-mobile-sidebar-open{overflow:hidden}
  body.erp-mobile-sidebar-open .sidebar{
    transform:translateX(0)!important;width:min(330px,88vw)!important;height:100dvh!important;
    padding:18px 14px calc(16px + env(safe-area-inset-bottom,0px))!important;z-index:1300!important
  }
  body.erp-mobile-sidebar-open .sidebar nav{overflow-y:auto!important;overflow-x:hidden!important;display:flex!important;flex-direction:column!important}
  body.erp-mobile-sidebar-open .nav-item{width:100%!important;min-height:42px!important}
  body.erp-mobile-sidebar-open .sidebar-mobile-backdrop{
    display:block!important;position:fixed!important;inset:0!important;z-index:1250!important;background:rgba(14,24,38,.48)!important;border:0!important
  }
}

@media (max-width:390px){
  .metric-grid{grid-template-columns:1fr!important}
  .site-switcher{max-width:58vw!important}
  .erp52-mobile-nav{padding-left:4px;padding-right:4px}
  .erp52-mobile-nav button{font-size:9px}
}