@import url("/OutSystemsUIWeb/Theme.BaseTheme.css?374");

@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,400i,500,500i,700,700i');


/* ===================================================================== */
/* ===================================================================== */

/*  OutSystems UI Web                                                    */

/*  $0 - Root - CSS Variables                                            */
/*  $1 - Resets (https://necolas.github.io/normalize.css/)               */
/*  $2 - HTML Elements                                                   */
/*       $2.1 - HTML Elements - Links                                    */
/*       $2.2 - HTML Elements - Images                                   */
/*       $2.3 - HTML Elements - Headings                                 */
/*       $2.4 - HTML Elements - Inputs and Selectors                     */
/*       $2.5 - HTML Elements - Buttons                                  */
/*  $3 - Page Layout                                                     */
/*       $3.1 - Page Layout - Header                                     */
/*              $3.1.1 - Page Layout - Header Top                        */
/*              $3.1.2 - Page Layout - Header Content                    */
/*       $3.2 - Page Layout - Menu                                       */
/*       $3.3 - Page Layout - Content                                    */
/*  $4 - Patterns                                                        */
/*       $4.1 - Patterns - Content                                       */
/*              $4.1.1   - Patterns - Content - Accordion                */
/*              $4.1.2   - Patterns - Content - Alert                    */
/*              $4.1.3   - Patterns - Content - Balloon                  */
/*              $4.1.4   - Patterns - Content - BlankSlate               */
/*              $4.1.5   - Patterns - Content - Bullets                  */
/*              $4.1.6   - Patterns - Content - Card                     */
/*              $4.1.7   - Patterns - Content - CardBackground           */
/*              $4.1.8   - Patterns - Content - CardSectioned            */
/*              $4.1.9   - Patterns - Content - Carousel                 */
/*              $4.1.10  - Patterns - Content - ChatMessage              */
/*              $4.1.11  - Patterns - Content - LightBoxImage            */
/*              $4.1.12  - Patterns - Content - Modal                    */
/*              $4.1.13  - Patterns - Content - Panel                    */
/*              $4.1.14  - Patterns - Content - Section                  */
/*              $4.1.15  - Patterns - Content - Tag                      */
/*              $4.1.16  - Patterns - Content - Tooltip                  */
/*       $4.2 - Patterns - Controls                                      */
/*              $4.2.1   - Patterns - Controls - AnimatedLabel           */
/*              $4.2.2   - Patterns - Controls - ButtonGroup             */
/*              $4.2.3   - Patterns - Controls - DatePicker              */
/*              $4.2.4   - Patterns - Controls - Dropdown                */
/*              $4.2.5   - Patterns - Controls - DropdownSelect          */
/*              $4.2.6   - Patterns - Controls - FileUpload              */
/*              $4.2.7   - Patterns - Controls - FloatingActions         */
/*              $4.2.8   - Patterns - Controls - InputWithIcon           */
/*              $4.2.9   - Patterns - Controls - RangeSlider             */
/*              $4.2.10  - Patterns - Controls - Search                  */
/*              $4.2.11  - Patterns - Controls - SearchBalloon           */
/*              $4.2.12  - Patterns - Controls - TimePicker              */
/*              $4.2.13  - Patterns - Controls - ToggleButton            */
/*              $4.2.14  - Patterns - Controls - Video                   */
/*       $4.3 - Patterns - Layouts                                       */
/*              $4.3.1   - Patterns - Layouts - Logins                   */
/*              $4.3.2   - Patterns - Layouts - Inner Content            */
/*              $4.3.3   - Patterns - Layouts - Inner Content Dashboard  */
/*              $4.3.4   - Patterns - Layouts - Dashboard Counters       */
/*              $4.3.5   - Patterns - Layouts - Inner Content Detail     */
/*              $4.3.6   - Patterns - Layouts - Inner Content Two Cols   */
/*       $4.4 - Patterns - Navigation                                    */
/*              $4.4.1   - Patterns - Navigation - Breadcrumbs           */
/*              $4.4.2   - Patterns - Navigation - NavigationBar         */
/*              $4.4.3   - Patterns - Navigation - SectionIndex          */
/*              $4.4.4   - Patterns - Navigation - Sidebar               */
/*              $4.4.5   - Patterns - Navigation - Tabs                  */
/*              $4.4.6   - Patterns - Navigation - Timeline              */
/*              $4.4.7   - Patterns - Navigation - Wizard                */
/*       $4.5 - Patterns - Numbers                                       */
/*              $4.5.1   - Patterns - Numbers - Badge                    */
/*              $4.5.2   - Patterns - Numbers - Counter                  */
/*              $4.5.3   - Patterns - Numbers - IconBadge                */
/*              $4.5.4   - Patterns - Numbers - ProgressBar              */
/*              $4.5.5   - Patterns - Numbers - ProgressCircle           */
/*              $4.5.6   - Patterns - Numbers - UserAvatar               */
/*       $4.6 - Patterns - Responsive                                    */
/*              $4.6.1   - Patterns - Responsive - DisplayOnDevice       */
/*              $4.6.2   - Patterns - Responsive - LoadOnVisible         */
/*              $4.6.3   - Patterns - Responsive - MoveOnDevice          */
/*              $4.6.4   - Patterns - Responsive - ResponsiveTables      */
/*       $4.7 - Patterns - Structure                                     */
/*              $4.7.1   - Patterns - Structure - AlignCenter            */
/*              $4.7.2   - Patterns - Structure - Columns                */
/*              $4.7.3   - Patterns - Structure - Gallery                */
/*       $4.8 - Patterns - Utilities                                     */
/*              $4.8.1   - Patterns - Utilities - Animate                */
/*              $4.8.2   - Patterns - Utilities - CharacterCount         */
/*              $4.8.3   - Patterns - Utilities - Fieldset               */
/*              $4.8.4   - Patterns - Utilities - FlipContent            */
/*              $4.8.5   - Patterns - Utilities - Iframe                 */
/*              $4.8.6   - Patterns - Utilities - Separator              */
/*              $4.8.7   - Patterns - Utilities - StackedIcon            */
/*       $4.9 - Patterns - Custom                                        */
/*              $4.9.1   - Patterns - Custom - Filters Wrapper           */
/*              $4.9.2   - Patterns - Custom - Tree List                 */
/*              $4.9.3   - Patterns - Custom - Info Section              */
/*              $4.9.4   - Patterns - Custom - Info Card                 */
/*              $4.9.5   - Patterns - Custom - Counters row              */
/*              $4.9.6   - Patterns - Custom - Scrollable counters       */
/*              $4.9.7   - Patterns - Custom - List with map             */
/*              $4.9.8   - Patterns - Custom - Breadcrumbs filters       */
/*              $4.9.9   - Patterns - Custom - More Options Dropdown     */
/*              $4.9.10   - Patterns - Custom - Current time             */
/*              $4.9.11   - Patterns - Custom - Card Status              */
/*              $4.9.12   - Patterns - Custom - Toggle UI                */
/*              $4.9.13   - Patterns - Custom - Card Message             */
/*              $4.9.14   - Patterns - Custom - Main Search              */
/*              $4.9.15   - Patterns - Custom - Status Bar               */
/*              $4.9.23   - Patterns - Custom - Truncate Tooltip         */
/*  $5 - Widgets & RichWidgets                                           */
/*       $5.1 - Widgets - Form / EditRecord                              */
/*       $5.2 - Widgets - TableRecords / EditableTable                   */
/*       $5.3 - RichWidgets - CounterMessage                             */
/*       $5.4 - RichWidgets - FeedbackAjaxWait                           */
/*       $5.5 - RichWidgets - FeedbackMessage                            */
/*       $5.6 - RichWidgets - Pagination                                 */
/*       $5.7 - RichWidgets - PopupEditor                                */
/*       $5.8 - RichWidgets - FiltersWrapper                             */
/*  $6 - Styles                                                          */
/*       $6.1 - Styles - Typography                                      */
/*              $6.1.1 - Styles - Typography - Sizes Desktop             */
/*              $6.1.2 - Styles - Typography - Sizes Tablet              */
/*              $6.1.3 - Styles - Typography - Sizes Phone               */
/*              $6.1.4 - Styles - Typography - Transform                 */
/*              $6.1.5 - Styles - Typography - Weight                    */
/*              $6.1.6 - Styles - Typography - Custom                    */
/*       $6.2 - Styles - Colors                                          */
/*              $6.2.1 - Styles - Colors - Brand                         */
/*              $6.2.2 - Styles - Colors - Extendend                     */

/*              $6.1.6 - Styles - Typography - Custom                    */
/*              $6.3.1  - Styles - Space - Padding                       */
/*              $6.2.3 - Styles - Colors - Neutral                       */
/*              $6.2.4 - Styles - Colors - Semantic                      */
/*       $6.3 - Styles - Space                                           */
/*              $6.3.2  - Styles - Space - Padding Top                   */
/*              $6.3.3  - Styles - Space - Padding Right                 */
/*              $6.3.4  - Styles - Space - Padding Bottom                */
/*              $6.3.5  - Styles - Space - Padding Left                  */
/*              $6.3.6  - Styles - Space - Padding Vertical              */
/*              $6.3.7  - Styles - Space - Padding Horizontal            */
/*              $6.3.8  - Styles - Space - Margin                        */
/*              $6.3.9  - Styles - Space - Margin Top                    */
/*              $6.3.10 - Styles - Space - Margin Right                  */
/*              $6.3.11 - Styles - Space - Margin Bottom                 */
/*              $6.3.12 - Styles - Space - Margin Left                   */
/*              $6.3.13 - Styles - Space - Margin Vertical               */
/*              $6.3.14 - Styles - Space - Margin Horizontal             */
/*       $6.4 - Styles - Border Radius                                   */
/*       $6.5 - Styles - Border Size                                     */
/*       $6.6 - Styles - Elevation/Shadows                               */
/*       $6.7 - Styles - Display Flex Properties                         */
/*       $6.8 - Styles - Others                                          */
/*       $6.9 - Styles - Page Context Styles                             */
/*  $7 - Right-to-Left Mode                                              */
/*       $7.1 - RTL Mode - Page Layout / HTML Elements                   */
/*       $7.2 - RTL Mode - Patterns - Content                            */
/*              $7.2.1 - RTL Mode - Patterns - Content - Alert           */
/*              $7.2.2 - RTL Mode - Patterns - Content - CardSectioned   */
/*              $7.2.3 - RTL Mode - Patterns - Content - ChatMessage     */
/*       $7.3 - RTL Mode - Patterns - Controls                           */
/*              $7.3.1 - RTL Mode - Patterns - Controls - AnimatedLabel  */
/*              $7.3.2 - RTL Mode - Patterns - Controls - ButtonGroup    */
/*              $7.3.3 - RTL Mode - Patterns - Controls - DatePicker     */
/*              $7.3.4 - RTL Mode - Patterns - Controls - FileUpload     */
/*              $7.3.5 - RTL Mode - Patterns - Controls - InputWithIcons */
/*              $7.3.6 - RTL Mode - Patterns - Controls - RangeSlider    */
/*              $7.3.7 - RTL Mode - Patterns - Controls - ToogleButton   */
/*       $7.4 - RTL Mode - Patterns - Numbers                            */
/*              $7.4.1 - RTL Mode - Patterns - Numbers - ProgressBar     */
/*       $7.5 - RTL Mode - Patterns - Navigation                         */
/*              $7.5.1 - RTL Mode - Patterns - Navigation - SectionIndex */
/*              $7.5.2 - RTL Mode - Patterns - Navigation - Sidebar      */
/*              $7.5.3 - RTL Mode - Patterns - Navigation - Tabs         */
/*              $7.5.4 - RTL Mode - Patterns - Navigation - Timeline     */
/*              $7.5.5 - RTL Mode - Patterns - Navigation - Wizard       */
/*       $7.6 - RTL Mode - Patterns - Responsive                         */
/*              $7.6.1 - RTL Mode - Patterns - Responsive - TableRecords */
/*       $7.7 - RTL Mode - Widgets & RichWidgets                         */
/*              $7.7.1 - RTL Mode - Widgets - TableRecords               */
/*              $7.7.2 - RTL Mode - RichWidgets - FeedbackAjaxWait       */
/*              $7.7.3 - RTL Mode - RichWidgets - FeedbackMessage        */
/*              $7.7.4 - RTL Mode - RichWidgets - Pagination             */
/*       $7.8 - RTL Mode - Styles                                        */
/*              $7.8.1 - RTL Mode - Styles - Space - Padding Right       */
/*              $7.8.2 - RTL Mode - Styles - Space - Padding Left        */
/*              $7.8.3 - RTL Mode - Styles - Space - Margin Right        */
/*              $7.8.4 - RTL Mode - Styles - Space - Margin Left         */
/*              $7.8.5 - RTL Mode - Styles - Others                      */
/* ===================================================================== */
/* ===================================================================== */

/* ================================================

Primary color customization
For additional color customizations, you can change the color code for the colors below

  ================================================ */

:root {
    /* Typography - Size */
    --font-size-xxs: 10px;

    /* Color - Brand */
    --color-default: #2F3A4F; /*deafult-color*/
    --color-primary: #FF7B24; /*primary-color*/
    --color-primary-hover: #5b7786; /*primary-color*/
    --color-secondary: #5b7786; /*primary-color*/

    /* Absolute Colors (not affected by dark mode) */
    --color-white: #fff;

    /* default sizes */
    --header-height: 56px;

    /* Color - Semantic */
    --color-success: #37B24D;


    /* State/Status colors */
    --color-evacuation: #C92A2A;
    --color-evacuation-checkin: #F8BB4D;
    --color-evacuation-checkout: #73C982;
    --box-shadow-default: 0 2px 4px 0 rgba(0,0,0,0.1);
    --color-restricted: #FDCAC0;

    --color-rag-low: #4CAF50;
    --color-rag-medium: #FFC107;
    --color-rag-high: #F44336;

}

.dark-mode {
    /* Color - Brand */

    /* Color - Neutral */
    --color-neutral-0: #2F3A4F;
    --color-neutral-1: #475266;
    --color-neutral-2: #232C3D;
    --color-neutral-4: #475266;
    --color-neutral-5: #525F78;
    --color-neutral-8: #868e96;
    --color-neutral-7: #fff;
    --color-neutral-9: #fff;
    --color-neutral-10: #fff;

    /* App Settings */
    --color-background-body: #2F3A4F;

    background-color: var(--color-background-body);
}

.dark-mode .MapPlaceHolder {
    --color-neutral-9: #343a40;
}

/* ================================================================ */
/*  $1 - Resets                                                     */
/* ================================================================ */
html {
    font-family: Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}


.layout {
    color: var(--color-neutral-9);
}

.dark-mode .main-content {
    background-color: #222B3C;
}

.desktop-hd .TableRecords_Label,
.desktop .TableRecords_Label,
.desktop-big .TableRecords_Label,
.desktop-small .TableRecords_Label {
   display: none;
}

.clearfix::after {
    content: "";
    clear: both;
    display: table;
  }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
[type="checkbox"].checkbox::after {
    border-color: var(--color-white);
}

.break-words {
    word-break: break-word;
}

/* ================================================================ */
/*  $2 - HTML Elements                                              */
/* ================================================================ */

/* $2.1 - HTML Elements - Links */

table a,
table a:visited {
    font-weight: var(--font-semi-bold);
    color: var(--color-neutral-10);
}

table a:hover {
    color: var(--color-primary);
}

table a:hover .fa-trash {
    color: var(--color-error);
}

table a.color-primary {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: var(--font-regular);
}
a.Button[disabled="disabled"], a.btn[disabled="disabled"] {
    background-color: var(--color-neutral-2);
    border: 1px solid var(--color-neutral-4);
    color: var(--color-neutral-6) !important;
}
/* $2.3 - HTML Elements - Headings */
h1, h2, h3, h4, h5, h6 {
    margin: 0;
}
.margin-top-m .heading6 {
    margin-bottom: 16px;
    display: block;
}

/* $2.4 - HTML Elements - Inputs and Selectors */
.layout .tag .Form .select {
    border: none !important;
    background-color: transparent !important;
    color: var(--color-neutral-0) !important;
    padding: 0 20px 0 0;
    background-position: center right 0 !important;
}

.visitors-block .Form.form-top label {
    padding-bottom: 0px;
}

.layout .tag .Form .select option {
    color: var(--color-neutral-9);
}

.layout .tag .Form .select,
.layout .tag .Form .select.ReadOnly:not(.Not_Valid) {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAOCAYAAAA8E3wEAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFDGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDAgNzkuMTYwNDUxLCAyMDE3LzA1LzA2LTAxOjA4OjIxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOCAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMTktMDItMTRUMTg6NTI6NTdaIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxOS0wMi0xNFQxODo1NDozNloiIHhtcDpNZXRhZGF0YURhdGU9IjIwMTktMDItMTRUMTg6NTQ6MzZaIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgcGhvdG9zaG9wOklDQ1Byb2ZpbGU9InNSR0IgSUVDNjE5NjYtMi4xIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjVhN2M2ZDRhLWYzNzItNGQzMS1hNWEyLTEwZjg0YjRkZmU3NCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1YTdjNmQ0YS1mMzcyLTRkMzEtYTVhMi0xMGY4NGI0ZGZlNzQiIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo1YTdjNmQ0YS1mMzcyLTRkMzEtYTVhMi0xMGY4NGI0ZGZlNzQiPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJjcmVhdGVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjVhN2M2ZDRhLWYzNzItNGQzMS1hNWEyLTEwZjg0YjRkZmU3NCIgc3RFdnQ6d2hlbj0iMjAxOS0wMi0xNFQxODo1Mjo1N1oiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE4IChNYWNpbnRvc2gpIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pvj/wY8AAAC2SURBVDiNrZTBDYMwDEV94AwjsEUHIbPAMIzSATpBh2ACjrweaqQoEHBwkHzJt/5LnE8EEODD/3sDja7VqEY9UYbsQg8sKswVgbN6LsqQWHwBqzZMFWCTeq3qLSlQgAHYtIIDFiKfIdbOmseznRVUPKkx1c2zN1bPTRYs6foCnQHWaS9cpP3KoLUYZDbY5nrdIyq9AncIyMTfA0xjHgzrbqBw/F3uTu4Gpnf16CksBcZphAeP/Q+GJtru/CBarAAAAABJRU5ErkJggg==') !important;
}

.checkbox.disabled {
    background-color: transparent;
    border: none;
    pointer-events: none;
}
.checkbox.disabled:before {
    background-color: var(--color-neutral-2);
    border: var(--border-size-s) solid var(--color-neutral-4);
}

.input-styled {
    background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-soft);
    border: var(--border-size-s) solid var(--color-neutral-5);
    color: var(--color-neutral-9);
    font-size: var(--font-size-s);
    padding: var(--space-s) var(--space-base);
    display: block;
    cursor: not-allowed;
    word-break: break-word;
}

/* $2.5 - HTML Elements - Buttons */
.Button {
    line-height: 1;
}

.Button,
.btn {
    padding: var(--space-none) var(--space-m);
}

.Button + .Button {
    margin-left: var(--space-s);
}

.Button + .link-button {
    margin-left: var(--space-base);
}

.link-button {
    font-weight: 500;

    transition: all 180ms linear;
}

.link-button:hover {
    -webkit-filter: brightness(.95);
    filter: brightness(.95);

    color: var(--color-primary);
}

a.btn-icon {
    color: var(--color-primary);
    font-weight: var(--font-semi-bold);
}

a.Button:hover {
    color: var(--color-primary);
}

.Button.btn-cancel,
.btn.btn-cancel {
    color: var(--color-neutral-8);
}

a.Button[class*="background-"],
a.btn[class*="background-"] {
    color: var(--color-neutral-0);
}

.dark-mode a.Button[class*="background-"],
.dark-mode a.btn[class*="background-"] {
    color: var(--color-neutral-10);
}

.Button.btn-cancel:hover,
.btn.btn-cancel:hover {
    color: var(--color-neutral-8);
    border-color: var(--color-neutral-8);
}


a.Is_Default,
a.Is_Default:hover {
    color: var(--color-white);
}

.secondary-button,
a.Is_Default.secondary-button,
.Is_Default.secondary-button {
    background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-soft);
    border: var(--border-size-s) solid var(--color-primary);
    color: var(--color-primary);
}
.secondary-button:hover,
.Is_Default.secondary-button:hover {
    filter: none;
    background-color: var(--color-primary);
    color: var(--color-white);
}

a.btn-icon:hover {
    -webkit-filter: brightness(.9);
    filter: brightness(.9);
}

a.Button .fas,
a.btn-icon .fas {
    margin-right: var(--space-xs);
}

.bo-action__button .select {
    background: var(--color-primary);
    font-weight: bold;
    color: var(--color-white);
    border: thin solid var(--color-primary);
}

.bo-action__button .dropdown-icon {
    color: var(--color-white);
}
.bo-action__button .fa-angle-down::before {
    font-family: FontAwesome;
    font-weight: normal;
}

/* ================================================================ */
/*  $3 - Layout                                                     */
/* ================================================================ */
.phone [class*="ThemeGrid_Width"]:not(.no-responsive) {
    margin: var(--space-s) var(--space-none) var(--space-none) var(--space-none);
}

/* ================================================================ */
/*  $3.1 - Layout Header and Navigation                             */
/* ================================================================ */

.layout .header {
    background-color: var(--color-default);
    color: var(--color-neutral-0);
    position: sticky;
}

.layout.site-offline .header {
    background-color: #555;
}

.layout-top .header .ThemeGrid_Container {
    padding: var(--space-none) var(--space-m);
}

.header a,
.header a:visited,
.Menu_TopMenu:hover > div .fa,
.Menu_TopMenu:hover > div a,
.Menu_TopMenu:hover > div a:visited {
    color: var(--color-neutral-0);
}

.dark-mode .header a,
.dark-mode .header a:visited,
.dark-mode .Menu_TopMenu:hover > div .fa,
.dark-mode .Menu_TopMenu:hover > div a,
.dark-mode .Menu_TopMenu:hover > div a:visited {
    color: var(--color-neutral-10);
}

.header .Menu_SubItemsPlaceholder a {
    color: var(--color-neutral-9);
}

.header .Menu_SubItemsPlaceholder a:hover,
.Menu_DropDownPanel a.Menu_SubMenuItemActive {
    color: var(--color-primary);
}

/* $3.1.1 - Layout Header */
.header-top {
    height: var(--header-height);
}

.header-right img {
    max-width: 36px;
}

.dark-mode .header-right {
    color: var(--color-neutral-10);
}

/* $3.1.2 - Layout Header Content  */
.app-logo {
    width: auto;
    height: auto;
    min-width: 110px;
    max-width: 120px;
    max-height: 24px;
    margin: 0;
}


.menu-icon-line {
    background-color: var(--color-neutral-0);
}

/* ================================================================ */
/*  $3.2 - Layout Menu                                              */
/* ================================================================ */
.header .Menu_TopMenu {
    opacity: 0.7;
    font-size: var(--font-size-s);
    font-weight: bold;
}

.header .Menu_TopMenu:hover,
.header .Menu_TopMenu.Menu_TopMenuActive {
    opacity: 1;
}

.Menu_TopMenu > div a,
.Menu_TopMenu > div a:visited {
    color: var(--color-neutral-0);
}

.dark-mode .Menu_TopMenu > div a,
.dark-mode .Menu_TopMenu > div a:visited {
    color: var(--color-neutral-9);
}

.Menu_TopMenu > div a, .Menu_TopMenu > div a:visited {
    font-weight: 600;
}

.Menu_DropDownArrow:before,
.Menu_DropDownArrow:after {
    background-color: var(--color-neutral-0);
}

.Menu_TopMenu:hover > div .Menu_DropDownArrow:before,
.Menu_TopMenu:hover > div .Menu_DropDownArrow:after {
    background-color: var(--color-primary);
}

.fa-fw.fas.fa-chevron-down {
    width: 14px;
}

/* $3.2.1 - Responsive */
.phone .layout-top .Menu_TopMenus,
.tablet .layout-top .Menu_TopMenus {
    top: var(--header-height);
    background-color: var(--color-default);
}

.phone .header .Menu_DropDownButton:not(:first-child) {
    margin-left: var(--space-none);
}

/* ================================================================ */
/*  $3.3 - Page Layout - Content                                    */
/* ================================================================ */

.layout .main {
    /* Space between the main content and the top of the screen, calculated automatically in the Layout JS */
    --header-gutter: 0;
    padding-top: 0;
}

.layout-top .content .ThemeGrid_Container {
    padding: 0;
}

.content-middle {
    margin: var(--space-base) var(--space-m);
}

.phone .content-middle {
    margin: var(--space-s);
}

/* ================================================================ */
/*  $4 - Patterns                                                   */
/* ================================================================ */

/* ================================================================ */
/*  $4.1 - Patterns - Content                                       */
/* ================================================================ */

/* 4.1.1   - Patterns - Content - Accordion */
.travel-accordion {
    margin-top: var(--space-m);
}
.travel-accordion .accordion-item {
    margin-bottom: var(--space-base);
}
.travel-accordion .accordion-item.is--open {
    border-top: var(--border-size-s) solid var(--color-neutral-4);
}
.travel-accordion .accordion-item .accordion-item-content.is--expanded {
    overflow: visible;
}
.travel-accordion .accordion-item-header {
    padding: 0;
    align-items: center;
    background-color: var(--color-neutral-1);
    border-bottom: var(--border-size-s) solid var(--color-neutral-4);
}
.travel-accordion .accordion-item-icon {
    padding: 0 var(--space-base);
    color: var(--color-neutral-6);
}

.travel-accordion .section-header {
    border-bottom: none;
}
.travel-accordion .Button {
    font-size: 14px;
}

/* $4.1.3 - Patterns - Content - Balloon */
.balloon-content {
    padding: var(--space-base);
}

/* $4.1.8 - Patterns - Content - CardSectioned */
.gallery-card h4 {
    margin: 0;
    text-align: center;
    color: var(--color-neutral-9);
}

.gallery-card__position,
.gallery-card__company {
    display: block;
    width: 100%;

    color: var(--color-neutral-7);
    font-weight: 600;
    text-align: center;
}

.gallery-card__company {
    margin-top: var(--space-s);
    font-weight: 400;
}

.columns .columns-item > .card.location {
    height: auto;
    box-shadow: var(--box-shadow-default);
}

.card-sectioned.location .card-content {
    padding: 0;
}

.card-footer {
    padding: var(--space-s);

    background-color: var(--color-neutral-1);
    border-top: 1px solid #DEE2E6;
    text-align: center;
    color: var(--color-neutral-7);
}

/* $4.1.12  - Patterns - Content - Modal */
.modal-title {
    color: var(--color-neutral-10);
    font-size: var(--font-size-h2);
    font-weight: var(--font-semi-bold);
    line-height: 1.25;
}

/* $4.1.13 - Patterns - Content - Panel */
.panel-header {
    border-top-left-radius: var(--border-radius-soft);
    border-top-right-radius: var(--border-radius-soft);
    border-bottom: 1px solid var(--color-neutral-4);
}


.panel-title,
.panel-actions {
    padding: var(--space-base);
}

.collapse-message, .collapse-profile {
    color: var(--color-primary);
    -webkit-transition: color 180ms linear;
    transition: color 180ms linear;
    cursor: pointer;
}

.panel-title {
    font-size: var(--font-size-s);
    text-transform: uppercase;
}

/*.three-cols-wrapper .panel-content {
    background-color: var(--color-neutral-0);
}*/

.panel-content {
    padding: var(--space-base);
    border-bottom-left-radius: var(--border-radius-soft);
    border-bottom-right-radius: var(--border-radius-soft);
}

.panel-footer {
    padding: var(--space-base) var(--space-base) var(--space-m) var(--space-base);
}

.panel-content .TableRecords, .panel-content .EditableTable {
    border: var(--border-size-s) solid var(--color-neutral-4);
}
.panel-content .EditableTable td {
    -webkit-transition: all 180ms linear;
    transition: all 180ms linear;
}

.panel-content .EditableTable tr:hover td, .panel-content .EditableTable tr.Selected td {
    background-color: var(--color-orange-light)!important;
    color: var(--color-white);
}
.panel-content .EditableTable tr:hover td a {
    color: var(--color-white);
}

.panel-content .EditableTable tr:hover td input:read-only {
    color: var(--color-white)!important;
}

.panel-content .EditableTable tr:nth-child(odd) td {
    background-color: var(--color-neutral-1);
}
.panel-content .EditableTable tr:nth-child(even) td {
    background-color: var(--color-neutral-0);
}
.panel-content .EditableTable tfoot tr:hover td {
    background-color: inherit;
}

.TableRecords tr td.checkbox-cell,
.TableRecords tr td.radio-cell {
    padding-right: 0;
    width: 50px;
}
/* Modifiers */
.panel.padding-none .panel-content {
    padding: 0;
}

.panel.scrollable-content .panel-content {
    overflow-y: auto;
    overflow-x: hidden;
}

.panel.scrollable-content .panel-content::-webkit-scrollbar,
.main-search__content__list.ph::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}
.panel.scrollable-content .panel-content::-webkit-scrollbar-track,
.main-search__content__list.ph::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
    border-radius: 10px;
}

.panel.scrollable-content .panel-content::-webkit-scrollbar-thumb,
.main-search__content__list.ph::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: var(--color-neutral-4);
}

.phone .panel.scrollable-content .panel-content {
    max-height: 400px;
}

.panel.check-out .panel-header,
.panel.mustered .panel-header {
    background-color: #37B24D;
    color: var(--color-neutral-0);
}

.panel.check-in .panel-header {
    background-color: #F59F00;
    color: var(--color-white);
}

.panel.not-mustered .panel-header {
    background-color: #C92A2A;
    color: var(--color-white);
}

.dark-mode .panel.mustered .panel-header,
.dark-mode .panel.not-mustered .panel-header {
    color: var(--color-white)
}

.panel.check-in .panel-title,
.panel.check-out .panel-title,
.panel.mustered .panel-title,
.panel.not-mustered .panel-title,
.panel.check-in .panel-actions,
.panel.check-out .panel-actions,
.panel.mustered .panel-actions,
.panel.not-mustered .panel-actions {
    font-size: var(--font-size-base);
    font-weight: var(--font-semi-bold);
}

.panel.check-in .panel-actions,
.panel.check-out .panel-actions,
.panel.mustered .panel-actions,
.panel.not-mustered .panel-actions {
    font-size: 18px;
}

.panel.check-in .panel-actions a,
.panel.check-out .panel-actions a,
.panel.mustered .panel-actions a,
.panel.not-mustered .panel-actions a {
    margin-right: var(--space-l);
    padding: var(--space-s);

    color: var(--color-white);
    font-size: var(--font-size-base);
    background-color: rgba(255,255,255,0.2);
    border-radius: 50%;

    transition: background-color 350ms ease;
}

.dark-mode .panel.mustered .panel-actions a,
.dark-mode .panel.not-mustered .panel-actions a {
    color: var(--color-white);
}

.panel.mustered .panel-actions a:hover,
.panel.not-mustered .panel-actions a:hover {
    background-color: rgba(255,255,255,0.3);
}
/* $4.1.14 - Patterns - Content - Section */

.main .section {
    border-width: 1.1px;
}

.section-title a {
    color: var(--color-neutral-6);
    font-size: 13px;
}

.section-title a:hover .fa-trash {
    color: var(--color-error);

    transition: color 250ms ease;
}

.expandable.section {
    transition: all 250ms ease;
}

.expandable .section-header {
    cursor: pointer;
}

.expandable .section-content {
    overflow: hidden;
    opacity: 0;

    transition: all 250ms ease;
}

.expandable.expanded .section-content {
    overflow: visible;
    opacity: 1;
}

/* $4.1.15 - Patterns - Content - Section */
.TableRecords .tag {
    min-width: 75px;
}

.tag.background-white {
    color: var(--color-default);
}

/* ================================================================ */
/*  $4.2 - Patterns - Controls                                      */
/* ================================================================ */

/* $4.2.4 - Patterns - Controls - Dropdown */
.align-items-center .dropdown-header.select {
    border: 0;
    background-color: var(--color-primary);
    font-weight: var(--font-bold);
}
.align-items-center .dropdown-header.select .text-primary {
    color: var(--color-white);
}

.align-items-center .dropdown-header.select .dropdown-icon {
    color: var(--color-white);
}
.text-primary.dropdown .dropdown-icon {
    color: var(--color-primary)
}
.dropdown.is--visible .dropdown-icon {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.dropdown {
    cursor: pointer;
}

.dropdown .dropdown-content .dropdown-content-list {
    right: 0;

    width: fit-content;
    max-height: 280px;

    padding: 0;

    overflow: auto;
}

.dropdown .dropdown-icon .fa {
    font-family: 'FontAwesome';
}

.time-picker .dropdown .dropdown-header {
    border: none;
}

.time-picker .dropdown .dropdown-content .dropdown-content-list {
    width: 100%;
    right: 0;
}

.dropdown .dropdown-header {
    border: var(--border-size-s) solid var(--color-primary);
}

.dropdown .dropdown-content .dropdown-content-list a {
    white-space: nowrap;
    color: var(--color-neutral-10);
    padding: 8px 12px;
}

.dropdown .dropdown-content .dropdown-content-list a .fas {
    margin-right: 8px;
    display: block;
}

.dropdown .dropdown-content .dropdown-content-list a:hover {
    color: var(--color-neutral-9);
}

.dropdown .dropdown-content .dropdown-content-list a[disabled="disabled"] {
    background-color: var(--color-neutral-4);
    color: var(--color-neutral-8);
    cursor: not-allowed;
}

/* Dropdown group */

.dropdown.color-primary.group .dropdown-header.select {
    background-color: var(--color-primary);
    padding: 0;
    border: none;
}

.dropdown.group .dropdown-header.select a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 var(--space-base);
    font-weight: bold;
    border-top-left-radius: var(--border-radius-soft);
    border-bottom-left-radius: var(--border-radius-soft);
    color: var(--color-white);
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}

.dropdown.group .dropdown-icon {
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-left: 1px solid #D9691F;
    border-top-right-radius: var(--border-radius-soft);
    border-bottom-right-radius: var(--border-radius-soft);
    color: white;
}

.dropdown.group.is--visible .dropdown-icon {
    transform: unset;
}

.dropdown.group .dropdown-header-text {
    width: 100%;
    height: 100%;
}

.dropdown.group .dropdown-icon .fa {
    font-family: 'FontAwesome';
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    font-weight: 400;
}

.dropdown.group .dropdown-icon:hover, .dropdown.group .dropdown-header.select a:hover {
    background-color: var(--color-orange);
}

.dropdown.group.is--visible .dropdown-icon span {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.phone .content-breadcrumbs .btn,
.phone .content-breadcrumbs .Button {
    width: 120px;
    margin-left: auto;
}

/* $4.2.5 - Patterns - Controls - DropdownSelect */

.select-small .choices__inner {
    height: 32px;
}

.select-small .choices__list--single .choices__item {
    padding-top: 0;
    line-height: 2;
    opacity: 0.85;
}

.select-small .choices[data-type*="select-one"]:after {
    top: 7px;
    font-size: 20px;
    color: var(--color-neutral-10);
}

.choices__inner {
    text-align: left;
    border-width: 1.1px;
}

.page-dashboard-global .col-first .panel-header .choices {
    min-width: 170px;
}

.search--wrapper:before {
    color: var(--color-neutral-6);
    font-family: 'Font Awesome 5 Free', FontAwesome;
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    left: var(--space-base);
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
}

/* $4.2.10 - Patterns - Controls - Search */
.search .input-with-icon .input-with-icon-content-icon:not(:empty) + .input-with-icon-input input {
    padding: 0 var(--space-base) 0 var(--space-xl);
}

/* $4.2.12 - Patterns - Controls - TimePicker */
.time-picker {
    margin-top: var(--space-s);
    max-width: 120px;
}
/*.time-input input,
.time-input input:hover {
    padding-left: 0;
    border-color: transparent !important;
    background-color: transparent !important;
}*/

/* Choices Multiple */
.choices__list--dropdown {
    z-index: 10;
}
.choices__list--dropdown .choices__list {
    max-height: 120px;
}

.choices__list--dropdown .choices__item {
    padding: 12px 8px;
    line-height: 1.2;
}

.is-focused .choices__inner,
.is-open .choices__inner {
    border-color: var(--color-neutral-5);
}

.choices.is-open.is-focused .choices__inner {
    border-color: var(--color-neutral-5);
}

.choices__inner {
    background-color: var(--color-neutral-0);
}
.dark-mode .choices__inner {
    background-color: var(--color-neutral-5);
}

/* ================================================================ */
/*  $4.3 - Patterns - Layouts                                       */
/* ================================================================ */

/* $4.3.1 - Patterns - Layouts - Logins */
.layout-login-simple .layout-login-background {
    background-color: var(--color-default);
}


/* $4.3.2 - Patterns - Layouts - Inner Content */
.inner-content {
    display: flex;
    min-height: calc( 100vh - 164px);
    border-radius: 3px;
    border: 1.1px solid var(--color-neutral-4);
    background-color: var(--color-neutral-0);
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
}

.phone .inner-content {
    flex-direction: column;
}

.inner-content__aside {
    background-color: var(--color-neutral-1);
    box-shadow: 1px 0 0 0 rgba(154, 158, 163, 0.2);
}

.inner-content__navigation {
    display: flex;
    flex-direction: column;
    padding: var(--space-m);
}

.phone .inner-content__navigation {
    width: 100%;
    flex-direction: row;
    overflow: auto;
}

.inner-content__navigation a {
    width: 170px;
    padding: 12px 0;

    font-weight: 600;
    line-height: 24px;
    font-size: var(--font-size-s);
    color: var(--color-neutral-9);
}

.phone .inner-content__navigation a {
    position: relative;
    padding: 0 var(--space-base);
    line-height: 1;
    white-space: nowrap;
    width: auto;
}

.phone .inner-content__navigation a:after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 1px;
    height: 101%;
    background-color: var(--color-default);
}

.phone .inner-content__navigation a:last-child:after {
    display: none;
}

.phone .inner-content__navigation a:first-child {
    margin-left: var(--space-none);
    padding-left: var(--space-s);
}

.inner-content__navigation a.active,
.inner-content__navigation a:hover {
    color: var(--color-primary);
}

.inner-content__main {
    width: 100%;

    display: flex;
    flex-direction: column;
}

.inner-content__header {
    display: flex;
    justify-content: space-between;

    align-items: center;
}

.wizard-content .inner-content__header {
    background-color: var(--color-neutral-1);
    padding-top: var(--space-none);
    padding-bottom: var(--space-m);
    border-bottom: var(--color-neutral-4);
}

.wizard-content .inner-content__header .breadcrumbs-item:first-child,
.wizard-content .inner-content__header .breadcrumbs-item:last-child .title {
    text-transform: initial;
}

.wizard-content .inner-content__header .breadcrumbs-item .title {
    font-size: var(--font-size-h6);
    font-weight: var(--font-semi-bold);
    line-height: 1.25;
}

.phone .inner-content__header {
    flex-wrap: wrap;
}

.inner-content__title,
.inner-content__actions {
    display: flex;
    padding: var(--space-m) var(--space-m) 0 var(--space-m);
    align-items: center;
}

.phone .inner-content__actions {
    flex-wrap: wrap;
}

.inner-content__actions > div {
    display: flex;
}
.inner-content__content {
    height: 100%;
    padding: var(--space-m) var(--space-m) var(--space-m) var(--space-m);

    overflow: hidden;
}
.overflow-content .inner-content__content {
    overflow: unset;
}
.inner-content__content .tabs-header {
    padding: 0;

}
.inner-content__footer {
    display: flex;
    justify-content: flex-end;

    margin-top: var(--space-m);
    padding: var(--space-m);

    border-top: 1px solid var(--color-neutral-4);
}

/* $4.3.3 - Patterns - Layouts - Inner Content Dashboard */
.three-cols-wrapper {
    display: flex;
    height: calc( 100vh - 172px);
    flex-wrap: wrap;
}

.three-cols-wrapper .col.ph:empty {
    display: none;
}

.phone .three-cols-wrapper {
    height: 100%;
}

.three-cols-wrapper .col {
    display: flex;
    flex-direction: column;
    flex: 1;

    height: 100%;
    transition: .2s;
}

.three-cols-wrapper .col-middle,
.three-cols-wrapper .col-last {
    margin-left: var(--space-base);
}

.three-cols-wrapper .col-last.collapsed {
    max-width: 48px;
    min-width: 48px;
}

.three-cols-wrapper .col-last.collapsed .panel-title,
.three-cols-wrapper .col-last.collapsed .panel-content {
    display: none;
}

.three-cols-wrapper .col-first.collapsed > span {
    height: 100%;
}
.three-cols-wrapper .col-first.collapsed > .card {
    height: 54px;
}

.three-cols-wrapper .col-first.collapsed > .card .panel-header{
    border-bottom: 0px;
}

.three-cols-wrapper .col-first.collapsed > .card .panel-content {
    display: none;
}

.col-first .panel {
    transition: .2s;
}

@media (min-width: 1480px) {
    .three-cols-wrapper .col {
        //min-width: 390px;
    }

    .three-cols-wrapper .col-first,
    .three-cols-wrapper .col-last {
        max-width: 400px;
    }
}

@media (max-width: 1070px) {
    .three-cols-wrapper .col {
        flex: 1 0 48%;
        margin: 0 0 var(--space-base) 0;
        order: 2;
    }
    .three-cols-wrapper .col.col-middle {
        flex: 1 0 100%;
        order: 1;
    }
    .three-cols-wrapper .col-last {
        margin-left: var(--space-base);
    }
}

@media (max-width: 678px) {
    .three-cols-wrapper .col {
        flex: 1 0 100%;
    }
    .three-cols-wrapper .col-last {
        margin-left: 0;
    }
}

.three-cols-wrapper .col-first-content {
    height: calc(100% - 60px);
}

.three-cols-wrapper .col > * {
    margin-bottom: var(--space-base);
}

.three-cols-wrapper .col > *:last-child {
    margin-bottom: var(--space-none);
}

.three-cols-wrapper .col-middle .panel {
    height: 100%;
}

.three-cols-wrapper .col .panel-content {
    min-height: 120px;
}

.phone .three-cols-wrapper .col {
    min-width: 100%;
    margin: var(--space-base) var(--space-none);
}

.three-cols-wrapper .col-first label {
    color: var(--color-neutral-7);
}

/* $4.3.4 - Patterns - Layouts - Dashboard Counters */

/* .dashboard-counters {
    margin-bottom: var(--space-base);
    display: grid;
    grid-gap: 16px;
    grid-template-columns: 1fr 2fr 2fr;
}

.desktop-small .dashboard-counters {
    grid-template-columns: 1fr;
}

.dashboard-counters.split-equal {
    grid-template-columns: repeat(4, 1fr);
}

.phone .dashboard-counters {
    grid-template-columns: 1fr;
} */

.dashboard-counters {
    display: flex;

}

@media (max-width: 678px) {
    .dashboard-counters {
        flex: 1 0 100%;
        flex-wrap: wrap;
        margin-top: -16px;
        margin-bottom: var(--space-s);
    }
    .page-dashboard-global .dashboard-counter {
        margin: var(--space-base) 0 0 0;
    }
    .page-dashboard-global .dashboard-counter:first-child {
        max-width: unset!important;
        margin-right: var(--space-base);
    }
}
@media (max-width: 376px) {
    .page-dashboard-global .dashboard-counter:first-child {
        margin-right: 0;
        flex: 1 0 100%;
    }
}

/* .dashboard-counter {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    flex: 1;

    padding: var(--space-base);

    border-radius: 3px;
    border: 1px solid var(--color-neutral-4);
    background-color: var(--color-neutral-0);
    border-radius: 3px;
} */

.dashboard-counter {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    flex: 1;

    margin: 0 5px;

    padding: var(--space-base);

    border-radius: 3px;
    border: 1px solid var(--color-neutral-4);
    background-color: var(--color-neutral-0);
    border-radius: 3px;
    box-shadow: var(--box-shadow-default);
}

.dashboard-counter.evacuation {
    background-color: var(--color-evacuation);
    color: var(--color-white);
}

.dashboard-counter.restricted {
    background-color: var(--color-restricted);
}

.dashboard-counter.low {
    background-color: var(--color-rag-low);
    color: var(--color-white);
}

.dashboard-counter.medium {
    background-color: var(--color-rag-medium);
    color: var(--color-white);
}

.dashboard-counter.high {
    background-color: var(--color-rag-high);
    color: var(--color-white);
}

.dashboard-counter:last-child {
    margin-right: 0;
}

.dashboard-counter:first-child {
    margin-left: 0;
}

.dashboard-counter.clickable {
    cursor: pointer;
}

div.dashboard-counter:not(.clickable) {
    cursor: auto;
}

.dashboard-counter .selected-icon {
    position: absolute;
    top: var(--space-xs);
    right: var(--space-xs);
    width: auto;

    color: var(--color-primary);
}

.dashboard-counter-title,
.dashboard-counter-wrapper {
    display: flex;
    width: 100%;
}

.dashboard-counter-title {
    justify-content: center;
    font-weight: bold;
}

.dashboard-counter-wrapper {
    justify-content: space-around;
}
.dashboard-counter-bottom {
    bottom: 0;
    left: 0;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    right: 0;
    width: 100%;
}
.dashboard-counter-item {
    text-align: center;
    margin: 0 var(--space-s);
}

.dashboard-counter-item:first-child {
    margin-left: 0;
}

.dashboard-counter-item:last-child {
    margin-right: 0;
}

.dashboard-counter-title {
    text-transform: uppercase;
    margin-bottom: var(--space-xs);
}

.dashboard-counter-value {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}

.dashboard-counter-value .fas {
    opacity: 0.5;
    font-size: 15px;
}

.dashboard-counter-label {
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    font-weight: var(--font-bold);
}

/* $4.3.5 - Patterns - Layouts - Inner Content Detail */
.inner-content-detail {
    background-color: var(--color-neutral-1);
    border: 1.1px solid #E9ECEF;
    box-shadow: var(--box-shadow-default);
}

.inner-content-detail .tabs-header {
    padding: 0 var(--space-l);
    background-color: var(--color-neutral-0);
}

.inner-content-detail .tabs-content {
    padding: var(--space-l);
}

.inner-content-detail__footer {
    display: flex;
    justify-content: flex-end;
    padding: var(--space-base) var(--space-l);
    border-top: 1px solid #E9ECEF;
}

.inner-content-detail .tabs-content .section-content {
    background-color: var(--color-neutral-0);
}

/* $4.3.6 - Patterns - Layouts - Inner Content Two Cols */

.two-cols-small-right {
    display: flex;
}

.content-status:not(:empty) ~ .content-middle .two-cols-small-right {
    min-height: calc( 100vh - 206px);
}

.content-status:not(:empty) ~ .content-middle .two-cols-small-right .col-last {
    height: calc( 100vh - 206px);
}

.two-cols-small-right .col-first {
    width: calc(100% - 390px - var(--space-base));

    padding: var(--space-base);
    background-color: var(--color-neutral-0);
    border: 1px solid var(--color-neutral-4);
    border-radius: var(--border-radius-soft);
}

.two-cols-small-right .col-first-content .panel {
    box-shadow: none;
}

.two-cols-small-right .title {
    margin-bottom: var(--space-m);

    font-size: var(--font-size-h2);
    line-height: 1.25;
}

.two-cols-small-right .scrollable-counters {
    margin-bottom: var(--space-m);
}

.two-cols-small-right .col-last {
    width: 390px;
    margin-left: var(--space-base);
}

.two-cols-small-right .col-last > * {
    margin-bottom: var(--space-base);
}

.two-cols-small-right .col-last > *:last-child {
    margin-bottom: var(--space-none);
}
.col-last .card {
    margin-bottom: var(--space-base);
}
/* ================================================================ */
/*  $4.4 - Patterns - Navigation                                    */
/* ================================================================ */

/* $4.4.1 - Patterns - Navigation - Breadcrumbs */
.content-breadcrumbs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 60px;

    margin-bottom: 0;
    background-color: var(--color-neutral-0);
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
    padding: 0 var(--space-m);
    position: relative;
}

.phone .content-breadcrumbs {
    flex-wrap: wrap;
    padding: 0 var(--space-s) var(--space-s) var(--space-s);
}

.breadcrumbs-item {
    font-size: var(--font-size-s);
    font-weight: bold;
    line-height: 18px;
}

.breadcrumbs-item:last-child .title {
    text-transform: uppercase;
    color: var(--color-neutral-9);
}

.wizard-content .breadcrumbs-item:last-child .title {
    text-transform: uppercase;
    color: var(--color-neutral-8);
}

.wizard-content .breadcrumbs-item .title {
    text-transform: initial;
    font-size: var(--font-size-h6);
    font-weight: var(--font-semi-bold);
    line-height: 1.25;
}

.wizard-content .breadcrumbs-item.active .title {
    color: var(--color-primary);
}

.breadcrumbs-item a {
    color: var(--color-default);
    text-transform: capitalize;
    opacity: 0.7;
    text-decoration: underline;
}

.dark-mode .breadcrumbs-item a {
    color: var(--color-neutral-10);
}

.breadcrumbs-item a:hover {
    color: var(--color-primary);
}

/* $4.4.4 - Patterns - Navigation - Sidebar */
.sidebar-container {
    display: flex;
    flex-direction: column;
    background-color: var(--color-neutral-1);
}

.sidebar-header {
    background-color: var(--color-neutral-0);
}

.sidebar-content {
    flex: 1;
    padding: var(--space-none);
}

.sidebar-content .tabs-content {
    padding: var(--space-m);
}

.sidebar-content .tabs-header {
    padding: 0 var(--space-m);
    background-color: var(--color-neutral-0);
    border-bottom: 1px solid var(--color-neutral-4);
}

.sidebar-content .tabs-header-item {
    margin-bottom: -1px;
}

.dark-mode .sidebar-overlay,
.dark-mode ~ .sidebar-overlay {
    background-color: rgba(47, 58, 79, 0.7);
}

/* $4.4.5 - Patterns - Navigation - Tabs */

.tabs-header-item {
    margin-left: 0;
    padding-left: var(--space-l);
    padding: var(--space-base) var(--space-base);
}

.tabs-content__footer {
    margin-top: var(--space-base);
    border-top: 1px solid var(--color-neutral-4);
    padding-top: var(--space-base);
}

.sidebar-content .tabs {
    flex-direction: column;
    height: 100%;
}

    /* Sidebar tabs customization */
.sidebar-content .tabs-content-item {
    height: 100%;
}

.tabs-content .map-wrapper {
    margin: -24px;
    height: calc(100% + 48px);
}

/* ================================================================ */
/*  $4.6 - Patterns - Responsive                                    */
/* ================================================================ */

/* $4.6.4 - Patterns - Responsive - ResponsiveTables */
.table-records-responsive {
    overflow: auto;
}

/* ================================================================ */
/*  $4.7 - Patterns - Structure                                     */
/* ================================================================ */

/* $4.7.2 - Patterns - Structure - Columns */
.columns-item {
    position: relative;
}

.card-status .columns.gutter-l > .columns-item,
.sidebar-header .columns.gutter-l > .columns-item {
    margin-bottom: var(--space-none);
}

.columns.gutter-s > .columns-item {
    margin-bottom: var(--space-base);
}
.columns.columns-small-left > .columns-item:last-child {
    padding-left: 0;
}

/* ================================================================ */
/*  $4.9 - Patterns - Custom                                        */
/* ================================================================ */

/* $4.9.1 - Patterns - Custom - Filters Wrapper */
.filters-wrapper {
    display: flex;
    flex-wrap: wrap;


    border-radius: var(--border-radius-soft);
}

.filters-wrapper__row {
    display: flex;
    width: 100%;
}

.filters-wrapper__row .filters-actions {
    margin-top: auto;
}

.filters-wrapper__row:last-child {
    margin-top: var(--space-s)
}

.phone .filters-wrapper__row,
.tablet .filters-wrapper__row {
    flex-wrap: wrap;
}

.filters-wrapper__actions {
    justify-content: flex-end;

    margin-top: var(--space-m);
}

.filters-item {
    margin-top: auto;
    position: relative;
}

.filters-item .ValidationMessage {
    position: absolute;
    right: 0;
    bottom: -20px;
    font-size: 11px;
}

.filters-item .time-picker .ValidationMessage {
    position: absolute;
    right: 0;
    bottom: -34px;
    font-size: 11px;
}

.filters-actions {
    display: flex;
    align-items: center;
}

.filters-actions > * + * {
    margin-left: var(--space-s);
}

.filters-item + .filters-item,
.filters-actions {
    margin-left: var(--space-s);
}

.phone .filters-item,
.phone .filters-actions,
.tablet .filters-item,
.tablet .filters-actions {
    margin-top: var(--space-s);
    margin-left: 0;
    width: 100%;
}

.phone .filters-item:first-child,
.tablet .filters-item:first-child {
    margin-top: 0;
}


.filters-item__label {
    display: block;
    margin-bottom: var(--space-s);
}

.fitlers-item__input .choices {
    width: 200px;
}

.phone .fitlers-item__input .choices,
.tablet .fitlers-item__input .choices {
    width: 100%;
}

.fitlers-item__input select {
    min-width: 200px;
}

/* $4.9.2 - Patterns - Custom - Tree List */

/*
TODO: Place your tree theme customization
*/

/* tree list with actions - default style */

.tree-element {
    display: flex;
    align-items: flex-start;
    margin-top: 4px;
    padding: var(--space-s) var(--space-base);
    font-size: var(--font-size-xs);
    box-shadow: 0 1px 0 0 rgba(223,226,230,0.5);
    transition: all 250ms ease;
}

.tree-element.hide {
    display: none;
}

.tree-element__content {
    display: flex;
}

.is-selected .tree-element__title,
.is-selected .tree-element__content__icon,
.tree-element__content:hover .tree-element__title,
.tree-element__content:hover .tree-element__content__icon {
    color: var(--color-primary);
}

.tree-element__title {
    font-size: var(--font-size-s);
}

.tree-element__description {
    font-size: var(--font-size-xs);
    margin-top: var(--space-xs);
    color: #868E96;
}

.tree-element__content__icon {
    display: flex;
    align-items: flex-start;
    justify-content: center;

    margin-right: var(--space-xs);

    padding-top: 1px;
    min-width: 20px;

    color: var(--color-neutral-6);
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

.tree-element__content__icon.geo:before {
    content: "\f0ac";
}

.tree-element__content__icon.functional:before {
    content: "\f0f3";
}

.tree-element__content__icon.business:before {
    content: "\f1ad";
}

.tree-element__content__icon.country:before {
    content: "\f024";
}

.tree-element__content__icon.site:before {
    content: "\f3c5";
}

.tree-element__content__icon.zone:before {
    content: "\f5cb";
}

.tree-element__actions,
.tree-element__icon {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    text-align: center;
}

.tree-element__icon {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 20px;
    min-width: 15px;
    font-size: var(--font-size-base);
}

.tree-element__icon.no-children {
    font-size: 5px;
}
.tree-element__icon.no-children:before {
    content: '\f111';
    color: var(--color-neutral-6);
}

.tree-element__icon.collapse:before {
    content: '\f0da';
    color: var(--color-neutral-6);
}

.tree-element__icon.expanded:before {
    content: '\f0d7';
    color: var(--color-neutral-6);
}

.tree-list-ident {
    min-width: 20px;
}

[id*='IdentationDIVs'] {
    display: flex;
}

.tree-element .balloon-content {
    padding: 0;
}

.tree-element__actions {
    margin-left: auto;

    font-size: var(--font-size-s);
    cursor: pointer;
    background-position: center;
    transition: color 250ms ease;
}

.tree-element__actions:before {
    content: "\f142";
}

.tree-element__actions.tippy-active,
.tree-element__actions:hover {
    color: var(--color-primary);
}

.tree-element__actions-item {
    padding: 8px 12px;
    border-bottom: 1px solid rgba(223,226,230,0.5);

    transition: all 100ms ease;
}

.tree-element__actions-item:hover {
    background-color: var(--color-neutral-2);
}

.tree-element__actions-item:first-child {
    border-top: 1px solid rgba(223,226,230,0.5);
}

/* $4.9.3 - Patterns - Custom - Info Section */
.info-section {
    background-color: var(--color-neutral-1);
}

.info-section.no-padding {
    padding: var(--space-none);
}

.info-section .timeline-item-right {
    width: 100%;
}

.info-section .tabs .tabs-header {
    padding: var(--space-none) var(--space-base);
}

.info-section .tabs-content {
    padding: var(--space-none);
}

.info-section .tabs .tabs-header {

    padding: var(--space-none) var(--space-base);
    background-color: var(--color-neutral-0);
}

.info-section label {
    display: block;
    color: var(--color-neutral-7);
    font-weight: var(--font-regular);
    font-size: var(--font-size-xs);
}

/* $4.9.4 - Patterns - Custom - Info Card */
.info-card {
    margin-top: 8px;
}

/* $4.9.5 - Patterns - Custom - Counters row */

.counters-row {
    display: grid;
    margin-bottom: var(--space-l);
    grid-gap: 16px;
    grid-template-columns: repeat(6, 1fr);
    width: 100%;
}

.tablet .counters-row {
    grid-template-columns: repeat(3, 1fr);
}

.phone .counters-row {
    grid-template-columns: repeat(1, 1fr);
}

/* $4.9.6 - Patterns - Custom - Scrollable Counters */
.scrollable-counters {
    display: flex;
}

.scrollable-counters__list {
    width: 100%;
    overflow: auto;
}

.scrollable-counters__list .ListRecords {
    display: flex;
}

.scrollable-counters .dashboard-counter {
    min-width: 150px;
    max-width: 150px;

    text-align: center;
}

.scrollable-counters .dashboard-counter {
    margin-right: var(--space-s);
}

.scrollable-counters__fixed .dashboard-counter {
    background-color: var(--color-neutral-0);
    /* color: var(--color-neutral-0); */
}

/* .dark-mode .scrollable-counters__fixed .dashboard-counter {
    background-color: var(--color-white);
} */

.scrollable-counters__fixed .dashboard-counter .dashboard-counter-label {
    font-weight: var(--font-bold);
}

/* $4.9.7 - Patterns - Custom - List with map */
.list-with-map {
    height: 100%;
}

.list-with-map .columns-item {
    background-color: var(--color-neutral-2);
}

.list-with-map .ListRecords {
    max-height: 583px;
    overflow: auto;
}

/* $4.9.8 - Patterns - Custom - Breadcrumbs filters */
.breadcrumbs-filters {
    display: flex;
    align-items: center;
}

.phone .breadcrumbs-filters,
.phone .breadcrumbs-filters-wrapper {
    flex-wrap: wrap;
    margin: var(--space-s) var(--space-none);
}

.breadcrumbs-filters-title {
    margin-right: var(--space-l);
    font-weight: bold;
    line-height: 18px;
    text-transform: uppercase;
}

.phone .breadcrumbs-filters-title {
    margin-bottom: var(--space-base);
}

.breadcrumbs-filters-wrapper {
    display: flex;
}

.breadcrumbs-filters-wrapper > * {
    margin-left: var(--space-s);
}

.phone .breadcrumbs-filters-wrapper > * {
    margin: var(--space-none) var(--space-none) var(--space-s) var(--space-none);
    width: 100%;
}

/* $4.9.9 - Patterns - Custom - More Options Dropdown */

/* remove border */
.custom .select,
.custom.is--visible .dropdown-header.select {
    border: unset;
    display: flex;
    justify-content: center;
}

.custom .dropdown-header {
    padding: 0;
    background-color: transparent;
}

.custom.dropdown .dropdown-content .dropdown-content-list {
    right: 0;
    top: 0;
}

.custom .dropdown-icon {
    display: none;
}

.dropdown-header-text {
    transition: color 250ms ease;
}

.custom.dropdown:hover .dropdown-header-text,
.custom.dropdown.is--visible .dropdown-header-text {
    color: var(--color-primary);
}

.dropdown.custom {
    cursor: pointer;
}

.dropdown.custom .DropdownMenu {
    background-color: #FFFFFF;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.5);
}

.dropdown.custom .DropdownMenu .PH {
    padding: 5px 15px
}

.dropdown.custom .DropdownMenu .PH:hover,
.dropdown.custom .DropdownMenu .PH > a:hover {
    background-color: #DEEAF3;
}

.dropdown.custom .DropdownMenu .PH > a {
    color: #1B4A7E;
    font-weight: 600;
}


/* $4.9.10 - Patterns - Custom - Current time */
.current-time {
    display: flex;
}

.current-time__block {
    display: flex;
    margin-left: var(--space-base);
    align-items: flex-end;
    white-space: nowrap;
}

.current-time__block:first-child {
    margin-left: none;
}

.current-time__icon {
    margin-right: var(--space-s);
    color: var(--color-neutral-8);
}

.current-time__label {
    font-size: var(--font-size-xs);
    font-weight: var(--font-bold);
    color: var(--color-neutral-8);
}

.current-time__value {
    display: block;
    white-space: nowrap;
    font-size: var(--font-size-base);
    font-weight: var(--font-bold);
    line-height: 1.4;
}

/* $4.9.11 - Patterns - Custom - Toggle UI */

.content-breadcrumbs .toggle-ui {
    margin: var(--space-none) var(--space-m);
}

.toggle-ui,
.toggle-ui > span {
    display: flex;
    align-items: center;
}

.toggle-ui .toggle-button-label {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

.toggle-button {
    width: 40px;
    height: 24px;
    margin: 0 2em;
}

.toggle-button .checkbox {
    width: 60px;
    outline: none;
}

.toggle-ui .toggle-button-label:before {
    content: "\f185";
    position: absolute;
    left: -25px;
    top: 1px;
    z-index: 1;
    color: var(--color-neutral-10);
    opacity: 1;
    pointer-events: none;
}

.toggle-button .checkbox:checked:after {
    -webkit-transform: translateX(33px);
    transform: translateX(33px);
    background-color: var(--color-white);
}

.toggle-ui .toggle-button-label:after {
    content: "\f186";
    position: absolute;
    right: -25px;
    top: 1px;
    z-index: 1;
    color: var(--color-neutral-5);
    pointer-events: none;
}

.dark-mode .toggle-ui .toggle-button-label:before {
    opacity: .5;
}
.dark-mode .toggle-ui .toggle-button-label:after {
    color: var(--color-neutral-10);
    opacity: 1;
}

.dark-mode .toggle-button-checked .toggle-button-label:after {
    color: var(--color-neutral-10);
}


.toggle-ui .toggle-button .checkbox:before {
    width: 58px;
    background-color: var(--color-primary);
}

.checkbox:focus:before, .radio-button:focus:before {
    box-shadow: none;
}
.toggle-button:after {
    width: 18px;
    height: 18px;
    top: 3px;
    background-color: var(--color-white);
}

.toggle-button.toggle-button-checked:after {
    -webkit-transform: translateX(17px) translateZ(0);
    transform: translateX(17px) translateZ(0);
}

/* $4.9.12 - Patterns - Custom - Card Status */
.card-status {
    margin-bottom: var(--space-xs);

    background-color: var(--color-neutral-1);
    border-radius: 3px;
    border: 1px solid var(--color-neutral-4);
}

.card-status a {
    color: var(--color-neutral-9);
}

.card-status.offline {
    background-color: #6A7178;
}

.card-status.evacuation {
    background-color: var(--color-evacuation);
}

.card-status.restricted {
    background-color: var(--color-restricted);
}

.card-status.unplanned-muster {
    background-color: #E0B12D;
}

.card-status.planned-muster {
    background-color: #1A79CB;
}

.card-status.evacuation,
.card-status.unplanned-muster,
.card-status.planned-muster {
    border: none;
}

.card-status__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;

    padding: var(--space-s) var(--space-base);
}

.card-status__actions .select {
    height: 25px;
    width: 0;
}

.card-status__content {
    padding: var(--space-s) var(--space-base) var(--space-base);
    color: var(--color-neutral-7);
}

.card-status__footer {
    padding: var(--space-base);

    background-color: rgba(0,0,0,0.1);
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.card-status.offline .card-status__footer .time-keeper-day-count,
.card-status.offline .card-status__footer .time-keeper-hour-count,
.card-status.offline .card-status__footer .time-keeper-minute-count {
    font-weight: bold;
}

.card-status__actions .dropdown-header-text .fas,
.card-status.unplanned-muster,
.card-status.unplanned-muster .card-status__content,
.card-status.unplanned-muster .card-status__actions .dropdown-header-text .fas,
.card-status.planned-muster,
.card-status.planned-muster .card-status__content,
.card-status.planned-muster .card-status__actions .dropdown-header-text .fas,
.card-status.evacuation,
.card-status.evacuation .card-status__content,
.card-status.evacuation .card-status__actions .dropdown-header-text .fas,
.card-status.unplanned-muster a,
.card-status.planned-muster a,
.card-status.evacuation a,
.card-status.offline,
.card-status.offline a,
.card-status.offline .card-status__content {
    color: var(--color-white);
}

.dark-mode .card-status .dropdown a,
.dark-mode .card-status.unplanned-muster,
.dark-mode .card-status.planned-muster,
.dark-mode .card-status.evacuation,
.dark-mode .card-status.unplanned-muster a ,
.dark-mode .card-status.planned-muster a ,
.dark-mode .card-status.evacuation a,
.dark-mode .card-status.offline,
.dark-mode .card-status.offline a{
    color: var(--color-neutral-10);
}

/* $4.9.13 - Patterns - Custom - Card Message */
.card-message {
    margin-bottom: var(--space-xs);
    padding: var(--space-base);

    background-color: var(--color-neutral-1);
    border-radius: 3px;
    border: 1px solid var(--color-neutral-4);
}

.card-message.evacuation,
.card-message.casualty {
    border-left: 6px solid #DE3337;
}

.card-message.planned-muster {
    border-left: 6px solid #1A79CB;
}

.card-message.unplanned-muster {
    border-left: 6px solid #F59F00;
}

.card-message__title {
    font-weight: var(--font-bold);
}

.card-message.High {
    border-left: 6px solid var(--color-rag-high);
}

.card-message.Medium {
    border-left: 6px solid var(--color-rag-medium);
}

.card-message.Low {
    border-left: 6px solid var(--color-rag-low);
}


.card-message__time {
    color: var(--color-neutral-7);
    font-size: var(--font-size-xs);
    font-weight: var(--font-regular);
}

.card-message__content {
    line-height: 1.2;
}

.card-message__site-location,
.card-message__site-name {
    font-size: var(--font-size-xs);
    color: var(--color-neutral-7);
}

.card-message__site-name {
    margin-top: var(--space-xs);
    font-weight: var(--font-semi-bold);
}

.card-message__content label {
    display: block;
    font-weight: var(--font-bold);
}

a .card-message .card-message__content {
    color: var(--color-neutral-10);
}
a:hover .card-message .card-message__content {
    color: var(--color-primary);
}

/* $4.9.14 - Patterns - Custom - Main Search */
.main-search {
    display: flex;
    flex-direction: column;
    position: relative;
}

.header .main-search {
    margin-right: var(--space-base);
}

.phone .main-search {
    margin-right: 0;
}

.main-search__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-s) var(--space-base);

    color: var(--color-neutral-3);
    background-color: rgba(0,0,0,0.2);
    white-space: nowrap;

    cursor: pointer;
}

.header .main-search__header {
    height: var(--header-height);
}

.main-search__header__value {
    font-weight: var(--font-bold);
}

.main-search__header__icon {
    margin-left: var(--space-base);
}

.main-search__content {
    display: none;
    position: absolute;
    z-index: 1;
    width: 346px;
    top: 56px;

    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.15);
    background-color: var(--color-neutral-1);
}

.phone .main-search__content {
    width: 100%;
}

.main-search:hover .main-search__content {
    display: block;
}

.main-search__content__title {
    border-bottom: 1px solid var(--color-neutral-4);
}

.dark-mode .main-search__content__title {
    border-bottom: 1px solid var(--color-neutral-5);
}

.main-search__content__title a {
    display: block;
    padding: var(--space-base);
    text-transform: uppercase;
    color: var(--color-primary);
    font-size: var(--font-size-base);
    font-weight: var(--font-regular);
}

.header .main-search__content__title a {
    color: var(--color-primary);
}

.main-search__content__title a .fas {
    margin-right: var(--space-s);
}

.main-search__content__filter {
    padding: var(--space-base);
    border-bottom: 1px solid var(--color-neutral-4);
}

.main-search__content__list {
    display: flex;
    flex-direction: column;
    /*padding: var(--space-base);*/
    background-color: var(--color-neutral-0);
    max-height: 260px;
    overflow: auto;
}

.main-search__content__list .ListRecords {
    display: flex;
    flex-direction: column;
}

.main-search__content__list a {
    padding: var(--space-s) var(--space-none);
    color: var(--color-default);
    font-size: var(--font-size-base);
}

.header .main-search__content__list a {
    padding: 0 0 0 15px;
    text-transform: none;
    color: var(--color-default);
    font-size: var(--font-size-base);
    font-weight: 600;
    opacity: 0.7;
    /*margin-left: var(--space-base);*/
    height: 43px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
}

.header .main-search__content__list a:hover {
    opacity: 0.88;
    background-color: var(--color-neutral-3);
}

.dark-mode .header .main-search__content__list a {
    color: var(--color-white);
}

.dark-mode .header .main-search__content__list a:hover {
    opacity: 0.88;
    background-color: var(--color-primary-hover);
}

.header .main-search__content__list a.active {
    color: var(--color-primary);
}

.main-search__content__list a:last-child {
    margin-bottom: var(--space-none);
    padding-bottom: var(--space-none);
}

/* $4.9.15 - Patterns - Custom - Status Bar */

.status-bar {
    display: flex;
    align-items: center;
    height: 42px;
    padding: var(--space-xs) var(--space-m);
    color: var(--color-white);
    background-color: var(--color-neutral-8);
}


.status-bar.unplanned-muster {
    background-color: #F59F00;
}

.status-bar.planned-muster {
    background-color: #1A79CB;
}

.status-bar.evacuation {
    background-color: #C92A2A;
}

.status-bar__status,
.status-bar__activated-by,
.status-bar__activated-time,
.status-bar__reason {
    margin-right: var(--space-xl);
}

.status-bar__status {
    padding: var(--space-xs) var(--space-s);
    border-radius: 20px;

    background-color: var(--color-white);
    line-height: 1;

    font-size: var(--font-size-s);
    font-weight: var(--font-semi-bold);
}

.status-bar__reason {
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 20%;
    white-space: nowrap;
}

.unplanned-muster .status-bar__status {
    color: #F59F00;
}

.evacuation .status-bar__status {
    color: #C92A2A;
}

.status-bar__activated-by a {
    color: #fff;
}

.status-bar__activated-by a:hover {
    text-decoration: underline;
}

.planned-muster .status-bar__status {
    color: #1A79CB;
}

.status-bar .status-bar__duration {
    display: flex;
    align-items: center;
    margin-left: auto;
    font-size: 22px;
    font-weight: var(--font-bold);
}

.status-bar .status-bar__duration .fas {
    margin-right: var(--space-s);
}

.status-bar .status-bar__value {
    font-weight: var(--font-bold);
    margin-left: var(--space-xs);
}

/* $4.9.16 - Patterns - Custom - Detailed list item */
/* Implemented in musters and evacuations list */

.detailed-list-item {
    display: flex;
    padding: var(--space-base) var(--space-m);
    margin-bottom: var(--space-s);
    background-color: var(--color-neutral-1);
    border: 1px solid var(--color-neutral-4);
    border-radius: 4px;
}

.detailed-list-item__wrapper {
    width: 100%;
    flex-direction: column;
}

.detailed-list-item__title {
    display: flex;
    align-items: center;
    margin-bottom: var(--space-s);
}

.detailed-list-item__title .actions-toggle {
    margin-left: var(--space-base);
    font-size: var(--font-size-s);
}

.detailed-list-item__title .dropdown-header {
    width: max-content;
    background: transparent;
    padding: 0 var(--space-base) 0 0;
    border: 0;
}

.detailed-list-item__title .dropdown-header-text {
    margin-right: var(--space-base);
    font-size: var(--font-size-h5);
}

.detailed-list-item__title .is--visible .dropdown-header {
    border: 0;
}
.detailed-list-item__title .dropdown.is--visible .dropdown-icon {
    color: var(--color-neutral-10);
}
.detailed-list-item__title .dropdown .dropdown-content .dropdown-content-list {
    left: 0;
}

.detailed-list-item__content {
    display: flex;
    justify-content: space-between;
}

.detailed-list-item__labels {
    display: flex;
    align-items: center;
}

.detailed-list-item__labels table tr:first-child td {
    color: var(--color-neutral-7);
}

.detailed-list-item__labels table td {
    padding: 0 16px 8px 0;
}
.detailed-list-item__labels table tr:last-child td {
    padding-bottom: 0;
}

.detailed-list-item__labels .filters-item {
    margin-right: var(--space-base);
}

.detailed-list-item__labels label {
    color: var(--color-neutral-7);
}

.detailed-list-item__duration {
    font-weight: var(--font-bold);
    margin-left: auto;
}

.detailed-list-item__duration,
.detailed-list-item__people-mustered {
    display: flex;
    justify-content: center;
    width: 150px;
    padding: 16px;
    font-size: 22px;
    border-radius: 4px;
    color: #fff;
}

.detailed-list-item.unplanned-muster .detailed-list-item__duration {
    background-color: #F59F00;
}

.detailed-list-item.planned-muster .detailed-list-item__duration {
    background-color: #1A79CB;
}

.detailed-list-item__people-mustered {
    margin-left: var(--space-s);
    background-color: var(--color-default);
}

.detailed-list-item__duration .fas,
.detailed-list-item__people-mustered .fas {
    display: flex;
    align-items: center;
    opacity: 0.5;
    font-size: 20px;
}
.detailed-list-item__people-mustered .font-bold {
    display: flex;
    align-items: center;
}

.detailed-list-item__actions {
    display: flex;
    align-items: center;
    margin-left: var(--space-m);
}

.detailed-list-item__actions a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--color-neutral-3);
    transition: all 250ms ease;
}

.detailed-list-item__actions a {
    margin-right: var(--space-s);
}

.detailed-list-item__actions a:last-child {
    margin-right: var(--space-none);
}

.detailed-list-item__actions a svg g {
    fill: var(--color-neutral-6);
    transition: all 250ms ease;
}

.detailed-list-item__actions a:hover {
    background-color: var(--color-success);
}

.detailed-list-item__actions a:last-child:hover {
    background-color: var(--color-error);
}

.detailed-list-item__actions a:hover svg g {
    background-color: var(--color-neutral-0);
    fill: var(--color-neutral-0);
}

.detailed-list-item__counters-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

/* $4.9.17 - Patterns - Custom - Detailed list Title */
.detailed-list-title {
    display: flex;
    align-items: center;
    margin: var(--space-m) 0;
    padding: 0 var(--space-m) 0 0;
}

.detailed-list-title__title {
    display: flex;
    align-items: center;
    margin-top: auto;;
    margin-right: var(--space-base);
    margin-bottom: 15px;
}

.detailed-list-title__title .actions-toggle {
    margin-left: var(--space-base);
}

.detailed-list-title__progress {
    margin-top: auto;
    margin-bottom: 15px;
    margin-left: auto;
    width: 200px;
}

.detailed-list-title__progress .progress-value {
    color: var(--color-neutral-7);
}

.detailed-list-title__counters {
    display: flex;
    margin-left: var(--space-base);
    min-width: 150px;
}

.detailed-list-title__title .dropdown-header {
    border: none;
    padding: 0;
}

.detailed-list-title__title .dropdown-header .dropdown-header-text {
    margin-right: var(--space-base);
}

.detailed-list-title__title .is--visible .dropdown-header.select {
    border: none;
}

.detailed-list-title__title .is--visible .dropdown-icon {
    color: var(--color-neutral-10);
}

.detailed-list-title__title .dropdown-content-list {
    left: 0;
}

/* $4.9.17 - Patterns - Custom - Panel List Item */
.panel {
    box-shadow: var(--box-shadow-default);
}

.panel-list-item {
    padding: var(--space-base);
}

/* $4.9.18 - Patterns - Custom - Panel Header Tab */
.panel-header-tab {
    display: inline-block;
    position: relative;
    padding: var(--space-none) var(--space-base);
}

.panel-header-tab:first-child {
    margin-left: -16px;
}

.panel-header-tab.active:after {
    content: '';
    position: absolute;
    right: 0;
    bottom: -16px;
    left: 0;
    height: 2px;
    background-color: var(--color-primary);
}

.panel-header-tab a {
    color: var(--color-neutral-8);
    font-size: var(--font-size-s);
    line-height: 21px;
    text-transform: capitalize;
    font-weight: var(--font-regular);
}

.panel-header-tab.active a {
    color: var(--color-neutral-9);
    font-weight: var(--font-semi-bold);
}

/* $4.9.19 - Patterns - Custom - Panel Header Tab */

.note-item {
    margin-bottom: var(--space-s);
    padding: var(--space-s);
}

.note-item {
    color: var(--color-neutral-10);
}

.note-item__date {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: var(--space-s);
    color: var(--color-neutral-7);
    font-size: var(--font-size-xs);
}

.note-item__date .far {
    margin: 0 var(--space-xs) 0 var(--space-s);
}


/* $4.9.20 - Patterns - Custom - Dropdown Actions */

.actions-toggle {
    display: flex;
    justify-content: center;
    cursor: pointer;
    transition: all 250ms ease;
}

.actions-toggle:hover {
    color: var(--color-primary);
}

.actions-dropdown .balloon-content {
    display: flex;
    flex-direction: column;
    padding: var(--space-none);
}

.actions-dropdown .balloon-content a {
    padding: var(--space-s) var(--space-base) var(--space-s) var(--space-base);
}

.actions-dropdown .balloon-content a:first-child {
    padding-top: var(--space-base);
    margin-top: var(--space-none);
}

.actions-dropdown .balloon-content a:last-child {
    padding-bottom: var(--space-base);
    margin-bottom: var(--space-none);
}

/* $4.9.21 - Patterns - Custom - Simple Counter */
.simple-counter {
    min-width: 150px;
}

.detailed-list-title__counters .simple-counter:first-child {
    margin-right: var(--space-s);
}

.simple-counter__title {
    margin-bottom: var(--space-base);
    padding: 0 var(--space-base);
    text-align: center;
}

.simple-counter.evacuations-not-confirmed .simple-counter__title {
    color: var(--color-evacuation);
}

.simple-counter.evacuations-confirmed .simple-counter__title {
    color: var(--color-default);
}

.simple-counter__content {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-s);
    background-color: var(--color-neutral-0);
    border: 1px solid var(--color-neutral-4);
    border-radius: 4px;
    font-size: 22px;
    font-weight: var(--font-bold);
}

.simple-counter__content .fas {
    font-size: 15px;
    opacity: 0.5;
    margin-right: var(--space-xs);
}

.simple-counter.padding-big .simple-counter__content {
    padding: var(--space-m) var(--space-s);
}

.simple-counter.bg-filled .simple-counter__content {
    border: none;
    color: var(--color-white);
}

.dark-mode .simple-counter.bg-filled .simple-counter__content {
    border: 1px solid var(--color-neutral-4);
}

.simple-counter.evacuations-not-confirmed .simple-counter__content {
    background-color: var(--color-evacuation);
}


.simple-counter.evacuations-confirmed .simple-counter__content {
    background-color: var(--color-default);
}

/* $4.9.22 - Patterns - Custom - Wizard Card */
.wizard-card-list {
    display: flex;
    flex-wrap: wrap;
}

.wizard-card {
    display: flex;
    margin-right: var(--space-base);
    margin-bottom: var(--space-base);
    padding: var(--space-base);
    width: calc(33% - var(--space-base));
    border-radius: 3px;
    border: 1px solid var(--color-neutral-4);
}

.wizard-card__input {
    margin-right: var(--space-base);
}

.wizard-card__content__title {
    color: var(--color-neutral-9);
    font-size: var(--font-size-h4);
    font-weight: var(--font-semi-bold);
    line-height: 1;
    margin-bottom: var(--space-base);
}

.wizard-card__content__body {
    color: var(--color-neutral-7);
}

/* $4.9.22 - Patterns - Custom - Google Maps Patterns */
.map-container {
    position: relative;
    height: 100%;
}

.map-full-height__container .MapPlaceHolder {
    min-height: calc(100vh - 40vh);
}

@media(min-width: 1440px) and (min-height: 800px) {
    .map-full-height__container .MapPlaceHolder {
        min-height: calc(100vh - 33vh);
    }
}

/* $4.9.23   - Patterns - Custom - Truncate Tooltip  */

.truncate-tooltip {
    position: relative;
    display: inline-block;
}

.truncate-tooltip .text {
    width: 120px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.truncate-tooltip .tooltip-content {
    visibility: hidden;
    min-width: 160px;
    background-color: var(--color-neutral-9);
    color: var(--color-neutral-0);
    text-align: center;
    border-radius: var(--border-radius-soft);
    position: absolute;
    z-index: 10;
    padding: var(--space-xs) var(--space-s);
    transition: .2s;
    opacity: 0;
}

.truncate-tooltip.left .tooltip-content {
    top: -5px;
    right: 110%;
}

.truncate-tooltip .tooltip-content::after {
    content: "";
    position: absolute;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent var(--color-neutral-9);
}

.truncate-tooltip.left .tooltip-content::after {
    top: 8px;
    left: 100%;
}

.truncate-tooltip:hover .tooltip-content {
    visibility: visible;
    opacity: 1;
}


/* ================================================================ */
/*  $5 - Widgets & RichWidgets                                      */
/* ================================================================ */
.TableRecords_Header {
/*    white-space: nowrap;*/
}

.TableRecords .TableRecords_OddLine {
    background-color: var(--color-neutral-1);
    border-width: 1.1px;
}
.TableRecords .TableRecords_EvenLine {
    border-width: 1.1px;
}


.dark-mode .TableRecords .TableRecords_OddLine,
.dark-mode .TableRecords .TableRecords_EvenLine,
.dark-mode .TableRecords .TableRecords_Header,
.dark-mode .EditableTable thead th {
    border-bottom: none;
}

/* Popup Iframe **************************/
.os-internal-Popup.os-internal-ui-dialog iframe {
    border-radius: 4px;
}

/* Popups **************************/
div.os-internal-Popup .os-internal-ui-dialog.os-internal-ui-draggable .os-internal-ui-dialog-titlebar.os-internal-header-space,
div.os-internal-Popup.os-internal-ui-dialog.os-internal-ui-draggable .os-internal-ui-dialog-titlebar.os-internal-header-space {
    height: 60px !important;
}

body.desktop .os-internal-Popup.os-internal-ui-dialog {
    background-color: var(--color-neutral-0);
    /* max-height: 600px; */
}

.MainPopup__content {
  padding: var(--space-base);
  /* max-height: 600px; */
  overflow: auto;
  position: relative;
  padding-bottom: 90px;
}

.MainPopup__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: var(--space-base);
    position: fixed;
    bottom: 0;
    z-index: 999;
    background-color: var(--color-neutral-0);
    width: 100%;
    left: 0;
    height: 80px;
    border-top: 1px solid var(--color-neutral-4);
    padding: var(--space-base);
}

/* $5.1 - Widgets - Form / EditRecord */
.input-bottom-label {
    position: absolute;
    bottom: -22px;
    right: 5px;
    font-size: 13px;
}

.form__group {
    display: flex;
    align-items: center;
}

.form__group ~ .form__group {
     margin-top: 12px;
}

.form__group input[type="checkbox"] {
    margin-right: var(--font-size-xxs);
}

.Form input.radio-button {
    background-color: transparent;
}

.Form .form-control label {
    display: inline-block;
    margin: 12px 0;
    width: 80%;
    padding: 0;
}

.Form .form-control input[type="checkbox"] {width: 20%;background: none;}

/* $5.5 - RichWidgets - FeedbackMessage */

/* $5.7 - RichWidgets - PopupEditor */

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-title,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-title {
    color: var(--color-default);
    font-weight: 600;
}

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-titlebar,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar {
    background: var(--color-neutral-0);
    height: 60px;
    color: var(--color-default);
    display: flex;
    font-size: var(--font-size-h3);
}

/* ================================================================ */
/*  $6.1 - Styles - Typography                                      */
/* ================================================================ */
/* $6.1.1 - Styles - Typography - Sizes Desktop */
.subtitle {
    font-size: var(--font-size-base);
    font-weight: var(--font-bold);
}

.font-size-xxs {
    font-size: var(--font-size-xxs);
}

/* $6.1.5 - Styles - Typography - Weight */
label {
    font-weight: 500;
}

/* $6.1.6 - Styles - Typography - Custom */
.small-label {
    color: var(--color-neutral-7);
    font-size: var(--font-size-xs);
    line-height: 18px;
}

/* $6.2.3 - Styles - Colors - Neutral */
.border-bottom-neutral-0 { border-bottom: 1px solid var(--color-neutral-0); }
.border-bottom-neutral-1 { border-bottom: 1px solid var(--color-neutral-1); }
.border-bottom-neutral-2 { border-bottom: 1px solid var(--color-neutral-2); }
.border-bottom-neutral-3 { border-bottom: 1px solid var(--color-neutral-3); }
.border-bottom-neutral-4 { border-bottom: 1px solid var(--color-neutral-4); }
.border-bottom-neutral-5 { border-bottom: 1px solid var(--color-neutral-5); }
.border-bottom-neutral-6 { border-bottom: 1px solid var(--color-neutral-6); }
.border-bottom-neutral-7 { border-bottom: 1px solid var(--color-neutral-7); }
.border-bottom-neutral-8 { border-bottom: 1px solid var(--color-neutral-8); }
.border-bottom-neutral-9 { border-bottom: 1px solid var(--color-neutral-9); }
.border-bottom-neutral-10 { border-bottom: 1px solid var(--color-neutral-10); }
.background-white { background-color: var(--color-white); }

/* $6.2.3 - Styles - Colors - Semantic */

/* STATES */

/* Muster Type */
.tag.planned {
    background-color: #1A79CB;
}

.tag.unplanned {
    background-color: #F59F00;
}

.tag.planned-muster {
    background-color: #1A79CB;
    color: var(--color-white);
}

.tag.unplanned-muster {
    background-color: #F59F00;
}

.tag.evacuation {
    background-color: #F59F00;
}

/* Muster Status */
.tag.completed {
    background-color: #1A79CB;
}

.tag.in-progress {
    background-color: #F59F00;
}

.tag.awating-start {
    background-color: #6a7178;
}

/* Evacuation */

.tag.evacuation {
    background-color: var(--color-evacuation);
    color: var(--color-white);
}

.tag.evacuation-in-progress {
    background-color: #1A79CB;
    color: var(--color-white);
}

.tag.evacuation-in-progress .tag-content {
    white-space: nowrap;
}

.tag.evacuation-not-started {
    background-color: #F59F00;
    color: var(--color-white);
}

.tag.evacuation-not-started .tag-content {
    white-space: nowrap;
}

.tag.evacuated {
    background-color: #37B24D;
    color: var(--color-white);
}
/* People Mustered */

.note + .note {
    margin-left: var(--space-xs);
}

tr .note {
    font-size: var(--font-size-xs);
    font-style: italic;
}

tr.out-of-zone {
    color: var(--color-neutral-6);
}

.img-with-tag {
    position: relative;
    display: flex;
    align-items: center;
}

.img-with-tag__tag {
    position: absolute;
    top: -10px;
    left: -10px;

    display: flex;
    justify-content: center;
    align-items: center;

    width: 21px;
    height: 21px;

    border-radius: 50%;
    background-color: var(--color-neutral-4);
    color: var(--color-white);
    font-size: 12px;
}

.img-with-tag__tag .fas {
    width: auto;
}

tr.out-of-zone .img-with-tag__tag {
    background-color: #5FA1DA;
}

tr.casualty .img-with-tag__tag {
    background-color: #D96A6A;
}

tr.unexpected .img-with-tag__tag {
    background-color: #F99451;
}


tr .note.out-of-zone {
    color: #5FA1DA;
}

tr .note.casualty {
    color: #D96A6A;
}

tr .note.unexpected {
    color: #F99451;
}

/* Request status */
.draft {
    background-color: #0D8091;
}

.pending {
    background-color: #F59F00;
}

.rejected {
    background-color: #E03131;
}

.approved {
    background-color: #37B24D;
}

/* Visitor status */
.expected {
    background-color: #1A79CB;
}

.arrived {
    background-color: #37B24D;
}

.escorting {
    background-color: #F59F00;
}

.with-host {
    background-color: #0D8091;
}

/* Travel status */

.departed,
.arrived {
    background-color: #37B24D;
}

.in-progress,
.expected {
    background-color: #1A79CB;
}

.no-show {
    background-color: #E03131;
}

.cancelled {
    background-color: #868E96;
}

.not-started,
.delayed {
    background-color: var(--color-primary);
}

.completed {
    background-color: #0D8091;
}

.in-transit {
    background-color: #095A66;
}

/* VIP */
.vip {
    border: 1px solid #F8BB4D;
    border-radius: 50px;
    color: #F8BB4D;
    background-color: transparent;
}

/* Evacuations */

.evacuated {
    color: #37B24D;
}

/* ================================================================ */
/*  $6.3 - Styles - Space                                           */
/* ================================================================ */

/* $6.3.8 - Styles - Space - Margin */
.margin-left-auto {
    margin-left: auto;
}

/* ================================================================ */
/*  $6.7 - Styles - Display Flex Properties                         */
/* ================================================================ */
.flex-between {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.flex-center {
    display: flex;
    align-items: center;
}

.space-between {
    justify-content: space-between;
}

.align-items-top {
    align-items: flex-start;
}

.align-items-bottom {
    align-items: flex-end;
}

/* ================================================================ */
/*  $6.8 - Styles - Others                                          */
/* ================================================================ */
.layout .Form .input[disabled="disabled"].ReadOnly:not(.Not_Valid),
.layout .Form .input[readonly="readonly"].ReadOnly:not(.Not_Valid),
.layout .Form .select[readonly="readonly"].ReadOnly:not(.Not_Valid),
.Form textarea[readonly="readonly"] {
    background-color: transparent;
    border: none;
    color: var(--color-neutral-6);
    pointer-events: none;
    padding-left: 0;
    background-image: url() !important;
}

/* Offline site messages */
.breadcrumbs-message {
    align-items: center;
    border-radius: 4px 4px 0px 0px;
    bottom: 0;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    height: 34px;
    justify-content: center;
    left: 0;
    line-height: 18px;
    margin-left: auto;
    margin-right: auto;  
    padding: 8px 16px;
    position: absolute;
    right: 0;
    text-align: center;    
    width: max-content;
}
.card-title-offline-message {
    align-items: center;
    border-radius: 4px;
    bottom: 0;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    height: 34px;
    justify-content: center;
    line-height: 18px;
    width: max-content;
    padding: 8px 16px;
}
.offline-icon-svg {
    stroke: #fff;
}

.dark-mode .offline-icon-svg {
    stroke: #000;
}
.inner-table tbody tr:last-child td:last-child{
    border-radius:0;
}
.inner-table tbody tr td {
    padding: var(--space-none) var(--space-s);
}

.cell-border-left-gray {
   border-left: 6px solid var(--color-neutral-7) !important;
}

.cell-border-left-transparent {
   border-left: 6px solid transparent !important;
}

.cell-border-left {
   border-left: 6px solid var(--color-neutral-7) !important;
}

.cell-border-left-transparent {
   border-left: 6px solid transparent !important;
}



td.offline-site-cell{
    border-radius: 0 0 0 0;
    padding: 0 !important;
}

.offline-site-cell-div {
    align-items: center;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    height: 46px;
    line-height: 18px;
    justify-content: left;
    padding: 10px;
}

/* Modal */
.medium-small-size-modal {
    max-width: 800px !important;
}
.medium-small-size-modal .modal-content {
    max-height: 800px !important;
}

.medium-size-modal {
    max-width: 1000px !important;
}
.medium-size-modal .modal-content {
    max-height: 1000px !important;
}

.big-size-modal {
    max-width: 1400px !important;
}
.big-size-modal .modal-content {
    max-height: 1400px !important;
}

.modal-content .TableRecords .TableRecords_OddLine, 
.modal-content .TableRecords .TableRecords_EvenLine {
    height: 55px;
}


/* preview card layout */
.box-shadow-portrait,
.box-shadow-landscape {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border-radius: 24px;
    position: absolute;
    overflow: hidden;
    width: 1006px;
    height: 640px;
}
.box-shadow-portrait {
    transform: translate(-136px, -33px) rotate(-90deg) scale(0.5);
}
.box-shadow-landscape {
    transform: scale(0.5) translate(-263px, -83px);
}


/* TODO: try to not use this... find a way to remove.. it's being used to force input placehodler height on filters wrapper custom component */
.fake-input-wrapper {
    height: 40px;
}

.fake-input-wrapper-n-m {
    height: 40px;
}

.empty-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    height: 100%;
}

.empty-content img {
    margin: var(--space-xl) 0;
    max-width: 300px;
}

.dark-mode .empty-content img {
    opacity: .7;
}

.max-height-half {
    max-height: 50%;
}

.custom-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}


/* Icons modifiers */
.fas.evacuations-checkin {
    color: var(--color-evacuation-checkin);
    opacity: 1;
    font-size: inherit;
}

.fas.evacuations-checkout {
    color: var(--color-evacuation-checkout);
    opacity: 1;
    font-size: inherit;
}

.marker-tooltip {
    color: var(--color-neutral-9);
    font-size: var(--font-size-s);
    min-width: 110px;
}

.marker-tooltip a {
    color: inherit;
}

.marker-tooltip .place-info {
    margin-bottom: var(--space-base);
    color: #868e96;
}
.marker-tooltip .place-name {
    font-weight: bold;
    color: #343a40;
}
.marker-tooltip .people-count {
    color: #ED4F2F;
}
.marker-tooltip .people-count i {
    margin-right: var(--space-xs);
}

.btn.user-map > .icon::after {
    content: '';
    width: 28px;
    height: 28px;
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url('/Restrata_Th/img/userlocationorange_2x.png?719')
}
.button-group input[type="radio"]:checked + .btn.user-map > .icon::after {
    background-image: url('/Restrata_Th/img/userlocationwhite_2x.png?719')
}

.btn.user-map-s > .icon::after {
    content: '';
    width: 28px;
    height: 28px;
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url('/Restrata_Th/img/userlocationorangeS_2x.png?719')
}
.button-group input[type="radio"]:checked + .btn.user-map-s > .icon::after {
    background-image: url('/Restrata_Th/img/userlocationwhiteS_2x.png?719')
}

.ControlActions .fa-trash-o::before {
    content: "\f1f8";
    font-size: 18px;
    vertical-align: top;
}


/* Sticky elements */
.sticky-top {
    display: block;
    position: sticky;
    top: 70px;
}



.flex-container {
    display: flex;
}

.user-info_smallfont {
    font-size: 12px;
}

/* circle image */

img.img-circle {
    max-width: fit-content;
}

/* ================================================================ */
/*  $6.8 - Styles - Page Context Styles                             */
/* ================================================================ */

.page-muster-dashboard .panel {
    position: sticky;
    top: 90px;

    max-height: 78vh;
    box-shadow: none;
}
.page-muster-dashboard .dashboard-counter,
.page-dashboard-evacuations-detail .panel,
.inner-content__content .dashboard-counter,
.inner-content__content .panel,
.page-dashboard-evacuations-detail .dashboard-counter {
    box-shadow: none;
}

.page-muster-detail .col-last {
    position: sticky;
    top: 90px;
}

.page-dashboard-evacuations-detail .columns .columns-item > .card {
    height: 400px;
}

.page-dashboard-evacuations-global .inner-content .columns .columns-item > .card {
    height: calc(100vh - 274px);
}

.page-dashboard-evacuations-global .inner-content .columns-item {
    height: 100%;
}

.page-dashboard-site .three-cols-wrapper .col-last > *,
.page-dashboard-global .three-cols-wrapper .col-first > * {
    height: 100%;
}


.page-dashboard-site .dashboard-counter:first-child,
.page-dashboard-global .dashboard-counter:first-child {
    max-width: 200px;
}

.page-dashboard-area .three-cols-wrapper .col-first > *,
.page-dashboard-area .three-cols-wrapper .col-last > *,
.page-muster-detail .two-cols-small-right .col-last > * {
    height: 50%;
}

.page-dashboard-site .three-cols-wrapper .col-first > *:last-child {
    height: 100%;
}

.page-dashboard-evacuations-detail .tabs .tabs-content {
    padding: var(--space-s) 0 var(--space-m);
}
.page-dashboard-evacuations-detail .detailed-list-title {
    margin: var(--space-m) 0 var(--space-base);
}

.page-dashboard-site .three-cols-wrapper .col-first .panel-content {
    max-height: 36vh;
}
.page-dashboard-site .three-cols-wrapper .col-first.collapsed .panel-content {
    max-height: 68vw;
}

.side-table.columns-item table td,
.columns-item .side table td {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tippy-active > .fas {
    color: var(--color-primary);
}

.musters__table .detailed-list-item__labels {
    flex: 2;
}
.musters__table .detailed-list-item.unplanned-muster .detailed-list-item__duration {
    flex: 0.5;
}
.musters__table .detailed-list-item__actions {
    flex: 0.3;
}

@media (max-width: 1575px) {
    .traveller-columns > .columns-item:nth-child(2) {
            position: fixed;
            bottom: 0;
            right: 8px;
    }

    .traveller-columns > .columns-item:nth-child(2) .card.info-section {
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        min-height: 624px;
    }
}

::-moz-selection {
    background-color: rgba(255, 123, 36, 0.8);
    color: white;
}

::selection {
    background-color: rgba(255, 123, 36, 0.8);
    color: white;
}

.hexaValue {
    font-family: monospace;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 1.1em;
}

/* $6.9 - FeedbackMessage Timer*/

.Feedback_Message_Wrapper {
  -webkit-animation: hideFeedback 3000ms; /* Safari 4.0 - 8.0 */
  animation: hideFeedback 3000ms;
  animation-delay: 5s;
  animation-iteration-count: 1;
  -webkit-animation-fill-mode: forwards; /* Safari 4.0 - 8.0 */
  animation-fill-mode: forwards;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes hideFeedback {
  from {opacity: 1px;}
  to {opacity: 0;}
  100%{ -webkit-animation: none;}
  
}

/* Standard syntax */
@keyframes hideFeedback {
  from {opacity: 1;}
  to {opacity: 0;}
  100%{ -webkit-animation: none;}
}

.small-font {
    font-size: 80%;
}

.mobileValidation {
}

.hide-element {
    display: none !important;
}