/* Main dashboard follows the classic MaxsPOS hierarchy, using Taro POS's blue. */
/* Override the editable-field grid used by the fallback dashboard. */
.dashboard-range-filter.dashboard-reference-filter { display:flex; }
.dashboard-reference-filter .dashboard-outlet-filter { display:flex; flex-direction:row; align-items:center; }
@media(min-width:1201px) {
  .dashboard-reference-filter .dashboard-range-picker { flex-basis:350px; }
  .dashboard-reference-filter .dashboard-outlet-filter { flex-basis:260px; }
}
.dashboard-overview { display:grid; gap:18px; min-width:0; }
.dashboard-overview > .sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.dashboard-overview > :is(.dashboard-range-filter,.dashboard-compact-summary,.dashboard-business) { margin:0; border-radius:6px; box-shadow:none; }
.dashboard-reference-filter { align-items:center; padding:16px; gap:16px; }
.dashboard-range-picker { position:relative; flex:0 1 390px; min-width:0; }
.dashboard-range-picker > summary { display:flex; align-items:center; gap:10px; list-style:none; min-height:46px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; color:var(--ink); font-size:15px; cursor:pointer; }
.dashboard-range-picker > summary::-webkit-details-marker { display:none; }
.dashboard-range-picker > summary > span:nth-child(2) { min-width:0; overflow-wrap:anywhere; flex:1; }
.dashboard-reference-filter svg { flex:0 0 20px; width:20px; height:20px; color:var(--muted); }
.dashboard-range-picker > form { position:absolute; z-index:20; top:calc(100% + 8px); left:0; width:450px; max-width:calc(100vw - 48px); padding:20px; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 12px 38px #193b5322; }
.dashboard-range-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.dashboard-range-fields label { min-width:0; }
.dashboard-range-fields .button { width:100%; justify-content:flex-start; }
.dashboard-range-fields input { min-width:0; }
.dashboard-range-fields label > span { color:var(--muted); font-weight:400; }
.dashboard-range-actions { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.dashboard-range-error:empty { display:none; }
.dashboard-range-error { color:var(--red); font-size:14px; }
.dashboard-outlet-filter { display:flex; flex-direction:row; align-items:center; gap:10px; flex:0 1 310px; min-width:0; }
.dashboard-outlet-filter select { min-width:0; border-radius:6px; }
.dashboard-reference-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:10px; margin-left:auto; min-width:0; }
.dashboard-view-switch { display:flex; justify-content:flex-end; min-width:0; margin:-9px 0 17px; }
.dashboard-view-switch > .dashboard-view-tabs { margin:0; }
.dashboard-reference-actions .dashboard-view-tabs { margin:0; border:0; box-shadow:none; background:var(--cream); }
.dashboard-reference-actions .dashboard-view-tabs button { min-width:0; }
.dashboard-overview .dashboard-summary-cell,.dashboard-overview .dashboard-summary-placeholder { min-height:110px; }
.dashboard-overview .dashboard-summary-label { font-size:15px; align-items:flex-start; }
.dashboard-overview .dashboard-summary-value strong { font-size:20px; }
.dashboard-overview .dashboard-summary-icon { border-radius:6px; }
.dashboard-overview .dashboard-business { padding:20px; }
body.backoffice-mode #main-content .dashboard-overview h2 { font-size:18px; font-weight:650; }
.dashboard-overview .dashboard-business-layout { grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr); align-items:center; padding-top:24px; gap:28px; }
.dashboard-chart-plot { display:flex; gap:10px; min-width:0; }
.dashboard-y-axis { display:flex; flex:0 0 72px; flex-direction:column; justify-content:space-between; align-items:flex-end; height:280px; padding-bottom:18px; color:var(--muted); font-size:13px; }
.dashboard-chart-canvas { min-width:0; flex:1; }
.dashboard-overview .dashboard-sales-line { display:block; width:100%; height:280px; min-height:0; overflow:hidden; }
.dashboard-x-axis { position:relative; min-height:26px; color:var(--muted); font-size:13px; }
.dashboard-x-axis span { position:absolute; top:0; transform:translateX(-50%); white-space:nowrap; }
.dashboard-x-axis span:first-child { transform:none; }
.dashboard-x-axis span:last-child { transform:translateX(-100%); }
.dashboard-overview .dashboard-business-note { padding-top:16px; color:var(--muted); font-size:13px; line-height:1.5; }
.dashboard-overview .dashboard-payment-donut { width:190px; height:190px; padding:28px; }
.dashboard-overview .dashboard-payment-donut strong { font-size:17px; }
.dashboard-overview .dashboard-payment-legend { font-size:14px; }
.dashboard-overview .dashboard-payment-legend > div { display:grid; grid-template-columns:9px minmax(0,1fr) auto auto; gap:8px; margin:10px 0; align-items:center; }
.dashboard-overview .dashboard-payment-legend strong { font-weight:650; }
.dashboard-ranking-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; min-width:0; }
.dashboard-ranking-card { min-width:0; padding:18px 16px; border-radius:6px; box-shadow:none; }
.dashboard-ranking-card h2 { margin:0 0 16px; }
.dashboard-ranking-scroll { max-width:100%; overflow-x:auto; }
.dashboard-ranking-table { width:100%; border-collapse:collapse; font-size:15px; }
.dashboard-ranking-table :is(th,td) { text-align:left; padding:14px 10px; border-bottom:1px solid var(--line); vertical-align:middle; }
.dashboard-ranking-table thead { background:#f0f5f8; color:var(--muted); }
.dashboard-ranking-table th { font-weight:650; text-transform:none; letter-spacing:normal; }
body.backoffice-mode #main-content .dashboard-ranking-table tbody th { font-size:15px !important; }
.dashboard-ranking-table :is(th,td):first-child { width:42px; }
.dashboard-ranking-table :is(th,td):nth-child(3) { width:65px; text-align:right; }
.dashboard-ranking-table :is(th,td):last-child { min-width:110px; text-align:right; white-space:nowrap; }
.dashboard-ranking-table .dashboard-category-child td { color:var(--muted); font-size:13px !important; padding-top:8px; padding-bottom:8px; }
.dashboard-category-child td:nth-child(2) { padding-left:24px; }
.dashboard-ranking-item { display:flex; align-items:center; gap:10px; min-width:0; }
.dashboard-ranking-item > span:last-child { min-width:0; overflow-wrap:anywhere; }
.dashboard-ranking-item small { display:block; color:var(--muted); margin-top:4px; font-weight:400; }
.dashboard-ranking-image { position:relative; display:grid; place-items:center; width:44px; height:44px; flex:0 0 44px; overflow:hidden; border-radius:5px; background:var(--mint); color:var(--green); }
.dashboard-ranking-image img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.dashboard-ranking-empty { color:var(--muted); padding:28px 10px !important; white-space:normal !important; }
body.backoffice-mode #main-content .dashboard-ranking-note { color:var(--muted); font-size:13px; margin:0; }
.dashboard-overview .dashboard-more > summary { font-size:15px; }
@media(max-width:1200px) {
  .dashboard-reference-actions { flex-basis:100%; margin-left:0; }
  .dashboard-ranking-grid { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:900px) {
  .dashboard-overview .dashboard-business-layout { grid-template-columns:minmax(0,1fr); }
  .dashboard-overview .dashboard-compact-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-overview .dashboard-summary-placeholder { display:none; }
  .dashboard-overview .dashboard-summary-cell { border-top:1px solid var(--line); }
  .dashboard-overview .dashboard-summary-cell:nth-child(even) { border-right:0; }
  .dashboard-overview .dashboard-summary-cell:nth-child(-n+2) { border-top:0; }
}
@media(max-width:560px) {
  .dashboard-reference-filter { gap:12px; }
  .dashboard-range-picker,.dashboard-outlet-filter { flex-basis:100%; }
  .dashboard-range-picker > form { width:calc(100vw - 64px); }
  .dashboard-reference-filter .dashboard-reference-actions { width:100%; }
  .dashboard-overview .dashboard-business { padding:16px 10px; }
  .dashboard-y-axis { flex-basis:55px; font-size:12px; }
  .dashboard-x-axis { font-size:12px; }
  .dashboard-x-axis span:nth-child(even):not(:last-child) { display:none; }
  .dashboard-ranking-card { padding:16px 10px; }
  .dashboard-ranking-table { min-width:400px; }
}
