/* Baanbai POS visual system: tablet-first, Loyverse-inspired interaction patterns, original branding. */
:root { --green:#24764e; --green-soft:#e0f0e6; --bg:#f3f5f4; --line:#dfe6df; --muted:#687568; }
body { background:var(--bg); }
.top { background:var(--green); }
.tabs { padding:10px 24px; gap:5px; overflow-x:auto; }
.tabs button { white-space:nowrap; }
.tabs button.active { background:var(--green-soft); color:#236744; }
.grid { grid-template-columns:minmax(0,1.7fr) minmax(340px,.8fr); }
.grid > .panel:first-child { min-height:calc(100vh - 155px); }
.grid > aside { position:sticky; top:15px; height:max-content; box-shadow:0 8px 24px #1a5d3912; }
.menu { grid-template-columns:repeat(auto-fit,minmax(175px,1fr)); }
.item { min-height:120px; background:#fff; border-radius:10px; }
.item:hover { border-color:#73b28c; box-shadow:0 4px 12px #2a6b4514; }
.price { color:#246a45; font-size:18px; }
.filters button { background:#f0f4f1; }
.filters button.sel { background:#d7eddf; color:#246a45; }
@media (max-width:850px) { .grid { grid-template-columns:1fr; } .grid > aside { position:static; } .grid > .panel:first-child { min-height:auto; } }