/* ---------------------------------- */
/* WIDGET BASE                        */
/* ---------------------------------- */

.laf-insights-widget {
    background: var(--laf-color-surface);
    border: 1px solid var(--laf-color-border);
    border-radius: var(--laf-radius-lg);
    box-shadow: var(--laf-shadow-widget);
    padding: var(--laf-space-5);
    position: relative;
    min-width: 0;
    margin-bottom: 16px !important;
}

/* dernier élément sans marge inutile */
.laf-insights-widget:last-child {
    margin-bottom: 0;
}

/* Fix spécifique table (Liste des leads) */
.laf-insights-widget--table {
    margin-bottom: 32px !important;
}

/* HEADER */
.laf-insights-widget__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--laf-space-3);
    margin-bottom: var(--laf-space-4);
}

.laf-insights-widget__title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--laf-color-text);
}

.laf-insights-widget__intro {
    margin-top: 6px;
    font-size: 0.95rem;
    color: var(--laf-color-text-soft);
}

.laf-insights-widget:hover {
    box-shadow: 0 12px 36px rgba(15, 23, 42, 0.06);
    transform: translateY(-1px);
}

.laf-insights-section-title {
    margin-bottom: 10px;
}

/* BODY */
.laf-insights-widget__body {
    min-width: 0;
}


.laf-insights-widget__subtitle {
    margin: 2px 0 0;
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--laf-ins-muted);
}

.laf-lead-mini-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 180px;
    border: 1px dashed var(--laf-ins-border);
    border-radius: 16px;
    background: var(--laf-ins-soft-bg);
    color: var(--laf-ins-soft-text);
    font-size: 13px;
    text-align: center;
    padding: 16px;
}

.laf-lead-mini-pie {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 14px;
    align-items: center;
}

.laf-lead-mini-pie__chart-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

.laf-lead-mini-pie__chart {
    width: 104px;
    height: 104px;
    border-radius: 50%;
    position: relative;
    flex: 0 0 auto;
}

.laf-lead-mini-pie__hole {
    position: absolute;
    inset: 16px;
    border-radius: 50%;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1.1;
    text-align: center;
}

.laf-lead-mini-pie__hole strong {
    font-size: 18px;
    color: var(--laf-ins-page-text);
}

.laf-lead-mini-pie__hole span {
    margin-top: 2px;
    font-size: 11px;
    color: var(--laf-ins-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.laf-lead-mini-pie__legend {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.laf-lead-mini-pie__legend-row {
    display: grid;
    grid-template-columns: 10px 1fr auto;
    gap: 8px;
    align-items: center;
    font-size: 13px;
}

.laf-lead-mini-pie__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.laf-lead-mini-pie__label {
    color: var(--laf-ins-page-text);
}

.laf-lead-mini-pie__value {
    color: var(--laf-ins-page-text);
    font-weight: 700;
}

.laf-lead-mini-products__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.laf-lead-mini-products__table thead th {
    padding: 0 0 8px;
    border-bottom: 1px solid var(--laf-ins-border);
    font-size: 12px;
    color: var(--laf-ins-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    text-align: left;
}

.laf-lead-mini-products__table thead th:last-child {
    text-align: right;
}

.laf-lead-mini-products__table tbody td {
    padding: 10px 0;
    border-bottom: 1px solid var(--laf-ins-border);
    font-size: 13px;
    color: var(--laf-ins-page-text);
    vertical-align: middle;
}

.laf-lead-mini-products__product {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}

.laf-lead-mini-products__qty {
    text-align: right;
    font-weight: 700;
    white-space: nowrap;
}

.laf-lead-mini-products__table tbody tr:last-child td {
    border-bottom: 0;
}

/* =========================
   Leads & activité — KPI block
   ========================= */

[data-widget-id="lead_activity_intensity"],
[data-widget-id="lead_interest_distribution"],
[data-widget-id="lead_business_value"],
[data-widget-id="lead_concrete_products"] {
    min-height: 350px;
}

[data-widget-id="lead_activity_intensity"] .laf-insights-widget__inner,
[data-widget-id="lead_interest_distribution"] .laf-insights-widget__inner,
[data-widget-id="lead_business_value"] .laf-insights-widget__inner,
[data-widget-id="lead_concrete_products"] .laf-insights-widget__inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Titres et sous-titres homogènes */
[data-widget-id="lead_activity_intensity"] .laf-insights-widget__title,
[data-widget-id="lead_interest_distribution"] .laf-insights-widget__title,
[data-widget-id="lead_business_value"] .laf-insights-widget__title,
[data-widget-id="lead_concrete_products"] .laf-insights-widget__title {
    margin-bottom: 0;
}

[data-widget-id="lead_activity_intensity"] .laf-insights-widget__subtitle,
[data-widget-id="lead_interest_distribution"] .laf-insights-widget__subtitle,
[data-widget-id="lead_business_value"] .laf-insights-widget__subtitle,
[data-widget-id="lead_concrete_products"] .laf-insights-widget__subtitle {
    margin-top: 6px;
    min-height: 38px;
}

/* Bloc texte plus proche d’un KPI */
[data-widget-id="lead_activity_intensity"] .laf-insights-widget__body,
[data-widget-id="lead_business_value"] .laf-insights-widget__body {
    margin-top: 12px;
}

[data-widget-id="lead_activity_intensity"] .laf-insights-widget__body p,
[data-widget-id="lead_activity_intensity"] .laf-insights-widget__body div,
[data-widget-id="lead_business_value"] .laf-insights-widget__body p,
[data-widget-id="lead_business_value"] .laf-insights-widget__body div {
    line-height: 1.7;
}

/* Produits concrets compact, sans scroll, aspect KPI */
[data-widget-id="lead_concrete_products"] .laf-insights-widget__body {
    margin-top: 8px;
    flex: 1;
    display: flex;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products {
    width: 100%;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products__table thead th {
    padding: 0 0 10px;
    font-size: 12px;
    line-height: 1.3;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products__table tbody td {
    padding: 10px 0;
    font-size: 13px;
    line-height: 1.35;
}

/* Vue globale — cartes KPI plus compactes */
[data-widget-id="overview_kpi_leads"],
[data-widget-id="overview_kpi_accounts"],
[data-widget-id="overview_kpi_orders"],
[data-widget-id="overview_kpi_revenue"] {
    min-height: 320px;
}

[data-widget-id="overview_kpi_leads"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_accounts"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_orders"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_revenue"] .laf-insights-widget__inner {
    height: 100%;
}

/* Harmonisation verticale des 4 KPI overview */
[data-widget-id="overview_kpi_leads"] .laf-insights-widget__body,
[data-widget-id="overview_kpi_accounts"] .laf-insights-widget__body,
[data-widget-id="overview_kpi_orders"] .laf-insights-widget__body,
[data-widget-id="overview_kpi_revenue"] .laf-insights-widget__body {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}



@media (max-width: 1200px) {
    .laf-lead-mini-pie {
        grid-template-columns: 1fr;
    }

    .laf-lead-mini-pie__chart-wrap {
        justify-content: flex-start;
    }
}

/* ---------------------------------- */
/* CONTROLS (shared UI)               */
/* ---------------------------------- */

.laf-widget-control {
    appearance: none;
    border: 1px solid var(--laf-color-border);
    background: var(--laf-color-surface);
    color: var(--laf-color-text-soft);
    border-radius: var(--laf-radius-pill);
    padding: 8px 14px;
    font-size: 0.92rem;
    font-weight: 500;
    cursor: pointer;
    transition: all var(--laf-transition-fast);
}

/* Hover */
.laf-widget-control:hover {
    color: var(--laf-color-text);
    border-color: var(--laf-color-border-strong);
    background: var(--laf-color-surface-soft);
}

/* Actif (NOUVEAU STYLE PROPRE) */
.laf-widget-control.is-active {
    color: var(--laf-color-brand);
    border-color: var(--laf-color-brand-border);
    background: var(--laf-color-brand-soft);
    box-shadow: none;
}



/* =========================================================
   KPI - Vue globale + Leads & activité
   Uniformisation visuelle et suppression des vides
   ========================================================= */

/* 1) Les cartes KPI ne doivent pas s’étirer inutilement */
[data-widget-id="overview_kpi_leads"],
[data-widget-id="overview_kpi_accounts"],
[data-widget-id="overview_kpi_orders"],
[data-widget-id="overview_kpi_revenue"],
[data-widget-id="lead_activity_intensity"],
[data-widget-id="lead_interest_distribution"],
[data-widget-id="lead_business_value"],
[data-widget-id="lead_concrete_products"] {
    align-self: start;
}

/* 2) Inner plus compact */
[data-widget-id="overview_kpi_leads"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_accounts"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_orders"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_revenue"] .laf-insights-widget__inner,
[data-widget-id="lead_activity_intensity"] .laf-insights-widget__inner,
[data-widget-id="lead_interest_distribution"] .laf-insights-widget__inner,
[data-widget-id="lead_business_value"] .laf-insights-widget__inner,
[data-widget-id="lead_concrete_products"] .laf-insights-widget__inner {
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* 3) Même hauteur visuelle pour les 4 KPI de Leads & activité */
[data-widget-id="lead_activity_intensity"],
[data-widget-id="lead_interest_distribution"],
[data-widget-id="lead_business_value"],
[data-widget-id="lead_concrete_products"] {
    min-height: 0;
}

[data-widget-id="lead_activity_intensity"] .laf-insights-widget__inner,
[data-widget-id="lead_interest_distribution"] .laf-insights-widget__inner,
[data-widget-id="lead_business_value"] .laf-insights-widget__inner,
[data-widget-id="lead_concrete_products"] .laf-insights-widget__inner {
    min-height: 300px;
}

/* 4) Titres / sous-titres cohérents */
[data-widget-id="lead_activity_intensity"] .laf-insights-widget__header,
[data-widget-id="lead_interest_distribution"] .laf-insights-widget__header,
[data-widget-id="lead_business_value"] .laf-insights-widget__header,
[data-widget-id="lead_concrete_products"] .laf-insights-widget__header {
    margin-bottom: 10px;
}

[data-widget-id="lead_activity_intensity"] .laf-insights-widget__title,
[data-widget-id="lead_interest_distribution"] .laf-insights-widget__title,
[data-widget-id="lead_business_value"] .laf-insights-widget__title,
[data-widget-id="lead_concrete_products"] .laf-insights-widget__title {
    margin: 0;
}

[data-widget-id="lead_activity_intensity"] .laf-insights-widget__subtitle,
[data-widget-id="lead_interest_distribution"] .laf-insights-widget__subtitle,
[data-widget-id="lead_business_value"] .laf-insights-widget__subtitle,
[data-widget-id="lead_concrete_products"] .laf-insights-widget__subtitle {
    margin: 6px 0 0;
    min-height: 36px;
}

/* 5) Intensité d’activité et Valeur commerciale :
      leur donner une hiérarchie proche des KPI overview */
[data-widget-id="lead_activity_intensity"] .laf-insights-widget__body,
[data-widget-id="lead_business_value"] .laf-insights-widget__body {
    margin-top: 2px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

[data-widget-id="lead_activity_intensity"] .laf-insights-widget__body p,
[data-widget-id="lead_activity_intensity"] .laf-insights-widget__body div,
[data-widget-id="lead_business_value"] .laf-insights-widget__body p,
[data-widget-id="lead_business_value"] .laf-insights-widget__body div {
    margin: 0;
    line-height: 1.6;
}

/* 6) Répartition des intérêts :
      retirer l’effet “gros bloc” du chart */
[data-widget-id="lead_interest_distribution"] .laf-chart__canvas-wrap {
    background: transparent !important;
    padding: 0 !important;
    margin-top: 6px !important;
    min-height: 170px !important;
    border-radius: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

[data-widget-id="lead_interest_distribution"] .laf-chart {
    height: 170px !important;
    width: 100%;
    max-width: 220px;
    margin: 0 auto;
}

[data-widget-id="lead_interest_distribution"] .laf-chart__empty {
    min-height: 170px;
    background: transparent;
    border: 1px dashed var(--laf-ins-border);
}

/* 7) Produits concrets :
      compact et visuellement aligné avec les autres KPI */
[data-widget-id="lead_concrete_products"] .laf-insights-widget__body {
    margin-top: 2px;
    flex: 1;
    display: flex;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products {
    width: 100%;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products__table thead th {
    padding: 0 0 8px;
    font-size: 12px;
    line-height: 1.3;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products__table tbody td {
    padding: 9px 0;
    font-size: 13px;
    line-height: 1.35;
}

[data-widget-id="lead_concrete_products"] .laf-lead-mini-products__product {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}

/* 8) Vue globale :
      réduire le vide inutile en bas tout en gardant le style */
[data-widget-id="overview_kpi_leads"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_accounts"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_orders"] .laf-insights-widget__inner,
[data-widget-id="overview_kpi_revenue"] .laf-insights-widget__inner {
    min-height: 250px;
}

/* 9) Si le grid étire les cartes, on force les groupes KPI à démarrer en haut */
[data-widget-id="lead_kpis"],
[data-widget-id="overview_kpis"] {
    align-self: start;
}

/* =========================================================
   Leads & activité - Signaux / interprétation / action
   ========================================================= */

.laf-lead-signals {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.laf-lead-signals__section {
    padding: 16px;
    border: 1px solid var(--laf-ins-border);
    border-radius: 16px;
    background: var(--laf-color-surface-soft);
}

.laf-lead-signals__heading {
    margin: 0 0 12px;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 700;
    color: var(--laf-ins-page-text);
}

.laf-lead-signals__list {
    margin: 0;
    padding-left: 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.laf-lead-signals__list li {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--laf-ins-page-text);
}

.laf-lead-signals__action {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid var(--laf-ins-border);
    background: #fff;
}

.laf-lead-signals__action strong {
    font-size: 15px;
    line-height: 1.4;
    color: var(--laf-ins-page-text);
}

.laf-lead-signals__action span {
    font-size: 13px;
    line-height: 1.5;
    color: var(--laf-ins-soft-text);
}

.laf-lead-signals__action--positive {
    border-color: rgba(16, 185, 129, 0.24);
    background: rgba(16, 185, 129, 0.06);
}

.laf-lead-signals__action--warning {
    border-color: rgba(240, 179, 90, 0.28);
    background: rgba(240, 179, 90, 0.10);
}

.laf-lead-signals__action--info {
    border-color: rgba(91, 124, 250, 0.24);
    background: rgba(91, 124, 250, 0.06);
}

.laf-lead-signals__action--neutral {
    border-color: var(--laf-ins-border);
    background: #fff;
}

/* =========================================
   Boutons Déplier / Réduire -> flèche seule
   ========================================= */

.laf-widget-toggle {
    position: relative;
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0;
    border: 1px solid var(--laf-ins-border);
    border-radius: 999px;
    background: #fff;
    color: var(--laf-ins-page-text);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0; /* masque le texte visuellement */
    line-height: 1;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.laf-widget-toggle:hover {
    background: var(--laf-color-surface-soft);
}

/* chevron */
.laf-widget-toggle::before {
    content: "";
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .2s ease;
    margin-top: -2px;
}

/* état déplié : flèche vers le haut */
.is-collapsible:not(.is-collapsed) .laf-widget-toggle::before {
    transform: rotate(-135deg);
    margin-top: 2px;
}

/* état replié : flèche vers le bas */
.is-collapsible.is-collapsed .laf-widget-toggle::before {
    transform: rotate(45deg);
    margin-top: -2px;
}



.laf-widget-toggle {
    position: relative;
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0;
    border: 1px solid var(--laf-ins-border);
    border-radius: 999px;
    background: #fff;
    color: var(--laf-ins-page-text);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.laf-widget-toggle:hover {
    background: var(--laf-color-surface-soft);
}

.laf-widget-toggle::before {
    content: "";
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .2s ease;
    margin-top: -2px;
}

.is-collapsible:not(.is-collapsed) .laf-widget-toggle::before {
    transform: rotate(-135deg);
    margin-top: 2px;
}

.is-collapsible.is-collapsed .laf-widget-toggle::before {
    transform: rotate(45deg);
    margin-top: -2px;
}

.laf-insights-widget__body[hidden],
.laf-group__content[hidden] {
    display: none !important;
}

.laf-table__count {
    display: inline-flex;
    align-items: center;
    margin-left: 10px;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--laf-color-surface-soft);
    color: var(--laf-color-text-soft);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    vertical-align: middle;
}

/* =========================================================
   Widgets collapsables - comportement global
   ========================================================= */

/* Un widget replié ne garde que son header */
.laf-insights-widget.is-collapsible.is-collapsed {
    align-self: start;
}

.laf-insights-widget.is-collapsible.is-collapsed .laf-insights-widget__inner {
    height: auto !important;
    min-height: 0 !important;
}

.laf-insights-widget.is-collapsible.is-collapsed .laf-insights-widget__body,
.laf-insights-widget.is-collapsible.is-collapsed .laf-group__content {
    display: none !important;
}

/* Si certains widgets gardent une hauteur via des tailles internes */
.laf-insights-widget.is-collapsible.is-collapsed .laf-chart,
.laf-insights-widget.is-collapsible.is-collapsed .laf-chart__canvas-wrap,
.laf-insights-widget.is-collapsible.is-collapsed .laf-timeline-widget,
.laf-insights-widget.is-collapsible.is-collapsed .laf-table-wrap {
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* =========================================================
   Bouton flèche uniforme
   ========================================================= */

.laf-widget-toggle {
    position: relative;
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0;
    border: 1px solid var(--laf-ins-border);
    border-radius: 999px;
    background: #fff !important;
    color: var(--laf-ins-page-text) !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    box-shadow: none !important;
    appearance: none;
    -webkit-appearance: none;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.laf-widget-toggle:hover {
    background: var(--laf-color-surface-soft) !important;
    color: var(--laf-ins-page-text) !important;
    border-color: var(--laf-ins-border) !important;
}

.laf-widget-toggle:focus,
.laf-widget-toggle:focus-visible,
.laf-widget-toggle:active {
    background: #fff !important;
    color: var(--laf-ins-page-text) !important;
    border-color: var(--laf-ins-border) !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Chevron */
.laf-widget-toggle::before {
    content: "";
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .2s ease;
    margin-top: -2px;
}

/* Ouvert = flèche vers le haut */
.is-collapsible:not(.is-collapsed) .laf-widget-toggle::before {
    transform: rotate(-135deg);
    margin-top: 2px;
}

/* Fermé = flèche vers le bas */
.is-collapsible.is-collapsed .laf-widget-toggle::before {
    transform: rotate(45deg);
    margin-top: -2px;
}

@media (max-width: 980px) {
    .laf-lead-signals {
        grid-template-columns: 1fr;
    }
}