html {
    scrollbar-color: #7b7979 #232b39;
}

/* Title */
.title {
    font-size: 1.4rem;
}

/* Legacy Button Yellow */
.btn-legacy-yellow {
    background: linear-gradient(180deg, #FDEEB8 0%, #FEAE1E 100%);
    border: 1px solid #E59C1A; /* Darker border for definition */
    color: #1e293b !important; /* Dark text for WCAG 4.5:1 accessibility */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); /* Subtle 2026-style shadow */
    transition: all 0.3s ease;
}
.btn-legacy-yellow:hover {
    background: linear-gradient(180deg, #FEF4D1 0%, #FEAE1E 100%);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    color: #1e293b !important;
}

.btn-outline-legacy-yellow {
    background: transparent;
    border: 1.5px solid #E59C1A !important; /* Matching your solid button border */
    color: #b47912 !important; /* Slightly darkened version of #FEAE1E for better text contrast */
    font-weight: 600;
    box-shadow: none;
    transition: all 0.3s ease;
}

.btn-outline-legacy-yellow:hover {
    /* On hover, it "fills in" with your legacy gradient */
    background: linear-gradient(180deg, #FDEEB8 0%, #FEAE1E 100%);
    color: #1e293b !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border-color: #E59C1A;
}

/* Remove header navbar padding */
header.navbar .navbar-brand {
    padding-top: 0;
    padding-bottom: 0;
}

/* Gray Custom Background Color */
.gray-bg {
    --tblr-bg-surface: #ececec;
    background-color: var(--tblr-bg-surface) !important;
}

.yellow-bg {
    background-color: #FDEEB8 !important;
}

/* Gary Card Automatic switch when dark mode is enabled */
[data-bs-theme="dark"] .gray-bg {
    background-color: #2d3543 !important; /* Adjust to your preferred dark shade */
}

/* User Nav */
.user-nav-hover:hover {
    background-color: rgba(0, 0, 0, 0.05) !important; /* Subtle darkening */
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); /* Subtle inner border */
}
.user-nav-hover:hover .avatar {
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 0, 0, 0.1);
}

/* Site Nav */
#navbar-menu .navbar {
    background-color: #FFF;
    border-bottom: 3px solid #FDEEB8;
}

#navbar-menu .nav-link {
    border: 1px solid transparent;
    border-radius: 3px;
    margin: 2px 2px;
    color: #333 !important;
}

#navbar-menu .nav-link:hover, #navbar-menu .nav-item.show > .nav-link, #navbar-menu .nav-link[aria-expanded="true"] {
    border-color: #c8a017;
    background-color: #fdf1c9;
}

/* Large Tooltip*/
.large-tooltip .tooltip-inner {
    font-size: .9rem !important;
    max-width: 300px !important;
}

/* Large Icon */
.icon-lg {
    width: 28px !important;
    height: 28px !important;
    stroke-width: 1.5 !important;
}

/* Save Bar */
.save-gradient-bar {
    background: #f5f5f5; /* Fallback for older browsers */
    background: linear-gradient(to bottom, #dcdcdc 0%, #f5f5f5 100%) !important;
    border: 1px solid #cccccc;
    border-radius: 3px;
    padding: 5px 0;
    margin-bottom: 10px;
}

/* Increase visibility for all checkboxes */
.form-check-input {
    /* Solid dark border replaces the light gray default */
    border: 1.5px solid #94a3b8 !important;
    background-color: #ffffff;
    transition: border-color 0.2s, box-shadow 0.2s;
}

/* Make them stand out even more when hovering the row */
.list-group-item:hover .form-check-input {
    border-color: #64748b !important;
}

/* Highlight the active selection */
.form-check-input:checked {
    background-color: #206bc4; /* Tabler primary blue */
    border-color: #206bc4 !important;
}

/* Accessibility: Better focus ring for keyboard/iPhone users */
.form-check-input:focus {
    border-color: #90b1e1 !important;
    box-shadow: 0 0 0 0.25rem rgba(32, 107, 196, 0.25);
}

/* Style the 'Choose File' button itself */
.form-control::file-selector-button {
    background-color: #206bc4 !important; /* Tabler primary blue */
    color: #ffffff !important;
    border: none;
    border-radius: 4px;
    padding: 4px 12px;
    margin-right: 10px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s;
}

/* File Input*/
.form-control::file-selector-button:hover {
    background-color: #1a569d !important; /* Darker blue on hover */
}

/* Add a thicker border to the whole input box */
input[type="file"].form-control {
    border: 2px solid #cbd5e1;
    padding: 6px;
}

.tabler-widget-lifted {
    /* Radius: 8px to 12px is the 'sweet spot' for 2026 dashboards */
    border-radius: 12px !important;
    /* Shadow: A 'Long and Soft' shadow is better than a 'Dark and Close' one */
    /* This shadow uses a very low opacity (4%) to keep it professional */
    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.04), 0 1px 3px 0 rgba(0, 0, 0, 0.02) !important;
    /* Clean white background to pop against the #ececec card */
    background-color: #ffffff !important;
    /* Ensure the table inside respects the new corners */
    border: 1px solid rgba(0, 0, 0, 0.05); /* Very faint border */
}

/* Custom Tooltip */
.custom-tip-wrapper {
    position: relative;
    display: inline-flex;    
}
.custom-tip-content {
    display: none;
    position: fixed; /* Fixed ignores card overflows and follows the scroll */
    width: 400px;
    background-color: #FDEEB8;
    color: #333;
    padding: 12px;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    box-shadow: 0 8px 16px rgba(0,0,0,0.15);
    z-index: 10000;
    font-size: 14px;
    pointer-events: none; /* Mouse passes through it so it doesn't flicker */
    word-wrap: break-word;
    white-space: normal;
}

/* Checked button style radio buttons */
.form-selectgroup-input:checked + .form-selectgroup-label {
    border-color: #206bc4; /* Stronger Blue Border */
    background-color: #f0f7ff; /* Light Blue Tint */
    color: #206bc4; /* Blue Text */
    font-weight: 600; /* Bold the text when selected */
    box-shadow: 0 0 0 1px #206bc4; /* Inset glow to make it "pop" */
}

/* Horizontal Scrolling Tabs (Legacy Style) */
#tabScroller::-webkit-scrollbar { 
    display: none; 
}

.legacy-tab {
    width: 140px;
    height: 50px;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    margin: 0 5px !important;
    padding: 3px 7px !important;
    border: solid 1px #F7AE2C !important;
    background-color: #FFF0BA !important;
    color: #878787 !important;
    font-weight: bold;
    font-size: .9em;
    text-align: center;
    border-radius: .5em !important;
    transition: all 0.2s ease;
    opacity: 0.8;
}

.legacy-tab.active {
    background-color: #F7AE2C !important;
    color: #ffffff !important;
    border-color: #d4921f !important;
    opacity: 1;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}

.tab-label {
    /*white-space: nowrap;*/
    overflow: hidden;
    text-overflow: ellipsis;
}

.z-index-10 { 
    z-index: 10; 
}

/* Custom Combobox */
.custom-combobox-wrapper .defaults-container {
    max-height: 250px;
    overflow-y: auto;
}

.custom-combobox-wrapper textarea {
    resize: none;
}

/* Ensure dropdown dividers in custom comboboxes stay compact */
.custom-combobox-wrapper .dropdown-divider {
    margin: 0px !important;
}