/*
 * 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}@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url("/app/ext/wanware-theme/resources/inter-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
        U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
        U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
        U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url("/app/ext/wanware-theme/resources/inter-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
        U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
        U+FFFD;
}

:root {
    --wanware-navy: #071858;
    --wanware-navy-2: #12349a;
    --wanware-blue: #1464ff;
    --wanware-cyan: #1bb9e8;
    --wanware-ink: #0b174d;
    --wanware-muted: #687595;
    --wanware-line: rgba(10, 39, 118, 0.13);
    --wanware-surface: rgba(255, 255, 255, 0.92);
    --wanware-shadow: 0 22px 70px rgba(21, 63, 143, 0.13);
}

html {
    min-width: 320px;
}

body {
    color: var(--wanware-ink);
    font-family: "Inter", "Segoe UI", Arial, sans-serif;
}

div.login-ui {
    min-height: 100vh;
    overflow: auto;
    background:
        radial-gradient(circle at 12% 17%, rgba(20, 100, 255, 0.095), transparent 30%),
        radial-gradient(circle at 88% 87%, rgba(27, 185, 232, 0.105), transparent 28%),
        #f8fbff;
}

div.login-ui::before {
    position: fixed;
    z-index: 0;
    inset: 0;
    background-image:
        linear-gradient(rgba(7, 24, 88, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(7, 24, 88, 0.035) 1px, transparent 1px);
    background-size: 42px 42px;
    content: "";
    pointer-events: none;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.72), transparent 88%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.72), transparent 88%);
}

.login-ui .login-dialog-middle {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    padding: 2.5rem 1.25rem;
}

.login-ui .login-dialog {
    box-sizing: border-box;
    width: min(100%, 31rem);
    max-width: 31rem;
    padding: 2.5rem 2.75rem 2.25rem;
    border: 1px solid var(--wanware-line);
    border-radius: 1.5rem;
    background: var(--wanware-surface);
    box-shadow: var(--wanware-shadow);
    color: var(--wanware-ink);
    backdrop-filter: blur(18px);
}

.login-ui .login-dialog .logo {
    width: min(100%, 19rem);
    height: 5.25rem;
    margin: 0 auto 0.65rem;
    background: center / contain no-repeat url("/app/ext/wanware-theme/resources/wanware-logo.png");
}

.login-ui .login-dialog .version {
    padding: 0;
    text-align: center;
}

.login-ui .login-dialog .version .app-name {
    color: var(--wanware-blue);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.2em;
}

.login-ui .login-dialog .version .version-number {
    display: none;
}

.login-ui .login-dialog .wanware-product {
    margin-top: 0.7rem;
    color: var(--wanware-navy);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.login-ui .login-dialog .wanware-tenant {
    margin-top: 0.35rem;
    color: var(--wanware-muted);
    font-size: 0.83rem;
    font-weight: 500;
}

.login-ui .login-dialog .login-fields {
    margin-top: 1.8rem;
}

.login-ui .login-fields .labeled-field {
    display: block;
    position: relative;
    z-index: auto;
    margin-top: 1rem;
}

.login-ui .login-fields .labeled-field:first-child {
    margin-top: 0;
}

.login-ui .login-fields .labeled-field .field-header {
    display: block;
    position: static;
    z-index: auto;
    margin: 0 0 0.45rem;
    overflow: visible;
    color: var(--wanware-ink);
    font-size: 0.78rem;
    font-weight: 700;
    opacity: 1;
}

.login-ui .login-dialog .login-fields input {
    box-sizing: border-box;
    min-height: 3rem;
    margin: 0;
    border: 1px solid rgba(10, 39, 118, 0.24);
    border-radius: 0.65rem;
    background: #fff;
    color: var(--wanware-ink);
    font: inherit;
    box-shadow: 0 7px 20px rgba(21, 63, 143, 0.04);
}

.login-ui .login-fields .labeled-field.empty input,
.login-ui .login-dialog .login-fields input:focus {
    background: #fff;
}

.login-ui .login-dialog .login-fields input:focus {
    border-color: var(--wanware-blue);
    outline: 3px solid rgba(20, 100, 255, 0.16);
}

.login-ui .login-dialog .buttons {
    margin-top: 1.35rem;
}

.login-ui .login-dialog .buttons input[type="submit"] {
    min-height: 3rem;
    border: 1px solid var(--wanware-blue);
    border-radius: 0.65rem;
    background: linear-gradient(105deg, var(--wanware-blue), var(--wanware-cyan));
    color: #fff;
    font-family: inherit;
    font-weight: 700;
    box-shadow: 0 12px 28px rgba(20, 100, 255, 0.2);
}

.login-ui .login-dialog .buttons input[type="submit"]:hover {
    border-color: var(--wanware-navy-2);
    background: linear-gradient(105deg, var(--wanware-navy-2), var(--wanware-blue));
}

.login-ui .login-dialog .buttons input[type="submit"]:focus-visible {
    outline: 3px solid rgba(27, 185, 232, 0.34);
    outline-offset: 2px;
}

.login-ui .login-dialog .wanware-legal {
    margin: 1.45rem 0 0;
    color: var(--wanware-muted);
    font-size: 0.74rem;
    line-height: 1.5;
    text-align: center;
}

.login-ui .login-dialog .wanware-legal a {
    color: var(--wanware-navy-2);
    text-decoration-color: rgba(18, 52, 154, 0.35);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.2em;
}

.login-ui .login-dialog .wanware-legal a:hover {
    color: var(--wanware-blue);
}

.login-ui .login-dialog .wanware-legal a:focus-visible {
    border-radius: 0.2rem;
    outline: 3px solid rgba(27, 185, 232, 0.3);
    outline-offset: 3px;
}

.login-ui.continuation .login-dialog {
    max-width: 36rem;
    border: 1px solid var(--wanware-line);
    box-shadow: var(--wanware-shadow);
}

.header {
    border-bottom-color: rgba(10, 39, 118, 0.15);
    background: var(--wanware-navy);
    color: #fff;
}

@media (max-width: 36rem) {
    .login-ui .login-dialog-middle {
        padding: 1rem 0.75rem;
    }

    .login-ui .login-dialog {
        width: 100%;
        padding: 1.85rem 1.35rem 1.5rem;
        border-radius: 1.15rem;
    }

    .login-ui .login-dialog .logo {
        width: min(100%, 16rem);
        height: 4.35rem;
    }

    .login-ui .login-dialog .login-fields {
        margin-top: 1.4rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}
