﻿:root {
    --mdc-theme-primary: #546e7a;
    --mdc-theme-secondary: #bcaaa4;
    --mdc-theme-background: #E1E2E1;
    --mdc-theme-surface: #fff;
    --mdc-theme-error: #b00020;
    --mdc-theme-on-primary: #fff;
    --mdc-theme-on-secondary: #000;
    --mdc-theme-on-surface: #000;
    --mdc-theme-on-error: #fff;
    --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87);
    --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54);
    --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87);
    --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54);
    --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38);
    --mdc-theme-text-primary-on-dark: white;
    --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7);
    --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5);
    --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
    --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5);
    --mdc-switch-selected-track-color: #c3cfd5;
    --mdc-switch-selected-focus-track-color: #c3cfd5;
    --mdc-switch-selected-hover-track-color: #c3cfd5;
    --mdc-switch-selected-focus-handle-color: #546e7a;
    --mdc-switch-selected-hover-handle-color: #546e7a;

    --md-sys-color-primary: #546e7a;
    --md-sys-color-primary-container: #6FF7F6;
    --md-sys-color-on-primary: #FFFFFF;
    --md-sys-color-on-primary-container: #002020;
    --md-sys-color-secondary: #bcaaa4;
    --md-sys-color-secondary-container: #CCE8E7;
    --md-sys-color-on-secondary: #FFFFFF;
    --md-sys-color-on-secondary-container: #051F1F;
    --md-sys-color-tertiary: #4B607C;
    --md-sys-color-tertiary-container: #D3E4FF;
    --md-sys-color-on-tertiary: #FFFFFF;
    --md-sys-color-on-tertiary-container: #041C35;
    --md-sys-color-error: #BA1A1A;
    --md-sys-color-error-container: #FFDAD6;
    --md-sys-color-on-error: #FFFFFF;
    --md-sys-color-on-error-container: #410002;
    --md-sys-color-outline: #6F7979;
    --md-sys-color-background: #FAFDFC;
    --md-sys-color-on-background: #191C1C;
    --md-sys-color-surface: #FAFDFC;
    --md-sys-color-on-surface: #191C1C;
    --md-sys-color-surface-variant: #DAE5E4;
    --md-sys-color-on-surface-variant: #3F4948;
    --md-sys-color-inverse-surface: #2D3131;
    --md-sys-color-inverse-on-surface: #EFF1F0;
    --md-sys-color-inverse-primary: #4CDADA;
    --md-sys-color-shadow: #000000;
    --md-sys-color-surface-tint: #006A6A;
    --md-sys-color-outline-variant: #BEC9C8;
    --md-sys-color-scrim: #000000;
}

html, body, app {
    height: 100%;
    margin: 0px;
    font-family: Roboto, sans-serif;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

app {
    display: flex;
    flex-direction: column;
}

.content {
    flex: 1 0 auto;
}

.footer {
    flex-shrink: 0;
    height: 61px;
    padding-left: 22px;
    padding-top: 25px;
}

*:focus {
    outline: none !important;
}

.slip-reordering {
    box-shadow: 0 2px 10px rgba(0,0,0,0.45);
}

li {
    user-select: none;
}

.slip-swiping-container {
    overflow-x: hidden;
}

.top-header-list {
    z-index: 1;
    width: 100%;
}

.bottom-header-list {
    display: none;
    z-index: 0;
    width: 100%;
}

.top-list {
    z-index: 1;
    width: 100%;
}

    .top-list > li {
        background-color: white;
    }

.bottom-list {
    display: none;
    z-index: 0;
    width: 100%;
}

    .bottom-list > li {
        background-color: var(--mdc-theme-error, #B00020);
    }

.remove-graphic > i {
    color: white;
}

ul.mdc-list {
    padding: 0px;
}

.mdc-list-item.checked {
    background-color: hsl(0, 0%, 88%);
    color: hsl(0, 0%, 62%);
}

.mdc-list-item__graphic.mdc-list-item__graphic__right-aligned {
    margin-right: 0;
    margin-left: 32px;
}

a:not([href]):not([tabindex]).mdc-list-item__meta {
    color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38))
}

header {
    z-index: 999;
}

aside.mdc-drawer {
    z-index: 1000;
}

.action-button {
    z-index: 10;
}

.notification {
    z-index: 9999;
}

.h-fill {
    width: 100%;
}

/* Settings */
a:not([href]):not([tabindex]).mdc-list-item__meta.connected {
    color: var(--mdc-theme-secondary, #388e3c);
}

a:not([href]):not([tabindex]).mdc-list-item__meta.disconnected {
    color: var(--mdc-theme-error, #B00020);
}

.mdc-fab--bottom-right {
    bottom: 15px;
    right: 15px;
    position: fixed;
    margin: 0px 0px 0px 0px;
}

.loader {
    padding: 20px;
}

.mdc-dialog div.mdc-dialog__surface {
    min-width: unset;
    max-width: -webkit-fill-available;
    width: 500px;
}

:not(.mdc-list--non-interactive) > :not(.mdc-list-item--disabled).mdc-list-item:hover::before {
    opacity: 0;
}

.mdc-text-field {
    width: 100%;
}

.input-spacer {
    height: 25px;
}

.mdc-dialog--open {
    z-index: 100;
}

.mdc-list-item__control {
    position: absolute;
    right: 20px;
}

.mdc-select {
    width: 100%;
}

.twolinecontent.mdc-list-item__text {
    margin-bottom: 16px;
}

@media (max-width: 592px) {
    .mdc-dialog .mdc-dialog__container {
        max-width: calc(100vw - 32px);
    }
}

.mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label {
    color: var( --mdc-theme-primary, #fff);
}

.mdc-select:not(.mdc-select--disabled).mdc-select--focused .mdc-floating-label {
    color: var( --mdc-theme-primary, #fff);
}

.mdc-drawer .mdc-deprecated-list-item--activated {
    color: var( --mdc-theme-primary, #fff);
}

.mdc-drawer .mdc-deprecated-list-item--activated .mdc-deprecated-list-item__graphic {
    color: var( --mdc-theme-primary, #fff);
}

.mdc-dialog__surface {
    overflow: inherit !important;
}

.mdc-dialog__content {
    overflow: inherit !important;
}

.mdc-switch {
    float: right;
}