diff --git a/src/modules/data-entry/views/receipts/ReceiptCreateView.vue b/src/modules/data-entry/views/receipts/ReceiptCreateView.vue
index 318d369..689d7e2 100644
--- a/src/modules/data-entry/views/receipts/ReceiptCreateView.vue
+++ b/src/modules/data-entry/views/receipts/ReceiptCreateView.vue
@@ -293,7 +293,7 @@
optionValue="value"
placeholder="Tip"
:disabled="isReadOnly"
- class="dropdown-compact"
+ class="dropdown-compact dropdown-borderless"
/>
@@ -328,7 +328,7 @@
placeholder="Tip"
:disabled="isReadOnly"
@change="directionAutoDetected = false"
- class="dropdown-compact"
+ class="dropdown-compact dropdown-borderless"
/>
@@ -340,7 +340,7 @@
@@ -2404,12 +2406,11 @@ const submitForReview = async () => {
padding: 0.5rem 0.75rem;
}
-/* CSS Grid layout for precise column control - PREVENTS OVERLAP */
+/* CSS Grid layout with FIXED columns to prevent overlap */
.values-row-inline {
display: grid;
- grid-template-columns: 150px 200px auto;
- column-gap: 3rem;
- row-gap: 0.5rem;
+ grid-template-columns: 140px 120px 200px; /* TOTAL | CARD | MOD PLATA - fixed widths */
+ column-gap: 2rem; /* 32px gap between columns */
align-items: start;
}
@@ -2417,15 +2418,26 @@ const submitForReview = async () => {
display: flex;
flex-direction: column;
gap: 0.2rem;
+ max-width: 100%; /* Prevent overflow */
+ overflow: hidden;
}
-/* Explicit widths for inputs */
+/* TOTAL - first column */
.value-item-total {
- width: 150px;
+ width: 140px;
+ max-width: 140px;
}
+/* Payment methods (CARD, NUMERAR) - middle columns */
+.payment-method-item {
+ width: 120px;
+ max-width: 120px;
+}
+
+/* MOD PLATA - last column */
.value-item-payment {
width: 200px;
+ max-width: 200px;
}
.value-item label {
@@ -2435,26 +2447,44 @@ const submitForReview = async () => {
text-transform: uppercase;
}
+/* Force InputNumber to respect container width */
.input-compact {
- width: 130px;
+ width: 100% !important;
+ max-width: 130px !important;
+}
+
+:deep(.value-item-total .p-inputnumber) {
+ width: 100% !important;
+ max-width: 130px !important;
+}
+
+:deep(.value-item-total .p-inputnumber-input) {
+ width: 100% !important;
+}
+
+:deep(.payment-method-item .p-inputnumber) {
+ width: 100% !important;
+ max-width: 110px !important;
+}
+
+:deep(.payment-method-item .p-inputnumber-input) {
+ width: 100% !important;
}
.dropdown-payment {
- width: 180px; /* Fixed width to prevent overlap */
+ width: 100% !important;
+ max-width: 190px !important;
}
:deep(.dropdown-payment) {
- width: 180px !important;
+ width: 100% !important;
+ max-width: 190px !important;
}
:deep(.dropdown-payment .p-dropdown) {
width: 100% !important;
}
-.payment-method-item {
- padding-left: 0.5rem;
-}
-
.payment-method-value {
display: inline-block;
font-size: 0.95rem;
@@ -2951,3 +2981,32 @@ const submitForReview = async () => {
color: #f57c00;
}
+
+
+