:root { --rb-accent: #b8462e; --rb-side: #1f2a33; }
body { background: #f4f5f7; }
.rb-login { min-height: 100vh; background: linear-gradient(135deg, #1f2a33, #3a2a22); }
.rb-side { background: var(--rb-side); width: 230px; min-height: 100vh; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.rb-brand { color: #fff; font-weight: 700; font-size: 1.15rem; text-decoration: none; padding: .5rem .6rem; }
.rb-nav { color: #c9d1d9; text-decoration: none; padding: .45rem .6rem; border-radius: .4rem; font-size: .93rem; display: block; }
.rb-nav:hover { background: rgba(255,255,255,.07); color: #fff; }
.rb-nav.active { background: var(--rb-accent); color: #fff; }
.rb-nav i { width: 1.4rem; display: inline-block; }
.rb-main { min-width: 0; }
.kpi { border: 0; border-radius: .6rem; }
.kpi .v { font-size: 1.45rem; font-weight: 700; line-height: 1.1; }
.kpi .l { font-size: .8rem; color: #6c757d; text-transform: uppercase; letter-spacing: .03em; }
.table-sm td, .table-sm th { vertical-align: middle; }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ---------- Point de vente / tablette ---------- */
body.rb-pos { overflow: hidden; height: 100vh; background: #e9ebee; }
.pos { display: grid; grid-template-columns: 260px 1fr 400px; height: calc(100vh - 48px); gap: 0; }
.pos-top { height: 48px; background: var(--rb-side); color: #fff; display: flex; align-items: center; gap: .6rem; padding: 0 .8rem; }
.pos-top a, .pos-top .btn-link { color: #fff; }
.pos-col { overflow-y: auto; min-height: 0; }
.pos-left { background: #fff; border-right: 1px solid #dee2e6; }
.pos-center { padding: .6rem; display: flex; flex-direction: column; min-height: 0; }
.pos-right { background: #fff; border-left: 1px solid #dee2e6; display: flex; flex-direction: column; min-height: 0; }
.cats { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .5rem; }
.cats .btn { border-radius: 2rem; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); gap: .5rem; overflow-y: auto; padding-bottom: 1rem; }
.prod { background: #fff; border: 1px solid #dfe2e6; border-left: 5px solid var(--c, #999); border-radius: .5rem; padding: .55rem; text-align: left; min-height: 86px; display: flex; flex-direction: column; justify-content: space-between; user-select: none; }
.prod:active { transform: scale(.97); }
.prod .n { font-weight: 600; font-size: .92rem; line-height: 1.15; }
.prod .p { font-weight: 700; color: #333; }
.prod .s { font-size: .72rem; color: #6c757d; }
.prod.out { opacity: .45; }
.tbl-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: .35rem; padding: .5rem; }
.tbl { border: 1px solid #ccd; border-radius: .45rem; padding: .45rem .2rem; text-align: center; background: #f8f9fa; font-weight: 600; font-size: .85rem; }
.tbl.busy { background: #fff3cd; border-color: #e0b100; }
.tbl.sel { outline: 3px solid var(--rb-accent); }
.tbl small { display: block; font-weight: 400; font-size: .68rem; }
.ord-item { padding: .45rem .6rem; border-bottom: 1px solid #eee; cursor: pointer; }
.ord-item.active { background: #fdf0ec; }
.ticket { flex: 1; overflow-y: auto; }
.tline { display: flex; gap: .4rem; align-items: center; padding: .35rem .7rem; border-bottom: 1px dashed #e5e5e5; font-size: .92rem; }
.tline .q { width: 2.4rem; text-align: center; font-weight: 700; }
.tline .nm { flex: 1; min-width: 0; }
.tline .nm small { display: block; color: #6c757d; }
.tline .am { white-space: nowrap; font-variant-numeric: tabular-nums; }
.tline.cancel { text-decoration: line-through; color: #aaa; }
.tline.new { background: #eef8ee; }
.round-h { font-size: .72rem; text-transform: uppercase; color: #6c757d; padding: .35rem .7rem; background: #f6f6f6; letter-spacing: .04em; }
.pst { font-size: .66rem; }
.totals { border-top: 2px solid #333; padding: .6rem .8rem; }
.totals .big { font-size: 1.6rem; font-weight: 800; }
.actions { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; padding: .6rem; }
.actions .btn { padding: .75rem .4rem; font-weight: 600; }
.paylines .row { margin-bottom: .35rem; }
.keypad { display: grid; grid-template-columns: repeat(3, 1fr); gap: .35rem; }
.keypad .btn { padding: .7rem; font-size: 1.15rem; }

@media (max-width: 1100px) {
  .pos { grid-template-columns: 1fr 360px; }
  .pos-left { display: none; }
}
/* Tablette / téléphone : une seule colonne à onglets */
@media (max-width: 760px) {
  body.rb-pos { overflow: auto; }
  .pos { display: block; height: auto; }
  .pos-col { display: none; }
  .pos-col.show-m { display: flex; flex-direction: column; height: calc(100vh - 104px); }
  .pos-left.show-m { display: block; }
  .mtabs { display: flex !important; position: fixed; bottom: 0; left: 0; right: 0; height: 56px; background: #fff; border-top: 1px solid #ccc; z-index: 10; }
  .mtabs button { flex: 1; border: 0; background: none; font-weight: 600; }
  .mtabs button.active { color: var(--rb-accent); }
}
.mtabs { display: none; }

/* ---------- KDS ---------- */
body.rb-kds { background: #14181c; color: #eee; }
.kds-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .8rem; padding: .8rem; }
.kcard { background: #232a31; border-radius: .6rem; border-top: 6px solid #6c757d; overflow: hidden; }
.kcard.late { border-top-color: #dc3545; }
.kcard.mid { border-top-color: #ffc107; }
.kcard.ok { border-top-color: #198754; }
.kcard header { padding: .5rem .7rem; display: flex; justify-content: space-between; background: #2c353e; }
.kcard .it { padding: .45rem .7rem; border-bottom: 1px solid #333c45; display: flex; gap: .5rem; align-items: flex-start; cursor: pointer; }
.kcard .it .q { font-size: 1.3rem; font-weight: 800; min-width: 2rem; }
.kcard .it.en_cours { background: #3d3418; }
.kcard .it.pret { background: #17402c; }
.kcard .it.servi { opacity: .4; text-decoration: line-through; }
.kcard .note { color: #ffcf6e; font-size: .85rem; }