/*
 * CFTS Remote Access theme for Apache Guacamole 1.6.0.
 *
 * Deliberately CSS-only: no external fonts, scripts, trackers, or network
 * dependencies. Security and remote-session behavior remain Guacamole-owned.
 */

:root {
    --cfts-bg: #111312;
    --cfts-surface: #ffffff;
    --cfts-surface-muted: #f5f6f4;
    --cfts-text: #20231f;
    --cfts-muted: #676d66;
    --cfts-line: #d9ded6;
    --cfts-blue: #0077a8;
    --cfts-blue-strong: #005f85;
    --cfts-blue-soft: #e4f5fb;
    --cfts-orange: #c96500;
    --cfts-focus: rgba(0, 119, 168, 0.24);
    --cfts-shadow: rgba(0, 0, 0, 0.28);
    --cfts-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.login-ui,
.login-ui input,
.login-ui button,
.login-ui select,
.login-ui textarea {
    font-family: var(--cfts-font);
}

/* Login shell */
div.login-ui {
    background:
        radial-gradient(circle at 50% 18%, rgba(0, 147, 209, 0.12), transparent 34rem),
        var(--cfts-bg);
}

.login-ui .login-dialog {
    width: min(24rem, calc(100vw - 2rem));
    padding: 1.75rem 2rem 1.4rem;
    border: 1px solid var(--cfts-line);
    border-radius: 0.65rem;
    background: var(--cfts-surface);
    box-shadow: 0 1.25rem 3.5rem var(--cfts-shadow);
    color: var(--cfts-text);
    font-family: var(--cfts-font) !important;
    font-size: 1rem;
    font-weight: 400;
}

.login-ui .login-dialog .logo {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 14.5rem;
    height: 4.6rem;
    margin: 0 auto 0.9rem;
    background-image: url("app/ext/cfts-remote-access-theme/resources/images/cfts-full-light.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.login-ui .login-dialog .version {
    padding: 0 0 1.15rem;
}

.login-ui .login-dialog .version .app-name {
    color: var(--cfts-text);
    font-family: var(--cfts-font) !important;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.035em;
    line-height: 1.3;
    text-transform: uppercase;
    white-space: nowrap;
}

.login-ui .login-dialog .login-fields input {
    box-sizing: border-box;
    border: 1px solid var(--cfts-line);
    border-radius: 0.4rem;
    color: var(--cfts-text);
    font-family: var(--cfts-font) !important;
    font-size: 1rem;
    font-weight: 400;
}

.login-ui .login-dialog .login-fields input:focus,
.login-ui .login-dialog .login-fields .labeled-field input:focus {
    border-color: var(--cfts-blue);
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--cfts-focus);
}

.login-ui .login-dialog input[type="submit"] {
    border: 1px solid var(--cfts-blue);
    border-radius: 0.4rem;
    background: var(--cfts-blue);
    color: #ffffff;
    font-family: var(--cfts-font) !important;
    font-size: 1rem;
    font-weight: 500;
}

.login-ui .login-dialog input[type="submit"]:hover,
.login-ui .login-dialog input[type="submit"]:focus-visible {
    border-color: var(--cfts-blue-strong);
    background: var(--cfts-blue-strong);
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--cfts-focus);
}

.login-ui .login-dialog input[type="submit"]:active {
    border-color: var(--cfts-orange);
}

.login-ui p.login-error {
    border-color: #a33d3d;
    background: #fff2f2;
    color: #812f2f;
}

.login-ui .login-dialog .version {
    color: var(--cfts-muted);
}

.cfts-security-note {
    margin: 1rem 0 0;
    padding-top: 0.8rem;
    border-top: 1px solid var(--cfts-line);
    color: var(--cfts-muted);
    font-size: 0.76rem;
    line-height: 1.45;
    text-align: center;
}

@media (max-width: 30rem) {
    .login-ui .login-dialog {
        padding: 1.5rem 1.25rem 1.15rem;
    }

    .login-ui .login-dialog .logo {
        height: 4.1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}