/* WNBL Stats Backend */
:root {
    --app-ink: #18212e;          /* Navigation, Login-Feld */
    --app-ink-soft: #2a3648;
    --app-ball: #ee7623;         /* Akzent: Ballorange */
    --app-bg: #f2f4f7;
    --app-line: #dde2e9;

    --bs-body-font-family: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
    --bs-body-bg: var(--app-bg);
    --bs-body-color: #1f2733;
    --bs-border-color: var(--app-line);
    --bs-primary: #22324a;
    --bs-primary-rgb: 34, 50, 74;
    --bs-link-color: #22324a;
    --bs-link-color-rgb: 34, 50, 74;
    --bs-link-hover-color: #0f1826;
}

h1, h2, h3, h4, .h1, .h2, .h3, .h4, .navbar-brand, .auth-title {
    font-family: "Barlow Semi Condensed", "Barlow", system-ui, sans-serif;
    font-weight: 600;
    letter-spacing: .01em;
}

.btn-primary {
    --bs-btn-bg: #22324a;
    --bs-btn-border-color: #22324a;
    --bs-btn-hover-bg: #18212e;
    --bs-btn-hover-border-color: #18212e;
    --bs-btn-active-bg: #111822;
    --bs-btn-active-border-color: #111822;
    --bs-btn-disabled-bg: #22324a;
    --bs-btn-disabled-border-color: #22324a;
}

.form-control:focus, .btn:focus-visible, .dropdown-item:focus-visible {
    border-color: var(--app-ball);
    box-shadow: 0 0 0 .2rem rgba(238, 118, 35, .25);
}

/* Navigation */
.app-nav {
    background: var(--app-ink);
    border-bottom: 3px solid var(--app-ball);
}
.app-nav .navbar-brand { font-size: 1.35rem; }
.app-nav .nav-link { font-weight: 500; }
.app-nav .nav-link.active {
    color: #fff;
    box-shadow: inset 0 -3px 0 var(--app-ball);
}
.app-nav .nav-link.disabled { color: rgba(255, 255, 255, .35); }
.app-user {
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .25);
}
.app-user:hover, .app-user:focus { color: #fff; border-color: rgba(255, 255, 255, .5); }

.app-areas .list-group-item { padding: .9rem 1.1rem; }

/* Login */
.auth-main {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}
.auth-main > .alert { width: 100%; max-width: 420px; }
.auth-card {
    width: 100%;
    max-width: 420px;
    background: #fff;
    border: 1px solid var(--app-line);
    border-radius: .5rem;
    overflow: hidden;
}
.auth-court {
    position: relative;
    height: 120px;
    background: var(--app-ink);
    color: rgba(238, 118, 35, .55);
}
.auth-court svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.auth-title {
    position: absolute;
    left: 1.5rem;
    bottom: .85rem;
    color: #fff;
    font-size: 1.6rem;
}
.auth-body { padding: 1.75rem 1.5rem 2rem; }

@media (prefers-reduced-motion: reduce) {
    .alert.fade { transition: none; }
}