:root {
    --bg-dark: #1c1c1e;
    --border-dark: #36373c;
    --header-bg-dark: #000000;
    --text-color-dark: rgba(255, 255, 255, 0.65);
}

body,
.login-ui .login-dialog .login-fields input,
.header .filter input {
    font-family: "Poppins", Helvetica, Arial, sans-serif !important;
}
.login-ui .login-fields .labeled-field .field-header,
.login-ui .login-dialog .login-fields input {
    font-size: 15px !important;
}
.login-ui .login-fields .labeled-field .field-header {
    margin: 0.55em 0.8em;
}

.labeled-field .field-header label {
  display: none;
}
.labeled-field.empty .field-header label {
  display: inline;
}

.header .filter input {
    height: 100%;
}

/* Branding */
.login-ui .login-dialog .logo {
    background-image: url("app/ext/branding/images/bytefloater-logo.png");
}

/* Login UI background */
.login-ui {
    background-color: #666;
}

/* Dialogs */
.login-dialog {
    border-radius: 8px;
    /* default radius when outside .login-ui scope */
}

.login-ui .login-dialog,
.logged-out-modal .notification {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

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

.login-ui .login-fields .labeled-field input {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255,255,255,0.04);
    border-radius: 50vh;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    color: white;
}

.login-ui .login-fields .labeled-field input:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50vh;
    -moz-transition: all 0.1s ease-in;
    -webkit-transition: all 0.1s ease-in;
    -o-transition: all 0.1s ease-in;
    transition: all 0.1s ease-in;
}

.login-ui.error p.login-error {
    background: rgba(212, 56, 56, 0.36);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    border: 1px solid rgba(212, 56, 56, 0.6);
    color: white;
}

/* Decorative middle panel */
.login-dialog-middle,
guac-modal:has(p[translate="APP.INFO_LOGGED_OUT"]) {
    background-image: url("app/ext/branding/images/blobs.svg");
    background-repeat: no-repeat;
    background-size: cover;
}

/* Buttons */
.buttons input.login {
    border-radius: 6px;
}

/* Typography */
h2,
.app-name {
    text-transform: none !important;
}

/* Header */
.header {
    box-shadow: none;
}

.notification {
    color: #fff;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
    .header {
        background-color: var(--header-bg-dark);
        border-bottom: 1px solid var(--border-dark);
    }

    body,
    .menu-contents,
    .menu-contents a {
        background-color: var(--bg-dark) !important;
        color: var(--text-color-dark) !important;
    }

    .list-item .name,
    .caption {
        color: var(--text-color-dark) !important;
    }

    .header:not(.ng-hide)~* .header,
    .header:not(.ng-hide)~.header {
        border-top: 1px solid var(--border-dark);
    }

    .header .filter input,
    .menu-dropdown {
        border-left: 1px solid var(--border-dark);
    }
    
    .menu-dropdown.open .menu-contents {
        border-left: 1px solid var(--border-dark);
        border-bottom: 1px solid var(--border-dark);
    }

    .user-menu .menu-dropdown .menu-contents .profile {
        border-bottom: 1px solid var(--border-dark);
    }

    .recent-connections .connection:hover,
    .list-item:not(.selected) .caption:hover {
        background-color: rgba(255, 255, 255, 0.0625);
    }
}@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-MediumItalic.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-MediumItalic.woff") format("woff");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-BlackItalic.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-BlackItalic.woff") format("woff");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-BoldItalic.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-BoldItalic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-Italic.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-Italic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-SemiBoldItalic.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-SemiBoldItalic.woff") format("woff");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-Bold.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-SemiBold.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-ExtraLightItalic.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-ExtraLightItalic.woff") format("woff");
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-Light.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-Black.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-Black.woff") format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-ThinItalic.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-ThinItalic.woff") format("woff");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-ExtraLight.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-ExtraLight.woff") format("woff");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-Medium.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-Thin.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-Thin.woff") format("woff");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-Regular.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("app/ext/branding/fonts/Poppins-LightItalic.woff2") format("woff2"),
         url("app/ext/branding/fonts/Poppins-LightItalic.woff") format("woff");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}
/*
 * 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;

}