/* === Logo Styling === */
.login-ui .login-dialog .logo {
    background-image: url('app/ext/tempnamespace/images/logo-placeholder.png');
    width: 10em;
    height: 6em;
    -webkit-background-size: contain;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    /*margin-bottom: 1em;*/
/*    margin: 0 auto 1em auto; /* Center horizontally and add spacing below */
 /*   display: block;           /* Ensure it respects margin auto */
    margin-bottom: 1em;
    margin-right: 5em;
    margin-right: 10em;
}

/* === Animated Gradient Background with Stars and Icons === */
div.login-ui {
    background-image:
        url('app/ext/tempnamespace/images/stars.png'),          /* stars pattern */
        url('app/ext/tempnamespace/images/windows.png'),        /* windows icon */
        url('app/ext/tempnamespace/images/linux.png'),          /* linux icon */
        linear-gradient(270deg, #0f2027, #203a43, #2c5364, #1c92d2); /* animated gradient */
    background-size:
        cover,                /* stars */
        80px 80px,            /* windows */
        80px 80px,            /* linux */
        800% 800%;            /* gradient */
    background-position:
        center center,        /* stars */
        20% 30%,              /* windows */
        80% 70%,              /* linux */
        center;
    background-repeat: repeat, no-repeat, no-repeat, repeat;
    animation: background-animate 10s ease infinite; /* Faster transition */
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2em;
    box-sizing: border-box;
    position: relative;
}

/* === Background Animation Keyframes === */
@keyframes background-animate {
    0% {
        background-position: center center, 20% 30%, 80% 70%, 0% 50%;
    }
    50% {
        background-position: center center, 25% 35%, 75% 65%, 100% 50%;
    }
    100% {
        background-position: center center, 20% 30%, 80% 70%, 0% 50%;
    }
}

/* === Login Box Styling === */
.login-ui .login-dialog {
    background-color: #fff;
    width: 30em;
    padding: 2em;
    border-radius: 10px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    z-index: 10;
    /*display: flex;               /* Add these two lines */
    /*flex-direction: column;     /* Stack children vertically */
    align-items: center;        /* Center children horizontally */
}

/* === App Name Styling === */
.login-ui .app-name {
    font-size: 1.2em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    text-align: center;
    margin-bottom: 1em;
    color: #333;
}

/*
 * 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;

}