/* Import the mobile-specific stylesheet */
/*@import url('./aims_standard_stylesheet_mobile.css');*/

/* Import external CSS files */
@import url('external/loading_spinner.css');
@import url('external/status_indicator_pulsing.css');
/*@import url('external/weather_widget.css');*/
/*@import url('aims_custom_classes.css');*/


/* Set the Font of the whole application */
@font-face {
    font-family: 'Solitas';
    src: url('fonts/solitas-ext-book.woff2') format('woff2');
}
@font-face {
    font-family: 'NotoSansArabic';
    src: url('fonts/NotoSansArabic-Regular.woff2') format('woff2');
}
/*font-face {
    font-family: 'ReadexPro';
    src: url('fonts/ReadexPro-Regular.woff2') format('woff2');
}*/
@font-face {
    font-family: 'Cairo';
    src: url('fonts/Cairo-Regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Georama';
    src: url('fonts/Georama-Regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Almarai';
    src: url('fonts/Almarai-Regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Reforma2018Gris';
    src: url('fonts/Reforma2018-Gris.woff2') format('woff2');
}
@font-face {
    font-family: 'AvenirRegular';
    src: url('fonts/avenir_regular.woff2') format('woff2');
}
@font-face {
    font-family: 'AvenirBook';
    src: url('fonts/avenir_book.woff2') format('woff2');
}

body {
   font-family: AvenirBook, Solitas, NotoSansArabic !important;
   /*font-family: Georama, NotoSansArabic !important;*/
}
.ui-widget {
    font-family: AvenirBook, Solitas, NotoSansArabic !important;
    /*font-family: Georama, NotoSansArabic !important;*/
}

/* Border Color in Entire App */
* {
    --ut-component-border-color: rgba(127, 127, 127, 0.4);
}

.t-Button--navBar .t-Icon.fa-moon-o {
    margin-right: -2px;
    margin-left: -2px;
}
.t-Button--navBar .t-Icon.fa-sun-o {
    margin-right: -2px;
    margin-left: -2px;
}
/*.t-Button--navBar .t-Icon.fa-paint-brush {
    margin-right: -2px;
    margin-left: -2px;
}*/


/* Logo Images CSS */
.apex-logo-img {
    width: 120px;
    margin-left: 10px;
    margin-right: 10px;
    box-shadow: 0px 0px 4px 4px rgba(255,255,255,0.7);
    /*box-shadow: -1px 1px 2px 2px rgba(255, 255, 255, 0.7);*/
    background-color: rgb(255,255,255);
}
.t-HeroRegion-icon {
    background-color: transparent;
    width: 150px;
    /*height: auto;*/
}
.t-Login-logo {
    background-color: transparent;
    width: 200px;
    margin-bottom: 50px;
}


/* Navigation Menu */
.apex-side-nav.js-navCollapsed--icons .t-TreeNav {
    /*width: 75px;*/
    width: 70px;
}
/*.t-TreeNav--styleB {
    --a-treeview-node-padding-y: 1.8rem;
}*/
.t-TreeNav--styleB .a-TreeView-node {
    margin-inline-start: 1rem;
}

/*.t-TreeNav--styleB .a-TreeView-node > .a-TreeView-content > .fa {
    font-size: 1rem;
}*/

.t-TreeNav .a-TreeView-content .fa {
    /*font-size: 1.75rem;*/
    font-size: 1.6rem;
    /*color: var(--ut-focus-outline-color, -webkit-focus-ring-color);*/
    color: var(--a-treeview-node-selected-background-color);
}
/*.a-TreeView-node {
    padding-block-end: 0.5rem;
}*/
.a-TreeView-content {
    padding-block-start: 0.675rem;
    padding-block-end: 0.675rem;
}



/*.t-TreeNav .a-TreeView-content .fa:hover {
    color: white;
}*/
.a-TreeView-content.is-selected > .fa {
    color: white;
}
.a-TreeView-content.is-current--top > .fa {
    color: white;
}
.a-TreeView-label {
    margin-left: 10px;
}

.a-TreeView-content.is-current { /*.is-selected*/
    background-color: var(--ut-focus-outline-color, -webkit-focus-ring-color) !important;
    border-radius: 5px;
} /*Correct*/
.a-TreeView-content.is-current .fa { /*.is-selected*/
    color: white;
} /*Correct*/

/*.t-TreeNav .is-current, .t-TreeNav .is-current--top {
    background-color: var(--ut-focus-outline-color, -webkit-focus-ring-color) !important;
    border-radius: 5px;
}*/ /*Correct*/

.a-TreeView-content.is-hover > .fa {
    color: white;
} /*Correct*/
/*.a-TreeView-content.is-current > .fa {
    color: white;
}*/ /*Correct*/

/*.t-TreeNav .a-TreeView-node--topLevel .a-TreeView-row.is-hover fa {
    color: white;
}*/


/* Custom CSS for smaller Navigation Window */
/*.t-Body-nav {
    width: 230px;
}*/
.t-TreeNav .a-TreeView-label {
    font-size: 13px;
}
.t-TreeNav .a-TreeView-node .a-TreeView-content {
    padding-block: 8px;
}
.t-TreeNav--styleB .a-TreeView-row {
    border-radius: 20px !important;
}
.t-TreeNav--styleB .a-TreeView-node {
    margin-block: 0.1rem;
}
/*.t-TreeNav .a-TreeView-content .fa { 
    font-size: 1.6rem;
}*/
/*.apex-side-nav.js-navCollapsed--icons .t-TreeNav {
    width: 70px;
}*/


.t-Body-mainContent {
    min-height: 80vh;
}


/* Regions CSS */
.t-Region-title {
    font-size: 22px;
    line-height: 1.3rem;
}
.t-Region-header .fa {
    font-size: 22px !important;
}

/*.t-Region-headerItems--title {
    padding-block-end: var(--ut-region-header-padding-y, .4rem);
    padding-block-start: var(--ut-region-header-padding-y, .4rem);
}*/
.t-Region-header {
    border-width: 2px;
    padding-top: 0px;
    padding-bottom: 0px;
}
/* Collapsible Region */
.a-Collapsible {
    border-width: 2px;
}
/*.t-Region-titleButton {
    padding-top: 2px;
    padding-bottom: 2px;
}*/

/* Icons CSS */
.t-Region-header .fa {
    padding-top: 0rem !important;
    padding-bottom: 0rem !important;
}
/*.fa-2x {
    padding-top: 0rem !important;
    padding-bottom: 0rem !important;
}
.fa-lg {
    padding-top: 0rem !important;
    padding-bottom: 0rem !important;
}*/


.fa-check {
    /*color: green;*/
    font-weight: bold;
}
.fa-warning {
    color: #FF3333;
}



/* Display only Items CSS */
.t-AVPList-label {
    text-align: end !important;
    font-weight: normal;
}
.t-AVPList-value {
    font-weight: bold;
}

/* Region Create Area for Buttons */
.t-Region-buttons-left {
    padding: 0px;
}
.t-Region-buttons-right {
    padding: 0px;
}


/* Alert/Confirm Messages */
.a-AlertMessage-body {
    font-size: 14px;
}



/* Wizard CSS */
:root {
    /*--ut-wizard-header-background-color: var(--a-button-background-color);*/
    --ut-wizard-header-background-color: var(--ut-region-header-background-color);
}

.t-Wizard {
    max-width: none;
    border-width: 2px;
    /*box-shadow: rgba(127, 127, 127, 0.2) 0px 5px 10px 0px;*/
}
/*.u-Table.t-Wizard-controls {
    width: 60%;
    display: flex;
    align-content: center;
    //
}*/
.u-Table.t-Wizard-controls {
    padding-left: 8% !important;
    padding-right: 8% !important;
    display: flex; /* Make parent a flex-container */
    justify-content: center; /* Centers child horizontally */
    align-items: center; /* Centers child vertically */
}
.u-Table-fill {
    width: 60%;
}

.t-WizardSteps-step.is-active .t-WizardSteps-marker {
    outline: 3px double var(--ut-wp-active-background-color, var(--ut-palette-primary));
}
.t-WizardSteps-step.is-complete .t-WizardSteps-marker {
    box-shadow: 0px 0px 2.5px 2.5px var(--ut-palette-success);
}

.t-WizardSteps-wrap:after {
    height: .2rem;
    /*filter: drop-shadow(5px 5px);*/
}

/* First: check active nodes and make their left half green */
:dir(ltr) .t-WizardSteps-step.is-active .t-WizardSteps-wrap:after {
    background: linear-gradient(to right, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 100%);
}
/* Second: make first node without background (grey) */
:dir(ltr) .t-WizardSteps-step:first-child .t-WizardSteps-wrap:after {
    background: linear-gradient(to right, var(--ut-wp-track-color,var(--ut-component-border-color)) 0%, var(--ut-wp-track-color,var(--ut-component-border-color)) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 100%);
}
/* Third: make all completed nodes green on both their left and their right (entirely) */
:dir(ltr) .t-WizardSteps-step.is-complete .t-WizardSteps-wrap:after {
    /*background: linear-gradient(to right, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 100%);*/
    background: linear-gradient(to right, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-palette-success) 50%, var(--ut-palette-success) 100%);
}
:dir(ltr) .t-WizardSteps-step:last-child.is-active .t-WizardSteps-wrap:after {
    background: linear-gradient(to right, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-palette-success) 50%, var(--ut-palette-success) 100%);
}
/* Fourth: If last child is activem make it fully green, not just half. */
/*:dir(ltr) .t-WizardSteps-step.is-complete:first-child .t-WizardSteps-wrap:after {
    background: linear-gradient(to right, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-palette-success) 50%, var(--ut-palette-success) 100%);
}*/

/* NOW Rtight-To-left (Arabic) */
/* First: check active nodes and make their left half green */
:dir(rtl) .t-WizardSteps-step.is-active .t-WizardSteps-wrap:after {
    background: linear-gradient(to left, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 100%);
}
/* Second: make first node without background (grey) */
:dir(rtl) .t-WizardSteps-step:first-child .t-WizardSteps-wrap:after {
    background: linear-gradient(to left, var(--ut-wp-track-color,var(--ut-component-border-color)) 0%, var(--ut-wp-track-color,var(--ut-component-border-color)) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 100%);
}
/* Third: make all completed nodes green on both their left and their right (entirely) */
:dir(rtl) .t-WizardSteps-step.is-complete .t-WizardSteps-wrap:after {
    /*background: linear-gradient(to left, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 50%, var(--ut-wp-track-color,var(--ut-component-border-color)) 100%);*/
    background: linear-gradient(to left, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-palette-success) 50%, var(--ut-palette-success) 100%);
}
:dir(rtl) .t-WizardSteps-step:last-child.is-active .t-WizardSteps-wrap:after {
    background: linear-gradient(to left, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-palette-success) 50%, var(--ut-palette-success) 100%);
}
/* Fourth: If last child is activem make it fully green, not just half. */
/*:dir(rtl) .t-WizardSteps-step.is-complete:first-child .t-WizardSteps-wrap:after {
    background: linear-gradient(to left, var(--ut-palette-success) 0%, var(--ut-palette-success) 50%, var(--ut-palette-success) 50%, var(--ut-palette-success) 100%);
}*/






/* Region Selector CSS */
.a-RDS-label {
    font-size: 16px;
    line-height: 1.2rem;
}
.a-RDS-item {
    display: flex;
    align-items: flex-end;
    margin-top: 0px;
    padding-left: 1px;
    padding-right: 1px;
    /*border-right: var(--a-toolbar-sep-border-width, 1px) solid var(--a-toolbar-sep-border-color);*/
}
/*.apex-rds-first {
    border-right: var(--a-toolbar-sep-border-width, 1px) solid var(--a-toolbar-sep-border-color);
    border-left: var(--a-toolbar-sep-border-width, 1px) solid var(--a-toolbar-sep-border-color);
}*/


/* Media List CSS */
.t-MediaList-icon {
    box-shadow: 0 0 5px var(--ut-medialist-icon-background-color, var(--ut-component-icon-background-color));
}

/* Cards CSS */
.a-TMV-w-scroll {
    padding: 2px;
}
.a-CardView {
    border-width: 2px;
    box-shadow: 2px 2px 1px 1px rgba(128,131,134, 0.5);
    /*box-shadow: rgba(127, 127, 127, 0.25) 0px 5px 10px 0px;
    border-radius: 15px;*/
    /*border-radius: 25px;
    margin-left: 30px;
    margin-right:30px;*/
}
.a-CardView:hover {
    /*background-color: rgba(33,150,214,0.1);*/
    /*background-color: rgba(65,146,143,0.4);*/
    background-color: rgba(0, 148, 211, 0.4);
    transition: 0.3
}
.a-CardView-icon {
    border-radius: 50px;
}


/* Timeline */
.t-Timeline-title {
    font-size: 14px;
}

/* Content Row */
t-ContentRow-wrap {

}

/* Media List */
.t-MediaList-item:hover {
    background-color: rgba(33, 150, 214, 0.4);
    transition: 0.4s;
}


/* Hide the Icon that shows in the Interactive Report when no data found */

/* Interactive Report CSS */
.a-IRR-reportView {
    box-shadow: rgba(127, 127, 127, 0.25) 0px 5px 10px 0px;
}
/*box-shadow: rgba(127, 127, 127, 0.26) 0px 10px 36px 0px, rgba(127, 127, 127, 0.16) 0px 0px 0px 1px;*/
.a-IRR-toolbar {
    padding-top: 5px;
    padding-bottom: 5px;
}
.icon-irr-no-results {
    display: none;
}


/* Classic Report */
.t-Report th, .t-Report td {
    font-size: 13px;
}
.t-Report--horizontalBorders .t-Report-pagination.t-Report-pagination--bottom {
    border-block-start-style: solid;
    border-block-start-width: 0.5px;
    border-color: var(--ut-region-border-color, var(--ut-component-border-color));
}


/* Get rid of the random dash that is added as the "\00a0" character in floating display-only items for the Solitas font */
.apex-item-display-only:after {
    content: none !important;
}


.t-Button--large {
    --a-button-font-size: .7875rem;
    --a-button-line-height: .9rem;
    --a-button-padding-y: .675rem;
    --a-button-padding-x: .9rem;
}
/*.t-Button--large {
    --a-button-font-size: .875rem;
    --a-button-line-height: 1rem;
    --a-button-padding-y: .75rem;
    --a-button-padding-x: 1rem;
}*/



/* INTERACTIVE REPORT CUSTOMIZATION */
.a-IRR-header {
    /*background-color: var(--ut-region-header-background-color) !important;*/
    border-width: 2px;
}
.a-IRR-toolbar {
    /*background-color: var(--ut-region-background-color, var(--ut-component-background-color));
    padding-top: 6px;
    padding-bottom: 6px;*/
}
.a-IRR-table th {
    font-size: 14px;
    line-height: 1.15rem;
    border-left-style: hidden;
    padding-left: 2px;
    padding-right: 2px;
}

.a-IRR-table td {
    font-size: 13px;
    line-height: 1.15rem;
    border-left-style: hidden;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    padding-bottom: 4px;
    height: 2.4rem;
}
.a-IRR-paginationWrap {
    -webkit-padding-before: 4px;
    -webkit-padding-after: 4px;
    padding-block-end: 4px;
    padding-block-start: 4px;
}



.t-Avatar--image:not(:empty) {
    border: 2px solid var(--ut-component-border-color);
    /*border: 2px solid var(--ut-body-title-text-color);
    border: 2px solid var(--ut-focus-outline-color, -webkit-focus-ring-color);
    border: 2px solid var(--a-treeview-node-selected-background-color);*/
}
.ui-dialog--notification {
    width: 400px !important;
}
/*.ui-dialog-content {
    width: 400px !important;
    height: auto;
    padding: 30px;
}*/

/*.apex-item-display-only {
    border-style: solid !important;
}*/



/* Custom Classes ------------------------------------------------------------------------ >>> */

/* Custom class for Welcome Message */
.welcome-message {
    font-size: 20px;
    font-weight: bold;
    line-height: 2.0em;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    height: 100%;
    margin-right: 18px;
    margin-left: 18px;
}

/* Custom Class for region with shadow border */
.homepage-region {
    height: 100%;
    box-shadow: 0px 0px 3px 3px rgba(128,131,134, 0.35);
}
.chart-region {
    height: 100%;
    box-shadow: 0px 0px 3px 3px rgba(128,131,134, 0.35);
    border-width: 1px !important;
}

/* Custom class for form region wraps */
.wrap-form-region {
    padding-left: 10px;
    padding-right: 10px;
    border-width: 1.5px;
    border-radius: 15px;
    /*box-shadow: rgba(127, 127, 127, 0.25) 0px 5px 5px 0px;*/
}

/* Custom class for display Region at the top of pages.*/
.data-display-region {
    box-shadow: 0px 0px 3px 3px rgba(128,131,134, 0.35);
    /*border-radius: 5px;*/
}
.data-display-region .t-Form-inputContainer {
    padding-top: 3px;
    padding-bottom: 3px;
}
.data-display-region .t-Form-labelContainer {
    padding-top: 3px;
    padding-bottom: 3px;
}

/* Custom Class to be assigned to RDS Regions to make them middle */
.parent-bottom-align {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
}

/* Custom class for the button region found in breadcrumb area */
.breadcrumb-button-region {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-end;
    padding-inline-end: 10px;
}
.breadcrumb-button-region .t-Region-buttons-left {
	padding: 8px;
}
.breadcrumb-button-region .t-Region-buttons-right {
	padding: 8px;
}
.breadcrumb-button-region .t-Region-buttons--top {
    display: none;
}

/* Custom class for the button region found in breadcrumb area for small buttons (example Help button) */
.help-button-region {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-end;
    padding-inline-end: 5px;
}
.help-button-region .t-Region-buttons-left {
	padding: 8px;
    padding-bottom: 0px;
}
.help-button-region .t-Region-buttons-right {
	padding: 8px;
    padding-bottom: 0px;
}
.help-button-region .t-Region-buttons--top {
    display: none;
}


/* Custom CSS Class given to Content Row Region inside Breadcrumb */
.breadcrumb-content-row {
    padding-top: 10px;
    padding-left: 15px;
}
.breadcrumb-content-row .t-ContentRow-wrap {
    padding-block-end: 0rem;
    padding-block-start: 0rem;
    padding-inline-end: 0rem;
    padding-inline-start: 0rem;
}
.breadcrumb-content-row .t-Badge-value {
    font-size: 16px;
}
.breadcrumb-content-row .t-Badge--lg {
    /*--ut-badge-padding-x: 0.75rem;*/
    --ut-badge-padding-y: 0.2rem;
    /*--ut-badge-height: 2rem;
    --ut-badge-icon-size: 1rem;
    --ut-badge-font-size: 1rem;
    --ut-badge-line-height: 1.5rem;
    --ut-badge-border-radius: .25rem;*/
}
.breadcrumb-content-row .t-ContentRow-overline {
    font-size: 16px;
    line-height: 1.2rem;
}
.breadcrumb-content-row .t-ContentRow-title {
    font-size: 22px;
    font-weight: bold;
    line-height: 2.0rem;
}
.breadcrumb-content-row .t-ContentRow-description {
    font-size: 16px;
    line-height: 1.2rem;
}
.breadcrumb-content-row .t-ContentRow-misc {
    font-size: 16px;
}


/* Custom Class for Page Help region */
.page-help {
    font-size: 14px;
    /*text-align: justify;
    text-justify: inter-word;*/
}

/* This is the Button container at the top of the page. Requires setting the STATIC ID to "actions-region" */
#actions-region .t-Region-buttons--bottom {
    padding: 10px;
    border-width: 2px;
}


.notification-text .t-Button-label {
    font-weight: bold;
    font-size: 12px;
    background-color: red;
    border-radius: 10px;
    padding-left: 5px;
    padding-right: 5px;
    color: var(--ut-header-text-color);
    display: unset;
}

/* This is for Any Region to have a nice shadow */
.irr-standard-region {
    border-width: 1.5px;
    box-shadow: rgba(127, 127, 127, 0.2) 0px 5px 10px 0px;
}


/* >>> --------------------------------------------------------------------------------------- */



/* Mobile CSS */
@media (max-width: 768px) {
    /* Logo Images CSS */
    .apex-logo-img {
        width: 80px;
        margin-left: 0px;
        margin-right: 7px;
        box-shadow: 0px 0px 2px 2px rgba(255,255,255,0.7);
        background-color: rgb(255,255,255);
    }
    .apex-logo-text {
        font-size: 14px;
    }

    .t-Form-fieldContainer.rel-col {
        flex-direction: row !important;
    }
    .t-HeroRegion-icon {
        background-color: transparent;
        width: 75px;
        margin-right: 10px;
    }
    
    /* Mobile: Navigation Menu */
    .apex-side-nav.js-navCollapsed--icons .t-TreeNav {
        width: 0px;
    }

    /* Mobile: Region Selector */
    .a-RDS-label {
        font-size: 14px;
    }
    .a-RDS-item {
        margin-top: 2px;
        padding-left: 0px;
        padding-right: 0px;
    }

    /* Mobile: Wizard */
    .t-WizardSteps-label {
        font-size: 10px;
        line-height: 0.8rem;
        padding-top: 10px;
    }
    .u-Table.t-Wizard-controls {
        /*padding-left: 20%;*/
        padding-top: 0px !important;
        padding-left: 2% !important;
        padding-right: 2% !important;
    }

    /* Custom Information Display Area at the Top of the Page */
    .apex-item-display-only {
        font-size: 14px;
    }

    

    /*.t-Button--large {
        --a-button-font-size: .875rem;
        --a-button-line-height: 1rem;
        --a-button-padding-y: 0.5rem;
        --a-button-padding-x: 0.5rem;
    }*/

    .t-ContentRow-wrap {
        display: block;
    }


    /* Custom Classes - MOBILE --------- >>> */
    .welcome-message {
        font-size: 16px;
    }
    .homepage-region {
        margin-bottom: 15px;
    }
    .chart-region {
        margin-bottom: 15px;
    }
    .data-display-region { 
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 5px;
        padding-bottom: 5px;
    }
    .parent-bottom-align {
        /*display: flex;*/
        /*flex-direction: column;*/
        align-items: flex-start;
        /*justify-content: flex-end;*/
        overflow-y: hidden !important;
        overflow-x: auto !important;
    }
    /* Content Row Revert to Original Flex behavior if inside Breadcrumb, on mobile */
    .breadcrumb-content-row .t-ContentRow-wrap {
        display: flex !important;
    }
    /* Hide the navigation bar theme buttons on mobile */
    /*.navbar-theme-button {
        display: none;
    }*/
    /* >>> --------------------------------- */

}


@media (min-width: 768px) {
    /* Timeline Display */
    .t-Timeline-content {
        display: block;
    }
    .t-Timeline-typeWrap .t-Badge {
        flex-grow: unset;
    }
    .t-Timeline-typeWrap {
        --ut-timeline-typewrap-width: unset;
    }
}

@media (max-width: 639px) {
    .t-Form-fieldContainer.rel-col>.col-1 {
        /*flex-basis: 66.6666666667%;*/ /*>.col-1 >.col-2 ...*/
        min-width: 33.3333333333%;
        max-width: 33.3333333333%;
    }
    .t-Form-fieldContainer.rel-col>.col-2 {
        /*flex-basis: 66.6666666667%;*/ /*>.col-1 >.col-2 ...*/
        /*min-width: 66.6666666667%;
        max-width: 66.6666666667%;*/
    }
    .data-display-region .t-Form-fieldContainer.rel-col>.col {
        /*flex-basis: 66.6666666667%;*/ /*>.col-1 >.col-2 ...*/
        min-width: 50%;
        max-width: 50%;
    }

    /* Make breadcrumb buttons take less space */
    .breadcrumb-button-region {
        height: unset;
        margin-bottom: 0px;
    }
    /* Make breadcrumb take less space */
    .t-BreadcrumbRegion {
        padding-top: 5px;
        padding-bottom: 0px;
    }
    
    /*Non-floating form fields on mobile, take fixed width of 66.67%*/
    /*.col-3>.rel-col .col-2 {
        max-width: 66.6666666667%;
        min-width: 66.6666666667%;
    }*/
    /*Checkbox Group on Mobile - new line per item*/
    .apex-item-group--rc .apex-item-grid-row {
        display: inline-grid;
    }

    .apex-logo-img {
        width: 70px;
    }
    .user-category-desc, .prov-type-desc {
        display: none;
    }

}