/*
mobileTableCard --> dashGrid-mobile
*/

/*----------------------------------------------------
Mobile
----------------------------------------------------*/

/* Tables -> Cards */
.dashGrid-mobile .card {
    width: 100%;
    border-radius: var(--Small, 0.5rem);
    border: 1px solid var(--Border-Primary, #E9EBEC);
    background: var(--Surface-Background-Primary, #FFF);
}

.card-titleContainer>*,
.card-text>* {
    display: flex;
    flex-direction: row;
}

/*
.card-titleContainer {
    gap: 0.5rem;
}

.card-titleContainer h5 {
    color: var(--color-mode-text-link-primary);
}

.dashGrid-mobile .card-body>.card-text {
    border-bottom: 1px solid var(--color-mode-border-primary, #E9EBEC);
}

.dashGrid-mobile .card-body>div:nth-of-type(3) {
    border-bottom: none;
}
*/
/*
.dashGrid-mobile .card-content .k-datepicker .k-input-inner {
	max-width: 6rem;
}
*/
/*Mobile grid styles*/

/* Hide the grid header */
.mobilegrid .k-grid-header,
.holman-drawer-mobile .dashGrid-desk .k-grid-header {
    display: none;
}

/* Remove the row borders */
.mobilegrid .k-grid-table tr,
.mobilegrid .k-grid-table td {
    border: none;
    background-color: #FFFFFF;
}

/* Remove hover background color */
.mobilegrid .k-grid-table tr:hover {
    background-color: #FFFFFF !important;
}

/* Remove background color from even rows */
.mobilegrid .k-alt {
    background-color: #FFFFFF !important;
}

.k-grid .k-table {
    margin: 0;
    width: 100%;
    max-width: none;
    border-width: 0;
    border-color: inherit;
    border-collapse: separate;
    border-spacing: 0;
    box-sizing: content-box;
    empty-cells: show;
    outline: 0
}

.mobilegrid.k-grid .k-table-tbody>.k-table-row:not(.k-detail-row):hover,
.mobilegrid.k-grid .k-table-tbody>.k-table-row:not(.k-detail-row).k-hover,
.mobilegrid.k-grid .k-table-tbody>.k-table-row:hover,
.mobilegrid.k-grid .k-table-tbody>.k-table-row.k-selected {
    background: #FFFFFF !important;
}

.mobilegrid.k-grid .k-table-tbody>.k-table-row.k-selected:hover {
    background: #FFFFFF !important;
}

.mobilegrid .k-grid .k-table-tbody>.k-table-row td {
    background: #FFFFFF !important;
}

.mobilegrid.k-grid.k-grid-md .k-toolbar.k-grid-toolbar.k-toolbar-md {
    display: none
}

/*mobile windowMin*/
.mobile.windowMin {
    width: 100vw !important;
    gap: 1.5rem;
}

/*Styling for icon only button*/
/* comment out 11/4/24
.iconbutton {
	padding: 0.5rem !important;
	background: none !important;
	border: none !important;
	height: 2.5rem;
}


.custom-lg-icon {
    width: 1.5rem;
    height: 1.5rem;
    font-size: 1.5rem !important;
    color: var(--color-mode-icon-primary);
}

.bottom-center {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    margin-top: auto;
    border-top: 1px solid var(--color-mode-border-primary);
}

.k-dropdownlist.k-warning {
    border-radius: 4px;
    border: 2px solid #D5B688;
    box-shadow: 0px 0px 0px 2px var(--color-mode-surface-accent-warning-subtle);
}
*/
/* comment out 11/4/24
.text-button {
	font-family: var(--body-small-regular-font-family);
	font-size: var(--body-small-regular-font-size);
	font-style: var(--body-small-regular-font-style);
	font-weight: var(--body-small-regular-font-weight);
	line-height: var(--body-small-regular-line-height);
	letter-spacing: var(--body-small-regular-letter-spacing);
}
*/

/*StatusType Chip
.k-chip,
.k-chip-md,
.k-chip.k-chip-md,
.statustype.k-chip,
.statustype.k-chip.k-chip-md {
    display: inline-flex;
    flex: 1 1 auto;
    padding-block: unset;
    padding-inline: unset;
    padding: var(--2, 0.125rem) var(--Spacing-Component-Small, 0.5rem);
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: var(--Spacing-Component-xSmall, 0.25rem);
    font-family: var(--body-extra-small-bold-font-family);
    font-size: var(--body-extra-small-bold-font-size);
    font-style: var(--body-extra-small-bold-font-style);
    font-weight: var(--body-extra-small-bold-font-weight);
    line-height: var(--body-extra-small-bold-line-height);
    letter-spacing: var(--body-extra-small-bold-letter-spacing);
    overflow: visible;
    background-image: none;
    border-radius: var(--Huge, 3rem);
    border: 0;
    display: inline-flex;
}

.statustype.success.k-chip {
    background: var(--color-mode-surface-accent-success-z);
    color: var(--color-mode-text-success);
}

.statustype.warning.k-chip {
    background-color: var(--color-mode-surface-accent-warning-subtle);
    color: var(--color-mode-text-warning);
}

.statustype.info.k-chip {
    background-color: var(--color-mode-surface-accent-info-subtle);
    color: var(--color-mode-text-info);
}

.statustype.error.k-chip {
    background-color: var(--color-mode-surface-accent-error-subtle);
    color: var(--color-mode-text-danger);

}

.primary-color {
    color: var(--color-mode-CTA-primary-fill-default);
}

.text-icon-color {
    color: var(--color-mode-icon-primary);
}

.icon-info-color {
    color: var(--color-mode-icon-info);
}

.icon-success-color {
    color: var(--color-mode-icon-success);
}

.holman-tooltip .k-tooltip {
    color: var(--color-mode-surface-background-primary);
    background: var(--color-mode-text-info);
}
*/






/* TEMPORTARY, until header fixed (pushing down content, cutting off bottom of page) 
@media (max-width: 767.99px) {
    .page.mainLayoutRazor {
        padding-bottom: 5rem;
    }
}
*/
/* Quick fix for mobile cards showing correct width 
.mobilegrid,
.mobilegrid .k-grid .k-grid-aria-root {
    max-width: 100vw;
    max-width: calc(100vw - 3rem);
}
*/
















/*To hide the grid scroll bar and border radius for grid*/
.grid-no-scroll .k-grid-content {
    overflow-y: auto;
}

.grid-no-scroll .k-grid-header,
.grid-no-scroll .k-grid-footer {
    padding-right: 0;
}

.grid-no-scroll .k-grid-header-wrap,
.grid-no-scroll .k-grid-footer-wrap {
    border-right-width: 0;
}

.k-grid {
    border-radius: 8px !important;
}

/*
.k-grid .k-pager {
    border-radius: 0px 0px 8px 8px !important;
}
*/
.k-grid .k-grid-header,
.k-grid .k-grid-aria-root {
    border-radius: 8px 8px 0px 0px !important;
}














/*----------------------------------------------------

Mobile Consolidation

----------------------------------------------------*/

/* Dash Layout */
.holman-drawer-mobile article {
    width: 100%;
    padding: var(--spacing-mode-spacing-page-large, 1.5rem) var(--spacing-mode-spacing-page-base, 1rem);
}

.mobilegrid,
.mobilegrid .k-grid .k-grid-aria-root {
    max-width: 100vw;
    max-width: calc(100vw - 3rem);
}


/*----------------------------------------------------

Filters

----------------------------------------------------*/

/* Filters - on the page */
.filters-section .filters-mobile {
    gap: var(--spacing-mode-spacing-complex-component-base, 1rem) !important;
}
.filters-section .filters-mobile .k-dropdownlist {
    min-width: 230px;
    max-width: 230px;
    width: 230px;
}
.filters-section .filters-mobile button.button-icon .k-button-text span.material-symbols-outlined {
    font-size: 1.5rem !important;
}

/* Filters - Flyout */
.filtersFlyout-mobile {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    justify-content: space-between;
}
.k-window.telerik-blazor.detailsFlyout.mobile-filters .k-window-titlebar {
    /*
    all: unset;
    */
    padding: var(--spacing-mode-spacing-complex-component-base, 1rem) var(--spacing-mode-spacing-complex-component-base, 1rem) 0 !important;
}
.filtersFlyout-mobile .filters {
    display: flex;
    flex-direction: column;

    flex: 1 1 auto;
    gap: var(--spacing-mode-spacing-complex-component-med, 1.5rem) !important;
    padding: var(--spacing-mode-spacing-complex-component-base, 1rem) var(--spacing-mode-spacing-complex-component-base, 1rem) 0 !important;
}
.filtersFlyout-mobile .card-body.detailsFlyout-buttons {
    flex: unset;
}



/* Details Flyout */
@media (max-width: 445px) {
    .k-window.telerik-blazor.detailsFlyout {
        width: 100% !important;
        left: unset !important;
    }
}


/* hide grid card toolbar */
.dashGrid-mobile .k-toolbar.telerik-blazor.k-grid-toolbar.k-toolbar-md,
.dashGrid-mobile .k-grid-header {
    display: none;
}

/* Hide header if necessary */
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-grid-header {
    display: none;
}

/* Card Grid Layout */

.dashGrid-mobile tbody,
.holman-drawer-mobile .dashGrid-desk-mobileTag tbody {
    display: flex !important;
    flex-wrap: wrap !important;
    padding-bottom: var(--spacing-mode-spacing-complex-component-base, 1rem) !important;
    background-color: #fff !important;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-tr,
.dashGrid-mobile .k-table-row,

.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-tr,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-table-row {
    display: flex !important;
    width: 100% !important;
}

.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td {
    background: #fff !important;
    border: 0 !important;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td {
    display: flex;
    flex: 1 1 auto;
    background: #fff;
}

@media (min-width: 600px) and (max-width: 787.99px) {
    .dashGrid-mobile .k-master-row.k-table-row .k-table-tr,
    .dashGrid-mobile .k-table-row,

    .holman-drawer-mobile .dashGrid-desk-mobileTag tr,
    .holman-drawer-mobile .dashGrid-desk-mobileTag .k-table-tr {
        display: flex !important;
        width: 100% !important;
        max-width: 50% !important;
    }

    .dashGrid-mobile .k-table-row:nth-child(odd) td,
    .holman-drawer-mobile .dashGrid-desk-mobileTag .k-table-row:nth-child(odd) td {
        padding: var(--spacing-mode-spacing-complex-component-base, 1rem) var(--spacing-mode-spacing-complex-component-small, 0.5rem) 0 var(--spacing-mode-spacing-complex-component-base, 1rem) !important;
    }

    .dashGrid-mobile .k-table-row:nth-child(even) td,
    .holman-drawer-mobile .dashGrid-desk-mobileTag .k-table-row:nth-child(even) td {
        padding: var(--spacing-mode-spacing-complex-component-base, 1rem) var(--spacing-mode-spacing-complex-component-base, 1rem) 0 var(--spacing-mode-spacing-complex-component-small, 0.5rem) !important;
    }

}

.dashGrid-mobile .k-table-row td,
/*
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-table-row td,
*/
.holman-drawer-mobile .dashGrid-desk-mobileTag tr td {
    padding: var(--spacing-mode-spacing-complex-component-base, 1rem) var(--spacing-mode-spacing-complex-component-base, 1rem) 0 !important;
}






/*----------------------------------------------------

Card Layout

----------------------------------------------------*/
.dashGrid-mobile .k-master-row.k-table-row .k-table-td .dashGrid-mobile .k-master-row.k-table-row .k-table-td .card,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card {
    display: flex;
    flex: 1 1 auto;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td .card-body,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card-body {
    display: flex;
    flex-direction: column;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td .card-body .card-titleContainer,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card-body .card-titleContainer {
    display: flex;
    margin-bottom: 1rem;
    gap: 0.5rem !important;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td .card-body .card-titleContainer button,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card-body .card-titleContainer button {
    padding: 0 !important;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td .card-body .card-titleContainer .card-status,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card-body .card-titleContainer .card-status {
    align-items: center;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td .card-body .card-titleContainer .card-currentStage,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card-body .card-titleContainer .card-currentStage {
    display: flex;
    flex: 1 1 auto;
    justify-content: flex-end !important;
    align-items: center !important;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td .card-body .card-text,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card-body .card-text {
    display: flex;
    padding: 0.5rem 0;
    justify-content: space-between;
    align-items: flex-start;

    font-size: var(--body-small-regular-font-size, 0.875rem);
    font-weight: 400 !important;
    font-family: var(--body-small-regular-font-family, "Source Sans Pro") !important;
    font-weight: var(--body-bold-font-weight, 600) !important;
    font-style: var(--body-small-regular-font-style, normal) !important;
    letter-spacing: var(--body-small-regular-letter-spacing, 0) !important;
}

.card-text-mobile-Comment {
    align-items: center !important;
}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td .card-body .card-text .card-content,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card-body .card-text .card-content {
    font-weight: 400 !important;

}

.dashGrid-mobile .k-master-row.k-table-row .k-table-td .card-body .card-button,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-master-row.k-table-row .k-table-td .card-body .card-button {}

/*
Pagination
*/
.dashGrid-mobile .k-pager,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-pager {
    display: flex;
    padding: var(--spacing-mode-spacing-complex-component-base, 1rem);
    flex-direction: column-reverse;
    gap: var(--spacing-mode-spacing-complex-component-base, 1rem);
}

.dashGrid-mobile .k-pager .k-pager-sizes,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-pager .k-pager-sizes {
    display: none;
}

/* */
.dashGrid-mobile .k-pager .k-pager-numbers-wrap,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-pager .k-pager-numbers-wrap {
    width: 100%;
    justify-content: space-between;
}

.dashGrid-mobile .k-pager .k-pager-numbers-wrap,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-pager .k-pager-numbers-wrap {
    width: 100%;
}



.dashGrid-mobile .k-pager .k-pager-numbers-wrap .k-pager-nav,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-pager .k-pager-numbers-wrap .k-pager-nav {
    padding: 0;
}

.dashGrid-mobile .k-pager .k-pager-numbers-wrap .k-pager-numbers button,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-pager .k-pager-numbers-wrap .k-pager-numbers button,

.dashGrid-mobile .k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-pager .k-pager-numbers-wrap .k-pager-numbers .k-button.k-button-flat.k-button-flat-primary,

.k-grid.dashGrid-desk .k-button.k-button-flat.k-button-flat-primary,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-button.k-button-flat.k-button-flat-primary {
    margin: 0;
}

.dashGrid-mobile .k-pager .k-pager-info,
.holman-drawer-mobile .dashGrid-desk-mobileTag .k-pager .k-pager-info {
    display: flex !important;
    align-self: flex-end;
}


/*----------------------------------------------------

Mobile Components

----------------------------------------------------*/

/* Filter Icons */
.holman-drawer-mobile .filters-mobile button.button-icon .k-button-text span {
    color: var(--color-mode-icon-primary, #242627);
}
.holman-drawer-mobile .filters-mobile button:hover .k-button-text span,
.holman-drawer-mobile .filters-mobile button:active .k-button-text span {
    color: #999999;
}