/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

/* Label/tag denoting the user that shared a connection */
.jdbc-share-tag {

    background: #0095ff;
    padding: 0.25em;

    -moz-border-radius:    0.25em;
    -webkit-border-radius: 0.25em;
    -khtml-border-radius:  0.25em;
    border-radius:         0.25em;

    color: white;
    font-size: 0.75em;
    font-weight: bold;

}
.totp-enroll p,.totp-details{font-size:.8em}.totp-qr-code{text-align:center}.totp-qr-code img{margin:1em;border:1px solid rgba(0,0,0,0.25);box-shadow:1px 1px 2px rgba(0,0,0,0.25);cursor:pointer}h3.totp-details-header{font-size:.8em}h3.totp-details-header::before{content:'▸ '}.totp-details-visible h3.totp-details-header::before{content:'▾ '}.totp-details,.totp-hide-details{display:none}.totp-details-visible .totp-details{display:table}.totp-details-visible .totp-hide-details{display:inline}.totp-details-visible .totp-show-details{display:none}.totp-hide-details,.totp-show-details{color:blue;text-decoration:underline;cursor:pointer;margin:0 .25em;font-weight:normal}.totp-details{margin:0 auto}.totp-details th{padding-right:.25em;text-align:left}.totp-details td{font-family:monospace}.totp-detail{display:inline-block;margin:0 .25em}/* Laa On-Demand: freundliche Startanzeige NUR fuer "entfernter Computer nicht erreichbar/verfuegbar" (Code 207/208).
   Normalfall ist der Halte-Proxy auf dagobert (nur "Verbinden..."); dieser Dialog ist der Rueckfall. */
.client-status-modal .notification.error:has(p.text[translate="CLIENT.ERROR_CLIENT_207"]),
.client-status-modal .notification.error:has(p.text[translate="CLIENT.ERROR_CLIENT_208"]) {
    background: rgba(18, 48, 88, .9);
    padding: 1.5em 1em;
}
.client-status-modal .notification.error:has(p.text[translate="CLIENT.ERROR_CLIENT_207"]) .body::before,
.client-status-modal .notification.error:has(p.text[translate="CLIENT.ERROR_CLIENT_208"]) .body::before {
    content: "";
    display: block;
    width: 2.6em;
    height: 2.6em;
    margin: .25em auto 1em;
    border: .3em solid rgba(255, 255, 255, .25);
    border-top-color: #fff;
    border-radius: 50%;
    animation: laa-ondemand-spin 1s linear infinite;
}
.client-status-modal p.text[translate="CLIENT.ERROR_CLIENT_207"],
.client-status-modal p.text[translate="CLIENT.ERROR_CLIENT_208"] {
    max-width: 38em;
    margin: 0 auto .5em;
    line-height: 1.45;
    opacity: .92;
}
.client-status-modal p.text[translate="CLIENT.ERROR_CLIENT_207"]::before,
.client-status-modal p.text[translate="CLIENT.ERROR_CLIENT_208"]::before {
    content: "Arbeitsplatz wird gestartet";
    display: block;
    font-size: 1.4em;
    font-weight: 600;
    margin-bottom: .45em;
    opacity: 1;
}
.client-status-modal .notification.error:has(p.text[translate="CLIENT.ERROR_CLIENT_207"]) .countdown-text,
.client-status-modal .notification.error:has(p.text[translate="CLIENT.ERROR_CLIENT_208"]) .countdown-text {
    opacity: .8;
    font-size: .95em;
}
@media (prefers-reduced-motion: reduce) {
    .client-status-modal .notification.error .body::before { animation: none; }
}
@keyframes laa-ondemand-spin { to { transform: rotate(360deg); } }

/* Warten auf den Arbeitsplatz (Halte-Proxy auf dagobert haelt die Verbindung, bis die VM bereit ist).
   0-3 s normales "Verbinden..." mit Lade-Kreis; danach blaues Band "Arbeitsplatz wird gestartet".
   Laufende VMs sind vorher verbunden (Zustand CONNECTED beim ersten sync), sehen das Band also nicht. */
.client-status-modal .notification.connecting:has(p.text[translate="CLIENT.TEXT_CLIENT_STATUS_WAITING"]),
.client-status-modal .notification.connecting:has(p.text[translate="CLIENT.TEXT_CLIENT_STATUS_CONNECTING"]) {
    animation: laa-ondemand-band .5s ease 3s forwards;
}
.client-status-modal .notification.connecting:has(p.text[translate="CLIENT.TEXT_CLIENT_STATUS_WAITING"]) .body::before,
.client-status-modal .notification.connecting:has(p.text[translate="CLIENT.TEXT_CLIENT_STATUS_CONNECTING"]) .body::before {
    content: "";
    display: block;
    width: 2.6rem;
    height: 2.6rem;
    margin: .25rem auto 1rem;
    border: .3rem solid rgba(255, 255, 255, .25);
    border-top-color: #fff;
    border-radius: 50%;
    animation: laa-ondemand-spin 1s linear infinite;
}
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_WAITING"],
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_CONNECTING"] {
    animation: laa-ondemand-hide 0s linear 3s forwards;
}
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_WAITING"]::before,
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_CONNECTING"]::before,
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_WAITING"]::after,
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_CONNECTING"]::after {
    display: block;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    animation: laa-ondemand-show .5s ease 3s forwards;
}
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_WAITING"]::before,
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_CONNECTING"]::before {
    content: "Arbeitsplatz wird gestartet";
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.3;
}
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_WAITING"]::after,
.client-status-modal p.text[translate="CLIENT.TEXT_CLIENT_STATUS_CONNECTING"]::after {
    content: "Falls Ihr Arbeitsplatz ausgeschaltet war, wird er jetzt hochgefahren. Das kann bis zu 2\0000a0Minuten dauern \2013  bitte warten, die Verbindung wird automatisch hergestellt.";
    font-size: 1rem;
    line-height: 1.45;
    max-width: 38rem;
    margin: 0 auto;
}
@keyframes laa-ondemand-band { to { background: rgba(18, 48, 88, .9); padding: 1.5rem 1rem; } }
@keyframes laa-ondemand-hide { to { font-size: 0; } }
@keyframes laa-ondemand-show { to { max-height: 12rem; opacity: 1; margin-top: .45rem; } }
@media (prefers-reduced-motion: reduce) {
    .client-status-modal .notification.connecting .body::before { animation: none; }
}
/* Branding Apotheke Laa (Farben/Logo von apotheke-laa.at: Rot #db3a2e, Weiss, Schwarz; Serifen-Schriftzug) */
:root { --laa-rot: #db3a2e; --laa-rot-dunkel: #b82f25; --laa-text: #1e1e1e; --laa-hell: #f5f5f5; }

/* Anmeldeseite */
.login-ui { background: #fff; }
.login-ui .login-dialog { max-width: 3.4in; border: 1px solid #ececec; border-radius: 18px; box-shadow: 0 10px 30px rgba(0,0,0,.06); padding: 1.4em 1.4em 1.2em; }
.login-ui .login-dialog .logo {
    width: 3.4em; height: 3.4em; margin: .2em auto .4em;
    background-image: url('app/ext/laa-ondemand-texts/images/apotheke-laa-logo.svg');
    background-size: contain; background-repeat: no-repeat; background-position: center;
}
.login-ui .login-dialog .version .app-name {
    text-transform: none; font-weight: 400; font-size: 1.7em; letter-spacing: -.01em;
    font-family: "Tobias", Georgia, "Times New Roman", serif; color: var(--laa-text);
}
.login-ui .login-dialog .version .app-name::after {
    content: "Arbeitsplätze"; display: block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: .45em; letter-spacing: .02em; color: #6b6b6b; margin-top: .15em;
}
.login-ui .login-dialog .version .version-number { display: none; }
.login-ui .login-dialog .login-fields input { border-radius: 10px; border-color: #d9d9d9; }
.login-ui .login-dialog .login-fields input:focus { outline: 2px solid rgba(219,58,46,.35); border-color: var(--laa-rot); }
.login-ui .login-dialog .buttons input[type=submit] {
    background: var(--laa-rot); border: 0; border-radius: 999px; color: #fff; font-weight: 600; padding: .6em 1em; text-shadow: none; box-shadow: none;
}
.login-ui .login-dialog .buttons input[type=submit]:hover { background: var(--laa-rot-dunkel); }

/* Startseite: Hinweis-Kasten */
.laa-hinweis {
    margin: 1em 1em .5em; padding: .9em 1.1em; border-radius: 14px;
    background: #fff5f4; border: 1px solid #f3c9c5; border-left: 5px solid var(--laa-rot); color: var(--laa-text);
    line-height: 1.45; font-size: .95em;
}
.laa-hinweis__titel { font-family: "Tobias", Georgia, "Times New Roman", serif; font-size: 1.25em; margin-bottom: .35em; }
.laa-hinweis__liste { margin: 0; padding-left: 1.2em; }
.laa-hinweis__liste li { margin: .25em 0; }
@media (max-width: 600px) { .laa-hinweis { margin: .6em; font-size: .9em; } }