/* v3.440.3 화면별 폰 전용 설계(≤760px) — 사장님(10/10) 우선 화면: 주문 관리 · AS·반품·교환 관리 · 상담 관리 · 자금 예측 · 재고/판매.
   공통 규칙은 mobile.css, 여기는 화면마다 다른 카드 모양만. 마크업은 PC 와 같고 클래스(c-…)만 보탠다. */
@media (max-width:760px){
  /* 공통: 직접 설계하는 표(data-mcustom)는 mobile.js 의 자동 카드 변환을 건너뛰고 아래에서 칸 배치를 정한다 */
  main table[data-mcustom]{display:block; overflow:visible; border:none; background:transparent; border-radius:0;}
  main table[data-mcustom] thead{display:none;}
  main table[data-mcustom] tbody{display:block;}
  main table[data-mcustom] tr{position:relative; background:#fff; border:1px solid #e9ebef; border-radius:14px; padding:12px 14px; margin:0 0 10px; box-shadow:0 1px 2px rgba(28,40,64,.03);}
  main table[data-mcustom] tr[hidden],main table[data-mcustom] tr.pgr-hidden{display:none !important;}
  main table[data-mcustom] td{display:block; padding:0 !important; border:none !important; background:transparent !important; text-align:left; max-width:none !important; white-space:normal !important; overflow:visible !important; text-overflow:clip !important; min-width:0; overflow-wrap:anywhere;}
  main table[data-mcustom] td.m-empty{display:none;}
  main table[data-mcustom] tbody tr:hover td{background:transparent;}

  /* 상태 타일(전체·신규·보류…) 한 줄에 3칸 */
  main .grid:has(> a.card[aria-current]){grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:8px !important;}
  main .grid > a.card[aria-current]{padding:10px 12px !important;}

  /* ───────── 판매 › 주문 관리 ───────── */
  /* 일괄 처리 도구 막대 — 한 줄 가로 스크롤, 스크롤해도 위에 붙어 있음(체크한 뒤 바로 처리) */
  #bulk > .card > .inline{display:flex !important; align-items:center; position:sticky; top:0; z-index:30; flex-wrap:nowrap !important; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; gap:8px !important;
    background:#fff; margin:-14px -14px 10px; padding:10px 14px; border-bottom:1px solid #e9ebef; border-radius:14px 14px 0 0;}
  #bulk > .card > .inline::-webkit-scrollbar{display:none;}
  #bulk > .card > .inline > *{flex:0 0 auto !important; width:auto !important; white-space:nowrap;}
  #bulk > .card > .inline > .sub{display:none !important;}                 /* '상태:' '합포장:' 같은 구분 글자는 접는다 */
  #bulk > .card > .inline > span[aria-live]{display:flex !important; gap:10px;}
  #bulk > .card > .inline .btn{min-height:40px; padding:8px 14px; font-size:14px;}

  main table.ordtbl tr{display:grid; grid-template-columns:34px minmax(0,1fr) auto; grid-template-areas:"chk ch paid" "chk no no" ". prod prod" ". opt qty" ". rcv rcv" ". addr addr" ". bun bun"; column-gap:8px; row-gap:2px;}
  main table.ordtbl td.c-chk{grid-area:chk; align-self:start; box-shadow:none !important; padding-top:2px;}
  main table.ordtbl td.c-chk input{width:24px; height:24px;}
  main table.ordtbl td.c-ch{grid-area:ch; font-size:13px; color:#6f7988; display:flex; align-items:center; gap:6px;}
  main table.ordtbl td.c-ch .sub{display:inline !important; font-size:12px; margin:0 !important;}
  main table.ordtbl td.c-no{grid-area:no; font-size:12.5px; color:#8f99a8;}
  main table.ordtbl td.c-no a{font-size:13px; font-weight:600; white-space:nowrap;}
  main table.ordtbl td.c-no .sub{display:inline !important; margin:0 0 0 8px !important;}
  main table.ordtbl td.c-paid{grid-area:paid; text-align:right; font-size:17px; font-weight:700; font-variant-numeric:tabular-nums; align-self:start;}
  main table.ordtbl td.c-paid::after{content:"원"; font-size:12px; font-weight:500; color:#8f99a8; margin-left:1px;}
  main table.ordtbl td.c-prod{grid-area:prod; margin-top:10px; font-size:15px !important; font-weight:600; line-height:1.4;}
  main table.ordtbl td.c-prod .skulink{font-weight:500; font-size:12.5px; color:#6f7988; margin-top:2px;}
  main table.ordtbl td.c-opt{grid-area:opt; font-size:13px !important; color:#6f7988; align-self:center;}
  main table.ordtbl td.c-qty{grid-area:qty; justify-self:end; align-self:center; background:#f4f5f6; border-radius:8px; padding:2px 10px; font-weight:600; font-size:13.5px;}
  main table.ordtbl td.c-qty::before{content:"× "; color:#8f99a8; font-weight:500;}
  main table.ordtbl td.c-rcv{grid-area:rcv; margin-top:10px; padding-top:10px; border-top:1px solid #f0f1f3; font-weight:600; font-size:14.5px;}
  main table.ordtbl td.c-rcv .sub{display:inline !important; margin:0 0 0 8px !important; font-weight:500; font-size:13px; color:#6f7988;}
  main table.ordtbl td.c-addr{grid-area:addr; font-size:13px !important; color:#6f7988; line-height:1.45;}
  main table.ordtbl td.c-bun{grid-area:bun; margin-top:6px; display:flex; gap:6px; flex-wrap:wrap;}
  main table.ordtbl td.c-bun:empty,main table.ordtbl td.c-bun.m-empty{display:none;}

  /* ───────── CS 센터 › AS·반품·교환 관리 — AS 접수 목록(tktbl) ───────── */
  main table.tktbl tr{display:grid; grid-template-columns:34px minmax(0,1fr) auto; grid-template-areas:"chk no st" "chk prod prod" ". cust tel" ". addr addr" ". upd upd" ". date act"; column-gap:8px; row-gap:4px; align-items:center;}
  main table.tktbl td.c-chk{grid-area:chk; align-self:start; padding-top:2px !important;}
  main table.tktbl td.c-chk input{width:24px; height:24px;}
  main table.tktbl td.c-no{grid-area:no; font-size:14.5px;}
  main table.tktbl td.c-no a{font-weight:700;}
  main table.tktbl td.c-st{grid-area:st; justify-self:end;}
  main table.tktbl td.c-st .badge{min-width:0 !important; width:auto !important;}
  main table.tktbl td.c-prod{grid-area:prod; margin-top:6px; font-size:15.5px !important; font-weight:600;}
  main table.tktbl td.c-cust{grid-area:cust; font-size:14px; font-weight:600;}
  main table.tktbl td.c-tel{grid-area:tel; justify-self:end; font-size:13.5px; color:#2e3238;}
  main table.tktbl td.c-addr{grid-area:addr; font-size:13px !important; color:#6f7988; line-height:1.45;}
  main table.tktbl td.c-cost{display:none;}
  main table.tktbl td.c-upd{grid-area:upd; font-size:12.5px; color:#8f99a8;}   /* v3.445 최종 수정 '10/12 17:40 · 이름' 한 줄 */
  main table.tktbl td.c-upd::before,main table.claims .c-upd::before{content:"최종 수정 "; color:#b0b8c4;}
  main table.tktbl td.c-date{grid-area:date; font-size:12.5px; color:#8f99a8; margin-top:6px;}
  main table.tktbl td.c-act{grid-area:act; justify-self:end; margin-top:6px;}
  main table.tktbl td.c-act .btn{min-height:38px; padding:6px 12px; font-size:13.5px;}
  main table.tktbl tr:has(td[colspan]){display:block; text-align:center; color:#6f7988;}

  /* ───────── CS 센터 › 반품·교환(마켓 접수) 목록(claims) ───────── */
  main table.claims tr{display:grid; grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"chk kind date" "prod prod prod" "cust cust cust" "reason reason reason" "detail detail detail" "track track track" "act act act"; column-gap:8px; row-gap:5px; align-items:center;}   /* v3.518 체크 칸(프로젝트 지정) 맨 앞 */
  main table.claims td.c-chk{grid-area:chk; align-self:start; padding-top:2px !important;}
  main table.claims td.c-chk input{width:24px; height:24px;}
  main table.claims td.c-kind{grid-area:kind; align-self:start; line-height:1.9 !important;}   /* v3.466 마켓 배지 줄 밑에 마켓 상태 줄 */
  main table.claims td.c-date{grid-area:date; justify-self:end; text-align:right; color:#8f99a8; font-size:12.5px !important;}   /* v3.465 신청일 위·최종 수정 아래 두 줄(한 칸) */
  main table.claims td.c-date{align-self:start;}   /* v3.466 셋째 줄 주문번호 */
  main table.claims td.c-prod{grid-area:prod; margin-top:6px; font-size:15.5px !important; font-weight:600; line-height:1.4;}
  main table.claims td.c-cust{grid-area:cust; font-size:14px; font-weight:600;}
  main table.claims td.c-cust .mono{margin-left:8px; font-weight:500;}
  main table.claims td.c-reason{grid-area:reason; font-size:13.5px; color:#2e3238;}
  main table.claims td.c-detail{grid-area:detail; font-size:12.5px !important; color:#6f7988; min-width:0 !important; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden !important;}
  main table.claims td.c-track{grid-area:track; font-size:12.5px !important; min-width:0 !important; color:#6f7988;}
  main table.claims td.c-act{grid-area:act; margin-top:6px; padding-top:10px !important; border-top:1px solid #f0f1f3 !important;}
  main table.claims td.c-act .btn{min-height:40px;}
  main table.claims td.c-act form.mact{display:flex; gap:8px; flex-wrap:nowrap;}   /* v3.467 처리 선택 + [선택] */
  main table.claims td.c-act form.mact select[name=action]{flex:1; min-width:0; max-width:none; min-height:40px; font-size:15px;}
  main table.claims td.c-act form.mact .btn{flex:none; padding:6px 16px; font-size:15px;}
  main table.claims td.c-act details.act{width:100%;}
  main table.claims td.c-act summary{min-height:40px;}
  main table.claims tr:has(td[colspan]){display:block; text-align:center; color:#6f7988;}
  main table.claims td.c-act details.act > summary{display:flex; align-items:center; justify-content:center; width:100%; min-height:44px; border:1px solid #bad0fa; background:#e4edff; color:#266df0; border-radius:12px; font-size:15px; font-weight:600; list-style:none;}
  main table.claims td.c-act details.act > summary::-webkit-details-marker{display:none;}
  main table.claims td.c-act details.act[open] > summary{margin-bottom:10px;}

  /* ───────── 재무 › 재고/판매 · 홈 — 모델별 판매(msal): 모델 하나 = 카드, 숫자는 라벨 위·값 아래 3열 ───────── */
  main table.msal tr{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-areas:"model model order" "stock stock stock" "qty rev profit" "rate ad cost" "ship fee ."; column-gap:10px; row-gap:8px; padding:12px 14px;}
  main table.msal tr:has(> td[colspan]){display:block; background:transparent; border:none; box-shadow:none; padding:10px 2px 2px; margin:6px 0 6px;}
  main table.msal tr:has(> td[colspan]) td{font-size:14px; font-weight:700; color:#6f7988; padding:0 !important; background:transparent !important;}
  main table.msal tr.mdet-row{display:block; padding:10px;}
  main table.msal tr.mdet-row td{padding:0 !important; background:transparent !important;}
  main table.msal td.c-model,main table.msal td.mdet-td{grid-area:model; font-size:15.5px; font-weight:600; padding-left:0 !important; line-height:1.35;}
  main table.msal td.c-order{grid-area:order; justify-self:end; font-size:12.5px; color:#2e3238; text-align:right;}
  main table.msal td.c-stock{grid-area:stock; font-size:13px; color:#2e3238; text-align:left !important;}
  main table.msal td.c-stock::before{content:"현재고  "; color:#8f99a8; font-size:12px;}
  main table.msal td.c-stock .sub{display:inline !important; margin:0 0 0 8px !important; font-size:12px !important; white-space:normal !important;}
  main table.msal td[class^="c-"]:not(.c-model):not(.c-order):not(.c-stock){text-align:left !important; font-variant-numeric:tabular-nums; font-size:14.5px; font-weight:600;}
  main table.msal td.c-qty{grid-area:qty;} main table.msal td.c-rev{grid-area:rev;} main table.msal td.c-profit{grid-area:profit; font-weight:700 !important;}
  main table.msal td.c-rate{grid-area:rate;} main table.msal td.c-ad{grid-area:ad;} main table.msal td.c-cost{grid-area:cost;}
  main table.msal td.c-ship{grid-area:ship;} main table.msal td.c-fee{grid-area:fee;}
  main table.msal td.c-qty::before,main table.msal td.c-rev::before,main table.msal td.c-profit::before,main table.msal td.c-rate::before,main table.msal td.c-ad::before,main table.msal td.c-cost::before,main table.msal td.c-ship::before,main table.msal td.c-fee::before{display:block; font-size:11.5px; font-weight:500; color:#8f99a8; margin-bottom:1px;}
  main table.msal td.c-qty::before{content:"판매수량";} main table.msal td.c-rev::before{content:"매출";} main table.msal td.c-profit::before{content:"공헌이익";}
  main table.msal td.c-rate::before{content:"이익률";} main table.msal td.c-ad::before{content:"광고비";} main table.msal td.c-cost::before{content:"원가";}
  main table.msal td.c-ship::before{content:"배송비";} main table.msal td.c-fee::before{content:"수수료";}
  main table.msal td.c-ad,main table.msal td.c-cost,main table.msal td.c-ship,main table.msal td.c-fee{font-weight:500 !important; color:#505967; font-size:13.5px !important;}

  /* 기간 선택 줄(날짜 둘 + 조회 + 빠른 기간 칩) — 칩은 한 줄 가로 스크롤 */
  main input[type=date]{width:100%;}

  /* ───────── CS 센터 › 상담 관리 — 메신저식(목록 → 대화 → 정보). 긴 주소·링크가 칸을 밀어 넓히지 않게 ───────── */
  main .ib{grid-template-columns:minmax(0,1fr) !important;}
  main .ib > section{min-width:0; max-width:100%;}
  main .ib .c2 .row,main .ib .c2 .row *{min-width:0;}
  main .ib .c2 .row{overflow:hidden;}
  main .ib .c2 .row .t,main .ib .c2 .row .p{overflow-wrap:anywhere; word-break:break-word;}
  main .ib .c2 .hd{padding:12px 12px 8px;}
  main .ib .c2 .tabs{overflow-x:auto; scrollbar-width:none; flex-wrap:nowrap;}
  main .ib .c2 .tabs > *{flex:0 0 auto;}
  main .ib .c3 .msg{max-width:88%;}

  /* ───────── 판매 › 주문 상세(.od) ───────── */
  .od .top{margin:2px 0 10px; gap:10px;}
  .od .top h1{font-size:19px; gap:8px;}
  .od .top h1 .no{font-size:18px; word-break:break-all;}
  .od .copy{width:34px; height:34px;}
  .od .meta{font-size:12.5px; gap:2px 12px;}
  .od .acts{width:100%; display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:8px;}
  .od .acts .btn{height:44px; justify-content:center; font-size:14px;}
  .od .odsteps{display:flex !important; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding:12px 8px 10px; margin-bottom:12px; row-gap:0;}
  .od .odsteps::-webkit-scrollbar{display:none;}
  .od .odsteps > .odstep{flex:0 0 84px; min-width:84px;}
  .od .panel{padding:14px; border-radius:14px;}
  .od .fgrid{grid-template-columns:minmax(0,1fr) !important;}
  .od .items li{padding:10px 0;}
  .od dl{font-size:14px; gap:8px 12px;}
  .od .tel a{display:inline-flex; align-items:center; min-height:44px; font-size:17px; font-weight:700;}

  /* ───────── CS 센터 › AS 접수 상세(.tk-) ───────── */
  .tk-head{gap:8px;}
  .tk-head h1{font-size:19px;}
  .tk-actions{width:100%;}
  .tk-actions .btn{width:100%; min-height:44px;}
  a.tel{display:inline-flex; align-items:center; min-height:40px; color:#266df0 !important; font-weight:700;}
  .stepper{overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none;}
  .stepper::-webkit-scrollbar{display:none;}
  /* 고객·배송·비용 카드를 처리 패널 바로 아래로(전화·주소가 먼저), 이력류는 접어 둔다 */
  .tk-grid{display:flex !important; flex-direction:column; gap:12px;}
  .tk-main,.tk-side{display:contents;}
  .tk-grid section.card{margin-bottom:0;}
  #customer{order:1;} #shipping{order:2;} #cost{order:3;}
  .tk-main > section.card{order:5;} .tk-main > section.card:first-child{order:0;}
  #sms{order:8;} #rfid{order:9;} #danger{order:10;}
  .tk-grid section.m-fold > h2{display:flex; align-items:center; justify-content:space-between; min-height:44px; cursor:pointer; margin:0;}
  .tk-grid section.m-fold > h2::after{content:"▾"; color:#8f99a8; font-size:14px; margin-left:8px;}
  .tk-grid section.m-fold.m-open > h2::after{content:"▴";}
  .tk-grid section.m-fold:not(.m-open) > *:not(h2){display:none !important;}
  .tk-tl .ts{display:block;}
}
