:root {
    --hc-bg: #041935;
    --hc-subnav: #112A48;
    --hc-card: #152F4F;
    --hc-hover: #1B3C66;
    --hc-accent: #00CCA8;
    --hc-gold: #EBC501;
    --hc-text: #ffffff;
    --hc-muted: rgba(255, 255, 255, .72);
    --hc-line: rgba(255, 255, 255, .10);
    --hc-radius: 18px;
}

html,
body {
    background: var(--hc-bg) !important;
    color: var(--hc-text) !important;
    min-height: 100%;
}

a {
    color: var(--hc-gold);
}

a:hover {
    color: var(--hc-accent);
}

/* Topbar / Navbar */
.hc-guest .hc-topbar {
    background: linear-gradient(180deg, rgba(17, 42, 72, .95), rgba(17, 42, 72, .75)) !important;
    border-bottom: 1px solid var(--hc-line);
    position: sticky;
    top: 0;
    z-index: 1030;
    backdrop-filter: blur(6px);
}

.hc-guest .navbar-brand {
    color: var(--hc-text) !important;
    font-weight: 900;
    letter-spacing: .3px;
}

.hc-guest .btn-outline-secondary {
    border-color: rgba(255, 255, 255, .25) !important;
    color: var(--hc-text) !important;
}

.hc-guest .btn-outline-secondary:hover {
    background: var(--hc-hover) !important;
    border-color: rgba(0, 204, 168, .35) !important;
    color: var(--hc-gold) !important;
}

/* Page layout */
.hc-guest main {
    padding-top: 26px;
    padding-bottom: 40px;
}

.hc-auth-wrap {
    max-width: 920px;
    margin: 0 auto;
}

.hc-auth-card {
    background: var(--hc-card) !important;
    border: 1px solid var(--hc-line) !important;
    border-radius: var(--hc-radius) !important;
    box-shadow: 0 12px 34px rgba(0, 0, 0, .22);
    overflow: hidden;
}

.hc-auth-card .card-header {
    background: rgba(17, 42, 72, .55) !important;
    border-bottom: 1px solid var(--hc-line) !important;
    color: var(--hc-text) !important;
    font-weight: 900;
}

.hc-auth-card .card-body {
    color: var(--hc-text) !important;
}

/* Title marker like frontend */
.hc-auth-title {
    position: relative;
    padding-left: 12px;
    font-weight: 900;
}

.hc-auth-title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    border-radius: 3px;
    background: var(--hc-accent);
}

/* Form controls */
.hc-guest .form-label,
.hc-guest label {
    color: var(--hc-muted) !important;
    font-weight: 700;
}

.hc-guest .form-control {
    background: rgba(4, 25, 53, .65) !important;
    color: var(--hc-text) !important;
    border: 1px solid var(--hc-line) !important;
    border-radius: 14px !important;
}

.hc-guest .form-control::placeholder {
    color: rgba(255, 255, 255, .45) !important;
}

.hc-guest .form-control:focus {
    border-color: rgba(0, 204, 168, .7) !important;
    box-shadow: 0 0 0 .18rem rgba(0, 204, 168, .18) !important;
}

.hc-guest .form-check-label {
    color: var(--hc-muted) !important;
}

.hc-guest .invalid-feedback {
    color: #ffd6d6 !important;
}

/* Buttons */
.hc-guest .btn-primary {
    background: var(--hc-hover) !important;
    border-color: rgba(0, 204, 168, .35) !important;
    color: var(--hc-gold) !important;
    font-weight: 800;
    border-radius: 14px;
}

.hc-guest .btn-primary:hover {
    background: rgba(27, 60, 102, .9) !important;
    border-color: rgba(0, 204, 168, .7) !important;
}

.hc-guest .btn-link {
    color: var(--hc-gold) !important;
    text-decoration: none;
}

.hc-guest .btn-link:hover {
    color: var(--hc-accent) !important;
    text-decoration: none;
}

/* Alerts */
.hc-guest .alert {
    border-radius: 16px;
    border: 1px solid var(--hc-line);
}

.hc-guest .alert-success {
    background: rgba(0, 204, 168, .12);
    color: #cffff6;
}

.hc-guest .alert-danger {
    background: rgba(255, 77, 77, .12);
    color: #ffd6d6;
}