/*
 * Bootstrap's default .form-control/.form-select render with a white
 * background regardless of theme. Previously only the login page
 * (minimal.php) patched this; every dashboard-layout form was left with
 * white input boxes against the dark theme. Fixing it once here.
 */
.form-control,
.form-select {
    background: var(--bg);
    border-color: var(--border);
    color: var(--text-primary);
}

.form-control:focus,
.form-select:focus {
    background: var(--bg);
    color: var(--text-primary);
    border-color: var(--primary);
    box-shadow: 0 0 0 .2rem var(--primary-light);
}

.form-control::placeholder {
    color: var(--text-muted);
    opacity: 1;
}

.form-control:disabled,
.form-select:disabled {
    background: var(--surface-hover);
    color: var(--text-muted);
}

.form-check-input {
    background-color: var(--bg);
    border-color: var(--border);
}

.form-check-input:checked {
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-primary,
.btn-info {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--accent-contrast);
    font-weight: 600;
}

.btn-primary:hover,
.btn-info:hover {
    background: var(--primary-dark);
    border-color: var(--primary-dark);
    color: var(--accent-contrast);
}

/* Solid blue "business action" button (Login, Request Pickup, etc.) -
   deliberately a solid fill rather than an outline/text-color trick, so it
   can never blend into the page background in either theme. */
.btn-secondary {
    background: var(--secondary);
    border-color: var(--secondary);
    color: #ffffff;
    font-weight: 600;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    background: var(--secondary-dark);
    border-color: var(--secondary-dark);
    color: #ffffff;
}

/*
 * Bootstrap's .btn-outline-light is a white outline + white text, meant for
 * a permanently-dark background. Used ~70 times across this app as the
 * "default outline/secondary button", it was invisible (white-on-white)
 * whenever the light theme was active - a real, everyday visibility bug for
 * any visitor without a dark-mode preference, not just an edge case. This
 * override makes it theme-aware instead of touching every call site.
 */
.btn-outline-light {
    color: var(--text-primary);
    border-color: var(--border);
    background: transparent;
}

.btn-outline-light:hover,
.btn-outline-light:focus,
.btn-outline-light:active {
    color: var(--text-primary);
    background: var(--surface-hover);
    border-color: var(--text-muted);
}

.btn-outline-light:disabled,
.btn-outline-light.disabled {
    color: var(--text-muted);
    border-color: var(--border);
    background: transparent;
}

.invalid-feedback {
    font-size: .8rem;
}

.field-hint {
    font-size: .78rem;
    color: var(--text-muted);
    margin-top: .25rem;
}

/* Keeps the Save/Cancel row visible while scrolling a long form - opt in
   with class="form-actions-sticky" on the button row. */
.form-actions-sticky {
    position: sticky;
    bottom: 0;
    background: var(--surface);
    border-top: 1px solid var(--border);
    padding-top: .9rem;
    margin-top: 1.5rem;
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    z-index: 5;
}