/* scheduler.css — 매장 스케줄러 */

/* ─── 주간 캘린더 ─────────────────────────────────────── */
.sch-cal {
  background: #fff; border: 1px solid var(--line); border-radius: 8px;
  margin-bottom: 20px; overflow: hidden;
}
.sch-cal-head {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 16px 22px; border-bottom: 1px solid var(--line);
  background: var(--neutral-50);
}
.sch-cal-h {
  font: 700 15px/1.2 var(--font-sans); letter-spacing: var(--tracking-heading);
  display: inline-flex; align-items: center; gap: 12px;
}
.sch-cal-h::before { content:""; width: 4px; height: 18px; background: var(--red-500); border-radius: 100px;}
.sch-cal-h small { font: 500 12px/1 var(--font-sans); color: var(--fg-tertiary);
  font-weight: 500; letter-spacing: 0; text-transform: none;}
.sch-cal-legend { display: inline-flex; gap: 14px; flex-wrap: wrap;}
.sch-cal-legend span {
  display: inline-flex; align-items: center; gap: 5px;
  font: 500 11px/1 var(--font-sans); color: var(--fg-tertiary);
}
.sch-cal-legend i { width: 10px; height: 10px; border-radius: 2px; display: inline-block;}

.sch-cal-grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 0;
}
.sch-cal-day {
  border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
  background: #fff; cursor: pointer;
  min-height: 220px; padding: 12px 10px;
  transition: background .12s;
}
.sch-cal-day:nth-child(7) { border-right: 0;}
.sch-cal-day:hover { background: var(--neutral-50);}
.sch-cal-day.today { background: rgba(227,30,38,0.04);}
.sch-cal-day.today:hover { background: rgba(227,30,38,0.07);}
.sch-cal-day.past { opacity: 0.65;}
.sch-cal-day.sun { background: var(--neutral-50);}
.sch-cal-day.sel { box-shadow: inset 0 0 0 2px var(--red-500); background: rgba(227,30,38,0.03);}

.sch-cal-day-head {
  display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px;
  padding-bottom: 8px; border-bottom: 1px dashed var(--line);
}
.sch-cal-day-name {
  font: 700 10px/1 var(--font-sans); letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--fg-tertiary);
}
.sch-cal-day.sun .sch-cal-day-name { color: var(--red-500);}
.sch-cal-day-num {
  font: 800 24px/1 var(--font-sans); color: var(--fg-primary); font-feature-settings: "tnum" 1;
  margin-left: auto;
}
.sch-cal-day.today .sch-cal-day-num { color: var(--red-500);}
.sch-cal-day-tag {
  background: var(--red-500); color: #fff;
  font: 700 9px/1.5 var(--font-sans); letter-spacing: 0.06em;
  padding: 2px 6px; border-radius: 100px;
}

.sch-cal-day-tasks { display: flex; flex-direction: column; gap: 4px;}
.sch-cal-task {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 8px; background: #fff;
  border-left: 3px solid var(--neutral-300);
  border-radius: 0 4px 4px 0;
  font: var(--type-caption); cursor: pointer;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
  transition: transform .1s;
}
.sch-cal-task:hover { transform: translateX(2px); }
.sch-cal-task.done { opacity: 0.45; text-decoration: line-through;}
.sch-cal-task-t {
  font: 700 12px/1 var(--font-sans); color: var(--fg-tertiary);
  font-feature-settings: "tnum" 1; flex: none;
}
.sch-cal-task-title {
  font: 500 13px/1.4 var(--font-sans); color: var(--fg-primary);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sch-cal-task.p-high .sch-cal-task-title { font-weight: 600;}
.sch-cal-empty, .sch-cal-rest {
  font: italic 400 11px/1.4 var(--font-sans); color: var(--fg-quaternary);
  text-align: center; padding: 16px 4px;
}
.sch-cal-rest { color: var(--red-500); font-weight: 600; font-style: normal;}
.sch-cal-more { font: 600 10px/1 var(--font-sans); color: var(--fg-tertiary);
  text-align: center; padding: 4px;}

/* ─── 태스크 리스트 ───────────────────────────────────── */
.sch-list {
  background: #fff; border: 1px solid var(--line); border-radius: 8px;
  margin-bottom: 20px; overflow: hidden;
}
.sch-list-head {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 16px 22px; border-bottom: 1px solid var(--line);
}
.sch-list-h {
  font: 700 15px/1.2 var(--font-sans); letter-spacing: var(--tracking-heading);
  display: inline-flex; align-items: center; gap: 12px;
}
.sch-list-h::before { content:""; width: 4px; height: 18px; background: var(--red-500); border-radius: 100px;}
.sch-list-tools {
  display: inline-flex; gap: 10px; align-items: center;
}
.sch-sel {
  height: 32px; padding: 0 10px; border: 1px solid var(--line); border-radius: 6px;
  background: #fff; font: 500 12px/1 var(--font-sans); color: var(--fg-primary);
  cursor: pointer;
}

.sch-rows { display: flex; flex-direction: column; padding: 6px 16px;}
.sch-row {
  display: grid; grid-template-columns: 28px 4px 92px 1fr 90px 80px; gap: 14px; align-items: center;
  padding: 12px 8px; border-bottom: 1px dashed var(--line);
}
.sch-row:last-child { border-bottom: 0;}
.sch-row.done .sch-row-body { opacity: 0.45;}
.sch-row.done .sch-row-title b { text-decoration: line-through;}
.sch-row.overdue { background: rgba(186,26,26,0.025);}
.sch-row:hover { background: var(--neutral-50);}

.sch-row-check { display: inline-flex; align-items: center; justify-content: center;}
.sch-row-check input { width: 18px; height: 18px; accent-color: var(--red-500); cursor: pointer;}

.sch-row-prio { width: 4px; align-self: stretch; border-radius: 100px;}
.sch-row-prio.p-high { background: var(--red-500);}
.sch-row-prio.p-med  { background: var(--warning-500);}
.sch-row-prio.p-low  { background: var(--neutral-300);}

.sch-row-date b { font: 700 13px/1.2 var(--font-sans); display: block;}
.sch-row-date small { font: 500 11px/1 var(--font-sans); color: var(--fg-tertiary);
  display: block; margin-top: 3px; font-feature-settings: "tnum" 1;}

.sch-row-title {
  display: flex; align-items: center; gap: 10px;
  font: var(--type-body-sm);
}
.sch-row-title b { font: 600 14px/1.3 var(--font-sans); color: var(--fg-primary);}
.sch-row-note { font: 500 12px/1.4 var(--font-sans); color: var(--fg-tertiary);
  margin-top: 4px; padding-left: 0;}

.sch-row-who {
  font: 600 12px/1 var(--font-sans); color: var(--fg-secondary);
  display: inline-flex; align-items: center; gap: 6px;
}
.sch-row-who::before {
  content: ""; width: 6px; height: 6px; border-radius: 100px; background: var(--neutral-400);
}

.sch-row-actions { display: inline-flex; gap: 4px; justify-content: flex-end;}

/* category pill */
.sch-cat-pill {
  display: inline-block; padding: 3px 9px; border-radius: 4px;
  font: 700 10px/1.4 var(--font-sans); letter-spacing: 0.08em; text-transform: uppercase;
  background: var(--neutral-100); color: var(--fg-secondary);
}
.sch-cat-pill.cat-service { background: rgba(227,30,38,0.10); color: var(--red-500);}
.sch-cat-pill.cat-quote   { background: rgba(59,130,246,0.12); color: var(--info-500);}
.sch-cat-pill.cat-order   { background: var(--orange-50); color: var(--orange-600);}
.sch-cat-pill.cat-fit     { background: var(--success-50); color: #15803D;}
.sch-cat-pill.cat-test    { background: var(--neutral-100); color: var(--neutral-700);}
.sch-cat-pill.cat-misc    { background: var(--neutral-100); color: var(--fg-tertiary);}

/* ─── View toggle bar in page header ─────────────────── */
.sch-viewbar { display: flex; flex-direction: column; gap: 10px; align-items: flex-end;}
.sch-cat-legend-inline {
  display: inline-flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end;
}
.sch-cat-legend-inline span {
  display: inline-flex; align-items: center; gap: 5px;
  font: 500 11px/1 var(--font-sans); color: var(--fg-tertiary);
}
.sch-cat-legend-inline i { width: 10px; height: 10px; border-radius: 2px;}

/* Navigation buttons (prev/today/next) */
.sch-cal-nav { display: inline-flex; gap: 4px;}
.sch-cal-nav button {
  width: 32px; height: 32px; border: 1px solid var(--line); background: #fff;
  border-radius: 6px; cursor: pointer;
  font: 600 12px/1 var(--font-sans); color: var(--fg-secondary);
  transition: all .12s;
}
.sch-cal-nav button:hover { background: var(--neutral-50); color: var(--fg-primary);}
.sch-cal-nav button.today-btn {
  width: auto; padding: 0 14px;
  font: 700 11px/1 var(--font-sans); letter-spacing: 0.04em;
}
.sch-cal-nav button.today-btn:hover { background: var(--red-500); color: #fff; border-color: var(--red-500);}

/* ─── DAY VIEW ─────────────────────────────────────────── */
.sch-day-grid {
  display: flex; flex-direction: column;
  padding: 4px 0;
}
.sch-day-slot {
  display: grid; grid-template-columns: 80px 1fr; gap: 16px; align-items: flex-start;
  padding: 10px 22px; border-bottom: 1px dashed var(--line);
}
.sch-day-slot:last-child { border-bottom: 0;}
.sch-day-slot.has { background: var(--neutral-50);}
.sch-day-slot-t {
  font: 700 13px/1 var(--font-sans); color: var(--fg-tertiary);
  font-feature-settings: "tnum" 1; padding-top: 6px;
  letter-spacing: 0.04em;
}
.sch-day-slot-tasks { display: flex; flex-direction: column; gap: 6px;}
.sch-day-slot-empty {
  font: 500 12px/1 var(--font-sans); color: var(--fg-quaternary); padding: 4px 0;
}
.sch-day-task {
  display: grid; grid-template-columns: 60px 1fr auto; gap: 14px; align-items: center;
  padding: 12px 14px;
  background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--neutral-300);
  border-radius: 6px;
  cursor: pointer;
  transition: transform .1s, box-shadow .12s;
}
.sch-day-task:hover { transform: translateX(2px); box-shadow: var(--shadow-sm);}
.sch-day-task.done { opacity: 0.5;}
.sch-day-task.done b { text-decoration: line-through;}
.sch-day-task-time {
  font: 800 16px/1 var(--font-sans); color: var(--fg-primary);
  font-feature-settings: "tnum" 1; letter-spacing: -0.01em;
}
.sch-day-task-body { display: flex; flex-direction: column; gap: 6px;}
.sch-day-task-body b { font: 700 14px/1.2 var(--font-sans); color: var(--fg-primary);}
.sch-day-task-body small { font: 500 12px/1.4 var(--font-sans); color: var(--fg-tertiary);}
.sch-day-task-who {
  font: 600 12px/1 var(--font-sans); color: var(--fg-secondary);
  display: inline-flex; align-items: center; gap: 6px;
}
.sch-day-task-who::before {
  content: ""; width: 6px; height: 6px; border-radius: 100px; background: var(--neutral-400);
}
.sch-day-empty, .sch-day-rest {
  padding: 64px 24px; text-align: center;
  font: 500 14px/1 var(--font-sans); color: var(--fg-tertiary);
}
.sch-day-rest { color: var(--red-500); font-weight: 700;}

/* ─── MONTH VIEW ───────────────────────────────────────── */
.sch-month-dows {
  display: grid; grid-template-columns: repeat(7, 1fr);
  background: var(--neutral-50); border-bottom: 1px solid var(--line);
}
.sch-month-dow {
  padding: 10px 12px;
  font: 700 11px/1 var(--font-sans); letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--fg-tertiary); text-align: center;
}
.sch-month-dow.sun { color: var(--red-500);}

.sch-month-grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 0;
}
.sch-month-cell {
  border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
  min-height: 140px;
  padding: 10px;
  background: #fff; cursor: pointer;
  display: flex; flex-direction: column; gap: 5px;
  transition: background .12s;
}
.sch-month-cell:nth-child(7n) { border-right: 0;}
.sch-month-cell:nth-last-child(-n+7) { border-bottom: 0;}
.sch-month-cell.out { background: var(--neutral-50); opacity: 0.6;}
.sch-month-cell.today { background: rgba(227,30,38,0.04);}
.sch-month-cell.sun { background: var(--neutral-50);}
.sch-month-cell:hover { background: var(--neutral-100);}
.sch-month-cell-h {
  display: flex; align-items: center; gap: 6px;
}
.sch-month-cell-num {
  font: 700 16px/1 var(--font-sans); color: var(--fg-primary);
  font-feature-settings: "tnum" 1;
}
.sch-month-cell.today .sch-month-cell-num { color: var(--red-500); font-weight: 800;}
.sch-month-cell.out .sch-month-cell-num { color: var(--fg-quaternary);}
.sch-month-cell.sun .sch-month-cell-num { color: var(--red-500);}
.sch-month-cell-tag {
  background: var(--red-500); color: #fff;
  font: 700 9px/1.5 var(--font-sans); padding: 2px 6px; border-radius: 100px;
}
.sch-month-cell-cnt {
  margin-left: auto;
  background: var(--neutral-900); color: #fff;
  font: 700 10px/1 var(--font-sans);
  padding: 3px 7px; border-radius: 100px; font-feature-settings: "tnum" 1;
}
.sch-month-cell-tasks { display: flex; flex-direction: column; gap: 2px;}
.sch-month-task {
  display: flex; gap: 5px; align-items: baseline;
  padding: 3px 7px; border-left: 3px solid var(--neutral-300);
  border-radius: 0 3px 3px 0;
  background: #fff;
  font: 500 12px/1.4 var(--font-sans);
  cursor: pointer; overflow: hidden;
}
.sch-month-task:hover { background: var(--neutral-100);}
.sch-month-task.done { opacity: 0.4; text-decoration: line-through;}
.sch-month-task em {
  font-style: normal; font-weight: 700; color: var(--fg-tertiary);
  font-size: 11px; font-feature-settings: "tnum" 1; flex: none;
}
.sch-month-task span {
  flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--fg-primary);
}
.sch-month-more {
  font: 600 10px/1 var(--font-sans); color: var(--fg-tertiary);
  text-align: right; padding-right: 4px;
}

/* ─── 주간 캘린더에서 legend 빼고 nav만 남기는 head fix ── */
.sch-cal-head .sch-cal-legend { display: none;}

/* ─── MODAL ─────────────────────────────────────────── */
.sch-modal { width: 560px;}
.sch-modal .inv-mod-field input[type="text"],
.sch-modal .inv-mod-field input[type="date"],
.sch-modal .inv-mod-field input[type="time"],
.sch-modal .inv-mod-field select {
  border: 1px solid var(--line); border-radius: 8px; padding: 0 14px;
  font: var(--type-body); color: var(--fg-primary);
  background: #fff;
  outline: none;
  transition: border-color .12s, box-shadow .12s;
}
.sch-modal .inv-mod-field input:focus,
.sch-modal .inv-mod-field select:focus { border-color: var(--red-500); box-shadow: 0 0 0 3px rgba(227,30,38,0.12);}

.sch-cat-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;
}
.sch-cat-pick {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px;
  background: #fff; font: 600 12px/1 var(--font-sans); color: var(--fg-primary);
  cursor: pointer; transition: all .12s;
}
.sch-cat-pick i { width: 8px; height: 8px; border-radius: 100px; display: inline-block;}
.sch-cat-pick:hover { background: var(--neutral-50);}

.sch-prio-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;}
.sch-prio-pick {
  height: 40px; padding: 0 8px; border: 1px solid var(--line); border-radius: 6px;
  background: #fff; font: 700 12px/1 var(--font-sans); color: var(--fg-primary); cursor: pointer;
  transition: all .12s;
}
.sch-prio-pick:hover { background: var(--neutral-50);}