/* ============================================
   ANIRAZ POS - UI Enhancement CSS
   Makes POS interface more readable & modern
   ============================================ */

/* ---- PRODUCT CARDS IN POS SIDEBAR ---- */
.product_box {
    padding: 8px !important;
    min-height: 120px !important;
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    transition: all 0.2s ease !important;
    background: #fff !important;
}

.product_box:hover {
    border-color: #6366f1 !important;
    box-shadow: 0 6px 16px rgba(99, 102, 241, 0.15) !important;
    transform: translateY(-2px) !important;
}

.product_box .image-container {
    height: 65px !important;
}

/* Product name - bigger & bolder */
.product_box .text_div small.text-muted:first-child,
.product_box .text_div small.text.text-muted {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    line-height: 16px !important;
    max-height: 32px !important;
    -webkit-line-clamp: 2 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

/* SKU code */
.product_box .text_div small.text-muted:nth-child(2) {
    font-size: 10px !important;
    color: #94a3b8 !important;
}

/* Stock quantity */
.product_box .text_div small[style*="font-size: 10px"] {
    font-size: 11px !important;
    color: #059669 !important;
    font-weight: 600 !important;
}

/* Product price */
.product_box .product_price {
    font-size: 13px !important;
    font-weight: 800 !important;
    color: #059669 !important;
}

/* Out of stock products */
.product_out_of_stock {
    opacity: 0.45 !important;
}

/* ---- CART TABLE (LEFT SIDE) ---- */
/* Cart header */
.pos_product_div .table th,
#pos_table th {
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    color: #475569 !important;
    padding: 10px 8px !important;
    background: #f8fafc !important;
}

/* Cart items */
.pos_product_div .table td,
#pos_table td {
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 10px 8px !important;
    vertical-align: middle !important;
    color: #1e293b !important;
}

/* Product name in cart */
.pos_product_name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
}

/* Quantity input */
.pos_quantity,
input.pos_quantity {
    font-size: 15px !important;
    font-weight: 700 !important;
    text-align: center !important;
    width: 60px !important;
    height: 36px !important;
    border-radius: 8px !important;
    border: 2px solid #e2e8f0 !important;
}

/* Quantity +/- buttons */
.input-number .pos_quantity_btn,
.pos_quantity_btn {
    min-width: 32px !important;
    height: 32px !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Total price in cart row */
.pos_line_total {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
}

/* Delete button in cart */
.pos_remove_row i {
    font-size: 16px !important;
    color: #ef4444 !important;
}

/* ---- TOTALS SECTION (BOTTOM) ---- */
.pos_form_totals {
    padding: 8px 12px !important;
}

.pos_totals_label {
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    color: #64748b !important;
    letter-spacing: 0.5px !important;
}

.pos_totals_value {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #1e293b !important;
}

/* TOTAL A PAYER section */
.pos_totals_final .pos_totals_label,
.grand-total-label {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #1e293b !important;
}

.pos_totals_final .pos_totals_value,
.grand-total,
#total_payable {
    font-size: 26px !important;
    font-weight: 900 !important;
    color: #059669 !important;
}

/* ---- BOTTOM ACTION BUTTONS ---- */
.pos-form-actions button,
.pos-form-actions .btn {
    font-size: 13px !important;
    font-weight: 700 !important;
    padding: 10px 16px !important;
    border-radius: 10px !important;
    letter-spacing: 0.3px !important;
    min-height: 42px !important;
    transition: all 0.15s ease !important;
}

.pos-form-actions button:active,
.pos-form-actions .btn:active {
    transform: scale(0.96) !important;
}

/* Cancel button */
.js-pos-cancel {
    font-size: 13px !important;
    border-width: 2px !important;
}

/* Multi-pay / Checkout button */
.pos-finalize {
    font-size: 14px !important;
    padding: 10px 20px !important;
    min-width: 140px !important;
    background: linear-gradient(135deg, #001F3E, #0F3460) !important;
    box-shadow: 0 4px 12px rgba(0, 31, 62, 0.3) !important;
}

/* Cash Express button */
.pos-express-finalize {
    font-size: 14px !important;
    padding: 10px 20px !important;
    min-width: 120px !important;
    background: linear-gradient(135deg, #059669, #10b981) !important;
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.3) !important;
}

/* Card Express button */
.pos-express-finalize[data-pay_method="card"] {
    background: linear-gradient(135deg, #6366f1, #818cf8) !important;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3) !important;
}

/* Recent transactions button */
.pos-form-actions .btn-danger,
button[class*="recent_transactions"] {
    border-radius: 10px !important;
}

/* ---- TOP HEADER BAR ---- */
/* Location & Date header */
.pos-header,
.content > .row:first-child {
    font-size: 14px !important;
}

/* Search input */
#pos_search,
input[id*="search"] {
    font-size: 14px !important;
    height: 42px !important;
    border-radius: 10px !important;
    padding: 8px 14px !important;
}

/* Customer select */
.select2-container .select2-selection--single {
    height: 40px !important;
    border-radius: 10px !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 38px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

/* ---- CATEGORY & BRAND TABS ---- */
.pos_product_filter .nav-tabs > li > a,
.nav-tabs > li > a {
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 8px 16px !important;
}

/* ---- SIDEBAR CATEGORY/BRAND BADGES ---- */
.badge {
    font-size: 12px !important;
    font-weight: 700 !important;
    padding: 4px 10px !important;
    border-radius: 20px !important;
}

/* ---- GENERAL IMPROVEMENTS ---- */
/* All labels */
label {
    font-size: 13px !important;
    font-weight: 600 !important;
}

/* Modal titles */
.modal-title {
    font-size: 18px !important;
    font-weight: 700 !important;
}

/* Modal body text */
.modal-body {
    font-size: 14px !important;
}

/* Table headers everywhere */
.table > thead > tr > th {
    font-size: 13px !important;
    font-weight: 700 !important;
}

/* Form inputs */
.form-control {
    font-size: 14px !important;
}

/* Scrollbar styling for POS product list */
#product_list_body::-webkit-scrollbar {
    width: 6px;
}

#product_list_body::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 3px;
}

#product_list_body::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 3px;
}

#product_list_body::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}