/* Fiche client - même look que DemandePageRapide (HTML pur) */
.fc-page, .fc-modal-overlay {
    --clr-header: #1e3a5f;
    --clr-accent: #2563eb;
    --clr-border: #e2e8f0;
    --clr-muted: #64748b;
    --clr-card: #ffffff;
    --radius: 12px;
    --shadow: 0 2px 8px rgba(15,23,42,.07);
}

.fc-page { padding: .5rem; }

/* ── En-tête ── */
.fc-header { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; background: linear-gradient(135deg, #1e3a5f, #2563eb); color: #fff; border-radius: var(--radius); padding: 1rem 1.5rem; box-shadow: var(--shadow); margin-bottom: 1rem; }
.fc-header-left { display: flex; align-items: center; gap: 1rem; flex: 1; min-width: 220px; }
.fc-avatar { width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.2); border: 2px solid rgba(255,255,255,.7); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; font-weight: 700; flex: 0 0 auto; }
.fc-title { margin: 0; font-size: 1.3rem; font-weight: 700; color: #fff; }
.fc-subtitle { font-size: .85rem; opacity: .85; }
.fc-actions { display: flex; gap: .5rem; flex-wrap: wrap; }

/* ── Boutons ── */
.fc-btn { border: none; border-radius: 7px; padding: .45rem 1.1rem; font-size: .85rem; font-weight: 600; cursor: pointer; transition: all .15s; }
.fc-btn-primary { background: #fff; color: var(--clr-accent); }
.fc-btn-primary:hover { background: #dbeafe; }
.fc-btn-outline { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.5); }
.fc-btn-outline:hover { border-color: #fff; }
.fc-card .fc-btn-primary, .fc-modal .fc-btn-primary { background: var(--clr-accent); color: #fff; }
.fc-card .fc-btn-primary:hover, .fc-modal .fc-btn-primary:hover { background: #1d4ed8; }
.fc-card .fc-btn-outline, .fc-modal .fc-btn-outline { color: var(--clr-muted); border-color: var(--clr-border); }
.fc-card .fc-btn-outline:hover, .fc-modal .fc-btn-outline:hover { border-color: var(--clr-accent); color: var(--clr-accent); }
.fc-btn-add { background: #f0f7ff; color: var(--clr-accent); border: 2px dashed var(--clr-accent); border-radius: 8px; padding: .5rem 1.2rem; font-size: .85rem; font-weight: 600; cursor: pointer; width: 100%; margin-top: .6rem; }
.fc-btn-add:hover { background: #dbeafe; }
.fc-btn-icon { background: none; border: none; font-size: 1rem; cursor: pointer; padding: .2rem .4rem; border-radius: 5px; }
.fc-btn-icon.edit:hover { background: #dbeafe; }
.fc-btn-icon.delete:hover { background: #fee2e2; }

/* ── Cartes ── */
.fc-card { background: var(--clr-card); border-radius: var(--radius); border: 1px solid var(--clr-border); box-shadow: var(--shadow); margin-bottom: 1rem; overflow: hidden; }
.fc-card-title { display: flex; align-items: center; gap: .6rem; margin: 0; padding: .9rem 1.4rem; font-size: 1rem; font-weight: 700; color: var(--clr-header); background: linear-gradient(135deg, #f8fafc, #f1f5f9); border-bottom: 1px solid var(--clr-border); }
.fc-card-title .fc-num { width: 26px; height: 26px; border-radius: 50%; background: var(--clr-header); color: #fff; display: flex; align-items: center; justify-content: center; font-size: .78rem; flex-shrink: 0; }
.fc-card-body { padding: 1.2rem 1.4rem; }
.fc-card-active { border-color: var(--clr-accent); }

/* ── Indicateurs ── */
.fc-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .8rem; }
.fc-kpi { border-radius: 10px; padding: .75rem 1rem; background: #f8fafc; border: 1px solid var(--clr-border); border-left: 4px solid var(--clr-accent); }
.fc-kpi-label { font-size: .73rem; color: var(--clr-muted); text-transform: uppercase; letter-spacing: .03em; }
.fc-kpi-value { font-size: 1.2rem; font-weight: 700; color: var(--clr-header); }
.fc-kpi.ok { border-left-color: #16a34a; } .fc-kpi.ok .fc-kpi-value { color: #15803d; }
.fc-kpi.warn { border-left-color: #d97706; } .fc-kpi.warn .fc-kpi-value { color: #d97706; }
.fc-kpi.danger { border-left-color: #dc2626; } .fc-kpi.danger .fc-kpi-value { color: #dc2626; }

/* ── Lignes d'information ── */
.fc-info-line { display: flex; gap: .6rem; padding: .4rem 0; border-bottom: 1px dashed var(--clr-border); font-size: .9rem; }
.fc-info-line:last-child { border-bottom: none; }
.fc-info-label { color: var(--clr-muted); min-width: 140px; font-weight: 600; font-size: .82rem; }

/* ── Champs ── */
.fc-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: .9rem 1rem; }
.fc-field { display: flex; flex-direction: column; gap: .35rem; grid-column: span 12; }
.fc-c3 { grid-column: span 3; } .fc-c4 { grid-column: span 4; } .fc-c6 { grid-column: span 6; } .fc-c8 { grid-column: span 8; }
@media (max-width: 992px) { .fc-c3, .fc-c4, .fc-c6, .fc-c8 { grid-column: span 12; } }
.fc-label { font-size: .82rem; font-weight: 600; color: var(--clr-header); }
.fc-input { width: 100%; border: 1.5px solid var(--clr-border); border-radius: 7px; padding: .45rem .7rem; font-size: .9rem; background: #fff; transition: border-color .15s, box-shadow .15s; }
.fc-input:focus { outline: none; border-color: var(--clr-accent); box-shadow: 0 0 0 3px rgba(37,99,235,.15); }
textarea.fc-input { resize: vertical; }
.fc-check { display: flex; align-items: center; gap: .5rem; font-size: .9rem; padding-top: 1.5rem; }

/* ── Choix visuel (type de client) ── */
.fc-radio-group { display: flex; gap: .5rem; flex-wrap: wrap; }
.fc-radio-btn { padding: .5rem 1.1rem; border-radius: 7px; border: 2px solid var(--clr-border); background: #f8fafc; font-size: .85rem; font-weight: 600; color: var(--clr-muted); cursor: pointer; transition: all .15s; }
.fc-radio-btn:hover { border-color: var(--clr-accent); color: var(--clr-accent); background: #eff6ff; }
.fc-radio-btn.active { border-color: var(--clr-accent); background: #dbeafe; color: var(--clr-accent); }

/* ── Onglets ── */
.fc-tabs { display: flex; gap: .3rem; flex-wrap: wrap; padding: .6rem 1.4rem 0; border-bottom: 1px solid var(--clr-border); }
.fc-tab { background: none; border: none; border-bottom: 3px solid transparent; padding: .5rem 1rem; font-size: .88rem; font-weight: 600; color: var(--clr-muted); cursor: pointer; }
.fc-tab:hover { color: var(--clr-accent); }
.fc-tab.active { color: var(--clr-accent); border-bottom-color: var(--clr-accent); }

/* ── Tableaux ── */
.fc-table-wrap { overflow-x: auto; }
.fc-table { width: 100%; border-collapse: collapse; font-size: .87rem; }
.fc-table th { text-align: left; background: #f1f5f9; color: var(--clr-header); font-weight: 700; padding: .55rem .8rem; border-bottom: 2px solid var(--clr-border); white-space: nowrap; }
.fc-table td { padding: .5rem .8rem; border-bottom: 1px solid var(--clr-border); }
.fc-table tbody tr:hover { background: #f0f5ff; }
.fc-table .num { text-align: right; white-space: nowrap; }
.fc-table .actions { width: 90px; text-align: right; white-space: nowrap; }
.fc-empty { text-align: center; color: var(--clr-muted); padding: 1rem; font-style: italic; }
.fc-badge { display: inline-block; border-radius: 20px; padding: .1rem .6rem; font-size: .72rem; font-weight: 700; background: #dcfce7; color: #15803d; }

/* ── Fenêtres modales ── */
.fc-modal-overlay { position: fixed; inset: 0; background: rgba(15,23,42,.45); display: flex; align-items: center; justify-content: center; z-index: 2000; padding: 1rem; }
.fc-modal { background: #fff; border-radius: var(--radius); box-shadow: 0 10px 40px rgba(15,23,42,.3); width: min(680px, 100%); max-height: 92vh; display: flex; flex-direction: column; overflow: hidden; }
.fc-modal-header { padding: .9rem 1.4rem; background: linear-gradient(135deg, #1e3a5f, #2563eb); color: #fff; font-weight: 700; }
.fc-modal-body { padding: 1.2rem 1.4rem; overflow-y: auto; }
.fc-modal-footer { display: flex; justify-content: flex-end; gap: .5rem; padding: .8rem 1.4rem; border-top: 1px solid var(--clr-border); }