div.login-ui {
    --canvas: #f2f6fb; --paper: #ffffff; --ink: #17324d;
    --muted: #4c6178; --line: #728ba3; --action: #1554a1;
    display: flex; flex-direction: column; justify-content: center;
    box-sizing: border-box; min-height: 100vh; min-height: 100svh;
    height: auto; padding: 116px 28px 88px; background: var(--canvas);
    color: var(--ink); font-family: "Noto Sans TC", "Microsoft JhengHei", sans-serif;
    color-scheme: light; scrollbar-color: var(--line) var(--canvas);
}
.login-ui ::selection { background: #cbdff7; color: #102d50; }
.login-ui .calbee-topbar {
    position: absolute; top: 0; left: 0; right: 0; height: 76px;
    display: flex; align-items: center; gap: 20px; padding: 0 48px;
    box-sizing: border-box; border-bottom: 1px solid #dae4ef;
    background: #e8f0fa; color: #17324d;
}
.login-ui .calbee-wordmark { font-size: 25px; font-weight: 750; letter-spacing: -.025em; }
.login-ui .calbee-topbar span { padding-left: 20px; border-left: 1px solid #a8bed6; font-size: 14px; }
.login-ui .calbee-footer { position: absolute; bottom: 30px; left: 28px; right: 28px; text-align: center; font-size: 13px; color: var(--muted); }
.login-ui .login-dialog-middle { display: block; width: 100%; text-align: center; }
.login-ui .login-dialog {
    box-sizing: border-box; width: 100%; max-width: 400px; margin: 0 auto;
    padding: 0; border: 0; border-radius: 0; box-shadow: none;
    text-align: left; background: transparent; color: var(--ink); font-size: 16px;
}
.login-ui .login-dialog .logo { display: none; }
.login-ui .calbee-intro { margin-bottom: 34px; }
.login-ui .calbee-intro h1 { font-size: 28px; line-height: 1.4; font-weight: 650; letter-spacing: -.02em; margin: 0 0 12px; text-align: left; color: var(--ink); }
.login-ui .calbee-intro p { margin: 0; font-size: 15px; line-height: 1.7; color: var(--muted); }
.login-ui .login-fields { margin: 0; }
.login-ui .login-fields .form-field { margin: 0 0 24px; }
.login-ui .login-fields .labeled-field .field-header { position: static; z-index: auto; margin: 0 0 9px; opacity: 1; color: var(--ink); font-size: 14px; font-weight: 600; }
.login-ui .login-dialog .login-fields .labeled-field input[type=text],
.login-ui .login-dialog .login-fields .labeled-field input[type=password] {
    box-sizing: border-box; min-height: 50px; width: 100%; margin: 0;
    padding: 12px 14px; background: var(--paper); color: var(--ink);
    border: 1px solid var(--line); border-radius: 7px; font-size: 16px;
    font-family: inherit; caret-color: var(--action);
}
.login-ui .login-dialog input:focus-visible { outline: 3px solid #1f64b4; outline-offset: 3px; }
.login-ui .buttons { margin: 4px 0 0; }
.login-ui .buttons input {
    width: 100%; min-height: 50px; margin: 0; padding: 12px 16px;
    border: 0; border-radius: 7px; background: var(--action); color: white;
    font: 600 16px/1.5 "Noto Sans TC", "Microsoft JhengHei", sans-serif;
    text-shadow: none; box-shadow: none; cursor: pointer; transition: background-color 150ms ease-out;
}
.login-ui .buttons input:hover { background: #104580; }
.login-ui .buttons input:active { background: #0b3666; }
.login-ui .buttons input:disabled { background: #526c8d; color: #fff; cursor: wait; }
.login-ui.error p.login-error {
    box-sizing: border-box; position: static; width: 100%; max-width: 400px;
    margin: 0 auto 28px; padding: 13px 16px; border: 1px solid #c67979;
    border-radius: 7px; background: #fff0f0; color: #8b252c;
    font-size: 14px; line-height: 1.6; text-align: left;
}
@media (max-width: 540px) {
    div.login-ui { padding: 112px 28px 76px; }
    .login-ui .calbee-topbar { height: 72px; padding: 0 28px; gap: 16px; }
    .login-ui .calbee-topbar span { padding-left: 16px; }
    .login-ui .calbee-intro h1 { font-size: 26px; }
}
@media (max-height: 620px) {
    div.login-ui { justify-content: flex-start; }
    .login-ui .calbee-footer { position: static; margin-top: 40px; }
}
@media (prefers-reduced-motion: reduce) { .login-ui .buttons input { transition: none; } }
/*
 * 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;

}