/*
 * Drey toolbar styles
 * ------------------------------------------------------------
 * Consolidated from:
 *   - topbarstyle.css
 *   - topstyle.css
 *
 * Shared toolbar vocabulary comes first.
 * Table View-specific #tableTopbar overrides follow afterwards.
 *
 * topstyle.css is intentionally retained as an empty compatibility
 * file so existing includes do not need to change yet.
 */

.tableToolbar {
    align-items                 : stretch ;
    background                  : var(--dark-green) ;
    border                      : 1px solid var(--light-green) ;
    border-radius               : 10px ;
    display                     : flex ;
    flex-wrap                   : wrap ;
    gap                         : 1px ;
    margin                      : 0 0 12px 0 ;
    overflow                    : hidden ;
    padding                     : 0 ;
}

.tableToolbarSection {
    align-content               : flex-start ;
    align-items                 : center ;
    background                  : var(--dark-green) ;
    color                       : var(--light-green);
    display                     : flex ;
    flex                        : 0 1 auto ;
    flex-wrap                   : wrap ;
    gap                         : 5px ;
    min-height                  : 46px ;
    padding                     : 5px 8px ;
}

.tableToolbarSection + .tableToolbarSection {
    border-left                 : 1px solid rgba(180, 255, 180, 0.18) ;
}

.tableToolbarView {
    flex                        : 0 1 220px ;
}

.tableToolbarFind {
    flex                        : 1 1 320px ;
}

.tableToolbarArrange {
    flex                        : 1 1 430px ;
}

.tableToolbarActions {
    align-content               : center ;
    align-items                 : center ;
    display                     : flex ;
    flex                        : 1 1 520px ;
    flex-wrap                   : wrap ;
    gap                         : 5px ;
    margin-left                 : auto ;
}

.tableToolbarSectionLabel {
    color                       : rgba(255, 255, 255, 0.55) ;
    flex                        : 0 0 100% ;
    font-size                   : 8px ;
    font-weight                 : 700 ;
    letter-spacing              : 0.08em ;
    line-height                 : 1 ;
    margin-bottom               : 2px ;
    text-transform              : uppercase ;
}

.tableToolbarControl {
    align-items                 : center ;
    background                  : rgba(255, 255, 255, 0.05) ;
    border                      : 1px solid var(--light-green) ;
    border-radius               : 7px ;
    box-shadow                  : 0 0 8px rgba(120, 255, 120, 0.12) ;
    box-sizing                  : border-box ;
    display                     : flex ;
    gap                         : 7px ;
    min-height                  : 30px ;
    padding                     : 0 9px ;
}

.tableToolbarControl:hover {
    box-shadow                  : 0 0 10px rgba(120, 255, 120, 0.25) ;
}

.tableToolbarControl:focus-within {
    border-color                : var(--light-green) ;
    box-shadow                  : 0 0 14px rgba(120, 255, 120, 0.45) ;
}

.tableToolbarTableSelect {
    min-width                   : 190px ;
    position                    : relative ;
}

.tableToolbarTableSelect select {
    appearance                  : none ;
    background                  : transparent ;
    border                      : 0 ;
    color                       : white ;
    cursor                      : pointer ;
    flex                        : 1 ;
    font                        : inherit ;
    min-width                   : 0 ;
    outline                     : 0 ;
    padding                     : 0 22px 0 0 ;
}

.tableToolbarControl option {
    color                       : black ;
}

.tableToolbarSelectArrow {
    pointer-events              : none ;
    position                    : absolute ;
    right                       : 10px ;
}

.tableToolbarSearch {
    align-items                 : center ;
    background                  : rgba(255, 255, 255, 0.05) ;
    border                      : 1px solid var(--light-green) ;
    border-radius               : 7px ;
    box-shadow                  : 0 0 8px rgba(120, 255, 120, 0.12) ;
    display                     : flex ;
    flex                        : 1 1 270px ;
    min-height                  : 30px ;
    min-width                   : 200px ;
    overflow                    : hidden ;
}

.tableToolbarSearch:hover {
    box-shadow                  : 0 0 10px rgba(120, 255, 120, 0.25) ;
}

.tableToolbarSearch:focus-within {
    border-color                : var(--light-green) ;
    box-shadow                  : 0 0 14px rgba(120, 255, 120, 0.45) ;
}

.tableToolbarSearchIcon {
    color                       : var(--light-green) ;
    flex                        : 0 0 auto ;
    margin-left                 : 10px ;
}

.tableToolbarSearch input {
    background                  : transparent ;
    border                      : 0 ;
    box-sizing                  : border-box ;
    color                       : white ;
    flex                        : 1 ;
    font                        : inherit ;
    min-width                   : 40px ;
    outline                     : 0 ;
    padding                     : 7px 9px ;
}

.tableToolbarSearch input::placeholder {
    color                       : rgba(220, 255, 220, 0.55) ;
}

.tableToolbarSearch input::-webkit-search-cancel-button {
    appearance                  : none ;
}

.tableToolbarIconButton {
    align-items                 : center ;
    align-self                  : stretch ;
    background                  : transparent ;
    border                      : 0 ;
    border-left                 : 1px solid rgba(255, 255, 255, 0.10) ;
    color                       : rgba(255, 255, 255, 0.75) ;
    cursor                      : pointer ;
    display                     : flex ;
    justify-content             : center ;
    min-width                   : 30px ;
    padding                     : 0 9px ;
}

.tableToolbarIconButton:hover {
    background                  : rgba(255, 255, 255, 0.10) ;
    color                       : var(--light-green) ;
}

.tableToolbarIconButton:disabled {
    color                       : #bbbbbb ;
    cursor                      : default ;
}

.tableToolbarFilters {
    display                     : flex ;
    flex                        : 0 0 100% ;
    flex-wrap                   : wrap ;
    gap                         : 5px ;
}

.tableToolbarFilters:empty {
    display                     : none ;
}

.tableToolbarChip {
    align-items                 : center ;
    background                  : var(--purple) ;
    border                      : 1px solid #d5c9ff ;
    border-radius               : 7px ;
    color                       : var(--light-green);
    display                     : inline-flex ;
    font-size                   : 11px ;
    gap                         : 5px ;
    max-width                   : 100% ;
    min-height                  : 25px ;
    padding                     : 0 4px 0 9px ;
}

.tableToolbarChipText {
    overflow                    : hidden ;
    text-overflow               : ellipsis ;
    white-space                 : nowrap ;
}

.tableToolbarChipClear {
    align-items                 : center ;
    background                  : transparent ;
    border                      : 0 ;
    border-radius               : 50% ;
    color                       : inherit ;
    cursor                      : pointer ;
    display                     : flex ;
    height                      : 20px ;
    justify-content             : center ;
    padding                     : 0 ;
    width                       : 20px ;
}

.tableToolbarChipClear:hover {
    background                  : rgba(77, 55, 133, 0.12) ;
}

.tableToolbarControlGroup,
.tableToolbarActionGroup {
    display                     : flex ;
    flex-wrap                   : wrap ;
    gap                         : 6px ;
}

.tableToolbarButton {
    align-items                 : center ;
    border                      : 1px solid rgba(0, 0, 0, 0.10) ;
    border-radius               : 7px ;
    color                       : #333333 ;
    cursor                      : pointer ;
    display                     : inline-flex ;
    font                        : inherit ;
    font-size                   : 15px ;
    gap                         : 6px ;
    justify-content             : center ;
    min-height                  : 30px ;
    padding                     : 4px 8px ;
    text-align                  : left ;
}

.tableToolbarButton:hover {
    background                  : rgba(255, 255, 255, 0.16) ;
    border-color                : var(--light-green) ;
}

.tableToolbarButton:disabled {
    color                       : #aaaaaa ;
    cursor                      : default ;
    opacity                     : 0.65 ;
}

.tableToolbarButtonText {
    display                     : flex ;
    flex-direction              : column ;
    line-height                 : 1.1 ;
    max-width                   : 190px ;
    overflow                    : hidden ;
    text-overflow               : ellipsis ;
    white-space                 : nowrap ;
}

.tableToolbarButtonText small {
    color                       : rgba(255, 255, 255, 0.55) ;
    font-size                   : 8px ;
    font-weight                 : 600 ;
    margin-bottom               : 0 ;
    text-transform              : uppercase ;
}

.tableToolbarControlGroup .tableToolbarButton {
    background                  : rgba(255, 255, 255, 0.08) ;
    border-color                : rgba(220, 255, 219, 0.55) ;
    color                       : white ;
}

.tableToolbarRefreshButton {
    background                  : rgba(255, 255, 255, 0.08) ;
    border-color                : var(--light-green) ;
    color                       : white ;
}

.tableToolbarPrimaryButton {
    background                  : #6750a4 ;
    border-color                : #6750a4 ;
    color                       : #ffffff ;
    font-weight                 : 600 ;
}

.tableToolbarPrimaryButton:hover {
    background                  : #57408f ;
    border-color                : #57408f ;
}

.tableToolbarSummary {
    align-content               : center ;
    align-items                 : center ;
    display                     : flex ;
    flex                        : 0 1 240px ;
    flex-wrap                   : wrap ;
    gap                         : 3px ;
    justify-content             : flex-end ;
    max-width                   : 240px ;
}

.tableToolbarSummary[hidden] {
    display                     : none ;
}

.tableToolbarSummary .countFlags {
    align-items                 : center ;
    box-sizing                  : border-box ;
    display                     : inline-flex ;
    font-size                   : 9px ;
    font-weight                 : 700 ;
    height                      : 18px ;
    line-height                 : 1 ;
    margin                      : 0 ;
    padding                     : 0 6px ;
    white-space                 : nowrap ;
}

.tableToolbarActionGroup {
    flex                        : 0 0 auto ;
    margin-left                 : auto ;
}

.tableToolbarMessage {
    display                     : block ;
    margin                      : 0 0 8px 0 ;
    min-height                  : 0 ;
}


/*
 * Tablet
 */
@media screen and (max-width: 1050px) {
    .tableToolbarActions {
        flex                    : 1 1 100% ;
        justify-content         : flex-end ;
        margin-left             : 0 ;
    }

    .tableToolbarActions .tableToolbarSectionLabel {
        text-align              : right ;
    }
}


/*
 * Narrow screens
 */
@media screen and (max-width: 700px) {
    .tableToolbar {
        border-radius           : 8px ;
        display                 : block ;
        overflow                : visible ;
    }

    .tableToolbarSection {
        border-bottom           : 1px solid rgba(255, 255, 255, 0.10) ;
        box-sizing              : border-box ;
        min-height              : 0 ;
        padding                 : 7px ;
        width                   : 100% ;
    }

    .tableToolbarSection + .tableToolbarSection {
        border-left             : 0 ;
    }

    .tableToolbarSection:last-child {
        border-bottom           : 0 ;
    }

    .tableToolbarView,
    .tableToolbarFind,
    .tableToolbarArrange,
    .tableToolbarActions {
        flex                    : none ;
    }

    .tableToolbarTableSelect {
        width                   : 100% ;
    }

    .tableToolbarSearch {
        flex                    : 1 1 100% ;
        width                   : 100% ;
    }

    .tableToolbarControlGroup {
        display                 : grid ;
        grid-template-columns   : repeat(3, minmax(0, 1fr)) ;
        width                   : 100% ;
    }

    .tableToolbarControlGroup .tableToolbarButton {
        min-width               : 0 ;
        overflow                : hidden ;
        padding                 : 6px ;
    }

    .tableToolbarButtonText {
        max-width               : 100% ;
    }

    .tableToolbarSummary {
        flex                    : 1 1 100% ;
        justify-content         : flex-start ;
        max-width               : none ;
        order                   : 2 ;
    }

    .tableToolbarActionGroup {
        display                 : grid ;
        grid-template-columns   : minmax(0, 1fr) minmax(0, 1fr) ;
        margin-left             : 0 ;
        order                   : 1 ;
        width                   : 100% ;
    }

    .tableToolbarActions .tableToolbarSectionLabel {
        text-align              : left ;
    }
}


/*
 * Very small screens
 */
@media screen and (max-width: 430px) {
    .tableToolbarControlGroup {
        grid-template-columns   : 1fr ;
    }

    .tableToolbarControlGroup .tableToolbarButton {
        justify-content         : flex-start ;
        width                   : 100% ;
    }

    .tableToolbarActionGroup {
        grid-template-columns   : 1fr 1.4fr ;
    }

    .tableToolbarPrimaryButton span,
    .tableToolbarRefreshButton span {
        overflow                : hidden ;
        text-overflow           : ellipsis ;
        white-space             : nowrap ;
    }
}

.tableViewSummaryChip.forced {
    opacity         : 0.55 ;
    filter          : grayscale(1) ;
}

.tableViewSummaryChip.forced i {
    opacity         : 0.8 ;
}

.tableToolbarSettingClear {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-left: 0.4rem;

    cursor: pointer;

    opacity: 0.65;
}

.tableToolbarSettingClear:hover {
    opacity: 1;
}

/*
 * Schema Manager toolbar
 */

.schemaManager .tableHeader {
    background                  : var(--dark-purple) ;
    margin                      :
        0
        calc(-1 * var(--standard-padding))
        0
        calc(-1 * var(--standard-padding)) ;
    padding                     : 10px ;
}

.schemaManager .schemaToolbar {
    background                  : transparent ;
    border                      : 0 ;
    border-radius               : 0 ;
    margin                      : 0 ;
    width                       : 100% ;
}

.schemaManager .schemaToolbar .tableToolbarSection {
    background                  : transparent ;
}

.schemaManager .schemaToolbar .tableToolbarView {
    flex                        : 0 1 320px ;
}

.schemaManager .schemaToolbarColumn {
    flex                        : 0 1 320px ;
}

.schemaManager .schemaToolbar .tableToolbarControl {
    background                  : rgba(255, 255, 255, 0.05) ;
    box-shadow                  : none ;
}

/* ==================================================================
 * TABLE VIEW-SPECIFIC TOOLBAR LAYOUT
 * Formerly: topstyle.css
 * ==================================================================
 */
/*
 * Table toolbar layout
 */
 
@media screen and (min-width: 701px) {

    .tableViewHeader {
        position                : sticky !important ;
        top                     : 0 !important ;
        z-index                 : 40 !important ;
    }
}

#tableTopbar.tableToolbar {
    align-items                 : stretch !important ;
    background                  : transparent !important ;
    border                      : 0 !important ;
    box-shadow                  : none !important ;
    box-sizing                  : border-box !important ;
    display                     : grid !important ;
    gap                         : 0 !important ;
    grid-template-areas         :
        "view find"
        "arrange actions" !important ;
    grid-template-columns       : 39% minmax(0, 61%) !important ;
    margin                      : 0 0 5px 0 !important ;
    max-width                   : 100% !important ;
    min-width                   : 0 !important ;
    outline                     : 0 !important ;
    overflow                    : hidden !important ;
    padding                     : 0 !important ;
    width                       : 100% !important ;
}

#tableTopbar .tableToolbarSection {
    align-content               : center !important ;
    align-items                 : center !important ;
    box-sizing                  : border-box !important ;
    display                     : flex !important ;
    flex                        : none !important ;
    flex-wrap                   : nowrap !important ;
    gap                         : 6px !important ;
    min-height                  : 30px !important ;
    min-width                   : 0 !important ;
    padding                     : 2px 7px !important ;
}

#tableTopbar .tableToolbarView {
    border-right                : 1px solid rgba(220, 255, 219, 0.18) !important ;
    grid-area                   : view !important ;
}

#tableTopbar .tableToolbarFind {
    align-items                 : center !important ;
    display                     : grid !important ;
    gap                         : 6px !important ;
    grid-area                   : find !important ;
    grid-template-columns       : max-content minmax(0, 1fr) !important ;
    min-width                   : 0 !important ;
}

#tableTopbar .tableToolbarArrange {
    border-right                : 1px solid rgba(220, 255, 219, 0.18) !important ;
    border-top                  : 1px solid rgba(220, 255, 219, 0.18) !important ;
    grid-area                   : arrange !important ;
}

#tableTopbar .tableToolbarActions {
    align-items                 : center !important ;
    border-top                  : 1px solid rgba(220, 255, 219, 0.18) !important ;
    display                     : grid !important ;
    gap                         : 6px !important ;
    grid-area                   : actions !important ;
    grid-template-columns       : max-content minmax(0, 1fr) max-content !important ;
    justify-content             : stretch !important ;
    margin                      : 0 !important ;
    min-width                   : 0 !important ;
    overflow                    : hidden !important ;
}

#tableTopbar .tableToolbarSectionLabel {
    flex                        : 0 0 auto !important ;
    font-size                   : 7px !important ;
    line-height                 : 1 !important ;
    margin                      : 0 !important ;
    white-space                 : nowrap !important ;
}


/*
 * Table selector
 */

#tableTopbar .tableToolbarControl {
    flex                        : 1 1 auto !important ;
    height                      : 24px !important ;
    min-height                  : 24px !important ;
    min-width                   : 0 !important ;
}

#tableTopbar .tableToolbarTableSelect {
    min-width                   : 0 !important ;
    width                       : auto !important ;
}


/*
 * Search
 */

#tableTopbar .tableToolbarFind .tableToolbarSectionLabel {
    grid-column                 : 1 !important ;
}

#tableTopbar .tableToolbarSearch {
    height                      : 24px !important ;
    min-height                  : 24px !important ;
    min-width                   : 0 !important ;
}

#tableTopbar .tableToolbarFind .tableToolbarSearch {
    display                     : flex !important ;
    flex                        : none !important ;
    grid-column                 : 2 !important ;
    width                       : 100% !important ;
}

#tableTopbar .tableToolbarFind .tableToolbarFilters {
    grid-column                 : 2 !important ;
}

#tableTopbar .tableToolbarSearch input,
#tableTopbar .tableToolbarSearch input:hover,
#tableTopbar .tableToolbarSearch input:focus,
#tableTopbar .tableToolbarSearch input:active {
    appearance                  : none !important ;
    background                  : transparent !important ;
    border                      : 0 !important ;
    border-radius               : 0 !important ;
    box-shadow                  : none !important ;
    display                     : block !important ;
    flex                        : 1 1 auto !important ;
    height                      : 24px !important ;
    min-width                   : 0 !important ;
    outline                     : 0 !important ;
    padding                     : 2px 6px !important ;
    width                       : 100% !important ;
}

/*
 * Active click-to-filter shares the Search footprint
 */

#tableTopbar .tableToolbarFind.tableToolbarFindFiltered {
    grid-template-columns:
        max-content
        minmax(0, 3fr)
        minmax(0, 2fr) !important;
}

#tableTopbar
.tableToolbarFind.tableToolbarFindFiltered
.tableToolbarSearch {
    grid-column                 : 2 !important ;
    min-width                   : 0 !important ;
    width                       : 100% !important ;
}

#tableTopbar
.tableToolbarFind.tableToolbarFindFiltered
.tableToolbarFilters {
    align-items                 : stretch !important ;
    display                     : flex !important ;
    flex-wrap                   : nowrap !important ;
    grid-column                 : 3 !important ;
    margin-top                  : 4px !important ;
    min-width                   : 0 !important ;
    width                       : 100% !important ;
}

#tableTopbar
.tableToolbarFind.tableToolbarFindFiltered
.tableToolbarChip {
    box-sizing                  : border-box !important ;
    gap                         : 6px !important ;
    height                      : 24px !important ;
    max-width                   : 100% !important ;
    min-height                  : 24px !important ;
    min-width                   : 0 !important ;
    padding                     : 0 8px !important ;
    width                       : 100% !important ;
}

#tableTopbar
.tableToolbarFind.tableToolbarFindFiltered
.tableToolbarChipText {
    flex                        : 1 1 auto !important ;
    min-width                   : 0 !important ;
    overflow                    : hidden !important ;
    text-overflow               : ellipsis !important ;
    white-space                 : nowrap !important ;
}

/*
 * Arrange controls and shared button styling
 */

#tableTopbar .tableToolbarControlGroup {
    align-items                 : center !important ;
    display                     : flex !important ;
    flex                        : 1 1 auto !important ;
    flex-wrap                   : nowrap !important ;
    gap                         : 4px !important ;
    min-width                   : 0 !important ;
    overflow                    : hidden !important ;
}

#tableTopbar .tableToolbarButton {
    align-items                 : center !important ;
    box-sizing                  : border-box !important ;
    display                     : inline-flex !important ;
    flex                        : 0 0 auto !important ;
    font-size                   : 11px !important ;
    gap                         : 5px !important ;
    height                      : 24px !important ;
    justify-content             : center !important ;
    min-height                  : 24px !important ;
    padding                     : 1px 6px !important ;
}

#tableTopbar .tableToolbarButtonText {
    display                     : flex !important ;
    flex-direction              : column !important ;
    justify-content             : center !important ;
    line-height                 : 1 !important ;
    min-width                   : 0 !important ;
}

#tableTopbar .tableToolbarButtonText small {
    font-size                   : 6px !important ;
    line-height                 : 1 !important ;
    margin                      : 0 0 1px 0 !important ;
}


/*
 * Summary cards
 *
 * These reuse:
 *   .tableToolbarButton
 *   .tableToolbarButtonText
 *
 * Expected card class:
 *   .countFlags.tableToolbarButton.tableToolbarSummaryCard
 */

#tableTopbar .tableToolbarSummary {
    align-items                 : center !important ;
    display                     : grid !important ;
    gap                         : 4px !important ;
    grid-template-columns       : repeat(4, minmax(69px, max-content)) !important ;
    justify-content             : end !important ;
    margin                      : 0 0 0 46 !important ;
    min-width                   : 0 !important ;
}

#tableTopbar .tableToolbarSummaryCard {
    border                      : 1px solid rgba(220,255,219,.50) !important ;
    cursor                      : default !important ;
    color                       : white;
    min-width                   : 69px !important ;
    text-align                  : left !important ;
}

#tableTopbar .tableToolbarSummaryCard:hover {
    filter                      : none !important ;
}

#tableTopbar .tableToolbarSummaryCard > i {
    flex                        : 0 0 auto !important ;
    font-size                   : 11px !important ;
    line-height                 : 1 !important ;
    margin                      : 0 !important ;
}

#tableTopbar .tableToolbarSummaryCard .tableToolbarButtonText {
    align-items                 : flex-start !important ;
    max-width                   : none !important ;
    overflow                    : visible !important ;
    text-overflow               : clip !important ;
}

#tableTopbar .tableToolbarSummaryCard .tableToolbarButtonText small {
    color                       : inherit !important ;
    font-size                   : 6px !important ;
    font-weight                 : 500 !important ;
    letter-spacing              : 0.04em !important ;
    opacity                     : 0.72 !important ;
    text-transform              : uppercase !important ;
}

#tableTopbar .tableToolbarSummaryCard .tableToolbarButtonText > span {
    color                       : inherit !important ;
    display                     : block !important ;
    font-size                   : 11px !important ;
    font-weight                 : 500 !important ;
    line-height                 : 1 !important ;
    margin                      : 0 !important ;
    padding                     : 0 !important ;
}


/*
 * Preserve summary-card colours on hover.
 */

#tableTopbar .tableToolbarSummaryCard.black:hover {
    background                  : black !important ;;
}

#tableTopbar .tableToolbarSummaryCard.red:hover {
    background                  : red !important ;
}

#tableTopbar .tableToolbarSummaryCard.purple:hover {
    background                  : var(--purple, purple) !important ;
}

#tableTopbar .tableToolbarSummaryCard.blue:hover {
    background                  : blue !important ;
}


/*
 * Action buttons
 */

#tableTopbar .tableToolbarActionGroup {
    align-items                 : center !important ;
    display                     : flex !important ;
    flex                        : 0 0 auto !important ;
    flex-wrap                   : nowrap !important ;
    gap                         : 5px !important ;
    margin                      : 0 !important ;
    min-width                   : max-content !important ;
    width                       : auto !important ;
}

#tableTopbar .tableToolbarActionGroup .tableToolbarButton {
    white-space                 : nowrap !important ;
}


/*
 * Toolbar wrapper
 */

#dreyBody {
    box-sizing                  : border-box !important ;
    min-width                   : 0 !important ;
    overflow-x                  : hidden !important ;
    padding-top                 : 0 !important ;
}

.tableHeader {
    background                  : var(--dark-green) ;
    border                      : 0 !important ;
    box-shadow                  : none !important ;
    margin                      :
        calc(-1 * var(--standard-padding))
        calc(-1 * var(--standard-padding))
        8px
        calc(-1 * var(--standard-padding)) ;
    outline                     : 0 !important ;
    padding                     : 10px ;
}


/*
 * Mobile
 */

@media screen and (max-width: 700px) {
    #tableTopbar.tableToolbar {
        display                 : block !important ;
    }

    #tableTopbar .tableToolbarSection {
        border-bottom           : 1px solid rgba(220, 255, 219, 0.14) !important ;
        border-left             : 0 !important ;
        border-right            : 0 !important ;
        border-top              : 0 !important ;
        width                   : 100% !important ;
    }

    #tableTopbar .tableToolbarActions {
        grid-template-columns   : 70px 1fr max-content !important ;
        justify-content         : flex-start !important ;
    }

    #tableTopbar .tableToolbarSummary {
        grid-template-columns   : repeat(2, max-content) !important ;
    }
}

#tableTopbar .tableToolbarFind .tableToolbarSearch {
    margin-top                  : 4px !important ;
}
/*
 * Schema Manager toolbar
 *
 * The purple state belongs to the full-width tableHeader.
 * Shared toolbar controls remain transparent inside it.
 */

.schemaManager .tableHeader {
    background                  : var(--dark-purple) ;
    margin                      :
        0
        calc(-1 * var(--standard-padding))
        18px
        calc(-1 * var(--standard-padding)) ;
    padding                     : 10px ;
}

.schemaManager .schemaToolbar {
    background                  : transparent ;
    border                      : 0 ;
    border-radius               : 0 ;
    margin                      : 0 ;
    width                       : 100% ;
}

.schemaManager .schemaToolbar .tableToolbarSection {
    background                  : transparent ;
}

.schemaManager .schemaToolbar .tableToolbarView {
    flex                        : 0 1 320px ;
}

.schemaManager .schemaToolbarColumn {
    flex                        : 0 1 320px ;
}

.schemaManager .schemaToolbar .tableToolbarTableSelect {
    min-width                   : 220px ;
}

.schemaManager .schemaToolbarColumn .tableToolbarTableSelect {
    min-width                   : 240px ;
}

.schemaManager .schemaToolbar .tableToolbarControl {
    background                  : rgba(255, 255, 255, 0.05) ;
    box-shadow                  : none ;
}

.schemaManager .schemaToolbar .tableToolbarControl:hover {
    box-shadow                  : 0 0 10px rgba(255, 255, 255, 0.18) ;
}

.schemaManager .schemaToolbar .tableToolbarControl:focus-within {
    box-shadow                  : 0 0 12px rgba(255, 255, 255, 0.28) ;
}

.schemaManager .schemaToolbar .tableToolbarIconButton:hover {
    background                  : rgba(255, 255, 255, 0.10) ;
}


.schemaManager .schemaToolbar .tableToolbarSection {
    align-items                 : center ;
    flex-wrap                   : nowrap ;
}

.schemaManager .schemaToolbar .tableToolbarSectionLabel {
    flex                        : 0 0 auto ;
    margin                      : 0 ;
}

.schemaManager .schemaToolbar .tableToolbarControl {
    flex                        : 1 1 auto ;
}

.schemaToolbarEyebrow {
    color: rgba(255, 255, 255, 0.7);
    font-family: "Roboto Condensed", sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    margin: 0 0 4px 2px;
}

.tableToolbarExportForm {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.tableToolbarExportHidden {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
    font-size: 0.8rem;
    cursor: pointer;
}

.tableToolbarExportHidden input {
    margin: 0;
}