/* Sales charts share the site's typography tokens and colors. */
.sales-report-layout { display: grid; gap: 1.75rem; grid-template-columns: minmax(0,1fr) minmax(0,1.9fr); align-items: start; }
.sales-analytics { min-width: 0; }
.sales-title-row, .sales-period-nav, .sales-summary, .daily-sales-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.sales-title-row { margin-bottom: 1.25rem; }
.sales-mode-switch { display: inline-flex; border: 1px solid var(--line); border-radius: .375rem; padding: .1875rem; gap: .125rem; }
.sales-mode-switch button { min-width: 2.75rem; min-height: 2.75rem; padding: .375rem .75rem; border-radius: .25rem; }
.sales-mode-switch [aria-pressed=true] { color: #fff; background: #33372a; }
.sales-period-nav { justify-content: flex-start; gap: .5rem; margin-bottom: 1.25rem; }
.sales-nav-arrow { min-width: 2.75rem; min-height: 2.75rem; padding: .375rem; }
.sales-period-label { font-size: var(--type-body); font-weight: var(--weight-semibold); text-align: center; }
.sales-period-nav .text-link { margin-left: auto; }
.sales-summary { align-items: flex-end; }
.sales-summary p { font-size: var(--type-caption); line-height: var(--leading-caption); }
.sales-summary-dot { padding: 0 .375rem; }
.sales-picker, .sales-day-control label { margin: 0; color: var(--muted); font-size: var(--type-caption); font-weight: var(--weight-regular); line-height: var(--leading-caption); }
.sales-picker input { margin-top: .375rem; width: 10.5rem; max-width: 100%; }
.sales-chart { display: flex; gap: .5rem; margin-top: 1.75rem; }
.sales-y-axis { display: flex; flex-direction: column; justify-content: space-between; height: 12rem; min-width: 4.75rem; text-align: right; flex-shrink: 0; color: var(--muted); font-size: var(--type-caption); line-height: var(--leading-caption); font-variant-numeric: tabular-nums; }
.sales-y-axis span { white-space: nowrap; }
.sales-y-axis span:first-child { transform: translateY(-50%); }
.sales-y-axis span:last-child { transform: translateY(50%); }
.sales-chart-scroll { min-width: 0; flex: 1; overflow-x: auto; scrollbar-width: thin; overscroll-behavior-x: contain; padding-bottom: .5rem; position: relative; }
.sales-chart-points { --sales-point-min: 1.375rem; display: grid; grid-template-columns: repeat(var(--sales-points),minmax(var(--sales-point-min),1fr)); min-width: calc(var(--sales-points) * var(--sales-point-min)); height: 14rem; background: repeating-linear-gradient(to top,transparent 0,transparent calc(6rem - 1px),var(--line) calc(6rem - 1px),var(--line) 6rem); background-size: 100% 12rem; background-repeat: no-repeat; border-left: 1px solid var(--line); }
.sales-point { display: flex; flex-direction: column; align-items: stretch; gap: .5rem; height: 14rem; min-height: 0; padding: 0 .1875rem; border-radius: .25rem .25rem 0 0; text-align: center; position: relative; }
.sales-point:hover { opacity: 1; background: #dcdccc66; }
.sales-point:focus-visible { outline-offset: -2px; z-index: 1; }
.sales-bar-track { height: 12rem; display: flex; align-items: flex-end; justify-content: center; border-bottom: 1px solid #8d9080; }
.sales-chart-bar { display: block; width: 100%; max-width: 3.5rem; background: #858c72; border-radius: .2rem .2rem 0 0; min-height: 2px; }
.sales-point[aria-pressed=true] .sales-chart-bar { background: #4e5143; }
.sales-point[aria-pressed=true] .sales-x-label { color: var(--ink); font-weight: var(--weight-bold); }
.sales-point.is-zero .sales-chart-bar { min-height: 0; }
.sales-point.is-zero[aria-pressed=true] .sales-bar-track { border-bottom: 3px solid #4e5143; }
.sales-x-label { display: block; white-space: nowrap; color: var(--muted); font-size: var(--type-caption); font-weight: var(--weight-regular); line-height: var(--leading-caption); }
.sales-point:first-child .sales-x-label { text-align: left; }
.sales-point:last-child .sales-x-label { text-align: right; }
.sales-chart-help, .sales-sample-note { margin-top: .75rem; font-size: var(--type-caption); line-height: var(--leading-caption); color: var(--muted); }
.sales-selected-summary { display: flex; align-items: baseline; flex-wrap: wrap; gap: .5rem 1rem; border: 1px solid var(--line); border-radius: .375rem; background: #ebe8de; padding: .75rem 1rem; margin-top: 1rem; }
.sales-selected-summary > span { font-size: var(--type-caption); }
.sales-selected-summary strong, .daily-sales-total strong { font-size: var(--type-price); font-weight: var(--weight-semibold); line-height: var(--leading-price); }
.sales-selected-summary .text-link { margin-left: auto; }
.sales-empty-notice { margin-top: 1rem; font-size: var(--type-caption); color: var(--muted); }
.daily-sales { grid-column: 1 / -1; margin-top: 0; border: 1px solid var(--line); border-radius: .625rem; padding: 1.75rem; min-width: 0; }
.daily-sales-heading > div > p { margin-top: .5rem; font-size: var(--type-caption); color: var(--muted); }
.sales-day-control { display: flex; align-items: flex-end; gap: .5rem; min-width: 0; }
.sales-day-control input { margin-top: .375rem; width: 11rem; }
.daily-sales-total { margin: 1.5rem 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .75rem 1.5rem; }
.daily-sales-total > span { font-size: var(--type-caption); }
.daily-sales-table { min-width: 37rem; }
.daily-sales-table :is(td,th) { padding-top: 1rem; padding-bottom: 1rem; }
.daily-sales-table th:first-child { width: 6.5rem; }
.daily-sales-table .sale-time { vertical-align: middle; }
.daily-sales-table .numeric-cell { min-width: 5rem; }
.daily-sales-table .numeric-cell:last-child { min-width: 8.5rem; }
.sold-product { display: flex; align-items: center; gap: .875rem; min-width: 15rem; max-width: 42rem; }
.sold-product-thumb { width: 3.75rem; height: 4rem; flex-shrink: 0; border-radius: .25rem; }
.sold-product > div:last-child { min-width: 0; }
.sold-product-name { display: block; font-size: var(--type-body); font-weight: var(--weight-regular); line-height: var(--leading-body); white-space: normal; overflow-wrap: anywhere; }
.sold-product-meta { display: block; margin-top: .25rem; color: var(--muted); font-size: var(--type-caption); white-space: normal; }
.sold-product-meta > span { padding: 0 .25rem; }
.daily-sales-table tfoot :is(th,td) { border-top: 2px solid var(--line); font-weight: var(--weight-semibold); }
.daily-sales .empty { border-top: 1px solid var(--line); }
@media(max-width:1100px) { .sales-report-layout { display: grid; gap: 1.75rem; grid-template-columns: minmax(0,1fr) minmax(0,1.4fr); } }
/* Keep the reference's payout-left/chart-right layout at tablet and app-panel widths. */
@media(min-width:768px) and (max-width:1100px) {
  .sales-picker { display: flex; flex-direction: column; max-width: 100%; }
}
@media(max-width:767px) {
  .sales-report-layout { display: flex; flex-direction: column; }
  .sales-report-layout > section { width: 100%; }
  .sales-analytics { order: 1; }
  .daily-sales { order: 2; }
  .sales-payout-card { order: 3; }
}
@media(max-width:650px) {
  .sales-chart-points { --sales-point-min: 2rem; }
  .sales-analytics, .daily-sales { padding: 1.25rem 1rem; }
  .sales-title-row { gap: .875rem; }
  .sales-title-row h2 { flex-basis: 100%; }
  .sales-mode-switch { width: 100%; }
  .sales-mode-switch button { flex: 1; }
  .sales-period-nav { gap: .5rem; }
  .sales-period-nav .text-link { flex-basis: 100%; width: max-content; margin: .25rem 0 0; flex-grow: 0; }
  .sales-period-label { max-width: calc(100% - 6.5rem); white-space: normal; }
  .sales-picker { flex-basis: 100%; margin-top: .5rem; }
  .sales-picker input { width: 100%; }
  .sales-summary { gap: .5rem; }
  .sales-y-axis { min-width: 4.5rem; }
  .sales-chart { gap: .25rem; }
  .sales-selected-summary { padding: .75rem; gap: .5rem .75rem; }
  .sales-selected-summary .text-link { flex-basis: 100%; margin-left: 0; }
  .sales-day-control { width: 100%; }
  .sales-day-control label { flex: 1; }
  .sales-day-control input { width: 100%; }
  .daily-sales-total { gap: .5rem 1rem; }
  .daily-sales-table { min-width: 0; }
  .daily-sales-table thead, .daily-sales-table tfoot { display: none; }
  .daily-sales-table tbody { display: grid; }
  .daily-sales-table tr { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .625rem; padding: 1rem 0; border-top: 1px solid var(--line); }
  .daily-sales-table td { display: block; padding: 0; border: 0; min-width: 0 !important; }
  .daily-sales-table td:first-child { grid-column: 1 / -1; }
  .daily-sales-table td:nth-child(2) { grid-column: 1 / -1; }
  .daily-sales-table td:nth-child(3) { grid-column: 1; text-align: left; color: var(--muted); }
  .daily-sales-table td:nth-child(3)::before { content: '数量 '; }
  .daily-sales-table td:last-child { grid-column: 2; font-size: var(--type-price); font-weight: var(--weight-semibold); }
  .daily-sales-table td:last-child .money { font-size: inherit; font-weight: inherit; }
  .sold-product { min-width: 0; }
}
