/* stylelint-disable selector-max-id */

/** General */

/* Default values for all inherited/auto font setting */
html {
    font-size: 12px;
    font-weight: normal;
    font-style: normal;
}

html,
body {
    width: 100%;
    /* On supported browser keep maximum size independent of url bar and other GUI elements */
    width: 100dvw;
    height: 100%;
    height: 100dvh;
    margin: 0;
    padding: 0;
    /** Disable Text Selection */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

.tchmi-box {
    /* Handle things like border padding etc. in the bounds of an element. */
    box-sizing: border-box;

    /** Disable Text Selection */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

input,
textarea,
.tchmi-box input,
.tchmi-box textarea {
    /** Allow Text Selection for input elements. Some browsers like iOS/Safari forward the user-select: none to input elements which makes them not focusable. */
    -webkit-touch-callout: initial;
    -webkit-user-select: text;
    user-select: text;
}

.tchmi-no-pointer-events {
    /** Passthrough mouse/touch input */
    pointer-events: none;
}

/**
 * Overlay Dialog
 */
#tchmi-overlaysystemdialog-container {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2147483640;
    overflow: auto;
}
#tchmi-overlaysystemdialog-container > #tchmi-overlaysystemdialog-background {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: #333333;
    opacity: 0.75;
}
#tchmi-overlaysystemdialog-container > .tchmi-overlaysystemdialog-message {
    font-family:
        'Segoe UI',
        Tahoma /* <- same as in VS */,
        'Microsoft YaHei' /* <- nicer chinese */,
        'Meiryo' /* <- nicer japanese */,
        sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    background-color: #5a9fe1;
    border-bottom: 1px solid #3a6690;
    color: #000000;
    vertical-align: middle;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 8px;
    padding-right: 60px;
}
#tchmi-overlaysystemdialog-container > .tchmi-overlaysystemdialog-message > a {
    color: #007acc;
    cursor: pointer;
}
#tchmi-overlaysystemdialog-container > .tchmi-overlaysystemdialog-message > a:hover {
    text-decoration: underline;
}

#tchmi-overlaysystemdialog-container.tchmi-overlaysystemdialog-error > .tchmi-overlaysystemdialog-message {
    background-color: #cc0000;
    border-bottom: 1px solid #920000;
    color: #efefef;
    user-select: text;
}
#tchmi-overlaysystemdialog-container.tchmi-overlaysystemdialog-warning > .tchmi-overlaysystemdialog-message {
    background-color: #fefcc8;
    border-bottom: 1px solid #8a896e;
    user-select: text;
}
#tchmi-overlaysystemdialog-container.tchmi-overlaysystemdialog-info > .tchmi-overlaysystemdialog-message {
    user-select: text;
}

#tchmi-overlaysystemdialog-container > #tchmi-overlaysystemdialog-dismissbutton {
    position: absolute;
    right: 5px;
    top: 5px;
}

#tchmi-system-topmostlayer-master {
    z-index: 5000;
    pointer-events: none;
    /* We do not want popup shadows over bottom keyboards */
    overflow: hidden;
    /* will get position:relative as ViewManager part */
}
.tchmi-system-topmostlayer-container {
    position: absolute;
    pointer-events: auto;
    width: 100%;
    height: 100%;
    /* prevent scrolling of the view if the user uses the wheel over the overlay */
    overscroll-behavior: contain;
    transform: translateX(calc(var(--mainViewOffsetLeft) * 1)) translateY(calc(var(--mainViewOffsetTop) * -1));
}
.tchmi-system-topmostlayer-container > .tchmi-in-topmostlayer {
    max-height: 100%;
    max-width: 100%;
    pointer-events: auto; /* default is inherit which is wrong under non modal dialogs */
}
.tchmi-system-topmostlayer-container.tchmi-topmostlayer-non-modal {
    pointer-events: none;
}

.tchmi-system-topmostlayer-container.tchmi-topmostlayer-background-dim {
    background-color: var(--tchmi-popup-dim-color);
}

.tchmi-view-observe-disallowed > #tchmi-system-topmostlayer-master {
    display: none;
}

/**
 * Watermark Dialog
 */
#tchmi-watermarksystemdialog-container {
    position: fixed;
    bottom: 0px;
    left: 0px;
    z-index: 2147483640;
    overflow: auto;
    pointer-events: none;
    padding: 3px;
}

#tchmi-watermarksystemdialog-container > #tchmi-watermarksystemdialog-background {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: #333333;
    opacity: 0.25;
}

#tchmi-watermarksystemdialog-container > .tchmi-watermarksystemdialog-message {
    position: relative;
    font-family:
        'Segoe UI',
        Tahoma /* <- same as in VS */,
        'Microsoft YaHei' /* <- nicer chinese */,
        'Meiryo' /* <- nicer japanese */,
        sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    color: white;
}