/* ─────────────────────────────────────────────────────────────────────────────
   Styling for the ASP.NET Identity scaffold pages (Components/Account/*).

   Those pages are static-SSR <EditForm> POST forms (so they can write auth
   cookies), which means they must keep Blazor's <InputText>/<InputCheckbox>/<button>
   elements — Radzen's interactive inputs can't bind through an SSR form post. So
   instead of swapping components, this sheet restyles the bootstrap classes those
   pages use to match the Radzen "standard" theme, using Radzen CSS variables so it
   follows the light/dark appearance toggle. Loading this lets us drop
   bootstrap.min.css from the whole site (no other page uses bootstrap classes).
   ───────────────────────────────────────────────────────────────────────────── */

/* Base reset — previously provided site-wide by bootstrap-reboot (now removed).
   box-sizing is the load-bearing one; keep it global so layouts don't shift. */
*, *::before, *::after { box-sizing: border-box; }

/* Layout — the auth forms are simple; columns wrap responsively. */
.row { display: flex; flex-wrap: wrap; gap: 1.5rem; margin: 0; }
[class*="col-"] { flex: 1 1 320px; min-width: 0; }

/* Spacing / text utilities the scaffold uses. */
.mb-3 { margin-bottom: 1rem; }
.w-100 { width: 100%; }
.h-100 { height: 100%; }
.font-weight-bold { font-weight: 700; }
.text-danger  { color: var(--rz-danger,  #dc3545); }
.text-success { color: var(--rz-success, #198754); }
.text-info    { color: var(--rz-info,    #0dcaf0); }
.text-muted   { color: var(--rz-text-secondary-color, #6c757d); }

/* Inputs. */
.form-control, .form-select {
  display: block; width: 100%; padding: .5rem .75rem;
  font-size: 1rem; line-height: 1.5;
  color: var(--rz-input-value-color, var(--rz-text-color, #212529));
  background: var(--rz-input-background-color, var(--rz-base-background-color, #fff));
  border: 1px solid var(--rz-input-border-color, var(--rz-border-color, #ced4da));
  border-radius: var(--rz-border-radius, 4px);
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.form-control:focus, .form-select:focus {
  outline: 0; border-color: var(--rz-primary, #0d6efd);
  box-shadow: 0 0 0 .2rem rgba(13, 110, 253, .25);
}
.form-label, .control-label { display: inline-block; margin-bottom: .35rem; font-weight: 500; }

/* Floating labels (markup is <input placeholder> then <label>). */
.form-floating { position: relative; }
.form-floating > .form-control { height: 3.5rem; padding: 1.5rem .75rem .5rem; }
.form-floating > .form-control::placeholder { color: transparent; }
.form-floating > label {
  position: absolute; top: 0; left: 0; height: 100%; margin: 0;
  padding: 1rem .75rem; pointer-events: none; border: 1px solid transparent;
  color: var(--rz-text-secondary-color, #6c757d);
  transform-origin: 0 0; transition: opacity .1s ease-in-out, transform .1s ease-in-out;
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label {
  opacity: .85; transform: scale(.85) translateY(-.5rem) translateX(.15rem);
}

/* Checkboxes. */
.form-check { display: inline-flex; align-items: center; gap: .4rem; }
.form-check-input, .darker-border-checkbox { margin-right: .4rem; }
.checkbox label { display: inline-flex; align-items: center; gap: .4rem; }

/* Buttons → Radzen-flavoured. */
.btn {
  display: inline-block; cursor: pointer; user-select: none;
  padding: .5rem 1rem; font-size: 1rem; line-height: 1.5; font-weight: 500;
  border: 1px solid transparent; border-radius: var(--rz-border-radius, 4px);
  text-decoration: none; text-align: center;
  transition: background-color .15s, border-color .15s, filter .15s;
}
.btn-lg { padding: .65rem 1.25rem; font-size: 1.1rem; }
.btn-primary { color: #fff; background: var(--rz-primary, #0d6efd); border-color: var(--rz-primary, #0d6efd); }
.btn-danger  { color: #fff; background: var(--rz-danger,  #dc3545); border-color: var(--rz-danger,  #dc3545); }
.btn-primary:hover, .btn-danger:hover { filter: brightness(.93); }
.btn-link { color: var(--rz-primary, #0d6efd); background: none; border: none; text-decoration: underline; padding-left: 0; padding-right: 0; }

/* Alerts. */
.alert { padding: .75rem 1rem; border: 1px solid transparent; border-radius: var(--rz-border-radius, 4px); margin-bottom: 1rem; }
.alert-danger  { color: #842029; background: #f8d7da; border-color: #f5c2c7; }
.alert-warning { color: #664d03; background: #fff3cd; border-color: #ffecb5; }
.alert-info    { color: #055160; background: #cff4fc; border-color: #b6effb; }

/* Manage side nav (nav nav-pills flex-column). */
.nav { display: flex; flex-wrap: wrap; gap: .15rem; padding-left: 0; margin-bottom: 0; list-style: none; }
.nav.flex-column, .nav-pills.flex-column { flex-direction: column; }
.nav-item { display: block; }
.nav-link {
  display: block; padding: .5rem .9rem; text-decoration: none; cursor: pointer;
  color: var(--rz-text-color, #212529); border-radius: var(--rz-border-radius, 4px);
}
.nav-link:hover { background: var(--rz-base-200, rgba(0, 0, 0, .05)); }
.nav-pills .nav-link.active { color: #fff; background: var(--rz-primary, #0d6efd); }

/* Tables / input groups used on a couple of pages. */
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { padding: .4rem .6rem; border-bottom: 1px solid var(--rz-border-color, #dee2e6); text-align: left; }
.input-group { display: flex; align-items: stretch; }
.input-group .form-control { width: auto; flex: 1 1 auto; }
.input-group-text, .input-group-append { display: flex; align-items: center; padding: .5rem .75rem; }