/* =========================================================================
   Identity bridge. The ASP.NET Core Identity pages are scaffolded with Bootstrap
   class names (form-floating, btn-primary, alert-warning, nav-pills …). VONDL apps
   do not load Bootstrap, so this sheet gives exactly those classes the VONDL look,
   scoped to .v-identity (the wrapper the Identity layouts render). App pages never
   use these classes: they use the components.
   ========================================================================= */

.v-identity h1 { font-size: var(--v-text-2xl); }
.v-identity h2 { font-size: var(--v-text-xl); }
.v-identity h3 { font-size: var(--v-text-lg); }
.v-identity h4 { font-size: var(--v-text-md); }

/* Layout helpers the templates use */
.v-identity .row { display: flex; flex-wrap: wrap; gap: var(--v-space-5); }
.v-identity .row > [class*="col-"] { flex: 1 1 280px; min-width: 0; }
.v-identity .mb-0 { margin-bottom: 0; }
.v-identity .mb-3 { margin-bottom: var(--v-space-4); }
.v-identity .mt-2 { margin-top: var(--v-space-2); }
.v-identity .mt-3 { margin-top: var(--v-space-4); }
.v-identity .mx-auto { margin-left: auto; margin-right: auto; }
.v-identity .w-100 { width: 100%; }
.v-identity .d-flex { display: flex; }
.v-identity .flex-column { flex-direction: column; }
.v-identity .d-inline-block { display: inline-block; }
.v-identity .small { font-size: var(--v-text-sm); }
.v-identity .text-danger { color: var(--v-crit); font-size: var(--v-text-sm); }
.v-identity .text-success { color: var(--v-good); }
.v-identity .text-info { color: var(--v-info); }
.v-identity .text-body-secondary, .v-identity .text-secondary { color: var(--v-text-2); }
.v-identity .font-weight-bold { font-weight: 700; }
.v-identity .bg-white { background: var(--v-white); }
.v-identity .p-2 { padding: var(--v-space-2); }
.v-identity .rounded { border-radius: var(--v-radius-sm); }
.v-identity hr { border: 0; border-top: 1px solid var(--v-border); margin: var(--v-space-4) 0; }
.v-identity ul.validation-errors, .v-identity .validation-errors { color: var(--v-crit); padding-left: var(--v-space-4); font-size: var(--v-text-sm); }
.v-identity .validation-message { color: var(--v-crit); font-size: var(--v-text-sm); }

/* Buttons */
.v-identity .btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 0 18px;
    border-radius: var(--v-radius-sm); border: 1px solid var(--v-border-strong); background: var(--v-surface); color: var(--v-heading);
    font-family: var(--v-font-body); font-size: var(--v-text-md); font-weight: 600; cursor: pointer; text-decoration: none;
}
.v-identity .btn:hover { background: var(--v-hover); }
.v-identity .btn-primary { background: var(--v-gradient); color: var(--v-on-brand); border-color: transparent; box-shadow: var(--v-shadow-glow); }
.v-identity .btn-primary:hover { background: var(--v-gradient); filter: saturate(1.1) brightness(1.03); }
.v-identity .btn-danger { color: var(--v-crit); border-color: color-mix(in srgb, var(--v-crit) 40%, transparent); }
.v-identity .btn-danger:hover { background: var(--v-crit-tint); }
.v-identity .btn-link { background: none; border: 0; min-height: 0; padding: 0; color: var(--v-link); font-weight: 500; }
.v-identity .btn-link:hover { text-decoration: underline; background: none; }
.v-identity .btn-lg { min-height: 46px; font-size: var(--v-text-lg); }

/* Fields: form-floating becomes a normal label-above field (clearer and accessible) */
.v-identity .form-floating { display: flex; flex-direction: column-reverse; gap: 6px; margin-bottom: var(--v-space-4); }
.v-identity .form-floating > label, .v-identity .form-label, .v-identity .control-label { font-size: var(--v-text-sm); font-weight: 600; color: var(--v-heading); }
.v-identity .form-floating > .text-danger { order: -1; }
.v-identity .form-control {
    width: 100%; min-height: 42px; padding: 9px 12px; border-radius: var(--v-radius-sm); border: 1px solid var(--v-border-strong);
    background: var(--v-surface); color: var(--v-text); font-family: var(--v-font-body); font-size: var(--v-text-md);
}
.v-identity .form-control::placeholder { color: transparent; }
.v-identity .form-control:focus { outline: none; border-color: var(--v-coral-400); box-shadow: var(--v-focus); }
.v-identity .form-control[readonly], .v-identity .form-control:disabled { background: var(--v-surface-2); }
.v-identity .input-group { display: flex; gap: var(--v-space-2); }
.v-identity .input-group-text { display: inline-flex; align-items: center; padding: 0 10px; color: var(--v-good); font-weight: 700; }
.v-identity .form-check, .v-identity .checkbox { display: flex; align-items: center; gap: 8px; margin-bottom: var(--v-space-4); }
.v-identity .form-check-input, .v-identity input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--v-coral-500); }
.v-identity .form-check-label { color: var(--v-text); font-weight: 500; }

/* Alerts */
.v-identity .alert { padding: var(--v-space-3) var(--v-space-4); border-radius: var(--v-radius-md); margin-bottom: var(--v-space-4); background: var(--v-info-tint); }
.v-identity .alert-warning { background: var(--v-warn-tint); }
.v-identity .alert-danger { background: var(--v-crit-tint); }
.v-identity .alert-success { background: var(--v-good-tint); }
.v-identity .alert-info { background: var(--v-info-tint); }
.v-identity .alert p:last-child { margin-bottom: 0; }

/* Manage navigation (nav-pills) */
.v-identity .nav { list-style: none; margin: 0; padding: 0; display: flex; gap: 2px; }
.v-identity .nav.flex-column { flex-direction: column; }
.v-identity .nav-link { display: block; padding: 8px 12px; border-radius: var(--v-radius-sm); color: var(--v-text-2); text-decoration: none; font-weight: 500; }
.v-identity .nav-link:hover { background: var(--v-hover); color: var(--v-heading); }
.v-identity .nav-pills .nav-link.active { background: var(--v-accent-tint); color: var(--v-heading); font-weight: 600; }

/* Tables and recovery codes */
.v-identity .table { width: 100%; border-collapse: collapse; }
.v-identity .table th, .v-identity .table td { padding: 8px 10px; border-bottom: 1px solid var(--v-border); text-align: left; }
.v-identity .recovery-code { font-family: var(--v-font-mono); font-weight: 600; color: var(--v-heading); }
.v-identity kbd { background: var(--v-surface-2); border: 1px solid var(--v-border); border-radius: var(--v-radius-xs); padding: 1px 6px; color: var(--v-heading); }
.v-identity .glyphicon { display: none; }