/* UniTYX Dark Theme for Guacamole */

/* ===== Global Dark Background ===== */
body {
    background: #0a0f14 !important;
    color: #e0e0e0 !important;
}

/* ===== Login Page ===== */
.login-ui {
    background: #0a0f14 !important;
}

.login-ui .login-dialog {
    background: #1a1f2e !important;
    border: 1px solid #2a2f3e !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

/* Logo */
.login-ui .logo {
    background-image: url("images/unityx-logo.png") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 180px !important;
    height: 100px !important;
    margin: 0 auto 0.5em !important;
}

/* Hide default Guacamole logo text */
.login-ui .logo::after,
.login-ui .logo::before {
    display: none !important;
}

/* App name */
.login-ui .version .app-name {
    font-size: 1.3em !important;
    font-weight: 600 !important;
    background: linear-gradient(135deg, #00d4aa, #e91e8c) !important;
    -webkit-background-clip: text !important;
    font-size: 0 !important;
}

.login-ui .version .app-name::after {
    content: "UnitYX Remote Gateway" !important;
    font-size: 1.3rem !important;
    font-weight: 600 !important;
    background: linear-gradient(135deg, #00d4aa, #e91e8c) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    font-size: 0 !important;
}

.login-ui .version .app-name::after {
    content: "UnitYX Remote Gateway" !important;
    font-size: 1.3rem !important;
    font-weight: 600 !important;
    background: linear-gradient(135deg, #00d4aa, #e91e8c) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.login-ui .version .version-number {
    color: #555 !important;
}

/* Login fields */
.login-ui .login-fields label {
    color: #aaa !important;
}

.login-ui input[type="text"],
.login-ui input[type="password"] {
    background: #0d1117 !important;
    border: 1px solid #2a2f3e !important;
    color: #e0e0e0 !important;
    border-radius: 6px !important;
    padding: 10px !important;
}

.login-ui input[type="text"]:focus,
.login-ui input[type="password"]:focus {
    border-color: #00d4aa !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(0, 212, 170, 0.2) !important;
}

/* Login button */
.login-ui input[type="submit"],
.login-ui button[type="submit"],
.login-ui .login-form .buttons button {
    background: linear-gradient(135deg, #00d4aa, #e91e8c) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 6px !important;
    padding: 10px 20px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

/* Login error */
.login-ui .login-error {
    color: #e91e8c !important;
}

/* ===== Main App (after login) ===== */
.header {
    background: #0d1117 !important;
    border-bottom: 1px solid #2a2f3e !important;
}

.header .title {
    color: #00d4aa !important;
}

/* Navigation */
.user-menu,
.menu-dropdown {
    background: #1a1f2e !important;
    border: 1px solid #2a2f3e !important;
}

.user-menu a,
.menu-dropdown a {
    color: #e0e0e0 !important;
}

.user-menu a:hover,
.menu-dropdown a:hover {
    background: #2a2f3e !important;
    color: #00d4aa !important;
}

/* ===== Home / Connection List ===== */
#content {
    background: #0a0f14 !important;
}

.home .recent-connections,
.home .all-connections {
    background: #0a0f14 !important;
}

.connection-group,
.connection {
    background: #1a1f2e !important;
    border: 1px solid #2a2f3e !important;
    border-radius: 8px !important;
    margin: 4px !important;
}

.connection:hover,
.connection-group:hover {
    border-color: #00d4aa !important;
    background: #1e2535 !important;
}

.connection .name,
.connection-group .name {
    color: #e0e0e0 !important;
}

/* ===== Settings / Admin Pages ===== */
.settings,
.manage {
    background: #0a0f14 !important;
}

.tabbed .tab-content {
    background: #0a0f14 !important;
}

.tabbed .tabs .tab {
    background: #1a1f2e !important;
    color: #e0e0e0 !important;
    border: 1px solid #2a2f3e !important;
}

.tabbed .tabs .tab.selected,
.tabbed .tabs .tab:hover {
    background: #0d1117 !important;
    color: #00d4aa !important;
    border-color: #00d4aa !important;
}

/* Tables */
table {
    background: #1a1f2e !important;
}

table th {
    background: #0d1117 !important;
    color: #00d4aa !important;
    border-bottom: 2px solid #2a2f3e !important;
}

table td {
    color: #e0e0e0 !important;
    border-bottom: 1px solid #1a1f2e !important;
}

table tr:hover td {
    background: #1e2535 !important;
}

/* Forms */
input, select, textarea {
    background: #0d1117 !important;
    border: 1px solid #2a2f3e !important;
    color: #e0e0e0 !important;
    border-radius: 4px !important;
}

/* Buttons */
button, .button, a.button {
    background: #1a1f2e !important;
    color: #e0e0e0 !important;
    border: 1px solid #2a2f3e !important;
    border-radius: 4px !important;
}

button:hover, .button:hover, a.button:hover {
    border-color: #00d4aa !important;
    color: #00d4aa !important;
}

/* ===== Modals ===== */
.modal-content,
.notification,
.dialog {
    background: #1a1f2e !important;
    border: 1px solid #2a2f3e !important;
    color: #e0e0e0 !important;
}

/* ===== Scrollbars ===== */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #0a0f14; }
::-webkit-scrollbar-thumb { background: #2a2f3e; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #00d4aa; }

/* ===== Links ===== */
a { color: #00d4aa !important; }
a:hover { color: #e91e8c !important; }
