/*
 * backoffice: the Back Office section on the venue page and the two report
 * tabs. Only what core.css does not already draw: the drink grid, the tabs
 * strip, the ledger and payout rows, the platform panel's two columns, the
 * onboarding steps and the funnel.
 */

.bo-chart-wrap{ position:relative; height:200px; margin:14px 0; }
.bo-up{ color:var(--green-dot); font-weight:600; }
.bo-down{ color:var(--brick); font-weight:600; }

/* The tab strip under the cards: text tabs with a rule, so it reads as one
   section's parts rather than five panels. */
.bo-tabs{ display:flex; gap:4px; border-bottom:1px solid var(--line); margin:6px 0 12px; flex-wrap:wrap; }
.bo-tab{ font:inherit; font-size:13px; font-weight:500; padding:8px 12px; border:none; border-bottom:2px solid transparent; background:transparent; color:var(--ink-soft); cursor:pointer; margin-bottom:-1px; }
.bo-tab:hover{ color:var(--ink); }
.bo-tab.active{ color:var(--ink); border-bottom-color:var(--mustard); }
.bo-tab .count{ font-family:var(--font-mono); font-size:11px; color:var(--text-muted); }

.bo-toolbar{ display:flex; align-items:center; gap:10px; margin-bottom:12px; flex-wrap:wrap; }

/* Drinks: a card per drink, the photo on top, like the menu a guest sees. */
.bo-drink-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:12px; }
.bo-drink{ background:var(--panel-bg); border:var(--panel-border); border-radius:var(--panel-radius); box-shadow:var(--panel-shadow); overflow:hidden; cursor:pointer; }
.bo-drink:hover{ border-color:var(--line-strong); }
.bo-drink.unavailable{ opacity:0.6; }
.bo-drink-photo{ height:96px; background:var(--subtle-bg); display:flex; align-items:center; justify-content:center; color:var(--text-muted); }
.bo-drink-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.bo-drink-photo .ic{ width:26px; height:26px; }
.bo-drink-body{ padding:10px 12px; }
.bo-drink-name{ font-weight:500; font-size:13px; margin-bottom:2px; }

.bo-days{ display:flex; gap:10px; flex-wrap:wrap; }
.bo-days label{ display:flex; align-items:center; gap:4px; font-size:12px; }
.bo-days input{ width:14px; height:14px; margin:0; }

.row.bo-listing{ grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr) auto; }
.row.bo-gift{ grid-template-columns:minmax(0,1.3fr) minmax(0,1.6fr) minmax(0,1fr) minmax(0,0.7fr) minmax(0,0.8fr) minmax(0,0.8fr) minmax(0,1.3fr); font-size:13px; }
.row.bo-payout{ grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.4fr); }
.row .right{ text-align:right; }
.row .mono{ font-family:var(--font-mono); }
.bo-pager{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:12px; }

/* The platform panel: the seven steps beside the editable facts. */
.bo-platform{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.6fr); gap:24px; }
.bo-platform-col h3{ margin:0 0 10px; font-size:14px; }
.bo-steps{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.bo-steps li{ display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid var(--line); border-radius:var(--radius); color:var(--ink-soft); font-size:13px; }
.bo-steps li.done{ color:var(--ink); border-color:transparent; background:var(--sage-soft); }
.bo-steps li.done .bo-step-n{ color:var(--sage-ink); }
.bo-step-n{ font-family:var(--font-display); font-weight:700; font-size:15px; color:var(--mustard); min-width:24px; }

/* The onboarding funnel on the report. */
.bo-funnel{ display:flex; flex-direction:column; gap:8px; }
.bo-funnel-row{ display:grid; grid-template-columns:32px minmax(0,160px) minmax(0,1fr) 40px; align-items:center; gap:10px; font-size:13px; }
.bo-funnel-bar{ display:block; height:14px; background:var(--subtle-bg); border-radius:7px; overflow:hidden; }
.bo-funnel-bar span{ display:block; height:100%; background:var(--mustard); border-radius:7px; }
.bo-two-col{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 24px; }

@media (max-width:900px){
  .bo-platform, .bo-two-col{ grid-template-columns:1fr; }
  .row.bo-gift{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .row.bo-gift.head{ display:none; }
}