.app {
  display: flex;
  flex-direction: column;
  height: 100vh;
  font-family: system-ui, sans-serif;
}

.pizza-list { padding: 1rem; border-bottom: 1px solid #ddd; }
.pizza-grid { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.pizza-card {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 0.75rem 1rem; border: 1px solid #ccc; border-radius: 8px;
  background: white; cursor: pointer; min-width: 110px;
}
.pizza-card:disabled { opacity: 0.4; cursor: not-allowed; }
.pizza-name { font-weight: 600; }
.pizza-price { color: #555; }
.pizza-stock { font-size: 0.8rem; color: #888; }

.current-order { flex: 1; padding: 1rem; overflow-y: auto; }
.order-item-list { list-style: none; padding: 0; }
.order-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.5rem 0; border-bottom: 1px solid #eee;
}
.qty-controls { display: flex; align-items: center; gap: 0.5rem; }
.qty-controls button {
  width: 28px; height: 28px; border-radius: 50%; border: 1px solid #ccc;
  background: white; cursor: pointer;
}
.empty-hint { color: #888; }

.order-footer { padding: 1rem; border-top: 1px solid #ddd; }
.total-line { display: flex; justify-content: space-between; font-size: 1.2rem; margin-bottom: 0.75rem; }
.order-button {
  width: 100%; padding: 0.75rem; font-size: 1rem; border: none;
  border-radius: 8px; background: #d00; color: white; cursor: pointer;
}
.order-button:disabled { background: #ccc; cursor: not-allowed; }
.confirmation { color: #299; margin-top: 0.5rem; }