/* 동쪽구름 ERP — mobile.css (모바일 전용 레이아웃: 데스크톱과 별개 셸) */
.mbar{display:none}
.msscrim{display:none}

@media (max-width:760px){
  /* 셸: 사이드바 = 오프캔버스, 상단 앱바 */
  #app{grid-template-columns:1fr}
  .mbar{display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:45;background:#0f1b34;color:#fff;padding:0 14px;height:50px}
  .mbar-burger{background:none;border:none;color:#fff;font-size:23px;cursor:pointer;line-height:1;padding:4px 6px;margin-left:-6px}
  .mbar-title{font-weight:800;font-size:15.5px;letter-spacing:.3px}
  .sidebar{position:fixed;top:0;left:0;height:100vh;width:250px;z-index:60;transform:translateX(-100%);transition:transform .22s ease;box-shadow:4px 0 24px #0007;overflow-y:auto}
  .sidebar.open{transform:translateX(0)}
  .msscrim.on{display:block;position:fixed;inset:0;background:#0009;z-index:55}
  .main{min-height:calc(100vh - 50px)}

  /* 사이드바 메뉴 = 큰 터치 타깃 */
  .menu{padding:13px 12px;font-size:14.5px;gap:11px}
  .menu i{font-size:16px}
  .navlabel{padding:12px 12px 5px;font-size:11px}

  /* 상단 툴바 줄바꿈 */
  .topbar{flex-wrap:wrap;gap:8px;padding:10px 12px}
  .topbar .search{max-width:100%;flex:1 1 100%}
  .period{flex-wrap:wrap}
  .tbtn,.newbtn{min-height:40px}

  /* 대시보드/통계 모바일 */
  .dbscroll{padding:12px 12px 64px}
  .dbkpis{grid-template-columns:1fr 1fr;gap:10px}
  .dbcard{padding:12px 13px}
  .dbcard-v{font-size:23px}
  .dbrow{grid-template-columns:1fr;gap:12px}
  .dbcol-2{grid-column:auto}
  .dbpanel-b{max-height:none}
  .chart-v{height:150px}
  .chart-h .hlab{width:76px}
  .chart-h .hval{width:78px}

  /* ── 목록 표 → 카드 목록 (범용: js/mobile.js 가 td에 data-label 주입) ── */
  .tablewrap{-webkit-overflow-scrolling:touch;overflow:visible}
  table.list{border-collapse:separate}
  table.list thead{position:absolute;left:-9999px;height:0;overflow:hidden}   /* 헤더 숨김(라벨은 카드 안에) */
  table.list, table.list tbody{display:block;width:100%}
  table.list tr{
    display:block;background:var(--card,#fff);border:1px solid var(--line,#e6e9ef);
    border-radius:12px;margin:0 0 10px;padding:10px 13px;box-shadow:0 1px 3px #0000000f;
  }
  table.list tr.sel{outline:2px solid var(--brand,#1d4ed8);outline-offset:-1px}
  table.list tr.overdue{border-left:3px solid #b42222}
  table.list td{
    display:flex;justify-content:space-between;align-items:center;gap:14px;
    padding:6px 0;border:none;text-align:right;min-height:32px;font-size:13.5px;
  }
  table.list td+td{border-top:1px dashed #eef0f4}
  table.list td[data-label]::before{
    content:attr(data-label);flex:0 0 auto;text-align:left;
    font-size:11.5px;font-weight:700;color:var(--mut,#94a3b8);white-space:nowrap;
  }
  table.list td.num{font-weight:700}
  /* 식별행(라벨 없는 첫 셀=번호/이름 등) 크게 */
  table.list td:first-child{font-weight:800;font-size:15px;color:var(--ink,#0f1b34)}
  table.list td:first-child::before{align-self:center}
  /* 체크박스 열은 모바일에서 숨김(대량선택은 데스크톱용) */
  table.list td.c-chk,table.list th.c-chk{display:none}
  /* 액션 버튼 열: 꽉 찬 터치버튼 */
  table.list td.c-act{justify-content:flex-end;flex-wrap:wrap;gap:8px}
  table.list td.c-act .ract,table.list td.c-act button{min-height:38px;padding:0 14px;border-radius:9px}
  /* 빈 상태·합계(colspan) 행 */
  table.list td[colspan]{justify-content:center;text-align:center;font-size:13px;color:var(--mut,#94a3b8)}
  table.list td[colspan]::before{content:""}
  table.list tfoot tr{background:#f8fafc}

  /* 목록 외 넓은 표(equip-table 등)는 가로 스크롤 유지 */
  .tablewrap:has(table:not(.list)){overflow-x:auto}

  /* ── 설치관리(현장) 카드 터치 최적화 ── */
  #inst-app .event-card{border-radius:14px}
  #inst-app .event-actions{gap:8px;flex-wrap:wrap}
  #inst-app .event-actions button{min-height:40px;padding:0 14px;font-size:13.5px}
  #inst-app .inst-mtabs{overflow-x:auto;flex-wrap:nowrap;gap:6px;-webkit-overflow-scrolling:touch}
  #inst-app .inst-mtab{white-space:nowrap;min-height:42px}
  #inst-app .add-fab{width:56px;height:56px;font-size:26px}

  /* ── 렌탈 카드 터치 최적화 ── */
  #rental-app .order-card{border-radius:14px}
  #rental-app .order-card-list{gap:10px}

  /* 임베드 앱: 상단 앱바(50px) 높이만큼 빼서 이중 스크롤 방지 */
  .embed-frame{height:calc(100vh - 50px)}

  /* 상세 드로어 = 전체화면 */
  .drawer{width:100vw;max-width:100vw}
  .ed-panel{width:100%}
  .ed-overlay{padding:0}
  .cf-box{width:92vw}
}

/* 아주 좁은 폰: KPI 1열 */
@media (max-width:430px){
  .dbkpis{grid-template-columns:1fr}
  .dbcard-v{font-size:26px}
}