:root {
    --cityrail-orange: #f7941d;
    --cityrail-orange-hover: #f78700;
    --cityrail-dark: #272727;
    --cityrail-text: #535353;
    --bs-primary: var(--cityrail-orange);
    --bs-primary-rgb: 247, 148, 29;
    --bs-link-color: var(--cityrail-orange);
    --bs-link-color-rgb: 247, 148, 29;
    --bs-link-hover-color: var(--cityrail-orange-hover);
    --bs-link-hover-color-rgb: 247, 135, 0;
}

html,
body {
    min-height: 100%;
}

body {
    background-color: #f8f9fa;
    color: var(--cityrail-text);
    font-family: 'Poppins', Helvetica, Arial, sans-serif;
}

a {
    color: var(--cityrail-orange);
}

a:hover {
    color: var(--cityrail-orange-hover);
}

.app-navbar {
    background-color: var(--cityrail-dark);
    border-bottom: 4px solid var(--cityrail-orange);
}

.navbar-brand {
    font-weight: 600;
    letter-spacing: 0.02em;
}

.brand-logo {
    height: 48px;
    width: auto;
    object-fit: contain;
}

.brand-icon {
    color: var(--cityrail-orange);
    font-size: 1.15rem;
}

.page-card {
    border: 0;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.page-title {
    color: var(--cityrail-dark);
}

.login-shell {
    min-height: 100vh;
}

.login-card {
    max-width: 420px;
    width: 100%;
}

.text-cityrail {
    color: var(--cityrail-orange) !important;
}

.btn-question {
    min-width: 2.5em;
}