/* ============================================================================
   SDR design tokens — palette + utilitaires partagés pour le module SDR-A.
   Référencé depuis :
     - ListFundPage          (J2-T3)
     - ConfigureFundSdrRules (J2-T2)
     - SdrAListPage          (J5-T1)
     - ReportSdrA            (J5-T2)
     - SdrAReportError       (J3-T3)
   Voir Work/maquettes/sdr-01-flow-complet.html pour la spec visuelle.
   ============================================================================ */

:root {
    --sdr-bg-primary:   #ffffff;
    --sdr-bg-secondary: #f5f4ee;
    --sdr-bg-info:      #E6F1FB;
    --sdr-bg-error:     #FDECEC;
    --sdr-bg-warning:   #FFF6E0;
    --sdr-bg-success:   #E7F6EE;

    --sdr-text-primary:   #1a1a1a;
    --sdr-text-secondary: #555;
    --sdr-text-tertiary:  #888;
    --sdr-text-info:      #0C447C;
    --sdr-text-error:     #9C2A2A;
    --sdr-text-warning:   #8A5A00;
    --sdr-text-success:   #1F6A45;

    --sdr-border:        rgba(0,0,0,0.12);
    --sdr-border-strong: rgba(0,0,0,0.22);
    --sdr-accent:        #6C6444;

    --sdr-radius-sm: 6px;
    --sdr-radius-md: 8px;
    --sdr-radius-lg: 12px;
}

/* ---------- Cards ---------- */
.sdr-card {
    background: var(--sdr-bg-primary);
    border: 0.5px solid var(--sdr-border);
    border-radius: var(--sdr-radius-lg);
    padding: 20px;
    margin-bottom: 16px;
}
.sdr-card-compact {
    background: var(--sdr-bg-primary);
    border: 0.5px solid var(--sdr-border);
    border-radius: var(--sdr-radius-lg);
    padding: 14px;
    margin-bottom: 12px;
}
.sdr-card-accent-left { border-left: 3px solid var(--sdr-accent); }
.sdr-card-accent-error { border-left: 3px solid var(--sdr-text-error); }
.sdr-card-accent-warning { border-left: 3px solid var(--sdr-text-warning); }

/* ---------- Badges ---------- */
.sdr-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 999px;
    font-weight: 500;
}
.sdr-badge-error    { background: var(--sdr-bg-error);    color: var(--sdr-text-error); }
.sdr-badge-warning  { background: var(--sdr-bg-warning);  color: var(--sdr-text-warning); }
.sdr-badge-success  { background: var(--sdr-bg-success);  color: var(--sdr-text-success); }
.sdr-badge-info     { background: var(--sdr-bg-info);     color: var(--sdr-text-info); }
.sdr-badge-neutral  { background: var(--sdr-bg-secondary); color: var(--sdr-text-secondary); }

.sdr-badge-cat-client       { background: #E6F1FB; color: #0C447C; }
.sdr-badge-cat-ap           { background: #EFE5FF; color: #5B3CB0; }
.sdr-badge-cat-project      { background: #FFE5E5; color: #9C2A2A; }
.sdr-badge-cat-participant  { background: #E7F6EE; color: #1F6A45; }
.sdr-badge-cat-nfs          { background: #FFEDC2; color: #7A5800; }

/* ---------- Chips (rule codes etc.) ---------- */
.sdr-chip {
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    font-size: 10px;
    padding: 1px 6px;
    border-radius: var(--sdr-radius-sm);
    background: var(--sdr-bg-secondary);
    color: var(--sdr-text-tertiary);
    border: 0.5px solid var(--sdr-border);
}

/* ---------- Pill-toggle (Error/Warning/None, All/Errors/Warnings, etc.) ---------- */
.sdr-pill-toggle {
    display: inline-flex;
    background: var(--sdr-bg-secondary);
    border-radius: 999px;
    padding: 3px;
    gap: 2px;
}
.sdr-pill-toggle .opt {
    font-size: 11px;
    padding: 5px 12px;
    border-radius: 999px;
    color: var(--sdr-text-secondary);
    cursor: pointer;
    user-select: none;
    border: 0;
    background: transparent;
}
.sdr-pill-toggle .opt.active {
    background: var(--sdr-bg-primary);
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
    font-weight: 500;
    color: var(--sdr-text-primary);
}
.sdr-pill-toggle .opt.error.active   { background: var(--sdr-bg-error);   color: var(--sdr-text-error); }
.sdr-pill-toggle .opt.warning.active { background: var(--sdr-bg-warning); color: var(--sdr-text-warning); }
.sdr-pill-toggle .opt.none.active    { background: var(--sdr-bg-secondary); color: var(--sdr-text-secondary); font-style: italic; }

/* ---------- Stat-cards ---------- */
.sdr-stat-card {
    padding: 14px 18px;
    border-radius: var(--sdr-radius-md);
    background: var(--sdr-bg-primary);
    border: 0.5px solid var(--sdr-border);
    min-width: 110px;
}
.sdr-stat-card .val { font-size: 26px; font-weight: 600; line-height: 1.1; }
.sdr-stat-card .lbl { font-size: 11px; color: var(--sdr-text-tertiary); text-transform: uppercase; letter-spacing: 0.5px; margin-top: 4px; }
.sdr-stat-card .val.error   { color: var(--sdr-text-error); }
.sdr-stat-card .val.warning { color: var(--sdr-text-warning); }
.sdr-stat-card .val.info    { color: var(--sdr-text-info); }

/* ---------- Tab bar ---------- */
.sdr-tab-bar {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid var(--sdr-border);
    margin-bottom: 16px;
}
.sdr-tab {
    padding: 9px 14px;
    font-size: 13px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    color: var(--sdr-text-secondary);
    background: transparent;
    border-left: 0;
    border-right: 0;
    border-top: 0;
}
.sdr-tab.active {
    border-bottom-color: var(--sdr-accent);
    color: var(--sdr-text-primary);
    font-weight: 500;
}

/* ---------- Buttons ---------- */
.sdr-btn {
    font-family: inherit;
    font-size: 13px;
    background: transparent;
    border: 0.5px solid var(--sdr-border-strong);
    border-radius: var(--sdr-radius-md);
    padding: 8px 14px;
    cursor: pointer;
    color: var(--sdr-text-primary);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
}
.sdr-btn:hover { background: var(--sdr-bg-secondary); }
.sdr-btn-primary {
    background: var(--sdr-accent);
    color: white;
    border-color: var(--sdr-accent);
}
.sdr-btn-primary:hover { background: #5a533a; color: white; }
.sdr-btn-subtle {
    border: 0;
    color: var(--sdr-text-info);
    padding: 6px 10px;
}

/* ---------- Toolbar ---------- */
.sdr-toolbar {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.sdr-toolbar input[type=text],
.sdr-toolbar input[type=search],
.sdr-toolbar select {
    font-family: inherit;
    font-size: 13px;
    padding: 7px 10px;
    border: 0.5px solid var(--sdr-border);
    border-radius: var(--sdr-radius-md);
    background: white;
}
.sdr-toolbar .meta { font-size: 11px; color: var(--sdr-text-tertiary); }

/* ---------- Layout helpers ---------- */
.sdr-row     { display: flex; gap: 12px; flex-wrap: wrap; }
.sdr-row > * { flex: 1; min-width: 0; }
.sdr-divider { height: 1px; background: var(--sdr-border); margin: 12px 0; }

.sdr-breadcrumb { font-size: 11px; color: var(--sdr-text-tertiary); margin-bottom: 4px; }
.sdr-breadcrumb a { color: var(--sdr-text-info); text-decoration: none; }
