﻿html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus,
.form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

/* ───────────────────────────────
   Rate Chart Responsive Grid
   ─────────────────────────────── */
/*.rate-grid-wrapper {
    overflow-x: auto;
    overflow-y: auto;
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 5px;
    height: 500px;*/ /* allows vertical scrolling with sticky headers */
/*}*/

    /* Prevent table from shrinking */
    /*.rate-grid-wrapper table {
        min-width: 900px;
        border-collapse: collapse;
    }*/

    /* Cell formatting */
    /*.rate-grid-wrapper th,
    .rate-grid-wrapper td {
        white-space: nowrap;
        font-size: 14px;
        padding: 4px 6px;
    }*/

/* ───────────────────────────────
   Increase Input Box Width
   ─────────────────────────────── */
/*.rate-input {
    width: 90px !important;*/ /* ← Increase width here */
    /*min-width: 90px !important;
    text-align: right;
    font-size: 14px;
}*/

/* ───────────────────────────────
   Sticky FAT Column
   ─────────────────────────────── */
/*.sticky-col {
    position: sticky;
    left: 0;
    z-index: 4;
    background: #f8f9fa !important;
}*/

/* ───────────────────────────────
   Sticky SNF Header Row
   ─────────────────────────────── */
/*.rate-grid-wrapper thead th {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #f8f9fa;
}*/

/* Top-left corner cell (FAT header) */
/*.rate-grid-wrapper thead .sticky-col {
    z-index: 6;
    background: #e9ecef;
}*/

/* Mobile adjustments */
/*@media (max-width: 768px) {

    .rate-grid-wrapper th,
    .rate-grid-wrapper td {
        font-size: 12px;
        padding: 2px;
    }

    .rate-input {
        width: 65px !important;*/ /* smaller on mobile */
        /*min-width: 65px !important;
        font-size: 12px;
    }
}*/
/* Select2 like Windows ComboBox */
/*.select2-container .select2-selection--single {
    height: 38px !important;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    border: 1px solid #ced4da;
}

.select2-search__field {
    padding: 5px;
}*/

/* Arrow alignment */
/*.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%;
    right: 10px;
}*/


/* ───────────────────────────────
   Rate Chart Responsive Grid
   ─────────────────────────────── */
.rate-grid-wrapper {
    width: 100%;
    height: 500px;
    overflow-x: auto;
    overflow-y: auto;
    border: 1px solid #ddd;
    border-radius: 5px;
    scrollbar-gutter: stable both-edges;
}

    /* ───────────────────────────────
   Table (CRITICAL FIX for 1 SNF column)
   ─────────────────────────────── */
    .rate-grid-wrapper table {
        width: 100%;
        min-width: 100%;
        table-layout: fixed;
        border-collapse: collapse;
    }

    /* ───────────────────────────────
   Cell formatting
   ─────────────────────────────── */
    .rate-grid-wrapper th,
    .rate-grid-wrapper td {
        white-space: nowrap;
        font-size: 14px;
        padding: 4px 6px;
        text-align: center;
        border: 1px solid #dee2e6;
    }

/* ───────────────────────────────
   Input box (SNF values)
   ─────────────────────────────── */
.rate-input {
    width: 85px;
    min-width: 85px;
    max-width: 85px;
    text-align: right;
    font-size: 14px;
}

    /* Remove number input arrows */
    .rate-input::-webkit-outer-spin-button,
    .rate-input::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

.rate-input {
    -moz-appearance: textfield;
}

/* ───────────────────────────────
   Sticky FAT column
   ─────────────────────────────── */
.rate-grid-wrapper th.sticky-col,
.rate-grid-wrapper td.sticky-col {
    position: sticky;
    left: 0;
    width: 90px;
    min-width: 90px;
    max-width: 90px;
    z-index: 4;
    background: #f8f9fa;
    text-align: center;
}

/* ───────────────────────────────
   SNF columns (important for 1 column case)
   ─────────────────────────────── */
.rate-grid-wrapper th:not(.sticky-col),
.rate-grid-wrapper td:not(.sticky-col) {
    width: 90px;
    min-width: 90px;
    max-width: 90px;
}

/* ───────────────────────────────
   Sticky header row
   ─────────────────────────────── */
.rate-grid-wrapper thead th {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #f8f9fa;
}

    /* Top-left corner cell */
    .rate-grid-wrapper thead th.sticky-col {
        z-index: 6;
        background: #e9ecef;
    }

/* ───────────────────────────────
   Ctrl + A selection feedback
   ─────────────────────────────── */
.grid-selected {
    background-color: #e7f1ff;
}

/* ───────────────────────────────
   Mobile adjustments
   ─────────────────────────────── */
@media (max-width: 768px) {

    .rate-grid-wrapper th,
    .rate-grid-wrapper td {
        width: 70px;
        min-width: 70px;
        max-width: 70px;
        font-size: 12px;
        padding: 2px;
    }

    .rate-input {
        width: 70px;
        min-width: 70px;
        max-width: 70px;
        font-size: 12px;
    }

    .rate-grid-wrapper th.sticky-col,
    .rate-grid-wrapper td.sticky-col {
        width: 70px;
        min-width: 70px;
        max-width: 70px;
        font-size: 12px;
    }
}

/* ───────────────────────────────
   Select2 – Windows ComboBox style
   ─────────────────────────────── */
.select2-container .select2-selection--single {
    height: 38px !important;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    border: 1px solid #ced4da;
}

.select2-search__field {
    padding: 5px;
}

.select2-container--default
.select2-selection--single
.select2-selection__arrow {
    height: 100%;
    right: 10px;
}
.readonly-select {
    pointer-events: none;
    background-color: #e9ecef;
}