/* ============================================================
   ALPHAVAULT CRM — crm-fundraising.css v1.0
   LP Fundraising Pipeline — Styles spécifiques
   Étend crm-dashboard.css (importé avant ce fichier)
   Light mode default · Dark mode via body.crm-dark-mode
   100% responsive PC/Mobile · GPU-accelerated
   ============================================================ */

/* ════════════════════════════════════════════════════════════
   0. VARIABLES SUPPLÉMENTAIRES
   (manquantes dans crm-dashboard.css, utilisées par le JS)
════════════════════════════════════════════════════════════ */
:root {
    --crm-hover      : rgba(0, 0, 0, 0.04);
    --crm-widget-bg  : #ffffff;
    --fr-green       : #10b981;
    --fr-green-dark  : #059669;
    --fr-amber       : #f59e0b;
    --fr-red         : #ef4444;
    --fr-purple      : #8b5cf6;
    --fr-cyan        : #06b6d4;
    --fr-orange      : #f97316;
    --fr-radius      : 10px;
    --fr-radius-lg   : 16px;
    --fr-transition  : all 0.2s ease;
}

body.crm-dark-mode {
    --crm-hover      : rgba(255, 255, 255, 0.05);
    --crm-widget-bg  : rgba(30, 41, 59, 0.85);
}

/* ════════════════════════════════════════════════════════════
   1. FR KPI GRID — 8 métriques fundraising
════════════════════════════════════════════════════════════ */

/* Override crm-kpi-grid pour 8 cartes sur 4 colonnes */
#frKPICards.crm-kpi-grid {
    grid-template-columns: repeat(4, 1fr);
}

.fr-kpi-card {
    background    : var(--crm-surface);
    border        : 1px solid var(--crm-border);
    border-radius : var(--fr-radius-lg);
    padding       : 18px;
    position      : relative;
    overflow      : hidden;
    cursor        : pointer;
    transition    : var(--fr-transition);
    display       : flex;
    flex-direction: column;
    gap           : 4px;
    will-change   : transform;
}

.fr-kpi-card:hover {
    border-color: var(--crm-border-hover);
    transform   : translateY(-2px);
    box-shadow  : var(--crm-shadow);
}

.fr-kpi-icon {
    width        : 40px;
    height       : 40px;
    border-radius: 10px;
    display      : flex;
    align-items  : center;
    justify-content: center;
    font-size    : 16px;
    color        : #fff;
    flex-shrink  : 0;
    margin-bottom: 8px;
}

.fr-kpi-value {
    font-size  : 22px;
    font-weight: 900;
    color      : var(--crm-text);
    line-height: 1.2;
    margin-top : 2px;
}

.fr-kpi-label {
    font-size  : 11px;
    font-weight: 700;
    color      : var(--crm-text-muted);
}

.fr-kpi-sub {
    font-size : 10px;
    color     : var(--crm-text-faint);
    margin-top: 2px;
}

/* ════════════════════════════════════════════════════════════
   2. FUND SELECTOR TABS
════════════════════════════════════════════════════════════ */

.fr-fund-tabs-wrap {
    display   : flex;
    align-items: center;
    gap        : 6px;
    overflow-x : auto;
    padding-bottom: 2px;
}

.fr-fund-tabs-wrap::-webkit-scrollbar { height: 0; }

.fr-fund-tab {
    display        : flex;
    flex-direction : column;
    gap            : 3px;
    align-items    : flex-start;
    padding        : 8px 14px;
    border-radius  : var(--fr-radius);
    background     : var(--crm-input-bg);
    border         : 1px solid var(--crm-border);
    font-family    : inherit;
    font-size      : 12px;
    font-weight    : 700;
    color          : var(--crm-text-muted);
    cursor         : pointer;
    transition     : var(--fr-transition);
    white-space    : nowrap;
    min-width      : 80px;
    position       : relative;
    flex-shrink    : 0;
}

.fr-fund-tab:hover {
    background  : rgba(102, 126, 234, 0.06);
    color       : var(--crm-text);
    border-color: rgba(102, 126, 234, 0.2);
}

.fr-fund-tab.active {
    background  : rgba(102, 126, 234, 0.08);
    color       : var(--crm-primary);
    border-color: rgba(102, 126, 234, 0.25);
    border-bottom: 3px solid var(--crm-primary);
}

.fr-fund-tab-count {
    display        : inline-flex;
    align-items    : center;
    justify-content: center;
    font-size      : 9px;
    font-weight    : 800;
    padding        : 1px 6px;
    border-radius  : 20px;
    background     : rgba(102, 126, 234, 0.12);
    color          : var(--crm-primary);
    min-width      : 20px;
}

.fr-fund-tab-progress-bar {
    width        : 100%;
    height       : 3px;
    background   : rgba(0, 0, 0, 0.06);
    border-radius: 2px;
    overflow     : hidden;
    margin-top   : 2px;
}

.fr-fund-tab-add {
    width          : 36px;
    min-width      : 36px;
    height         : 36px;
    padding        : 0;
    align-items    : center;
    justify-content: center;
    background     : var(--crm-input-bg);
    border         : 1px dashed var(--crm-border);
    border-radius  : var(--fr-radius);
    color          : var(--crm-text-faint);
    cursor         : pointer;
    transition     : var(--fr-transition);
    display        : flex;
    font-size      : 14px;
    flex-shrink    : 0;
}

.fr-fund-tab-add:hover {
    background  : rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.3);
    color       : var(--fr-green);
}

.fr-fund-selector-empty {
    display    : flex;
    align-items: center;
    gap        : 10px;
    padding    : 8px 4px;
    color      : var(--crm-text-faint);
}

/* ════════════════════════════════════════════════════════════
   3. PROGRESS SECTION
   Thermomètre | Commit breakdown | Stage pipeline bars
════════════════════════════════════════════════════════════ */

.fr-progress-body {
    display  : flex;
    gap      : 24px;
    align-items: flex-start;
    flex-wrap: wrap;
}

/* ── Thermomètre vertical ────────────────────────────────── */
.fr-thermometer-wrap {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    gap            : 12px;
    flex-shrink    : 0;
    min-width      : 90px;
}

.fr-thermometer {
    width        : 28px;
    height       : 160px;
    background   : var(--crm-input-bg);
    border-radius: 14px;
    position     : relative;
    overflow     : hidden;
    border       : 1px solid var(--crm-border);
    flex-shrink  : 0;
}

.fr-thermometer-fill {
    position      : absolute;
    bottom        : 0;
    left          : 0;
    right         : 0;
    border-radius : 0 0 14px 14px;
    transition    : height 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
    min-height    : 4px;
}

.fr-thermo-glow {
    position     : absolute;
    top          : 0;
    left         : 50%;
    transform    : translateX(-50%);
    width        : 18px;
    height       : 18px;
    border-radius: 50%;
    opacity      : 0.4;
    filter       : blur(8px);
    animation    : crmPulse 2s ease-in-out infinite;
}

.fr-thermo-marker {
    position   : absolute;
    right      : 100%;
    display    : flex;
    align-items: center;
    gap        : 3px;
    transform  : translateY(50%);
    font-size  : 8px;
    color      : var(--crm-text-faint);
    font-weight: 600;
    white-space: nowrap;
    padding-right: 6px;
}

.fr-thermo-info {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    gap            : 2px;
    text-align     : center;
}

.fr-thermo-pct {
    font-size  : 20px;
    font-weight: 900;
    line-height: 1;
}

.fr-thermo-label {
    font-size     : 9px;
    font-weight   : 700;
    color         : var(--crm-text-faint);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.fr-thermo-amount {
    font-size  : 12px;
    font-weight: 800;
    color      : var(--crm-text);
    margin-top : 4px;
}

/* ── Commit Breakdown Bars ───────────────────────────────── */
.fr-commit-breakdown {
    flex      : 1;
    min-width : 220px;
    display   : flex;
    flex-direction: column;
    gap       : 10px;
}

.fr-commit-row {
    display    : flex;
    align-items: center;
    gap        : 8px;
}

.fr-commit-dot {
    width        : 8px;
    height       : 8px;
    border-radius: 50%;
    flex-shrink  : 0;
}

.fr-commit-label {
    font-size : 11px;
    font-weight: 600;
    color     : var(--crm-text-muted);
    min-width : 90px;
    flex-shrink: 0;
}

.fr-commit-bar-wrap {
    flex         : 1;
    height       : 6px;
    background   : var(--crm-input-bg);
    border-radius: 3px;
    overflow     : hidden;
}

.fr-commit-bar {
    height       : 100%;
    border-radius: 3px;
    transition   : width 0.6s ease;
    min-width    : 2px;
}

.fr-commit-amount {
    font-size : 11px;
    font-weight: 800;
    color     : var(--crm-text);
    min-width : 48px;
    text-align: right;
    flex-shrink: 0;
}

.fr-commit-count {
    font-size : 11px;
    font-weight: 800;
    min-width : 20px;
    text-align: right;
    flex-shrink: 0;
}

/* ── Stage Pipeline Mini Bars ────────────────────────────── */
.fr-stage-mini-bars {
    flex      : 1;
    min-width : 200px;
    display   : flex;
    flex-direction: column;
    gap       : 6px;
}

.fr-stage-mini-row {
    display    : flex;
    align-items: center;
    gap        : 8px;
    padding    : 4px 6px;
    border-radius: 6px;
    transition : var(--fr-transition);
    cursor     : pointer;
}

.fr-stage-mini-row:hover { background: var(--crm-hover); }

/* ── Countdown Badge ─────────────────────────────────────── */
.fr-countdown-badge {
    display    : inline-flex;
    align-items: center;
    gap        : 5px;
    font-size  : 10px;
    font-weight: 800;
    padding    : 3px 10px;
    border-radius: 20px;
    white-space: nowrap;
}

/* ════════════════════════════════════════════════════════════
   4. TAB NAVIGATION
   Pipeline | Roadshow | Documents | Analytics | Track Record
════════════════════════════════════════════════════════════ */

.fr-tab-nav {
    display      : flex;
    gap          : 4px;
    margin-bottom: 14px;
    background   : var(--crm-surface);
    border       : 1px solid var(--crm-border);
    border-radius: var(--fr-radius-lg);
    padding      : 6px;
    overflow-x   : auto;
    flex-shrink  : 0;
}

.fr-tab-nav::-webkit-scrollbar { height: 0; }

.fr-tab-btn {
    display     : inline-flex;
    align-items : center;
    gap         : 7px;
    padding     : 8px 14px;
    border-radius: var(--fr-radius);
    font-family : inherit;
    font-size   : 12px;
    font-weight : 700;
    color       : var(--crm-text-muted);
    cursor      : pointer;
    background  : none;
    border      : 1px solid transparent;
    transition  : var(--fr-transition);
    white-space : nowrap;
    flex-shrink : 0;
}

.fr-tab-btn:hover {
    background: var(--crm-input-bg);
    color     : var(--crm-text);
}

.fr-tab-btn.active {
    background  : rgba(102, 126, 234, 0.1);
    color       : var(--crm-primary);
    border-color: rgba(102, 126, 234, 0.2);
}

.fr-tab-badge {
    display        : inline-flex;
    align-items    : center;
    justify-content: center;
    font-size      : 9px;
    font-weight    : 800;
    padding        : 1px 6px;
    border-radius  : 20px;
    background     : rgba(102, 126, 234, 0.15);
    color          : var(--crm-primary);
    min-width      : 18px;
}

/* ════════════════════════════════════════════════════════════
   5. FILTERS BAR
════════════════════════════════════════════════════════════ */

.fr-filters-bar {
    display      : flex;
    align-items  : center;
    gap          : 8px;
    flex-wrap    : wrap;
    padding      : 12px 14px;
    background   : var(--crm-surface);
    border       : 1px solid var(--crm-border);
    border-radius: var(--fr-radius-lg);
    margin-bottom: 14px;
}

.fr-search-wrap {
    position  : relative;
    min-width : 200px;
    flex-shrink: 0;
}

.fr-search-icon {
    position       : absolute;
    left           : 10px;
    top            : 50%;
    transform      : translateY(-50%);
    color          : var(--crm-text-faint);
    font-size      : 11px;
    pointer-events : none;
    z-index        : 1;
}

.fr-search-input {
    width        : 100%;
    background   : var(--crm-input-bg);
    border       : 1px solid var(--crm-border);
    border-radius: 8px;
    padding      : 7px 28px 7px 30px;
    font-family  : inherit;
    font-size    : 12px;
    color        : var(--crm-text);
    outline      : none;
    transition   : var(--fr-transition);
}

.fr-search-input::placeholder { color: var(--crm-text-faint); }

.fr-search-input:focus {
    border-color: var(--crm-primary);
    box-shadow  : 0 0 0 3px rgba(102, 126, 234, 0.12);
}

.fr-filter-select {
    background     : var(--crm-input-bg);
    border         : 1px solid var(--crm-border);
    border-radius  : 8px;
    padding        : 7px 26px 7px 10px;
    font-family    : inherit;
    font-size      : 11px;
    font-weight    : 700;
    color          : var(--crm-text-muted);
    cursor         : pointer;
    outline        : none;
    transition     : var(--fr-transition);
    appearance     : none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2394a3b8' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
    background-repeat  : no-repeat;
    background-position: right 8px center;
    min-width      : 120px;
}

.fr-filter-select:focus {
    border-color: var(--crm-primary);
    box-shadow  : 0 0 0 3px rgba(102, 126, 234, 0.12);
}

.fr-filter-select.fr-filter-active {
    border-color    : rgba(102, 126, 234, 0.4);
    background-color: rgba(102, 126, 234, 0.06);
    color           : var(--crm-primary);
}

.fr-filter-toggle-btn {
    display    : inline-flex;
    align-items: center;
    gap        : 5px;
    padding    : 7px 12px;
    background : var(--crm-input-bg);
    border     : 1px solid var(--crm-border);
    border-radius: 8px;
    font-family: inherit;
    font-size  : 11px;
    font-weight: 700;
    color      : var(--crm-text-muted);
    cursor     : pointer;
    transition : var(--fr-transition);
    white-space: nowrap;
    flex-shrink: 0;
}

.fr-filter-toggle-btn:hover {
    background  : rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.25);
    color       : var(--fr-green);
}

.fr-filter-toggle-btn.fr-filter-active {
    background  : rgba(16, 185, 129, 0.12);
    border-color: rgba(16, 185, 129, 0.35);
    color       : var(--fr-green);
}

.fr-results-count {
    font-size  : 11px;
    font-weight: 700;
    color      : var(--crm-text-faint);
    white-space: nowrap;
    flex-shrink: 0;
}

.fr-clear-filters-btn {
    display    : inline-flex;
    align-items: center;
    gap        : 4px;
    padding    : 6px 10px;
    background : rgba(239, 68, 68, 0.08);
    border     : 1px solid rgba(239, 68, 68, 0.2);
    border-radius: 8px;
    font-family: inherit;
    font-size  : 11px;
    font-weight: 700;
    color      : var(--fr-red);
    cursor     : pointer;
    transition : var(--fr-transition);
    white-space: nowrap;
    flex-shrink: 0;
}

.fr-clear-filters-btn:hover { background: rgba(239, 68, 68, 0.15); }

/* ════════════════════════════════════════════════════════════
   6. STAGNANT ALERT
════════════════════════════════════════════════════════════ */

.fr-stagnant-alert {
    display     : flex;
    align-items : center;
    gap         : 10px;
    padding     : 10px 14px;
    background  : rgba(245, 158, 11, 0.06);
    border      : 1px solid rgba(245, 158, 11, 0.2);
    border-left : 3px solid var(--fr-amber);
    border-radius: var(--fr-radius);
    font-size   : 12px;
    color       : var(--crm-text-muted);
    font-weight : 600;
    margin-bottom: 12px;
    flex-wrap   : wrap;
}

.fr-inline-btn {
    display    : inline-flex;
    align-items: center;
    gap        : 4px;
    padding    : 4px 8px;
    border-radius: 6px;
    border     : 1px solid currentColor;
    background : none;
    font-family: inherit;
    font-size  : 10px;
    font-weight: 700;
    cursor     : pointer;
    transition : var(--fr-transition);
    color      : var(--crm-primary);
    opacity    : 0.85;
}

.fr-inline-btn:hover {
    opacity   : 1;
    background: rgba(102, 126, 234, 0.08);
}

/* ════════════════════════════════════════════════════════════
   7. KANBAN BOARD
════════════════════════════════════════════════════════════ */

.fr-kanban-board {
    display   : flex;
    gap       : 12px;
    overflow-x: auto;
    padding   : 4px 0 14px;
    align-items: flex-start;
    min-height: 400px;
    -webkit-overflow-scrolling: touch;
}

.fr-kanban-board::-webkit-scrollbar { height: 5px; }
.fr-kanban-board::-webkit-scrollbar-track { background: transparent; }
.fr-kanban-board::-webkit-scrollbar-thumb {
    background   : rgba(0, 0, 0, 0.12);
    border-radius: 4px;
}
body.crm-dark-mode .fr-kanban-board::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.1);
}

.fr-kanban-col {
    flex-shrink  : 0;
    width        : 240px;
    background   : var(--crm-input-bg);
    border-radius: var(--fr-radius-lg);
    border       : 1px solid var(--crm-border);
    display      : flex;
    flex-direction: column;
    max-height   : 620px;
    overflow     : hidden;
    transition   : var(--fr-transition);
    will-change  : transform;
}

.fr-kanban-col.fr-drag-over {
    border-color: rgba(102, 126, 234, 0.45);
    background  : rgba(102, 126, 234, 0.04);
    box-shadow  : 0 0 0 2px rgba(102, 126, 234, 0.15);
}

.fr-kanban-col-header {
    padding       : 10px 12px 8px;
    display       : flex;
    align-items   : center;
    justify-content: space-between;
    gap           : 6px;
    flex-shrink   : 0;
    background    : var(--crm-surface);
    border-bottom : 1px solid var(--crm-border);
}

.fr-kanban-stage-name {
    font-size    : 11px;
    font-weight  : 800;
    color        : var(--crm-text);
    white-space  : nowrap;
    overflow     : hidden;
    text-overflow: ellipsis;
}

.fr-kanban-cards {
    flex          : 1;
    overflow-y    : auto;
    padding       : 8px;
    display       : flex;
    flex-direction: column;
    gap           : 8px;
    -webkit-overflow-scrolling: touch;
}

.fr-kanban-cards::-webkit-scrollbar { width: 3px; }
.fr-kanban-cards::-webkit-scrollbar-thumb {
    background   : rgba(0, 0, 0, 0.08);
    border-radius: 3px;
}
body.crm-dark-mode .fr-kanban-cards::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.07);
}

.fr-kanban-empty {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    justify-content: center;
    padding        : 24px 16px;
    gap            : 8px;
    text-align     : center;
    opacity        : 0.5;
    border         : 2px dashed var(--crm-border);
    border-radius  : var(--fr-radius);
    min-height     : 80px;
}

.fr-kanban-drop-zone {
    display        : none;
    align-items    : center;
    justify-content: center;
    flex-direction : column;
    gap            : 8px;
    padding        : 20px;
    margin         : 8px;
    border         : 2px dashed currentColor;
    border-radius  : var(--fr-radius);
    text-align     : center;
    animation      : crmPulse 1s ease-in-out infinite;
    background     : rgba(102, 126, 234, 0.03);
}

.fr-kanban-add-btn {
    width        : 24px;
    height       : 24px;
    border-radius: 6px;
    border       : 1px solid var(--crm-border);
    background   : var(--crm-input-bg);
    color        : var(--crm-text-faint);
    font-size    : 11px;
    cursor       : pointer;
    display      : flex;
    align-items  : center;
    justify-content: center;
    transition   : var(--fr-transition);
    flex-shrink  : 0;
}

.fr-kanban-add-btn:hover {
    background  : rgba(16, 185, 129, 0.1);
    border-color: rgba(16, 185, 129, 0.3);
    color       : var(--fr-green);
}

/* ════════════════════════════════════════════════════════════
   8. LP CARD
════════════════════════════════════════════════════════════ */

.fr-lp-card {
    background   : var(--crm-surface);
    border       : 1px solid var(--crm-border);
    border-radius: var(--fr-radius-lg);
    padding      : 12px;
    cursor       : pointer;
    transition   : var(--fr-transition);
    position     : relative;
    animation    : crmFadeIn 0.25s ease forwards;
    user-select  : none;
    will-change  : transform;
}

.fr-lp-card:hover {
    border-color: rgba(102, 126, 234, 0.3);
    box-shadow  : 0 4px 16px rgba(0, 0, 0, 0.1);
    transform   : translateY(-1px);
}

.fr-lp-card[draggable="true"]        { cursor: grab; }
.fr-lp-card[draggable="true"]:active { cursor: grabbing; }

.fr-lp-card-top {
    display        : flex;
    align-items    : flex-start;
    justify-content: space-between;
    gap            : 8px;
    margin-bottom  : 6px;
}

.fr-lp-card-name {
    font-size    : 12px;
    font-weight  : 800;
    color        : var(--crm-text);
    white-space  : nowrap;
    overflow     : hidden;
    text-overflow: ellipsis;
    line-height  : 1.3;
}

.fr-drag-handle {
    cursor    : grab;
    padding   : 2px;
    opacity   : 0;
    transition: opacity 0.15s;
    flex-shrink: 0;
}

.fr-lp-card:hover .fr-drag-handle { opacity: 1; }

.fr-lp-card-actions {
    display      : flex;
    gap          : 4px;
    margin-top   : 8px;
    padding-top  : 8px;
    border-top   : 1px solid var(--crm-border);
    opacity      : 0;
    transition   : opacity 0.15s;
}

.fr-lp-card:hover .fr-lp-card-actions { opacity: 1; }

.fr-lp-action-btn {
    width        : 26px;
    height       : 26px;
    border-radius: 7px;
    border       : 1px solid var(--crm-border);
    background   : var(--crm-input-bg);
    color        : var(--crm-text-faint);
    font-size    : 11px;
    cursor       : pointer;
    display      : flex;
    align-items  : center;
    justify-content: center;
    transition   : var(--fr-transition);
    text-decoration: none;
    flex-shrink  : 0;
}

.fr-lp-action-btn:hover {
    background  : rgba(102, 126, 234, 0.1);
    color       : var(--crm-primary);
    border-color: rgba(102, 126, 234, 0.25);
}

.fr-action-advance {
    background  : rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.2);
    color       : var(--fr-green);
}

.fr-action-advance:hover {
    background  : rgba(16, 185, 129, 0.18);
    color       : var(--fr-green);
    border-color: rgba(16, 185, 129, 0.35);
}

.fr-action-convert {
    background  : rgba(6, 182, 212, 0.08);
    border-color: rgba(6, 182, 212, 0.2);
    color       : var(--fr-cyan);
}

.fr-action-convert:hover {
    background  : rgba(6, 182, 212, 0.18);
    color       : var(--fr-cyan);
    border-color: rgba(6, 182, 212, 0.35);
}

.fr-action-ai {
    background  : rgba(139, 92, 246, 0.08);
    border-color: rgba(139, 92, 246, 0.2);
    color       : var(--fr-purple);
}

.fr-action-ai:hover {
    background  : rgba(139, 92, 246, 0.18);
    color       : var(--fr-purple);
    border-color: rgba(139, 92, 246, 0.35);
}

/* ════════════════════════════════════════════════════════════
   9. LIST VIEW
════════════════════════════════════════════════════════════ */

.fr-list-view {
    display   : flex;
    flex-direction: column;
    gap       : 4px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.fr-list-header {
    display    : grid;
    grid-template-columns: 2fr 1fr 1.2fr 0.8fr 0.8fr 0.6fr 0.6fr 0.8fr auto;
    gap        : 8px;
    padding    : 8px 14px;
    font-size  : 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color      : var(--crm-text-faint);
    background : var(--crm-input-bg);
    border-radius: var(--fr-radius);
    margin-bottom: 4px;
    min-width  : 860px;
}

.fr-list-row {
    display    : grid;
    grid-template-columns: 2fr 1fr 1.2fr 0.8fr 0.8fr 0.6fr 0.6fr 0.8fr auto;
    gap        : 8px;
    padding    : 10px 14px;
    border-radius: var(--fr-radius);
    cursor     : pointer;
    transition : var(--fr-transition);
    border     : 1px solid transparent;
    align-items: center;
    min-width  : 860px;
    animation  : crmFadeIn 0.25s ease forwards;
}

.fr-list-row:hover {
    background  : var(--crm-input-bg);
    border-color: var(--crm-border);
}

.fr-list-row-stagnant {
    background : rgba(245, 158, 11, 0.03);
    border-left: 3px solid var(--fr-amber) !important;
}

.fr-list-actions {
    display   : flex;
    gap       : 4px;
    flex-shrink: 0;
    opacity   : 0;
    transition: opacity 0.15s;
}

.fr-list-row:hover .fr-list-actions { opacity: 1; }

/* ════════════════════════════════════════════════════════════
   10. ROADSHOW MANAGER — Meeting Cards
════════════════════════════════════════════════════════════ */

.fr-meeting-card {
    background   : var(--crm-surface);
    border       : 1px solid var(--crm-border);
    border-radius: var(--fr-radius-lg);
    padding      : 16px;
    transition   : var(--fr-transition);
    animation    : crmFadeIn 0.3s ease forwards;
    position     : relative;
    will-change  : transform;
}

.fr-meeting-card:hover {
    border-color: var(--crm-border-hover);
    box-shadow  : var(--crm-shadow);
}

/* ════════════════════════════════════════════════════════════
   11. HERO SECTION — Boutons fundraising
════════════════════════════════════════════════════════════ */

.fr-hero-btn {
    display     : inline-flex;
    align-items : center;
    gap         : 8px;
    padding     : 9px 16px;
    border-radius: var(--fr-radius);
    font-family : inherit;
    font-size   : 12px;
    font-weight : 700;
    cursor      : pointer;
    transition  : var(--fr-transition);
    border      : 1px solid transparent;
    white-space : nowrap;
    flex-shrink : 0;
    position    : relative;
}

.fr-btn-primary {
    background: linear-gradient(135deg, #10b981, #059669);
    color     : #fff;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.35);
}

.fr-btn-primary:hover {
    transform : translateY(-1px);
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.5);
}

.fr-btn-primary:disabled {
    opacity  : 0.5;
    cursor   : not-allowed;
    transform: none;
    box-shadow: none;
}

.fr-btn-secondary {
    background  : var(--crm-input-bg);
    border-color: var(--crm-border);
    color       : var(--crm-text-muted);
}

.fr-btn-secondary:hover {
    background  : rgba(0, 0, 0, 0.07);
    color       : var(--crm-text);
    border-color: var(--crm-border-hover);
}

.fr-btn-secondary:disabled {
    opacity: 0.5;
    cursor : not-allowed;
}

.fr-btn-ai {
    background: linear-gradient(135deg, #8b5cf6, #6d28d9);
    color     : #fff;
    box-shadow: 0 4px 14px rgba(139, 92, 246, 0.35);
}

.fr-btn-ai:hover {
    transform : translateY(-1px);
    box-shadow: 0 6px 22px rgba(139, 92, 246, 0.5);
}

/* ── View Mode Toggle ──────────────────────────────────── */
.fr-view-toggle {
    display      : flex;
    background   : var(--crm-input-bg);
    border       : 1px solid var(--crm-border);
    border-radius: 8px;
    padding      : 3px;
    gap          : 2px;
    flex-shrink  : 0;
}

.fr-view-btn {
    width        : 28px;
    height       : 28px;
    border-radius: 6px;
    border       : none;
    background   : none;
    color        : var(--crm-text-faint);
    font-size    : 12px;
    cursor       : pointer;
    display      : flex;
    align-items  : center;
    justify-content: center;
    transition   : var(--fr-transition);
    flex-shrink  : 0;
}

.fr-view-btn:hover {
    background: var(--crm-surface);
    color     : var(--crm-text);
}

.fr-view-btn.active {
    background: var(--crm-surface);
    color     : var(--crm-primary);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

/* ════════════════════════════════════════════════════════════
   12. AI PRIORITY PANEL
════════════════════════════════════════════════════════════ */

.fr-ai-priority-item {
    padding      : 12px;
    background   : var(--crm-input-bg);
    border-radius: var(--fr-radius);
    border-left  : 3px solid transparent;
    margin-bottom: 8px;
    animation    : crmFadeIn 0.25s ease forwards;
    transition   : var(--fr-transition);
}

.fr-ai-priority-item:hover {
    background: var(--crm-hover);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.fr-ai-priority-item:last-child { margin-bottom: 0; }

/* ════════════════════════════════════════════════════════════
   13. SEARCH RESULT ICONS — variantes LP/Fund
════════════════════════════════════════════════════════════ */

.crm-search-result-icon.lp {
    background: rgba(139, 92, 246, 0.12);
    color     : var(--fr-purple);
}

.crm-search-result-icon.fund {
    background: rgba(16, 185, 129, 0.12);
    color     : var(--fr-green);
}

/* ════════════════════════════════════════════════════════════
   14. TAB CONTENT PADDING OVERRIDES
════════════════════════════════════════════════════════════ */

/* Le tab content a son propre padding selon l'onglet */
#frTabContent {
    padding : 0 !important;
}

/* Padding pour les onglets avec contenu scrollable */
#frTabContent > div {
    padding: 16px;
}

/* Kanban: padding latéral seulement */
#frTabContent .fr-kanban-board {
    padding: 4px 16px 16px;
}

/* Roadshow / Track Record / Analytics: padding normal */
#frTabContent > div[style*="flex-direction:column"],
#frTabContent > div[style*="grid"] {
    padding: 0;
}

/* ════════════════════════════════════════════════════════════
   15. DARK MODE — Fundraising spécifique
════════════════════════════════════════════════════════════ */

body.crm-dark-mode .fr-kpi-card {
    background: rgba(30, 41, 59, 0.85);
}

body.crm-dark-mode .fr-kpi-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

body.crm-dark-mode .fr-fund-tab {
    background: rgba(255, 255, 255, 0.04);
}

body.crm-dark-mode .fr-fund-tab:hover {
    background: rgba(102, 126, 234, 0.08);
}

body.crm-dark-mode .fr-fund-tab.active {
    background: rgba(102, 126, 234, 0.1);
}

body.crm-dark-mode .fr-fund-tab-progress-bar {
    background: rgba(255, 255, 255, 0.06);
}

body.crm-dark-mode .fr-filters-bar {
    background: rgba(30, 41, 59, 0.85);
}

body.crm-dark-mode .fr-search-input {
    background: rgba(255, 255, 255, 0.06);
    color     : var(--crm-text);
}

body.crm-dark-mode .fr-filter-select {
    background: rgba(255, 255, 255, 0.06);
    color     : var(--crm-text-muted);
}

body.crm-dark-mode .fr-filter-select option {
    background: #1e293b;
}

body.crm-dark-mode .fr-filter-select.fr-filter-active {
    background-color: rgba(102, 126, 234, 0.12);
}

body.crm-dark-mode .fr-filter-toggle-btn {
    background: rgba(255, 255, 255, 0.05);
}

body.crm-dark-mode .fr-tab-nav {
    background: rgba(30, 41, 59, 0.85);
}

body.crm-dark-mode .fr-tab-btn:hover {
    background: rgba(255, 255, 255, 0.06);
}

body.crm-dark-mode .fr-tab-btn.active {
    background: rgba(102, 126, 234, 0.12);
}

body.crm-dark-mode .fr-kanban-col {
    background: rgba(255, 255, 255, 0.02);
}

body.crm-dark-mode .fr-kanban-col.fr-drag-over {
    background: rgba(102, 126, 234, 0.08);
}

body.crm-dark-mode .fr-kanban-col-header {
    background: rgba(30, 41, 59, 0.95);
}

body.crm-dark-mode .fr-kanban-empty {
    border-color: rgba(255, 255, 255, 0.08);
}

body.crm-dark-mode .fr-lp-card {
    background: rgba(30, 41, 59, 0.85);
}

body.crm-dark-mode .fr-lp-card:hover {
    box-shadow  : 0 4px 16px rgba(0, 0, 0, 0.4);
    border-color: rgba(102, 126, 234, 0.35);
}

body.crm-dark-mode .fr-lp-card-actions {
    border-top-color: rgba(255, 255, 255, 0.08);
}

body.crm-dark-mode .fr-list-header {
    background: rgba(255, 255, 255, 0.04);
}

body.crm-dark-mode .fr-list-row:hover {
    background: rgba(255, 255, 255, 0.04);
}

body.crm-dark-mode .fr-list-row-stagnant {
    background: rgba(245, 158, 11, 0.06);
}

body.crm-dark-mode .fr-meeting-card {
    background: rgba(30, 41, 59, 0.85);
}

body.crm-dark-mode .fr-meeting-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

body.crm-dark-mode .fr-ai-priority-item {
    background: rgba(255, 255, 255, 0.04);
}

body.crm-dark-mode .fr-ai-priority-item:hover {
    background: rgba(255, 255, 255, 0.06);
}

body.crm-dark-mode .fr-btn-secondary {
    background: rgba(255, 255, 255, 0.06);
}

body.crm-dark-mode .fr-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.1);
}

body.crm-dark-mode .fr-view-toggle {
    background: rgba(255, 255, 255, 0.05);
}

body.crm-dark-mode .fr-view-btn.active {
    background: rgba(255, 255, 255, 0.08);
}

body.crm-dark-mode .fr-thermometer {
    background: rgba(255, 255, 255, 0.06);
}

body.crm-dark-mode .fr-commit-bar-wrap {
    background: rgba(255, 255, 255, 0.06);
}

body.crm-dark-mode .fr-stagnant-alert {
    background: rgba(245, 158, 11, 0.08);
}

body.crm-dark-mode .fr-kanban-drop-zone {
    background: rgba(102, 126, 234, 0.06);
}

/* ════════════════════════════════════════════════════════════
   16. LIGHT MODE — Polish
════════════════════════════════════════════════════════════ */

body:not(.crm-dark-mode) .fr-kpi-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

body:not(.crm-dark-mode) .fr-lp-card:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
}

body:not(.crm-dark-mode) .fr-meeting-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

body:not(.crm-dark-mode) .fr-kanban-col {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

body:not(.crm-dark-mode) .fr-filters-bar {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

body:not(.crm-dark-mode) .fr-tab-nav {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

/* ════════════════════════════════════════════════════════════
   17. RESPONSIVE — Large (≤ 1400px)
════════════════════════════════════════════════════════════ */

@media (max-width: 1400px) {
    #frKPICards.crm-kpi-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .fr-kanban-col    { width: 220px; }
    .fr-commit-label  { min-width: 80px; }
    .fr-stage-mini-bars { min-width: 170px; }
}

/* ════════════════════════════════════════════════════════════
   18. RESPONSIVE — Tablet (≤ 1200px)
════════════════════════════════════════════════════════════ */

@media (max-width: 1200px) {
    #frKPICards.crm-kpi-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .fr-progress-body  { gap: 16px; }
    .fr-commit-label   { min-width: 70px; }
    .fr-stage-mini-bars { min-width: 160px; }
    .fr-kanban-col     { width: 210px; }
}

/* ════════════════════════════════════════════════════════════
   19. RESPONSIVE — Mobile (≤ 768px)
════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {

    /* KPI: 2x4 sur mobile */
    #frKPICards.crm-kpi-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .fr-kpi-card  { padding: 14px; }
    .fr-kpi-value { font-size: 18px; }
    .fr-kpi-icon  { width: 32px; height: 32px; font-size: 13px; }

    /* Fund selector: scroll horizontal */
    .fr-fund-tabs-wrap { flex-wrap: nowrap; gap: 5px; }

    /* Progress: empilé verticalement */
    .fr-progress-body {
        flex-direction: column;
        gap: 16px;
    }

    .fr-thermometer-wrap {
        flex-direction: row;
        align-items: flex-start;
        gap: 16px;
        width: 100%;
    }

    .fr-thermometer { width: 20px; height: 120px; }
    .fr-thermo-info { align-items: flex-start; text-align: left; }

    .fr-commit-breakdown { min-width: 100%; }
    .fr-stage-mini-bars  { min-width: 100%; }

    /* Tab nav: scroll horizontal */
    .fr-tab-nav   { padding: 4px; gap: 3px; }
    .fr-tab-btn   { font-size: 11px; padding: 7px 10px; }

    /* Filters bar */
    .fr-filters-bar { padding: 10px; gap: 6px; }
    .fr-search-wrap { min-width: 100%; order: -1; }

    .fr-filter-select {
        min-width: 100px;
        font-size: 11px;
        padding: 6px 24px 6px 8px;
    }

    .fr-results-count { margin-left: auto; }

    /* Kanban */
    .fr-kanban-col { width: 210px; }

    /* List: scroll horizontal */
    .fr-list-header,
    .fr-list-row {
        grid-template-columns: 2fr 1.2fr 0.8fr auto;
        min-width: 560px;
    }

    /* Actions toujours visibles sur mobile */
    .fr-lp-card-actions { opacity: 1; }
    .fr-list-actions    { opacity: 1; }
    .fr-drag-handle     { display: none; }

    /* Hero buttons: compact */
    .crm-hero-right { flex-wrap: wrap; gap: 8px; width: 100%; }
    .fr-hero-btn    { font-size: 11px; padding: 8px 12px; }

    /* AI panel: plein écran sur mobile */
    #frAIPrioritizationPanel {
        position : fixed !important;
        left     : 12px !important;
        right    : 12px !important;
        width    : auto !important;
        top      : 70px !important;
        max-height: calc(100vh - 80px) !important;
        z-index  : 998 !important;
    }
}

/* ════════════════════════════════════════════════════════════
   20. RESPONSIVE — Small Mobile (≤ 480px)
════════════════════════════════════════════════════════════ */

@media (max-width: 480px) {

    /* KPI: 2 colonnes */
    #frKPICards.crm-kpi-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 6px;
    }

    .fr-kpi-card  { padding: 12px; }
    .fr-kpi-value { font-size: 16px; }
    .fr-kpi-icon  { width: 28px; height: 28px; font-size: 12px; }

    /* Tabs: texte masqué, icône seule */
    .fr-tab-btn span { display: none; }
    .fr-tab-btn { padding: 8px 10px; }

    /* Kanban: colonnes plus petites */
    .fr-kanban-col { width: 185px; }

    /* List: 3 colonnes */
    .fr-list-header,
    .fr-list-row {
        grid-template-columns: 2fr 1.2fr auto;
        min-width: 380px;
    }

    /* Fund tabs: compacts */
    .fr-fund-tab { padding: 6px 10px; min-width: 60px; }

    /* Hero buttons: icône seulement */
    .fr-hero-btn span {
        display: none;
    }
    .fr-hero-btn {
        padding      : 10px;
        border-radius: 50%;
        width        : 40px;
        height       : 40px;
        justify-content: center;
    }

    .fr-stagnant-alert { font-size: 11px; }
    .fr-filters-bar    { padding: 8px; }
}

/* ════════════════════════════════════════════════════════════
   21. LANDSCAPE MOBILE (≤ 768px landscape)
════════════════════════════════════════════════════════════ */

@media (max-width: 768px) and (orientation: landscape) {
    #frKPICards.crm-kpi-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 6px;
    }

    .fr-progress-body  { flex-direction: row; flex-wrap: wrap; }
    .fr-thermometer-wrap { flex-direction: column; }
    .fr-kanban-board   { max-height: 400px; }
}

/* ════════════════════════════════════════════════════════════
   22. ULTRA WIDE (≥ 1600px)
════════════════════════════════════════════════════════════ */

@media (min-width: 1600px) {
    #frKPICards.crm-kpi-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .fr-kanban-col    { width: 260px; }
    .fr-commit-label  { min-width: 110px; }
    .fr-stage-mini-bars { min-width: 220px; }
}

/* ════════════════════════════════════════════════════════════
   23. ACCESSIBILITÉ
════════════════════════════════════════════════════════════ */

.fr-tab-btn:focus-visible,
.fr-fund-tab:focus-visible,
.fr-lp-action-btn:focus-visible,
.fr-hero-btn:focus-visible,
.fr-view-btn:focus-visible,
.fr-kanban-add-btn:focus-visible,
.fr-filter-toggle-btn:focus-visible,
.fr-inline-btn:focus-visible {
    outline       : 2px solid var(--crm-primary);
    outline-offset: 2px;
}

/* iOS zoom prevention */
@media (max-width: 768px) {
    .fr-search-input,
    .fr-filter-select { font-size: 16px; }

    .fr-search-input:not(:focus),
    .fr-filter-select:not(:focus) { font-size: 12px; }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
    .fr-kpi-card,
    .fr-lp-card,
    .fr-meeting-card,
    .fr-ai-priority-item,
    .fr-thermometer-fill,
    .fr-commit-bar,
    .fr-fund-tab { transition-duration: 0.01ms !important; }

    .fr-thermo-glow    { animation: none; }
    .fr-kanban-drop-zone { animation: none; }
    .fr-lp-card        { animation: none; }
    .fr-list-row       { animation: none; }
    .fr-meeting-card   { animation: none; }
    .fr-ai-priority-item { animation: none; }
}

/* GPU acceleration */
.fr-kpi-card,
.fr-lp-card,
.fr-kanban-col,
.fr-meeting-card,
.fr-ai-priority-item,
.fr-fund-tab {
    -webkit-backface-visibility: hidden;
    backface-visibility        : hidden;
}

/* ════════════════════════════════════════════════════════════
   24. PRINT
════════════════════════════════════════════════════════════ */

@media print {
    .fr-kanban-board { overflow: visible; flex-wrap: wrap; }
    .fr-kanban-col   { width: 48%; min-height: auto; max-height: none; }

    .fr-lp-card-actions,
    .fr-drag-handle,
    .fr-hero-btn,
    .fr-filters-bar,
    .fr-fund-tab-add,
    .fr-view-toggle  { display: none !important; }

    #frAIPrioritizationPanel { display: none !important; }

    .fr-lp-card  { page-break-inside: avoid; }
    .fr-kpi-card { page-break-inside: avoid; }

    .fr-list-header,
    .fr-list-row { min-width: unset; }
}

/* ════════════════════════════════════════════════════════════
   25. UTILITAIRES
════════════════════════════════════════════════════════════ */

/* État dragging */
.fr-lp-card.dragging {
    opacity       : 0.4;
    transform     : scale(0.97);
    pointer-events: none;
}

/* List row animation delays */
.fr-list-row:nth-child(1)  { animation-delay: 0ms;   }
.fr-list-row:nth-child(2)  { animation-delay: 20ms;  }
.fr-list-row:nth-child(3)  { animation-delay: 40ms;  }
.fr-list-row:nth-child(4)  { animation-delay: 60ms;  }
.fr-list-row:nth-child(5)  { animation-delay: 80ms;  }
.fr-list-row:nth-child(6)  { animation-delay: 100ms; }
.fr-list-row:nth-child(7)  { animation-delay: 120ms; }
.fr-list-row:nth-child(8)  { animation-delay: 140ms; }
.fr-list-row:nth-child(9)  { animation-delay: 160ms; }
.fr-list-row:nth-child(10) { animation-delay: 180ms; }

/* Kanban board dans tab content */
#frTabContent > * { padding: 16px; }
#frTabContent .fr-kanban-board { padding: 0; }

/* ════════════════════════════════════════════════════════════
   END — crm-fundraising.css v1.0
   © AlphaVault AI — All rights reserved
════════════════════════════════════════════════════════════ */