/* ===== Login Page (index.html) ===== */
body {
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    background: #f4f4f4;
    margin: 0;
    padding: 0;
}

/* ===== Shared / Global ===== */
.logged-out-message-green {
    background: #e0ffe0;
    color: #006600;
    padding: 10px;
    border: 1px solid #006600 !important;
    border-radius: 4px;
    margin-bottom: 20px;
    text-align: center;
    z-index: 1000;
}

.logged-out-message-red {
    background: #e0ffe0;
    color: indianred;
    padding: 10px;
    border: 1px solid indianred;
    border-radius: 4px;
    margin-bottom: 20px;
    text-align: center;
    z-index: 1000;
}

.dev-mode-message {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    margin: 0;
    border-radius: 0;
    background: orange;
    color: black;
    padding: 2px;
    border: 1px solid #006600;
    text-align: center;
    font-size: 14px;
}

.wrapper {
    max-width: 600px;
    margin: 50px auto;
    padding: 0 15px;
}

.section {
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    margin-bottom: 20px;
    text-align: center;
}

    .section h2 {
        margin-top: 0;
    }

    .section p {
        line-height: 1.5;
        margin: 20px 0;
        text-align: left;
        padding: 0;
    }

    .section.animate {
        opacity: 0;
        transform: scale(0.95);
        transition: opacity 0.5s ease-out, transform 0.6s ease-out;
    }

        .section.animate.show {
            opacity: 1;
            transform: scale(1);
        }

.login-form form {
    margin-top: 20px;
    text-align: left;
}

.login-form input {
    width: 100%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #b3bed7;
    border-radius: 4px;
    box-sizing: border-box;
}

.login-form button {
    width: 100%;
    padding: 10px;
    background: #003366;
    color: white;
    border: none;
    border-radius: 5px;
    font-size: 16px;
    cursor: pointer;
}

    .login-form button:hover {
        background: #002244;
    }

/* From nav.html */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    overflow: hidden; /* prevent “body” from scrolling; we’ll scroll .inner-content instead */
}

/* Header styling */
.top-header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
}

.logo img {
    height: 45px;
    width: auto;
    object-fit: cover;
}

#infoContainer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 1rem;
    background: #2b2b2b;
    padding: 10px 20px;
    position: relative;
}

.report-description {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: max-content;
    text-align: center;
    color: white;
    z-index: 1;
}

    .report-description span {
        color: white !important;
        font-size: 18px;
        text-align: center;
    }

#middleInfo {
    text-align: right;
    color: white;
    margin-left: auto;
}

    #middleInfo span {
        font-size: 18px;
        font-weight: bold;
        display: block;
    }

#rightInfo {
    text-align: right;
    color: white;
}

    #rightInfo span {
        font-size: 18px;
        font-weight: bold;
        display: block;
    }

.pim-user {
    margin: 0;
    padding: 0;
}

/* User menu -- Gear */
.user-menu-wrapper {
    position: relative;
    display: inline-block; /* keeps the dropdown from expanding full width */
    z-index: 100;
}

.user-menu-btn {
    background: none;
    border: none;
    cursor: pointer;
}

.user-menu-dropdown {
    position: absolute;
    top: 2.2rem;
    right: -.3rem;
    min-width: 12rem;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 0.5rem;
    box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,0.15);
    z-index: 9999;
    padding: 0.5rem 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

/*Ensures that the hover doesn't disappear when moving between button and menu*/
.user-menu-bridge {
    position: absolute;
    top: 0; /* Match or just under the gear icon's bottom */
    right: -.3rem;
    height: 2.2rem; /* Height of the vertical gap */
    min-width: 12rem; /* At least as wide as your button/icon */
    /*background: red;*/ /*Uncomment for debugging */
    z-index: 9998;
    pointer-events: auto; /* Ensure it's interactive for hover */
}

.user-menu-btn img {
    width: 1.25rem;
    height: 1.25rem;
    filter: invert(1) brightness(2);
    display: block;
    position: relative;
    top: 0.2rem;
}


.user-menu-dropdown .dropdown-item {
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    padding: 10px 16px;
    font-size: 1rem;
    cursor: pointer;
    color: #222;
    transition: background 0.18s;
}

    .user-menu-dropdown .dropdown-item:hover {
        background: #cecece;
    }


/* Navigation Grid styling */
.nav-container {
    max-width: 75%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: 15px;
    padding: 15px 0;
    justify-items: center;
}

/* Firefox-specific adjustment to ensure proper wrapping */
@-moz-document url-prefix() {
    .nav-container {
        grid-template-columns: repeat(6, 150px);
        justify-content: center;
    }
}

/* Alternative Firefox fix using media query hack */
@supports (-moz-appearance: meterbar) {
    .nav-container {
        grid-template-columns: repeat(6, 150px);
        justify-content: center;
    }
}

/* Button style */
.nav-button {
    background-color: #003366;
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color 0.3s;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 150px;
}

    .nav-button:hover {
        background-color: #002244;
        color: lightgray;
    }

    .nav-button.animate {
        opacity: 0;
        transform: scale(0.9);
        transition-property: opacity, transform;
        transition-duration: 0.5s, 0.5s;
        transition-delay: var(--delay, 0s);
    }

        .nav-button.animate.show {
            opacity: 1;
            transform: scale(1);
        }

    .nav-button.active {
        background-color: #002244;
        color: white;
    }

.button-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.icon-container {
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.nav-button img {
    width: 4em;
    max-height: 75px;
    height: auto;
    filter: invert(1);
    object-fit: contain;
    padding-top: 1rem;
}

.button-text {
    font-size: 2em;
    font-family: inherit;
    text-transform: none;
    display: block;
    line-height: 1.2;
    padding-bottom: .5rem;
}

.nav-button .button-text {
    font-size: 1.2rem;
    line-height: 1.2;
}

.nav-button .button-text,
.nav-container .button-text,
.nav-link span {
    white-space: normal !important;
    word-break: break-word;
    display: block;
    text-align: center !important;
}

/* Dataviewer */
.dataviewer-page {
    display: flex;
    flex-direction: column;
    /*    Below added to try to fix viewers*/
    height: 100vh; /* Full viewport height */
    min-height: 0; /* Prevents overgrowth from flex children */
}

    /* The sticky header in dataviewer never grows/shrinks—fixed height */
    .dataviewer-page > header {
        flex: 0 0 auto;
    }

    /* The “Vehicle + tabs” row should also stay at its natural height */
    .dataviewer-page > .options-container {
        flex: 0 0 auto;
    }

    /* We removed the overriding flex/height rules for .inner-content—keep its calc() height */

    /* Only affect FastTurn’s scrolling area */
    .dataviewer-page #ft-content {
        height: 100%;
        overflow-y: auto;
        box-sizing: border-box;
    }

/* Sidebar */
.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 80px;
    height: 100vh;
    background-color: #f4f4f4;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 5px 0;
    box-shadow: 1px 0 5px rgba(0,0,0,0.1);
    z-index: 1000;
}

    .sidebar a {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: 10px 0;
        text-decoration: none;
        color: #003366;
        font-size: 10px;
        width: 100%;
        padding: 5px 0;
    }

        .sidebar a span {
            margin-top: 2px;
        }

        /* Only apply circular hover effects to main navigation links, not submenu items */
        .sidebar a:not(.submenu-link)::before {
            content: "";
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 60px;
            height: 60px;
            border-radius: 50%;
            background-color: rgba(0, 0, 0, 0.1);
            opacity: 0;
            transition: opacity 0.3s;
            pointer-events: none;
        }

        .sidebar a:not(.submenu-link):hover::before,
        .sidebar a:not(.submenu-link).active::before {
            opacity: 1;
        }

        .sidebar a:not(.submenu-link).active::before {
            background-color: rgba(0, 0, 0, 0.2);
        }

    .sidebar img {
        width: 24px;
        height: auto;
        display: block;
    }

    .sidebar.slide-in {
        opacity: 0;
        transform: translateX(-100%);
        transition: transform 0.4s ease-out, opacity 0.4s ease-out;
    }

        .sidebar.slide-in.show {
            opacity: 1;
            transform: translateX(0);
        }


    /* ===== SIDEBAR SUBMENU STYLES ===== */
    /* Navigation item wrapper for submenu positioning */
    .sidebar .nav-item {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: 10px 0;
        width: 100%;
    }

    /* Submenu arrow indicator */
    .sidebar .submenu-arrow {
        font-size: 12px;
        margin-top: 2px;
        transition: transform 0.2s ease;
    }

    /* Submenu styling */
    .sidebar .submenu {
        position: absolute;
        left: 100%;
        top: 0;
        min-width: 160px;
        background: #fff;
        border: 1px solid #ccc;
        border-radius: 0.5rem;
        box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,0.15);
        z-index: 9999;
        padding: 0.5rem 0;
        display: flex;
        flex-direction: column;
        gap: 0;
        opacity: 0;
        visibility: hidden;
        transform: translateX(-10px);
        transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
        pointer-events: none;
    }

    /* Show submenu on hover */
    .sidebar .nav-item:hover .submenu {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        pointer-events: auto;
    }

    /* Submenu items */
    .sidebar .submenu .submenu-link {
        display: block;
        width: 100%;
        text-align: left;
        background: none;
        border: none;
        padding: 8px 16px;
        font-size: 14px;
        cursor: pointer;
        color: #222;
        text-decoration: none;
        transition: background 0.18s;
        white-space: nowrap;
    }

        .sidebar .submenu .submenu-link:hover {
            background: #f0f0f0;
        }

        .sidebar .submenu .submenu-link.active {
            background: #003366;
            color: white;
        }

    /* Loading state for nav items */
    .sidebar .nav-loading {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 60px;
        color: #666;
        font-size: 12px;
        text-align: center;
        padding: 0 10px;
    }

.content-container {
    margin-left: 80px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

header {
    position: sticky;
    top: 0;
    z-index: 900;
    background-color: #ffffff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.header-container {
    width: 100%;
}

.header-title {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    color: #333;
    transform: translateY(-50%);
    pointer-events: none;
}

.header-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

    .header-right span {
        font-size: 22px;
        font-weight: bold;
    }

.login-layout {
    padding: 1rem;
}

.logout-link {
    color: #ffffff;
    font-size: 16px;
    margin-top: 5px;
}

    .logout-link:hover {
        color: darkgray;
    }

.main-container {
    margin-left: 0;
    transition: margin-left 0.4s ease-out;
}

    .main-container.margin-shift {
        margin-left: 80px;
    }

.options-container {
    display: flex;
    padding: .5rem 1rem;
}

/* ---- EXPANDABLE OPTIONS CONTAINER (VIN Detail only) ---- */
.expandable-options {
    transition: min-height 0.3s ease;
    position: relative;
}

.expandable-options:not(.expanded) {
    min-height: 120px;
    max-height: 120px;
    overflow: hidden;
}

.expandable-options.expanded {
    min-height: 240px;
    max-height: 240px;
    overflow: visible;
}

/* Hover to expand when collapsed (using the collapsed class that JavaScript manages) */
.expandable-options.collapsed:hover {
    min-height: 240px !important;
    max-height: 240px !important;
    overflow: visible !important;
}

/* Also apply hover expansion to checkbox groups when collapsed container is hovered */
.expandable-options.collapsed:hover .checkbox-group {
    max-height: 230px !important;
    min-height: 230px !important;
}

/* Hover to expand when NOT already expanded */
.expandable-options:not(.expanded):hover {
    min-height: 240px !important;
    max-height: 240px !important;
    overflow: visible !important;
}

/* Also apply hover expansion to checkbox groups when container is hovered */
.expandable-options:not(.expanded):hover .checkbox-group {
    max-height: 230px !important;
    min-height: 230px !important;
}

/* Expand Toggle Button as a filter container */
.expand-toggle-container {
    flex: 0 0 auto;
    min-width: 80px;
    max-width: 100px;
    margin-right: 1rem;
}

.expand-toggle-container .expand-toggle-btn {
    width: 100%;
    white-space: nowrap;
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid #6c757d;
    background: white;
    color: #6c757d;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.expand-toggle-container .expand-toggle-btn:hover {
    background: #f8f9fa;
    border-color: #495057;
    color: #495057;
}

.expand-chevron {
    transition: transform 0.2s ease;
    font-size: 0.75rem;
    line-height: 1;
}

.expand-chevron.expanded {
    transform: rotate(180deg);
}

/* ---- CHECKBOX GROUP STYLES (for VIN Detail filters) ---- */
.checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-height: 96px;
    min-height: 96px;
    overflow-y: auto;
    padding: 0.25rem;
    border: 1px solid #b3bed7;
    border-radius: 5px;
    background: #fff;
    min-width: 120px;
    transition: max-height 0.3s ease, min-height 0.3s ease;
}

/* Expanded state for checkbox groups when container is expanded */
.expandable-options.expanded .checkbox-group {
    max-height: 230px;
    min-height: 230px;
}

/* Make dealer + vehicle containers flex items & keep them from wrapping */
.dealer-container,
.vehicle-container,
.filter-container {
    display: flex;
    align-items: flex-start; /* push contents to the top */
    margin-right: 15px; /* space between them */
    flex-shrink: 0; /* don’t shrink below content */
}

    /* Labels */
    .dealer-container label,
    .vehicle-container label,
    .filter-container label {
        font-size: 16px;
        font-weight: bold;
        margin-right: 5px;
    }

    /* Limit selects so they don’t force wrapping */
    .dealer-container select,
    .vehicle-container select {
        padding: 8px 12px;
        border: 1px solid #b3bed7;
        border-radius: 5px;
        font-size: 14px;
        width: auto; /* shrink‐to‐fit content */
        white-space: nowrap; /* keep options in one line */
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .filter-container select {
        padding: 8px 12px;
        border: 1px solid #b3bed7;
        border-radius: 5px;
        font-size: 14px;
        width: auto;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        min-height: 96px;
        min-width: 80px;
        overflow: auto;
    }

    .filter-container.reset-filters {
        min-height: 96px;
    }

.checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-height: 96px;
    min-height: 96px;
    overflow-y: auto;
    padding: 0.25rem;
    border: 1px solid #b3bed7;
    border-radius: 5px;
    background: #fff;
    min-width: 120px;
}

.checkbox-group.disabled {
    background: #f5f5f5;
    border-color: #ddd;
}

.checkbox-item {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 14px;
    margin: 0;
    padding: 0.125rem 0;
    cursor: pointer;
    white-space: nowrap;
}

.checkbox-item.disabled {
    color: #999;
    cursor: not-allowed;
}

.checkbox-item input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
    flex-shrink: 0;
}

.checkbox-item.disabled input[type="checkbox"] {
    cursor: not-allowed;
}

.more-items {
    font-size: 12px;
    color: #666;
    font-style: italic;
    margin-top: 0.25rem;
    padding-left: 1.25rem; /* Align with checkbox labels */
}

/* ---- END CHECKBOX GROUP STYLES ---- */
.filter-buttons {
    display: flex;
    flex-direction: column;
    margin-left: 8px;
}

.label-group {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.25rem;
    margin-right: 5px;
}

    .label-group label {
        margin-bottom: 0;
        font-size: 16px;
        font-weight: bold;
    }

    .label-group > button {
        margin-left: 0;
        margin-top: 0;
    }
/* New rule: push tabs to the right */
.inner-tab-container {
    display: flex;
    gap: 5px;
    margin-left: auto;
    max-height: 40px;
}

.historical-container {
    padding-top: .25rem;
    display: flex;
/*    align-items: flex-end;
    justify-content: right;
    padding-right: 1rem;*/

        align-items: center; 
    justify-content: center; 
}

    /* MOVES ALL INNER-TAB-BUTTONS TO THE LEFT */
    /*    .options-container .inner-tab-container:has(.inner-tab) {
        margin-left: 10px;
    }*/

    /* FastTurn specific positioning: place tabs next to vehicle container */
    .dataviewer-page .fastturn-content ~ .options-container .inner-tab-container, .options-container:has(.vehicle-container) .inner-tab-container {
        margin-left: 10px;
    }

/* New rule: left-align the back button next to the vehicle container */
.inner-button-container {
    display: flex;
    gap: 5px;
    align-items: center;
    margin-left: 10px;
}

.inner-tab {
    padding: 0.5em 1em;
    background: #ccc;
    border: none;
    border-radius: 0.25em;
    cursor: pointer;
    font-size: .9em;
}


    .inner-tab.active {
        background: #003366;
        color: white;
    }

    .inner-tab:disabled {
        opacity: 0.5;
        cursor: default;
    }

    .inner-tab:hover:not(:disabled) {
        background: #002244;
        color: white;
    }

/* Keep this fixed-height rule on .inner-content so its child (#ft-content) can scroll */

/* PDFs IFRAME SCROLL FIX*/
#ft-iframe {
    width: 100%;
    height: calc(100vh - 158px);
    border: none;
}

/* DEFAULT SCROLL CONTAINER */
.inner-content {
    margin: 0;
    padding: 0;
    position: relative;
}

    .inner-content iframe,
    .inner-content embed {
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        border: none;
        display: block;
    }

#data-message {
    padding: 20px;
    border: 1px solid #b3bed7;
    border-radius: 5px;
    background: #f9f9f9;
    text-align: center;
    font-size: 18px;
    color: #333;
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

#blazor-error-ui {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: lightyellow;
    color: black;
    padding: 0.6rem 1.25rem;
    text-align: center;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        position: absolute;
        top: 0.25rem;
        right: 1rem;
        cursor: pointer;
    }

.nav-layout-container {
    display: flex;
    flex-direction: column;
    height: 100vh;
}

    .nav-layout-container > .nav-page {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        overflow: hidden;
    }

.nav-page > .inner-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    overflow: hidden;
}

.nav-page .scroll-container {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
}

/*For the dataviewer page*/

.inner-content, .nav-inner-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    position: relative;
}

    .inner-content .scroll-container,
    .nav-inner-content .scroll-container {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
    }


.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

/* ===== FastTurn Summary/Detail Tables ===== */

.fastturn-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    table-layout: auto; /* allow first columns to size to their content */
}

    .fastturn-table .bg-variance {
        background-color: #ffc0cb;
    }

    .fastturn-table .bg-targetmix {
        background-color: #cfe5c3;
    }

    .fastturn-table .bg-avgturn {
        background-color: #f8cbad;
    }

    .fastturn-table .bg-overstock {
        background-color: #aac0ff;
    }

    .fastturn-table th,
    .fastturn-table td {
        /*        border: 1px solid #b3bed7;*/
        padding: 5px;
        text-align: center;
        font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
        min-width: 20px;
        position: relative; /* important for z-index */
    }

        /* Thick left border cells should have higher z-index and slightly negative margin to cover adjacent border */
        .fastturn-table th.thick-left-border,
        .fastturn-table td.thick-left-border {
            border-left: 3px solid #003366;
            position: relative;
        }

    /* Don’t constrain clickable-category cells (columns 1–2 in detail, plus any colspan=3 sibling) */
    .fastturn-table tbody td.clickable-category {
        width: auto; /* let these size naturally */
        white-space: normal; /* allow wrapping if needed */
        text-align: left;
    }

    /* Also do not constrain the third column (SubCategoryDescription in detail) */
    .fastturn-table tbody td:nth-child(3) {
        width: auto;
        white-space: normal;
    }

    /* Limit only the numeric columns (columns 5 through all that follow) to max-width: 40px */
    .fastturn-table tbody td:nth-child(n+5) {
        max-width: 55px;
        min-width: 40px;
        font-size: clamp(0.7rem, 0.77vw, .82rem) !important;
        white-space:nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Override the general font size for DOL columns specifically */
    .fastturn-table tbody td.dol-sm {
        font-size: clamp(0.6rem, 0.65vw, 0.7rem) !important;
    }

    /* Rotated header cells (vertical text) */
    .fastturn-table .rotated-90 {
        writing-mode: vertical-rl;
        transform: rotate(0deg);
        white-space: nowrap;
    }

    /* Section header background (Category group row) */
    .fastturn-table .bg-darkgray {
        text-align: left;
        background-color: #003366;
        color: white;
        font-weight: bold;
        font-style: italic;
    }

    /* Alternating row shading */
    .fastturn-table .bg-gray {
        background-color: #e6e6e6;
    }

    /* “No border on right” for the empty top-left header cell */
    .fastturn-table .no-border-right {
        border-right: none;
    }

    /* Make the entire header sticky */
    .fastturn-table thead {
        position: sticky;
        top: 0;
        z-index: 100;
        background-clip: padding-box;
        border-bottom: none;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
        line-height: 1.3;
    }

        .fastturn-table thead th,
        .fastturn-table thead td {
            background-color: #f2f5fc;
            background-clip: border-box;
        }

        .fastturn-table thead th {
            position: sticky;
            top: 0;
            z-index: 101;
        }

/* Dynamic row-color support */
.row-color {
    background-color: var(--ft-row-bg);
}

.fastturn-table .bg-mix,
tr.row-color td.bg-mix {
    background-color: #d9d9d9 !important;
}

.fastturn-table .bg-sales,
tr.row-color td.bg-sales {
    background-color: #e0e6f8 !important;
}

/* Clickable Category cell style */
.clickable-category {
    cursor: pointer;
    text-decoration: underline;
    color: blue;
}

/* ── VIN TABLES ── */
.vin-summary-wrapper,
.vin-detail-wrapper,
.vin-pulsereport-wrapper {
    border: none;
}

.vin-detail-wrapper {
    /* Remove flex: 1, min-height: 0 -- let it grow to content */
    width: 100%;
    margin: 0 auto;
}

/* --- VIN PULSE REPORT (DAYS SUPPLY) --- */

.vin-pulsereport-quicklook {
    text-align: center;
    margin-top: 1rem;
    font-style: italic;
}

.excel-table.vin-pulsereport {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 1rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    background: #f2f5fc;
}


    .excel-table.vin-pulsereport td:not(:nth-child(1)):not(:nth-child(2)),
    .total-row th:not(:nth-child(1)):not(:nth-child(2)) {
        text-align: center;
    }

    /* Single sticky header block for all header rows */
    .excel-table.vin-pulsereport thead {
        position: sticky;
        top: 0;
        z-index: 10;
        background: #f2f5fc;
        background-clip: padding-box;
        border-bottom: none;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
    }

        .excel-table.vin-pulsereport thead th:last-child {
            border-right: none;
        }

        /* First header row: dark blue group labels (except first cell) */
        .excel-table.vin-pulsereport thead tr:nth-child(1) th:nth-child(2),
        .excel-table.vin-pulsereport thead tr:nth-child(1) th:nth-child(4) {
            background-color: #003366;
            color: #f2f5fc;
            padding: .25em;
        }

    /* Rotated label styling (for the second row) */
    .excel-table.vin-pulsereport .rotated-90 {
        text-align: center;
        font-size: 0.9em;
        max-height: 100px;
        padding: 10px 5px;
        vertical-align: bottom;
        font-family: inherit;
        line-height: 1.3em;
        max-width: 50px;
        font-weight: normal;
    }

/* -- Specific column font adjustments -- */

/* Total Avail column*/
#vin-pulsereport-table thead tr:nth-child(2) th:nth-child(5) {
    font-size: 0.9em;
    font-weight: bold;
}

.overstock-section tr:not(:first-child) td:nth-child(5),
.overstock-section tr:not(:first-child) th:nth-child(5),
.understock-section tr:not(:first-child) td:nth-child(5),
.understock-section tr:not(:first-child) th:nth-child(5),
.subgroup td:nth-child(5),
.subgroup th:nth-child(5),
.pre-special-section tr.subrow td:nth-child(5),
.pre-special-section tr.subrow th:nth-child(5) {
    font-weight: bold;
}

/* In Stock and End of Month Stock columns bold and bigger */
/*#vin-pulsereport-table thead tr:nth-child(2) th:nth-child(9),
#vin-pulsereport-table thead tr:nth-child(2) th:nth-child(16) {
    font-size: 0.94em;
    font-weight: bold;
}

.overstock-section tr:not(:first-child) td:nth-child(9),
.overstock-section tr:not(:first-child) th:nth-child(9),
.understock-section tr:not(:first-child) td:nth-child(9),
.understock-section tr:not(:first-child) th:nth-child(9),
.subgroup td:nth-child(9),
.subgroup th:nth-child(9),
.overstock-section tr:not(:first-child) td:nth-child(16),
.overstock-section tr:not(:first-child) th:nth-child(16),
.understock-section tr:not(:first-child) td:nth-child(16),
.understock-section tr:not(:first-child) th:nth-child(16),
.subgroup td:nth-child(16),
.subgroup th:nth-child(16) {
    font-size: 0.94em;
    font-weight: bold;
}*/

/* Over/under stock columns - REMOVED bold/larger styling */
/*#vin-pulsereport-table thead tr:nth-child(2) th:nth-child(12),
#vin-pulsereport-table thead tr:nth-child(2) th:nth-child(19) {
    font-size: .98em;
    font-weight: bold;
}

.overstock-section tr:not(:first-child) td:nth-child(12),
.overstock-section tr:not(:first-child) th:nth-child(12),
.understock-section tr:not(:first-child) td:nth-child(12),
.understock-section tr:not(:first-child) th:nth-child(12),
.subgroup td:nth-child(12),
.subgroup th:nth-child(12),
.overstock-section tr:not(:first-child) td:nth-child(19),
.overstock-section tr:not(:first-child) th:nth-child(19),
.understock-section tr:not(:first-child) td:nth-child(19),
.understock-section tr:not(:first-child) th:nth-child(19),
.subgroup td:nth-child(19),
.subgroup th:nth-child(19) {
    font-size: 1em;
    font-weight: bold;
}*/

/* Avg Monthly Sales column label and */
/* End of Month Days Supply column label - Canada (base) */
#vin-pulsereport-table thead tr:nth-child(2) th:nth-child(3),
#vin-pulsereport-table thead tr:nth-child(2) th:nth-child(18) {
    font-size: .75em;
}

/* USA PULSE REPORTS: Adjusted column selectors for specific headers */
#vin-pulsereport-table[data-country="USA"] thead tr:nth-child(2) th:nth-child(3),
#vin-pulsereport-table[data-country="USA"] thead tr:nth-child(2) th:nth-child(19) /* was 18 */ {
    font-size: .75em;
}

/* CANADA BASE: Background behind second row headers - EXCLUDE USA */
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(10),
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(11),
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(12),
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(14),
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(15),
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(16),
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(17),
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(18),
.excel-table.vin-pulsereport:not([data-country="USA"]) thead tr:nth-child(2):not(.total-row)
th:nth-child(19) {
    background-color: #b4c6e7;
}

/* USA PULSE REPORTS: Background behind second row headers - adjusted for FCTP column */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(11), /* was 10 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(12), /* was 11 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(13), /* was 12 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(15), /* was 14 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(16), /* was 15 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(17), /* was 16 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(18), /* was 17 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(19), /* was 18 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(20), /* was 19 */
.excel-table.vin-pulsereport[data-country="USA"] thead tr:nth-child(2):not(.total-row)
th:nth-child(21) /* NEW: Last column Over/Under stock */ {
    background-color: #b4c6e7;
}
/* --- End background behind second row headers --- */

.vin-pulsereport-subheader {
    color: black;
    font-size: 1.09em;
}

    .vin-pulsereport-subheader.can-toggle {
        background-color: #b4c6e7;
        cursor: pointer;
    }

    .vin-pulsereport-subheader .toggle-arrow {
        font-size: 1.2em;
        display: inline-block;
        width: 1.3em;
        user-select: none;
        margin-right: 6px;
        transition: transform 0.1s;
        vertical-align: middle;
        padding-left: .5rem;
        transform: rotate(0deg);
    }

        .vin-pulsereport-subheader .toggle-arrow.collapsed {
            transform: rotate(-120deg);
            padding-left: .4rem;
            vertical-align: middle !important;
        }

.vin-pulsereport-subheader-label {
    vertical-align: middle;
}

    /* Styles for differentiated main and sub labels in special sections */
    .vin-pulsereport-subheader-label .main-label {
        font-weight: bold;
        font-size: 1.2rem;
    }

    .vin-pulsereport-subheader-label .sub-label {
        font-weight: normal;
        font-size: 0.9em;
        font-style: italic;
        margin-left: 0.5em;
    }

/* nav page pulse report */
#nav-pulsereport-output .excel-table.vin-pulsereport {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 1rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f2f5fc;
}

.vin-pulsereport-totalrow {
    background: #003366;
    color: #f2f5fc;
    font-style: italic;
    font-size: 1rem;
}

    .vin-pulsereport-totalrow th {
        padding: 10px 7px;
    }

/* Most Overstocked: Light Green */
.excel-table.vin-pulsereport .overstock-section,
.excel-table.vin_pulsereport .overstock-section td,
.excel-table.vin_pulsereport .overstock-section th {
    background: #e2efda;
    color: #2b2b2b;
    border-color: #e2efda;
}

/* Most Understocked: Light Red */
.excel-table.vin-pulsereport .understock-section,
.excel-table.vin_pulsereport .understock-section td,
.excel-table.vin_pulsereport .understock-section th {
    background: #ffd5d5 !important;
    color: #2b2b2b;
    border-color: #ffd5d5;
}

.vin-pulsereport-gap-row,
.vin-pulsereport-gap-row td {
    height: 1rem;
    border-top: none !important;
    border-bottom: none !important;
}

.vin-pulsereport-gap-row--abbrev,
.vin-pulsereport-gap-row--abbrev td {
    /*    display: none;*/
}

/* Outer border for MOST OVERSTOCKED section */
.excel-table.vin-pulsereport tbody.overstock-section {
    border: 3px solid #2b2b2b !important;
    overflow: hidden;
}

/* Outer border for MOST UNDERSTOCKED section */
.excel-table.vin-pulsereport tbody.understock-section {
    border: 3px solid #2b2b2b !important;
    overflow: hidden;
}

/* Indent only the first cell of each subrow */
tr.subrow td:first-child,
#vin-pulsereport-table tbody.overstock-section tr.vin-pulsereport-subheader.special-section ~ tr > td:first-child,
#vin-pulsereport-table tbody.understock-section tr.vin-pulsereport-subheader.special-section ~ tr > td:first-child {
    padding-left: 1em !important;
}

/* Keep pre-special-section subrows visible (not hidden like collapsible subrows) */
.pre-special-section tr.subrow {
    display: table-row !important;
}

/* ── VIN SUMMARY ── */
.vin-summary {
    border-collapse: collapse;
    border-spacing: 0;
    width: 80%;
    margin: 0 auto;
    table-layout: fixed;
}

    /*Make first column bigger*/
    .vin-summary th:first-child,
    .vin-summary td:first-child {
        width: 200px;
        min-width: 150px;
        max-width: 250px;
        text-align: left;
    }

    /* VIN SUMMARY header coloring by role (works for v1 and v2) */
    .vin-summary thead .hdr-light {
        background-color: #b4c6e7;
        color: #222;
    }

    .vin-summary thead .hdr-dark {
        background-color: #003366;
        color: #fff;
    }
    /* keep the smaller suffix style */
    .vin-summary th .header-suffix {
        font-weight: normal;
        font-size: 0.85em;
        padding-left: 0.25em;
    }
    /* center the merged block; right-align the rest (optional) */
    .vin-summary thead th[colspan][rowspan] {
        text-align: center !important;
    }

    .vin-summary thead th:not([colspan]) {
        text-align: right;
    }

    /* Force every non-total body row to white */
    .vin-summary tbody tr {
        background-color: #f2f5fc;
    }

        /* Final “Total” row → same light-blue as cols 1–8 */
        .vin-summary tbody tr:nth-last-child(2) td {
            background-color: #b4c6e7 !important;
        }

    .vin-summary thead tr:nth-of-type(2) th {
        vertical-align: bottom;
    }

/* spacer row in VIN summary should be plain page background */
.vin-summary-spacer td {
    background-color: #f4f4f4; /* same as body background */
    border: none;
    height: 1rem; /* optional: control its height */
}

/* make suffix normal weight & slightly smaller */
.vin-summary th .header-suffix {
    font-weight: normal;
    font-size: 0.85em;
    padding-left: 0.25em;
}

/* 1) Center the merged 9–10 colspan header (spanning rows 1–2) */
.vin-summary thead th[colspan][rowspan] {
    text-align: center !important;
}

/* 2) Right-justify all other header cells */
.vin-summary thead th {
    text-align: right;
}

/* 3) Data & total rows: first column left, all others right */
.vin-summary tbody tr td:first-child {
    text-align: left;
}

.vin-summary tbody tr td:not(:first-child) {
    text-align: right;
}

.vin-summary > tbody > tr:not(.vin-summary-spacer):nth-last-child(2) > td {
    font-weight: bold !important;
}

/* ── VIN SUMMARY: stick the whole header group ── */
.vin-summary thead {
    position: sticky;
    top: 0;
    z-index: 10;
    background-clip: padding-box;
    border-bottom: none;
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}

/* ---- VIN DETAIL TABLE ---- */
.vin-detail {
    border-collapse: collapse;
    width: 100%;
    table-layout: auto;
    font-size: 0.91rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    background: white;
    color: #222;
}

    .vin-detail th,
    .vin-detail td {
        /*        border: 1px solid #b3bed7;*/
        padding: 4px 6px;
        vertical-align: middle;
    }

    .vin-detail th {
        background: #b4c6e7;
        font-weight: bold;
        font-size: 1em;
        white-space: nowrap;
    }

    /* alternate-row shading */
    .vin-summary tr:nth-child(even) td,
    .vin-detail tr:nth-child(even) td {
        background: #e6eaf7;
    }

    .vin-detail thead {
        position: sticky;
        top: 0;
        z-index: 10;
        background-color: #b4c6e7;
        background-clip: padding-box;
        border-bottom: none;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
    }

        /* 3) Keep each <th> from drawing its own top border */
        .vin-detail thead th {
            background-color: #b4c6e7;
            background-clip: padding-box;
            border-top: none;
        }

/* ---- WHOLESALE TABLE ---- */

/* Use same wrapper as pulsereport for margins/width */
.wholesale-wrapper {
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
}

/* Main wholesale Excel table styling */
.excel-table.wholesale {
    width: 100%;
    table-layout: fixed; /* Ensure column widths are used */
    border-collapse: collapse;
    border-spacing: 0;
    font-size: .95rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    color: #5e5e5e;
    background: #f2f5fc;
}

    /* Header styles – identical to pulsereport */
    .excel-table.wholesale thead {
        position: sticky;
        top: 0;
        z-index: 10;
        background: #f2f5fc;
        background-clip: padding-box;
        border-bottom: none;
        box-shadow: 0 2px 2px -1px rgba(0,0,0,0.4);
}

    .excel-table.wholesale th {
        background: #b4c6e7;
        font-weight: bold;
        color: #222;
        text-align: center;
        padding: 6px 8px;
    }

    /* Alternating row shading */
    .excel-table.wholesale tbody tr:nth-child(even) td {
        background: #e6eaf7;
    }

    /* All cells */
    .excel-table.wholesale th,
    .excel-table.wholesale td {
        min-width: 20px;
        padding: 5px;
        position: relative;
        font-family: inherit;
        font-size: 1em;
    }

        /* ---- COLUMN WIDTHS: FIRST COLUMN WIDE, OTHERS FLEXIBLE ---- */
        .excel-table.wholesale th:first-child,
        .excel-table.wholesale td:first-child {
            width: 210px; /* Or your preferred width */
            min-width: 180px;
            max-width: 320px;
            text-align: left;
            font-weight: 500;
            background: #e9edf5; /* Subtle highlight for first column (optional) */
        }

        .excel-table.wholesale th:not(:first-child),
        .excel-table.wholesale td:not(:first-child) {
            min-width: 60px; /* Prevents columns from becoming too skinny on mobile */
            /* No width set, these will auto-divide remaining space */
        }

    .excel-table.wholesale thead th:first-child {
        background: #b4c6e7 !important;
    }

    /* ---- END COLUMN WIDTHS ---- */

    .excel-table.wholesale td:first-child {
        text-align: left;
        font-weight: normal;
    }

    .excel-table.wholesale td {
        text-align: center;
        font-weight: normal;
    }

/* Section title to match pulsereport (subheader blue bar) */
.wholesale-section-title {
    background: #003366 !important;
    color: #fff !important;
    font-weight: bold;
    font-size: 1.09em;
    margin-top: 1.4em;
    margin-bottom: 0;
    padding: 8px 6px;
}

/* Notes/ecommitment style, minimal adjustment */
.whole-notes {
    margin: 0;
    border-radius: 5px;
    padding-left: 1em;
    font-size: 1em;
}

.whole-ecommitment {
    margin: 1em 0;
    padding-left: 1em;
    font-size: 1em;
}

    .whole-ecommitment a {
        color: #002255 !important;
        text-decoration: none !important;
    }

        .whole-ecommitment a:hover {
            text-decoration: underline !important;
        }

.whole-bluerow td,
.whole-greenrow td,
.whole-orangerow td {
    background-color: inherit !important;
    color: inherit !important;
}

.whole-bluerow {
    background-color: #aac0ff;
    color: #000000;
}

    .whole-bluerow.biggerrow td {
        font-size: 1.13em;
    }

.whole-greenrow {
    background-color: #D8E4BC;
    color: #000000;
}

    .whole-greenrow.biggerrow td {
        font-size: 1.13em;
    }

.whole-orangerow {
    background-color: #FCD5B4;
    color: #000000;
}

    .whole-orangerow.boldrow td {
        font-weight: bold !important;
        font-size: 1.13em;
    }


/* ===== RETAILS TABLES ===== */

/* ---- RETAILS SUMMARY TABLE ---- */
.retails-summary {
    border-collapse: collapse;
    border-spacing: 0;
    width: 80%;
    margin: 0 auto;
    table-layout: fixed;
}

    .retails-summary th:first-child,
    .retails-summary td:first-child {
        width: 200px;
        min-width: 150px;
        max-width: 250px;
        text-align: left;
    }

    .retails-summary thead .hdr-light {
        background-color: #b4c6e7;
        color: #222;
    }

    .retails-summary thead .hdr-dark {
        background-color: #003366;
        color: #fff;
    }

    .retails-summary th .header-suffix {
        font-weight: normal;
        font-size: 0.85em;
        padding-left: 0.25em;
    }

    .retails-summary thead th[colspan][rowspan] {
        text-align: center !important;
    }

    .retails-summary thead th:not([colspan]) {
        text-align: right;
    }

    /* All body rows default to white background */
    .retails-summary tbody tr {
        background-color: #f2f5fc;
    }

    .retails-summary thead tr:nth-of-type(2) th {
        vertical-align: bottom;
    }

.retails-summary-spacer td {
    background-color: #f4f4f4;
    border: none;
    height: 1rem;
}

.retails-summary tbody tr td:first-child {
    text-align: left;
}

.retails-summary tbody tr td:not(:first-child) {
    text-align: right;
}

/* Apply header styling to rows with retails-header-row class */
.retails-summary > tbody > tr.retails-header-row > td {
    background-color: #b4c6e7 !important;
    font-weight: bold;
}

/* Apply total row styling to rows with retails-total-row class */
.retails-summary > tbody > tr.retails-total-row > td {
    background-color: #b4c6e7 !important;
    font-weight: bold !important;
}

.retails-summary thead {
    position: sticky;
    top: 0;
    z-index: 10;
    background-clip: padding-box;
    border-bottom: none;
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}

/* Alternating row shading - exclude header and total rows */
.retails-summary tr:nth-child(even):not(.retails-header-row):not(.retails-total-row) td {
    background: #e6eaf7;
}

.retails-summary tbody,
.retails-summary tbody td {
    border: 1px solid #b3bed7;
    min-width: 20px;
    padding: 5px;
    position: relative;
}

.retails-summary thead th,
.retails-summary thead td {
    padding-right: 5px;
    text-align: center !important;
    line-height: 1.3;
}

/* ---- RETAILS DETAIL TABLE ---- */
.retails-detail {
    border-collapse: collapse;
    width: 100%;
    table-layout: auto;
    font-size: 0.91rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    background: white;
    color: #222;
}

    .retails-detail th,
    .retails-detail td {
        padding: 4px 6px;
        vertical-align: middle;
    }

    .retails-detail th {
        background: #b4c6e7;
        font-weight: bold;
        font-size: 1em;
        white-space: nowrap;
    }

    /* alternate-row shading */
    .vin-summary tr:nth-child(even) td,
    .vin-detail tr:nth-child(even) td,
    .retails-detail tr:nth-child(even) td {
        background: #e6eaf7;
    }

    /* Highlight rows where Attention needed contains X - placed after alternating colors to take precedence */
    .retails-detail tbody tr.retails-attention-needed td {
        background-color: #FFFF99 !important;
    }

    .retails-detail thead {
        position: sticky;
        top: 0;
        z-index: 10;
        background-color: #b4c6e7;
        background-clip: padding-box;
        border-bottom: none;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
    }

        .retails-detail thead th {
            background-color: #b4c6e7;
            background-clip: padding-box;
            border-top: none;
        }

    .retails-detail th,
    .retails-detail td {
        border: 1px solid #b3bed7;
    }

    .retails-detail tr.retails-attention-needed td {
        background-color: #FFFF99 !important;
    }

/* ===== END RETAILS TABLES ===== */

/* ---- PORTAL ACTIVITY TABLE ---- */
/* Alternating row shading */
.portal-activity tr:nth-child(even) td {
    background: #e6eaf7;
}

/* Sticky header for portal activity tables */
.portal-activity table thead {
    position: sticky;
    top: 0;
    z-index: 10;
    background-clip: padding-box;
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}

.portal-activity table thead th {
    background-color: #f8f9fa; /* Light gray background for header */
    background-clip: padding-box;
}

/* ALL TABLES */

/*Links*/
table a {
    color: #002255 !important;
    text-decoration: none !important;
}

    table a:hover {
        text-decoration: underline !important;
    }

.has-tooltip {
    cursor: help;
    border-bottom: 1px dotted #888;
    position: relative;
}

/* FastTurn clickable info icon styling */
.fastturn-tooltip-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 3px;
    vertical-align: middle;
    opacity: 0.6;
    cursor: pointer; /* Changed from help to pointer for clickable */
    /* Changed filter to color the SVG to #003366 (dark blue) */
    filter: invert(0%) sepia(100%) saturate(1000%) hue-rotate(198deg) brightness(0.2) contrast(2);
    transition: opacity 0.1s ease-in-out;
    position: relative;
}

.fastturn-tooltip-icon:hover {
    opacity: 1;
}

/* Special positioning for rotated cells */
.fastturn-table .rotated-90 .fastturn-tooltip-icon {
    margin: 0 auto;
    margin-bottom: 2px;
    display: block;
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
}

.fastturn-table,
.vin-summary,
.vin-detail,
.vin-pulsereport {
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif !important;
    border-collapse: separate;
    border-spacing: 0;
}

    .fastturn-table th,
    .fastturn-table td,
    .vin-summary th,
    .vin-summary td,
    .vin-detail th,
    .vin-detail td,
    .excel-table.vin-pulsereport th,
    .excel-table.vin-pulsereport td,
    .excel-table.wholesale th,
    .excel-table.wholesale td {
        font-family: inherit !important;
    }

    /*     Thick FastTurn-style gridlines for all major tables */
    .fastturn-table th,
    .fastturn-table td,
    .vin-summary tbody,
    .vin-summary tbody td,
    .vin-detail td,
    .vin-pulsereport tbody {
        border: 1px solid #b3bed7;
        min-width: 20px;
        padding: 5px;
        position: relative;
    }
 
/* --- Clear out/adjust formatting for empty columns --- */

        /* Remove table section right borders */
.excel-table.vin-pulsereport tbody,
.excel-table.vin-pulsereport thead {
    border-right: none !important;
    border-left: none !important;
}
/* --- End clear out/adjust formatting for empty columns --- */

/* PULSE REPORT DIVIDER BOXES */

/* CANADA BASE: Pulse report divider box between columns for readability - excludes .subrow rows - EXCLUDE USA */
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(9),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(9),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(12),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(12),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(13),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(13),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(16),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(16),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(19),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(19),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(3),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(3),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(5),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(5),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(6),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(6),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(7),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(7) {
    border-bottom: none !important;
    border-right: 2px solid black !important;
}

/* USA PULSE: Adjust divider boxes for extra FCTP column - columns shifted by +1 */
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(10),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(10),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(13),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(13),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(14),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(14),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(17),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(17),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(20),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(20),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(4),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(4),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(6),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(6),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(7),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(7),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(8),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(8) {
    border-bottom: none !important;
    border-right: 2px solid black !important;
}

/* CANADA BASE - EXCLUDE USA */
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(10),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(10),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(13),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(13),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(14),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(14),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(17),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(17),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > th:nth-child(20),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr:not(.subrow) > td:nth-child(20),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(4),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(4),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(6),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(6),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(7),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(7),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(8),
.excel-table.vin-pulsereport:not([data-country="USA"]) tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(8) {
    border-bottom: none !important;
    border-left: 2px solid black !important;
}

/* USA PULSE: Adjust divider boxes for extra FCTP column - columns shifted by +1 */
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(11),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(11),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(14),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(14),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(15),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(15),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(18),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(18),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > th:nth-child(21),
.excel-table.vin-pulsereport[data-country="USA"] tr:not(.subrow) > td:nth-child(21),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(5),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(5),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(7),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(7),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > th:nth-child(8),
.excel-table.vin-pulsereport[data-country="USA"] tr.vin-pulsereport-subheader.special-section:not(.subrow) > td:nth-child(8)
{
    border-bottom: none !important;
    border-left: 2px solid black !important;
}

/* THEAD-specific rules for vertical dividers - ONLY for the FIRST header row (group headers with colspans) */

.excel-table.vin-pulsereport thead tr:nth-child(1) > th:nth-child(2),
.excel-table.vin-pulsereport thead tr:nth-child(1) > th:nth-child(4) {
    border: none !important;
    border-right: 2px solid black !important;
    border-left: 2px solid black !important;
}

/* CANADA BASE: Subrow-only divider - EXCLUDE USA */
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow td:nth-child(9),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow th:nth-child(9),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow td:nth-child(12),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow th:nth-child(12),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow td:nth-child(13),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow th:nth-child(13),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow td:nth-child(16),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow th:nth-child(16),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow td:nth-child(19),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow th:nth-child(19),
.excel-table.vin-pulsereport:not([data-country="USA"]) .vin-pulsereport-subheader.special-section.subrow td:nth-child(3),
.excel-table.vin-pulsereport:not([data-country="USA"]) .vin-pulsereport-subheader.special-section.subrow th:nth-child(3) {
    border-right: 2px solid black !important;
}

/* USA PULSE: Subrow dividers adjusted for extra FCTP column */
.excel-table.vin-pulsereport[data-country="USA"] .subrow td:nth-child(10),
.excel-table.vin-pulsereport[data-country="USA"] .subrow th:nth-child(10),
.excel-table.vin-pulsereport[data-country="USA"] .subrow td:nth-child(13),
.excel-table.vin-pulsereport[data-country="USA"] .subrow th:nth-child(13),
.excel-table.vin-pulsereport[data-country="USA"] .subrow td:nth-child(14),
.excel-table.vin-pulsereport[data-country="USA"] .subrow th:nth-child(14),
.excel-table.vin-pulsereport[data-country="USA"] .subrow td:nth-child(17),
.excel-table.vin-pulsereport[data-country="USA"] .subrow th:nth-child(17),
.excel-table.vin-pulsereport[data-country="USA"] .subrow td:nth-child(20),
.excel-table.vin-pulsereport[data-country="USA"] .subrow th:nth-child(20),
.excel-table.vin-pulsereport[data-country="USA"] .vin-pulsereport-subheader.special-section.subrow td:nth-child(4),
.excel-table.vin-pulsereport[data-country="USA"] .vin-pulsereport-subheader.special-section.subrow th:nth-child(4) {
    border-right: 2px solid black !important;
}

/* CANADA BASE: Subrow-only divider - EXCLUDE USA */
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow td:nth-child(10),
.excel-table.vin-pulsereport:not([data-country="USA"]) .subrow th:nth-child(10),
.excel-table.vin_pulsereport:not([data-country="USA"]) .subrow td:nth-child(13),
.excel-table.vin_pulsereport:not([data-country="USA"]) .subrow th:nth-child(13),
.excel-table.vin_pulsereport:not([data-country="USA"]) .subrow td:nth-child(14),
.excel-table.vin_pulsereport:not([data-country="USA"]) .subrow th:nth-child(14),
.excel-table.vin_pulsereport:not([data-country="USA"]) .subrow td:nth-child(17),
.excel-table.vin_pulsereport:not([data-country="USA"]) .subrow th:nth-child(17),
.excel-table.vin_pulsereport:not([data-country="USA"]) .subrow td:nth-child(20),
.excel-table.vin_pulsereport:not([data-country="USA"]) .subrow th:nth-child(20),
.excel-table.vin_pulsereport:not([data-country="USA"]) .vin-pulsereport-subheader.special-section.subrow td:nth-child(4),
.excel-table.vin_pulsereport:not([data-country="USA"]) .vin-pulsereport-subheader.special-section.subrow th:nth-child(4) {
    border-left: 2px solid black !important;
}

/* USA PULSE: Subrow dividers adjusted for extra FCTP column */
.excel-table.vin-pulsereport[data-country="USA"] .subrow td:nth-child(11),
.excel-table.vin_pulsereport[data-country="USA"] .subrow th:nth-child(11),
.excel-table.vin_pulsereport[data-country="USA"] .subrow td:nth-child(14),
.excel-table.vin_pulsereport[data-country="USA"] .subrow th:nth-child(14),
.excel-table.vin_pulsereport[data-country="USA"] .subrow td:nth-child(15),
.excel-table.vin_pulsereport[data-country="USA"] .subrow th:nth-child(15),
.excel-table.vin_pulsereport[data-country="USA"] .subrow td:nth-child(18),
.excel-table.vin_pulsereport[data-country="USA"] .subrow th:nth-child(18),
.excel-table.vin_pulsereport[data-country="USA"] .subrow td:nth-child(21),
.excel-table.vin_pulsereport[data-country="USA"] .subrow th:nth-child(21),
.excel-table.vin_pulsereport[data-country="USA"] .vin-pulsereport-subheader.special-section.subrow td:nth-child(5),
.excel-table.vin_pulsereport[data-country="USA"] .vin-pulsereport-subheader.special-section.subrow th:nth-child(5) {
    border-left: 2px solid black !important;
}

/* ///////////////////// */


/* Alternating row shading -- Pulse */
.pre-special-section tr:nth-child(even) td,
.subgroup tr:nth-child(odd):not(:first-child) td {
    background: #e6eaf7;

}

/*.subgroup tr:hover td {
    background: #7890bb;
}*/

.vin-summary thead th,
.vin-summary thead td {
    padding-right: 5px;
    text-align: center !important;
    line-height: 1.3;
}

.vin-meta {
    padding-right: 20px;
    margin-bottom: 0 !important;
}

.dataviewer-page .options-container,
.dataviewer-page .options-container.generated-only {
    flex: 0 0 auto;
}

#vin-content.scroll-container {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

#js-detail-output {
    display: block;
    min-height: 0;
    overflow: visible;
}

#js-vin-generated-date {
    text-align: right;
}

#mimic-js-vin-generated-date {
    text-align: right;
}

#js-whole-generated-date {
    text-align: right;
}

#mimic-js-whole-generated-date {
    text-align: right;
}

.fastturn-meta {
    padding-right: 20px;
    margin-bottom: 0 !important;
}

.otd-selections-wrapper {
    max-width: 50%;
    margin-left: auto;
    margin-right: auto;
    border: none;
}

.excel-table.otd-selections {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 1rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    background: #f2f5fc;
}

    .excel-table.otd-selections thead {
        position: sticky;
        top: 0;
        z-index: 10;
        background: #f2f5fc;
        background-clip: padding-box;
        border-bottom: none;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
    }

    .excel-table.otd-selections th {
        background: #b4c6e7;
        font-weight: bold;
        color: #222;
        text-align: center;
        padding: 6px 8px;
    }

    .excel-table.otd-selections tbody tr:nth-child(even) td {
        background: #e6eaf7;
    }

    .excel-table.otd-selections th,
    .excel-table.otd-selections td {
        min-width: 20px;
        padding: 5px;
        position: relative;
        font-family: inherit;
        font-size: 1em;
        border: 1px solid #b3bed7;
    }

.otd-section-title {
    background: #003366 !important;
    color: #fff !important;
    font-weight: bold;
    font-size: 1.09em;
    margin-top: 1.4em;
    margin-bottom: 0;
    padding: 8px 6px;
}

.otd-subheader {
    background-color: #b4c6e7;
    color: black;
    font-size: 1.09em;
    padding: 8px 6px;
    margin-top: 1rem;
}

.otd-subheader-label {
    vertical-align: middle;
    font-weight: 500;
}

.otd-controls {
    margin: 0.5rem 0;
    border-radius: 5px;
    padding-left: 1em;
    font-size: 1em;
    font-style: italic;
}

/* OTD Vehicle Group Container with Border */
.otd-vehicle-group {
    border: 3px solid #003366;
    margin-bottom: 1.5rem;
    background-color: #f8f9fa;
}

    .otd-vehicle-group .otd-subheader {
        margin-top: 0 !important; /* Override the margin-top: 1rem from inline style */
        margin-bottom: 0.5rem;
    }

    .otd-vehicle-group .otd-controls {
        margin: 0.5rem 0 1rem 0; /* Add bottom margin to separate from table */
    }

    .otd-vehicle-group .excel-table.otd-selections {
        margin-bottom: 0 !important; /* Remove the bottom margin since container handles spacing */
    }

/* Fix the cell borders for wholesale and pulsereport */

.wholesale td {
    border: 2px solid #b3bed7;
    padding: 5px !important;
    position: relative !important;
}

.vin-pulsereport td {
    border-top: 2px solid #b3bed7;
    border-bottom: 2px solid #b3bed7;
    padding: 5px !important;
    position: relative !important;
}

/* Ensure wholesale tables maintain their 2px borders and override any conflicting pulse rules */
.excel-table.wholesale td,
.excel-table.wholesale th {
    border: 2px solid #b3bed7 !important;
}

/* --- Clear out/adjust formatting for empty columns --- */

/* ===== HISTORICAL REPORT SELECTOR ===== */
.historical-selector-container {
    padding: 0.75rem 1rem;
    background: #ffe4e1;
    border: 1px solid #ffb6c1;
    border-radius: 0.25rem;
    margin: 0.5rem 1rem;
}

    .historical-selector-container > div {
        display: flex;
        align-items: center;
        gap: 1rem;
        flex-wrap: wrap;
    }

    .historical-selector-container strong {
        color: #8b0000;
        margin: 0;
    }

    .historical-selector-container select {
        flex: 0 0 auto;
        min-width: 200px;
        max-width: 300px;
    }