/* Stepper numérico POS: valor a la izquierda, flechas ▲▼ a la derecha */
.pos-num-stepper {
    display: inline-flex;
    align-items: stretch;
    max-width: 100%;
    width: 100%;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    overflow: hidden;
    background: #fff;
}

.pos-num-stepper-input {
    flex: 1 1 auto;
    min-width: 0;
    width: auto !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    height: calc(1.8125rem + 2px);
    padding: 0.2rem 0.45rem;
    font-size: 0.875rem;
    text-align: right;
    background: transparent;
}

.pos-num-stepper-input:focus {
    outline: none;
    box-shadow: none !important;
}

.pos-num-stepper-arrows {
    flex: 0 0 1.35rem;
    display: flex;
    flex-direction: column;
    border-left: 1px solid #ced4da;
    background: #f1f3f5;
}

.pos-num-stepper-arrows button {
    flex: 1 1 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    background: #f1f3f5;
    color: #343a40;
    line-height: 1;
    cursor: pointer;
}

.pos-num-stepper-arrows button + button {
    border-top: 1px solid #ced4da;
}

.pos-num-stepper-arrows button:hover {
    background: #e2e6ea;
}

.pos-num-stepper-arrows button:active {
    background: #dee2e6;
}

.pos-num-stepper-arrows i {
    font-size: 0.7rem;
    pointer-events: none;
}

/* Detalle #tblProducts: columnas % del thead + table-layout fixed → sin scroll horizontal (escritorio) */
@media (min-width: 992px) {
    .rb-table-products-wrap #tblProducts {
        table-layout: fixed;
        width: 100% !important;
    }
}

@media (max-width: 991.98px) {
    #data_wrapper #data {
        table-layout: auto !important;
        width: auto !important;
    }
}

.rb-table-products-wrap #tblProducts tbody td {
    vertical-align: middle;
}

.pos-line-total {
    display: inline-block;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: calc(1.8125rem + 2px);
    font-variant-numeric: tabular-nums;
}

#tblProducts tbody td:has(.pos-num-stepper) {
    white-space: nowrap;
    overflow: visible;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
}

#tblProducts tbody td .pos-num-stepper {
    width: auto;
    min-width: 3.5rem;
    max-width: 100%;
    display: inline-flex;
    vertical-align: middle;
}

#tblProducts tbody td:has(input[name="cant"]) .pos-num-stepper,
#tblProducts tbody td:has(input[name="quantity"]) .pos-num-stepper {
    min-width: 3.25rem;
}

#tblProducts tbody td:has(input[name="price_current"]) .pos-num-stepper,
#tblProducts tbody td:has(input[name="price"]) .pos-num-stepper {
    min-width: 4.75rem;
}

/* Solo ancho del recuadro: mismos números/tipografía que el resto del POS */
#tblProducts tbody td .pos-num-stepper-input {
    flex: 1 1 auto;
    min-width: 1.75rem;
    width: auto !important;
    box-sizing: border-box;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
    font-variant-numeric: tabular-nums;
}
#tblProducts tbody td:has(.pos-dscto-cell) {
    overflow: hidden;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
}

#tblProducts tbody td .pos-num-stepper-arrows {
    flex: 0 0 1.15rem;
}

#tblProducts .pos-dscto-cell {
    width: 100%;
    max-width: 100%;
    display: flex;
    gap: 0.2rem;
}

#tblProducts .pos-dscto-cell .input-group {
    flex: 1 1 0;
    min-width: 0;
    min-height: calc(1.8125rem + 2px);
}

#tblProducts .pos-dscto-cell .form-control {
    flex: 1 1 auto;
    min-width: 0;
    width: auto !important;
    box-sizing: border-box;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
    font-variant-numeric: tabular-nums;
}

#tblProducts .pos-dscto-cell .input-group-text {
    min-width: 1.2rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}

.pos-num-stepper-group {
    flex-wrap: nowrap;
}

.pos-num-stepper-group .pos-num-stepper {
    flex: 1 1 auto;
    min-width: 0;
    border-left: none;
    border-radius: 0 0.25rem 0.25rem 0;
}

.pos-num-stepper-group > .input-group-prepend + .pos-num-stepper {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Descuento dual: % | $ — mismo diseño que pos-num-stepper */
.pos-dscto-cell {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: center;
    gap: 0.35rem;
    width: 100%;
}

.pos-dscto-cell .input-group {
    flex: 1 1 0;
    min-width: 0;
    display: inline-flex;
    align-items: stretch;
    flex-wrap: nowrap;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    overflow: hidden;
    background: #fff;
}

.pos-dscto-cell .form-control {
    flex: 1 1 auto;
    min-width: 0;
    width: auto !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    height: calc(1.8125rem + 2px);
    padding: 0.2rem 0.45rem;
    font-size: 0.875rem;
    line-height: 1.4;
    text-align: right;
    background: transparent;
}

.pos-dscto-cell .form-control:focus {
    outline: none;
    box-shadow: none !important;
    border-color: transparent !important;
}

.pos-dscto-cell .input-group-append {
    margin-left: 0;
    display: flex;
}

.pos-dscto-cell .input-group-text {
    min-width: 1.35rem;
    height: auto;
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.8rem;
    padding: 0 0.35rem;
    margin: 0;
    border: none !important;
    border-left: 1px solid #ced4da !important;
    border-radius: 0 !important;
    background: #f1f3f5;
}

.pos-dscto-cell .pos-dscto-pct .input-group-text {
    color: #6c757d;
}

.pos-dscto-cell .pos-dscto-amt .input-group-text {
    color: #28a745;
}

#tblProducts thead th.pos-dscto-th small,
.pos-dscto-th small {
    display: block;
    font-weight: normal;
    font-size: 0.72rem;
    opacity: 0.85;
    margin-top: 0.15rem;
}

/* Total de línea: mismo estilo en toda columna monetaria de #tblProducts */
.rb-table-products-wrap #tblProducts tbody td:last-child {
    text-align: center;
}

/* Pedido / devolución de repuesto (#data): mismos steppers que cotización/venta */
#data_wrapper #data tbody td {
    vertical-align: middle;
}

#data_wrapper #data tbody td:has(.pos-num-stepper) {
    white-space: nowrap;
    overflow: visible;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
}

#data_wrapper #data tbody td .pos-num-stepper {
    width: auto;
    min-width: 3.5rem;
    max-width: 100%;
    display: inline-flex;
    vertical-align: middle;
}

#data_wrapper #data tbody td:has(input[name="cantidad"]) .pos-num-stepper,
#data_wrapper #data tbody td:has(input[name="quantity"]) .pos-num-stepper {
    min-width: 3.25rem;
}

#data_wrapper #data tbody td:has(input[name="unit_price"]) .pos-num-stepper,
#data_wrapper #data tbody td:has(input[name="price"]) .pos-num-stepper {
    min-width: 4.75rem;
}

#data_wrapper #data tbody td .pos-num-stepper-input {
    flex: 1 1 auto;
    min-width: 1.75rem;
    width: auto !important;
    box-sizing: border-box;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
    font-variant-numeric: tabular-nums;
}

#data_wrapper #data tbody td .pos-num-stepper-arrows {
    flex: 0 0 1.15rem;
}

#data_wrapper #data tbody td:last-child {
    text-align: center;
}

html[data-theme='dark'] .pos-num-stepper {
    border-color: #4b545c;
    background: #343a40;
}

html[data-theme='dark'] .pos-num-stepper-input {
    color: #f8f9fa;
    background: transparent;
}

html[data-theme='dark'] .pos-num-stepper-arrows {
    border-left-color: #4b545c;
    background: #3d444b;
}

html[data-theme='dark'] .pos-num-stepper-arrows button {
    background: #3d444b;
    color: #f8f9fa;
}

html[data-theme='dark'] .pos-num-stepper-arrows button + button {
    border-top-color: #4b545c;
}

html[data-theme='dark'] .pos-num-stepper-arrows button:hover {
    background: #4a5259;
}

html[data-theme='dark'] .pos-dscto-cell .input-group {
    border-color: #4b545c;
    background: #343a40;
}

html[data-theme='dark'] .pos-dscto-cell .form-control {
    color: #f8f9fa;
    background: transparent;
}

html[data-theme='dark'] .pos-dscto-cell .input-group-text {
    border-left-color: #4b545c !important;
    background: #3d444b;
    color: #f8f9fa;
}

html[data-theme='dark'] .pos-dscto-cell .pos-dscto-amt .input-group-text {
    color: #6fcf97;
}