/* Compléments au thème MudBlazor (FcrTheme.cs). */
html, body {
    background: #F3F6FB;
}

html { scroll-behavior: smooth; }
body { min-width: 320px; }

/* Application shell: surfaces, spacing and controls remain legible on desktop and touch screens.
   Palette « premium » : navy profond, bleu franc, neutres froids et doux (voir aussi FcrTheme.cs). */
:root {
    --fcr-navy: #0E2B4A;
    --fcr-navy-2: #1B4A79;
    --fcr-blue: #1668A8;
    --fcr-blue-strong: #0F557F;
    --fcr-accent: #37A0E6;
    --fcr-ink: #15242F;
    --fcr-muted: #5A6B7B;
    --fcr-line: #E4EAF1;
    --fcr-surface: #FFFFFF;
}

body { color: var(--fcr-ink); }
.fcr-shell .mud-appbar { background: var(--fcr-navy); min-height: 64px; }
.fcr-brand { letter-spacing: -.01em; font-weight: 700; }
.fcr-brand span { color: #A9D4F5; font-size: .7rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; margin-left: 6px; }
.fcr-drawer { border-right: 1px solid var(--fcr-line); }
.fcr-drawer .mud-nav-link { border-radius: 8px; margin: 3px 0; min-height: 44px; color: #435466; }
.fcr-drawer .mud-nav-link:hover, .fcr-drawer .mud-nav-link.active { background: #EAF3FA; color: var(--fcr-blue); }
.fcr-app-container { min-height: calc(100vh - 64px); }
.fcr-app-container > .mud-paper, .fcr-app-container .mud-paper { border-color: var(--fcr-line); box-shadow: 0 2px 10px rgba(24, 43, 61, .04); }
.mud-input-control { min-width: 0; }
.mud-input-label { font-weight: 500; }
.mud-input-outlined-border { border-color: #B9C7D3; }
.mud-input-outlined:hover .mud-input-outlined-border { border-color: var(--fcr-blue); }
.mud-input-outlined.mud-input-outlined-focused .mud-input-outlined-border { border-width: 2px; border-color: var(--fcr-blue); }
.mud-button-root { min-height: 44px; text-transform: none; font-weight: 600; }
.mud-icon-button { min-width: 44px; min-height: 44px; }
.mud-nav-link:focus-visible,
.mud-button-root:focus-visible,
.mud-icon-button:focus-visible,
.mud-input-control:focus-within {
    outline: 3px solid rgba(55, 160, 230, .55);
    outline-offset: 2px;
}
.mud-table-container { border-radius: 8px; }
.mud-table thead th { background: #F3F7FA; color: #526273; font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.mud-alert { border-radius: 8px; }

/* Mud pickers/popovers must sit above drawers, dialogs and dense tables. */
.mud-popover-provider, .mud-popover, .mud-picker-popover { z-index: 1600 !important; }
.mud-picker-calendar-container { background: #fff; min-width: 310px; }
.mud-picker-calendar-header { background: var(--fcr-navy); color: #fff; }
.mud-picker-calendar-header-switch { color: #fff; }
.mud-picker-calendar-transition { min-height: 280px; }
.mud-picker-calendar-day { min-width: 40px; min-height: 40px; }
.mud-picker-input .mud-input-adornment { color: var(--fcr-blue); }

@media (max-width: 700px) {
    .fcr-app-container { padding: 20px 12px !important; }
    .fcr-brand span { display: none; }
    .mud-dialog { margin: 10px; width: calc(100% - 20px) !important; }
    .mud-picker-calendar-container { min-width: min(310px, calc(100vw - 32px)); }
    .mud-table { min-width: 680px; }
    .mud-table-container { overflow-x: auto; }
    .fcr-shell .mud-appbar { padding-inline: 4px; }
    .fcr-shell .mud-appbar .mud-typography { font-size: 1rem; }
    .fcr-dec-hero { padding: 36px 16px; border-radius: 12px; }
    .fcr-dec-identity { padding: 18px; }
    .fcr-dec-row { align-items: flex-start; flex-direction: column; gap: 4px; }
    .fcr-dec-row-label { width: auto; font-size: .8rem; }
    .fcr-dec-row-value { width: 100%; }

    /* Les MudTable portant cette classe passent en cartes lisibles sur mobile.
       Les cellules gardent leur DataLabel comme libellé accessible. */
    .fcr-responsive-table .mud-table-head { display: none; }
    .fcr-responsive-table .mud-table-body .mud-table-row {
        display: block;
        margin: 0 0 12px;
        padding: 10px 12px;
        border: 1px solid var(--fcr-line);
        border-radius: 10px;
        background: #fff;
    }
    .fcr-responsive-table .mud-table-body .mud-table-cell {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 16px;
        min-height: 36px;
        padding: 8px 0;
        border-bottom: 1px solid #EEF2F6;
        text-align: right;
    }
    .fcr-responsive-table .mud-table-body .mud-table-cell:last-child { border-bottom: 0; }
    .fcr-responsive-table .mud-table-body .mud-table-cell::before {
        content: attr(data-label);
        flex: 0 1 45%;
        color: var(--fcr-muted);
        font-size: .78rem;
        font-weight: 700;
        text-align: left;
    }
}

.fcr-amount {
    font-variant-numeric: tabular-nums;
}

.fcr-amount-main {
    font-size: 2.1rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--fcr-navy);
    line-height: 1.2;
    letter-spacing: -0.01em;
}

/* Évaluation : bandeau de badges et panneau de la cote, au même langage visuel que le décodeur. */
.fcr-eval-badges { margin-left: 0; }

/* Peu de faits connus ici : les tuiles gardent une largeur raisonnable au lieu de s'étirer.
   Sélecteur doublé : la règle de .fcr-dec-facts vient plus bas dans ce fichier. */
.fcr-dec-facts.fcr-eval-facts { grid-template-columns: repeat(auto-fit, minmax(140px, 200px)); }

.fcr-eval-cote {
    padding: 18px 22px;
    border: 1px solid var(--fcr-line);
    border-left: 4px solid var(--fcr-blue);
    border-radius: 12px;
    background: linear-gradient(180deg, #FBFDFF 0%, #F3F8FD 100%);
    box-shadow: 0 2px 12px rgba(14, 43, 74, 0.05);
}

.fcr-mono,
.fcr-vin input {
    font-family: Consolas, "Courier New", monospace;
    letter-spacing: 0.04em;
}

/* Le titre reçoit le focus à chaque navigation : le repère reste visible au clavier. */
h1:focus-visible {
    outline: 3px solid rgba(55, 160, 230, .55);
    outline-offset: 4px;
    border-radius: 4px;
}

.fcr-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.fcr-row-selected {
    background: #E8F0F8;
}

.fcr-mail-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.fcr-mail-layout { align-items:stretch; }
.fcr-mail-sidebar, .fcr-mail-list, .fcr-mail-detail { min-height:620px; border-radius:14px; background:var(--fcr-surface); }
.fcr-mail-folders .mud-nav-link { min-height:44px; border-radius:8px; }
.fcr-mail-folders .mud-nav-link.active { background:#E8F2FB; color:var(--fcr-blue); font-weight:700; }
.fcr-mail-account { display:flex; align-items:center; gap:10px; min-height:48px; color:var(--fcr-ink); font-size:.88rem; }
.fcr-mail-account span { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; }
.fcr-mail-list { overflow:hidden; }
.fcr-mail-list-head, .fcr-mail-detail-actions { display:flex; align-items:center; min-height:58px; padding:8px 14px; border-bottom:1px solid var(--fcr-line); }
.fcr-mail-row { display:flex; width:100%; gap:12px; align-items:flex-start; padding:14px; text-align:left; border:0; border-bottom:1px solid #EEF2F6; background:#fff; cursor:pointer; transition:background .18s ease; }
.fcr-mail-row:hover, .fcr-mail-row.is-selected { background:#EAF3FA; }
.fcr-mail-row.is-selected { box-shadow:inset 3px 0 0 var(--fcr-blue); }
.fcr-mail-avatar { display:grid; place-items:center; flex:0 0 36px; width:36px; height:36px; border-radius:50%; background:#DCECF8; color:var(--fcr-blue-strong); font-weight:700; }
.fcr-mail-row-content { display:flex; min-width:0; flex:1; flex-direction:column; gap:3px; }
.fcr-mail-row-content strong, .fcr-mail-row-content span, .fcr-mail-row-content small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fcr-mail-row-content span { color:var(--fcr-ink); font-size:.9rem; }
.fcr-mail-row-content small, .fcr-muted { color:var(--fcr-muted); font-size:.78rem; }
.fcr-mail-row-meta { display:flex; flex-direction:column; align-items:flex-end; color:var(--fcr-muted); font-size:.74rem; white-space:nowrap; }
.fcr-mail-sender { display:flex; align-items:center; gap:12px; margin-top:18px; }
.fcr-mail-body { white-space:pre-line; line-height:1.7; }
.fcr-mail-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; color:var(--fcr-muted); text-align:center; }
.fcr-mail-detail .mud-input-control { width:100%; }
.fcr-settings-card { border-radius:14px; }
.fcr-settings-protocol { display:flex; align-items:center; gap:10px; min-height:42px; color:var(--fcr-muted); }
.fcr-settings-protocol span { flex:1; }
.fcr-settings-protocol strong { color:var(--fcr-ink); font-family:Consolas, monospace; font-size:.85rem; }
.fcr-inbox-page { max-width: 1500px; margin: 0 auto; }
.fcr-inbox-header { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:22px; }
.fcr-kicker { color:var(--fcr-blue); font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; margin-bottom:5px; }
.fcr-mail-toolbar { display:flex; align-items:center; gap:16px; min-height:66px; padding:9px 12px; border:1px solid var(--fcr-line); border-radius:14px 14px 0 0; background:#fff; }
.fcr-mail-toolbar-leading { display:flex; align-items:center; gap:7px; min-width:205px; }
.fcr-mail-search { flex:1; max-width:680px; }
.fcr-mail-toolbar-actions { display:flex; margin-left:auto; }
.fcr-mail-workspace { display:grid; grid-template-columns:225px minmax(330px, .9fr) minmax(360px, 1.35fr); min-height:590px; border:1px solid var(--fcr-line); border-top:0; border-radius:0 0 14px 14px; overflow:hidden; background:#fff; box-shadow:0 8px 24px rgba(24,43,61,.05); }
.fcr-mail-rail { display:flex; flex-direction:column; gap:20px; padding:20px 14px; border-right:1px solid var(--fcr-line); background:#FBFCFE; }
.fcr-mail-folders { display:flex; flex-direction:column; gap:3px; }
.fcr-mail-folders button { display:flex; align-items:center; gap:13px; width:100%; min-height:44px; padding:0 12px; border:0; border-radius:9px; color:#536476; background:transparent; font:inherit; text-align:left; cursor:pointer; }
.fcr-mail-folders button:hover, .fcr-mail-folders button.is-active { color:var(--fcr-blue); background:#E8F2FB; font-weight:700; }
.fcr-mail-folders button .mud-icon-root { font-size:21px; }
.fcr-mail-rail-section { border-top:1px solid var(--fcr-line); padding-top:18px; }
.fcr-mail-rail-label { color:var(--fcr-muted); font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin:0 10px 8px; }
.fcr-mail-account { display:flex; align-items:center; gap:9px; min-height:44px; padding:4px 8px; border-radius:8px; color:var(--fcr-ink); text-decoration:none; font-size:.82rem; }
.fcr-mail-account:hover { background:#E8F2FB; }
.fcr-mail-account span { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fcr-mail-rail-footer { display:flex; align-items:center; gap:7px; margin-top:auto; padding:8px; color:var(--fcr-muted); font-size:.75rem; }
.fcr-mail-list-pane, .fcr-mail-reading-pane { min-width:0; background:#fff; }
.fcr-mail-list-pane { border-right:1px solid var(--fcr-line); }
.fcr-pane-header { display:flex; align-items:center; min-height:66px; padding:8px 16px; border-bottom:1px solid var(--fcr-line); }
.fcr-mail-row { display:flex; width:100%; align-items:flex-start; gap:12px; min-height:72px; padding:14px 16px; border:0; border-bottom:1px solid #EEF2F6; color:var(--fcr-ink); background:#fff; text-align:left; cursor:pointer; }
.fcr-mail-row:hover, .fcr-mail-row.is-selected { background:#F2F7FB; }
.fcr-mail-row.is-selected { box-shadow:inset 3px 0 0 var(--fcr-blue); }
.fcr-mail-row-content { display:flex; min-width:0; flex:1; flex-direction:column; gap:3px; }
.fcr-mail-row-content strong, .fcr-mail-row-content span, .fcr-mail-row-content small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fcr-mail-row-content span { font-size:.86rem; }
.fcr-mail-row-content small { color:var(--fcr-muted); font-size:.77rem; }
.fcr-mail-row-date { color:var(--fcr-muted); font-size:.75rem; white-space:nowrap; }
.fcr-mail-empty, .fcr-mail-reading-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-height:430px; padding:32px; color:var(--fcr-muted); text-align:center; }
.fcr-mail-empty-icon { display:grid; place-items:center; width:52px; height:52px; border-radius:50%; color:var(--fcr-blue); background:#E8F2FB; }
.fcr-mail-reading-empty { height:100%; min-height:590px; }
.fcr-mail-body { max-width:520px; white-space:pre-line; line-height:1.7; text-align:left; }
.fcr-compose-window { position:fixed; right:28px; bottom:20px; z-index:1200; width:min(560px, calc(100vw - 32px)); overflow:hidden; border:1px solid #C9D5E0; border-radius:12px; background:#fff; box-shadow:0 18px 48px rgba(14,43,74,.24); }
.fcr-compose-title { display:flex; align-items:center; justify-content:space-between; min-height:48px; padding:4px 10px 4px 16px; color:#fff; background:var(--fcr-navy); }
.fcr-compose-fields { display:flex; flex-direction:column; gap:3px; padding:10px 16px; }
.fcr-compose-fields .mud-input-control { width:100%; }
.fcr-compose-actions { display:flex; align-items:center; gap:8px; padding:9px 16px; border-top:1px solid var(--fcr-line); }
@media (max-width: 1050px) { .fcr-mail-workspace { grid-template-columns:200px minmax(320px, 1fr); } .fcr-mail-reading-pane { display:none; } }
@media (max-width: 700px) { .fcr-inbox-header { align-items:flex-start; flex-direction:column; } .fcr-mail-toolbar { flex-wrap:wrap; gap:4px; border-radius:12px 12px 0 0; } .fcr-mail-toolbar-leading { min-width:0; flex:1; } .fcr-mail-search { order:3; flex-basis:100%; max-width:none; } .fcr-mail-workspace { display:block; min-height:0; border-radius:0 0 12px 12px; } .fcr-mail-rail { border-right:0; border-bottom:1px solid var(--fcr-line); } .fcr-mail-folders { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; } .fcr-mail-folders button { justify-content:center; padding:0 5px; } .fcr-mail-folders button span { display:none; } .fcr-mail-rail-section, .fcr-mail-rail-footer { display:none; } .fcr-mail-row { min-height:64px; padding:12px; } .fcr-compose-window { right:10px; bottom:10px; width:calc(100vw - 20px); } }
@media (max-width: 700px) { .fcr-mail-head { align-items:flex-start; flex-direction:column; } .fcr-mail-sidebar, .fcr-mail-list, .fcr-mail-detail { min-height:0; } .fcr-mail-detail { margin-bottom:16px; } .fcr-mail-row { padding:12px; } .fcr-mail-row-content small { display:none; } }

/* Page de connexion (rendu statique, sans composants interactifs). */
.fcr-login {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    background:
        radial-gradient(120% 120% at 80% -10%, rgba(55, 160, 230, 0.35) 0%, rgba(55, 160, 230, 0) 55%),
        linear-gradient(140deg, var(--fcr-navy) 0%, var(--fcr-navy-2) 100%);
}

.fcr-login-card {
    width: 100%;
    max-width: 400px;
    background: #fff;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 14px;
    padding: 36px 32px;
    box-shadow: 0 24px 60px rgba(8, 24, 42, 0.45);
}

.fcr-login-head { display: flex; align-items: center; gap: 12px; }

.fcr-login-mark {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--fcr-blue) 0%, var(--fcr-accent) 100%);
    color: #fff;
    font-weight: 800;
    font-size: 1.25rem;
    box-shadow: 0 6px 16px rgba(22, 104, 168, 0.35);
}

.fcr-login-card h1 {
    margin: 0;
    font-size: 1.4rem;
    color: var(--fcr-navy);
    letter-spacing: -0.01em;
}

.fcr-login-subtitle {
    margin: 4px 0 24px;
    color: var(--fcr-muted);
    font-size: 0.875rem;
}

.fcr-login-subtitle a { color: var(--fcr-blue); }

.fcr-login-card label {
    display: block;
    margin: 16px 0 6px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--fcr-ink);
}

.fcr-login-card input {
    width: 100%;
    box-sizing: border-box;
    padding: 11px 13px;
    border: 1px solid #C2CCD6;
    border-radius: 8px;
    font-size: 0.95rem;
}

.fcr-login-card input:focus {
    outline: none;
    border-color: var(--fcr-blue);
    box-shadow: 0 0 0 3px rgba(55, 160, 230, 0.25);
}

.fcr-login-card button {
    width: 100%;
    margin-top: 24px;
    padding: 12px;
    background: var(--fcr-blue);
    color: #fff;
    border: 0;
    border-radius: 8px;
    font-size: 0.98rem;
    font-weight: 700;
    cursor: pointer;
}

.fcr-login-card button:hover { background: var(--fcr-blue-strong); }

.fcr-login-card button:focus-visible {
    outline: 2px solid var(--fcr-accent);
    outline-offset: 2px;
}

/* Action secondaire du formulaire (déconnexion) : apparence de lien. */
.fcr-login-card button.fcr-link-button {
    margin-top: 8px;
    padding: 4px 0;
    background: none;
    color: var(--fcr-blue);
    text-decoration: underline;
    font-weight: 400;
}

.fcr-login-card button.fcr-link-button:hover { background: none; color: var(--fcr-blue-strong); }

.fcr-login-button {
    display: block;
    text-align: center;
    padding: 12px;
    background: var(--fcr-blue);
    color: #fff;
    border-radius: 8px;
    font-weight: 700;
    text-decoration: none;
}

/* Documentation de l'API : largeur de lecture, exemples en bloc de code. */
.fcr-doc {
    max-width: 920px;
}

.fcr-doc h2 {
    margin-top: 8px;
}

.fcr-code {
    margin: 4px 0 8px;
    padding: 12px 14px;
    border-radius: 6px;
    background: #1B2430;
    color: #E6EDF3;
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.85rem;
    white-space: pre-wrap;
    overflow-x: auto;
}

/* Simulations (par critères et d'expert) : en-tête, parcours en étapes numérotées (véhicule, estimation, cote),
   cote mise en évidence dans une colonne qui reste visible pendant les ajustements. */
.fcr-sim { max-width: 1120px; margin: 0 auto; }
.fcr-sim-head { margin-bottom: 20px; }
.fcr-sim-sub { margin: 6px 0 0; max-width: 720px; color: var(--fcr-muted); font-size: .98rem; line-height: 1.5; }
.fcr-sim-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 440px); gap: 20px; align-items: start; }
.fcr-sim-column { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.fcr-sim-sticky { position: sticky; top: 80px; }
.fcr-sim-card { border: 1px solid var(--fcr-line); border-radius: 12px; background: var(--fcr-surface); box-shadow: 0 2px 12px rgba(14, 43, 74, .05); overflow: hidden; }
.fcr-sim-card-head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--fcr-line); background: linear-gradient(180deg, #F5F9FD 0%, #EFF5FB 100%); }
.fcr-sim-card-head h2 { margin: 0; font-size: 1.05rem; font-weight: 700; color: var(--fcr-navy); line-height: 1.3; }
.fcr-sim-step { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--fcr-navy); color: #fff; font-size: .85rem; font-weight: 700; }
.fcr-sim-card-hint { margin-left: auto; color: var(--fcr-muted); font-size: .82rem; text-align: right; }
.fcr-sim-card-body { padding: 18px; }
.fcr-sim-card-body .fcr-dec-facts { margin-top: 14px; }
.fcr-sim-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 28px 16px; border: 1px dashed #C6D3DF; border-radius: 10px; color: var(--fcr-muted); text-align: center; font-size: .92rem; line-height: 1.45; }
.fcr-sim-empty .mud-icon-root { color: #9DB3C7; font-size: 2.2rem; }
.fcr-sim-amount { padding: 20px; border-radius: 10px; background: linear-gradient(180deg, #EAF6EE 0%, #E1F1E6 100%); border: 1px solid #B7DCC4; text-align: center; }
.fcr-sim-amount-label { font-size: .78rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #2E5E3E; }
.fcr-sim-amount-value { margin-top: 4px; font-size: clamp(1.7rem, 3vw, 2.2rem); font-weight: 700; color: #1B4D2C; font-variant-numeric: tabular-nums; letter-spacing: -.01em; line-height: 1.15; overflow-wrap: anywhere; }
.fcr-sim-amount-note { margin-top: 6px; font-size: .82rem; color: #2E5E3E; }
.fcr-sim-ref { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px 16px; margin-top: 14px; }
.fcr-sim-ref-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--fcr-muted); font-weight: 700; }
.fcr-sim-ref-value { margin-top: 2px; font-weight: 600; color: var(--fcr-ink); overflow-wrap: anywhere; }
.fcr-sim-steps { margin-top: 14px; }
.fcr-sim-steps .mud-table-cell { padding: 6px 10px; }

@media (max-width: 960px) {
    .fcr-sim-grid { grid-template-columns: 1fr; }
    .fcr-sim-sticky { position: static; }
}

/* Période d'abonnement annulée : conservée dans l'historique, sans effet. */
.fcr-cancelled td {
    color: #8A96A3;
    text-decoration: line-through;
}

.fcr-login-error {
    padding: 10px 12px;
    border-radius: 6px;
    background: #FDECEA;
    color: #8E1C1C;
    font-size: 0.875rem;
}

.fcr-login-card .validation-message {
    color: #C62828;
    font-size: 0.8rem;
    margin-top: 4px;
}

#blazor-error-ui {
    background: #FFF4E5;
    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: 2000;
}

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

/* ===== Page publique (Home + PublicLayout) : rendu statique, styles circonscrits à .fcr-public ===== */
.fcr-public {
    --fcrpub-ink: #15242F;
    --fcrpub-muted: #5A6B7B;
    --fcrpub-navy: #0E2B4A;
    --fcrpub-primary: #1668A8;
    --fcrpub-accent: #5BB0F0;
    --fcrpub-bg: #F3F6FB;
    --fcrpub-card: #FFFFFF;
    --fcrpub-line: #E4EAF1;
    color: var(--fcrpub-ink);
    background: var(--fcrpub-bg);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    line-height: 1.55;
}

.fcr-public a { color: inherit; }
.fcrpub-container { max-width: 1120px; margin: 0 auto; padding: 0 20px; }
.fcrpub-narrow { max-width: 760px; }
.fcrpub-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.fcrpub-nav { position: sticky; top: 0; z-index: 10; background: rgba(19, 40, 63, 0.96); color: #fff; }
.fcrpub-nav-inner { display: flex; align-items: center; gap: 24px; height: 64px; }
.fcrpub-brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.1rem; text-decoration: none; color: #fff; }
.fcrpub-brand-mark { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 6px; background: var(--fcrpub-accent); color: var(--fcrpub-navy); font-weight: 800; }
.fcrpub-nav-links { display: flex; gap: 20px; list-style: none; margin: 0 0 0 auto; padding: 0; }
.fcrpub-nav-links a { text-decoration: none; opacity: 0.85; font-size: 0.95rem; }
.fcrpub-nav-links a:hover { opacity: 1; }
.fcrpub-nav-actions { display: flex; gap: 10px; }

.fcrpub-btn { display: inline-flex; align-items: center; justify-content: center; padding: 9px 16px; border-radius: 6px; border: 1px solid transparent; font-weight: 600; font-size: 0.95rem; text-decoration: none; cursor: pointer; }
.fcrpub-btn-large { padding: 12px 22px; font-size: 1rem; }
.fcrpub-btn-primary { background: var(--fcrpub-accent); color: var(--fcrpub-navy); }
.fcrpub-btn-primary:hover { background: #8CC4F5; }
.fcrpub-btn-secondary { border-color: rgba(255, 255, 255, 0.4); color: #fff; }
.fcrpub-btn-ghost { color: #fff; border-color: rgba(255, 255, 255, 0.25); }
.fcrpub-btn:focus-visible, .fcr-public input:focus-visible, .fcr-public textarea:focus-visible { outline: 2px solid var(--fcrpub-accent); outline-offset: 2px; }
.fcrpub-btn { min-height: 44px; }

.fcrpub-hero { background: radial-gradient(120% 130% at 85% -10%, rgba(91, 176, 240, 0.28) 0%, rgba(91, 176, 240, 0) 55%), linear-gradient(160deg, var(--fcrpub-navy) 0%, #1B4A79 100%); color: #fff; padding: 72px 0 80px; }
.fcrpub-hero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 48px; align-items: center; }
.fcrpub-badge { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; border: 1px solid rgba(255, 255, 255, 0.25); border-radius: 999px; font-size: 0.85rem; }
.fcrpub-badge-dot { width: 8px; height: 8px; border-radius: 50%; background: #5FD39A; }
.fcrpub-hero-title { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.12; margin: 20px 0 16px; letter-spacing: -0.01em; }
.fcrpub-highlight { color: var(--fcrpub-accent); }
.fcrpub-hero-subtitle { font-size: 1.1rem; opacity: 0.88; max-width: 560px; margin: 0 0 28px; }
.fcrpub-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.fcrpub-code { background: #0E1C2C; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 10px; overflow: hidden; }
.fcrpub-code-header { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); font-size: 0.8rem; }
.fcrpub-code-header span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, 0.25); }
.fcrpub-code-header em { margin-left: 8px; font-style: normal; opacity: 0.7; font-family: Consolas, monospace; }
.fcrpub-code pre { margin: 0; padding: 16px 18px; font-family: Consolas, "Courier New", monospace; font-size: 0.85rem; line-height: 1.6; white-space: pre-wrap; color: #DCE6F0; }
.fcrpub-code .c { color: #7E93A8; }
.fcrpub-code .p { color: #9CD3FF; }
.fcrpub-code .s { color: #A6E3B5; }
.fcrpub-code .n { color: #F5C98A; }

.fcrpub-section { padding: 72px 0; }
.fcrpub-section-alt { background: #EAF0F6; }
.fcrpub-label { display: inline-block; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fcrpub-primary); }
.fcrpub-title { font-size: clamp(1.5rem, 2.6vw, 2rem); line-height: 1.2; margin: 8px 0 28px; max-width: 760px; }
.fcrpub-lead { color: var(--fcrpub-muted); margin: -12px 0 24px; }
.fcrpub-grid { display: grid; gap: 20px; }
.fcrpub-grid-2 { grid-template-columns: repeat(2, 1fr); }
.fcrpub-grid-3 { grid-template-columns: repeat(3, 1fr); }
.fcrpub-mt { margin-top: 20px; }
.fcrpub-card { background: var(--fcrpub-card); border: 1px solid var(--fcrpub-line); border-radius: 10px; padding: 24px; }
.fcrpub-card h3 { margin: 0 0 8px; font-size: 1.1rem; }
.fcrpub-card p { margin: 0; color: var(--fcrpub-muted); }
.fcrpub-product ul { margin: 0; padding-left: 18px; color: var(--fcrpub-muted); }
.fcrpub-product li + li { margin-top: 6px; }
.fcrpub-step { font-weight: 800; color: var(--fcrpub-primary); font-size: 0.9rem; margin-bottom: 6px; }

.fcrpub-try { display: flex; gap: 10px; }
.fcrpub-try input { flex: 1; padding: 12px 14px; border: 1px solid #B8C2CC; border-radius: 6px; font-size: 1rem; font-family: Consolas, monospace; text-transform: uppercase; }
.fcrpub-hint { font-size: 0.85rem; color: var(--fcrpub-muted); margin: 10px 0 0; }
.fcrpub-hint code { font-size: 0.85rem; }
.fcrpub-result { margin-top: 20px; background: var(--fcrpub-card); border: 1px solid var(--fcrpub-line); border-radius: 10px; padding: 20px 24px; }
.fcrpub-result-vin { font-family: Consolas, monospace; font-size: 1.1rem; font-weight: 700; margin-bottom: 12px; }
.fcrpub-result dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 20px; margin: 0; }
.fcrpub-result dt { color: var(--fcrpub-muted); }
.fcrpub-result dd { margin: 0; font-weight: 600; }
.fcrpub-result-more { margin: 14px 0 0; font-size: 0.9rem; color: var(--fcrpub-muted); }

.fcrpub-alert { margin-top: 16px; padding: 12px 14px; border-radius: 6px; }
.fcrpub-alert-error { background: #FDECEA; color: #8E1C1C; }
.fcrpub-alert-success { background: #E8F3EC; color: #1B4D2C; }

.fcrpub-form { display: grid; gap: 12px; }
.fcrpub-form label, .fcrpub-form legend { font-size: 0.9rem; font-weight: 600; }
.fcrpub-form input[type=text], .fcrpub-form input[type=email], .fcrpub-form input[type=tel], .fcrpub-form input:not([type]), .fcrpub-form textarea {
    width: 100%; box-sizing: border-box; margin-top: 4px; padding: 10px 12px; border: 1px solid #B8C2CC; border-radius: 6px; font-size: 0.95rem; font-family: inherit;
}
.fcrpub-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.fcrpub-form fieldset { border: 1px solid var(--fcrpub-line); border-radius: 6px; padding: 10px 14px; margin: 0; }
.fcrpub-check { display: flex; align-items: center; gap: 8px; font-weight: 400 !important; margin-top: 4px; }
.fcrpub-form .validation-message { color: #C62828; font-size: 0.8rem; }
.fcrpub-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.fcrpub-footer { background: var(--fcrpub-navy); color: rgba(255, 255, 255, 0.8); padding: 24px 0; font-size: 0.9rem; }
.fcrpub-footer-inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }

@media (max-width: 860px) {
    .fcrpub-hero-grid, .fcrpub-grid-2, .fcrpub-grid-3, .fcrpub-form-row { grid-template-columns: 1fr; }
    .fcrpub-nav-inner { height: auto; min-height: 64px; padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; gap: 10px 16px; }
    .fcrpub-nav-links { order: 3; flex-basis: 100%; margin: 0; gap: 8px 16px; flex-wrap: wrap; }
    .fcrpub-nav-actions { margin-left: auto; }
    .fcrpub-try { flex-direction: column; }
}

@media (max-width: 520px) {
    .fcrpub-container { padding-inline: 16px; }
    .fcrpub-nav-actions .fcrpub-btn-ghost { display: none; }
    .fcrpub-nav-links { font-size: .875rem; }
    .fcrpub-hero { padding: 48px 0 56px; }
    .fcrpub-section { padding: 52px 0; }
    .fcrpub-hero-title { font-size: 2rem; }
    .fcrpub-card { padding: 20px; }
    .fcrpub-form input, .fcrpub-form textarea, .fcrpub-try input { min-height: 44px; }
}

/* Décodeur VIN « rapport » (VinDecoder.razor) : recherche mise en avant, puis identité, faits saillants et blocs groupés. */
.fcr-dec-hero {
    background:
        radial-gradient(120% 140% at 85% -10%, rgba(55, 160, 230, 0.35) 0%, rgba(55, 160, 230, 0) 55%),
        linear-gradient(135deg, var(--fcr-navy) 0%, var(--fcr-navy-2) 100%);
    border-radius: 16px;
    padding: 52px 28px;
    color: #fff;
    text-align: center;
    box-shadow: 0 18px 40px rgba(14, 43, 74, 0.22);
}

.fcr-dec-title { font-size: clamp(1.6rem, 3vw, 2.3rem); font-weight: 700; margin: 0 0 10px; letter-spacing: -0.01em; }
.fcr-dec-sub { max-width: 620px; margin: 0 auto 24px; opacity: 0.85; font-size: 1.02rem; line-height: 1.5; }

.fcr-dec-search {
    display: flex;
    gap: 8px;
    max-width: 640px;
    margin: 0 auto;
    background: #fff;
    padding: 8px;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(9, 24, 38, 0.28);
}

.fcr-dec-search input {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-size: 1.1rem;
    font-family: Consolas, "Courier New", monospace;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 10px 14px;
    color: var(--fcr-ink);
}

.fcr-dec-search button {
    flex: none;
    border: none;
    cursor: pointer;
    background: var(--fcr-blue);
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    padding: 0 26px;
    border-radius: 8px;
}

.fcr-dec-search button:hover:not(:disabled) { background: var(--fcr-blue-strong); }
.fcr-dec-search button:disabled { opacity: 0.5; cursor: not-allowed; }
.fcr-dec-search input:disabled { color: var(--fcr-muted); }

.fcr-dec-examples { margin: 16px 0 0; font-size: 0.85rem; opacity: 0.85; }
.fcr-dec-examples button { background: none; border: none; color: #9FD0F5; font-family: Consolas, "Courier New", monospace; font-size: 0.85rem; cursor: pointer; padding: 0; }
.fcr-dec-examples button:hover:not(:disabled) { text-decoration: underline; }
.fcr-dec-examples button:disabled { opacity: 0.5; cursor: not-allowed; }
.fcr-dec-note { margin: 16px 0 0; font-size: 0.9rem; color: #FFD9A6; }

.fcr-dec-report { margin-top: 28px; }

.fcr-dec-identity {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 24px;
    padding: 22px 26px;
    border: 1px solid var(--fcr-line);
    border-left: 4px solid var(--fcr-blue);
    border-radius: 12px;
    background: var(--fcr-surface);
    box-shadow: 0 4px 16px rgba(14, 43, 74, 0.06);
}

.fcr-dec-identity-main { display: flex; flex-direction: column; gap: 4px; }
.fcr-dec-vehicle { font-size: 1.4rem; font-weight: 700; color: var(--fcr-navy); line-height: 1.1; }
.fcr-dec-vin { font-family: Consolas, "Courier New", monospace; letter-spacing: 0.1em; color: var(--fcr-muted); font-size: 0.95rem; }
.fcr-dec-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }

.fcr-dec-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; font-size: 0.8rem; font-weight: 600; border: 1px solid var(--fcr-line); }
.fcr-dec-badge-ok { background: #E8F3EC; color: #1B4D2C; border-color: #BFE0CA; }
.fcr-dec-badge-warn { background: #FFF4E0; color: #8A5200; border-color: #F0D9AE; }
.fcr-dec-badge-info { background: #EAF3FA; color: #174E79; border-color: #CBE1F2; }

.fcr-dec-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin-top: 16px; }
.fcr-dec-fact {
    border: 1px solid var(--fcr-line);
    border-top: 3px solid var(--fcr-accent);
    border-radius: 12px;
    padding: 16px 18px;
    background: linear-gradient(180deg, #FBFDFF 0%, #F3F8FD 100%);
    box-shadow: 0 2px 10px rgba(14, 43, 74, 0.04);
}
.fcr-dec-fact-label { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--fcr-muted); font-weight: 700; }
.fcr-dec-fact-value { font-size: 1.25rem; font-weight: 700; color: var(--fcr-navy); margin-top: 4px; }

.fcr-dec-sections { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin-top: 16px; align-items: start; }
.fcr-dec-card { border: 1px solid var(--fcr-line); border-radius: 12px; background: var(--fcr-surface); overflow: hidden; box-shadow: 0 2px 12px rgba(14, 43, 74, 0.05); }
.fcr-dec-card-head { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--fcr-line); font-weight: 700; color: var(--fcr-navy); background: linear-gradient(180deg, #F5F9FD 0%, #EFF5FB 100%); }
.fcr-dec-card-head .mud-icon-root { color: var(--fcr-blue); }
.fcr-dec-rows { display: flex; flex-direction: column; }
/* La pastille de provenance ne doit jamais écraser la valeur : sans base ni min-width, un élément flex
   avec « overflow-wrap: anywhere » se réduit à zéro et la valeur se casse lettre par lettre. */
.fcr-dec-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 11px 18px; }
.fcr-dec-row + .fcr-dec-row { border-top: 1px solid #EEF2F6; }
.fcr-dec-row-label { color: var(--fcr-muted); flex: 0 0 38%; min-width: 96px; }
.fcr-dec-row-value { font-weight: 600; color: var(--fcr-ink); flex: 1 1 140px; min-width: 0; overflow-wrap: break-word; }
.fcr-dec-row-prov { flex: 0 0 auto; margin-left: auto; }

@media (max-width: 640px) {
    .fcr-dec-badges { margin-left: 0; }
    .fcr-dec-search { flex-direction: column; }
    .fcr-dec-search button { padding: 12px; }
}

/* Tuiles du tableau de bord de la plateforme. */
.fcr-tile {
    height: 100%;
    font-variant-numeric: tabular-nums;
}

.fcr-tile-attention {
    border-color: #B26A00 !important;
    background: #FFF8EC;
}

/* Console de l'API : liste des points d'accès, méthode en pastille, réponse brute en bloc de code. */
.fcr-console-endpoint {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.875rem;
}

.fcr-console-endpoint:hover {
    background: #F1F4F8;
}

.fcr-console-endpoint.selected {
    background: #E3ECF7;
    font-weight: 600;
}

.fcr-console-endpoint.disabled {
    color: #8A94A3;
}

.fcr-method {
    flex: none;
    min-width: 44px;
    padding: 1px 6px;
    border-radius: 4px;
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.75rem;
    font-weight: 700;
    text-align: center;
    color: #FFFFFF;
    background: #5B6B7F;
}

.fcr-method-get { background: #2E7D4F; }
.fcr-method-post { background: #1F5FA8; }

.fcr-mono,
.fcr-mono textarea {
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.85rem;
}

.fcr-console-body {
    max-height: 480px;
    overflow: auto;
}

.fcr-console-history {
    cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}