:root {
    --ct-auth-bg: #060d1c;
    --ct-auth-bg-soft: #0a152b;
    --ct-auth-panel: rgba(10, 19, 36, 0.9);
    --ct-auth-panel-edge: rgba(123, 170, 255, 0.2);
    --ct-auth-line: rgba(126, 170, 247, 0.24);
    --ct-auth-text: #e5eeff;
    --ct-auth-muted: #9db0d8;
    --ct-auth-title: #f5f8ff;
    --ct-auth-blue: #2f82ff;
    --ct-auth-blue-2: #1f63d7;
}

body {
    background:
        radial-gradient(circle at 10% 0%, rgba(47, 130, 255, 0.2), transparent 34%),
        radial-gradient(circle at 86% 16%, rgba(88, 162, 255, 0.14), transparent 32%),
        linear-gradient(160deg, #030815 0%, #070f21 45%, #050b17 100%) !important;
    color: var(--ct-auth-text) !important;
}

.login-shell,
.register-shell {
    border: 1px solid rgba(127, 170, 250, 0.25) !important;
    box-shadow: 0 28px 80px rgba(0, 8, 22, 0.6) !important;
    background: rgba(255, 255, 255, 0.05) !important;
}

.form-column {
    background: var(--ct-auth-panel) !important;
    border-left: 1px solid var(--ct-auth-panel-edge);
    color: var(--ct-auth-text) !important;
    backdrop-filter: blur(12px);
}

.logo-wrap {
    background: rgba(24, 44, 82, 0.65) !important;
    border: 1px solid rgba(130, 175, 255, 0.35) !important;
}

.kicker {
    color: #8bb5ff !important;
}

.title {
    color: var(--ct-auth-title) !important;
}

.subtitle,
.helper-row,
.brand-text,
.brand-foot,
.hint-text,
.error-list {
    color: var(--ct-auth-muted) !important;
}

.brand-chip {
    background: rgba(10, 20, 38, 0.58) !important;
    border-color: rgba(135, 182, 255, 0.35) !important;
    color: #d8e8ff !important;
}

.field label {
    color: #c5d8ff !important;
}

.field input,
.field select {
    border: 1px solid var(--ct-auth-line) !important;
    background: rgba(7, 15, 30, 0.88) !important;
    color: #edf4ff !important;
}

.field input::placeholder {
    color: #8fa8d4 !important;
}

.field input:focus,
.field select:focus {
    border-color: rgba(141, 189, 255, 0.9) !important;
    background: rgba(8, 17, 34, 0.95) !important;
    box-shadow: 0 0 0 3px rgba(47, 130, 255, 0.24) !important;
}

.submit-btn,
.register-btn,
button[type="submit"] {
    background: linear-gradient(135deg, var(--ct-auth-blue), var(--ct-auth-blue-2)) !important;
    box-shadow: 0 12px 26px rgba(36, 102, 224, 0.35) !important;
}

.submit-btn:hover,
.register-btn:hover,
button[type="submit"]:hover {
    box-shadow: 0 15px 30px rgba(36, 102, 224, 0.44) !important;
}

.helper-row a {
    color: #9cc2ff !important;
}

.alert-danger {
    background: rgba(117, 28, 53, 0.35) !important;
    border-color: rgba(255, 125, 152, 0.4) !important;
    color: #ffd5df !important;
}

.alert-success {
    background: rgba(20, 56, 111, 0.35) !important;
    border-color: rgba(115, 171, 255, 0.4) !important;
    color: #d6e8ff !important;
}

@media (max-width: 960px) {
    .form-column {
        border-left: 0;
        border-top: 1px solid var(--ct-auth-panel-edge);
    }
}
