/* =========================================================
   Espace client KarodIA — palette alignée sur le CRM
   navy #0f1f5c | blue #4b7cf4 | bg #f4f7ff
   ========================================================= */

:root {
    --navy:      #0f1f5c;
    --navy-mid:  #1a2d6e;
    --blue:      #4b7cf4;
    --blue-soft: #eef2fe;
    --bg:        #f4f7ff;
    --fg-dim:    #4a5a80;
    --fg-mute:   #8290b0;
    --line:      #dce5f5;

    --bs-body-font-family: 'Inter', system-ui, -apple-system, sans-serif;
    --bs-body-color: var(--navy);
    /* Fond des composants (cartes, tableaux, listes) : blanc. Le fond bleuté ne
       s'applique qu'à la page (body ci-dessous). */
    --bs-body-bg: #ffffff;
    --bs-primary: var(--blue);
    --bs-primary-rgb: 75, 124, 244;
    --bs-link-color: var(--blue);
    --bs-link-color-rgb: 75, 124, 244;
    --bs-link-hover-color: #3a6ae0;
    --bs-border-color: var(--line);
}

body { font-size: 15px; -webkit-font-smoothing: antialiased; background-color: var(--bg); }

.btn-primary {
    --bs-btn-bg: var(--navy);
    --bs-btn-border-color: var(--navy);
    --bs-btn-hover-bg: var(--navy-mid);
    --bs-btn-hover-border-color: var(--navy-mid);
    --bs-btn-active-bg: var(--navy-mid);
    --bs-btn-active-border-color: var(--navy-mid);
}
.btn-outline-primary {
    --bs-btn-color: var(--navy);
    --bs-btn-border-color: var(--line);
    --bs-btn-hover-bg: var(--blue-soft);
    --bs-btn-hover-color: var(--navy);
    --bs-btn-hover-border-color: var(--blue);
    --bs-btn-active-bg: var(--blue-soft);
    --bs-btn-active-color: var(--navy);
}

/* ── Barre de navigation ── */
.portal-nav { background: var(--navy); }
.portal-nav .navbar-brand img { height: 34px; }
.portal-nav .nav-link { color: rgba(255,255,255,.72); font-weight: 500; border-radius: 8px; padding: .45rem .85rem !important; }
.portal-nav .nav-link:hover { color: #fff; background: rgba(255,255,255,.08); }
.portal-nav .nav-link.active { color: #fff; background: rgba(255,255,255,.14); }
.portal-nav .navbar-toggler { border-color: rgba(255,255,255,.25); }
.portal-nav .client-name { color: rgba(255,255,255,.6); font-size: 13px; }

.preview-banner {
    background: #fef3c7; color: #92400e; font-size: 14px;
    border-bottom: 1px solid #fcd34d;
}

/* ── Contenu ── */
.page-title { font-size: 1.5rem; font-weight: 700; margin: 0; }
.page-sub { color: var(--fg-dim); font-size: 14px; }

.card {
    --bs-card-bg: #ffffff;
    border: 1px solid var(--line); border-radius: 14px;
    box-shadow: 0 1px 3px rgba(15,31,92,.06), 0 4px 14px rgba(15,31,92,.04);
    overflow: hidden; /* les tableaux et listes suivent les coins arrondis */
}
.card-header { background: transparent; border-bottom: 1px solid var(--line); padding: 1rem 1.25rem; font-weight: 600; }

.kpi { padding: 1.25rem; }
.kpi .kpi-label { color: var(--fg-mute); font-size: 13px; font-weight: 500; text-transform: uppercase; letter-spacing: .03em; }
.kpi .kpi-value { font-size: 1.6rem; font-weight: 700; font-variant-numeric: tabular-nums; margin-top: .25rem; }
.kpi .kpi-icon {
    width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
    font-size: 1.2rem; background: var(--blue-soft); color: var(--blue);
}
.kpi.kpi-alert .kpi-icon { background: #fee2e2; color: #dc2626; }
.kpi.kpi-ok .kpi-icon { background: #dcfce7; color: #16a34a; }

.table { --bs-table-color: var(--navy); margin-bottom: 0; }
.table thead th {
    color: var(--fg-mute); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
    background: #fafbff; border-bottom-width: 1px; white-space: nowrap;
}
.table td, .table th { padding: .8rem 1rem; vertical-align: middle; }
.table tbody tr:last-child td { border-bottom: 0; }
.table-hover tbody tr { cursor: pointer; }
.amount { font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.ref { font-weight: 600; color: var(--navy); text-decoration: none; }
.ref:hover { color: var(--blue); }

.status-badge { font-weight: 600; font-size: 12px; padding: .38em .8em; }
.text-bg-warning { color: #92400e !important; background-color: #fef3c7 !important; }
.text-bg-success { color: #166534 !important; background-color: #dcfce7 !important; }
.text-bg-danger { color: #991b1b !important; background-color: #fee2e2 !important; }
.text-bg-info { color: #1e40af !important; background-color: #dbeafe !important; }
.text-bg-secondary { color: #475569 !important; background-color: #e2e8f0 !important; }
.text-bg-primary { color: #3730a3 !important; background-color: #e0e7ff !important; }

.filter-pills .btn { border-radius: 999px; font-size: 13px; padding: .3rem .9rem; }

.empty-state { padding: 3rem 1rem; text-align: center; color: var(--fg-mute); }
.empty-state i { font-size: 2rem; display: block; margin-bottom: .5rem; opacity: .5; }

.doc-meta dt { color: var(--fg-mute); font-weight: 500; font-size: 13px; }
.doc-meta dd { font-weight: 600; margin-bottom: .75rem; }
.line-desc { color: var(--fg-dim); font-size: 13px; margin-top: .25rem; }
.line-desc p { margin-bottom: .25rem; }
.totals td { padding: .45rem 0; }
.totals .grand td { font-size: 1.1rem; font-weight: 700; border-top: 1px solid var(--line); padding-top: .7rem; }

/* ── Pages invité (connexion) ── */
.guest-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; }
.guest-card { width: 100%; max-width: 420px; }
.guest-card .card-body { padding: 2.25rem; }
.guest-logo { height: 46px; margin-bottom: 1.5rem; }

footer.portal-footer { color: var(--fg-mute); font-size: 13px; }

@media (max-width: 767.98px) {
    .kpi .kpi-value { font-size: 1.3rem; }
    .table td, .table th { padding: .65rem .75rem; }
}