/* =========================================
   INPUT IMPROVEMENTS
========================================= */

/* Status dropdown */
.status-dropdown {
    width: 160px !important;
    font-size: 1rem;
    padding: 8px;
}

/* Subtotal input */
/* Total input */
.subtotal-input {
    width: 100% !important;
    min-width: 180px;
    font-size: 1rem;
    padding: 8px 10px;
    text-align: right;
}

/* Discount input */
.discount-input {
    width: 110px !important;
    font-size: 1rem;
    padding: 8px;
    text-align: right;
}

/* Notes & BigM fields */
.notes-input,
.bigm-input {
    width: 100% !important;
    min-width: 320px;
    max-width: 600px;
}

/* Make all table inputs comfortable */
.wide-table input.form-control,
.wide-table select.form-select {
    min-height: 42px;
    font-size: 1rem;
    padding: 8px 10px;
}

/* Focus state (feels more professional) */
.wide-table input.form-control:focus,
.wide-table select.form-select:focus {
    box-shadow: 0 0 0 2px rgba(13,110,253,.25);
    border-color: #0d6efd;
}

.wide-table td:nth-child(9) .form-control {
    width: 100% !important;
}
/* =========================================
   TABLE LAYOUT
========================================= */

.table-container-booking-list .wide-table {
    width: 100%;
    min-width: 1400px;
    table-layout: auto;
}


.wide-table th,
.wide-table td {
    padding: 12px;
    text-align: left;
    vertical-align: middle;
}

/* Prevent wrapping only for first 7 columns */
.wide-table th:nth-child(-n+7),
.wide-table td:nth-child(-n+7) {
    white-space: nowrap;
}

/* Status column (8) */
.wide-table th:nth-child(8),
.wide-table td:nth-child(8) {
    min-width: 200px;
}

/* Total column (9) */

.table-container-booking-list .wide-table th:nth-child(9),
.table-container-booking-list .wide-table td:nth-child(9) {
    min-width: 200px;
}

/* Notes column (13) */
.wide-table th:nth-child(13),
.wide-table td:nth-child(13) {
    min-width: 320px;
}

/* BigM column (14) */
.wide-table th:nth-child(14),
.wide-table td:nth-child(14) {
    min-width: 320px;
}


/* =========================================
   SCROLLING CONTAINER
========================================= */

.table-container-booking-list {
    width: 100%;
    overflow-x: auto;
    position: relative;
    max-height: 600px;
}


/* =========================================
   STICKY HEADER + COLUMNS
========================================= */

/* Sticky header */
.wide-table thead th {
    position: sticky;
    top: 0;
    background: white;
    z-index: 20;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}


/* Freeze Season column */
.wide-table th:nth-child(1),
.wide-table td:nth-child(1) {
    position: sticky;
    left: 0;
    background: white;
    z-index: 15;
    width: 180px;
}

/* Freeze Brand column */
.wide-table th:nth-child(2),
.wide-table td:nth-child(2) {
    position: sticky;
    left: 180px; /* matches Season width */
    background: white;
    z-index: 15;
}

/* Shadow for frozen columns */
.wide-table th:nth-child(1),
.wide-table td:nth-child(1),
.wide-table th:nth-child(2),
.wide-table td:nth-child(2) {
    box-shadow: 2px 0 5px rgba(0, 0, 0, 0.08);
}


/* =========================================
   RESPONSIVE
========================================= */

@media screen and (max-width: 1024px) {

    .status-dropdown,
    .subtotal-input,
    .discount-input {
        width: 100% !important;
        text-align: left;
    }

    .wide-table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}


/* =========================================
   UX POLISH
========================================= */

/* Row hover */
.wide-table tbody tr:hover {
    background-color: #f8f9fa;
}