/* static/css/promo-schedule.css — 프로모션 스케줄(#promoScheduleView) 전용 스타일.
   전역 충돌을 막으려고 모든 선택자를 #promoScheduleView 로 묶고 클래스는 ps- 접두어를 쓴다.
   색·모서리·그림자는 어드민 변수만 쓴다(design-admin 규격).
   ⛔ 색은 한 가지 의미에만 쓴다(2026-09-30 정리 — "색이 너무 많아 정신없다"):
     · 채널 = 자사몰 파랑(#3F7FA6) · 스마트스토어 초록(#1F8A4C) — 달력 막대·태그·목록 점
     · 경고 = 빨강(--neg) — 공휴일 · 임박(D-2 이하)
     · 강조 = 브랜드 세이지(--brand) — 오늘 · 진행 중 · 선택
     파랑/초록 2색만 어드민 토큰 밖이라 여기서 정했다(채널 구분용). 그 밖의 색은 만들지 않는다.
     (이전의 프로모션별 8색·기념일 초록은 정신없어서 뺐다.) */

/* 본체 CSS 에 "이 화면 말고 전부 숨김" 규칙이 있어(예: .container.view-allchannel >
   .section:not(#allChannelView){display:none}) 표시가 남아 있으면 이 화면이 안 보인다.
   promo-schedule.js 가 표시를 걷어내지만, 다른 규칙이 또 생겨도 버티도록 여기서도 못 박는다. */
#promoScheduleView:not([hidden]) { display: block !important; }

#promoScheduleView { color: var(--text); }
#promoScheduleView button { font-family: inherit; }
/* 화면이 처음 그려질 때 위로 살짝 떠오르며 나타난다(요소마다 조금씩 늦게) */
#promoScheduleView .ps-in { animation: psRise .5s cubic-bezier(.22,.61,.36,1) both; }
#promoScheduleView .ps-in-1 { animation-delay: 0s; }
#promoScheduleView .ps-in-2 { animation-delay: .07s; }
#promoScheduleView .ps-in-3 { animation-delay: .15s; }
#promoScheduleView .ps-in-4 { animation-delay: .24s; }
@keyframes psRise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
/* 채널 색 — 달력 막대(--pc)와 목록 점이 이 2색만 쓴다 */
#promoScheduleView .ps-bar-mall { --pc: #3F7FA6; }
#promoScheduleView .ps-bar-ss { --pc: #1F8A4C; }
#promoScheduleView .ps-sw { display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 7px; flex: 0 0 auto; vertical-align: 1px; }
#promoScheduleView .ps-sw-mall { background: #3F7FA6; }
#promoScheduleView .ps-sw-ss { background: #1F8A4C; }

/* ── 요약 카드 ─────────────────────────────────────────────── */
/* 화면 제목 — 요약 카드 위(사용자 요청 2026-09-29) */
#promoScheduleView .ps-title { margin: 2px 0 14px; font-size: 20px; font-weight: 800; letter-spacing: -.01em; color: var(--text); }
#promoScheduleView .ps-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
#promoScheduleView .ps-kpi { position: relative; padding: 20px 24px 20px 26px; min-width: 0; overflow: hidden; }
/* 왼쪽 상태 색 띠 — 진행 중·다음(세이지 기본)·임박(빨강)·없음(회색). 채널 파랑/초록과 안 겹치게 세이지·빨강만 */
#promoScheduleView .ps-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--kc, var(--brand)); }
#promoScheduleView .ps-kpi-hot  { --kc: var(--neg); }
#promoScheduleView .ps-kpi-none { --kc: var(--line-strong); }
#promoScheduleView .ps-kpi-label { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; color: var(--text-2); }
/* 진행 중 라벨 점 — 살짝 맥박(라이브 신호) */
#promoScheduleView .ps-kpi-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--pos); flex: 0 0 auto; }
#promoScheduleView .ps-kpi-soon .ps-kpi-dot { background: var(--chart-bar); }
#promoScheduleView .ps-kpi-hot .ps-kpi-dot { background: var(--neg); }
#promoScheduleView .ps-kpi-live .ps-kpi-dot { animation: psDot 1.8s ease-in-out infinite; }
@keyframes psDot { 0%,100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pos) 55%, transparent); } 60% { box-shadow: 0 0 0 6px color-mix(in srgb, var(--pos) 0%, transparent); } }
#promoScheduleView .ps-kpi-big { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 10px 0 8px; }
#promoScheduleView .ps-kpi-num { font-size: 40px; line-height: 1; font-weight: 800; letter-spacing: -.02em; color: var(--pos); font-variant-numeric: tabular-nums; }
#promoScheduleView .ps-kpi-soon .ps-kpi-num { color: var(--chart-bar); }   /* 다음 프로모션 세이지그린(#6E8472, 진행 중 선명초록과 구분) */
#promoScheduleView .ps-kpi-hot .ps-kpi-num { color: var(--neg); }
#promoScheduleView .ps-kpi-none .ps-kpi-num { font-size: 30px; color: var(--muted); }
#promoScheduleView .ps-kpi-name { font-size: 17px; font-weight: 700; color: var(--text); letter-spacing: -.01em; }
#promoScheduleView .ps-kpi-tail { font-size: 13px; font-weight: 500; color: var(--muted); }
#promoScheduleView .ps-kpi-sub { font-size: 13.5px; color: var(--text-2); line-height: 1.7; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#promoScheduleView .ps-kpi-sub .ps-ch { margin-left: 3px; }
#promoScheduleView .ps-kpi-dd { font-weight: 700; color: var(--brand); }

/* ── 툴바 ──────────────────────────────────────────────────── */
#promoScheduleView .ps-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; position: relative; z-index: 30; }
#promoScheduleView .ps-nav { display: flex; align-items: center; gap: 8px; }
#promoScheduleView .ps-nav [hidden] { display: none; }
/* 제목(2026년 9월) — 누르면 연·월 고르기 */
#promoScheduleView .ps-ym-wrap { position: relative; }
#promoScheduleView .ps-period { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 150px; height: 38px; padding: 0 12px; border: 0; border-radius: var(--radius-pill); background: transparent; font-size: 17px; font-weight: 800; color: var(--text); cursor: pointer; }
#promoScheduleView .ps-period:hover:not(:disabled), #promoScheduleView .ps-period[aria-expanded="true"] { background: var(--surface); box-shadow: var(--shadow-inset); }
#promoScheduleView .ps-period:focus-visible { outline: 2px solid var(--brand); outline-offset: 1px; }
#promoScheduleView .ps-period:disabled { cursor: default; }
#promoScheduleView .ps-period:disabled .ps-caret { display: none; }
#promoScheduleView .ps-caret { width: 7px; height: 7px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: translateY(-2px) rotate(45deg); }
#promoScheduleView .ps-period[aria-expanded="true"] .ps-caret { transform: translateY(1px) rotate(225deg); border-color: var(--brand); }
#promoScheduleView .ps-ympop { width: 264px; min-width: 0; left: 50%; margin-left: -132px; box-sizing: border-box; z-index: 40; }
#promoScheduleView .ps-ym-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
#promoScheduleView .ps-ym-m { height: 38px; border: 0; border-radius: var(--radius-sm); background: transparent; font-size: 13.5px; font-weight: 600; color: var(--text); cursor: pointer; }
#promoScheduleView .ps-ym-m:hover { background: var(--surface-2); }
#promoScheduleView .ps-ym-m.is-today { box-shadow: inset 0 0 0 1px var(--sage); }
#promoScheduleView .ps-ym-m.is-on { background: var(--brand); color: #fff; font-weight: 700; }
#promoScheduleView .ps-nav .btn { height: 38px; }
#promoScheduleView .ps-controls { display: flex; gap: 8px; flex-wrap: wrap; }
#promoScheduleView .ps-seg { display: inline-flex; gap: 2px; padding: 3px; height: 38px; box-sizing: border-box; background: var(--surface); border-radius: var(--radius-pill); box-shadow: var(--shadow-inset); border: 1px solid var(--line); }
#promoScheduleView .ps-seg button { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; color: var(--text-2); font-size: 13px; font-weight: 600; padding: 0 12px; border-radius: var(--radius-pill); cursor: pointer; transition: background-color .12s ease, color .12s ease; }
#promoScheduleView .ps-seg button:hover { color: var(--text); }
#promoScheduleView .ps-seg button.is-on { background: var(--sage-tint); color: var(--brand-ink); font-weight: 700; }
#promoScheduleView .ps-seg button:focus-visible { outline: 2px solid var(--brand); outline-offset: -2px; }

/* ── 본문: 달력 + 오른쪽 칸 ───────────────────────────────── */
#promoScheduleView .ps-body { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 14px; align-items: start; }
#promoScheduleView .ps-main { min-width: 0; }
#promoScheduleView .ps-side { display: grid; gap: 14px; min-width: 0; position: relative; z-index: 20; }
#promoScheduleView .ps-panel { padding: 16px 18px; overflow: visible; }   /* 날짜·시각 고르기가 칸 밖으로 떠야 해서 */
#promoScheduleView .ps-panel-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
#promoScheduleView .ps-panel-head b { font-size: 15px; }
#promoScheduleView .ps-panel-sub { font-size: 12px; color: var(--muted); margin-left: auto; }
#promoScheduleView .ps-empty { padding: 28px 12px; text-align: center; color: var(--muted); font-size: 13px; line-height: 1.7; }

/* 채널 꼬리표(자사몰 · 스마트스토어) */
/* 채널 태그 — 채널마다 색으로 구분(자사몰 세이지·스마트스토어 파랑). 앞에 색 점.
   ⚠ 달력 막대 색은 프로모션별이라 "채널은 색 아닌 글자"였지만, 태그는 별개라 사용자 요청으로 색을 준다(2026-09-30) */
#promoScheduleView .ps-ch { display: inline-flex; align-items: center; gap: 5px; height: 20px; padding: 0 9px; border: 1px solid var(--chb, var(--line-strong)); border-radius: var(--radius-pill); font-size: 11.5px; font-weight: 700; color: var(--cht, var(--text-2)); background: var(--chbg, var(--surface)); white-space: nowrap; box-sizing: border-box; }
#promoScheduleView .ps-ch > i { width: 6px; height: 6px; border-radius: 50%; background: var(--chc, var(--muted)); flex: 0 0 auto; }
#promoScheduleView .ps-ch-mall { --chc: #3F7FA6; --cht: #2E5C7A; --chb: color-mix(in srgb, #3F7FA6 35%, var(--line)); --chbg: color-mix(in srgb, #3F7FA6 8%, var(--surface)); }   /* 자사몰 = 파랑 */
#promoScheduleView .ps-ch-ss { --chc: #1F8A4C; --cht: #1A6B3B; --chb: color-mix(in srgb, #1F8A4C 35%, var(--line)); --chbg: color-mix(in srgb, #1F8A4C 8%, var(--surface)); }   /* 스마트스토어 = 초록 */
#promoScheduleView .ps-hol { font-size: 11px; color: var(--neg); font-weight: 600; }
/* 기념일(마케팅 참고) — 공휴일보다 옅게 */
#promoScheduleView .ps-sp { font-size: 11px; font-weight: 600; color: var(--muted); }
#promoScheduleView .ps-hol + .ps-sp { margin-left: 4px; }
/* 시즌 — 월간 제목 옆 */
#promoScheduleView .ps-season { background: var(--sage-tint); color: var(--brand-ink); font-size: 12px; padding: 4px 11px; }
#promoScheduleView .ps-season[hidden] { display: none; }

/* 일정 막대 — 프로모션 색을 옅게 깔고 시작 쪽에 진한 띠 */
#promoScheduleView .ps-bar { position: relative; box-sizing: border-box; height: 24px; line-height: 24px; padding: 0 10px; font-size: 12.5px; font-weight: 400; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text); text-align: center;
  background: color-mix(in srgb, var(--pc, var(--sage)) 20%, var(--surface)); }
#promoScheduleView .ps-bar.is-head { border-top-left-radius: 6px; border-bottom-left-radius: 6px; box-shadow: inset 3px 0 0 var(--pc, var(--sage)); }
#promoScheduleView .ps-bar.is-tail { border-top-right-radius: 6px; border-bottom-right-radius: 6px; }
/* 진행 중 막대 — 지금 켜져 있다는 신호. ① 정지에서도 보이게 옅은 바깥 글로우, ② 흰빛이 흐른다.
   ps-bar 는 이미 position:relative·overflow:hidden 이라 빛은 ::after 로 얹는다 */
#promoScheduleView .ps-bar.is-live { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pc, var(--sage)) 40%, transparent); }
#promoScheduleView .ps-bar.is-live::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
  background: linear-gradient(100deg, transparent 25%, rgba(255,255,255,.35) 50%, transparent 75%);
  background-size: 220% 100%; animation: psSheen 4.5s linear infinite;
}
@keyframes psSheen { 0% { background-position: 130% 0; } 100% { background-position: -130% 0; } }
/* 막대 안 채널 표시와 시각 */
#promoScheduleView .ps-bch { display: inline-block; margin-right: 6px; padding: 0 6px; border-radius: 4px; font-size: 11px; font-weight: 600; line-height: 17px; color: color-mix(in srgb, var(--pc, var(--sage)) 65%, var(--text)); background: rgba(255,255,255,.7); vertical-align: 1px; }
/* 이름 뒤 '언제까지' */
#promoScheduleView .ps-bname { font-weight: 600; }
#promoScheduleView .ps-until { margin-left: 6px; font-weight: 400; font-size: .92em; color: var(--text-2); font-variant-numeric: tabular-nums; }

/* ── 월간 달력 ─────────────────────────────────────────────── */
#promoScheduleView .ps-month { font-size: 12.5px; container-type: inline-size; }   /* 주 높이를 달력 너비에 맞추려고(cqw) */
#promoScheduleView .ps-wd { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background: var(--thead-bg); color: var(--text-2); font-weight: 700; }
#promoScheduleView .ps-wd div { padding: 9px 10px; text-align: center; }
#promoScheduleView .ps-wd .is-sun { color: var(--neg); }
#promoScheduleView .ps-week { position: relative; border-top: 1px solid var(--line); }
#promoScheduleView .ps-week-bg { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); min-height: 112px; }  /* 실제 높이는 JS(drawMonth)가 그 주 막대 줄 수에 맞춰 준다 */
#promoScheduleView .ps-cell { display: flex; align-items: flex-start; justify-content: center; gap: 5px; padding: 7px 9px; border: 0; border-left: 1px solid var(--line); background: var(--surface); text-align: center; cursor: pointer; min-width: 0; }
#promoScheduleView .ps-cell:first-child { border-left: 0; }
#promoScheduleView .ps-cell:hover { background: var(--surface-3); }
#promoScheduleView .ps-cell .ps-hol, #promoScheduleView .ps-cell .ps-sp { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 22px; min-width: 0; }
#promoScheduleView .ps-date { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; border-radius: var(--radius-pill); font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
#promoScheduleView .ps-cell.is-red .ps-date { color: var(--neg); }
#promoScheduleView .ps-cell.is-out { background: var(--surface-3); }
#promoScheduleView .ps-cell.is-out .ps-date { color: var(--muted); opacity: .6; }
#promoScheduleView .ps-cell.is-today .ps-date { background: var(--brand); color: #fff; animation: psToday 2.2s ease-out infinite; }
@keyframes psToday {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--brand) 60%, transparent); }
  70%  { box-shadow: 0 0 0 11px color-mix(in srgb, var(--brand) 0%, transparent); }
  100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--brand) 0%, transparent); }
}
#promoScheduleView .ps-cell.is-sel { background: var(--sage-tint-3); box-shadow: inset 0 0 0 2px var(--sage); }
#promoScheduleView .ps-week-fg { position: absolute; left: 0; right: 0; top: 36px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-rows: 24px; row-gap: 4px; padding: 0 3px; pointer-events: none; }
#promoScheduleView .ps-week-fg .ps-bar { pointer-events: auto; cursor: pointer; margin: 0 1px; }
#promoScheduleView .ps-more { font-size: 11.5px; color: var(--muted); font-weight: 600; text-align: center; line-height: 24px; }

/* ── 주간 시간표 ───────────────────────────────────────────── */
#promoScheduleView .ps-tl { font-size: 12.5px; }
#promoScheduleView .ps-tl-head, #promoScheduleView .ps-tl-row { display: grid; grid-template-columns: 190px minmax(0, 1fr); }
#promoScheduleView .ps-tl-head { background: var(--thead-bg); color: var(--text-2); }
#promoScheduleView .ps-tl-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
#promoScheduleView .ps-tl-day { padding: 8px 6px 4px; border-left: 1px solid var(--line-2); display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 0; }
#promoScheduleView .ps-tl-day b { font-weight: 700; }
#promoScheduleView .ps-tl-day.is-red b { color: var(--neg); }
#promoScheduleView .ps-tl-day.is-today b { color: var(--brand-ink); }
#promoScheduleView .ps-tl-day.is-today { background: var(--sage-tint); }
#promoScheduleView .ps-ticks { display: flex; justify-content: space-between; align-self: stretch; font-size: 10px; color: var(--muted); padding-top: 4px; margin-top: auto; }
#promoScheduleView .ps-tl-day { cursor: pointer; }
#promoScheduleView .ps-tl-day:hover { background: var(--surface-3); }
#promoScheduleView .ps-tl-day.is-sel { box-shadow: inset 0 -2px 0 var(--brand); }
#promoScheduleView .ps-ticks i { font-style: normal; width: 25%; }
#promoScheduleView .ps-tl-row { border-top: 1px solid var(--line); }
#promoScheduleView .ps-tl-row:nth-child(odd) { background: rgba(243,244,246,.5); }
#promoScheduleView .ps-tl-name { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 10px 12px; min-width: 0; }
#promoScheduleView .ps-tl-name span:last-child { max-width: 100%; white-space: normal; }
#promoScheduleView .ps-tl-name span:last-child { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 하루 칸(1/7)마다 진한 선, 6시간(1/28)마다 옅은 선 */
#promoScheduleView .ps-tl-track { position: relative; min-height: 52px;
  background-image:
    linear-gradient(to right, var(--line-2) 1px, transparent 1px),
    linear-gradient(to right, var(--grid) 1px, transparent 1px);
  background-size: calc(100% / 7) 100%, calc(100% / 28) 100%; }
#promoScheduleView .ps-tl-track .ps-bar { position: absolute; top: 50%; transform: translateY(-50%); height: 28px; line-height: 28px; display: flex; justify-content: space-between; gap: 8px; padding: 0 10px; font-size: 12px; font-weight: 500; }
#promoScheduleView .ps-tl-track .ps-bar span { overflow: hidden; text-overflow: ellipsis; }
#promoScheduleView .ps-now { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: var(--neg); }

/* ── 목록 ──────────────────────────────────────────────────── */
#promoScheduleView .ps-list th, #promoScheduleView .ps-list td { text-align: center; }
#promoScheduleView .ps-list th.ps-left, #promoScheduleView .ps-list td.ps-left { text-align: left; }
#promoScheduleView .ps-list td { white-space: nowrap; }
#promoScheduleView .ps-list td:last-child { white-space: normal; min-width: 200px; color: var(--text-2); }
#promoScheduleView .ps-list tr.is-done td { color: var(--muted); }
#promoScheduleView .ps-st.is-live { background: var(--pos-bg); color: var(--pos); }
#promoScheduleView .ps-st.is-soon { background: var(--sage-tint-2); color: var(--brand); }
#promoScheduleView .ps-st.is-done { background: var(--surface-2); color: var(--muted); }
#promoScheduleView .ps-warn { display: inline-block; font-size: 11px; font-weight: 600; color: var(--chart-line-ink); background: color-mix(in srgb, var(--chart-line) 10%, var(--surface)); border-radius: var(--radius-pill); padding: 1px 8px; margin: 1px 0; cursor: help; }

/* ── 하루 시간표 ───────────────────────────────────────────── */
#promoScheduleView .ps-hours { display: flex; justify-content: space-between; font-size: 10.5px; color: var(--muted); margin-bottom: 4px; }
#promoScheduleView .ps-hours i { font-style: normal; }
#promoScheduleView .ps-dayrow { padding: 8px 0; border-top: 1px solid var(--line); }
#promoScheduleView .ps-dayrow-top { display: flex; align-items: center; gap: 8px; min-width: 0; margin-bottom: 6px; }
#promoScheduleView .ps-dayrow-top b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#promoScheduleView .ps-tag { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--brand); background: var(--sage-tint); border-radius: var(--radius-pill); padding: 1px 8px; white-space: nowrap; }
#promoScheduleView .ps-daytrack { position: relative; height: 14px; border-radius: 4px; background-color: var(--surface-2);
  background-image: linear-gradient(to right, var(--line-strong) 1px, transparent 1px);
  background-size: 25% 100%; }
#promoScheduleView .ps-daytrack .ps-bar { position: absolute; top: 0; height: 14px; line-height: 14px; padding: 0; }
#promoScheduleView .ps-dayrow-time { font-size: 12px; color: var(--text-2); margin-top: 4px; font-variant-numeric: tabular-nums; }

/* ── 추가 버튼 · 저장 안내 · 누르는 곳 ─────────────────────── */
#promoScheduleView .ps-add-btn { width: auto; height: 38px; padding: 0 16px; font-size: 13px; gap: 6px; }
#promoScheduleView .ps-add-btn svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; }
#promoScheduleView .ps-tl-row, #promoScheduleView .ps-row, #promoScheduleView .ps-dayrow { cursor: pointer; }
#promoScheduleView .ps-row:hover td, #promoScheduleView .ps-tl-row:hover { background: var(--sage-tint-3); }
#promoScheduleView .ps-dayrow:hover b { color: var(--brand); }

/* ── 추가·수정 창 ──────────────────────────────────────────── */
#promoScheduleView .ps-modal .ps-mcard { max-width: 560px; max-height: calc(100vh - 40px); display: flex; flex-direction: column; box-sizing: border-box; }
#promoScheduleView .ps-mbody { overflow-y: auto; margin: 14px -6px 0; padding: 0 6px; }
#promoScheduleView .ps-modal .field { margin-bottom: 14px; }
#promoScheduleView .ps-modal .field > label { display: block; font-size: 12px; font-weight: 600; color: var(--text-2); margin-bottom: 6px; }
#promoScheduleView .ps-modal .field input[type="text"], #promoScheduleView .ps-modal textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-md); font: inherit; font-size: 14px; color: var(--text); background: var(--surface); }
#promoScheduleView .ps-modal textarea { resize: vertical; line-height: 1.5; }
#promoScheduleView .ps-modal input:focus, #promoScheduleView .ps-modal textarea:focus { outline: 2px solid var(--brand); outline-offset: -1px; border-color: transparent; }
#promoScheduleView .ps-modal input[aria-invalid="true"] { border-color: var(--neg); }
#promoScheduleView .ps-hint { margin: -2px 0 8px; font-size: 12px; color: var(--muted); }
#promoScheduleView .ps-chrow { display: flex; align-items: center; gap: 10px; padding: 8px 0; flex-wrap: wrap; }
#promoScheduleView .ps-chrow + .ps-chrow { border-top: 1px solid var(--line); }
#promoScheduleView .ps-chtoggle { display: inline-flex; align-items: center; gap: 6px; width: 118px; height: 36px; padding: 0 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-pill); background: var(--sage-tint); color: var(--brand-ink); font-size: 13px; font-weight: 700; cursor: pointer; flex: 0 0 auto; }
#promoScheduleView .ps-chrow.is-off .ps-chtoggle { background: var(--surface); color: var(--muted); font-weight: 600; }
/* 켜짐 표시(체크 모양) */
#promoScheduleView .ps-check { width: 14px; height: 14px; border-radius: 4px; background: var(--brand); position: relative; flex: 0 0 auto; }
#promoScheduleView .ps-check::after { content: ""; position: absolute; left: 4px; top: 1px; width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
#promoScheduleView .ps-chrow.is-off .ps-check { background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--line-strong); }
#promoScheduleView .ps-chrow.is-off .ps-check::after { display: none; }
/* 달력 색 고르기 */
#promoScheduleView .ps-chrow.is-off .ps-range { opacity: .4; pointer-events: none; }
#promoScheduleView .ps-range { display: flex; align-items: center; gap: 6px; flex: 1 1 300px; min-width: 0; }
#promoScheduleView .ps-tilde { color: var(--muted); }
#promoScheduleView .ps-dt { position: relative; display: flex; gap: 4px; flex: 1 1 0; min-width: 0; }
#promoScheduleView .ps-dbtn { display: inline-flex; align-items: center; gap: 6px; flex: 1 1 auto; min-width: 0; height: 36px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); font-size: 13px; color: var(--text); cursor: pointer; white-space: nowrap; }
#promoScheduleView .ps-dbtn:hover { border-color: var(--sage); background: var(--surface-3); }
#promoScheduleView .ps-dbtn[aria-expanded="true"] { border-color: var(--brand); box-shadow: 0 0 0 3px var(--sage-tint); }
#promoScheduleView .ps-dbtn svg { width: 15px; height: 15px; stroke: var(--brand); fill: none; stroke-width: 1.75; stroke-linecap: round; flex: 0 0 auto; }
#promoScheduleView .ps-dbtn span { overflow: hidden; text-overflow: ellipsis; }
/* 위 입력칸 규칙(width:100%)보다 우선해야 해서 선택자를 한 단계 더 붙였다 */
#promoScheduleView .ps-modal .field input.ps-time { width: 62px; flex: 0 0 auto; height: 36px; padding: 0 6px; text-align: center; font-size: 13px; font-variant-numeric: tabular-nums; border-radius: var(--radius-sm); }
#promoScheduleView .ps-modal .modal-actions { justify-content: flex-end; }
#promoScheduleView .ps-merr { margin: 4px 0 0; font-size: 12.5px; font-weight: 600; color: var(--neg); }
#promoScheduleView .ps-merr[hidden] { display: none; }
#promoScheduleView .ps-grow { flex: 1 1 auto; }
#promoScheduleView .ps-modal .modal-actions .btn-primary { flex: 0 0 auto; width: auto; padding-left: 22px; padding-right: 22px; }
#promoScheduleView .ps-del { color: var(--neg); }
#promoScheduleView .ps-cdesc { margin: 8px 0 0; font-size: 13px; color: var(--text-2); line-height: 1.6; }
#promoScheduleView .ps-confirm { z-index: 130; }
#promoScheduleView .ps-confirm .modal-actions { justify-content: flex-end; }

/* 날짜 고르기 */
#promoScheduleView .ps-dp { width: 280px; min-width: 0; box-sizing: border-box; z-index: 40; }
#promoScheduleView .ps-dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
#promoScheduleView .ps-dp-head .icon-btn { width: 30px; height: 30px; }
#promoScheduleView .ps-dp-head .icon-btn svg { width: 15px; height: 15px; }
#promoScheduleView .ps-dp-head b { font-size: 14px; }
#promoScheduleView .ps-dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
#promoScheduleView .ps-dp-wd { font-size: 11px; font-weight: 700; color: var(--muted); padding: 4px 0; }
#promoScheduleView .ps-dp-day { height: 32px; border: 0; border-radius: var(--radius-pill); background: transparent; font-size: 13px; color: var(--text); cursor: pointer; font-variant-numeric: tabular-nums; }
#promoScheduleView .ps-dp-day:hover { background: var(--surface-2); }
#promoScheduleView .ps-dp-day.is-out { color: var(--muted); opacity: .5; }
#promoScheduleView .ps-dp-wd.is-red, #promoScheduleView .ps-dp-day.is-red { color: var(--neg); }
#promoScheduleView .ps-dp-day.is-today { box-shadow: inset 0 0 0 1px var(--sage); }
#promoScheduleView .ps-dp-day.is-on { background: var(--brand); color: #fff; font-weight: 700; }

/* 시각 고르기(30분 간격 목록) */
#promoScheduleView .ps-tp { width: 96px; min-width: 0; max-height: 232px; overflow-y: auto; padding: 4px; box-sizing: border-box; display: flex; flex-direction: column; gap: 1px; z-index: 61; }
#promoScheduleView .ps-tp-opt { flex: 0 0 auto; height: 30px; border: 0; border-radius: 8px; background: transparent; font-size: 13px; color: var(--text); cursor: pointer; font-variant-numeric: tabular-nums; }
#promoScheduleView .ps-tp-opt:hover { background: var(--surface-2); }
#promoScheduleView .ps-tp-opt.is-on { background: var(--brand); color: #fff; font-weight: 700; }
/* 수정 창 기간의 종료 날짜는 오른쪽 끝이라 왼쪽으로 펼친다(창 밖으로 잘리지 않게) */
#promoScheduleView .ps-modal .ps-range .ps-dt:last-child .ps-dp { left: auto; right: 0; }

/* 토스트(본체 toast() 가 없을 때만 쓰인다 — 미리보기) */
#promoScheduleView .ps-toast { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); z-index: 140; padding: 11px 18px; border-radius: var(--radius-md); background: var(--surface); color: var(--text); font-size: 13px; font-weight: 600; box-shadow: var(--shadow-pop); border-left: 3px solid var(--pos); }
#promoScheduleView .ps-toast.is-err { border-left-color: var(--neg); color: var(--neg); }

/* ── 좁은 화면 ─────────────────────────────────────────────── */
@media (max-width: 1024px) {
  #promoScheduleView .ps-body { grid-template-columns: minmax(0, 1fr); }
  #promoScheduleView .ps-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  #promoScheduleView .ps-range { flex-wrap: wrap; }
  #promoScheduleView .ps-dt { flex: 1 1 100%; }
  #promoScheduleView .ps-tilde { display: none; }
  #promoScheduleView .ps-summary, #promoScheduleView .ps-side { grid-template-columns: minmax(0, 1fr); }
  #promoScheduleView .ps-main { overflow-x: auto; }
  #promoScheduleView .ps-month, #promoScheduleView .ps-tl { min-width: 680px; }
}
@media (prefers-reduced-motion: reduce) {
  #promoScheduleView .ps-seg button { transition: none; }
  #promoScheduleView .ps-in { animation: none; }
  #promoScheduleView .ps-cell.is-today .ps-date { animation: none; }
  #promoScheduleView .ps-bar.is-live::after { animation: none; display: none; }
  #promoScheduleView .ps-kpi-live .ps-kpi-dot { animation: none; }
}