/*
 * 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}/* ===== Design tokens ===== */
:root {
    --ds-primary: #0e5fac;
    --ds-primary-dark: #0a4a87;
    --ds-accent: #e3222a;
    --ds-bg: #f5f7fa;
    --ds-surface: #ffffff;
    --ds-border: #e2e8f0;
    --ds-text: #1e293b;
    --ds-text-muted: #64748b;
    --ds-radius: 12px;
    --ds-shadow: 0 4px 24px rgba(15, 23, 42, 0.08);
    --ds-shadow-lg: 0 10px 40px rgba(15, 23, 42, 0.12);
}

* {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, Arial, sans-serif !important;
}

body {
    background: linear-gradient(160deg, #f5f7fa 0%, #e8eef5 100%) !important;
}

/* ===== Login screen ===== */
.login-ui .logo {
    background-image: url('app/ext/distrisur-branding/images/logo.png') !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 180px;
    height: 100px;
    margin: 0 auto 8px auto;
}

.login-ui .login-dialog {
    border: none !important;
    border-radius: var(--ds-radius) !important;
    box-shadow: var(--ds-shadow-lg) !important;
    padding: 40px 36px !important;
    background: var(--ds-surface) !important;
}

.login-ui .login-dialog::before {
    content: "";
    display: block;
    height: 5px;
    margin: -40px -36px 24px -36px;
    border-radius: var(--ds-radius) var(--ds-radius) 0 0;
    background: linear-gradient(90deg, var(--ds-primary), var(--ds-accent));
}

.login-ui input[type="text"],
.login-ui input[type="password"] {
    border: 1.5px solid var(--ds-border) !important;
    border-radius: 8px !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
    background: #fafbfc !important;
}

.login-ui input[type="text"]:focus,
.login-ui input[type="password"]:focus {
    border-color: var(--ds-primary) !important;
    box-shadow: 0 0 0 3px rgba(14, 95, 172, 0.12) !important;
    outline: none !important;
}

.login-ui button[type="submit"] {
    background: linear-gradient(135deg, var(--ds-primary), var(--ds-primary-dark)) !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px;
    transition: transform 0.12s ease, box-shadow 0.12s ease !important;
    box-shadow: 0 4px 12px rgba(14, 95, 172, 0.25) !important;
}

.login-ui button[type="submit"]:hover {
    background: linear-gradient(135deg, var(--ds-accent), #b81a20) !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(227, 34, 42, 0.3) !important;
}

/* ===== Header / top bar ===== */
.page-header {
    background: var(--ds-surface) !important;
    border-bottom: 1px solid var(--ds-border) !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
}

.page-header .app-name,
.page-header a {
    color: var(--ds-text) !important;
}

/* ===== Connection list / cards ===== */
.connection-list,
.connection-group {
    border-radius: var(--ds-radius) !important;
}

.connection-list .connection,
.connection-list .connection-group {
    border-radius: 8px !important;
    transition: background-color 0.15s ease !important;
}

.connection-list .connection a:hover,
.connection-list .connection-group a:hover {
    background-color: #eaf1fb !important;
}

/* ===== Buttons (general) ===== */
button, .button, input[type="submit"] {
    border-radius: 8px !important;
    transition: all 0.15s ease !important;
}

button.primary, .button.primary {
    background: linear-gradient(135deg, var(--ds-primary), var(--ds-primary-dark)) !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(14, 95, 172, 0.2) !important;
}

button.primary:hover, .button.primary:hover {
    background: linear-gradient(135deg, var(--ds-accent), #b81a20) !important;
}

/* ===== Modals / dialogs ===== */
.guac-modal .modal-content,
guac-modal .modal {
    border-radius: var(--ds-radius) !important;
    box-shadow: var(--ds-shadow-lg) !important;
    border: none !important;
}

/* ===== Client panel (active session bar) ===== */
.client-panel {
    border-radius: var(--ds-radius) 0 0 var(--ds-radius) !important;
    box-shadow: var(--ds-shadow) !important;
}

.client-panel .header {
    background: linear-gradient(135deg, var(--ds-primary), var(--ds-primary-dark)) !important;
    border-radius: var(--ds-radius) 0 0 0 !important;
}

/* ===== Links ===== */
a, a:visited { color: var(--ds-primary); }
a:hover { color: var(--ds-accent); }

/* ===== Scrollbar (Chromium) ===== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.login-ui .logo {
    background-image: url('app/ext/distrisur-branding/images/logo.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 180px !important;
    height: 100px !important;
    min-height: 100px !important;
    margin: 0 auto 12px auto !important;
    display: block !important;
}