/* ── Login/ChildLogin Razor Pages (Bootstrap-based, not Blazor) ── */
html, body {
    font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a, .btn-link {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

/* Bootstrap utilities needed by Login/ChildLogin Razor Pages */
.d-flex { display: flex !important; }
.justify-content-center { justify-content: center !important; }
.align-items-center { align-items: center !important; }
.min-vh-100 { min-height: 100vh !important; }
.w-100 { width: 100% !important; }
.mb-2 { margin-bottom: .5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.my-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }
.ms-3 { margin-left: 1rem !important; }
.ms-auto { margin-left: auto !important; }
.text-center { text-align: center !important; }
.text-muted { color: #6c757d !important; }
.small { font-size: 0.875rem; }
.gap-2 { gap: .5rem !important; }
.row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.col-6 { flex: 0 0 50%; max-width: 50%; padding-right: 15px; padding-left: 15px; }
.d-grid { display: grid !important; }
.form-control { display: block; width: 100%; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; color: #212529; background-color: #fff; border: 1px solid #ced4da; border-radius: .25rem; box-sizing: border-box; }
.form-control-lg { padding: .5rem 1rem; font-size: 1.25rem; border-radius: .3rem; }
.form-label { margin-bottom: .5rem; display: inline-block; }
.btn { display: inline-block; font-weight: 400; text-align: center; padding: .375rem .75rem; font-size: 1rem; border-radius: .25rem; border: 1px solid transparent; cursor: pointer; text-decoration: none; }
.btn-lg { padding: .5rem 1rem; font-size: 1.25rem; }
.btn-outline-primary { color: #0d6efd; border-color: #0d6efd; background: transparent; }
.btn-outline-primary:hover { background-color: #0d6efd; color: #fff; }
.btn-outline-success { color: #198754; border-color: #198754; background: transparent; }
.btn-outline-success:hover { background-color: #198754; color: #fff; }
.btn-success { color: #fff; background-color: #198754; border-color: #157347; }
.btn-link { background: none; border: none; color: #0d6efd; text-decoration: underline; cursor: pointer; }
.alert { position: relative; padding: .75rem 1.25rem; border: 1px solid transparent; border-radius: .25rem; margin-bottom: 1rem; }
.alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
.alert-link { font-weight: 700; }
.alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffc107; }
.alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
.navbar { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: .5rem 1rem; }
.navbar-brand { display: inline-block; font-size: 1.25rem; font-weight: bold; text-decoration: none; color: inherit; }
.navbar-light { background-color: #fff; }
.shadow-sm { box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important; }
.px-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; }
.container { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; }
.pb-5 { padding-bottom: 3rem !important; }
.fs-4 { font-size: 1.5rem !important; }
.fw-bold { font-weight: 700 !important; }
.bg-light { background-color: #f8f9fa !important; }
.bg-white { background-color: #fff !important; }

/* Blazor error UI */
#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* Validation */
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid red; }
.validation-message { color: red; }
