/* sup-leave · SUP-06 휴가·비가용 */
.pt-sl .pt-n,.pt-sl-dr .pt-n,.pt-ov .pt-sl-bkm .pt-n{display:inline-grid;place-items:center;min-width:18px;height:18px;border-radius:9px;background:var(--fg);color:var(--bg);font-size:10.5px;font-weight:700;margin-right:6px;flex:0 0 auto}
.pt-sl .pt-h select.inp{max-width:170px}
.pt-sl-nav{display:inline-flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums}
.pt-sl-badge{display:flex;align-items:center;font-size:12px;margin:-4px 0 10px}
.pt-sl-sec{display:flex;align-items:flex-start;gap:4px}
.pt-sl-sec>.kpis{flex:1;min-width:0}
.pt-sl-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}
.pt-sl-kpis .kpi small{overflow-wrap:anywhere}
.pt-sl-card{margin-bottom:12px}
.pt-sl-two{margin-top:0}
/* 캘린더: 사람 × 날짜 — 넓으면 카드 안에서 가로 스크롤 */
.pt-sl-calw{overflow-x:auto;max-width:100%;border:1px solid var(--line);border-radius:8px}
.pt-sl-cal{--nw:170px;--cw:26px;display:grid;min-width:max-content;font-size:11.5px}
.pt-sl-cal.wide{--cw:minmax(92px,1fr);--cw-px:92px;min-width:calc(170px + 7 * 92px)}
.pt-sl-row{display:grid;grid-template-columns:var(--nw) repeat(var(--n),var(--cw));grid-template-rows:34px;border-bottom:1px solid var(--line);position:relative}
.pt-sl-row:last-child{border-bottom:0}
.pt-sl-row.ex{background:color-mix(in srgb,var(--muted) 6%,transparent)}
.pt-sl-hd{grid-template-rows:30px;background:var(--surface2);position:sticky;top:0;z-index:3}
.pt-sl-nm{grid-column:1;grid-row:1;display:flex;align-items:center;gap:6px;padding:0 8px;position:sticky;left:0;z-index:2;background:var(--surface);border-right:1px solid var(--line);min-width:0;overflow:hidden}
.pt-sl-hd .pt-sl-nm{background:var(--surface2);font-weight:600;color:var(--muted)}
.pt-sl-nm>span{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.pt-sl-nm small{color:var(--muted);font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-sl-nm b{white-space:nowrap}
.pt-sl-dh{grid-row:1;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:10.5px;color:var(--fg);border-left:1px solid color-mix(in srgb,var(--line) 60%,transparent);line-height:1.1}
.pt-sl-dh small{color:var(--muted);font-size:9.5px}
.pt-sl-dh.off{color:var(--muted);background:color-mix(in srgb,var(--muted) 10%,transparent)}
.pt-sl-dh.hol b{color:var(--alert)}
.pt-sl-dh.now{box-shadow:inset 0 -3px 0 var(--hq)}
.pt-sl-c{grid-row:1;border-left:1px solid color-mix(in srgb,var(--line) 60%,transparent);cursor:cell}
.pt-sl-c:hover{background:color-mix(in srgb,var(--hq) 8%,transparent)}
.pt-sl-c.off{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--muted) 12%,transparent) 0 3px,transparent 3px 6px)}
.pt-sl-c.nw{background:color-mix(in srgb,var(--muted) 16%,transparent)}
.pt-sl-c.now{box-shadow:inset 2px 0 0 var(--hq)}
.pt-sl-c.sel{background:color-mix(in srgb,var(--hq) 22%,transparent)}
.pt-sl-bar{grid-row:1;align-self:center;height:22px;margin:0 2px;border-radius:5px;background:color-mix(in srgb,var(--c) 22%,var(--surface));border:1px solid var(--c);color:var(--fg);display:flex;align-items:center;padding:0 5px;min-width:0;overflow:hidden;z-index:1;cursor:pointer;font-size:10.5px}
.pt-sl-bar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-sl-bar:hover{filter:brightness(.96);box-shadow:0 0 0 2px color-mix(in srgb,var(--c) 35%,transparent)}
.pt-sl-bar.ham{justify-self:start;width:calc(50% - 2px);margin-right:0;padding:0 2px;justify-content:center}
.pt-sl-bar.hpm{justify-self:end;width:calc(50% - 2px);margin-left:0;padding:0 2px;justify-content:center}
.pt-sl-cal.wide .pt-sl-bar.ham,.pt-sl-cal.wide .pt-sl-bar.hpm{justify-content:flex-start;padding:0 5px}
.pt-sl-bar.hrs{align-self:end;height:12px;margin-bottom:3px;padding:0 3px;font-size:9.5px}
.pt-sl-bar.sh{margin-left:calc(var(--cw-px,26px) / 2)}
.pt-sl-bar.eh{margin-right:calc(var(--cw-px,26px) / 2)}
.pt-sl-bar.draft{border-style:dashed;background:color-mix(in srgb,var(--hq) 12%,var(--surface))}
.pt-sl-lg{margin-top:8px;align-items:center}
.pt-sl-lg i{display:inline-block;width:14px;height:9px;border-radius:3px;background:color-mix(in srgb,var(--c) 30%,var(--surface));border:1px solid var(--c);margin-right:4px;vertical-align:-1px}
.pt-sl-lg i.h{width:7px}
.pt-sl-lg i.s{height:4px}
.pt-sl-lg i.nw{--c:var(--line);background:color-mix(in srgb,var(--muted) 16%,transparent)}
.pt-sl-lg i.hol{--c:var(--line);background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--muted) 25%,transparent) 0 2px,transparent 2px 4px)}
.pt-sl-lg i.now{--c:var(--hq);width:2px;background:var(--hq)}
/* 확인할 비가용 */
.pt-sl-att{border:1px solid var(--line);border-left:3px solid var(--need);border-radius:8px;padding:8px 10px;margin-bottom:6px;font-size:12px}
.pt-sl-att ul{margin:4px 0 2px 18px;padding:0}
.pt-sl-undo{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:12px;border:1px dashed var(--hq);border-radius:8px;padding:6px 10px;margin-bottom:10px;background:color-mix(in srgb,var(--hq) 5%,var(--surface))}
.pt-sl-undo .pt-sp{flex:1}
/* 드로어 · 모달 */
.pt-sl-dr{display:grid;gap:8px}
.pt-sl-sub{border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin-top:8px;font-size:12px;min-width:0}
.pt-sl-sub>label.row,.pt-sl-sub>small,.pt-sl-sub>.field,.pt-sl-sub>.form,.pt-sl-sub>.pt-scroll{margin-top:4px}
.pt-sl-sub>small{display:block}
.pt-sl-sub table.t{font-size:11.5px}
.pt-sl-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:4px}
.pt-sl-3>div{background:var(--surface2);border-radius:7px;padding:6px 8px;display:grid;gap:1px;min-width:0}
.pt-sl-3 small{color:var(--muted);font-size:10.5px;overflow-wrap:anywhere}
.pt-sl-3 b{font-size:15px}
.pt-sl-u .field .inp+.inp{margin-top:4px}
.pt-sup-msg.warnc{color:var(--need)}
.pt-sl-f4{grid-template-columns:repeat(4,minmax(0,1fr))}
.pt-sl-pick .inp{max-width:160px}
.pt-sl-bkm{display:grid;gap:4px}
#pt-sl-bk{margin-top:6px}
@media (max-width:820px){.pt-sl-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .pt-sl .pt-h select.inp{max-width:100%;flex:1 1 140px}
  .pt-sl-cal{--nw:112px}
  .pt-sl-nm small{display:none}
  .pt-sl-sec>.pt-n,.pt-sl-badge>.pt-n{display:none}
  .pt-sl-3,.pt-sl-f4{grid-template-columns:1fr}
  .pt-sl-pick .inp{max-width:100%;flex:1 1 120px}
  .pt-sl-two{grid-template-columns:1fr}
}
