/* Píldora POS · paquete Café (fase 1). Usa las variables de app.css. */
.cafe-h2 { font-size: 15px; margin: 22px 0 10px; color: var(--ink-2, #3a4a47); text-transform: uppercase; letter-spacing: .04em; }
.cafe-mesas { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 10px; }
.cafe-mesa { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-height: 108px; padding: 12px; border: 1.5px dashed var(--line, #d5dedc); border-radius: 16px; background: #fff; text-align: left; cursor: pointer; font: inherit; color: inherit; }
.cafe-mesa:hover, .cafe-mesa:focus-visible { border-color: var(--teal, #0E8A7E); }
.cafe-mesa.ocupada { border-style: solid; border-color: var(--teal, #0E8A7E); background: var(--teal-soft, #e6f3f1); }
.cafe-mesa-n { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; font-size: 26px; line-height: 1; }
.cafe-mods { display: block; font-size: 12.5px; font-weight: 500; color: var(--muted, #5f6f6c); margin-top: 2px; }
.cafe-grupo { border: 0; padding: 0; margin: 0 0 6px; }
.cafe-grupo legend { font-weight: 600; margin-bottom: 6px; padding: 0; }
.cafe-opciones { display: flex; flex-wrap: wrap; gap: 8px; }
.cafe-op { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; min-height: 44px; border: 1.5px solid var(--line, #d5dedc); border-radius: 999px; cursor: pointer; font-weight: 500; }
.cafe-op:has(input:checked) { border-color: var(--teal, #0E8A7E); background: var(--teal-soft, #e6f3f1); }
.cafe-op input { margin: 0; }
.cafe-kds { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; align-items: start; }
.cafe-card { background: #fff; border-radius: 16px; padding: 14px; box-shadow: 0 1px 0 var(--line, #d5dedc), 0 6px 18px rgba(7, 46, 44, .06); display: flex; flex-direction: column; gap: 10px; }
.cafe-card header { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.cafe-card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.cafe-item { width: 100%; min-height: 48px; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 10px 12px; border: 1.5px solid var(--line, #d5dedc); border-radius: 12px; background: #fff; font: inherit; text-align: left; cursor: pointer; }
.cafe-item span { font-size: 13px; color: var(--muted, #5f6f6c); }
.cafe-item .cafe-nota { color: #9a5b00; font-weight: 600; }
.cafe-item.listo { background: #eef8f1; border-color: #1F9D63; }
.cafe-item.listo b { text-decoration: line-through; opacity: .7; }
.cafe-banner { display: flex; gap: 8px; align-items: center; background: var(--pill, #FFC93C); color: #17211F; }
@media (max-width: 420px) { .cafe-mesas { grid-template-columns: repeat(2, 1fr); } .cafe-kds { grid-template-columns: 1fr; } }