/* ===== Support Modal: Shell & Navigation ===== */
.support-sidebar {
    --support-nav-text: var(--bs-body-color);
    --support-nav-hover-bg: var(--bs-tertiary-bg);
    --support-nav-active-bg: var(--bs-primary-bg-subtle);
    --support-nav-active-text: var(--bs-primary-text-emphasis);
    --support-icon-bg: var(--bs-secondary-bg);
    --support-icon-color: var(--bs-secondary-color);
}

.support-modal-dialog {
    max-width: min(1220px, 96vw);
}

.support-modal-content {
    overflow: hidden;
}

.support-modal-shell {
    min-height: min(76vh, 860px);
}

.support-tab-content-wrap,
.support-tab-content,
.support-pane-padding {
    height: 100%;
}

.support-sidebar .nav-pills .nav-link {
    color: var(--support-nav-text);
    border-radius: .5rem;
    transition: all .2s ease;
}

.support-sidebar .nav-pills .nav-link:hover {
    background-color: var(--support-nav-hover-bg);
    color: var(--support-nav-active-text);
}

.support-sidebar .nav-pills .nav-link.active {
    background-color: var(--support-nav-active-bg);
    color: var(--support-nav-active-text);
    font-weight: 600;
}

.support-sidebar .icon-box {
    width: 32px;
    height: 32px;
    border-radius: .4rem;
    background-color: var(--support-icon-bg);
    color: var(--support-icon-color);
    display: flex;
    align-items: center;
    justify-content: center;
}

.support-sidebar .nav-link.active .icon-box {
    background-color: var(--bs-primary);
    color: #fff;
}

/* ===== Shared Tab Surface ===== */
.support-tab-shell {
    border-radius: .9rem;
    overflow: hidden;
    box-shadow: 0 .5rem 1.4rem rgba(0, 0, 0, .06);
}

.support-tab-shell__header {
    background: linear-gradient(180deg, var(--bs-body-bg), var(--bs-tertiary-bg));
}

.support-tab-shell .btn,
.support-tab-shell .form-control,
.support-tab-shell .form-select {
    transition: all .2s ease;
}

.support-sidebar .nav-pills .nav-link:focus-visible,
.support-tab-shell .btn:focus-visible,
.support-tab-shell .form-control:focus-visible,
.support-tab-shell .form-select:focus-visible {
    outline: none;
    box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .2);
}

/* ===== Shared Loading / Empty / Error ===== */
.support-state {
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--bs-secondary-color);
}

.support-state__inner {
    max-width: 360px;
}

.support-state__icon {
    font-size: 1.75rem;
    opacity: .45;
    margin-bottom: .5rem;
}

.support-state--error {
    color: var(--bs-danger);
}

.support-state--error .support-state__icon {
    opacity: .7;
}

/* ===== Shared Card/List Micro-Interaction ===== */
.support-list-card {
    border: 1px solid var(--bs-border-color-translucent);
    border-radius: .75rem;
    box-shadow: none;
}

.support-list-card:hover {
    border-color: rgba(var(--bs-primary-rgb), .35);
    box-shadow: 0 .3rem .9rem rgba(0, 0, 0, .06);
}

/* ===== Problem Tab Specific ===== */
.problem-description {
    height: 120px !important;
}

.history-problem-pane {
    min-height: 400px;
}

.history-problem-header {
    z-index: 10;
}

.history-refresh-btn {
    width: 38px;
    height: 38px;
}

.history-empty-image {
    width: 80px;
    opacity: .5;
}

.history-ticket-category {
    max-width: 70%;
}

/* ===== Borrow / Stock Layout (Sticky + Scroll) ===== */
#supportModal #v-pills-stock,
#supportModal #v-pills-borrow {
    min-height: clamp(500px, 70vh, 820px);
}

#supportModal .stock-shell {
    min-height: inherit;
}

#supportModal .stock-header {
    position: sticky;
    top: 0;
    z-index: 3;
}

#supportModal .stock-main {
    min-height: clamp(440px, 62vh, 760px);
}

#supportModal .stock-panel-left,
#supportModal .stock-panel-right {
    min-height: 0;
}

#supportModal .stock-panel-right {
    background: var(--bs-body-bg);
}

#supportModal .stock-scroll-area {
    overscroll-behavior: contain;
}

#supportModal .stock-scroll-area::-webkit-scrollbar {
    width: 6px;
}

#supportModal .stock-scroll-area::-webkit-scrollbar-track {
    background: var(--bs-tertiary-bg);
}

#supportModal .stock-scroll-area::-webkit-scrollbar-thumb {
    background: var(--bs-secondary-bg);
    border-radius: 3px;
}

#supportModal .stock-scroll-area::-webkit-scrollbar-thumb:hover {
    background: var(--bs-secondary-color);
}

#supportModal .stock-cart-footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    box-shadow: 0 -6px 12px rgba(0, 0, 0, .03);
}

#supportModal #cart-items-container > .d-flex,
#supportModal #borrow-cart-container .borrow-cart-row {
    padding: .5rem;
    border-radius: .5rem;
}

/* ===== Responsive ===== */
@media (max-width: 1199.98px) {
    #supportModal .stock-main {
        min-height: clamp(420px, 60vh, 680px);
    }
}

@media (max-width: 991.98px) {
    .support-modal-shell {
        min-height: auto;
    }

    .support-pane-padding {
        padding: .75rem !important;
    }

    .support-sidebar {
        width: 100%;
        border-end: 0 !important;
        border-bottom: 1px solid var(--bs-border-color);
        position: sticky;
        top: 0;
        z-index: 1020;
        background-color: var(--bs-body-bg);
    }

    .support-sidebar .nav {
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        scrollbar-width: thin;
        padding-bottom: .15rem;
    }

    .support-sidebar .nav-link {
        min-height: 42px;
        padding-left: .75rem !important;
        padding-right: .75rem !important;
    }

    .support-tab-shell {
        border-radius: .75rem;
        box-shadow: 0 .35rem 1rem rgba(0, 0, 0, .05);
    }

    .history-ticket-category {
        max-width: 62%;
    }

    #supportModal #v-pills-stock,
    #supportModal #v-pills-borrow {
        min-height: auto;
    }

    #supportModal .stock-shell {
        min-height: 72vh;
    }

    #supportModal .stock-header {
        position: static;
    }

    #supportModal .stock-main,
    #supportModal #purchase-request-panel {
        min-height: auto;
        overflow: visible;
    }

    #supportModal .stock-panel-left {
        border-right: 0 !important;
        border-bottom: 1px solid var(--bs-border-color);
    }

    #supportModal .stock-panel-right {
        height: auto !important;
        max-height: none;
        border-top: 1px solid var(--bs-border-color);
        box-shadow: none !important;
    }

    #supportModal .stock-cart-footer {
        position: static;
        box-shadow: none;
    }
}

@media (max-width: 575.98px) {
    .support-pane-padding {
        padding: .5rem !important;
    }

    .support-tab-shell {
        border-radius: .6rem;
    }

    .support-sidebar .nav-pills {
        gap: .5rem !important;
    }

    .support-sidebar .nav-link {
        min-height: 40px;
        font-size: .9rem;
    }

    .support-state {
        min-height: 150px;
    }

    #supportModal .stock-header {
        padding: .75rem !important;
    }

    #supportModal .stock-header h5 {
        font-size: 1rem;
    }

    #supportModal #stock-item-search,
    #supportModal #borrow-item-search {
        font-size: .9rem;
    }

    #supportModal .stock-scroll-area,
    #supportModal .stock-cart-footer {
        padding: .75rem !important;
    }

    #supportModal #submit-request-btn,
    #supportModal #submit-borrow-request-btn {
        min-height: 42px;
    }
}

@media (min-width: 992px) {
    .support-sidebar {
        width: 260px;
    }
}