@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap');

/* Fenestro Branding Colors - Overhaul */
:root {
    --primary-background: #1A1B26;     /* Neutral dark blue/grey */
    --secondary-background: #101014;   /* Deeper grey for gradient */
    --primary-text: #E0E0EB;           /* Even brighter off-white for high contrast */
    --secondary-text: #A9B1D6;         /* Softer text for secondary info */
    --accent-color: #7AA2F7;           /* Vibrant, modern blue */
    --accent-glow: rgba(122, 162, 247, 0.5); /* Glow color for text-shadow */
    --ui-elements: #24283B;            /* Darker blue for inputs/buttons */
    --danger-color: #F7768E;           /* Softer, theme-appropriate red */
}

/* General Style */
body {
    font-family: 'Inter', sans-serif;
    color: var(--primary-text);
    background: linear-gradient(170deg, var(--primary-background) 0%, var(--secondary-background) 100%);
    background-attachment: fixed;
}
.menu { /* Apply font and color to menu explicitly */
    font-family: 'Inter', sans-serif;
    color: var(--primary-text);
}
pre {
    color: var(--primary-text);
    background-color: var(--ui-elements);
    border: 1px solid var(--accent-color);
}

a, a[href] {
    color: var(--accent-color);
}
a:visited {
    color: var(--secondary-text) !important; /* Dim visited links, with !important */
}
a:hover {
    filter: brightness(1.2);
}

/* Buttons */
button, input[type="submit"] {
    border-radius: 5px !important; /* Rounder buttons */
    border: 1px solid var(--accent-color);
    background: var(--accent-color);
    color: var(--primary-background);
    font-weight: 700;
    text-shadow: none !important; /* Explicitly remove text shadow */
}
button:hover, input[type="submit"]:hover {
    filter: brightness(1.2);
}


div.location,
input[type=text],
input[type=email],
input[type=number],
input[type=password],
textarea,
.clipboard,
.clipboard-service-target {
    background-color: var(--ui-elements);
    color: var(--primary-text);
    border: 1px solid var(--secondary-text);
    border-radius: 5px; /* Rounder inputs */
}

input[type=text]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
textarea:focus {
    border-color: var(--accent-color);
    outline: none;
    box-shadow: 0 0 8px var(--accent-glow);
}

/* Icons */
.icon, .nav-icon, .status-icon,
div.home-connection .icon.type, /* Specific to connection list icons */
.list-item .fa,
.list-item i {
    color: var(--primary-text) !important; /* Ensure icons are bright */
    text-shadow: 0 0 6px var(--accent-glow); /* Glow effect */
}


/* Login Screen Overhaul */
div.login-ui {
    color: var(--primary-text);
}

body > div.login-ui { /* Increased specificity for login background */
    background: var(--primary-background) !important; /* Override default white background */
}

div.login-ui .login-dialog {
    background: var(--primary-background); /* Solid color for login box */
    color: var(--primary-text); /* Ensure overall text is bright */
    border-radius: 5px; /* Rounded dialog */
}


/* Override default white background for inputs */
.login-ui .login-dialog .login-fields input {
    background-color: var(--ui-elements) !important;
    color: var(--primary-text) !important;
    border-color: var(--secondary-text) !important;
}

.login-ui .login-fields .labeled-field input:focus {
    background-color: var(--ui-elements) !important; /* Keep consistent on focus */
    border-color: var(--accent-color) !important;
}

.login-ui .login-dialog .logo {
    background-image: url('app/ext/custom-namespace/images/logo.png'); /* FIXED PATH */
    width: 7em;
    height:	7em;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-bottom: 1em;
}

.login-ui .login-dialog .version .app-name {
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-transform: none;
    font-size: 2.5em;
    color: var(--primary-text);
}

/* Subtitle Styling */
.login-ui .login-dialog .version .version-number { /* Targeted from login.html */
    font-family: 'Inter', sans-serif;
    font-size: 0.9em;
    font-weight: 300;
    color: var(--secondary-text);
    margin-top: 0.5em;
}

/* Footer text styling */
.login-footer-text {
    text-align: center;
    color: var(--secondary-text);
    font-size: 0.8em;
    margin-top: 2em;
}


/* Home & Lists */
a.home-connection, /* Default state for connection items */
.list-item { /* Default state for generic list items */
    color: var(--primary-text) !important; /* Ensure text is bright in default state */
}

div.recent-connections div.connection:hover,
div.recent-connections div.connection.active,
a.home-connection.active { /* Ensure active connections also get palette color */
    background-color: var(--accent-color) !important; /* Force accent color for recent connections */
}

/* More specific rules for text contrast on hover/active */
div.all-connections a.home-connection:hover .icon,
div.all-connections a.home-connection:hover .name,
div.all-connections a.home-connection:hover .activeUserCount,
div.all-connections a.home-connection.active .icon,
div.all-connections a.home-connection.active .name,
div.all-connections a.home-connection.active .activeUserCount,
.list-item:not(.selected):hover .name,
.list-item:not(.selected):hover .comment,
.list-item:not(.selected):hover .icon,
.list-item.selected .name,
.list-item.selected .comment,
.list-item.selected .icon {
    color: var(--primary-background) !important; /* Text color changes to dark on hover/active for contrast */
    text-shadow: none !important; /* Turn off glow on hover/active for better readability */
}

a.home-connection:hover,
.list-item:not(.selected):hover,
#filesystem-menu .header.breadcrumbs .breadcrumb:hover,
#guac-menu #zoom-out:hover,
#guac-menu #zoom-in:hover {
    background-color: var(--accent-color) !important; /* Ensure accent color on hover */
    color: var(--primary-background) !important; /* Text color inverts on hover */
}


.list-item.selected {
    background: var(--accent-color) !important; /* Ensure accent color on selected */
    color: var(--primary-background) !important;
}


.list-item .name {
    color: var(--primary-text) !important; /* Explicitly set name color */
    font-size: 1.1em;
    font-weight: 500;
}

.list-item .comment {
    color: var(--secondary-text);
}


/* Menus */
.menu-dropdown .menu-contents {
    background-color: var(--ui-elements);
}
.menu-dropdown .menu-contents li a {
    color: var(--primary-text);
}
.menu-dropdown .menu-contents li a:hover {
    background-color: var(--accent-color);
    color: var(--primary-background); /* Text color changes to dark on hover for contrast */
}

.notification {
    color: var(--primary-text);
    background-color: var(--ui-elements);
}


/* Settings Tabs Overhaul */
.page-tabs .page-list li a[href] {
    color: var(--primary-text);
    background-color: var(--ui-elements);
    border: 1px solid var(--secondary-background); /* Subtle border */
    border-bottom: none; /* Make it look like a tab */
    padding: 0.8em 1.2em;
    border-radius: 5px 5px 0 0;
}
.page-tabs .page-list li a[href]:visited {
    color: var(--secondary-text) !important; /* Dim visited but not active tabs, with !important */
}
.page-tabs .page-list li a[href]:hover {
    background-color: var(--accent-color);
    color: var(--primary-background);
    text-shadow: none;
}
/* Active / Selected Tab */
.page-tabs .page-list li.active a[href], /* Common active class */
.page-tabs .page-list li.selected a[href] {
    background-color: var(--accent-color) !important;
    color: var(--primary-background) !important;
    font-weight: 700;
    border-color: var(--accent-color);
}
.page-tabs .page-list li.active a[href]:hover,
.page-tabs .page-list li.selected a[href]:hover,
.page-tabs .page-list li.active a[href]:visited,
.page-tabs .page-list li.selected a[href]:visited {
    background-color: var(--accent-color) !important; /* Keep active color on hover/visited */
    color: var(--primary-background) !important;
}

.settings table.session-list tr.session:hover {
    background-color: var(--accent-color) !important;
    color: var(--primary-background) !important; /* Text color changes to dark on hover for contrast */
}

.location-chooser .dropdown {
    background-color: var(--ui-elements);
}

.settings.connectionHistory a.history-session-recording {
    color: var(--accent-color);
}
.settings.connectionHistory a.history-session-recording:after {
    opacity: .0;
}

.user a,
.user-group a,
.connection a,
.connection-group a {
    color: var(--primary-text);
}

.user a:hover,
.user-group a:hover,
.connection a:hover,
.connection-group a:hover {
    color: var(--accent-color);
}

.manage-user .notice.read-only {
    color: var(--primary-text);
    background-color: var(--ui-elements);
}

/* Global error and danger styles */
.notification.error,
.client-status-modal .notification.error,
.login-ui.error p.login-error {
    color: #FFFFFF; /* White text on error background for maximum contrast */
    background-color: var(--danger-color);
    border: 1px solid var(--danger-color);
}

button.danger,
.menu-dropdown .menu-contents li a.danger {
    color: #FFFFFF;
    font-weight: 700;
    background-color: var(--danger-color);
}
/*
 * 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;

}