body { font-family: DejaVu Sans Mono, monospace; background: #222; color: black; margin: 0; }
.pos-container { display: flex; flex-direction: column; height: 100vh; padding: 10px; box-sizing: border-box; }

.pos-header { display: flex; justify-content: space-between; background: #fff; color: #000; padding: 10px; border-radius: 5px; margin-bottom: 10px; }

.pos-content { display: grid; grid-template-columns: 2fr 1fr; gap: 10px; flex-grow: 1; }

.product-list { background: #fff; border-radius: 8px; overflow-y: auto; padding: 13px; }
table { width: 100%; border-collapse: collapse; }
th { border-bottom: 2px solid #555; text-align: left; padding: 10px; }
td { padding: 10px; border-bottom: 1px solid #444; }

.controls { background: #42c1fc; padding: 20px; border-radius: 5px; display: flex; flex-direction: column; gap: 55px; }

.totals { background: #fff; padding: 15px; border-radius: 10px; border: 4px solid #000; }
.total-row { font-size: 2rem; display: flex; justify-content: space-between; font-weight: bold; }
.total-row.small { font-size: 1.5rem; color: #000; margin-top: 10px; }

.btn { padding: 15px; border: none; cursor: pointer; font-weight: bold; border-radius: 8px; font-size: 1rem; }
.btn-primary { background: #007bff; color: white; }
.btn-success { background: #28a745; color: white; }
.btn-danger { background: #dc3545; color: white; }
.btn-warning { background: #fd7e14; color: white; margin-top: auto; }

/* Modal */
.modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); justify-content: center; align-items: center; }
.modal-content { background: white; color: #333; padding: 30px; border-radius: 10px; width: 400px; text-align: center; }
.payment-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 20px; }
.payment-grid button { padding: 35px; cursor: pointer; }

/* Agrego los puntos del TF */
/* Punto 1 */
#cod-producto {
  margin-top:15px;
  width:150px;
  height:32px;
  font-size:24px;
}