/* ============================================================
   v2 desktop canvas (P0-d) — @media (min-width: 768px)
   index.html이 media 속성으로도 거르지만, 파일만 따로 링크돼도 안전하게 한 번 더 감싼다.
   ============================================================ */
@media (min-width: 768px) {
  .app {
    grid-template-columns: var(--side-w) minmax(0, 1fr);
    grid-template-areas: "side main";
  }
  .sidebar { display: flex; }
  .topbar  { display: flex; }
  .m-header, .tabbar { display: none !important; }

  /* 모바일 전용 요소 숨김 */
  .m-only { display: none !important; }

  /* PC 대시보드 2단(달력 70% / 패널 30%) — D1이 채운다 */
  .two { display: grid; grid-template-columns: minmax(0, 7fr) minmax(300px, 3fr); gap: 12px; align-items: start; }
  .two > .day-panel { position: sticky; top: calc(var(--topbar-h) + 12px); }
}

@media (min-width: 768px) and (max-width: 1100px) {
  .kpi-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .two { grid-template-columns: minmax(0, 1fr); }
  .two > .day-panel { position: static; }
}

/* 대시보드 카드 - 좁은 PC 폭에서는 한 열 (D2) */
@media (min-width: 768px) and (max-width: 1100px) {
  .dcards { grid-template-columns: minmax(0, 1fr); }
}

/* ============================================================
   일보 PC (R1) — 섹션 카드 · 표 · 배지 · 합계 바 · 노무 그룹
   색은 토큰만. 카테고리: 장비 navy · 노무 amber · 자재 green · 경비 gray · 외주 navy-2
   ============================================================ */
@media (min-width: 768px) {
  .daily-pc { display: flex; flex-direction: column; gap: 12px; min-width: 0; }

  /* 날짜 바 (R2가 uiDailyDateBar()로 채운다 — 지금은 최소 동작) */
  .daily-datebar {
    background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card);
    padding: 8px 12px;
  }
  .db-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
  .db-date { width: 148px; min-height: 30px; padding: 3px 8px; }
  .db-dow { font-weight: var(--fw-extra); }
  .db-weather { color: var(--mute); font-size: var(--fs-sm); }
  .db-total { margin-left: auto; font-weight: var(--fw-semi); color: var(--ink-2); }
  .db-total .sep { margin: 0 8px; color: var(--faint); }
  .db-total [data-tone="up"] { color: var(--green); }
  .db-total [data-tone="down"] { color: var(--red); }
  /* 날짜 바 (R2) */
  .db-dow[data-dow="0"] { color: var(--red); }
  .db-dow[data-dow="6"] { color: var(--blue); }
  .db-text { width: 104px; min-height: 30px; padding: 3px 8px; }
  .db-text[aria-invalid="true"] { border-color: var(--red); box-shadow: 0 0 0 3px var(--red-soft); }
  .db-status { width: 78px; min-height: 30px; padding: 3px 6px; font-weight: var(--fw-semi); }
  .db-status[data-status="rain"] { background: var(--blue-soft); color: var(--blue-ink); }
  .db-status[data-status="off"] { background: var(--red-soft); color: var(--red-ink); }
  .db-actions { display: flex; align-items: center; gap: 6px; }
  .db-tools { position: relative; }
  .db-menu {
    position: absolute; right: 0; top: calc(100% + 4px); z-index: var(--z-dropdown);
    min-width: 180px; padding: 4px;
    background: var(--card); border: 1px solid var(--line); border-radius: var(--r-btn); box-shadow: var(--sh-lg);
  }
  .db-menu[hidden] { display: none; }

  /* 섹션 카드 — 머리글 고정(.tbl-sticky)이 페이지 스크롤에 붙도록 overflow를 풀고 모서리는 자식에 준다 */
  .daily-secs { display: flex; flex-direction: column; gap: 12px; }
  .daily-sec { overflow: visible; position: relative; }
  .daily-sec .section-head { background: var(--card); border-radius: var(--r-card) var(--r-card) 0 0; flex-wrap: wrap; }
  .daily-sec[data-collapsed="true"] .section-head { border-bottom: 0; border-radius: var(--r-card); }
  .daily-sec[data-collapsed="true"] .section-body { display: none; }
  .daily-sec[data-collapsed="true"] .sec-chev { transform: rotate(-90deg); }
  .daily-sec.is-dragging { opacity: .45; }
  .daily-sec.drop-before::before, .daily-sec.drop-after::after {
    content: ""; position: absolute; left: 0; right: 0; height: 3px; border-radius: 3px; background: var(--blue); z-index: 2;
  }
  .daily-sec.drop-before::before { top: -8px; }
  .daily-sec.drop-after::after { bottom: -8px; }

  .sec-grip { display: inline-flex; align-items: center; color: var(--faint); cursor: grab; padding: 4px 2px; margin-left: -6px; }
  .sec-grip:hover { color: var(--mute); }
  .sec-grip:active { cursor: grabbing; }
  .sec-tgl { display: inline-flex; align-items: center; gap: 6px; padding: 2px 4px; border-radius: var(--r-md); font-size: var(--fs-md); font-weight: var(--fw-extra); color: var(--ink); }
  .sec-tgl:hover { background: var(--surface-2); }
  .sec-chev { display: inline-flex; color: var(--mute); transition: transform var(--dur) var(--ease); }
  .sec-sum { margin-left: 4px; font-size: var(--fs-base); font-weight: var(--fw-extra); color: var(--ink); }
  .daily-sec .section-sub:empty { display: none; }
  .daily-sec .section-tools .btn { color: var(--mute); }
  .daily-sec .section-tools .btn:hover { color: var(--ink); }

  .sec-note { padding: 8px 14px 0; }
  .sec-note textarea { min-height: 52px; }
  .sec-foot {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    padding: 8px 14px; border-top: 1px solid var(--row-line);
    border-radius: 0 0 var(--r-card) var(--r-card);
  }
  .sec-foot .chk { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: var(--fs-sm); color: var(--mute); cursor: pointer; }

  /* 표 */
  .daily-tbl-wrap { overflow: visible; }
  .daily-tbl { table-layout: fixed; }
  .daily-tbl th { top: var(--topbar-h); }
  .daily-tbl td { padding: 4px 6px; }
  .daily-tbl .empty-row td { padding: 14px; text-align: center; color: var(--mute); }
  .daily-tbl input.cell, .daily-tbl select.cell { min-height: 30px; }
  .daily-tbl input[type=number]::-webkit-outer-spin-button,
  .daily-tbl input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
  .daily-tbl input[type=number] { -moz-appearance: textfield; appearance: textfield; }
  .daily-tbl td.cum { font-size: var(--fs-xs); line-height: 1.3; color: var(--mute); }
  .daily-tbl td.cum span, .daily-tbl td.cum b { display: block; white-space: nowrap; }
  .daily-tbl td.cum b { color: var(--navy-ink); font-weight: var(--fw-semi); }
  .daily-tbl td.amount-cell { font-weight: var(--fw-semi); white-space: nowrap; }
  .daily-tbl td.amount-cell span[id^="pw-"] { display: block; font-size: var(--fs-2xs); font-weight: var(--fw-extra); color: var(--red); }
  .btn.row-del { border-color: transparent; color: var(--faint); }
  .btn.row-del:hover { color: var(--red); background: var(--red-soft); }
  .btn.has-receipt { color: var(--green); }
  /* 장비 정산 상세(기사·차량·시간·유류) — 행 아래 펼침 줄. 값이 있으면 버튼 색으로 표시 */
  .daily-tbl .eq-acts { white-space: nowrap; }
  .btn.eq-detail-btn { border-color: transparent; color: var(--faint); }
  .btn.eq-detail-btn.has-detail { color: var(--navy-ink); }
  .btn.eq-detail-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
  .daily-tbl tr.eq-detail[hidden] { display: none; }
  .daily-tbl tr.eq-detail > td { padding: 2px 8px 8px 22px; background: var(--surface-2); }
  .eq-detail-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px 10px; }
  .eq-df { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-xs); color: var(--mute); font-weight: var(--fw-semi); }
  .btn-danger-ghost { color: var(--red); }
  .btn-danger-ghost:hover { background: var(--red-soft); border-color: var(--red); }

  /* 작업량 */
  .daily-tbl .wk-name { font-weight: var(--fw-semi); padding-left: 14px; }
  .daily-tbl tr.is-hist td { opacity: .55; }
  .daily-tbl tr.wk-hdr td { background: var(--surface-2); font-weight: var(--fw-bold); }
  .daily-tbl td.wk-hname { padding-left: calc(8px + (var(--lv, 1) - 1) * 14px); }
  .daily-tbl td.wk-acc { color: var(--navy-ink); }
  .daily-tbl td.wk-prog { font-size: var(--fs-xs); }
  .daily-tbl td.wk-prog .is-done { color: var(--green); font-weight: var(--fw-bold); }
  .prog-bar { height: 4px; border-radius: 4px; background: var(--gray-soft); overflow: hidden; margin-top: 3px; }
  .prog-fill { height: 100%; background: var(--navy); border-radius: 4px; }

  /* 노무 직종 그룹 */
  .daily-tbl tr.grp-row td { padding: 0; background: var(--amber-soft); border-top: 2px solid var(--line); }
  .grp-head { display: flex; align-items: center; gap: 8px; padding: 5px 10px; }
  .grp-name { font-weight: var(--fw-extra); font-size: var(--fs-base); color: var(--amber-ink); border-bottom: 1px dashed var(--amber-ink); padding: 0 2px; }
  .grp-edit { width: 140px; min-height: 28px; font-weight: var(--fw-bold); }
  .grp-cnt { color: var(--mute); font-size: var(--fs-xs); }
  .grp-sub { margin-left: auto; color: var(--amber-ink); font-weight: var(--fw-extra); }
  .daily-tbl td.lb-name { padding-left: 18px; }
  .jj-add { margin: 8px 14px; padding: 8px 10px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-lg); }
  .jj-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
  .jj-chip { display: inline-flex; width: auto; min-height: 26px; }
  .jj-sep { font-size: var(--fs-2xs); color: var(--mute); margin-bottom: 5px; }
  .jj-row { display: flex; align-items: center; gap: 6px; }
  .jj-row .input { flex: 1; }

  /* 배지 칸 (이름·항목·거래처 선택) */
  .item-cell { min-width: 0; }
  .item-tag {
    display: flex; align-items: center; min-height: 28px; padding: 3px 8px;
    border: 1px solid transparent; border-radius: var(--r-md);
    background: var(--navy-soft); color: var(--navy-ink);
    font-size: var(--fs-tbl); font-weight: var(--fw-semi);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer;
  }
  .item-tag:hover { border-color: var(--border-strong); }
  .item-tag:focus-visible { outline: none; box-shadow: var(--focus-ring); }
  .item-tag.empty { background: transparent; border: 1px dashed var(--line); color: var(--mute); font-weight: var(--fw-regular); }
  #sec-card-labor .item-tag:not(.empty) { background: var(--amber-soft); color: var(--amber-ink); }
  #sec-card-mat .item-tag:not(.empty) { background: var(--green-soft); color: var(--green-ink); }
  #sec-card-expense .item-tag:not(.empty) { background: var(--gray-soft); color: var(--gray-ink); }
  .item-tag[data-invalid] { background: var(--red-soft); color: var(--red-ink); border-color: var(--red); }
  .item-tag.empty[data-invalid] { background: var(--red-soft); border: 1px dashed var(--red); color: var(--red-ink); }

  /* 배지 드롭다운 (전역 1개) */
  .badge-dd { position: fixed; display: flex; flex-direction: column; width: 248px; max-height: 320px; padding: 0; overflow: hidden; z-index: var(--z-popover); }
  .badge-dd-head { padding: 6px; border-bottom: 1px solid var(--line); }
  .badge-dd-head .input { min-height: 30px; }
  .badge-dd-list { overflow-y: auto; padding: 4px; min-height: 0; }
  .badge-dd-item .bd-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--fw-semi); }
  .badge-dd-item .bd-del { display: inline-flex; padding: 2px; border-radius: var(--r-sm); color: var(--faint); }
  .badge-dd-item .bd-del:hover { color: var(--red); background: var(--red-soft); }
  .badge-dd-item.is-clear { color: var(--red); }
  .badge-dd-item.is-sim { border-top: 1px dashed var(--amber); }
  .badge-dd-item .bd-hint { font-size: var(--fs-2xs); color: var(--amber-ink); }
  .badge-dd-item.is-add { color: var(--blue); font-weight: var(--fw-semi); }
  /* 공종(내역 항목) 연결 — 행 이름 칸 아래 작은 칩, 선택 사항 */
  .bl-chip { display: block; max-width: 100%; margin-top: 2px; padding: 0 6px; height: 16px; line-height: 16px; border: 0; border-radius: var(--r-sm); background: transparent;
             font-size: var(--fs-2xs); font-weight: var(--fw-regular); color: var(--faint); text-align: left; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .bl-chip:hover { background: var(--surface-2); color: var(--mute); }
  .bl-chip:focus-visible { outline: none; box-shadow: var(--focus-ring); }
  .bl-chip[data-state="set"] { background: var(--navy-soft); color: var(--navy-ink); font-weight: var(--fw-semi); }
  .bl-chip[data-state="gone"] { background: var(--red-soft); color: var(--red-ink); font-weight: var(--fw-semi); }
  .bl-dd { width: 320px; }
  .badge-dd-sec { padding: 6px 8px 2px; font-size: var(--fs-2xs); font-weight: var(--fw-semi); color: var(--amber-ink); }
  .badge-dd-sub { padding: 6px 8px 2px; font-size: var(--fs-2xs); font-weight: var(--fw-semi); color: var(--mute); border-top: 1px solid var(--line); margin-top: 2px; }
  .badge-dd-item.is-current { font-weight: var(--fw-bold); background: var(--surface-2); }
  .badge-dd-item.bl-auto { color: var(--mute); }
  .badge-dd-empty { padding: 12px 8px; font-size: var(--fs-sm); text-align: center; color: var(--mute); }

  /* 작업내용 */
  .wc-wrap { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; }
  .wc-memo { min-height: 96px; }
  .wc-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
  .wc-mic-status { font-size: var(--fs-xs); color: var(--mute); }
  .wc-photos { display: flex; flex-wrap: wrap; gap: 6px; }
  .wc-photos:empty { display: none; }
  .wc-photos img { width: 56px; height: 56px; object-fit: cover; border-radius: var(--r-lg); border: 1px solid var(--line); cursor: pointer; }
  .photo-add-form { display: flex; flex-direction: column; gap: 10px; }

  /* 하단 합계 바 */
  .daily-totbar {
    position: sticky; bottom: 0; z-index: var(--z-sticky);
    display: flex; align-items: stretch; gap: 0; flex-wrap: wrap;
    background: var(--navy); color: var(--on-navy);
    border-radius: var(--r-card); box-shadow: var(--sh-md);
    padding: 8px 6px;
  }
  .tbr-cell { display: flex; flex-direction: column; gap: 1px; padding: 0 14px; min-width: 0; }
  .tbr-cell span { font-size: var(--fs-2xs); color: var(--on-navy-mute); font-weight: var(--fw-semi); }
  .tbr-cell b { font-size: var(--fs-md); font-weight: var(--fw-extra); white-space: nowrap; }
  .tbr-cell.is-main b { font-size: var(--fs-xl); }
  .tbr-cell b[data-tone="up"] { color: #7CE0A3; }
  .tbr-cell b[data-tone="down"] { color: #FF9C9C; }
  .tbr-sep { width: 1px; margin: 2px 6px; background: var(--side-line); }
}

/* 내역서 — 긴 표는 머리글이 고정되도록 표 자체를 스크롤 영역으로 (M2) */
@media (min-width: 768px) {
  .bq-wrap { max-height: calc(100vh - 230px); }
}

/* ── 인쇄·사진·공사계획 UX (2026-10 실사용 점검 반영) ─────────────────────────── */
/* 장비대장 — 장비명 열 고정(일자 칸을 가로로 밀어도 이름이 보인다). 요약 열은 왼쪽 앞에 있다. */
.eq-tbl th:first-child, .eq-tbl td:first-child { position: sticky; left: 0; background: var(--card); }
.eq-tbl td:first-child { z-index: 1; }
.eq-tbl th:first-child { z-index: calc(var(--z-sticky) + 1); background: var(--surface-2); }
.eq-tbl tbody tr:hover td:first-child { background: var(--surface-2); }
.eq-tbl tfoot td:first-child { background: var(--surface-2); }
.eq-vendor-tbl td, .eq-vendor-tbl th { white-space: nowrap; }

/* 직원대장 — 이름 열 고정(일자 칸을 가로로 밀어도 이름이 보인다). 요약 열은 왼쪽 앞에 있다. */
.stf-tbl th:first-child, .stf-tbl td:first-child { position: sticky; left: 0; background: var(--card); }
.stf-tbl td:first-child { z-index: 1; }
.stf-tbl th:first-child { z-index: calc(var(--z-sticky) + 1); background: var(--surface-2); }
.stf-tbl tbody tr:hover td:first-child { background: var(--surface-2); }
.stf-tbl tfoot td:first-child { background: var(--surface-2); }

/* 자재관리대장 — 품목 열 고정(일자 칸을 가로로 밀어도 품목명이 보인다). 요약 열은 왼쪽 앞에 있다. */
.ml-tbl th:first-child, .ml-tbl td:first-child { position: sticky; left: 0; background: var(--card); }
.ml-tbl td:first-child { z-index: 1; }
.ml-tbl th:first-child { z-index: calc(var(--z-sticky) + 1); background: var(--surface-2); }
.ml-tbl tbody tr:hover td:first-child { background: var(--surface-2); }
.ml-tbl tbody tr.is-unnamed td:first-child { background: var(--gray-soft); }
.ml-tbl tfoot td:first-child { background: var(--surface-2); }

/* 월별집계 합계 줄 */
.sum-foot td { font-weight: var(--fw-extra); }

@media (min-width: 768px) {
  /* 출역 확인 시트 · TBM 참석자 (js/ui/attend.js) */
  .att-tools { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
  .att-sum { font-weight: var(--fw-bold); margin-right: auto; }
  .att-find { width: 100%; margin-bottom: 8px; }
  .att-list { max-height: 52vh; overflow-y: auto; border: 1px solid var(--line); border-radius: var(--r-lg); }
  .att-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-height: 36px; padding: 4px 10px; border-bottom: 1px solid var(--line); }
  .att-row:last-child { border-bottom: 0; }
  .att-row[hidden] { display: none; }
  .att-row.is-on { background: var(--amber-soft); }
  .att-chk { display: flex; align-items: center; gap: 8px; flex: 1 1 160px; min-height: 36px; cursor: pointer; }
  .att-chk input { width: 20px; height: 20px; accent-color: var(--navy); }
  .att-nm { font-weight: var(--fw-bold); }
  .att-sub { color: var(--mute); font-size: var(--fs-xs); }
  .att-qty { display: inline-flex; gap: 4px; }
  .att-q.is-on { background: var(--navy); color: #fff; }
  .att-empty { padding: 14px; color: var(--mute); text-align: center; }
  .att-addnew { margin-top: 8px; }
  .att-tbm { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line); }
  .att-tbm-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
  .att-sign { height: 26px; max-width: 80px; object-fit: contain; background: #fff; border: 1px solid var(--line); border-radius: 4px; }
  .att-edu { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; font-size: var(--fs-sm); color: var(--mute); }
}