/* se variables */
:root {
    --se-spacing-none: 0px;
    --se-spacing-nano: 4px;
    --se-spacing-medium: 8px;
    --se-spacing-large: 16px;
    --se-spacing-xlarge: 32px;
}

/* se colors */
:root {
    /* color palette */
    --se-dark-green: #007626;
    --se-logo-green: #009530; /* primary */
    --se-medium-green: #32ad3c;
    --se-life-green: #3dcd58; /* primary */
    --se-light-green: #70e07c;
    --se-dark-sky-blue: #0087cd;
    --se-medium-blue: #219bfd;
    --se-sky-blue: #42b4e6; /* secondary */
    --se-fuchsia-red: #b10043; /* secondary */
    --se-red: #dc0a0a;
    --se-honeysuckle-orange: #e47f00; /* secondary */
    --se-sunflower-yellow: #ffd100; /* secondary */
    --se-sky-blue-10p: #ecf7fc;
    --se-red-10p: #fceae7;
    /* grayscale palette */
    --se-true-black: #000000;
    --se-black: #0f0f0f; /* primary */
    --se-anthracite-gray: #333333;
    --se-ultra-dark-gray: #434343;
    --se-super-dark-gray: #505559;
    --se-dark-grey-gray: #626469; /* primary */
    --se-transparent-gray: rgba(0,0,0,0.5);
    --se-medium-gray: #9fa0a4; /* primary */
    --se-light-gray: #cbcbcb;
    --se-super-light-gray: #e6e6e6;
    --se-super-light-gray-6: #434b4d;
    --se-ultra-light-gray-1: #ededed;
    --se-ultra-light-gray-2: #f7f7f7;
    --se-white: #ffffff;
}

/* se color variables */
:root {
    --se-primary: #3dcd58;
    --se-primary-shade: #257b35; /* SEAL Add (Used for tabbar border/buttons) */
    --se-secondary: #42b4e6;
    --se-standard: #626469;
    --se-alternative: #ffffff;
    --se-success: #3dcd58;
    --se-information: #0087cd;
    --se-warning: #e47f00;
    --se-error: #dc0a0a;
    --se-border: #9fa0a4;
    --se-border-focus: #333333;
    --se-divider: #e6e6e6;
    --se-link-visited: #3a738c;
    --se-primary-contrast: #ffffff;
    --se-secondary-contrast: #ffffff;
    --se-standard-contrast: #ffffff;
    --se-alternative-contrast: #0f0f0f;
    --se-success-contrast: #ffffff;
    --se-information-contrast: #ffffff;
    --se-warning-contrast: #0f0f0f;
    --se-error-contrast: #ffffff;
    --se-primary-hover: #32ad3c;
    --se-secondary-hover: #0087cd;
    --se-standard-hover: #494b50;
    --se-alternative-hover: #e6e6e6;
    --se-primary-selected: #0a9a25;
    --se-secondary-selected: #0f81b3;
    --se-standard-selected: #2f3136;
    --se-alternative-selected: #cccccc;
    --se-button-focus: #007acd;
    --se-background-standard: #f7f7f7;
    --se-background-standard-hover: var(--se-super-light-gray); /* SEAL Add */
    --se-background-standard-active: var(--se-light-gray); /* SEAL Add */
    --se-background-standard-contrast: #0f0f0f;
    --se-background-alternative: #ffffff;
    --se-background-alternative-contrast: #0f0f0f;
    --se-background-footer: #e7e6e6;
    --se-background-footer-contrast: #0f0f0f;
    --se-overlay: rgba(15, 15, 15, 0.4);
    --se-overlay-loading: rgba(255, 255, 255, 0.4);
    --se-shadow: rgba(15, 15, 15, 0.2);
}

/* se-text  */
.se-text-primary {
    color: var(--se-primary);
}

.se-text-secondary {
    color: var(--se-secondary);
}

.se-text-standard {
    color: var(--se-standard);
}

.se-text-alternative {
    color: var(--se-alternative);
}

.se-text-success {
    color: var(--se-success);
}

.se-text-information {
    color: var(--se-information);
}

.se-text-warning {
    color: var(--se-warning);
}

.se-text-error {
    color: var(--se-error);
}

/* se-sidemenu */
.se-sidemenu {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.se-sidemenu-header {
    display: flex;
    align-items: center;
    padding: 11px 16px;
    border-bottom: 1px solid rgb(230, 230, 230);
}

    .se-sidemenu-header i {
        /* Icon */
        color: var(--mdc-theme-primary);
        font-size: 30px;
        cursor: pointer;
    }

    .se-sidemenu-header span {
        font-weight: bold;
        font-size: 1.25rem;
        padding-left: 5px;
    }

.se-sidemenu-item {
    max-width: 100%;
    padding: 11px 11px;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-bottom: 1px solid rgb(230, 230, 230);
    border-left: 5px solid transparent;
    user-select: none;
    transition: all 0.2s ease 0s;
}

    .se-sidemenu-item.active {
        border-left: 5px solid var(--mdc-theme-primary);
    }

    .se-sidemenu-item:not([disabled]):hover {
        background-color: rgb(237, 237, 237);
    }

    .se-sidemenu-item:last-of-type {
        margin-bottom: auto; /* Fill rest of menu (makes footer and other stuff be placed at bottom */
    }

.se-sidemenu-footer {
    background-color: rgb(247, 247, 247);
    text-align: center;
    padding: 16px;
    margin-top: 60px; /* Account for logo */
    position: relative;
}

    .se-sidemenu-footer::before {
        /* Se Life is On logo */
        content: url("data:image/svg+xml,%3Csvg id='Calque_1' data-name='Calque 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 252.08 69.42' width='213' height='60' role='img'%3E%3Ctitle%3ELife is On - Schneider Electric%3C/title%3E%3Cpath fill='%233DCD58' class='cls-1' d='M19.83,40.64H12.47V27.75c0-.47,0-1.19-.81-1.19s-.76.66-.76,1.19v13c0,1.07.14,1.21,1.31,1.21h7.62c.52,0,1.16,0,1.16-.64s-.64-.63-1.16-.63'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M23.12,30.73c-.72,0-.72.6-.72,1.08V41.1c0,.47,0,1.06.72,1.06s.7-.59.7-1.06V31.81c0-.43,0-1.08-.7-1.08'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M23.12,27a.83.83,0,1,0,0,1.66.88.88,0,0,0,.9-.83.86.86,0,0,0-.9-.83'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M30.09,31H28.57V30c0-1.36.13-2.26,1.84-2.26l.45,0,.53,0a.57.57,0,0,0,.58-.55.56.56,0,0,0-.33-.48A5.23,5.23,0,0,0,30,26.56a3.32,3.32,0,0,0-1.43.32,2.21,2.21,0,0,0-1,.93,3.81,3.81,0,0,0-.35,2V31H26c-.22,0-.9,0-.9.47s.63.5.9.5h1.2V41.1c0,.47,0,1.06.72,1.06s.7-.59.7-1.06V32h1.52c.59,0,.9-.17.9-.5s-.59-.47-.9-.47m-1.32-2.47,0,0,0,0'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M41.5,35.69a5.86,5.86,0,0,0-.66-2.55,4.31,4.31,0,0,0-1.53-1.66,2.39,2.39,0,0,0-.22-.12l-.16-.08a3.48,3.48,0,0,0-.48-.21L38.29,31a4.91,4.91,0,0,0-.58-.15l-.12,0a5.47,5.47,0,0,0-.72-.08H36.8l-.42,0a5.22,5.22,0,0,0-4,1.57A6,6,0,0,0,31,36.45a6.1,6.1,0,0,0,1.32,4.06A4.42,4.42,0,0,0,34,41.72a6.26,6.26,0,0,0,2.4.44,5.12,5.12,0,0,0,3.92-1.51,3.63,3.63,0,0,0,1-1.78.67.67,0,0,0-.7-.6.73.73,0,0,0-.67.47,3.74,3.74,0,0,1-1.85,2,4,4,0,0,1-1.63.34,3.64,3.64,0,0,1-3-1.27,5.13,5.13,0,0,1-1-3.22h7.72c.71,0,1.31,0,1.31-.91m-9-.16a4,4,0,0,1,3.85-3.73c3.3,0,3.59,2.8,3.68,3.73Z'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M48.75,26.56c-.79,0-.79.72-.79,1.19V41c0,.5,0,1.19.81,1.19s.76-.66.76-1.19V27.75c0-.53,0-1.19-.78-1.19'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M74.48,34.57a.81.81,0,0,0,.8-.8v-9.1H73.65v9.1a.81.81,0,0,0,.83.8'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M59.54,36.48l-.31-.14-.1-.05a13.57,13.57,0,0,0-2.58-.74,10.74,10.74,0,0,1-2.3-.66,1.46,1.46,0,0,1-1-1.35c0-1.2,1.43-1.74,2.84-1.74s2.6.58,2.94,1.51c.2.57.37.66.67.66a.58.58,0,0,0,.65-.56A2.47,2.47,0,0,0,59.68,32a3.4,3.4,0,0,0-1.3-.88A6.35,6.35,0,0,0,56,30.73,4.34,4.34,0,0,0,52.55,32a2.86,2.86,0,0,0-.69,1.78,2.42,2.42,0,0,0,1.1,2,8.68,8.68,0,0,0,2.88,1l1.35.33h.06c.79.2,2.26.57,2.26,1.89,0,1-1,2.06-3.21,2.06a3.23,3.23,0,0,1-3.25-1.83l0,0c-.15-.35-.3-.67-.7-.67a.78.78,0,0,0-.47.16.55.55,0,0,0-.23.44,3.13,3.13,0,0,0,1.24,2.07,3.55,3.55,0,0,0,1.18.64,6.76,6.76,0,0,0,2.16.29,5.16,5.16,0,0,0,4-1.32,3,3,0,0,0,.8-2,2.54,2.54,0,0,0-1.43-2.36'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M92.77,31.89a4.19,4.19,0,0,0-3.15-1.16,4.47,4.47,0,0,0-3.81,1.83v-.81a1.18,1.18,0,0,0-.2-.88.2.2,0,0,0-.08,0l0,0a.78.78,0,0,0-.39-.1c-.72,0-.72.62-.72,1.08v9.29c0,.5,0,1.08.72,1.08a.78.78,0,0,0,.39-.1l0,0s.06,0,.08,0a1.14,1.14,0,0,0,.2-.87v-4a7.67,7.67,0,0,1,.41-3.36,3.51,3.51,0,0,1,1.39-1.42,3.88,3.88,0,0,1,1.89-.51,2.82,2.82,0,0,1,2.28,1,3.86,3.86,0,0,1,.47,2.23v6a1.24,1.24,0,0,0,.2.87s.06,0,.08,0l0,0a.72.72,0,0,0,.39.1c.72,0,.72-.6.72-1.08v-6.3a4.1,4.1,0,0,0-.9-2.89'%3E%3C/path%3E%3Cpath fill='%233DCD58' class='cls-1' d='M76.73,26.36v1.56a6.65,6.65,0,1,1-4.48.06V26.4a8.15,8.15,0,1,0,4.48,0'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M136,28.07c-2.72-1.21-4.34-1.67-5.94-1.67s-2.77.6-2.77,1.53c0,2.82,9.56,2,9.56,8.54,0,3.6-3,5.68-7.21,5.68a12.68,12.68,0,0,1-6.76-1.81v-4c2.68,1.78,4.33,2.41,6.4,2.41,1.8,0,2.77-.63,2.77-1.72,0-3.07-9.56-2-9.56-8.66,0-3.23,2.8-5.37,7.15-5.37A15.43,15.43,0,0,1,136,24.42v3.65'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M149.35,41.3a12.25,12.25,0,0,1-4.28.85c-4.45,0-7.33-2.59-7.33-6.53s3-6.61,7.17-6.61a13.22,13.22,0,0,1,4.25.82v3a7.29,7.29,0,0,0-3.24-.85c-2.39,0-3.92,1.43-3.92,3.65a3.54,3.54,0,0,0,3.78,3.72,9.71,9.71,0,0,0,3.57-.88V41.3'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M186.53,29a6.41,6.41,0,0,0-6.69,6.64c0,3.91,2.89,6.5,7.35,6.5a9.13,9.13,0,0,0,5.65-1.68V38a7.48,7.48,0,0,1-4.69,1.79c-2.51,0-4-1.3-4.18-3.52h9.09c.19-4.63-2.85-7.25-6.53-7.25m-2.48,5.15a2.69,2.69,0,0,1,2.75-2.77,2.72,2.72,0,0,1,2.75,2.77Z'%3E%3C/path%3E%3Crect fill='%23009530' class='cls-2' x='194.6' y='29.25' width='3.98' height='12.67'%3E%3C/rect%3E%3Cpath fill='%23009530' class='cls-2' d='M209.64,23.2v6.6a7.45,7.45,0,0,0-3.3-.79c-3.63,0-6.14,2.68-6.14,6.56s2.51,6.59,5.91,6.59a5.27,5.27,0,0,0,3.53-1.26v1h4V23.2h-4m0,15.26a3.37,3.37,0,0,1-2.37,1c-1.87,0-3.05-1.54-3.05-3.85,0-2.53,1.18-4,3.18-4a4.28,4.28,0,0,1,2.24.75Z'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M222,29a6.41,6.41,0,0,0-6.68,6.64c0,3.91,2.89,6.5,7.34,6.5a9.16,9.16,0,0,0,5.66-1.68V38a7.49,7.49,0,0,1-4.7,1.79c-2.49,0-4-1.3-4.17-3.52h9.08c.19-4.63-2.85-7.25-6.53-7.25m-2.47,5.15a2.68,2.68,0,0,1,2.74-2.77A2.73,2.73,0,0,1,225,34.16Z'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M234.46,32.88h0c1.18-2.64,2.51-3.88,4-3.88a4.29,4.29,0,0,1,2.63,1.16l-1.09,3.51a4.59,4.59,0,0,0-2.36-.93c-1.46,0-2.39,1.37-3.27,3.7V41.9h-4V29.23h4v3.65'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M198.76,23.92a2.8,2.8,0,0,1-1.5,3.06c-1.2.71-2.47.48-2.84-.5a2.79,2.79,0,0,1,1.49-3.07c1.2-.71,2.47-.48,2.85.51'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M163.67,33.85A4.44,4.44,0,0,0,159,29a4.88,4.88,0,0,0-4,2.12H155V23.2h-4V41.88h4v-8c.93-1.34,1.72-1.92,2.66-1.92,1.23,0,2.06.88,2.06,2.77v4.46a11.9,11.9,0,0,1,4-1.27v-4'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M173.66,29a5.13,5.13,0,0,0-4.13,2V29.25h-4v8.61a6.3,6.3,0,0,1,4,1.81V33.75c1.05-1.56,1.79-2.09,2.78-2.09s2,.75,2,2.53v7.7h4v-8c0-3.73-2.64-4.85-4.61-4.85'%3E%3C/path%3E%3Cpolygon fill='%23009530' class='cls-2' points='180.47 45.53 175.85 45.53 175.85 48.81 180.31 48.81 180.31 50.22 175.85 50.22 175.85 53.61 180.61 53.61 180.61 55.02 174.3 55.02 174.3 44.12 180.47 44.12 180.47 45.53'%3E%3C/polygon%3E%3Crect fill='%23009530' class='cls-2' x='184.24' y='44.12' width='1.42' height='10.91'%3E%3C/rect%3E%3Cpath fill='%23009530' class='cls-2' d='M190.71,51.64h5c0-2.66-1.22-3.94-3.12-3.94a3.32,3.32,0,0,0-3.35,3.63,3.54,3.54,0,0,0,3.47,3.83,4.67,4.67,0,0,0,2.87-.85V52.93a4.56,4.56,0,0,1-2.51.87,2.25,2.25,0,0,1-2.41-2.16m2-2.72a1.63,1.63,0,0,1,1.67,1.77h-3.6a1.86,1.86,0,0,1,1.93-1.77'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M205,49.72a3.22,3.22,0,0,0-2-.72,2.42,2.42,0,0,0,.23,4.83,4.51,4.51,0,0,0,1.9-.48v1.4a5.84,5.84,0,0,1-2.13.41,3.45,3.45,0,0,1-3.64-3.58c0-2.38,1.36-3.88,3.54-3.88a4.68,4.68,0,0,1,2.07.49v1.53'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M211.46,47.83h2.27v1.28h-2.27V52.8a1,1,0,0,0,1,1.09,3.08,3.08,0,0,0,1.62-.54v1.33a4.34,4.34,0,0,1-1.73.48,2.12,2.12,0,0,1-2.32-2.26V49.11H208.8V49l2.66-2.6v1.48'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M219.15,47.83V49.5h0c.73-1.28,1.41-1.8,2.08-1.8a2.48,2.48,0,0,1,1.71.83l-.75,1.25a2.29,2.29,0,0,0-1.33-.72,2,2,0,0,0-1.73,2.21V55h-1.42V47.83h1.42'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M237.47,49.72a3.26,3.26,0,0,0-2-.72,2.21,2.21,0,0,0-2.19,2.45,2.24,2.24,0,0,0,2.43,2.38,4.59,4.59,0,0,0,1.9-.48v1.4a6,6,0,0,1-2.14.41,3.46,3.46,0,0,1-3.64-3.58c0-2.38,1.37-3.88,3.54-3.88a4.72,4.72,0,0,1,2.08.49v1.53'%3E%3C/path%3E%3Crect fill='%23009530' class='cls-2' x='226.71' y='47.83' width='1.42' height='7.19'%3E%3C/rect%3E%3Cpath fill='%23009530' class='cls-2' d='M228.18,45.25a1,1,0,0,1-.53,1.09c-.43.25-.88.17-1-.18a1,1,0,0,1,.53-1.09c.43-.25.88-.17,1,.18'%3E%3C/path%3E%3Cpath fill='%23009530' class='cls-2' d='M165.66,48.77l.43-1.56H170a6.11,6.11,0,0,0-1.27-5.73c-2.77-2.77-8.58-1.83-12.9,2.31a14.68,14.68,0,0,0-1.77,2.05h2.36l-.55,1.56h-2.81a11.84,11.84,0,0,0-.72,1.48h3.34l-.54,1.56h-3.28c-.56,2.38-.2,4.61,1.21,6,2.74,2.74,8.53,1.78,12.85-2.36a15.9,15.9,0,0,0,2-2.29h-3l.46-1.56h3.54a15,15,0,0,0,.69-1.48h-3.87m-.87-2.94c-.25,0-.35,0-.45.16a.34.34,0,0,0-.08.18L163,51c-.3,1.69-2.38,3.38-5.08,3.38h-3.76l.65-2.48h2.42a.78.78,0,0,0,.6-.27.56.56,0,0,0,.14-.29l1-4.21a4.71,4.71,0,0,1,4.78-3.55h3.85l-.49,2.27Z'%3E%3C/path%3E%3Crect class='cls-3' x='107.7' y='10.9' width='0.82' height='47.63'%3E%3C/rect%3E%3C/svg%3E");
        position: absolute;
        top: -60px; /* Place above footer */
        left: 0;
        right: 0;
    }

    .se-sidemenu-footer a {
        color: var(--mdc-theme-secondary);
    }

/* se-tabbar: short. the tabbar to use when there is no tab bar.. */
.se-tabbar-short {
    width: 100%;
    height: 8px;
    background-color: var(--mdc-theme-primary, #000000);
}

/* se-tabbar color="primary" */
.se-tabbar {
    display: flex;
    position: fixed;
    top: 64px;
    width: 100%;
    height: 46px;
    box-sizing: border-box;
    background-color: var(--se-primary);
    border-bottom: 4px solid var(--se-primary-shade);
    font-weight: 400;
    color: var(--se-primary-contrast);
    user-select: none;
}

    .se-tabbar .se-tab {
        display: flex;
        align-items: center;
        height: inherit;
        padding: 0 var(--se-spacing-medium);
        margin: 0 var(--se-spacing-medium);
        border-bottom: inherit;
        text-transform: uppercase;
        cursor: pointer;
        transition: border-bottom-color linear 0.1s;
    }

        .se-tabbar .se-tab:first-of-type {
            margin-left: 0;
        }

        .se-tabbar .se-tab:last-of-type {
            margin-right: 0;
        }

        .se-tabbar .se-tab.se-tab--btn {
            padding: 0 var(--se-spacing-large);
            background-color: var(--se-primary-shade);
        }

        .se-tabbar .se-tab.se-tab--btn-icon {
            flex-direction: column;
            justify-content: center;
            background-color: var(--se-primary-shade);
        }

            .se-tabbar .se-tab.se-tab--btn-icon span {
                text-transform: capitalize;
                font-size: .65em;
                line-height: 1.1;
                padding: 0 var(--se-spacing-nano);
            }

        .se-tabbar .se-tab:hover:not(.se-tab--btn):not(.se-tab--btn-icon),
        .se-tabbar .se-tab.active {
            border-bottom-color: var(--se-primary-contrast);
        }

.se-tabbar--content {
    height: calc(100% - 39px);
    margin-top: 39px;
    overflow: auto;
}

/* se-tabbar option="content" color="primary" */
.se-tabbar-content {
    flex: 0 0 auto;
    display: flex;
    background-color: var(--mdc-theme-surface, #ffffff);
    font-weight: 500;
    border-top: 1px solid #e6e6e6;
}

    .se-tabbar-content > * {
        flex-shrink: 1;
        transition: flex-shrink ease-in-out 0.2s;
    }

        .se-tabbar-content > *:hover,
        .se-tabbar-content > .active,
        .se-tabbar-content > .contextmenu-open {
            flex-shrink: 0;
        }

    .se-tabbar-content .tab {
        display: flex;
        padding: 0.65rem 0;
        border-top: 2px solid transparent;
        border-right: 1px solid #e6e6e6;
        cursor: pointer;
        user-select: none;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        /* Dynamic shrinkable side-margins */
        .se-tabbar-content .tab::before,
        .se-tabbar-content .tab::after {
            content: '';
            width: 2rem;
            min-width: .1rem;
            flex-shrink: 10000; /* super large to take precedence over content */
        }

        .se-tabbar-content .tab > * {
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }

        .se-tabbar-content .tab.active {
            color: var(--mdc-theme-primary, #3dcd58);
            background-color: var(--mdc-theme-background, #f7f7f7);
            border-top-color: var(--mdc-theme-primary, #3dcd58);
        }

/* se-tabbar option="content" color="alternate" */
/* TODO: Merge with the non-alternate selectors, since much is overlapping*/
.se-tabbar-content-alternative {
    height: 100%;
    display: flex;
    flex-direction: column;
    border: 1px solid #e6e6e6;
    box-sizing: border-box;
}

    .se-tabbar-content-alternative .row-tabbar {
        flex: 0 0 auto;
        display: flex;
        height: 42px;
        background-color: #f8f8f8;
        font-weight: 500;
    }

        .se-tabbar-content-alternative .row-tabbar > * {
            flex-shrink: 1;
            transition: flex-shrink ease-in-out 0.2s;
        }

            .se-tabbar-content-alternative .row-tabbar > *:hover,
            .se-tabbar-content-alternative .row-tabbar > .active,
            .se-tabbar-content-alternative .row-tabbar > .contextmenu-open {
                flex-shrink: 0;
            }

    .se-tabbar-content-alternative .tab {
        display: flex;
        padding: 0.65rem 0;
        border-top: 2px solid transparent;
        border-right: 1px solid #e6e6e6;
        cursor: pointer;
        user-select: none;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        /* Dynamic shrinkable side-margins */
        .se-tabbar-content-alternative .tab::before,
        .se-tabbar-content-alternative .tab::after {
            content: '';
            width: 2rem;
            min-width: .1rem;
            flex-shrink: 10000; /* super large to take precedence over content */
        }

        .se-tabbar-content-alternative .tab > * {
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }

        .se-tabbar-content-alternative .tab.active {
            color: #3DCD58;
            background-color: var(--mdc-theme-on-primary, #ffffff);
            border-top: 2px solid #3DCD58;
        }

        .se-tabbar-content-alternative .tab.disabled {
            color: var(--se-light-gray);
            pointer-events: none;
        }

    .se-tabbar-content-alternative .row-tabbar-content {
        flex: 1 1 auto;
        background-color: #ffffff;
        overflow: auto;
        padding: 10px;
    }

.tab .tab-more {
    display: none;
    position: absolute;
    right: 1px;
    color: var(--se-medium-gray)
}

    .tab .tab-more i {
        margin-top: -1px;
    }

.tab.active .tab-more,
.tab:hover .tab-more,
.tab.contextmenu-open .tab-more {
    display: block;
}

.tab:hover .tab-more,
.tab.contextmenu-open .tab-more {
    color: var(--se-standard)
}

/* se-block */
.se-block {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    overflow: auto;
}

    .se-block > :last-child {
        flex: 1 1 auto;
    }

    /* option="card" */
    .se-block.card, .se-block.widget {
        background-color: #ffffff;
        border-radius: 3px;
        border: solid 1px #e6e6e6;
        position: relative;
    }

    /* option="widget" */
    .se-block.widget {
        background-color: #ffffff;
        border-radius: 3px;
    }

        /* option="card" option="widget" */
        .se-block.card > .se-block-header,
        .se-block.widget > .se-block-header {
            font-weight: 300;
            line-height: 30px;
            font-size: 22px;
        }

        .se-block-content > .se-block-header {
            font-size: 22px;
            padding: 12px 0 0 0;
        }

.se-block-header {
    position: relative;
    padding: 12px 12px 10px 16px;
}

.se-block-content {
    padding: var(--se-spacing-large);
}

.se-block-header + .se-block-content {
    padding-top: var(--se-spacing-none);
}

.se-block-content:last-child {
    overflow: auto;
}


/* se-divider */
.se-divider {
    border: none;
    border-top: 1px solid var(--se-divider);
}

/* ## Utilities ## */

/* utility: min size */
.min-h-100 {
    min-height: 100%;
}

.min-w-100 {
    min-width: 100%;
}

/* utility: max size */
.max-h-100 {
    max-height: 100% !important;
}

.max-w-100 {
    max-width: 100% !important;
}


/* utility: padding */
.p-s {
    padding: var(--se-spacing-nano) !important;
}

.p-m {
    padding: var(--se-spacing-medium) !important;
}

.p-l {
    padding: var(--se-spacing-large) !important;
}

.p-xl {
    padding: var(--se-spacing-xlarge) !important;
}

/* utility: padding-top */
.pt-s {
    padding-top: var(--se-spacing-nano) !important;
}

.pt-m {
    padding-top: var(--se-spacing-medium) !important;
}

.pt-l {
    padding-top: var(--se-spacing-large) !important;
}

.pt-xl {
    padding-top: var(--se-spacing-xlarge) !important;
}

/* utility: padding-right (end) */
.pe-s {
    padding-right: var(--se-spacing-nano) !important;
}

.pe-m {
    padding-right: var(--se-spacing-medium) !important;
}

.pe-l {
    padding-right: var(--se-spacing-large) !important;
}

.pe-xl {
    padding-right: var(--se-spacing-xlarge) !important;
}


/* utility: padding-bottom */
.pb-s {
    padding-bottom: var(--se-spacing-nano) !important;
}

.pb-m {
    padding-bottom: var(--se-spacing-medium) !important;
}

.pb-l {
    padding-bottom: var(--se-spacing-large) !important;
}

.pb-xl {
    padding-bottom: var(--se-spacing-xlarge) !important;
}

/* utility: padding-left (start) */
.ps-s {
    padding-left: var(--se-spacing-nano) !important;
}

.ps-m {
    padding-left: var(--se-spacing-medium) !important;
}

.ps-l {
    padding-left: var(--se-spacing-large) !important;
}

.ps-xl {
    padding-left: var(--se-spacing-xlarge) !important;
}


/* utility: padding-left & padding-right (x) */
.px-s {
    padding-left: var(--se-spacing-nano) !important;
    padding-right: var(--se-spacing-nano) !important;
}

.px-m {
    padding-left: var(--se-spacing-medium) !important;
    padding-right: var(--se-spacing-medium) !important;
}

.px-l {
    padding-left: var(--se-spacing-large) !important;
    padding-right: var(--se-spacing-large) !important;
}

.px-xl {
    padding-left: var(--se-spacing-xlarge) !important;
    padding-right: var(--se-spacing-xlarge) !important;
}

/* utility: padding-top & padding-bottm (y) */
.py-s {
    padding-top: var(--se-spacing-nano) !important;
    padding-bottom: var(--se-spacing-nano) !important;
}

.py-m {
    padding-top: var(--se-spacing-medium) !important;
    padding-bottom: var(--se-spacing-medium) !important;
}

.py-l {
    padding-top: var(--se-spacing-large) !important;
    padding-bottom: var(--se-spacing-large) !important;
}

.py-xl {
    padding-top: var(--se-spacing-xlarge) !important;
    padding-bottom: var(--se-spacing-xlarge) !important;
}


/* utility: margin */
.m-s {
    margin: var(--se-spacing-nano) !important;
}

.m-m {
    margin: var(--se-spacing-medium) !important;
}

.m-l {
    margin: var(--se-spacing-large) !important;
}

.m-xl {
    margin: var(--se-spacing-xlarge) !important;
}

/* utility: margin-top */
.mt-s {
    margin-top: var(--se-spacing-nano) !important;
}

.mt-m {
    margin-top: var(--se-spacing-medium) !important;
}

.mt-l {
    margin-top: var(--se-spacing-large) !important;
}

.mt-xl {
    margin-top: var(--se-spacing-xlarge) !important;
}

/* utility: margin-right (end) */
.me-s {
    margin-right: var(--se-spacing-nano) !important;
}

.me-m {
    margin-right: var(--se-spacing-medium) !important;
}

.me-l {
    margin-right: var(--se-spacing-large) !important;
}

.me-xl {
    margin-right: var(--se-spacing-xlarge) !important;
}


/* utility: margin-bottom */
.mb-s {
    margin-bottom: var(--se-spacing-nano) !important;
}

.mb-m {
    margin-bottom: var(--se-spacing-medium) !important;
}

.mb-l {
    margin-bottom: var(--se-spacing-large) !important;
}

.mb-xl {
    margin-bottom: var(--se-spacing-xlarge) !important;
}

/* utility: margin-left (start) */
.ms-s {
    margin-left: var(--se-spacing-nano) !important;
}

.ms-m {
    margin-left: var(--se-spacing-medium) !important;
}

.ms-l {
    margin-left: var(--se-spacing-large) !important;
}

.ms-xl {
    margin-left: var(--se-spacing-xlarge) !important;
}


/* utility: margin-left & margin-right (x) */
.mx-s {
    margin-left: var(--se-spacing-nano) !important;
    margin-right: var(--se-spacing-nano) !important;
}

.mx-m {
    margin-left: var(--se-spacing-medium) !important;
    margin-right: var(--se-spacing-medium) !important;
}

.mx-l {
    margin-left: var(--se-spacing-large) !important;
    margin-right: var(--se-spacing-large) !important;
}

.mx-xl {
    margin-left: var(--se-spacing-xlarge) !important;
    margin-right: var(--se-spacing-xlarge) !important;
}

/* utility: margin-top & margin-bottm (y) */
.my-s {
    margin-top: var(--se-spacing-nano) !important;
    margin-bottom: var(--se-spacing-nano) !important;
}

.my-m {
    margin-top: var(--se-spacing-medium) !important;
    margin-bottom: var(--se-spacing-medium) !important;
}

.my-l {
    margin-top: var(--se-spacing-large) !important;
    margin-bottom: var(--se-spacing-large) !important;
}

.my-xl {
    margin-top: var(--se-spacing-xlarge) !important;
    margin-bottom: var(--se-spacing-xlarge) !important;
}

/* utility: text-trunaction with multi line clamp */

.text-truncate {
    overflow: hidden;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
}

    .text-truncate.text-truncate--2 {
        -webkit-line-clamp: 2;
    }

    .text-truncate.text-truncate--3 {
        -webkit-line-clamp: 3;
    }

    .text-truncate.text-truncate--4 {
        -webkit-line-clamp: 4;
    }

/* / Utilities */


/* se  scrollbar */
::-webkit-scrollbar, html ::-webkit-scrollbar {
    height: 12px;
    width: 12px
}

body ::-webkit-scrollbar-track, body ::-webkit-scrollbar-thumb, html ::-webkit-scrollbar-track, html ::-webkit-scrollbar-thumb {
    border: 4px solid transparent;
    background-clip: padding-box;
    border-radius: 16px
}

body ::-webkit-scrollbar-track, html ::-webkit-scrollbar-track {
    background-color: #e6e6e6;
    background-color: var(--se-divider, #e6e6e6)
}

body ::-webkit-scrollbar-thumb, html ::-webkit-scrollbar-thumb {
    background-color: #9fa0a4;
    background-color: var(--se-border, #9fa0a4)
}

    body ::-webkit-scrollbar-thumb:hover, html ::-webkit-scrollbar-thumb:hover {
        background-color: #333333;
        background-color: var(--se-border-focus, #333333);
        border: 2px solid transparent
    }