/* =============================================
   Brickeez — Minimal CSS
   Tailwind gère tout le styling principal.
   Ce fichier ne contient que :
   - Les styles Blazor obligatoires
   - Les overrides pour les ~20 pages Identity/Manage
     non encore converties en Tailwind
   ============================================= */

/* --- Blazor obligatoire --- */
h1:focus { outline: none; }
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid #e50000; }
.validation-message { color: #e50000; font-size: 0.75rem; margin-top: 0.25rem; }

.blazor-error-boundary {
    background: #b32121;
    padding: 1rem;
    color: white;
    border-radius: 0.5rem;
}
.blazor-error-boundary::after { content: "Une erreur est survenue."; }

/* --- Identity Manage pages (Bootstrap compat) ---
   Scopé pour ne pas affecter les pages Tailwind.
   Ces styles seront supprimés quand les pages
   Manage seront converties en Tailwind.           */

/* Layout grille Bootstrap — uniquement dans les pages Identity */
.row {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    max-width: 56rem;
    margin: 0 auto;
    padding: 2rem 1rem;
}
.col-lg-6 { flex: 0 0 100%; max-width: 100%; }
@media (min-width: 768px) {
    .col-lg-6 { flex: 0 0 60%; max-width: 60%; }
}

/* Formulaires Identity */
.form-control {
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
}
.form-control:focus {
    outline: none;
    border-color: #F19D76;
    box-shadow: 0 0 0 2px rgba(241, 157, 118, 0.3);
}

.form-floating {
    position: relative;
    margin-bottom: 1rem;
}
.form-floating > .form-control { padding: 1.5rem 0.75rem 0.5rem; }
.form-floating > .form-control::placeholder { color: transparent; }
.form-floating > label, .form-floating > .form-label {
    position: absolute; top: 0; left: 0.75rem; padding: 0.75rem 0;
    font-size: 0.875rem; color: #6b7280; pointer-events: none; transition: 0.15s ease all;
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control:focus ~ .form-label,
.form-floating > .form-control:not(:placeholder-shown) ~ .form-label {
    transform: translateY(-0.5rem) scale(0.8); color: #F19D76;
}

/* Boutons Identity */
.btn {
    display: inline-block; font-weight: 600; text-align: center;
    border: none; border-radius: 0.5rem; padding: 0.625rem 1.25rem;
    font-size: 0.875rem; cursor: pointer; transition: background 0.15s;
}
.btn-lg { padding: 0.75rem 1.5rem; font-size: 1rem; }
.btn-primary { background: #F19D76; color: white; }
.btn-primary:hover { background: #E8854E; color: white; }
.btn-danger { background: #ef4444; color: white; }
.btn-danger:hover { background: #dc2626; color: white; }
.btn-link { background: none; color: #F19D76; padding: 0; text-decoration: underline; }
.btn-link:hover { color: #E8854E; }
.w-100 { width: 100%; }

/* Alertes Identity */
.text-danger { color: #ef4444; font-size: 0.75rem; }
.form-check-input { accent-color: #F19D76; }
.darker-border-checkbox.form-check-input { border-color: #929292; }

/* QR code 2FA */
#qrCode { background: white; padding: 1rem; border-radius: 0.5rem; display: inline-block; }