.projects-page-index-content {
    margin: 0 auto;
    height: 100vh;
    overflow: scroll;
}

.segments-clients-page, .value-prop-page{
    padding: 20px;
    height: calc(100vh - 80px);
}

.module-layout {
    height: 100%;
}

.project-step-card.locked .step-button{
    color: #9CA3AF;
}

.project-step-card.locked{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.page-project-header-content{
    margin-top: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.add-project-button{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 15px;
    background: #0A58A5;
    padding: 0 17px;
    height: 44Px;
}

.add-project-button span{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.page-project-header-content h1{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 75% */
}

.page-project-header-content p{
    margin-top: 10px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 137.5% */
}

.search-filters-container{
    display: flex;
    align-items: center;
    gap: 15px;
}

.search-filters-container form{
    flex: 1;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 42px;
    display: flex;
    align-items: center;
    padding: 0 16px;
}

.project-search-bar{
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    height: 100%;
}

.search-filters-container form input{
    height: 100%;
    width: 100%;
    border: none;
    background-color: transparent;
}

.filters-button{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    display: flex;
    max-width: 143px;
    height: 42px;
    padding: 6px 13px;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.filters-button span{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
}

.projects-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 21px;
    grid-row-gap: 21px;
    margin-top: 30px;
    padding-bottom: 30px;
}

/* Empty state */
.projects-empty-state{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 24px;
    margin-top: 30px;
}

.projects-empty-icon{
    margin-bottom: 24px;
    opacity: 0.6;
}

.projects-empty-title{
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 8px 0;
}

.projects-empty-description{
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    color: #64748b;
    line-height: 1.6;
    max-width: 420px;
    margin: 0 0 28px 0;
}

.projects-empty-cta{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 24px;
    border-radius: 12px;
    background: #0A58A5;
    color: #fff;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s;
}

.projects-empty-cta:hover{
    background: #084a8a;
}

.projects-empty-cta i{
    font-size: 12px;
}

.project-card{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    padding: 20px;
}

.project-card-header{
    display: flex;
    align-items: center;
    gap: 10px;
}

.project-logo-icon{
    width: 50px;
    height: 50px;
    object-fit: contain;
    border-radius: 8px;
    background: #fff;
    flex-shrink: 0;
}

.project-name{
    display: flex;
    align-items: center;
    gap: 10px;
}

.project-name h3{
    color: var(--Color1, #223245);
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 111.111% */
}

.project-category{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px; /* 100% */
    margin-top: 6px;
}

.project-meta{
    margin: 12px 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.project-meta span{
    color: var(--Color0, #445972);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 85.714% */
}

.project-collab-badge{
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    padding: 4px 9px;
    border-radius: 20px;
    background: #EEF4FB;
    color: #0A58A5 !important;
    flex-shrink: 0;
}

.project-collab-badge span{
    color: #0A58A5 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 14px !important;
}

.project-collab-badge svg{
    flex-shrink: 0;
}

.progress-bar{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 11px;
}

.progress-fill{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: var(--Color-2, #0A58A5);
    height: 100%;
}

.project-progress{
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 200% */
}

.progress-step{
    font-weight: 400;
    color: var(--Color2, #6E7F93);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 70%;
}

.status-tabs{
    display: flex;
    flex-direction: column;
    padding: 10px;
}

.status-tab{
    padding: 10px;
    border-radius: 10px;
    color: var(--Color2, #6E7F93);
    text-align: left;
}

.status-tab span{
    border-radius: 10px;
    color: var(--Color2, #6E7F93);
    text-align: left;
    font-size: 16px;
}

.status-tab:hover, .status-tab.active{
    background: #f6f7f8;
}

/* Modal pour sélectionner un projet à associer à une cohorte */
.cohorte-project-selection-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.cohorte-project-selection-modal.show {
    display: flex;
}

.cohorte-project-selection-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
}

.cohorte-project-selection-content {
    position: relative;
    background-color: #FFFFFF;
    border-radius: 12px;
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    z-index: 1001;
}

.cohorte-project-selection-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
}

.cohorte-project-selection-header h3 {
    font-size: 20px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-project-selection-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
    transition: all 0.2s ease;
}

.cohorte-project-selection-close:hover {
    background-color: #F8F9FA;
    color: #223245;
}

.cohorte-project-selection-body {
    padding: 24px;
}

.cohorte-project-selection-intro {
    font-size: 14px;
    color: #6E7F93;
    margin: 0 0 24px 0;
    line-height: 1.6;
    font-family: "Open Sans", sans-serif;
}

.cohorte-project-selection-error {
    padding: 12px 16px;
    background-color: #FEE2E2;
    color: #DC2626;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
}

.cohorte-project-selection-form-group {
    margin-bottom: 20px;
}

.cohorte-project-selection-form-group label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #223245;
    margin-bottom: 8px;
    font-family: "Open Sans", sans-serif;
}

.cohorte-project-selection-select {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    color: #223245;
    background-color: #FFFFFF;
    font-family: "Open Sans", sans-serif;
    transition: border-color 0.2s ease;
}

.cohorte-project-selection-select:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.cohorte-project-selection-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #DFE5EC;
}

.cohorte-project-selection-cancel,
.cohorte-project-selection-submit {
    padding: 12px 24px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
}

.cohorte-project-selection-cancel {
    background-color: #F8F9FA;
    color: #6E7F93;
}

.cohorte-project-selection-cancel:hover {
    background-color: #E9ECEF;
    color: #223245;
}

.cohorte-project-selection-submit {
    background-color: #0A58A5;
    color: #FFFFFF;
}

.cohorte-project-selection-submit:hover:not(:disabled) {
    background-color: #084A8A;
}

.cohorte-project-selection-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.create-project-button:hover {
    background-color: #084a8f;
    text-decoration: none;
    color: #FFFFFF;
}

.project-show-nav{
    display: flex;
    align-items: center;
}

.project-show-nav .cohortes-filter-tab{
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.project-show-content-section{
    margin-top: 30px;
}

.project-show-description{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
}

.project-credits-info{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 10px;
    background: #EFF6FF;
    border: 1px solid #DBEAFE;
    margin-top: 12px;
    margin-bottom: 8px;
}

.project-credits-info .icon{
    width: 18px;
    height: 18px;
}

.project-credits-info span{
    color: #0A58A5;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

.project-steps-section{
    margin-top: 30px;
}

.project-steps-section h2{
    color: var(--Color2, #6E7F93);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 112.5% */
}

.project-steps-grid{
    margin-top: 30px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 22px;
    grid-row-gap: 22px;
}

.project-step-card {
    padding: 18px 20px;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;

    /* gr1 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.project-step-card.locked{
    opacity: 0.5;
    cursor: not-allowed;
}

.step-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.step-number{
    color: var(--Color2, #6E7F93);
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 109.091% */
}

.step-status{
    border-radius: 6px;
    height: 22px;
    padding: 6px 14px;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 109.091% */
    display: flex;
    align-items: center;
    justify-content: center;
}

.step-status.completed{
    border: 1px solid #59B224;
    background: rgba(89, 178, 36, 0.06);
    color: #59B224;
}

.step-status.open{
    border-radius: 6px;
    border: 1px solid var(--Color-2, #0A58A5);
    background: rgba(10, 88, 165, 0.06);
    color: var(--Color-2, #0A58A5);
}

.step-status.in-progress{
    border: 1px solid #F59E0B;
    background: rgba(245, 158, 11, 0.06);
    color: #F59E0B;
}

.step-status.locked{
    border-radius: 6px;
    border: 1px solid #9CA3AF;
    background: rgba(156, 163, 175, 0.08);
    color: #9CA3AF;
}

.step-title{
    color: var(--deep-dark-concree, #172735);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 137.5% */
    margin: 17px 0;
}

.step-description{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px; /* 125% */
    margin-top: 10px !important;
}

.step-credits-cost{
    margin: 17px 0;
    border-radius: 20px;
    background: #F6F7F8;
    width: fit-content;
    padding: 6px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.step-credits-cost span{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 8px; /* 66.667% */
}

.step-credits-cost.open{
    border-radius: 20px;
background: rgba(10, 88, 165, 0.06);
}

.step-credits-cost.open span{
    color: #0A58A5;
}

.step-credits-cost.locked{
    opacity: 0.5;
}

.step-button {
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    color: var(--Color-2, #0A58A5);
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 114.286% */
    margin-top: 10px;
}

.project-cohorte-credits-badge{
    border-radius: 20px;
    border: 1px solid var(--Color-2, #0A58A5);
    display: flex;
    height: 32px;
    padding: 6px 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    color: var(--Color-2, #0A58A5);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 8px; /* 66.667% */
}

.settings-tabs{
    border-radius: 10px;
    background: #eaeceda4;
    width: fit-content;
    height: 39px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px;

}

.settings-tabs button{
    padding: 7px 29px;
    height: 32px;
    border-radius: 7px;
    border: none;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px; /* 128.571% */
    cursor: pointer;
}

.settings-tabs button.active{
    background: #0A58A5;
    color: #FFFFFF;
}

.settings-card{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 30px;
    margin-top: 17px;
}

.settings-card-header h2{
    color: var(--Color1, #223245);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 90% */
}

.settings-card-header p{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px; /* 150% */
    margin-top: 6px;
}

.settings-form{
    margin-top: 30px;
}

.settings-form .form-group{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

.settings-form .form-row{
    display: flex;
    align-items: center;
    gap: 16px;
}

.settings-form .form-row .form-group{
    width: 50%;
}

.settings-form .form-group label{
    color: var(--Color1, #223245);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 100% */
}

.settings-form .form-group input{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 39px;
    padding: 1rem;
}

.settings-form .form-group textarea{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 1rem;
    font-family: "Open Sans", sans-serif;
}

.settings-form .form-group select{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 1rem;
    font-family: "Open Sans", sans-serif;
}

.settings-form .save-button,
.member-invite-form .save-button{
    border-radius: 15px;
    background: #0A58A5;
    display: flex;
    width: 291px;
    height: 44px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border: none;
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 85.714% */
    cursor: pointer;
}

/* ========== Documents Section ========== */

.documents-count-badge{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    margin-left: 6px;
    border-radius: 11px;
    background: #EEF2F6;
    color: #0A58A5;
    font-size: 12px;
    font-weight: 600;
    vertical-align: middle;
}

.documents-attached-label{
    color: var(--Color2, #6E7F93);
    font-size: 13px;
    font-weight: 500;
    margin: 0 0 10px 0;
}

.documents-empty-state{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-weight: 400;
    padding: 16px;
    border: 1px dashed var(--stroke-1, #DFE5EC);
    border-radius: 10px;
    background: #FAFBFC;
    margin: 0 0 20px 0;
    text-align: center;
}

.documents-selected-preview{
    margin-top: 12px;
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid #BEE3C8;
    background: #F1FBF4;
}

.documents-selected-title{
    color: #1E7A3D;
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 8px 0;
}

.documents-selected-list{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.documents-selected-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
}

.documents-selected-name{
    color: var(--Color1, #223245);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.documents-selected-size{
    color: var(--Color2, #6E7F93);
    font-weight: 400;
    flex-shrink: 0;
}

.documents-list{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 20px;
}

.document-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FAFBFC;
    transition: background 0.15s ease;
}

.document-item:hover{
    background: #F3F6F9;
}

.document-info{
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex: 1;
}

.document-icon{
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #EEF2F6;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #6E7F93;
}

.document-details{
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.document-name{
    color: var(--Color1, #223245);
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.document-meta{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.document-delete-form{
    display: inline;
}

.document-delete-btn{
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid #FECACA;
    background: #FFF;
    color: #DC2626;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.document-delete-btn:hover{
    background: #FEF2F2;
    border-color: #F87171;
}

.documents-upload-zone{
    position: relative;
}

.documents-file-input{
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    overflow: hidden;
}

.documents-upload-label{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 24px;
    border: 2px dashed var(--stroke-1, #DFE5EC);
    border-radius: 12px;
    cursor: pointer;
    color: var(--Color2, #6E7F93);
    transition: all 0.15s ease;
}

.documents-upload-label:hover{
    border-color: #0A58A5;
    background: #F0F7FF;
    color: #0A58A5;
}

.documents-upload-label span{
    font-size: 14px;
    font-weight: 500;
}

.documents-upload-hint{
    font-size: 12px !important;
    font-weight: 400 !important;
    color: var(--Color2, #6E7F93) !important;
}

.settings-card-header-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.invite-button{
    border-radius: 15px;
background: #0A58A5;
width: 139px;
height: 44px;
border: none;
display: flex;
align-items: center;
gap: 10px;
justify-content: center;
}

.members-section{
    margin-top: 30px;
}

.members-section .members-section-title{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px; /* 133.333% */
}

.members-list{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.settings-card .member-item{
    border-radius: 10px;
    background: #F6F7F8;
    display: flex;
    flex-direction: row;
    padding: 13px 15px;
    display: flex;
    align-items: start;
    gap: 15px;
    justify-content: start;
}

.member-avatar{
    border-radius: 22px;
    background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.member-avatar span{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 75% */
}

.member-avatar-img{
    width: 44px;
    height: 44px;
    border-radius: 22px;
    object-fit: cover;
}

.member-name{
    color: var(--Color1, #223245);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 100% */
}

.member-role{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.member-name-row{
    display: flex;
    align-items: center;
    gap: 10px;
}

.invite-button span{
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 85.714% */
}

/* ===== Collaboration : membres & invitations ===== */

.settings-card .member-item .member-info{
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.member-actions{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.member-role-form{
    margin: 0;
}

.member-role-select{
    padding: 6px 28px 6px 10px;
    font-size: 13px;
    border-radius: 8px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background-color: #FFF;
    color: var(--Color1, #223245);
    cursor: pointer;
}

.member-remove-btn,
.member-resend-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    background: #FFF;
}

.member-remove-btn{
    width: 34px;
    height: 34px;
    border: 1px solid #F0D2D2;
    color: #C0392B;
}

.member-remove-btn:hover{
    background: rgba(192, 57, 43, 0.08);
    border-color: #C0392B;
}

.member-resend-btn{
    height: 34px;
    padding: 0 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    color: #0A58A5;
    font-size: 13px;
    font-weight: 600;
}

.member-resend-btn:hover{
    background: #F0F7FF;
    border-color: #0A58A5;
}

.member-remove-form,
.member-resend-form{
    margin: 0;
}

.member-item-pending{
    border: 1px dashed var(--stroke-1, #DFE5EC);
    background: #FBFCFD !important;
}

.member-avatar-pending{
    background: #EEF2F6 !important;
    color: #6E7F93;
}

.member-pending-badge{
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 10px;
    background: #FEF3E0;
    color: #B7791F;
    font-size: 11px;
    font-weight: 600;
}

/* Formulaire d'invitation */
.member-invite-form{
    margin: 8px 0 20px;
    padding: 16px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 12px;
    background: #FAFBFC;
}

.member-invite-row{
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.member-invite-email{
    flex: 1;
    min-width: 220px;
    margin-bottom: 0;
}

.member-invite-role{
    width: 160px;
    margin-bottom: 0;
}

.member-invite-hint{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    margin: 10px 0 0;
}

.new-project-question, .manual-project-subtitle{
    color: #6E7F93;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

/* ========== New Project Page Redesign ========== */

.new-project-content{
    padding: 30px;
    overflow-y: auto;
    height: calc(100vh - 64px);
}

.new-project-wrapper{
    max-width: 820px;
    margin: 0 auto;
}

/* Hero */
.new-project-hero{
    text-align: center;
    margin-bottom: 40px;
}

.new-project-hero-icon{
    width: 64px;
    height: 64px;
    border-radius: 20px;
    background: linear-gradient(135deg, #0A58A5 0%, #1E7FD6 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.new-project-hero-icon i{
    font-size: 28px;
    color: #fff;
}

.new-project-hero-title{
    color: #223245;
    font-size: 26px;
    font-weight: 700;
    line-height: 34px;
    margin-bottom: 8px;
}

.new-project-hero-subtitle{
    color: #6E7F93;
    font-size: 15px;
    font-weight: 400;
    line-height: 24px;
}

/* Creation Cards */
.new-project-cards{
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 32px;
}

.new-project-card{
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 22px 24px;
    border-radius: 16px;
    border: 2px solid #E8EDF2;
    background: #fff;
    cursor: pointer;
    transition: all 0.25s ease;
    text-decoration: none;
    position: relative;
}

.new-project-card:hover{
    border-color: #C5D5E8;
    box-shadow: 0 4px 16px rgba(10, 88, 165, 0.08);
    transform: translateY(-1px);
}

.new-project-card.selected{
    border-color: #0A58A5;
    background: linear-gradient(135deg, rgba(10, 88, 165, 0.04) 0%, rgba(30, 127, 214, 0.06) 100%);
    box-shadow: 0 4px 16px rgba(10, 88, 165, 0.12);
}

.new-project-card-icon{
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.new-project-card-icon.ai,
.new-project-card-icon.idea,
.new-project-card-icon.manual{
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.new-project-card-icon img{
    width: 28px;
    height: 28px;
}

.new-project-card-icon.manual i{
    font-size: 22px;
    color: #0A58A5;
}

.new-project-card-body{
    flex: 1;
}

.new-project-card-body h3{
    color: #223245;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    margin-bottom: 4px;
}

.new-project-card-body p{
    color: #6E7F93;
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
}

.new-project-card-check{
    flex-shrink: 0;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.new-project-card-check i{
    font-size: 22px;
    color: #0A58A5;
}

.new-project-card.selected .new-project-card-check{
    opacity: 1;
}

.new-project-card-arrow{
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #EFF6FF;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.new-project-card-arrow i{
    font-size: 14px;
    color: #0A58A5;
    transition: transform 0.2s ease;
}

.new-project-card.manual:hover .new-project-card-arrow{
    background: #DBEAFE;
}

.new-project-card.manual:hover .new-project-card-arrow i{
    transform: translateX(3px);
}

/* Ideas Selection */
.new-project-ideas-section{
    background: #F8FAFC;
    border-radius: 16px;
    padding: 28px;
    margin-bottom: 32px;
    border: 1px solid #E8EDF2;
}

.new-project-ideas-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.new-project-ideas-header h2{
    color: #223245;
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
}

.new-project-catalog-link{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #0A58A5;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: gap 0.2s ease;
}

.new-project-catalog-link:hover{
    gap: 12px;
}

.new-project-catalog-link i{
    font-size: 12px;
}

.new-project-ideas-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

.new-project-idea-card{
    border-radius: 14px;
    border: 2px solid #E8EDF2;
    background: #fff;
    padding: 20px;
    cursor: pointer;
    transition: all 0.25s ease;
    position: relative;
}

.new-project-idea-card:hover{
    border-color: #C5D5E8;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.new-project-idea-card.selected{
    border-color: #0A58A5;
    background: linear-gradient(135deg, rgba(10, 88, 165, 0.04) 0%, rgba(30, 127, 214, 0.06) 100%);
}

.new-project-idea-card-top{
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.new-project-idea-badge{
    background: #EFF6FF;
    color: #0A58A5;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 20px;
}

.new-project-idea-budget{
    color: #6E7F93;
    font-size: 11px;
    font-weight: 500;
}

.new-project-idea-card h3{
    color: #223245;
    font-size: 15px;
    font-weight: 600;
    line-height: 22px;
}

.new-project-idea-card-check{
    position: absolute;
    top: 16px;
    right: 16px;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.new-project-idea-card-check i{
    font-size: 20px;
    color: #0A58A5;
}

.new-project-idea-card.selected .new-project-idea-card-check{
    opacity: 1;
}

/* File Upload */
.new-project-upload-section{
    margin-bottom: 32px;
}

.new-project-upload-area{
    border: 2px dashed #D1D5DB;
    border-radius: 16px;
    padding: 48px 24px;
    text-align: center;
    background: #FAFBFC;
    cursor: pointer;
    transition: all 0.25s ease;
}

.new-project-upload-area:hover,
.new-project-upload-area.drag-over{
    border-color: #0A58A5;
    background: #F0F7FF;
}

.new-project-upload-icon{
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}

.new-project-upload-icon i{
    font-size: 24px;
    color: #0A58A5;
}

.new-project-upload-text{
    color: #223245;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 6px;
}

.new-project-upload-formats{
    color: #9CA3AF;
    font-size: 13px;
    font-weight: 400;
}

/* Start Button */
.new-project-action{
    text-align: center;
    padding-bottom: 40px;
}

.new-project-start-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 50px;
    padding: 0 48px;
    border-radius: 14px;
    background: linear-gradient(135deg, #0A58A5 0%, #1E7FD6 100%);
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 4px 12px rgba(10, 88, 165, 0.25);
}

.new-project-start-btn:hover{
    box-shadow: 0 6px 20px rgba(10, 88, 165, 0.35);
    transform: translateY(-1px);
}

.new-project-start-btn:active{
    transform: translateY(0);
}

.new-project-start-btn:disabled{
    opacity: 0.4;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.new-project-start-btn i{
    font-size: 14px;
    transition: transform 0.2s ease;
}

.new-project-start-btn:not(:disabled):hover i{
    transform: translateX(3px);
}

.manual-project-form{
    margin-top: 30px;
}

/* ========== Manual Project Page Redesign ========== */

.manual-project-content{
    padding: 30px;
    overflow-y: auto;
    height: calc(100vh - 64px);
}

.manual-project-wrapper{
    max-width: 600px;
    margin: 0 auto;
}

.manual-project-wrapper .manual-project-subtitle{
    color: #6E7F93;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    margin-bottom: 20px;
}

.manual-project-errors{
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 18px;
    border-radius: 12px;
    background: #FEF2F2;
    border: 1px solid #FECACA;
    margin-bottom: 20px;
}

.manual-project-errors i{
    font-size: 16px;
    color: #DC2626;
    margin-top: 2px;
}

.manual-project-errors p{
    color: #991B1B;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 2px;
}

.detailed-form-cancel-button{
    padding: 10px 28px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #fff;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.detailed-form-cancel-button:hover{
    border-color: #C5D5E8;
    background: #F8FAFC;
}


.form-group{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

.form-group label{
    color: var(--Variable-texte-2, #586D85);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 183.333% */
}

.form-group input{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 44px;
    padding: 1rem;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 22px; /* 137.5% */
    color: var(--Color-Texte, #22364D);
}

/* Alert pour crédits insuffisants */
.project-insufficient-credits-alert {
    background: linear-gradient(135deg, #FEF3C7 0%, #FDE68A 100%);
    border: 1px solid #FCD34D;
    border-radius: 16px;
    padding: 20px 24px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    box-shadow: 0 2px 8px rgba(251, 191, 36, 0.15);
    margin-top: 20px;
}

.alert-content {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex: 1;
}

.alert-icon {
    width: 48px;
    height: 48px;
    background-color: #F59E0B;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    flex-shrink: 0;
}

.alert-icon svg {
    width: 24px;
    height: 24px;
}

.alert-text {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.alert-title {
    font-size: 18px;
    font-weight: 700;
    color: #92400E;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.alert-message {
    font-size: 14px;
    font-weight: 400;
    color: #78350F;
    margin: 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

.alert-message strong {
    font-weight: 700;
    color: #92400E;
}

.alert-recharge-button {
    background-color: #F59E0B;
    color: #FFFFFF;
    border: none;
    border-radius: 12px;
    padding: 12px 24px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}

.alert-recharge-button:hover {
    background-color: #D97706;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

.alert-recharge-button i {
    font-size: 14px;
}

/* Alert pour projet bloqué */
.project-locked-alert {
    background: linear-gradient(135deg, #FEE2E2 0%, #FECACA 100%);
    border: 1px solid #FCA5A5;
    border-radius: 16px;
    padding: 20px 24px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 20px;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.15);
}

.project-locked-alert .alert-icon {
    width: 48px;
    height: 48px;
    background-color: #DC2626;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    flex-shrink: 0;
}

.project-locked-alert .alert-icon i {
    font-size: 20px;
}

.project-locked-alert .alert-title {
    font-size: 18px;
    font-weight: 700;
    color: #991B1B;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.project-locked-alert .alert-message {
    font-size: 14px;
    font-weight: 400;
    color: #7F1D1D;
    margin: 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

.project-locked-alert .alert-message strong {
    font-weight: 700;
    color: #991B1B;
}

.form-hint{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 100% */
}

.form-group textarea{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 1rem;
    font-family: "Open Sans", sans-serif;
}

.form-group select{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 1rem;
}

.form-actions{
    display: flex;
    align-items: center;
    gap: 20px;
}

.form-actions .cancel-button{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    height: 44px;
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--Color2, #6E7F93);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 75% */
}

.form-actions .submit-button{
    border-radius: 15px;
    background: #0A58A5;
    display: flex;
    width: 50%;
    height: 44px;
    padding: 16px 182px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 75% */
    border: none;
}

/* Projects Modal Styles */
.projects-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.projects-modal.show {
    display: flex;
}

.projects-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

.projects-modal-content {
    position: relative;
    background-color: #FFFFFF;
    border-radius: 20px;
    width: 100%;
    max-width: 50%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    z-index: 1001;
}

.projects-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
    background: var(--gradient4, linear-gradient(180deg, #E6ECF5 0%, #FFF 100%));

}

.projects-modal-header h3 {
    font-size: 20px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.projects-modal-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
    transition: all 0.2s ease;
}

.projects-modal-close:hover {
    background-color: #F8F9FA;
    color: #223245;
}

.projects-modal-body {
    padding: 24px;
}

.projects-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 20px;
}

.project-item {
    display: block;
    padding: 16px;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    text-decoration: none;
    color: inherit;
    transition: all 0.2s ease;
}

.project-item:hover {
    background-color: #FFFFFF;
    border-color: #0A58A5;
    box-shadow: 0 2px 8px rgba(10, 88, 165, 0.1);
    text-decoration: none;
    color: inherit;
    border: 1px solid #0A58A5;
    background: rgba(10, 88, 165, 0.06);
}

.project-item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.project-item-name {
    font-size: 16px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.project-item-progress {
    font-size: 14px;
    font-weight: 600;
    color: #0A58A5;
    font-family: "Open Sans", sans-serif;
}

.project-item-description {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0 0 8px 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

.project-item-status {
    margin-top: 8px;
}

.status-badge {
    display: inline-block;
    padding: 1px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    border: 1px solid;
}

.status-badge.status-termine {
    background-color: rgba(89, 178, 36, 0.06);
    color: #59B224;
    border-color: #59B224;
}

.status-badge.status-en_pause {
    background-color: #FEE2E2;
    color: #DC2626;
}

.status-badge.status-en_cours{
    border-radius: 6px;
    border: 1px solid var(--Color, #F90);
    background: rgba(255, 153, 1, 0.07);
    color: #F90;
}

.status-badge.status-nouveau{
    border-radius: 6px;
    border: 1px solid #0A58A5;
    background: rgba(10, 88, 165, 0.07);
    color: #0A58A5;
}

.sidebar-module-project-card{
    border-radius: 15px;
    background: var(--deep-dark-concree, #172735);
    padding: 15px;
}

.sidebar-module-project-card h3{
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 100% */
}

.sidebar-module-project-card p{
    color: #FFF;
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    line-height: 10px; /* 100% */
    margin: 10px 0;
}

.sidebar-module-progress-header{
    color: rgba(255, 255, 255, 0.50);
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    line-height: 10px; /* 100% */
    display: flex;
    align-items: center;
    justify-content: space-between !important;
}

a.exit-button{
    display: flex !important;
    align-items: center;
    padding: 0 0 !important;
}

.sidebar-module-project-card .sidebar-module-project-title{
    justify-content: start !important;
}

.sidebar-module-progress-bar{
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.10);
    height: 6px;
    width: 100%;
    margin-top: 6px;
}

.sidebar-module-progress-fill{
    border-radius: 20px;
    background: var(--gr9, linear-gradient(169deg, #E8F5E1 -1.09%, #EFE3D2 47.74%, #DDE9F5 100.12%));
    height: 100%;
}

.aide-button{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.aide-button span{
    color: #6E7F93;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
}

.sidebar-module-title{
    display: flex;
    align-items: center;
    gap: 10px;
}

.sidebar-module-title .sidebar-module-icon{
    width: 36px;
    height: 36px;
    color: #223245;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 87.5% */
}

.module-instruction h2{
    color: #223245;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 160% */
}

.module-instruction p{
    color: #6E7F93;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 157.143% */
}

.module-instruction{
    margin-bottom: 30px;
}


.simple-loader {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 48px;
    width: 500px;
    margin: 0 auto;
}

.simple-loader-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #E8F4FD;
    border-top-color: #0A58A5;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.simple-loader-text {
    font-size: 16px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.project-page-header-left{
    display: flex;
    align-items: center;
    gap: 10px;
}

.project-page-header-left a{
    display: flex;
    align-items: center;
    gap: 5px;
}

.project-page-header-left i{
    border-radius: 23px;
    background: #FFF;
    width: 23px;
    height: 23px;
    /* gr1 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #0A58A5;
    font-weight: 600;
}

.project-page-header-left span{
    color: var(--Color1, #223245);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px; /* 116.667% */
}

.project-page-header-content{
    padding: 30px;
    padding-bottom: 0;
}

.projects-page-title h1{
    color: var(--Color1, #223245);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 110% */
}

.projects-page-title p{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px; /* 116.667% */
    margin-top: 7px;
}

.projects-page-title a{
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 12px;
    border: 1px solid var(--Color-2, #0A58A5);
    height: 44px;
    padding: 11px 25px;
    width: fit-content;
}

.projects-page-title a span{
    color: var(--Color-2, #0A58A5);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 142.857% */
}

.projects-page-title{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* ========== Project Show Back Link ========== */
.project-show-back-link{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    color: var(--Color2, #6E7F93);
    text-decoration: none;
    transition: all 0.2s;
}

.project-show-back-link:hover{
    background: rgba(10, 88, 165, 0.08);
    color: #0A58A5;
}

.project-show-back-link i{
    font-size: 13px;
}

/* ========== Project Show Animations ========== */

.project-page-header-content{
    animation: fadeUp 0.4s ease-out both;
}

.projects-page-title{
    animation: fadeUp 0.5s ease-out 0.1s both;
}

.project-show-nav{
    animation: fadeUp 0.4s ease-out 0.2s both;
}

.project-show-description{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.project-steps-section h2{
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.project-locked-alert{
    animation: fadeUp 0.5s ease-out 0.3s both;
}

.project-insufficient-credits-alert{
    animation: fadeUp 0.5s ease-out 0.3s both;
}

.project-step-card{
    animation: scaleIn 0.5s ease-out both;
}

.project-step-card:nth-child(1){ animation-delay: 0.3s; }
.project-step-card:nth-child(2){ animation-delay: 0.4s; }
.project-step-card:nth-child(3){ animation-delay: 0.5s; }
.project-step-card:nth-child(4){ animation-delay: 0.55s; }
.project-step-card:nth-child(5){ animation-delay: 0.6s; }
.project-step-card:nth-child(6){ animation-delay: 0.65s; }
.project-step-card:nth-child(7){ animation-delay: 0.7s; }
.project-step-card:nth-child(n+8){ animation-delay: 0.75s; }

.project-show-content-section .settings-card,
.project-show-content-section .project-danger-zone{
    animation: fadeUp 0.5s ease-out 0.2s both;
}

/* ========== Project Danger Zone ========== */

.project-danger-zone{
    border-radius: 16px;
    border: 1px solid #FECACA;
    background: #fff;
    overflow: hidden;
    margin-top: 20px;
}

.project-danger-zone-header{
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 24px 28px;
    background: linear-gradient(135deg, #FEF2F2 0%, #FFF5F5 100%);
    border-bottom: 1px solid #FECACA;
}

.project-danger-zone-icon{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: #FEE2E2;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.project-danger-zone-icon i{
    font-size: 20px;
    color: #DC2626;
}

.project-danger-zone-header h2{
    color: #991B1B;
    font-size: 17px;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 4px;
}

.project-danger-zone-header p{
    color: #7F1D1D;
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
}

.project-danger-zone-details{
    padding: 20px 28px;
    border-bottom: 1px solid #FEE2E2;
}

.project-danger-zone-info{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px 16px;
    border-radius: 10px;
    background: #FFFBEB;
    border: 1px solid #FDE68A;
}

.project-danger-zone-info i{
    font-size: 14px;
    color: #D97706;
    margin-top: 2px;
    flex-shrink: 0;
}

.project-danger-zone-info span{
    color: #92400E;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
}

.project-danger-zone-action{
    padding: 20px 28px;
    display: flex;
    justify-content: flex-end;
}

.project-danger-zone-form{
    display: inline;
}

.project-danger-zone-btn{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    border-radius: 12px;
    background: #DC2626;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(220, 38, 38, 0.25);
}

.project-danger-zone-btn:hover{
    background: #B91C1C;
    box-shadow: 0 4px 14px rgba(220, 38, 38, 0.35);
    transform: translateY(-1px);
}

.project-danger-zone-btn:active{
    transform: translateY(0);
}

.project-danger-zone-btn i{
    font-size: 14px;
}

/* ========== Project Index Animations ========== */

.page-project-header-content{
    animation: fadeUp 0.4s ease-out both;
}

.page-project-header-content .projects-index-page-header-right{
    animation: scaleIn 0.4s ease-out 0.15s both;
}

.projects-filters{
    position: relative;
    z-index: 10;
    animation: fadeUp 0.4s ease-out 0.15s both;
}

.project-card{
    animation: scaleIn 0.5s ease-out both;
}

.project-card:nth-child(1){ animation-delay: 0.2s; }
.project-card:nth-child(2){ animation-delay: 0.3s; }
.project-card:nth-child(3){ animation-delay: 0.4s; }
.project-card:nth-child(4){ animation-delay: 0.45s; }
.project-card:nth-child(5){ animation-delay: 0.5s; }
.project-card:nth-child(6){ animation-delay: 0.55s; }
.project-card:nth-child(n+7){ animation-delay: 0.6s; }

.status-filters{
    position: relative;
    z-index: 10;
}

.status-filters .user-dropdown-menu{
    bottom: -180px !important;
}


/* ========== Project New Animations ========== */

.new-project-header{
    animation: fadeUp 0.4s ease-out both;
}

.new-project-question{
    animation: fadeUp 0.4s ease-out 0.1s both;
}

.creation-card{
    animation: scaleIn 0.5s ease-out both;
}

.creation-card:nth-child(1){ animation-delay: 0.15s; }
.creation-card:nth-child(2){ animation-delay: 0.25s; }
.creation-card:nth-child(3){ animation-delay: 0.35s; }

.quick-selection-title{
    animation: fadeUp 0.4s ease-out 0.1s both;
}

.quick-selection-card{
    animation: scaleIn 0.5s ease-out both;
}

.quick-selection-card:nth-child(1){ animation-delay: 0.1s; }
.quick-selection-card:nth-child(2){ animation-delay: 0.2s; }
.quick-selection-card:nth-child(3){ animation-delay: 0.3s; }
.quick-selection-card:nth-child(n+4){ animation-delay: 0.35s; }

.view-catalog-link{
    animation: fadeUp 0.4s ease-out 0.4s both;
}

.start-button-container{
    animation: fadeUp 0.4s ease-out 0.45s both;
}

/* ========== Project New Manual Animations ========== */

.new-manual-project-page{
    animation: fadeUp 0.4s ease-out 0.1s both;
}

.manual-project-subtitle{
    animation: fadeUp 0.4s ease-out 0.15s both;
}

.manual-project-form .form-group{
    animation: fadeUp 0.4s ease-out both;
}

.manual-project-form .form-group:nth-child(1){ animation-delay: 0.2s; }
.manual-project-form .form-group:nth-child(2){ animation-delay: 0.3s; }
.manual-project-form .form-group:nth-child(3){ animation-delay: 0.4s; }
.manual-project-form .form-group:nth-child(4){ animation-delay: 0.5s; }

.manual-project-form .form-actions{
    animation: fadeUp 0.4s ease-out 0.55s both;
}

/* Manual Project New Animations */
.manual-project-wrapper .detailed-profile-section{
    animation: fadeUp 0.4s ease-out 0.1s both;
}

.module-page{
    width: 100%;
    max-width: 100% !important;
    padding: 0 !important;
    background-color: #fff;
}

.explorer-users-content{
    display: flex;
}

.pres-slides .pres-slide{
    display: flex;
    align-items: center;
    gap: 40px;

}

.pres-slides .pres-slide.pres-slide--reverse{
    flex-direction: row-reverse;
}

.module-presentation{
    margin: 0 auto;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.pres-slides{
    height: calc(100% - 100px);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 85%;
    margin: 0 auto;
    margin-bottom: 20px;
    background-color: #F6F7F8;
    padding: 30px;
    border-radius: 20px;
}

.seg-img{
    width: 50%;
    height: 68vh;
    object-fit: contain;
    border-radius: 20px;
}

.pres-slide-content{
    width: 50%;
}

.pres-title{
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 16777200px;
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    padding: 6px 12px;
    width: fit-content;
}

.pres-title span{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.5px; /* 139.286% */
}

.pres-slide-content h2{
    color: #223245;
    font-family: "Open Sans";
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
    line-height: 41.25px; /* 158.654% */
    margin-top: 20px;
}

.pres-slide-content p{
    color: #445972;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 29.25px; /* 182.813% */
    margin-top: 15px;
}

.pres-items{
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
}

.pres-items .press-item{
    display: flex;
    align-items: start;
    gap: 15px;
    border-radius: 14px;
    background: #F6F7F8;
    padding: 16px;
}

.press-item h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.5px; /* 139.286% */
}

.press-item p{
    margin-top: 0;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px; /* 127.273% */
}

.pres-checklist{
    margin-top: 16px;
    padding: 16px 20px;
    border-radius: 14px;
    background: #F6F7F8;
}

.pres-checklist h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 19.5px;
    margin-bottom: 10px;
}

.pres-checklist ul{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pres-checklist li{
    display: flex;
    align-items: center;
    gap: 10px;
    color: #445972;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 19.5px;
}

.pres-checklist li::before{
    content: "✓";
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    color: #FFF;
    font-size: 11px;
    font-weight: 700;
}

.press-item-num{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 14px;
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    color: #FFF;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
}

.pres-nav{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;

    /* gr2 */
    padding: 15px;
}

.pres-nav span{
    color: #B5C1D0;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 133.333% */
}

.seg-next button{
    border-radius: 12px;
    background: #0A58A5;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
    padding: 10px 28px;
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: 22.5px; /* 150% */
    border: none;
    cursor: pointer;
}

.seg-prev button{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: transparent;
    padding: 10px 28px;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.5px; /* 150% */
    cursor: pointer;
}

.module-main-content{
    height: 100%;
    overflow: scroll;
}


/* ═══════════════════════════════════════════════════
   RESPONSIVE — Mobile & Tablet (max-width: 768px)
   ═══════════════════════════════════════════════════ */

@media (max-width: 768px){

    .pres-slides .pres-slide{
        flex-direction: column;
        height: 100%;
    }

    .pres-slides .pres-slide.pres-slide--reverse{
        flex-direction: column;
    }

    .pres-slides{
        width: 100%;
        overflow: scroll;
    }

    .pres-slide-content, .seg-img{
        width: 100%;
        height: 300px;
        object-fit: cover;
    }

    .page-project-header-content p, .add-project-button span{
        display: none;
    }

    .page-header-content h1{
        font-size: 16px !important;
    }

    .segment-help-modal-content{
        max-width: 95% !important;
    }

    .discussions-page-title span{
        font-size: 18px !important;
    }

    .projects-index-page{
        margin-top: 20px;
    }

    .projects-grid{
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
    }

    .project-page-header-content{
        padding: 20px;
        border-bottom: 1px solid var(--Contour-Color, #DFE5EC);
    }

    .project-creation-cards{
        flex-direction: column;
    }

    .creation-card{
        width: 100%;
    }

    .projects-page-title a span, .projects-page-title p{
        display: none;
    }

    .discussions-page-title .project-cohorte-star-container{
        display: none;
    }

    .project-cohorte-mobile-only{
        display: flex;
        margin-top: 12px;
    }

    .project-steps-grid, .quick-selection-cards{
        display: flex;
        flex-direction: column;
    }

    .start-button{
        width: 100%;
    }

    .form-actions{
        flex-direction: column-reverse;
    }

    .form-actions .cancel-button, .form-actions .submit-button{
        width: 100%;
        justify-content: center;
        padding: 0;
    }

    .generate-segments-button{
        width: 100% !important;
    }

    .welcome-modal-content{
        max-width: 100% !important;
    }

    .projects-page-index-content{
        height: calc(100vh - 77.5px - 56px);
    }

    .projects-page{
        height: calc(100% - 64px);
    }

}

/* ===== Visite guidée projet (onboarding) ===== */
.discussions-page-header-right{
    display: flex;
    align-items: center;
    gap: 10px;
}

.project-tour-replay{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    color: #0A58A5;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.project-tour-replay:hover{
    background: #F0F7FF;
    border-color: #0A58A5;
}

.project-tour-overlay{
    position: fixed;
    inset: 0;
    z-index: 1100;
    animation: projectTourFade 0.2s ease-out both;
}

@keyframes projectTourFade{
    from{ opacity: 0; }
    to{ opacity: 1; }
}

.project-tour-spotlight{
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-radius: 14px;
    box-shadow: 0 0 0 9999px rgba(15, 23, 42, 0.62);
    pointer-events: none;
    transition: top 0.25s ease, left 0.25s ease, width 0.25s ease, height 0.25s ease;
}

.project-tour-tooltip{
    position: fixed;
    z-index: 1101;
    width: min(340px, calc(100vw - 24px));
    background: #FFFFFF;
    border-radius: 16px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.3);
    padding: 22px 20px 16px;
    animation: projectTourPop 0.25s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes projectTourPop{
    from{ opacity: 0; transform: translateY(8px) scale(0.97); }
    to{ opacity: 1; transform: translateY(0) scale(1); }
}

.project-tour-skip{
    position: absolute;
    top: 12px;
    right: 12px;
    width: 26px;
    height: 26px;
    border: none;
    border-radius: 8px;
    background: rgba(10, 88, 165, 0.08);
    color: #6E7F93;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, color 0.15s ease;
}

.project-tour-skip:hover{
    background: rgba(10, 88, 165, 0.16);
    color: #0A58A5;
}

.project-tour-title{
    color: #223245;
    font-size: 16px;
    font-weight: 700;
    margin: 0 24px 8px 0;
    line-height: 22px;
}

.project-tour-body{
    color: #445972;
    font-size: 14px;
    line-height: 21px;
    margin: 0 0 16px;
}

.project-tour-footer{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-tour-dots{
    display: flex;
    align-items: center;
    gap: 6px;
}

.project-tour-dot{
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #DFE5EC;
    transition: background 0.15s ease, width 0.15s ease;
}

.project-tour-dot.active{
    background: #0A58A5;
    width: 18px;
    border-radius: 4px;
}

.project-tour-actions{
    display: flex;
    align-items: center;
    gap: 8px;
}

.project-tour-btn{
    padding: 8px 14px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFFFFF;
    color: #445972;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.project-tour-btn:hover{
    background: #F5F8FB;
}

.project-tour-btn.primary{
    background: #0A58A5;
    border-color: #0A58A5;
    color: #FFFFFF;
}

.project-tour-btn.primary:hover{
    background: #084a8a;
}

/* ===== Info-bulle réutilisable (ⓘ) ===== */
.info-tip{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    color: #9AA7B4;
    cursor: help;
    flex-shrink: 0;
    transition: color 0.15s ease;
}

.info-tip:hover,
.info-tip:focus{
    color: #0A58A5;
    outline: none;
}

/* Bulle ajoutée au <body> et positionnée en JS (tooltip_controller) →
   jamais coupée ni débordante, quel que soit le bloc. */
.info-tip-bubble{
    position: fixed;
    max-width: 240px;
    padding: 8px 11px;
    border-radius: 8px;
    background: #223245;
    color: #FFFFFF;
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.45;
    text-align: left;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.28);
    opacity: 0;
    transition: opacity 0.12s ease;
    z-index: 3000;
    pointer-events: none;
}

.info-tip-bubble.is-visible{
    opacity: 1;
}
.chat-content{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: linear-gradient(180deg, #DFE5EC -3.26%, #FFF 38.49%);
    height: calc(100vh - 52px) !important;

    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    margin: 28px 30px !important;
    padding: 20px 0;
}


/* ===== Discussions Index Page Header (style tendances) ===== */
.discussions-content{
    height: calc(100vh - 77.5px - 56px);
}

.discussions-page-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 64px;
    padding: 0 30px;
    animation: chatFadeUp 0.4s ease-out both;
}

.discussions-page-header-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.discussions-page-header-left a{
    color: #0A58A5;
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

.discussions-page-title{
    display: flex;
    align-items: center;
    gap: 8px;
}

.discussions-page-title img{
    width: 22px;
    height: 22px;
}

.discussions-page-title span{
    font-family: "Open Sans";
    font-size: 24px;
    font-weight: 700;
    line-height: 20px;
}

.discussions-new-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 12px;
    background: #0A58A5;
    padding: 0 17px;
    height: 38px;
    text-decoration: none;
    transition: background 0.2s;
}

.discussions-new-btn:hover{
    background: #084a8a;
}

.discussions-new-btn span{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}

.discussions-page-layout{
    padding: 30px;

    height: calc(100vh - 64px);
    overflow: auto;
}

.chats-page{
    margin-top: 0;
}

.messages-page{
    padding: 0 0 !important;
    /* Colonne flex à hauteur bornée : le champ de saisie reste ancré en bas et la
       zone de messages absorbe l'apparition de la barre d'étapes (plus de décalage
       du formulaire). Hauteur = ancienne (messages 100vh-270) + input (150). */
    display: flex;
    flex-direction: column;
    height: calc(100vh - 120px);
}

.chat-new-discussion-button{
    max-width: 230px !important;
}

.chat-sessions-search{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.chat-message.ai{
    max-width: 100%;
}

.discussions-count{
    color: var(--Color1, #223245);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 100% */
}

.chat-sessions-search .search-form{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
}

.search-bar{
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
}

.discussions-section{
    margin-top: 30px;
    animation: chatFadeUp 0.5s ease-out 0.1s both;
}

.discussions-list{
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding-bottom: 30px;
}

/* Empty state */
.discussions-empty-state{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 24px;
    animation: chatFadeUp 0.5s ease-out 0.1s both;
}

.discussions-empty-icon{
    margin-bottom: 24px;
    opacity: 0.6;
}

.discussions-empty-title{
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 8px 0;
}

.discussions-empty-description{
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    color: #64748b;
    line-height: 1.6;
    max-width: 420px;
    margin: 0 0 28px 0;
}

.discussions-empty-cta{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 24px !important;
    border-radius: 12px !important;
    background: #0A58A5 !important;
    color: #fff;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s;
}

.discussions-empty-cta:hover{
    background: #084a8a;
}

.discussions-empty-cta i{
    font-size: 12px;
}

.chat-content .project-page-header-content{
    padding: 0 20px;
    border-bottom: 1px solid var(--Contour-Color, #DFE5EC);
    padding-bottom: 20px;
}

.chat-disclaimer{
    display: none;
}

.discussions-list a.discussion-card{
    animation: chatScaleIn 0.5s ease-out both;
}

.discussions-list a.discussion-card:nth-child(1){ animation-delay: 0.2s; }
.discussions-list a.discussion-card:nth-child(2){ animation-delay: 0.3s; }
.discussions-list a.discussion-card:nth-child(3){ animation-delay: 0.4s; }
.discussions-list a.discussion-card:nth-child(4){ animation-delay: 0.45s; }
.discussions-list a.discussion-card:nth-child(5){ animation-delay: 0.5s; }
.discussions-list a.discussion-card:nth-child(6){ animation-delay: 0.55s; }
.discussions-list a.discussion-card:nth-child(7){ animation-delay: 0.6s; }
.discussions-list a.discussion-card:nth-child(8){ animation-delay: 0.65s; }
.discussions-list a.discussion-card:nth-child(n+9){ animation-delay: 0.7s; }

.discussions-list a{
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    display: flex;
    align-items: center;
    gap: 19px;
    padding: 24px;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;

    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.discussion-content-left{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.discussion-content-container{
    display: flex;
    align-items: start;
    justify-content: space-between;
    width: 100%;
}

.discussion-content-right{
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: end;
    gap: 14px;
}

.chat-actions{
    display: flex;
    align-items: center;
    gap: 15px;
    display: none;
    transition: all 0.2s ease;
}

.discussions-list a:hover .chat-actions{
    display: flex;
}

.discussion-content-right button{
    border: none;
}

.discussion-title{
    color: var(--Color1, #223245);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 125% */
}

.discussion-description{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px; /* 100% */
    margin-top: 10px;
}

.discussion-meta{
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 10px;
}

.discussion-tag{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 8px 15px;
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 116.667% */
}

.discussion-info, .message-count{
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 166.667% */
}

.discussion-date{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 166.667% */
}

.chat-messages {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    width: 70%;
    margin: 0 auto;
    padding-top: 30px;
    padding-bottom: 30px;
    display: flex;
    flex-direction: column;
    gap: 21px;
}

.chat-message{
    max-width: 80%;
}

.chat-message.ai .message-bubble{
    
}

.chat-message.user{
    align-self: flex-end;
    justify-self: end;

}

.chat-message.user .message-bubble{
    border-radius: 15px 15px 0 15px;
    background: rgba(10, 88, 165, 0.10);
    padding: 14px 20px;
}

.chat-message p{
    color: var(--Color0, #445972);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px; /* 157.143% */
}

.message-time{
    color: var(--Color2, #6E7F93);
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px;
    margin-top: 8px;
}

.chat-message.user .message-time{
    text-align: right;
}

/* Welcome message (nouvelle discussion sans contexte) */
.chat-welcome-message{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 30px;
    margin: auto 0;
    animation: chatWelcomeFadeIn 0.7s ease-out both;
}

.welcome-icon{
    width: 64px;
    height: 64px;
    border-radius: 20px;
    background: linear-gradient(135deg, #EFF6FF 0%, #F0F4FF 100%);
    border: 1px solid #BEDBFF;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.welcome-icon .ai-icon-medium{
    width: 32px;
    height: 32px;
}

.welcome-text{
    color: #445972;
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    max-width: 420px;
}

@keyframes chatWelcomeFadeIn{
    from{
        opacity: 0;
        transform: translateY(15px) scale(0.97);
    }
    to{
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.chat-input-container{
    height: 150px;
    flex: 0 0 auto;
    border-radius: 0 0 25px 25px;
    border-top: 1px solid var(--Contour-Color, #DFE5EC);
    display: flex;
    align-items: center;
    justify-content: center;
}

.chat-input-wrapper{
    display: flex;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    justify-content: space-between;
    flex-direction: column;
    align-items: end;
    padding: 20px;
    gap: 5px;
    width: 75%;
    margin: 0 auto;
}

.chat-input-wrapper input,
.chat-input-wrapper textarea {
    width: 100%;
    background-color: transparent;
    border: none;
    color: var(--Color0, #445972);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    font-family: inherit;
    outline: none;
}

.chat-input-wrapper textarea {
    resize: none;
    overflow-y: auto;
    max-height: 88px; /* ~4 lignes */
    min-height: 22px;
    display: block;
    padding: 0;
}

.chat-input-wrapper textarea::-webkit-scrollbar {
    width: 4px;
}

.chat-input-wrapper textarea::-webkit-scrollbar-thumb {
    background: #DFE5EC;
    border-radius: 2px;
}

.chat-input-hint {
    font-size: 11px;
    color: #8A9BB0;
    align-self: flex-start;
    margin-top: 2px;
    line-height: 1;
}

.send-button{
    border-radius: 10px;
    background: #0A58A5;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    border: none;
}

.chat-disclaimer{
    text-align: center;
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px; /* 100% */
    margin-top: 10px;
}

/* Post-diagnostic actions */
.diagnostic-post-actions{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    padding: 20px 24px;
    animation: fadeUp 0.4s ease-out both;
    height: 150px;
    margin: 0 auto;
    border-top: 1px solid var(--Contour-Color, #DFE5EC);
}

.diagnostic-action-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 16px;
    height: 40px;
    border-radius: 10px;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    text-decoration: none;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
    width: auto;
}

.diagnostic-action-btn:active{
    transform: scale(0.97);
}

.diagnostic-action-btn.primary{
    background: #0A58A5;
    color: #fff;
    display: flex;
    justify-content: center;
}

.diagnostic-action-btn.primary:hover{
    background: #084a8a;
    box-shadow: 0 2px 8px rgba(10, 88, 165, 0.25);
}

.diagnostic-action-btn.secondary{
    color: #0A58A5;
    display: flex;
    justify-content: center;
    border: 1px solid #0A58A5;
}

.diagnostic-action-btn.secondary:hover{
    background: rgba(10, 88, 165, 0.14);
}

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Animation IA en train d'écrire */
.chat-message.loading .message-bubble{
    display: inline-flex;
    align-items: center;
    padding: 12px 20px;
}

.loading-dots{
    display: flex;
    align-items: center;
    gap: 4px;
}

.loading-dots span{
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #586D85;
    animation: dot-pulse 1.4s infinite ease-in-out both;
}

.loading-dots span:nth-child(1){
    animation-delay: 0s;
}

.loading-dots span:nth-child(2){
    animation-delay: 0.2s;
}

.loading-dots span:nth-child(3){
    animation-delay: 0.4s;
}

@keyframes dot-pulse{
    0%, 80%, 100%{
        transform: scale(0.4);
        opacity: 0.4;
    }
    40%{
        transform: scale(1);
        opacity: 1;
    }
}

.chat-page-header-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 30px;
    padding-bottom: 0;
}

.chat-page-header-content h1{
    color: var(--Color1, #223245);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 75% */
}

.chat-page-header-content p{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 85.714% */
    margin-top: 10px;
}

.chat-sessions-filters{
    display: flex;
    align-items: center;
    justify-content: space-between;
    animation: chatFadeUp 0.5s ease-out 0.15s both;
    position: relative;
    z-index: 10;
}

.chat-sessions-filters .search-filters-container{
    width: 65%;
    justify-content: end;
}

.chat-sessions-filters h2{
    color: var(--Color1, #223245);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 100% */
}

.search-filters-container form,
.search-filters-container .search-bar{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    max-width: 400px;
    height: 42px;
    padding-left: 10px;
    width: 80%;
}

input.search-input {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 15px;
}



.chat-page-header-content a{
    border-radius: 15px;
background: #0A58A5;
padding: 12px 17px;
display: flex;
align-items: center;
gap: 10px;
height: 44px;
color: #FFF;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 142.857% */
justify-content: center;
}

.chat-view-project-link{
    border-radius: 10px;
    background: #0A58A5;
    padding: 8px 16px;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s;
}

.chat-view-project-link:hover{
    background: #084a8a;
}

.diagnostic-chat-title{
    font-family: "Open Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 91.667% */
    background: var(--Dgrad, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.diagnostic-chat-subtitle{
    color: #5F6D7E;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
    margin-top: 5px;
}

.diagnostic-chat-idea-info{
    margin: 20px 0;
    border-radius: 20px;
    border: 1px solid #BEDBFF;
    background: linear-gradient(135deg, #EFF6FF 0%, #EEF2FF 100%);
    padding: 30px;
}

.diagnostic-chat-idea-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.diagnostic-chat-idea-title{
    color: #5F6D7E;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px; /* 133.333% */
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.diagnostic-chat-idea-value{
    margin: 10px 0;
    color: #223245;
    font-family: "Open Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 155.556% */
}

.diagnostic-chat-idea-field p{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22.75px; /* 162.5% */
}

.diagnostic-chat-edit-button{
    display: flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    padding: 6px 12px;
    color: #586D85;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.diagnostic-chat-edit-button:hover{
    background: #F6F7F8;
    color: #22364D;
}

.diagnostic-chat-global-score{
    border-radius: 20px;
    border: 1px solid var(--Linear, #DFE5EC);
    background: #F6F7F8;
    padding: 30px;
    margin-top: 20px;
}

.diagnostic-notation-failed{
    display: flex;
    align-items: flex-start;
    gap: 14px;
    border-radius: 16px;
    border: 1px solid #FCD34D;
    background: #FFFBEB;
    padding: 20px 24px;
    margin-top: 20px;
    color: #92400E;
}
.diagnostic-notation-failed svg{
    flex-shrink: 0;
    margin-top: 2px;
    color: #D97706;
}
.diagnostic-notation-failed strong{
    display: block;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 6px;
}
.diagnostic-notation-failed p{
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
}

.chat-reformulate-btn{
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 6px;
    padding: 4px 10px;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #fff;
    color: #6B7280;
    font-size: 12px;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s;
}
.chat-reformulate-btn:hover{
    border-color: #0A58A5;
    color: #0A58A5;
}

.diagnose{
    display: flex;
    align-items: center;
    gap: 16px;
}

.diagnose .diagnostic-chat-global-score-value{
    border-right: 1px solid #DFE5EC;
    padding-right: 16px;
}

.diagnostic-chat-global-score-value{
    font-family: "Open Sans";
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 60px; /* 100% */
}

.diagnostic-chat-global-score-label{
    font-family: "Open Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 155.556% */
}

.diagnostic-chat-global-score-text{
    color: #5F6D7E;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}

.diagnostic-chat-global-comment{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22.75px; /* 162.5% */
    margin-top: 10px;
}

.diagnostic-chat-criteria{
}

.diagnostic-chat-criteria-row{
    display: flex;
    align-items: stretch;
    gap: 20px;
    margin-bottom: 20px;
}

.diagnostic-chat-criterion{
    width: 50%;
    border-radius: 20px;
    border: 1px solid var(--Linear, #DFE5EC);
    background: #F6F7F8;
    padding: 17px 21px;
    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.diagnostic-chat-criterion-header{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px; /* 162.5% */
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.diagnostic-chat-progress-bar{
    width: 100%;
    height: 8px;
    background-color: #E5E7EB;
    border-radius: 4px;
    overflow: hidden;
    margin: 8px 0;
}

.diagnostic-chat-progress-fill{
    height: 100%;
    border-radius: 4px;
    transition: width 0.6s ease;
}

.diagnostic-chat-criterion-comment{
    margin-top: 10px;
    color: var(--Variable-texte-2, #586D85);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 166.667% */
}

.diagnostic-chat-recommendations-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 112.5% */
}

.diagnostic-chat-recommendations-list{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.diagnostic-chat-recommendation-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px; /* 162.5% */
}

.diagnostic-chat-recommendation-text{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
}

.diagnostic-chat-recommendation{
    border-radius: 20px;
    border: 1px solid var(--Contour-Color, #DFE5EC);
    padding: 20px;
}

/* Modal d'édition du diagnostic */
.diagnostic-edit-modal{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    align-items: center;
    justify-content: center;
}

.diagnostic-edit-modal.show{
    display: flex;
}

.diagnostic-edit-modal-overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.diagnostic-edit-modal-content{
    position: relative;
    background: #fff;
    border-radius: 16px;
    width: 500px;
    max-width: 90%;
    max-height: 85vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1;
}

.diagnostic-edit-modal-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
}

.diagnostic-edit-modal-header h3{
    color: #22364D;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    margin: 0;
}

.diagnostic-edit-modal-close{
    background: none;
    border: none;
    color: #586D85;
    cursor: pointer;
    padding: 4px;
    border-radius: 6px;
    transition: background 0.2s;
}

.diagnostic-edit-modal-close:hover{
    background: #F6F7F8;
}

.diagnostic-edit-modal-body{
    padding: 24px;
}

.diagnostic-edit-form .form-group{
    margin-bottom: 16px;
}

.diagnostic-edit-form .form-label{
    display: block;
    color: #22364D;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
}

.diagnostic-edit-form .form-input,
.diagnostic-edit-form .form-textarea,
.diagnostic-edit-form .form-select{
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    font-family: "Open Sans";
    font-size: 14px;
    color: #22364D;
    background: #F6F7F8;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.diagnostic-edit-form .form-input:focus,
.diagnostic-edit-form .form-textarea:focus,
.diagnostic-edit-form .form-select:focus{
    border-color: #008236;
}

.diagnostic-edit-form .form-textarea{
    resize: vertical;
}

.diagnostic-edit-modal-actions{
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 16px;
    border-top: 1px solid #DFE5EC;
    margin-top: 8px;
}

.diagnostic-edit-modal-cancel{
    padding: 10px 20px;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    background: #fff;
    color: #586D85;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

.diagnostic-edit-modal-cancel:hover{
    background: #F6F7F8;
}

.diagnostic-edit-modal-save{
    padding: 10px 20px;
    border: none;
    border-radius: 10px;
    background: #0A58A5;
    color: #fff;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

.diagnostic-edit-modal-save:hover{
    background: #006a2b;
}

.chat-actions-container{
    
    height: 150px;
    padding: 0 20px;
    border-radius: 0 0 25px 25px;
border: 1px solid var(--Contour-Color, #DFE5EC);
background: linear-gradient(356deg, #E6ECF5 -58.42%, #FFF 97.1%);
}

.chat-actions-wrapper{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    width: calc(80% + 40px);
    margin: 0 auto;
}

.chat-action-button{
    border-radius: 15px;
    height: 46px;
    padding: 14px 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
}

.chat-action-button-primary{
    background: #0A58A5;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 112.5% */
}

.chat-action-button-secondary{
    border-radius: 15px;
    border: 1px solid var(--Bleu, #0A58A5);
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 112.5% */
}

/* ═══════════════════════════════════════════════════
   TENDANCE CHAT CARD — Carte tendance en haut du chat
   ═══════════════════════════════════════════════════ */

.tendance-chat-card{
    border-radius: 20px;
    border: 1px solid #BEDBFF;
    background: linear-gradient(135deg, #EFF6FF 0%, #EEF2FF 100%);
    padding: 24px 28px;
    margin-bottom: 10px;
    animation: chatScaleIn 0.5s ease-out both;
}

.tendance-chat-header{
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.tendance-chat-icon{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0A58A5, #3B82F6);
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tendance-chat-title{
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    line-height: 24px;
    margin: 0;
}

.tendance-chat-meta{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 6px;
}

.tendance-chat-category{
    border-radius: 6px;
    background: linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%);
    padding: 2px 8px;
    color: #FFF;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.tendance-chat-separator{
    color: #B5C1D0;
    font-size: 10px;
}

.tendance-chat-sector{
    color: #6E7F93;
    font-size: 12px;
    font-weight: 500;
}

.tendance-chat-growth{
    border-radius: 7px;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 8px;
}

.tendance-chat-growth.green{
    border: 1px solid #59B224;
    background: rgba(89, 178, 36, 0.10);
    color: #59B224;
}

.tendance-chat-growth.red{
    border: 1px solid #FC121B;
    background: rgba(252, 18, 27, 0.08);
    color: #FC121B;
}

.tendance-chat-tag-explosif{
    border-radius: 6px;
    background: linear-gradient(135deg, #F59E0B, #EF4444);
    padding: 2px 8px;
    color: #FFF;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.tendance-chat-content{
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(10, 88, 165, 0.1);
}

.tendance-chat-description{
    color: #445972;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.tendance-chat-opportunities{
    margin-top: 14px;
}

.tendance-chat-opportunities-header{
    display: flex;
    align-items: center;
    gap: 8px;
    color: #223245;
    font-size: 13px;
    font-weight: 700;
}

.tendance-chat-opportunities-header i{
    color: #F59E0B;
}

.tendance-chat-opportunities-list{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.tendance-chat-opportunity-tag{
    border-radius: 16px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 5px 14px;
    color: #445972;
    font-size: 12px;
}

.tendance-chat-opportunities-buttons{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}

.tendance-chat-opportunity-btn{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid rgba(10, 88, 165, 0.15);
    background: #FFF;
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    text-align: left;
    cursor: pointer;
    transition: all 0.2s ease;
}

.tendance-chat-opportunity-btn:hover{
    background: #EFF6FF;
    border-color: #0A58A5;
    color: #0A58A5;
    transform: translateX(4px);
}

.tendance-chat-opportunity-btn i{
    color: #0A58A5;
    font-size: 11px;
    flex-shrink: 0;
}

.tendance-chat-opportunity-btn:nth-child(1){ animation: fadeUp 0.3s ease-out 0.1s both; }
.tendance-chat-opportunity-btn:nth-child(2){ animation: fadeUp 0.3s ease-out 0.2s both; }
.tendance-chat-opportunity-btn:nth-child(3){ animation: fadeUp 0.3s ease-out 0.3s both; }
.tendance-chat-opportunity-btn:nth-child(4){ animation: fadeUp 0.3s ease-out 0.4s both; }
.tendance-chat-opportunity-btn:nth-child(5){ animation: fadeUp 0.3s ease-out 0.5s both; }

/* ═══════════════════════════════════════════════════
   IDÉE DU JOUR — Chat Card
   ═══════════════════════════════════════════════════ */

.idee-chat-card{
    border-radius: 20px;
    border: 1px solid #FFD6A5;
    background: linear-gradient(135deg, #FFF7ED 0%, #FEF3E2 100%);
    padding: 24px 28px;
    margin-bottom: 10px;
    animation: chatScaleIn 0.5s ease-out both;
}

.idee-chat-header{
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.idee-chat-icon{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #F59E0B, #F97316);
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 18px;
}

.idee-chat-title{
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    line-height: 24px;
    margin: 0;
}

.idee-chat-meta{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 6px;
}

.idee-chat-category{
    border-radius: 6px;
    background: linear-gradient(135deg, #F59E0B, #F97316);
    padding: 2px 8px;
    color: #FFF;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.idee-chat-separator{
    color: #D1C4B0;
    font-size: 10px;
}

.idee-chat-complexity,
.idee-chat-budget{
    color: #6E7F93;
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
}

.idee-chat-complexity i,
.idee-chat-budget i{
    font-size: 10px;
    color: #F59E0B;
}

.idee-chat-content{
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(245, 158, 11, 0.15);
}

.idee-chat-description{
    color: #445972;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    margin: 0 0 16px 0;
}

.idee-chat-highlights{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.idee-chat-highlight{
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.idee-chat-highlight-icon{
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 13px;
}

.idee-chat-highlight-icon.problem{
    background: rgba(239, 68, 68, 0.1);
    color: #EF4444;
}

.idee-chat-highlight-icon.opportunity{
    background: rgba(16, 185, 129, 0.1);
    color: #10B981;
}

.idee-chat-highlight-content strong{
    font-size: 12px;
    font-weight: 700;
    color: #223245;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.idee-chat-highlight-content p{
    font-size: 13px;
    color: #6E7F93;
    line-height: 20px;
    margin: 2px 0 0 0;
}

.idee-chat-financials{
    display: flex;
    gap: 10px;
    margin-top: 16px;
    flex-wrap: wrap;
}

.idee-chat-financial-item{
    flex: 1;
    min-width: 100px;
    background: #FFF;
    border: 1px solid rgba(245, 158, 11, 0.15);
    border-radius: 12px;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.idee-chat-financial-label{
    font-size: 10px;
    font-weight: 600;
    color: #8B95A5;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.idee-chat-financial-value{
    font-size: 15px;
    font-weight: 700;
    color: #223245;
}

.idee-chat-financial-value.green{
    color: #10B981;
}

.idee-chat-financial-value.blue{
    color: #0A58A5;
}

.idee-chat-footer{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid rgba(245, 158, 11, 0.12);
}

.idee-chat-score{
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
}

.idee-chat-score-bar{
    flex: 1;
    max-width: 120px;
    height: 6px;
    background: rgba(245, 158, 11, 0.15);
    border-radius: 3px;
    overflow: hidden;
}

.idee-chat-score-fill{
    height: 100%;
    background: linear-gradient(90deg, #F59E0B, #F97316);
    border-radius: 3px;
    transition: width 0.6s ease-out;
}

.idee-chat-score-text{
    font-size: 13px;
    font-weight: 700;
    color: #F59E0B;
    white-space: nowrap;
}

.idee-chat-interest{
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    display: flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.idee-chat-interest i{
    color: #0A58A5;
    font-size: 11px;
}

/* ═══════════════════════════════════════════════════
   OPPORTUNITÉ — Chat Card (Cartographie)
   ═══════════════════════════════════════════════════ */

.opportunite-chat-card{
    border-radius: 20px;
    border: 1px solid #B8D4F0;
    background: linear-gradient(135deg, #EFF6FF 0%, #F0F9FF 100%);
    padding: 24px 28px;
    margin-bottom: 10px;
    animation: chatScaleIn 0.5s ease-out both;
}

.opportunite-chat-header{
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.opportunite-chat-icon{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0A58A5, #3B82F6);
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 16px;
}

.opportunite-chat-title{
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    line-height: 24px;
    margin: 0;
}

.opportunite-chat-meta{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 6px;
}

.opportunite-chat-type{
    border-radius: 6px;
    padding: 2px 8px;
    color: #FFF;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.opportunite-chat-type.besoin{
    background: #DC2626;
}

.opportunite-chat-type.ressource{
    background: #008236;
}

.opportunite-chat-type.infra{
    background: #0A58A5;
}

.opportunite-chat-separator{
    color: #B5C1D0;
    font-size: 10px;
}

.opportunite-chat-location{
    color: #0A58A5;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
}

.opportunite-chat-location i{
    font-size: 10px;
}

.opportunite-chat-impact{
    color: #6E7F93;
    font-size: 12px;
    font-weight: 500;
}

.opportunite-chat-impact strong{
    color: #223245;
}

.opportunite-chat-sector{
    color: #6E7F93;
    font-size: 12px;
    font-weight: 500;
}

.opportunite-chat-content{
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(10, 88, 165, 0.1);
}

.opportunite-chat-description{
    color: #445972;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    margin: 0 0 14px 0;
}

.opportunite-chat-keywords-header{
    display: flex;
    align-items: center;
    gap: 8px;
    color: #223245;
    font-size: 13px;
    font-weight: 700;
}

.opportunite-chat-keywords-header i{
    color: #0A58A5;
}

.opportunite-chat-keywords-list{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.opportunite-chat-keyword-tag{
    border-radius: 16px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 5px 14px;
    color: #0A58A5;
    font-size: 12px;
    font-weight: 600;
}

/* ═══════════════════════════════════════════════════
   FICHE IDÉE — Chat Card
   ═══════════════════════════════════════════════════ */

.fiche-idee-chat-card{
    border-radius: 20px;
    border: 1px solid #D6BCFA;
    background: linear-gradient(135deg, #F5F3FF 0%, #EDE9FE 100%);
    padding: 24px 28px;
    margin-bottom: 10px;
    animation: chatScaleIn 0.5s ease-out both;
}

.fiche-idee-chat-header{
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.fiche-idee-chat-icon{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #7C3AED, #A78BFA);
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 18px;
}

.fiche-idee-chat-title{
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    line-height: 24px;
    margin: 0;
}

.fiche-idee-chat-meta{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 6px;
}

.fiche-idee-chat-category{
    border-radius: 6px;
    background: linear-gradient(135deg, #7C3AED, #A78BFA);
    padding: 2px 8px;
    color: #FFF;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.fiche-idee-chat-separator{
    color: #C4B5E0;
    font-size: 10px;
}

.fiche-idee-chat-type{
    font-size: 11px;
    font-weight: 700;
    border-radius: 6px;
    padding: 2px 8px;
}

.fiche-idee-chat-type.gratuit{
    background: rgba(16, 185, 129, 0.1);
    color: #10B981;
}

.fiche-idee-chat-type.premium{
    background: rgba(245, 158, 11, 0.1);
    color: #F59E0B;
}

.fiche-idee-chat-author{
    color: #6E7F93;
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
}

.fiche-idee-chat-author i{
    color: #7C3AED;
    font-size: 10px;
}

.fiche-idee-chat-content{
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(124, 58, 237, 0.1);
}

.fiche-idee-chat-description{
    color: #445972;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    margin: 0 0 14px 0;
}

.fiche-idee-chat-sections{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fiche-idee-chat-section{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fiche-idee-chat-section-title{
    font-size: 12px;
    font-weight: 700;
    color: #223245;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

.fiche-idee-chat-section-title i{
    font-size: 11px;
    color: #7C3AED;
}

.fiche-idee-chat-section-content{
    font-size: 13px;
    color: #6E7F93;
    line-height: 20px;
    margin: 0;
}

/* ═══════════════════════════════════════════════════
   R&D RECHERCHE — Chat Card
   ═══════════════════════════════════════════════════ */

.rd-recherche-chat-card{
    border-radius: 20px;
    border: 1px solid #A7F3D0;
    background: linear-gradient(135deg, #ECFDF5 0%, #F0FDF4 100%);
    padding: 24px 28px;
    margin-bottom: 10px;
    animation: chatScaleIn 0.5s ease-out both;
}

.rd-recherche-chat-header{
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.rd-recherche-chat-icon{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #059669, #34D399);
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 18px;
}

.rd-recherche-chat-title{
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    line-height: 24px;
    margin: 0;
}

.rd-recherche-chat-meta{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 6px;
}

.rd-recherche-chat-category{
    border-radius: 6px;
    background: linear-gradient(135deg, #059669, #34D399);
    padding: 2px 8px;
    color: #FFF;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.rd-recherche-chat-separator{
    color: #86EFAC;
    font-size: 10px;
}

.rd-recherche-chat-location{
    font-size: 11px;
    font-weight: 700;
    border-radius: 6px;
    padding: 2px 8px;
}

.rd-recherche-chat-location.local{
    background: rgba(5, 150, 105, 0.1);
    color: #059669;
}

.rd-recherche-chat-location.international{
    background: rgba(10, 88, 165, 0.1);
    color: #0A58A5;
}

.rd-recherche-chat-trl{
    color: #6E7F93;
    font-size: 12px;
    font-weight: 500;
}

.rd-recherche-chat-trl strong{
    color: #059669;
}

.rd-recherche-chat-content{
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(5, 150, 105, 0.12);
}

.rd-recherche-chat-description{
    color: #445972;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    margin: 0 0 14px 0;
}

.rd-recherche-chat-sections{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rd-recherche-chat-problem-advantage{
    display: flex;
    gap: 12px;
}

.rd-recherche-chat-section{
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.rd-recherche-chat-section-title{
    font-size: 12px;
    font-weight: 700;
    color: #223245;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

.rd-recherche-chat-section-title i{
    font-size: 11px;
    color: #059669;
}

.rd-recherche-chat-section-content{
    font-size: 13px;
    color: #6E7F93;
    line-height: 20px;
    margin: 0;
}

/* Animations page index discussions */
@keyframes chatFadeUp {
    from {
        opacity: 0;
        transform: translateY(25px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes chatScaleIn {
    from {
        opacity: 0;
        transform: scale(0.95) translateY(20px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* ═══════════════════════════════════════════════════
   CHAT PHASE PROGRESS BAR
   ═══════════════════════════════════════════════════ */

.chat-phase-bar {
  flex: 0 0 auto;
  padding: 14px 24px 12px;
  background: #fff;
  border-bottom: 1px solid #DFE5EC;
  animation: chatFadeUp 0.4s ease-out both;
}

.with-phase-bar .chat-messages {
  /* Plus de compensation par nombre magique : le layout flex de .messages-page
     rétrécit automatiquement la zone de messages de la hauteur réelle de la barre. */
  height: auto;
}

.chat-phase-bar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.chat-phase-label {
  font-size: 12px;
  font-weight: 600;
  color: #223245;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.chat-phase-label i {
  color: #0A58A5;
  font-size: 11px;
}

.chat-phase-counter {
  font-size: 11px;
  font-weight: 700;
  color: #0A58A5;
  background: #EFF6FF;
  border: 1px solid #BFDBFE;
  border-radius: 20px;
  padding: 2px 10px;
}

.chat-phase-steps {
  display: flex;
  align-items: flex-start;
  width: 100%;
}

.chat-phase-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
}

.chat-phase-step.last {
  flex: 0;
}

.chat-phase-step-node {
  display: flex;
  align-items: center;
  width: 100%;
}

.chat-phase-step.last .chat-phase-step-node {
  width: auto;
}

.chat-phase-step-circle {
  width: 26px;
  height: 26px;
  min-width: 26px;
  border-radius: 50%;
  border: 2px solid #DFE5EC;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #8A9BB0;
  transition: all 0.35s ease;
  position: relative;
  z-index: 1;
}

.chat-phase-step.done .chat-phase-step-circle {
  background: #0A58A5;
  border-color: #0A58A5;
  color: #fff;
  font-size: 10px;
}

.chat-phase-step.active .chat-phase-step-circle {
  background: #0A58A5;
  border-color: #0A58A5;
  color: #fff;
  box-shadow: 0 0 0 4px rgba(10, 88, 165, 0.15);
}

.chat-phase-step-line {
  flex: 1;
  height: 2px;
  background: #DFE5EC;
  margin: 0 2px;
  transition: background 0.35s ease;
}

.chat-phase-step.done .chat-phase-step-line {
  background: #0A58A5;
}

.chat-phase-step-label {
  margin-top: 6px;
  font-size: 10px;
  font-weight: 600;
  color: #8A9BB0;
  white-space: nowrap;
  transition: color 0.35s ease;
}

.chat-phase-step.active .chat-phase-step-label,
.chat-phase-step.done .chat-phase-step-label {
  color: #223245;
}

/* ═══════════════════════════════════════════════════
   CHAT PROFILE NUDGE BANNER
   ═══════════════════════════════════════════════════ */

/* ===== Modal de reprise de session ===== */
.chat-resume-overlay{
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
    animation: chatNudgeOverlayIn 0.25s ease-out both;
}

.chat-resume-overlay--closing{
    animation: chatNudgeOverlayOut 0.2s ease-in both;
}

.chat-resume-modal{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    width: 100%;
    max-width: 380px;
    border-radius: 16px;
    border: 1px solid #BEDBFF;
    background: linear-gradient(135deg, #EFF6FF 0%, #F0F4FF 100%);
    padding: 28px 24px 24px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.25);
    animation: chatNudgePopupIn 0.28s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.chat-resume-close{
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 8px;
    background: rgba(10, 88, 165, 0.08);
    color: #6E7F93;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, color 0.15s;
}

.chat-resume-close:hover{
    background: rgba(10, 88, 165, 0.16);
    color: #0A58A5;
}

.chat-resume-icon{
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: #FFFFFF;
    border: 1px solid #BEDBFF;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0A58A5;
}

.chat-resume-text{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.chat-resume-text strong{
    color: #223245;
    font-size: 17px;
    font-weight: 700;
}

.chat-resume-text p{
    color: #445972;
    font-size: 14px;
    line-height: 21px;
    margin: 0;
}

.chat-resume-actions{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 4px;
    width: 100%;
}

.chat-resume-reset-btn{
    flex: 1;
    padding: 11px 16px;
    border-radius: 12px;
    background: #FFFFFF;
    border: 1px solid #DFE5EC;
    color: #445972;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    white-space: nowrap;
    transition: background 0.15s, border-color 0.15s;
}

.chat-resume-reset-btn:hover{
    background: #F5F8FB;
    border-color: #C7D2DE;
    color: #445972;
}

.chat-resume-continue-btn{
    flex: 1;
    padding: 11px 16px;
    border-radius: 12px;
    background: #0A58A5;
    border: none;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.chat-resume-continue-btn:hover{
    background: #084a8a;
}

.chat-profile-nudge-overlay{
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
    animation: chatNudgeOverlayIn 0.25s ease-out both;
}

.chat-profile-nudge-overlay--closing{
    animation: chatNudgeOverlayOut 0.2s ease-in both;
}

@keyframes chatNudgeOverlayIn{
    from{ opacity: 0; }
    to{ opacity: 1; }
}

@keyframes chatNudgeOverlayOut{
    from{ opacity: 1; }
    to{ opacity: 0; }
}

.chat-profile-nudge-popup{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    width: 100%;
    max-width: 380px;
    border-radius: 16px;
    border: 1px solid #BEDBFF;
    background: linear-gradient(135deg, #EFF6FF 0%, #F0F4FF 100%);
    padding: 28px 24px 24px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.25);
    animation: chatNudgePopupIn 0.28s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes chatNudgePopupIn{
    from{ opacity: 0; transform: translateY(12px) scale(0.96); }
    to{ opacity: 1; transform: translateY(0) scale(1); }
}

.chat-profile-nudge-close{
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 8px;
    background: rgba(10, 88, 165, 0.08);
    color: #6E7F93;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, color 0.15s;
}

.chat-profile-nudge-close:hover{
    background: rgba(10, 88, 165, 0.16);
    color: #0A58A5;
}

.chat-profile-nudge-actions{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 4px;
}

.chat-profile-nudge-later{
    border: none;
    background: none;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    padding: 8px 12px;
    border-radius: 10px;
    transition: color 0.15s;
}

.chat-profile-nudge-later:hover{
    color: #223245;
}

.chat-profile-nudge-icon{
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, #0A58A5, #3B82F6);
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 15px;
}

.chat-profile-nudge-text{
    flex: 1;
    min-width: 0;
}

.chat-profile-nudge-text strong{
    color: #223245;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    display: block;
}

.chat-profile-nudge-text p{
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin: 2px 0 0 0;
}

.chat-profile-nudge-progress{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.chat-profile-nudge-bar{
    width: 80px;
    height: 6px;
    background: #DFE5EC;
    border-radius: 3px;
    overflow: hidden;
}

.chat-profile-nudge-fill{
    height: 100%;
    background: linear-gradient(90deg, #0A58A5, #3B82F6);
    border-radius: 3px;
    transition: width 0.6s ease-out;
}

.chat-profile-nudge-percent{
    color: #0A58A5;
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.chat-profile-nudge-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 18px;
    border-radius: 10px;
    background: #0A58A5;
    color: #FFF;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.2s ease;
}

.chat-profile-nudge-btn:hover{
    background: #084a8a;
}

@keyframes chatNudgeFadeIn{
    from{
        opacity: 0;
        transform: translateY(-10px);
    }
    to{
        opacity: 1;
        transform: translateY(0);
    }
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — Mobile & Tablet (max-width: 768px)
   ═══════════════════════════════════════════════════ */

@media (max-width: 768px){
    .ai-assistant-intro .action-cards{
        flex-direction: column;
    }

    .ai-assistant-intro .action-cards .action-card, .ai-assistant-intro .action-cards button{
        width: 100% !important;
    }

    .home-chat-form{
        border-top: 1px solid #DFE5EC;
        height: 135px;
        padding: 10px !important;

    }

    .home-page-content{
        padding: 0 !important;
    }



    h1.greeting {
        font-size: 24px !important;
    }

    .home-page{
        padding: 40px 0 !important;
        padding-bottom: 0 !important;
    }

    .discussions-new-btn span{
        display: none;
    }

    .discussions-page-header{
        padding: 0 15px;
    }

    .discussions-page-layout{
        padding: 20px;
        height: calc(100% - 64px);
    }

    .chat-sessions-filters h2{
        display: none;
    }

    .chat-sessions-filters .search-filters-container{
        width: 100%;
    }

    .discussions-list a{
        justify-content: start;
        padding: 20px;
        align-items: start;

    }

    .chat-input-container{
        border-radius: 0;
    }

    .project-insufficient-credits-alert{
        flex-direction: column;
    }

    .settings-tabs{
        width: 100%;
        overflow: scroll;
        justify-content: space-between;
    }
    .settings-form .form-row{
        flex-direction: column;
        gap: 5px;
    }

    .settings-tabs button{
        padding: 7px 10px;
    }

    .settings-form .form-row .form-group{
        width: 100%;
    }

    img.discussion-icon{
        width: 25px;
        height: 25px;
    }

    .discussion-meta{
        flex-direction: column;
        align-items: start;
        gap: 10px;
    }

    .discussion-content-container{
        gap: 10px;
    }

    .discussion-info, .message-count{
        display: none;
    }

    .chat-content{
        margin: 0 !important;
        border-radius: 0 !important;
        height: calc(100vh - 133.5px) !important;
        padding: 0 !important;
    }

    .diagnostic-post-actions{
        height: 100px;
    }

    .chat-sessions-page{
        height: 100%;
    }

    .chat-content .project-page-header-content{
        padding: 20px;
    }

    .messages-page{
        height: 100% !important;
    }

    .chat-messages{
        height: calc(100% - 164px) !important;
        width: 90%;
    }

    .diagnostic-chat-global-score-value{
        font-size: 45px;
    }

    .diagnostic-chat-criteria-row{
        flex-direction: column;
    }

    .diagnostic-chat-criterion{
        width: 100%;
    }

    .diagnostic-post-actions{
        padding: 20px;
    }

    .diagnostic-action-btn{
        padding: 20px 12px;
        font-size: 12px;
    }

    .chat-input-wrapper{
        width: 90%;
        flex-direction: row;
    }

    .chat-input-container{
        height: 100px;
    }

    .tendance-chat-card{
        padding: 18px;
    }

    .tendance-chat-header{
        flex-direction: column;
        gap: 10px;
    }

    .tendance-chat-title{
        font-size: 16px;
    }

    .tendance-chat-opportunities-list{
        flex-wrap: wrap;
    }

    .tendance-chat-opportunity-btn{
        font-size: 12px;
        padding: 10px 14px;
    }

    .idee-chat-card{
        padding: 18px;
    }

    .idee-chat-header{
        flex-direction: column;
        gap: 10px;
    }

    .idee-chat-title{
        font-size: 16px;
    }

    .idee-chat-financials{
        flex-direction: column;
    }

    .idee-chat-footer{
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .idee-chat-score-bar{
        max-width: 100%;
        width: 100%;
    }

    .opportunite-chat-card,
    .fiche-idee-chat-card,
    .rd-recherche-chat-card{
        padding: 18px;
    }

    .opportunite-chat-header,
    .fiche-idee-chat-header,
    .rd-recherche-chat-header{
        flex-direction: column;
        gap: 10px;
    }

    .opportunite-chat-title,
    .fiche-idee-chat-title,
    .rd-recherche-chat-title{
        font-size: 16px;
    }

    .rd-recherche-chat-problem-advantage{
        flex-direction: column;
    }

    .chat-profile-nudge-content{
        flex-wrap: wrap;
        gap: 12px;
        padding: 12px 16px;
    }

    .chat-profile-nudge-text strong{
        font-size: 12px;
    }

    .chat-profile-nudge-progress{
        order: 4;
        width: 100%;
    }

    .chat-profile-nudge-bar{
        flex: 1;
        width: auto;
    }
}

/* ── Bascule discussion libre → parcours structuré (intégrée à la bulle IA) ── */
.chat-convert-inline{
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: fit-content;
    max-width: 100%;
    margin: 8px 0 2px;
    padding: 12px 14px;
    border: 1px solid rgba(10, 88, 165, 0.18);
    background: rgba(10, 88, 165, 0.05);
    border-radius: 14px;
    animation: fadeUp 0.3s ease both;
}

.chat-convert-label{
    font-family: "Open Sans", sans-serif;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--Color1, #223245);
}

.chat-convert-actions{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* button_to génère un <form> ; on le rend transparent pour la mise en page flex */
.chat-convert-actions form.button_to{
    display: contents;
}

.chat-convert-btn{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    height: 40px;
    border-radius: 10px;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    color: #0A58A5;
    background: #fff;
    border: 1px solid #0A58A5;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.chat-convert-btn:hover{
    background: rgba(10, 88, 165, 0.12);
}

.chat-convert-btn:active{
    transform: scale(0.97);
}

.chat-convert-btn.primary{
    color: #fff;
    background: #0A58A5;
}

.chat-convert-btn.primary:hover{
    background: #084a8a;
    box-shadow: 0 2px 8px rgba(10, 88, 165, 0.25);
}

@media (max-width: 640px){
    .chat-convert-inline{
        width: 100%;
    }
    .chat-convert-actions{
        justify-content: stretch;
    }
    .chat-convert-btn{
        flex: 1;
        justify-content: center;
    }
}

/* ── Grille d'idées 2x2 (brainstorming) ── */
.idea-grid-wrap{
    width: 100%;
    max-width: 620px;
}

.idea-grid-intro{
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    color: var(--Color1, #223245);
    margin: 0 0 12px;
}

.idea-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.idea-card{
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px;
    border: 1px solid #DFE5EC;
    border-radius: 14px;
    background: #fff;
    text-align: left;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
}

.idea-card.is-clickable{
    cursor: pointer;
}

.idea-card.is-clickable:hover{
    border-color: #0A58A5;
    box-shadow: 0 4px 14px rgba(10, 88, 165, 0.12);
    transform: translateY(-1px);
}

.idea-card.selected{
    border-color: #0A58A5;
    box-shadow: 0 0 0 2px rgba(10, 88, 165, 0.18);
}

.idea-card-title{
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--Color1, #223245);
}

.idea-card-pitch{
    font-family: "Open Sans", sans-serif;
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--Color2, #6E7F93);
}

.idea-card-invest{
    margin-top: 2px;
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: #0A58A5;
}

.idea-detail{
    margin-top: 12px;
    padding: 14px;
    border: 1px solid rgba(10, 88, 165, 0.18);
    background: rgba(10, 88, 165, 0.05);
    border-radius: 14px;
    animation: fadeUp 0.25s ease both;
}

.idea-detail-title{
    margin: 0 0 8px;
    font-family: "Open Sans", sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: var(--Color1, #223245);
}

.idea-detail-row{
    margin: 0 0 6px;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    line-height: 1.5;
    color: var(--Color1, #223245);
}

.idea-detail-row strong{
    color: #0A58A5;
}

.idea-detail-invest{
    margin: 8px 0 12px;
    font-size: 13px;
    font-weight: 700;
    color: #0A58A5;
}

.idea-detail-actions{
    display: flex;
}

.idea-validate-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 11px 16px;
    border: none;
    border-radius: 10px;
    background: #0A58A5;
    color: #fff;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.12s ease;
}

.idea-validate-btn:hover{ background: #084a8a; }
.idea-validate-btn:active{ transform: scale(0.98); }

.idea-more-btn{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding: 8px 14px;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    background: #fff;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.idea-more-btn:hover{
    border-color: #0A58A5;
    color: #0A58A5;
}

@media (max-width: 560px){
    .idea-grid{
        grid-template-columns: 1fr;
    }
}
/* ===== Page entrance animations ===== */
@keyframes segmentFadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.segment-animate-in {
    opacity: 0;
    animation: segmentFadeInUp 0.5s ease forwards;
}

.segment-animate-in:nth-child(1) { animation-delay: 0s; }
.segment-animate-in:nth-child(2) { animation-delay: 0.1s; }
.segment-animate-in:nth-child(3) { animation-delay: 0.2s; }

.segment-animate-delay-1 { animation-delay: 0.1s !important; }
.segment-animate-delay-2 { animation-delay: 0.2s !important; }
.segment-animate-delay-3 { animation-delay: 0.3s !important; }

/* ===== Header: count + validate button ===== */
.segments-header-count {
    color: var(--Color1, #223245);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    white-space: nowrap;
}

.segments-header-validate-btn {
    border-radius: 10px;
    background: var(--Color-2, #0A58A5);
    padding: 10px 20px;
    border: none;
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
    line-height: 12px;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.2s ease;
}

.segments-header-validate-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.segments-header-validate-btn:not(:disabled):hover {
    opacity: 0.9;
}

.segments-header-left{
    border-radius: 10px;
    border: 1px solid rgba(10, 88, 165, 0.30);
    background: rgba(10, 88, 165, 0.06);
    padding: 14px 22px;
    display: flex;
    gap: 10px;
    align-items: center;
}

.segments-header-left-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.segments-header-left-content h3{
    color: var(--Color1, #223245);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px; /* 100% */
}

.regenerate-button{
    color: var(--Color-2, #0A58A5);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px;
    border: none;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.regenerate-button:disabled{
    opacity: 0.45;
    cursor: not-allowed;
}

.regenerate-cost{
    font-size: 11px;
    font-weight: 500;
    color: #fff;
    background: var(--Color-2, #0A58A5);
    padding: 2px 8px;
    border-radius: 10px;
    line-height: 16px;
}

.segments-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 20px;
}

.segments-header-left{
    margin-bottom: 30px;
}

.segment-card{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 24px 19px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
}

.segment-card-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.segments-container .segment-card.validated{
    border: 1px solid #0A58A5;
    background: rgba(10, 88, 165, 0.06);
}

.segment-card-header h4{
    color: #223245;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 22.5px; /* 125% */
}

.segment-type{
    border-radius: 16777200px;
    border: 1px solid rgba(0, 0, 0, 0.00);
    background: #F0F5FA;
    padding: 2px 10px;
    color: var(--Color-2, #0A58A5);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 133.333% */
    letter-spacing: 0.3px;
}

.segment-type.b2c{
    background: #0A58A5;
    color: #FFF;
}

.segment-type.b2b{
    background: #DFE5EC;
    color: #223245;
}

.segment-description{
    color: #6E7F93;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 157.143% */
}

.segment-metrics{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 17px 20px;
    display: flex;
    gap: 30px;
    align-items: center;
}

.segment-metrics-separator{
    background-color: #DFE5EC;
    width: 1px;
    min-height: 40px;
}

.segment-score{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.segment-score-value{
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: var(--Color1, #223245);
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 75% */
    background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.segment-score-label{
    color: #6E7F93;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
    text-transform: uppercase;
}

.segment-metrics-items{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    width: 100%;
}

.segment-metrics-item{
    width: 100%;
    display: flex;
    align-items: center;
    gap: 4px;
}

.segment-metrics-item-label{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px; /* 100% */
    width: 75px;
}

.segment-metrics-item-value{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 10px;
    width: 70px;
}

.segment-metrics-item-fill{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #0A58A5;
    height: 100%;
}

.segment-actions{
    display: flex;
    align-items: center;
    gap: 20px;
}

.segment-edit-button{
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    padding: 11px 27px 11px 26px;
    height: 42px;
    display: flex;
    align-items: center;
    gap: 7px;
    width: 40%;
    justify-content: center;

}

.segment-edit-button span{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
}

.segment-add-button{
    border-radius: 10px;
    background: #0A58A5;
    height: 42px;
    padding: 11px 61px;
    width: 60%;
    border: none;
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 142.857% */
}

.segment-add-button.selected{
    border-radius: 10px;
    background: rgba(10, 88, 165, 0.06);
    color: var(--Color-2, #0A58A5);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 142.857% */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.segments-container.has-validated .segment-card{
    opacity: 0.5;
    cursor: not-allowed;
}

.segments-container .segment-card.validated{
    opacity: 1;
    cursor: pointer;
}

.segment-add-button span{
    color: var(--Color-2, #0A58A5);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 142.857% */
}

.segments-container.has-validated .segment-card:not(.validated) {
    opacity: 0.5;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.segment-card.validated {
    opacity: 1;
}

.segment-card.segment-card-disabled {
    opacity: 0.45;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.segment-add-button:disabled,
.choose-button:disabled {
    cursor: not-allowed;
}

.segments-header-left img{
    width: 24px;
    height: 24px;
}

.segments-clients-page{
    height: calc(100vh - 80px);
    overflow: scroll;
}

.module-footer{
    border-radius: 0 0 20px 20px;
    border-top: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
}

.module-footer{
    display: flex;
    align-items: center;
    gap: 20px;
}



.module-footer-left h6{
    color: var(--Color1, #223245);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 125% */
}

.module-footer-button:disabled{
    opacity: 0.6;
    cursor: not-allowed;
}

.module-footer-button{
    border-radius: 15px;
    background: var(--Color-2, #0A58A5);
    padding: 16px;
    justify-content: center;
    align-items: center;
    gap: 30px;
    display: flex;
    border: none;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 75% */
}

.ai-card-content, .simple-loader{
    border-radius: 16px;
    background: #FFF;
    padding: 20px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    text-align: center;
    margin-top: 30px;
}

.ai-card-content img{
    width: 75px;
    height: 75px;
}

.ai-card-title{
    color: #223245;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 140% */
}

.ai-card-description{
    color: #6E7F93;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 171.429% */
}

.generate-segments-button{
    border-radius: 10px;
    background: #0A58A5;
    box-shadow: 0 10px 15px -3px rgba(28, 57, 142, 0.10), 0 4px 6px -4px rgba(28, 57, 142, 0.10);
    padding: 10px 18px 10px 18px;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 175% */
    display: flex;
    justify-content: center;    border: none;
    cursor: pointer;
    width: 350px;
}

.generate-segments-button span{
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 175% */
    text-align: center;

}


/* Segment Edit Modal */
.segment-edit-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.segment-edit-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

.segment-edit-modal-content {
    position: relative;
    background-color: #FFFFFF;
    border-radius: 12px;
    width: 100%;
    max-width: 50%;
    max-height: 90vh;
    overflow-y: auto;
    z-index: 1001;
}

.segment-edit-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
    background: linear-gradient(180deg, #E6ECF5 0%, #FFFFFF 100%);
}

.segment-edit-modal-header h3 {
    font-size: 20px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.segment-edit-modal-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: none;
    cursor: pointer;
    color: #6E7F93;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.segment-edit-modal-close:hover {
    background-color: #F8F9FA;
    color: #223245;
}

.segment-edit-modal-close svg {
    width: 20px;
    height: 20px;
}

.segment-edit-modal-form {
    padding: 24px;
}

.segment-edit-form-group {
    margin-bottom: 10px;
}

.customer-profile-item.job-item.editing{
    flex-direction: column;
    gap: 10px;
}

.segment-edit-form-group label {
    color: var(--Color1, #223245);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 100% */
}

.segment-edit-form-input,
.segment-edit-form-textarea {
    width: 100%;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    font-size: 14px;
    color: #223245;
    transition: all 0.2s ease;
    box-sizing: border-box;
    font-family: "Open Sans";

}

.segment-edit-form-input:focus,
.segment-edit-form-textarea:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.segment-edit-form-textarea {
    resize: vertical;
    min-height: 100px;
    resize: none;
}

.segment-edit-modal-actions {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #DFE5EC;
}

.segment-edit-modal-cancel,
.segment-edit-modal-save {
    padding: 10px 40px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    height: 44px;
    cursor: pointer;
    border: none;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
}

.segment-edit-modal-cancel {
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 85.714% */
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
}

.segment-edit-modal-save {
    background-color: #0A58A5;
    color: #FFFFFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 85.714% */
}

.segment-edit-modal-save:hover:not(:disabled) {
    background-color: #084A8F;
}

.segment-edit-modal-save:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.segment-edit-form-row{
    display: flex;
    gap: 10px;
}

.segment-edit-form-row .segment-edit-form-group{
    width: 50%;
}

/* ===== Help Modal ===== */
.segment-help-body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 28px;
    max-height: 65vh;
    overflow-y: auto;
}

.segment-help-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.segment-help-icon-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.segment-help-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #EBF5FF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.segment-help-section h4 {
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.segment-help-section p {
    font-size: 14px;
    color: #4A5568;
    line-height: 1.6;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.segment-help-reasons {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.segment-help-reason {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.segment-help-reason-num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #0A58A5;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
    font-family: "Open Sans", sans-serif;
}

.segment-help-reason strong {
    font-size: 14px;
    color: #223245;
    display: block;
    margin-bottom: 4px;
    font-family: "Open Sans", sans-serif;
}

.segment-help-reason p {
    font-size: 13px;
    color: #6E7F93;
    line-height: 1.5;
    margin: 0;
}

.segment-help-steps {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.segment-help-step {
    background: #F6F7F8;
    border-radius: 10px;
    padding: 14px 16px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.segment-help-step-badge {
    background: #0A58A5;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
    font-family: "Open Sans", sans-serif;
}

.segment-help-step p {
    font-size: 13px;
    color: #4A5568;
    line-height: 1.5;
    margin: 0;
}

@media (max-width: 1024px){
    .segments-grid{
        grid-template-columns: 1fr;
    }

    .segment-metrics-items{
        grid-template-columns: 1fr;
    }

    .segment-actions{
        flex-direction: column;
    }

    .segment-edit-button,
    .segment-add-button{
        width: 100%;
    }
}

/* Help Modal with animations */
.segment-help-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.segment-help-modal.is-visible {
    opacity: 1;
    visibility: visible;
}

.segment-help-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

.segment-help-modal-content {
    position: relative;
    background-color: #FFFFFF;
    border-radius: 12px;
    width: 100%;
    max-width: 50%;
    max-height: 90vh;
    overflow-y: auto;
    z-index: 1001;
    transform: translateY(20px) scale(0.97);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.segment-help-modal.is-visible .segment-help-modal-content {
    transform: translateY(0) scale(1);
}
/* ===== Modal tutoriel segmentation ===== */
.seg-tutorial-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.seg-tutorial-overlay {
    position: absolute;
    inset: 0;
    background: rgba(34, 50, 69, 0.55);
}

.seg-tutorial-content {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 20px;
    width: 92%;
    max-width: 940px;
    height: 82vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.18);
    overflow: hidden;
}

.seg-tutorial-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    border-bottom: 1px solid #DFE5EC;
    flex-shrink: 0;
}

.seg-tutorial-header h3 {
    font-size: 15px;
    font-weight: 700;
    color: #223245;
    margin: 0;
}

.seg-skip-btn {
    font-size: 13px;
    font-weight: 600;
    color: #6E7F93;
    background: none;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    padding: 6px 14px;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}

.seg-skip-btn:hover {
    color: #223245;
    border-color: #B5C1D0;
}

/* Slides dans le modal : hauteur fixe, pas de redimensionnement entre slides */
.seg-tutorial-content .module-presentation {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    height: auto;
    justify-content: space-between;
}

.seg-tutorial-content .pres-slides {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    height: auto;
    width: 88%;
    margin-bottom: 0;
    background: none;
    padding: 20px 0;
    border-radius: 0;
}

.seg-tutorial-content .pres-slides .pres-slide {
    height: 100%;
    min-height: 100%;
    align-items: flex-start;
}

.seg-tutorial-content .seg-img {
    height: 100%;
    object-fit: contain;
}

.seg-tutorial-content .pres-slide-content {
    height: 100%;
    overflow-y: auto;
    padding-right: 6px;
}

.seg-tutorial-content .pres-slide-content h2 {
    font-size: 20px;
    line-height: 1.4;
}

.seg-tutorial-content .pres-nav {
    flex-shrink: 0;
    position: static;
    background: #fff;
}

@media (max-width: 768px) {
    .seg-tutorial-content {
        width: 96%;
        height: 90vh;
        border-radius: 14px;
    }

    .seg-tutorial-content .seg-img {
        max-height: 160px;
        width: 100%;
    }
}

/* ===== Empty state: bouton générer + en savoir plus ===== */
.seg-generate-main-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 10px;
    background: var(--Color-2, #0A58A5);
    padding: 12px 24px;
    border: none;
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.seg-generate-main-btn:hover {
    opacity: 0.88;
}

.seg-generate-main-btn:disabled {
    background: #C7D2DE;
    cursor: not-allowed;
    opacity: 1;
}

.seg-generate-main-btn:disabled:hover {
    opacity: 1;
}

.seg-generate-main-btn-icon {
    width: 16px;
    height: 16px;
    filter: brightness(0) invert(1);
}

.seg-learn-more-btn {
    display: inline-flex;
    align-items: center;
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    background: #fff;
    padding: 12px 24px;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease;
}

.seg-learn-more-btn:hover {
    border-color: #0A58A5;
    color: #0A58A5;
}
.segment-value-prop-content{
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 20px;
    margin-top: 24px;
}

.vp-canvas-row {
    display: flex;
    gap: 24px;
    width: 100%;
}

.view-toggle{
    display: flex;
    gap: 10px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 5px;
    height: 44px;
}

.view-toggle button{
    border: none;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 100%;
    padding: 8px 13px;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 85.714% */
}

.view-toggle button.active{
    border-radius: 5px;
    background: #0A58A5;
    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 85.714% */
}


.customer-profile-section, .value-prop-map-section{
    width: 100%;
    border-radius: 15px;
    background: #F6F7F8;
    padding: 20px;
    height: fit-content;
}

.customer-profile-section h2, .value-prop-map-section h2{
    text-align: center;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 114.286% */
}

.vp-category{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    margin-top: 15px;
    padding: 20px;
    height: 300px;
    overflow-y: auto;
}

.vp-category-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.vp-category-header h3{
    color: #364153;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.vp-category:hover .bmc-add-item,
.customer-profile-card:hover .bmc-add-item,
.value-prop-map-card:hover .bmc-add-item {
    opacity: 1;
}

.vp-items-list{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.vp-item{
    border-radius: 12px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
    padding: 12px;
    cursor: grab;
    display: flex;
    align-items: start;
    justify-content: space-between;
    transition: all 0.2s ease;
}

.vp-item:active {
    cursor: grabbing;
}

.vp-item-dragging {
    opacity: 0.3;
}

.vp-item-dragging:hover {
    transform: none;
}

.vp-item-drag-over {
    border-top: 2px solid #0A58A5;
}

.vp-items-list-drag-over {
    background: rgba(10, 88, 165, 0.04);
    border-radius: 8px;
}

.vp-item:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

.vp-item:hover .vp-item-delete {
    opacity: 1;
}

.vp-item-delete {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    margin-left: 8px;
    opacity: 0;
    color: inherit;
}

.job-item{
    border: none;
    background: #F2F8FF;
}

.pain-item{
    border-radius: 12px;
    border: none;
    background: rgba(255, 226, 226, 0.40);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.gain-item{
    border-radius: 12px;
    border: none;
    background: rgba(220, 252, 231, 0.50);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}


.vp-item-content p{
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 17.5px; /* 145.833% */
}

.job-item p{
}

.pain-item p{
}

.gain-item p{
}

.vp-item-actions{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    position: relative;
    flex-shrink: 0;
    width: 100%;
}

.vp-item-menu-btn{
    border: none;
}

.confirmed-tag{
    border-radius: 4px;
    border: 1px solid rgba(28, 57, 142, 0.30);
    opacity: 0.6;
    color: #1C398E;
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    line-height: 13.5px; /* 150% */
    text-transform: uppercase;
    padding: 0.5px 4.602px 1px 5px;

}

.pain-item .confirmed-tag{
    background: rgba(255, 226, 226, 0.40);
    border: 1px solid #FFC9C9;
    color: #82181A;
}

.gain-item .confirmed-tag{
    background: rgba(220, 252, 231, 0.50);
    border: 1px solid #B9F8CF;
    color: #0D542B;
}

.vp-row{
    display: flex;
    gap: 24px;
}

.vp-row .vp-category{
    width: 50%;
}

.vp-item-dropdown.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.vp-item-dropdown{
    position: absolute;
    top: 18px;
    left: -16px;
    background-color: #FFFFFF;
    border:1px solid #DFE5EC;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 180px;
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s ease;
    z-index: 1000;
}

.vp-item-dropdown .dropdown-item{
    color: #6E7F93;
}

.vp-item-dropdown .dropdown-item i{
    margin-right: 8px;
    color: #6E7F93;
}

.vp-item-input{
    width: 100%;
    background-color: transparent;
    border: none;
    outline: none;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 17.5px; /* 145.833% */
}


.editing .vp-item-actions{
    justify-content: end;
    gap: 10px;
    flex-direction: row-reverse;
}

.editing .vp-item-actions .vp-item-cancel-btn{
    color: #6E7F93;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 17.5px; /* 145.833% */
    border: none;
    background-color: transparent;
    cursor: pointer;
}

.editing .vp-item-actions .vp-item-save-btn{
    color: #1C398E;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 17.5px; /* 145.833% */
    border: none;
    background-color: #0A58A5;
    cursor: pointer;
    color: #FFFFFF;
    padding: 6px 16px;
    border-radius: 8px;
}

.pain-reliever-item p{
}

.gain-creator-item p{
}

.service-item p{
}

.vp-item.service-item.editing .vp-item-save-btn{
    background-color: #733E0A;
}

.vp-item.pain-item.editing .vp-item-save-btn{
    background-color: #82181A;
}

.vp-item.gain-item.editing .vp-item-save-btn{
    background-color: #0D542B;
}

.service-item .vp-item-menu-btn{
}

.service-item{
    border-radius: 16px;
    border: none;
    background: #FEF9C2;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.vp-item.pain-reliever-item{
    border-radius: 16px;
    border: none;
    background: #FFEDD4;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.pain-reliever-item.editing{
    border-radius: 16px;
    border: none;
    background: #FFEDD4;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}


.vp-item.pain-reliever-item.editing .vp-item-save-btn{
    background-color: #B45309;
}

.vp-item.gain-creator-item{
    border-radius: 16px;
    border: none;
    background: #D0FAE5;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.gain-creator-item.editing{
    border-radius: 16px;
    border: none;
    background: #D0FAE5;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}


.vp-item.gain-creator-item.editing .vp-item-save-btn{
    background-color: #0D542B;
}

.value-prop-filters-actions{
    display: flex;
    gap: 24px;
}

/* Segment Dropdown */
.segment-dropdown-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

.segment-dropdown-button {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 14px;
    font-weight: 500;
    color: #364153;
    width: 50%;
    justify-content: space-between;
    border-radius: 10px;
    border: 1px solid #E6EAF0;
    height: 44px;
    padding: 0 20px;
    background: linear-gradient(180deg, #E6ECF5 0%, #FFFFFF 100%);
}

.segment-dropdown-button:hover {
    background-color: #F3F4F6;
}

.segment-dropdown-button .segment-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.segment-dropdown-text {
    flex: 1;
    text-align: left;
}

.segment-dropdown-button .dropdown-arrow {
    color: #6E7F93;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.segment-dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    width: 500px;
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s ease;
    z-index: 1000;
}

.segment-dropdown-menu.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.segment-dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    color: #1F2937;
    text-decoration: none;
    border-radius: 8px;
    transition: background-color 0.2s ease;
    border: none;
    background: none;
    cursor: pointer;
    font-family: "Open Sans", sans-serif;
    text-align: left;
}

.segment-dropdown-item:hover {
    background-color: #F3F4F6;
}

.segment-dropdown-item.active {
    background-color: #F3F4F6;
    font-weight: 600;
}

.segment-dropdown-item .segment-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.segment-dropdown-text{
    color: var(--Color1, #0A58A5);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 125% */
}

.vp-category-header-left{
    display: flex;
    align-items: center;
    gap: 5px;
}

.value-prop-summary{
    margin-top: 24px;
}

.summary-main-statement{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px;
}

.summary-main-statement label, .summary-sub-item label{
    color: #364153;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
}

.summary-main-statement textarea, .summary-sub-item textarea{
    display: flex;
    height: 200px;
    padding: 10px 20px;
    gap: 8px;
    flex-shrink: 0;
    align-self: stretch;
    font-family: "Open Sans", sans-serif;
    border-radius: 14px;
    border: 1px solid #E5E7EB;
    background: #F9FAFB;
    color: #6A7282;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
}

.summary-sub-sections{
    display: flex;
    align-items: stretch;
    gap: 10px;
}

.summary-sub-item{
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 33%;
}

.customer-profile-list{
    margin-top: 40px;
    border-top: 1px solid #DFE5EC;
    padding-top: 24px;
}

.customer-profile-cards, .value-prop-map-cards{
    display: flex;
    align-items: stretch;
    gap: 30px;
    margin-top: 24px;
}

.customer-profile-list-title{
    color: #E7000B;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 155.556% */
}

.customer-profile-card-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.customer-profile-card, .value-prop-map-card{
    border-radius: 16px;
    border: 1px solid #E5E7EB;
    background: #F9FAFB;
    padding: 17px;
    width: 33%;
}

.customer-profile-items, .value-prop-map-items{
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.customer-profile-item, .value-prop-map-item{
    display: flex;
    align-items: start;
    justify-content: space-between;
    padding: 9px;
    border-radius: 12px;
    position: relative;
    font-size: 12px;
    font-weight: 400;
    cursor: pointer;
    transition: all 0.2s ease;
}

.customer-profile-item:hover, .value-prop-map-item:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

.customer-profile-item:hover .vp-item-delete, .value-prop-map-item:hover .vp-item-delete {
    opacity: 1;
}

.customer-profile-item .vp-item-actions, .value-prop-map-item .vp-item-actions{
    margin-top: 0;
    width: auto;
    flex-shrink: 0;
}

.customer-profile-item .vp-item-dropdown, .value-prop-map-item .vp-item-dropdown{
    top: calc(100% + 4px);
    right: 0;
    left: auto;
}

.value-prop-map-list{
    margin-top: 40px;
}

.value-prop-map-list-title{
    color: #155DFC;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 155.556% */
}

.pain-reliever-item{
    border-radius: 16px;
    border: 1px solid #FFD6A7;
    background: #FFEDD4;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.gain-creator-item{
    border-radius: 16px;
    border: 1px solid #A4F4CF;
    background: #D0FAE5;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}



.customer-profile-card-header-left{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.customer-profile-card-header-left-content{
    display: flex;
    align-items: center;
    gap: 10px;
}

.customer-profile-card-header-left-content .item-count{
    border-radius: 14px;
    border: 1px solid rgba(0, 0, 0, 0.00);
    background: #EBF3FA;width: 23.719px;
    height: 20px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0A58A5;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 14.286px; /* 119.047% */
}  

.customer-profile-cards span, .value-prop-map-cards span{
    font-size: 12px;
    font-weight: 400;
}

@media (max-width: 1200px){
    .vp-canvas-row {
        flex-direction: column;
    }

    .vp-row{
        flex-direction: column;
    }

    .vp-row .vp-category{
        width: 100%;
    }

    .summary-sub-sections{
        flex-direction: column;
    }

    .summary-sub-item{
        width: 100%;
    }

    .customer-profile-cards,
    .value-prop-map-cards{
        flex-direction: column;
    }

    .customer-profile-card,
    .value-prop-map-card{
        width: 100%;
    }

    .segment-dropdown-button{
        width: 100%;
    }

    .segment-dropdown-menu{
        width: 100%;
    }

    .value-prop-filters-actions{
        flex-direction: column;
    }

    .segment-edit-form-row{
        flex-direction: column;
    }

    .segment-edit-form-row .segment-edit-form-group{
        width: 100%;
    }

    .segment-edit-modal-content{
        max-width: 90%;
    }
}

/* ========== Inline Color Picker (Modal) ========== */

.vp-color-picker-inline {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.vp-color-option-inline {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.15s ease, border-color 0.15s ease;
}

.vp-color-option-inline:hover {
    transform: scale(1.15);
}

.vp-color-option-inline.selected {
    border-color: #0A58A5;
    box-shadow: 0 0 0 2px rgba(10, 88, 165, 0.25);
}

.vp-color-swatch {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: block;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.vp-color-swatch-none {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #FFF;
    border: 2px solid #DFE5EC;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
}

/* Export PDF Dropdown */
.export-pdf-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    background: #FFF;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 100;
    min-width: 200px;
    padding: 4px;
}

.export-pdf-dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    background: none;
    cursor: pointer;
    font-size: 14px;
    color: #223245;
    border-radius: 6px;
    transition: background 0.15s;
}

.export-pdf-dropdown-item:hover {
    background: #F0F1F4;
}

.export-pdf-dropdown-item svg {
    color: #6E7F93;
    flex-shrink: 0;
}

/* ===== Slide 3 — Two columns layout ===== */
.pres-two-cols {
    display: flex;
    gap: 16px;
    margin-top: 16px;
}

.pres-col-block {
    flex: 1;
    border-radius: 15px;
    background: #F6F7F8;
    padding: 18px;
}

.pres-col-block h3 {
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
    margin-bottom: 14px;
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.pres-col-block ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pres-col-block li {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-left: 18px;
    position: relative;
}

.pres-col-block li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.pres-col-block li.bullet-jobs::before { background: #445972; }
.pres-col-block li.bullet-pains::before { background: #DC2626; }
.pres-col-block li.bullet-gains::before { background: #059669; }
.pres-col-block li.bullet-products::before { background: #D4841F; }
.pres-col-block li.bullet-relievers::before { background: #0A58A5; }
.pres-col-block li.bullet-creators::before { background: #059669; }

.pres-col-block li strong {
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px;
}

.pres-col-block li span {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
}

/* ===== Slide 4 — View blocks ===== */
.pres-view-blocks {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 16px;
}

.pres-view-block {
    border-radius: 14px;
    background: #F6F7F8;
    padding: 20px;
}

.pres-view-block h3 {
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22.5px;
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 6px;
}

.pres-view-features {
    list-style: none;
    padding: 0;
    margin: 8px 0 0 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pres-view-features li {
    color: #445972;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    padding-left: 16px;
    position: relative;
}

.pres-view-features li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #0A58A5;
    font-size: 11px;
    font-weight: 700;
}

.pres-view-block p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
    margin-top: 0;
}

/* ===== Slide 5 — Numbered steps ===== */
.pres-steps {
    margin-top: 16px;
    padding: 16px 20px;
    border-radius: 14px;
    background: #F6F7F8;
}

.pres-steps h3 {
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 19.5px;
    margin-bottom: 10px;
}

.pres-steps ol {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    counter-reset: step-counter;
}

.pres-steps li {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #445972;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 19.5px;
    counter-increment: step-counter;
}

.pres-steps li::before {
    content: counter(step-counter);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    color: #FFF;
    font-size: 11px;
    font-weight: 700;
}

@media (max-width: 768px) {
    .pres-two-cols {
        flex-direction: column;
    }
}
/* ===== Elevator Pitch Banner ===== */
.elevator-pitch-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    background: linear-gradient(135deg, #0A58A5 0%, #1a6bbf 100%);
    border-radius: 12px;
    padding: 16px 20px;
    margin-bottom: 20px;
}

.elevator-pitch-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    background: rgba(255,255,255,0.15);
    border-radius: 8px;
    padding: 8px 10px;
    min-width: 48px;
}

.elevator-pitch-label span {
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.elevator-pitch-text {
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.5;
    margin: 0;
    font-style: italic;
}
/* ===== Bannière de régénération (étude échouée ou vide) ===== */
.em-regen-banner{
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 16px 30px;
    padding: 16px 20px;
    border-radius: 12px;
    background: #FEF2F2;
    border: 1px solid #FECACA;
}
.em-regen-banner-icon{
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: #FEE2E2;
    color: #DC2626;
    display: flex;
    align-items: center;
    justify-content: center;
}
.em-regen-banner-body{
    flex: 1;
}
.em-regen-banner-body h3{
    margin: 0 0 4px 0;
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
    color: #991B1B;
}
.em-regen-banner-body p{
    margin: 0;
    font-family: "Open Sans";
    font-size: 13px;
    color: #7F1D1D;
    line-height: 18px;
}
.em-regen-banner-btn{
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: none;
    border-radius: 10px;
    background: #DC2626;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease;
}
.em-regen-banner-btn:hover{
    background: #B91C1C;
}
.em-regen-banner-btn:disabled{
    opacity: 0.7;
    cursor: wait;
}
/* Variante quota épuisé — orange/ambre (côté serveur, pas une erreur utilisateur) */
.em-regen-banner--quota{
    background: #FFFBEB;
    border-color: #FDE68A;
}
.em-regen-banner--quota .em-regen-banner-icon{
    background: #FEF3C7;
    color: #D97706;
}
.em-regen-banner--quota .em-regen-banner-body h3{
    color: #92400E;
}
.em-regen-banner--quota .em-regen-banner-body p{
    color: #78350F;
}
.em-regen-spinner{
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: #FFF;
    border-radius: 50%;
    animation: em-regen-spin 0.8s linear infinite;
}
@keyframes em-regen-spin{
    to{ transform: rotate(360deg); }
}

/* ===== Carte de génération (avant génération) ===== */
.etude-marche-generate-card{
    padding: 20px;
}
.etude-marche-ai-card-content{
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.etude-marche-ai-card-content .sommaire{
    border-radius: 20px;
    background: #F6F7F8;
    padding: 25px;
}
.sommaire h2{
    color: var(--Color1, #223245);
    font-size: 20px;
    font-weight: 700;
    line-height: 20px;
}
.sommaire p{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-top: 7px;
}
.sommaire ol{
    margin-left: 1rem;
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.sommaire ol li{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}
.sommaire ol li span{
    color: var(--Color1, #223245);
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
}
.etude-marche-ai-card-content button{
    margin: 0 auto;
}

/* ===== Styles partagés : Header, Mode Toggle, Export ===== */

.etude-index-page-header-left{
    display: flex;
    align-items: center;
    gap: 10px;
}

.etude-index-page-header-left img{
    width: 40px;
    height: 40px;
}

.etude-title h1{
    color: var(--Color1, #223245);
    font-size: 18px !important;
    font-style: normal;
    font-weight: 700;
    line-height: 18px;
}

.projects-index-page-header-right{
    display: flex;
    align-items: center;
    gap: 20px;
}

/* ===== Mode Toggle ===== */

.mode-toggle-group{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    width: 240px;
    height: 40px;
    display: flex;
    align-items: center;
    padding: 5px;
}

.mode-toggle-group button{
    width: 50%;
    border: none;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    color: var(--Color2, #6E7F93);
    padding: 0 10px;
}

.mode-toggle-group button span{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}

.header-mode-button.active, .header-mode-button.active span{
    border-radius: 5px;
    background: #0A58A5;
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}

/* ===== Download Button ===== */

.download-button{
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    height: 40px;
    padding: 0 20px;
    color: var(--Color-2, #0A58A5);
    background: #fff;
    cursor: pointer;
}

.download-button span{
    color: var(--Color-2, #0A58A5);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}

/* ===== Export Dropdown ===== */

.export-dropdown{
    position: relative;
}

.export-dropdown-chevron{
    margin-left: -4px;
    transition: transform 0.2s ease;
}

.export-dropdown.open .export-dropdown-chevron{
    transform: rotate(180deg);
}

.export-dropdown-menu{
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 200px;
    background: #fff;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    z-index: 100;
    overflow: hidden;
}

.export-dropdown.open .export-dropdown-menu{
    display: block;
}

.export-dropdown-item{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    color: #344054;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s ease;
}

.export-dropdown-item:hover{
    background: #F5F8FA;
    color: var(--Color-2, #0A58A5);
}

.export-dropdown-item i{
    width: 16px;
    text-align: center;
    font-size: 15px;
}

.export-dropdown-item .fa-file-pdf{
    color: #E53E3E;
}

.export-dropdown-item .fa-file-word{
    color: #2B6CB0;
}

/* ===== Layout (sidebar + content) ===== */

.etude-marche-layout{
    display: flex;
    gap: 20px;
    justify-content: center;
}

.etude-marche-sidebar{
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: calc(100vh - 80px);
    width: 300px;
    border-right: 1px solid #DFE5EC;
}

.etude-marche-content{
    width: calc(100% - 320px);
    height: calc(100vh - 80px) !important;
    overflow: scroll;
    padding: 20px;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding-left: 0;
}

.etude-marche-page .page-header-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* ===== Sections Nav (sidebar interne) ===== */

.etude-sections-nav{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.etude-sections-nav a{
    display: flex;
    align-items: center;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 12px;
    color: #6A7282;
    gap: 12px;
}

.etude-sections-nav a img{
    width: 16px;
    height: 16px;
}

.etude-sections-nav a span{
    color: #6A7282;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
}

.section-nav-item.active{
    border-radius: 10px;
    border: 1px solid var(--Color-2, #0A58A5);
    background: rgba(10, 88, 165, 0.06);
    color: #0A58A5;
}

.section-nav-item.active span{
    color: #0A58A5;
}

/* ===== Sections (contenu principal) ===== */

.etude-section{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
}

/* ── Mode Edit: content takes all remaining space ── */
.module-page[data-etude-marche-mode-value="edit"] .etude-marche-layout{
    display: flex;
}

.module-page[data-etude-marche-mode-value="edit"] .etude-marche-content{
    flex: 1;
    width: 0;
    min-width: 0;
}

.module-page[data-etude-marche-mode-value="edit"] .bp-page.etude-section{
    margin: 0;
    width: 100%;
    height: fit-content;
    box-shadow: none;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #DFE5EC;
}

.module-page[data-etude-marche-mode-value="edit"] .bp-page.etude-section .bp-scroll{
    min-height: auto;
    padding: 28px 32px;
}

/* ── Card edit buttons (same as BP) ── */
.tamsamsom-card,
.module-page .resume-cards .card {
    position: relative;
}
.module-page .bp-card-actions {
    position: absolute;
    top: 4px;
    right: 4px;
}
.module-page .bp-row-actions {
    display: flex;
    gap: 4px;
    justify-content: center;
}
.module-page .bp-row-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    color: #6E7F93;
    transition: color 0.15s, background-color 0.15s;
}
.module-page .bp-row-btn:hover {
    background-color: #F3F4F6;
}
.module-page .bp-row-edit:hover {
    color: #0A58A5;
}
.module-page .bp-inline-edit {
    width: 100%;
    border: none;
    padding: 2px 0;
    margin: 0;
    background: transparent;
    outline: none;
    font-size: inherit;
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    line-height: inherit;
    color: inherit;
}
.module-page .bp-row-delete:hover {
    color: #E74C3C;
}

/* ── Chart edit tables ── */
.chart-edit-table table {
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    overflow: hidden;
}
.chart-edit-table th,
.chart-edit-table td {
    border-bottom: 1px solid #F3F4F6;
}
.chart-edit-table tr:last-child td {
    border-bottom: none;
}
.bp-add-row-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 6px 12px;
    font-size: 12px;
    font-family: 'Open Sans';
    font-weight: 600;
    color: #0A58A5;
    background: none;
    border: 1px dashed #B5C1D0;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.15s;
}
.bp-add-row-btn:hover {
    background-color: #F0F5FA;
}

/* ── Mode Preview: A4-like centered, read-only ── */
.module-page[data-etude-marche-mode-value="preview"] .editable-text{
    cursor: default;
}

.module-page[data-etude-marche-mode-value="preview"] .edit-mode-only,
.module-page[data-etude-marche-mode-value="preview"] .bp-card-actions,
.module-page[data-etude-marche-mode-value="preview"] .bp-swot-actions,
.module-page[data-etude-marche-mode-value="preview"] .bp-add-row-btn,
.module-page[data-etude-marche-mode-value="preview"] .chart-edit-table {
    display: none !important;
}

/* SWOT item layout for edit actions */
.swot-item {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    position: relative;
}
.bp-swot-actions {
    position: absolute;
    right: 0;
    top: 0;
}
.acteur-item {
    position: relative;
}
.acteur-item > .bp-card-actions {
    top: auto;
    bottom: 4px;
    right: 4px;
    opacity: 0;
    transition: opacity 0.15s;
}
.acteur-item:hover > .bp-card-actions {
    opacity: 1;
}

/* ── Acteur Modal ── */
.etude-modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.etude-modal-content {
    background: #fff;
    border-radius: 12px;
    width: 100%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1);
}
.etude-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #DFE5EC;
    background: linear-gradient(180deg, #E6ECF5 0%, #FFF 100%);
    border-radius: 12px 12px 0 0;
}
.etude-modal-header h3 {
    font-size: 16px; font-weight: 700; color: #223245; margin: 0;
}
.etude-modal-close {
    background: none; border: none; cursor: pointer; color: #6E7F93; padding: 4px;
}
.etude-modal-body {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.etude-modal-body label {
    font-size: 12px; font-weight: 600; color: #6A7282; margin-bottom: 2px;
    display: flex; align-items: center; gap: 6px;
}
.tag-hint {
    font-size: 10px; font-weight: 500; padding: 1px 6px; border-radius: 4px;
}
.tag-hint.positive {
    background: #D1FAE5; color: #065F46;
}
.tag-hint.negative {
    background: #FEE2E2; color: #991B1B;
}
.etude-modal-body input,
.etude-modal-body select,
.etude-modal-body textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #DFE5EC;
    border-radius: 6px;
    font-size: 13px;
    font-family: 'Open Sans', sans-serif;
    outline: none;
    transition: border-color 0.15s;
}
.etude-modal-body input:focus,
.etude-modal-body textarea:focus {
    border-color: #0A58A5;
}
.etude-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 20px;
    border-top: 1px solid #DFE5EC;
}
.etude-modal-footer button {
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: none;
}
.etude-modal-cancel {
    background: #F3F4F6;
    color: #6E7F93;
}
.etude-modal-save {
    background: #0A58A5;
    color: #fff;
}

.etude-section-title{
    border-radius: 15px 15px 0 0;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: var(--kkkk, linear-gradient(178deg, #DFE5EC -8.86%, #FFF 49.74%));
    height: 48px;
    padding: 13px 21px;
    display: flex;
    align-items: center;
}

.etude-section-title h2{
    display: flex;
    align-items: center;
    gap: 15px;
    color: #223245;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px;
}

.section-content{
    padding: 20px;
}

.text-block{
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 20px;
}

.text-block h3{
    color: #99A1AF;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 0.35px;
    text-transform: uppercase;
}

/* ===== Editable Text (inline editing) ===== */

.editable-text{
    color: var(--Color1, #223245);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
}

.editable-text {
    border-radius: 4px;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    position: relative;
    border: 1px solid transparent;
}

.editable-text.editing {
    cursor: default;
    padding: 0;
}

.editable-text.editing:hover {
    background-color: transparent;
    box-shadow: none;
}

.editable-textarea {
    width: 100%;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    font-size: inherit;
    font-family: inherit;
    line-height: inherit;
    color: inherit;
    resize: none;
    outline: none;
    background: transparent;
    overflow: hidden;
    field-sizing: content;
}

.editable-textarea:focus {
    border: none;
    box-shadow: none;
}

/* ===== Sizing Form + Modal ===== */

.sizing-form-group {
    margin-bottom: 20px;
}

.sizing-form-group label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #223245;
    margin-bottom: 8px;
    font-family: "Open Sans", sans-serif;
}

.sizing-form-input,
.sizing-form-textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #DFE5EC;
    border-radius: 6px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    color: #223245;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
}

.sizing-form-input:focus,
.sizing-form-textarea:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.sizing-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.sizing-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

.sizing-modal-content {
    position: relative;
    background-color: #FFFFFF;
    border-radius: 12px;
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    z-index: 1001;
}

.sizing-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
}

.sizing-modal-title {
    font-size: 20px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.sizing-modal-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
    transition: all 0.2s ease;
}

.sizing-modal-close:hover {
    background-color: #F8F9FA;
    color: #223245;
}

.sizing-modal-close svg {
    width: 20px;
    height: 20px;
}

.sizing-modal-form {
    padding: 24px;
}

.sizing-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #DFE5EC;
}

.sizing-modal-cancel,
.sizing-modal-save {
    padding: 10px 20px;
    border: none;
    border-radius: 15px;
    font-size: 14px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.sizing-modal-cancel {
    background-color: #F8F9FA;
    color: #6E7F93;
}

.sizing-modal-cancel:hover {
    background-color: #DFE5EC;
}

.sizing-modal-save {
    background-color: #0A58A5;
    color: white;
}

.sizing-modal-save:hover:not(:disabled) {
    background-color: #084A8A;
}

.sizing-modal-save:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ===== Source Items ===== */

.source-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: #FAFBFC;
    border: 1px solid #EEF1F5;
    border-radius: 8px;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.source-item:hover {
    border-color: #0A58A5;
    background: #F6F9FD;
}

/* ===== SWOT Matrix ===== */

.swot-matrix{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    margin-top: 21px;
}

.swot-column{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 20px;
    max-height: 350px;
    overflow: scroll;
}

.swot-column-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.swot-title-wrapper{
    display: flex;
    align-items: center;
    gap: 10px;
}

.swot-matrix{
    margin-bottom: 20px;
}

.swot-column.strengths-column{ background: rgba(89, 178, 36, 0.08); }
.swot-column.weaknesses-column{ background: rgba(245, 73, 0, 0.08); }
.swot-column.opportunities-column{ background: rgba(10, 88, 165, 0.08); }
.swot-column.threats-column{ background: rgba(255, 153, 0, 0.08); }

.swot-list{
    list-style: none;
    padding: 0;
    margin: 10px 0 0;
}

.swot-item{
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 6px;
}

.swot-dot{
    font-size: 18px;
    line-height: 1;
    flex-shrink: 0;
}

.swot-empty .swot-item-text{
    color: #6E7F93;
    font-style: italic;
}

.swot-title.strengths{
    color: #59B224;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px;
}

.swot-title.opportunities{
    color: #0A58A5;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px;
}

.swot-title.weaknesses{
    color: #F54900;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px;
}

.swot-title.threats{
    color: #FF9900;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px;
}

/* ===== Loader de génération (style Business Plan) ===== */

.etude-generation-loader {
    border-radius: 16px;
    border: 1px solid #E6EAF0;
    background: #FFF;
    padding: 98px 20%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    text-align: center;
    margin: 30px;
}

.etude-generation-loader .simple-loader-title {
    color: #223245;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.etude-generation-loader .simple-loader-text {
    color: #6E7F93;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin: 0;
}

.etude-loader-progress {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    max-width: 360px;
}

.etude-loader-progress-bar {
    flex: 1;
    height: 11px;
    background: #F6F7F8;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    overflow: hidden;
}

.etude-loader-progress-fill {
    height: 100%;
    background: #0A58A5;
    border-radius: 20px;
    transition: width 0.4s ease;
}

.etude-loader-percentage {
    font-size: 14px;
    font-weight: 600;
    color: #0A58A5;
    min-width: 40px;
    font-family: "Open Sans", sans-serif;
}

.simple-loader-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #E6EAF0;
    border-top: 4px solid #0A58A5;
    border-radius: 50%;
    animation: etude-spin 1s linear infinite;
}

@keyframes etude-spin {
    to { transform: rotate(360deg); }
}

/* ===== Export PDF Modal ===== */

.bp-export-modal-overlay{
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.5);
    backdrop-filter: blur(4px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.bp-export-modal-overlay.visible{
    opacity: 1;
    pointer-events: auto;
}

.bp-export-modal{
    background: #fff;
    border-radius: 20px;
    padding: 48px 40px 40px;
    width: 400px;
    max-width: 90vw;
    text-align: center;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.15);
    transform: scale(0.9) translateY(20px);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.bp-export-modal-overlay.visible .bp-export-modal{
    transform: scale(1) translateY(0);
}

.bp-export-modal-icon{
    position: relative;
    width: 72px;
    height: 72px;
    margin: 0 auto 24px;
}

.bp-export-modal-spinner{
    position: absolute;
    inset: 0;
    width: 72px;
    height: 72px;
    animation: bp-modal-spin 1.2s linear infinite;
}

.bp-export-modal-spinner circle{
    stroke: #0A58A5;
    stroke-dasharray: 90 150;
    stroke-dashoffset: 0;
}

.bp-export-modal-overlay.success .bp-export-modal-spinner circle{
    stroke: #10B981;
}

.bp-export-modal-overlay.error .bp-export-modal-spinner circle{
    stroke: #EF4444;
}

.bp-export-modal-overlay.success .bp-export-modal-spinner,
.bp-export-modal-overlay.error .bp-export-modal-spinner{
    animation: none;
}

.bp-export-modal-overlay.success .bp-export-modal-spinner circle,
.bp-export-modal-overlay.error .bp-export-modal-spinner circle{
    stroke-dasharray: 126 126;
    stroke-dashoffset: 0;
    transition: stroke-dasharray 0.4s ease, stroke 0.3s ease;
}

.bp-export-modal-icon i{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 24px;
    color: #0A58A5;
    transition: color 0.3s ease;
}

@keyframes bp-modal-spin{
    to{ transform: rotate(360deg); }
}

.bp-export-modal h2{
    font-size: 20px;
    font-weight: 700;
    color: #1F2937;
    margin: 0 0 6px;
    transition: color 0.3s ease;
}

.bp-export-modal p{
    font-size: 14px;
    color: #6B7280;
    margin: 0 0 32px;
}

.bp-export-modal-steps{
    display: flex;
    flex-direction: column;
    gap: 14px;
    text-align: left;
}

.bp-export-step{
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: #9CA3AF;
    transition: color 0.3s ease;
}

.bp-export-step.active{
    color: #0A58A5;
    font-weight: 600;
}

.bp-export-step.done{
    color: #10B981;
}

.bp-export-step-dot{
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px solid #E5E7EB;
    position: relative;
    flex-shrink: 0;
    transition: border-color 0.3s ease, background 0.3s ease;
}

.bp-export-step.active .bp-export-step-dot{
    border-color: #0A58A5;
    background: #EFF6FF;
}

.bp-export-step.active .bp-export-step-dot::after{
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    background: #0A58A5;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: bp-step-pulse 1.2s ease-in-out infinite;
}

@keyframes bp-step-pulse{
    0%, 100%{ opacity: 1; transform: translate(-50%, -50%) scale(1); }
    50%{ opacity: 0.5; transform: translate(-50%, -50%) scale(0.7); }
}

.bp-export-step.done .bp-export-step-dot{
    border-color: #10B981;
    background: #10B981;
}

.bp-export-step.done .bp-export-step-dot::after{
    content: '\f00c';
    font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 10px;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: none;
}

/* ===== Sources Section ===== */

.sources-section-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
}

.sources-description {
    font-size: 14px;
    color: #6E7F93;
    line-height: 1.6;
    margin: 0;
}

.sources-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.source-index {
    width: 26px;
    height: 26px;
    min-width: 26px;
    border-radius: 50%;
    background: #EEF1F5;
    color: #6E7F93;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.source-link {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #0A58A5;
    text-decoration: none;
    font-size: 13px;
    min-width: 0;
    flex: 1;
}

.source-link:hover {
    text-decoration: underline;
}

.source-link svg {
    flex-shrink: 0;
    color: #9FAAB7;
}

.source-url {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sources-empty {
    padding: 24px;
    background: #FAFBFC;
    border: 1px dashed #DFE5EC;
    border-radius: 8px;
    text-align: center;
}

.sources-empty p {
    margin: 0;
    font-size: 14px;
    color: #9FAAB7;
}

.etude-intro{
    color: #364153;
font-family: "Open Sans";
font-size: 14px;
font-style: italic;
font-weight: 400;
line-height: 22.75px; /* 162.5% */
margin-top: 10px;
}

.tamsamsom-card{
    border-radius: 15px;
    border: 1px solid #DFE5EC;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.tamsamsom-card h3{
    color: #99A1AF;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
letter-spacing: 0.35px;
text-transform: uppercase;
}

.tamsamsom-card h5{
    font-family: "Open Sans";
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 36px; /* 150% */
letter-spacing: -0.75px;
color: #F90;
}

.tamsamsom-card span{
    color: #6A7282;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 133.333% */

}

.etudefin{
    margin-top: 10px;
}

.etude-methode{
    border-radius: 10px;
background: #F9FAFB;
padding: 12px;
display: flex;
flex-direction: column;
gap: 9px;
margin-top: 10px;
}

.etude-methode h3{
    color: #4A5565;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
}

.etude-methode p{
    color: #4A5565;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 133.333% */
}

.etude-acteurs{
    border-radius: 10px;
border: 1px solid #DFE5EC;
}

.acteurs-title{
    border-bottom: 1px solid #E5E7EB;
    background: #F9FAFB;
    padding: 12Px;
    color: #6A7282;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
text-transform: uppercase;
}

.acteurs-list{
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.acteur-item{
    border-bottom: 1px solid #F3F4F6;
    padding: 12Px;
    display: flex;
    align-items: start;
    justify-content: space-between;
}

.acteur-item h3{
    color: #1E2939;
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 142.857% */
}

.acteur-item span{
    margin: 5px 0;
    color: #6A7282;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 133.333% */
}

.acteurs-tags{
    display: flex;
    align-items: center;
    gap: 10px;
}

.acteurs-tags span{
    border-radius: 14px;
border: 1px solid #B9F8CF;
padding: 3px 10px;
color: #008236;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 400;
line-height: 15px; /* 150% */
display: flex;
align-items: center;
justify-content: center;
background: #F0FDF4;

}

.acteurs-tags span.negative{
    color: #C10007;
font-family: "Open Sans";
background: #FEF2F2;
font-size: 10px;
font-style: normal;
font-weight: 400;
line-height: 15px; /* 150% */
border-radius: 14px;
border: 1px solid #FFC9C9;
padding: 3px 10px;
}

.etude-pie-row{
    margin-top: 10px;
}

.acteur-status{
    color: #6A7282;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 133.333% */
}

/* ===== Matrice comparative ===== */
.etude-comparaison {
    margin-top: 20px;
}

.comparaison-table td:first-child,
.comparaison-table th:first-child {
    text-align: left;
}

.comparaison-table tbody td:first-child {
    color: #223245 !important;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600 !important;
    line-height: 16px;
}

.comparaison-table thead th {
    background: #F9FAFB;
    color: #6A7282;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px;
    text-transform: uppercase;
}

.comparaison-table tbody td {
    color: #6A7282 !important;
    font-family: "Open Sans";
    font-size: 12px !important;
    font-style: normal;
    font-weight: 400 !important;
    line-height: 16px;
}

.comparaison-table .nous-col {
    background: rgba(10, 88, 165, 0.06);
    color: #0A58A5 !important;
    font-weight: 700;
}

.comparaison-table thead .nous-col {
    background: rgba(10, 88, 165, 0.10);
    color: #0A58A5;
}

/* ===== Diagrammes camembert ===== */
.etude-pie-row {
    display: flex;
    gap: 16px;
}

.etude-pie-card {
    flex: 1 1 0;
    min-width: 0;
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    padding: 17px;
}

.etude-pie-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.etude-pie-svg {
    width: 120px;
    height: 120px;
    flex-shrink: 0;
}

.etude-pie-legend {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.etude-pie-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

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

.etude-pie-label {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 400;
    line-height: 15px;
}

.etude-pie-value {
    color: #445972;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    margin-left: auto;
}

.seg-pri{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.pri-list{
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 12Px;
    margin-bottom: 10px;
}

.pri-pro{
    color: #0A58A5;
font-family: "Open Sans";
font-size: 11px;
font-style: italic;
font-weight: 400;
line-height: 16px; /* 145.455% */
}

.pri-item{
    border-radius: 10px;
border: 1px solid #DFE5EC;
padding: 15px;
display: flex;
flex-direction: column;
}

.pri-item h3{
    color: #1E2939;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.pri-item span{
    color: #6A7282;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 133.333% */
margin: 5px 0;
}

.pri-item quote{
    color: #0A58A5;
font-family: "Open Sans";
font-size: 12px;
font-style: italic;
font-weight: 400;
line-height: 18px; /* 150% */
}

.pri-details{
    margin-top: 5px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.pri-details h5{
    color: #99A1AF;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 600;
line-height: 15px; /* 150% */
text-transform: uppercase;
}

.pri-details h6{
    margin-top: 2px;
    color: #223245;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
}

.etude-phases {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 10px;
    padding-left: 0;
}

.etude-phase {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    position: relative;
}

.phase-point {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 24px;
    min-width: 24px;
    position: relative;
}

.phase-point::before {
    content: '';
    width: 10px;
    height: 10px;
    min-width: 10px;
    min-height: 10px;
    border-radius: 50%;
    background: #0A58A5;
    flex-shrink: 0;
    margin-top: 3px;
    z-index: 1;
}

.phase-point::after {
    content: '';
    width: 2px;
    flex: 1;
    background: #DFE5EC;
}

.etude-phase:last-child .phase-point::after {
    display: none;
}

.etude-phase > div:last-child {
    flex: 1;
    padding-left: 12px;
    padding-bottom: 20px;
}

.etude-phase:last-child > div:last-child {
    padding-bottom: 0;
}

.etude-phase span {
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.etude-phase h3 {
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}

.etude-phase p {
    color: #6A7282 !important;
    font-family: "Open Sans";
    font-size: 12px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}


/* ===== Insight Results (Résultats clés) ===== */

.insight-results-list{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.insight-result-item{
    display: flex;
    align-items: center;
    gap: 16px;
    border-radius: 8px;
    background: #F6F7F8;
    padding: 12px;
}

.insight-result-pct{
    font-family: "Open Sans";
    font-size: 22px;
    font-style: normal;
    font-weight: 800;
    line-height: 28px;
    background: linear-gradient(170deg, #F90 64.02%, rgba(167, 156, 216, 0.50) 121%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    flex-shrink: 0;
}

.insight-result-body{
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.insight-result-text{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    margin: 0;
}

.insight-result-source{
    color: #99A1AF;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: italic;
    font-weight: 400;
    line-height: 15px;
}

/* ===== Verbatims terrain ===== */

.verbatim-list{
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 12px;
}

.verbatim-item{
    border-radius: 12px;
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: relative;
    border-radius: 10px;
border: 1px solid #DFE5EC;
background: rgba(10, 88, 165, 0.02);
}

.verbatim-item::before{
    content: "\201C";
    position: absolute;
    top: 8px;
    left: 12px;
    font-size: 32px;
    color: rgba(10, 88, 165, 0.15);
    font-family: Georgia, serif;
    line-height: 1;
}

.verbatim-quote{
    color: #223245 !important;
    font-family: "Open Sans" !important;
    font-size: 13.5px !important;
    font-style: italic !important;
    font-weight: 400 !important;
    line-height: 22px !important;
    margin: 0 !important;
    padding-left: 8px;
}

.verbatim-author{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px;
    padding-left: 8px;
}

/* ===== Hypothèses & Tests ===== */

.hyp-intro{
    margin-top: 10px;
}

.hyp-intro p{
    color: #6E7F93;
    font-size: 13px;
    line-height: 20px;
}

.hyp-list{
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
}

.hyp-item{
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.hyp-item__row{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.hyp-item__label{
    color: #223245;
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    flex: 1;
}

.hyp-item__label strong{
    color: #0A58A5;
    font-weight: 700;
}

.hyp-item__status{
    font-size: 11px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
}

.hyp-item__status--a-tester,
.hyp-item__status--à-tester{
    background: #FFF3E0;
    color: #E65100;
}

.hyp-item__status--en-cours{
    background: #E3F2FD;
    color: #0A58A5;
}

.hyp-item__status--a-mesurer,
.hyp-item__status--à-mesurer{
    background: #F3E5F5;
    color: #6A1B9A;
}

.hyp-item__status--validée,
.hyp-item__status--validee{
    background: #E8F5E9;
    color: #2E7D32;
}

.hyp-item__row--secondary{
    border-top: 1px solid #F0F2F5;
    padding-top: 8px;
}

.hyp-item__test{
    color: #6E7F93;
    font-size: 12px;
    line-height: 18px;
    flex: 1;
}

.hyp-item__test strong{
    color: #223245;
    font-weight: 600;
}

.hyp-item__kpi{
    color: #6E7F93;
    font-size: 12px;
    line-height: 18px;
    white-space: nowrap;
    flex-shrink: 0;
}

.hyp-item__kpi strong{
    color: #223245;
    font-weight: 600;
}

/* Conseil méthodologique */
/* Arbre de décision */
.arbre-decision-list{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;
}

.arbre-decision-item{
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    padding: 14px;
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}

.arbre-decision-condition{
    color: #223245;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px;
}

.arbre-decision-arrow{
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
}

.arbre-decision-resultat{
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

.arbre-decision-resultat--go{
    color: #59B224;
}

.arbre-decision-resultat--pivot{
    color: #FF9900;
}

.arbre-decision-resultat--nogo{
    color: #F54900;
}

.arbre-decision-separator{
    color: #6E7F93;
    font-size: 12px;
}

.arbre-decision-action{
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}

.arbre-decision-action--go{
    color: #59B224;
}

.arbre-decision-action--pivot{
    color: #FF9900;
}

.arbre-decision-action--nogo{
    color: #F54900;
}

/* Plan de validation — Budget total */
.hyp-budget{
    display: flex;
    gap: 14px;
    border-radius: 10px;
    background: rgba(10, 88, 165, 0.04);
    border: 1px solid rgba(10, 88, 165, 0.12);
    padding: 16px;
}

.hyp-budget__icon{
    font-size: 20px;
    color: #0A58A5;
    flex-shrink: 0;
    margin-top: 2px;
}

.hyp-budget__content h5{
    color: #0A58A5;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 6px;
}

.hyp-budget__content p{
    color: #6E7F93;
    font-size: 13px;
    line-height: 20px;
    margin: 0;
}

/* ===== Sources & Références ===== */

.sources-metrics{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-top: 12px;
}

.sources-metric-card{
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.sources-metric-value{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 24px;
    font-weight: 700;
    line-height: 30px;
}

.sources-metric-label{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    text-align: center;
}

.sources-list{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}

.source-item{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid #DFE5EC;
}

.source-num{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    flex-shrink: 0;
}

.source-content{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.source-title{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
}

.source-org{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
}

.source-type{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    font-style: italic;
}

.source-year{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
}

.source-url{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    text-decoration: none;
    word-break: break-all;
}

.source-url:hover{
    text-decoration: underline;
}

.source-tags{
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.source-tag{
    background: rgba(10, 88, 165, 0.08);
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 12px;
    line-height: 16px;
}

/* ===== Sources section blocks spacing ===== */
.sources-section-block{
    margin-top: 28px;
}

/* ===== Fiabilité badges ===== */
.fiabilite-badge{
    display: inline-block;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 12px;
    line-height: 18px;
}
.fiabilite-haute{
    background: rgba(46, 125, 50, 0.1);
    color: #2E7D32;
}
.fiabilite-moyenne{
    background: rgba(255, 153, 0, 0.1);
    color: #E68A00;
}
.fiabilite-moderee{
    background: rgba(10, 88, 165, 0.1);
    color: #0A58A5;
}

/* ===== Engagement de transparence ===== */
.sources-engagement-content{
    background: #F8FAFC;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    padding: 16px 20px;
}
.sources-engagement-content p{
    font-family: "Open Sans";
    font-size: 12px;
    color: #3F4E5E;
    line-height: 20px;
    margin: 0 0 8px 0;
}
.sources-engagement-content p:last-child{
    margin-bottom: 0;
}
.sources-engagement-date{
    font-weight: 600;
    color: #0A58A5 !important;
    font-style: italic;
}

/* ===== Responsive ===== */
@media (max-width: 768px) {

    /* Layout: passe en colonne */
    .etude-marche-layout {
        flex-direction: column;
        gap: 0;
        height: calc(100vh - 77.5px - 64px - 56px);
        overflow: scroll;
    }

    /* Sidebar → barre horizontale scrollable */
    .etude-marche-sidebar {
        width: 100%;
        height: auto;
        border-right: none;
        border-bottom: 1px solid #DFE5EC;
        padding: 12px 0;
        flex-direction: row;
        position: sticky;
        top: 0;
        z-index: 10;
        background: #fff;
    }

    .etude-marche-sidebar nav{
        padding: 0 15px;
    }

    /* Nav: horizontal scroll */
    .etude-sections-nav {
        flex-direction: row;
        gap: 8px;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 2px;
    }

    .etude-sections-nav::-webkit-scrollbar {
        display: none;
    }

    .etude-sections-nav a {
        white-space: nowrap;
        padding: 8px 12px;
        gap: 8px;
        flex-shrink: 0;
        border-radius: 8px;
    }

    .etude-sections-nav a img {
        width: 14px;
        height: 14px;
    }

    .etude-sections-nav a span {
        font-size: 12px;
        line-height: 16px;
    }

    /* Contenu: pleine largeur */
    .etude-marche-content {
        width: 100%;
        height: auto !important;
        overflow: visible;
        padding: 16px;
        overflow: scroll;
    }

    /* Sections */
    .etude-section-title {
        padding: 10px 14px;
        height: auto;
    }

    .etude-section-title h2 {
        font-size: 16px;
        gap: 10px;
    }

    .section-content {
        padding: 14px;
    }

    /* Header */
    .etude-marche-page .page-header-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 14px 16px;
    }

    .etude-marche-page .etude-index-page-header-left {
        width: 100%;
    }

    .etude-marche-page .etude-title h1 {
        font-size: 15px;
    }

    .etude-marche-page .projects-index-page-header-right {
        width: 100%;
        gap: 8px;
        justify-content: space-between;
    }

    .etude-marche-page .mode-toggle-group {
        width: auto;
        min-width: 0;
        height: 36px;
        flex: 1;
    }

    .etude-marche-page .mode-toggle-group button {
        padding: 4px 10px;
        gap: 5px;
    }

    .etude-marche-page .mode-toggle-group button span {
        display: none;
    }

    .etude-marche-page .mode-toggle-group button i {
        font-size: 14px;
    }

    .etude-marche-page .download-button {
        padding: 8px 10px;
        gap: 0;
    }

    .etude-marche-page .download-button span {
        display: none;
    }

    .etude-marche-page .aide-button {
        padding: 8px 10px;
    }

    .mode-toggle-group button span{
        display: none;
    }

    .mode-toggle-group{
        width: 70px;
    }

    .download-button span{
        display: none;
    }

    .projects-index-page-header-right {
        gap: 15px;
    }

    .download-button{
        padding: 0 10px;
    }

    .swot-matrix{
        display: flex;
        flex-direction: column;
    }
}

/* ===== Slide 3 — Chapter grid 3x3 ===== */
.pres-chapter-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 16px;
}

.pres-chapter-item {
    border-radius: 14px;
    background: #F6F7F8;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pres-chapter-item img {
    width: 24px;
    height: 24px;
}

.pres-chapter-item h4 {
    color: #223245;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    margin: 0;
}

.pres-chapter-item p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
    margin: 0;
}

/* ===== Slide 4 — Tool blocks ===== */
.pres-tool-blocks {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 16px;
}

.pres-tool-block {
    border-radius: 14px;
    background: #F6F7F8;
    padding: 17px;
}

.pres-tool-block h3 {
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22.5px;
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 4px;
}

.pres-tool-block p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 21.125px;
    margin: 0;
}

.pres-tool-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.pres-tool-tags span {
    border-radius: 20px;
    background: #FFF;
    color: #445972;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
    padding: 3px 5px;
}

.pres-disclaimer {
    margin-top: 12px;
}

.pres-disclaimer p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: italic;
    font-weight: 400;
    line-height: 16px;
    margin: 0;
}

@media (max-width: 768px) {
    .pres-chapter-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
.bmc-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: minmax(0, 225px) minmax(0, 225px) auto;
    gap: 10px;
    overflow: hidden;
}

.bmc-section {
    padding: 20px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
}

.bmc-section-header {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bmc-section-header h3 {
    color: var(--Color1, #223245);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 166.667% */
}

.bmc-items {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
    padding-top: 0;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
}

.bmc-item {
    position: relative;
    padding: 12px 16px;
    border: none;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    transition: all 0.2s ease;
    display: flex;
    align-items: start;
    justify-content: space-between;
    margin-bottom: 0;
    cursor: grab;
}

.bmc-item:active {
    cursor: grabbing;
}

.bmc-item-dragging {
    opacity: 0.3;
}

.bmc-item-drag-over {
    border-top: 2px solid #0A58A5;
}

.bmc-items-drag-over {
    background: rgba(10, 88, 165, 0.04);
    border-radius: 8px;
}

.bmc-item:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

.bmc-item:hover .bmc-item-delete {
    opacity: 1;
}

.bmc-item-text {
    flex: 1;
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
    font-weight: 400;
}

.bmc-item-delete {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    margin-left: 8px;
    opacity: 0;
    color: inherit;
}

.bmc-add-item {
    background: none;
    border: none;
    color: #6E7F93;
    font-size: 18px;
    font-weight: 400;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    opacity: 0;
}

.bmc-section:hover .bmc-add-item {
    opacity: 1;
}

.bmc-add-item:hover {
    color: #0A58A5;
}
/* Specific Section Colors and Positioning */
.bmc-partners {
    grid-column: 1;
    grid-row: 1 / 3;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0
}

/* Colors are now applied via inline styles from the item data */

.bmc-activities {
    grid-column: 2;
    grid-row: 1;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0
}

/* Colors are now applied via inline styles from the item data */

.bmc-value-prop {
    grid-column: 3;
    grid-row: 1 / 3;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0
}

/* Colors are now applied via inline styles from the item data */

.bmc-relationships {
    grid-column: 4;
    grid-row: 1;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0
}


/* Colors are now applied via inline styles from the item data */

.bmc-segments {
    grid-column: 5;
    grid-row: 1 / 3;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0
}

/* Colors are now applied via inline styles from the item data */


.bmc-resources {
    grid-column: 2;
    grid-row: 2;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0
}


/* Colors are now applied via inline styles from the item data */

.bmc-channels {
    grid-column: 4;
    grid-row: 2;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0
}

/* Colors are now applied via inline styles from the item data */

.bmc-row-3-container {
    grid-column: 1 / -1;
    grid-row: 3;
    display: flex;
    gap: 10px;
}

.bmc-costs {
    flex: 1;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0;
    height: 225px;
}

/* Colors are now applied via inline styles from the item data */

.bmc-revenue {
    flex: 1;
    background-color: #e6eaf07d;
    border: 1px solid #E6EAF0;
    height: 225px;
}

/* Display items in 2 columns for costs and revenue sections */
.bmc-costs .bmc-items,
.bmc-revenue .bmc-items {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    flex-direction: unset;
}

.bmc-costs .bmc-item,
.bmc-revenue .bmc-item {
    margin-bottom: 0;
}


/* Modal Styles */
.bmc-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.bmc-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

.bmc-modal-content {
    position: relative;
    background-color: #FFFFFF;
    border-radius: 12px;
    width: 100%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    z-index: 1001;
}

.bmc-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
    background: linear-gradient(180deg, #E6ECF5 0%, #FFFFFF 100%);
}

.bmc-modal-header h3 {
    font-size: 20px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.bmc-modal-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
    transition: all 0.2s ease;
}

.bmc-modal-close:hover {
    background-color: #F8F9FA;
    color: #223245;
}

.bmc-modal-close svg {
    width: 20px;
    height: 20px;
}

.bmc-modal-form {
    padding: 24px;
}

.bmc-form-group {
    margin-bottom: 20px;
}

.bmc-form-group label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #223245;
    margin-bottom: 8px;
    font-family: "Open Sans", sans-serif;
}

.bmc-form-textarea {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    transition: border-color 0.2s ease;
    resize: vertical;
    min-height: 100px;
    box-sizing: border-box;
    resize: none;
}

.bmc-form-textarea:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: none;
}

.bmc-color-selector {
    display: flex;
    gap: 12px;
    margin-top: 8px;
}

.bmc-color-option {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
    background: none;
}

.bmc-color-option:hover {
    transform: scale(1.1);
}

.bmc-color-option.active {
    border: 2px solid #22324569;
    transform: scale(1.1);
}

.bmc-modal-actions {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #DFE5EC;
}

.bmc-modal-cancel,
.bmc-modal-save {
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
    border: none;
}

.bmc-modal-cancel {
    background-color: #F8F9FA;
    color: #223245;
}

.bmc-modal-cancel:hover {
    background-color: #E9ECEF;
}

.bmc-modal-save {
    background-color: #0A58A5;
    color: #FFFFFF;
}

.bmc-modal-save:hover {
    background-color: #084a8f;
}

/* ==================== RESPONSIVE MOBILE ==================== */
@media (max-width: 768px){
    .bmc-grid, .bmc-row-3-container, .bmc-costs .bmc-items, .bmc-revenue .bmc-items{
        display: flex;
        flex-direction: column;
    }
}

/* ===== Mini BMC (Slide 2) ===== */
.pres-mini-bmc {
    margin-top: 16px;
}
.pres-mini-bmc-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 8px;
}
.pres-mini-bmc-row--bottom {
    grid-template-columns: 1fr 1fr;
    margin-top: 8px;
}
.pres-mini-bmc-col {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.pres-mini-bmc-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px 6px;
    border-radius: 10px;
    background: #F6F7F8;
    text-align: center;
}
.pres-mini-bmc-block img {
    width: 22px;
    height: 22px;
    opacity: 0.7;
}
.pres-mini-bmc-block span {
    color: #223245;
    font-size: 11px;
    font-weight: 600;
    line-height: 14px;
}
.pres-mini-bmc-block--accent {
    background: rgba(10, 88, 165, 0.08);
}
.pres-mini-bmc-block--accent span {
    color: #0A58A5;
}

/* ===== Slide 3: Two columns ===== */
.pres-col-header {
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    padding: 12px;
    border-radius: 10px;
    margin-bottom: 12px;
}
.pres-col-header h3 {
    color: #fff !important;
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: #fff !important;
}
.pres-col-header p {
    color: rgba(255,255,255,0.8);
    font-size: 12px;
    font-weight: 500;
    margin: 4px 0 0;
}
.pres-col-block ul {
    list-style: disc;
    padding-left: 16px;
    margin: 0;
}
.pres-col-block li {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 400;
    line-height: 16.25px;
    margin-bottom: 6px;
}
.bullet-infra::marker {
    color: #908B9F;
}
.bullet-market::marker {
    color: #0A58A5;
}
.pres-center-block {
    margin-top: 14px;
    padding: 14px;
    border-radius: 10px;
    border-radius: 14px;
border: 1px solid var(--stroke-1, #DFE5EC);
background: #F6F7F8;
}
.pres-center-block h3 {
    color: #223245;
font-family: "Open Sans";
font-size: 13px;
font-style: normal;
font-weight: 700;
line-height: 19.5px; /* 150% */
}
.pres-center-block p {
    color: #6E7F93;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin: 0;
}
/* Projection Financière - CSS */

.projection-main-content {
    background-color: #fff;
}

.pj-nav{
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    border-radius: 16777200px;
    border: 1px solid #DFE5EC;
    flex-shrink: 0;
    white-space: nowrap;
}

.pj-nav span{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.pj-nav.locked{
    cursor: default;
}

.pj-nav.locked span{
    color: #B5C1D0;
text-align: center;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 18px; /* 150% */
}

.pj-nav.active{
    border: 1px solid #0A58A5;
    background: #0A58A5;
}

.pj-nav.active span{
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px; /* 150% */
}

.pj-nav-blocs{
    display: flex;
    background-color: #fff;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    border-bottom: 1px solid #DFE5EC;
    padding: 20px;
    position: fixed;
    top: 80px;
    left: 350px;
    right: 0;
    overflow-x: auto;
    overflow-y: hidden;
}

.invest-content{
    display: flex;
    gap: 25px;
    margin-top: 60px;
    width: 100%;
    height: calc(100vh - 240px);
    padding-top: 30px;
    padding-bottom: 30px;
}

.pv-content{
    height: calc(100vh - 240px);
    margin-top: 70px !important;
    overflow: scroll;
    padding-bottom: 30px;
    padding-top: 30px;
}

.pj-content > .bp-generation-loader {
    margin-top: 70px;
}

.invest-content .list-invest{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    height: 100%;
    width: 65%;
    overflow: scroll;
}

.inv-total{
    width: 35%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.inv-total .invest-total, .distribut{
    border-radius: 20px;
    border: 1px solid #E6EAF0;
    background: #FFF;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
    padding: 20px;
}

.inv-total .invest-total h4{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}

.inv-total .invest-total h5{
    color: #223245;
    font-family: "Open Sans";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 133.333% */
    margin-top: 5px;
}

.inv-total .invest-total h5 span{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.distribut h6{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.distri-item{
    margin-top: 15px;
}

.distri-item div{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.distri-item div p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}

.distri-item div span{
    color: #223245;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}

.distri-progress{
    border-radius: 16777200px;
    background: #F0F2F5;
    height: 8px;
    width: 100%;
    margin-top: 5px;
}

.distri-progress-fill{
    border-radius: 16777200px;
    background: #0A58A5;
    height: 100%;
}

.ekipment{
    border-radius: 16777200px;
    background: #59B224;
}

.list-invest{
    padding: 20px;
}

.list-invest-title{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.list-invest-title h1{
    color: #223245;
    font-family: "Open Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 155.556% */
}

.list-invest-title button{
    border: none;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 142.857% */
}

.list-invest-table{
    margin-top: 25px;
}

.list-invest-table, .list-invest-table table{
    width: 100%;
}

.list-invest-table table th {
    border-bottom: 1px solid #F0F2F5;
    text-align: left;
    padding: 15px 16px;
}

.list-invest-table table td{
    border-bottom: 1px solid #F0F2F5;
    text-align: left;
    padding: 15px 16px;
}

.list-invest-table table thead tr{
    border-bottom: 1px solid #E6ECF5;
    background: #F6F9FE;
}

.list-invest-table table tr:first-child th{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px;
}

.list-invest-table table tr td{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 19.5px;
}

.list-invest-table table tr td:nth-child(1),
.list-invest-table table tr td:nth-child(3),
.list-invest-table table tr td:nth-child(4){
    color: #445972;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.5px;
}

td span.int{
    border-radius: 8px;
    background: #E8F0FE;
    padding: 4px 12px;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}

span.ekip{
    border-radius: 8px;
    background: #E8F5E1;
    padding: 4px 12px;
    color: #59B224;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}

.action-buttons{
    display: flex;
    align-items: center;
    gap: 20px;
}

.action-buttons button{
    border: none;
}

.invest-validation{
    border-top: 1px solid #DFE5EC;
    background: #FFF;
    padding: 0 24px;
    height: 67px;
    position: fixed;
    bottom: 0;
    right: 0;
    left: 350px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pv-validation-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.inline-input {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-family: "Open Sans";
    font-size: 13px;
    color: #223245;
    outline: none;
    background: #FFF;
    box-sizing: border-box;
}

.inline-input:focus, .inline-select:focus {
    border-color: #0A58A5;
    box-shadow: 0 0 0 2px rgba(10, 88, 165, 0.12);
}

.inline-input--amount {
    max-width: 140px;
}

.inline-select {
    padding: 8px 10px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-family: "Open Sans";
    font-size: 13px;
    color: #223245;
    outline: none;
    background: #FFF;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.list-invest-table .bp-row-btn {
    border: none;
    background: none;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.list-invest-table .bp-row-btn:hover {
    background: #F0F2F5;
}

tr.editing .action-buttons {
    gap: 8px;
}

.inv-valid{
    border-radius: 16px;
    background: #0A58A5;
    padding: 11.5px 23.063px 10.5px 24px;
    border: none;
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 142.857% */
}

.pv-content{
    margin-top: 2rem;
}

.pv-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pv-head div h2{
    color: #223245;
    font-family: "Open Sans";
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: 25.5px; /* 150% */
}

.pv-head div p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.5px; /* 150% */
}

.pv-head button{
    border-radius: 14px;
    border: 1px solid #0A58A5;
    padding: 7.75px 16.664px 8.25px 17px;
    color: #0A58A5;
    text-align: center;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 19.5px; /* 150% */
}

.pv-head button.btn-modifier-hypotheses{
    display: flex;
    align-items: center;
    gap: 6px;
    color: #6E7F93;
    text-align: center;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    border-radius: 14px;
    border: 1px solid #DFE5EC;
    background: transparent;
    padding: 10px;
    cursor: pointer;
}

.pv-dislaimer{
    border-radius: 14px;
    border: 1px solid #FFEDD5;
    background: #FFF7ED;
    padding: 17px;
    margin-top: 15px;
    display: flex;
    align-items: start;
    gap: 15px;
}

.pv-dislaimer p{
    color: #92400E;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 21.125px; /* 162.5% */
}

.pv-items{
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 20px;
}

.pv-items .pv-item{
    border-radius: 14px;
    border: 1px solid #E6ECF5;
    background: #FFF;
    padding: 20px;
    transition: opacity 0.3s ease, background 0.3s ease;
}

.pv-items .pv-item--inactive{
    opacity: 0.5;
    background: #F8F9FB;
}

.pv-item--inactive .pv-price,
.pv-item--inactive h3{
    color: #9BA8B7;
}

/* PV inline editing */
.pv-inline-input{
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    padding: 4px 8px;
    font-family: "Open Sans";
    font-size: 13px;
    color: #223245;
    outline: none;
    background: transparent;
}

.pv-inline-input:focus{
    border-color: #0A58A5;
}

.pv-inline-input--name{
    width: 400px;
}

.pv-inline-input--amount{
    width: 120px;
}

.pv-inline-input--small{
    width: 60px;
    text-align: center;
}

.pv-inline-select{
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    padding: 4px 8px;
    font-family: "Open Sans";
    font-size: 11px;
    color: #223245;
    outline: none;
    background: transparent;
    cursor: pointer;
}

.pv-inline-select:focus{
    border-color: #0A58A5;
}

.pv-inline-row{
    display: flex;
    align-items: center;
    gap: 4px;
}

.pv-inline-row span{
    font-size: 12px;
    color: #6E7F93;
}

.pv-inline-currency{
    font-size: 11px;
    color: #6E7F93;
}

.pv-save-btn, .pv-cancel-btn{
    border: none;
    background: none;
    cursor: pointer;
    padding: 4px;
    border-radius: 6px;
    display: flex;
    align-items: center;
}

.pv-save-btn:hover{
    background: #E8F5E1;
}

.pv-cancel-btn:hover{
    background: #FEE2E2;
}

.pv-months-edit{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.pv-month-check{
    display: flex;
    align-items: center;
    gap: 3px;
    cursor: pointer;
}

.pv-month-check input{
    width: 14px;
    height: 14px;
    accent-color: #0A58A5;
}

.pv-month-check span{
    font-family: "Open Sans";
    font-size: 11px;
    color: #223245;
}

.pv-item-toggle{
    display: flex;
    justify-content: space-between;
    cursor: pointer;
}

.pv-drop-icon{
    transition: transform 0.3s ease;
}

.pv-item--open .pv-drop-icon{
    transform: rotate(90deg);
}

.pv-item-content-wrapper{
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.pv-item--open .pv-item-content-wrapper{
    max-height: 500px;
}

.pv-item-content{
    display: flex;
    flex-direction: column;
    gap: 20px;
    border-top: 1px solid #F0F2F5;
    padding-top: 16px;
    margin-top: 16px;
}

.pv-left, .pv-right{
    display: flex;
    align-items: center;
    gap: 15px;
}

.pv-left h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px; /* 150% */
}

.pv-price{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 21px; /* 150% */
}

.pv-duration{
    border-radius: 10px;
    background: #F0F2F5;
    padding: 3.5px 9.203px 4.5px 10px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px; /* 150% */
}

.pv-activity-toggle {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    cursor: pointer;
}

.pv-activity-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
}

.pv-toggle-slider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    border-radius: 20px;
    transition: 0.3s;
}

.pv-toggle-slider::before {
    content: "";
    position: absolute;
    height: 14px;
    width: 14px;
    left: 3px;
    bottom: 3px;
    background-color: #fff;
    border-radius: 50%;
    transition: 0.3s;
}

.pv-activity-toggle input:checked + .pv-toggle-slider {
    background-color: #0A58A5;
}

.pv-activity-toggle input:checked + .pv-toggle-slider::before {
    transform: translateX(16px);
}

.pv-season{
    border-radius: 16777200px;
    background: #FFF5E6;
    height: 22px;
    padding: 0 8px;
    color: #D4841F;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px; /* 150% */
    display: flex;
    align-items: center;
    justify-content: center;
}

.pv-actions{
    display: flex;
    align-items: center;
    gap: 5px;
}

.pv-actions button{
    border: none;
    display: flex;
    align-items: center;
}

.pv-line{
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.pv-line-item{
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pv-line-item h5{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px; /* 150% */
}

.pv-rec{
    border-radius: 16777200px;
    background: #EBF3FC;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px; /* 150% */
    width: fit-content;
    padding: 4px 7.43px 3px 8px;
}

.pv-green{
    color: #059669;
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22.5px; /* 150% */
}

.pv-blue{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22.5px; /* 150% */
}

.pv-black{
    color: #223245;
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22.5px; /* 150% */
}

.pv-red{
    color: #DC2626;
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22.5px; /* 150% */
}

.pv-months{
    display: flex;
    align-items: center;
    gap: 6px;
}

.pv-months span{
    border-radius: 8px;
    background: #FFF5E6;
    color: #D4841F;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px; /* 150% */
    height: 22px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pv-continue{
    border-radius: 16777200px;
    background: #E8F5E1;
    height: 22px;
    padding: 0 8px;
    color: #059669;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px; /* 150% */
    display: flex;
    align-items: center;
    justify-content: center;
}

.pv-service{
    display: flex;
    height: 22px;
    padding: 4px 7.43px 3px 8px;
    justify-content: center;
    align-items: center;
    color: #DC2626;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px; /* 150% */
    border-radius: 16777200px;
    background: #FEE2E2;
    width: fit-content;
}

.pv-lic{
    border-radius: 16777200px;
    background: #E8F5E1;
    width: fit-content;
    height: 22px;
    padding: 4px 7.031px 3px 8px;
    color: #059669;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px; /* 150% */
}

.pv-metrics{
    display: flex;
    align-items: center;
    gap: 30px;
}

.sales-proj-cards{
    display: flex;
    gap: 16px;
    margin-top: 16px;
}

.sales-proj-card{
    flex: 1;
    border-radius: 14px;
    border: 1px solid #E6ECF5;
    background: #FFF;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sales-proj-card h6{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    margin: 0;
}

.sales-proj-card p{
    color: #223245;
    font-family: "Open Sans";
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 33px;
    margin: 0;
}

.sales-proj-card p span{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px;
}


.list-invest-table table{
    border-radius: 14px;
    border: 1px solid #E6ECF5;
    background: #FFF;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}

.sales-proj-growth{
    color: #059669;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}

.sales-proj-growth--negative{
    color: #DC2626;
}

.sales-proj-margin-rate {
    display: inline-flex;
    align-items: center;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    color: #00A63E;
    gap: 3px;
}

.sales-proj-margin-rate--negative {
    color: #DC2626;
}

.btn-modifier-hypotheses{
    display: flex;
    align-items: center;
    gap: 6px;
    color: #6E7F93;
    text-align: center;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    border-radius: 14px;
    border: 1px solid #DFE5EC;
    background: transparent;
    padding: 10px;
    cursor: pointer;
}

.pv-metric-item{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.pv-metric-item h6{
    color: #6E7F93;
    text-align: center;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px; /* 150% */
}

/* ── Compte d'exploitation ── */

.exploit-section{
    margin-bottom: 24px;
}

.exploit-section-title{
    color: #1A2B3C;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #E8EDF2;
}

.pv-badge{
    border-radius: 16777200px;
    height: 22px;
    padding: 0 8px;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pv-badge--fixe{
    background: #E8F4FD;
    color: #0A58A5;
}

.pv-badge--variable{
    background: #FFF5E6;
    color: #D4841F;
}

/* ── Barre de répartition des charges ── */

.exploit-bar-container{
    margin-top: 20px;
    margin-bottom: 24px;
}

.exploit-bar{
    display: flex;
    height: 12px;
    border-radius: 6px;
    overflow: hidden;
}

.exploit-bar-segment{
    transition: flex 0.3s ease;
}

.exploit-bar-legend{
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    margin-top: 10px;
}

.exploit-legend-item{
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3.25px 7px 3.75px 10px;
    border-radius: 16777200px;
}

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

.exploit-freq{
    border-radius: 16777200px;
    padding: 2px 8px;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
}

.exploit-freq--mensuel{
    background: #EBF3FC;
    color: #0A58A5;
}

.exploit-freq--annuel{
    background: #E8F5E1;
    color: #059669;
}

.exploit-freq--trimestriel{
    background: #F3EEFF;
    color: #7C3AED;
}

.exploit-note{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    margin-top: 8px;
    border-radius: 10px;
    background: #F6F9FE;
    padding: 12px;
}

.exploit-note span{
    font-weight: 600;
}

span.cr-type{
    border-radius: 8px;
    padding: 4px 12px;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
}
span.cr-type--fixe{ background: #E8F5E1; color: #59B224; }
span.cr-type--variable{ background: #FEF3C7; color: #92400E; }
span.cr-type--loyer{ background: #EBF3FC; color: #0A58A5; }
span.cr-type--salaires{ background: #F3EEFF; color: #7C3AED; }
span.cr-type--marketing{ background: #FFF5E6; color: #D4841F; }
span.cr-type--fournitures{ background: #ECFDF5; color: #059669; }
span.cr-type--services{ background: #FEF3C7; color: #92400E; }
span.cr-type--service{ background: #ECFDF5; color: #059669; }
span.cr-type--assurances{ background: #FEE2E2; color: #DC2626; }
span.cr-type--abonnement{ background: #F3EEFF; color: #7C3AED; }
span.cr-type--vente-directe{ background: #EBF3FC; color: #0A58A5; }
span.cr-type--commission{ background: #FFF5E6; color: #D4841F; }
span.cr-type--licence{ background: #F3EEFF; color: #7C3AED; }
span.cr-type--prestation{ background: #ECFDF5; color: #059669; }
span.cr-type--location{ background: #EBF3FC; color: #0A58A5; }
span.cr-type--consulting{ background: #FEF3C7; color: #92400E; }
span.cr-type--formation{ background: #FEE2E2; color: #DC2626; }
span.cr-type--investisseur{ background: #FFF5E6; color: #D4841F; }
span.cr-type--fonds-propres{ background: #E8F5E1; color: #59B224; }
span.cr-type--emprunt{ background: #FEF3C7; color: #92400E; }
span.cr-type--subvention{ background: #EBF3FC; color: #0A58A5; }

/* ── SIG (Soldes Intermédiaires de Gestion) ── */
.sig-card {
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #fff;
    overflow: hidden;
    margin-bottom: 24px;
}

.sig-card-header {
    padding: 20px 24px 16px;
    background: linear-gradient(180deg, #F6F9FE 0%, #fff 100%);
    border-bottom: 1px solid #EEF2F7;
    display: flex;
    align-items: center;
    gap: 14px;
}

.sig-card-header-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0A58A5 0%, #1A72C8 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(10,88,165,0.2);
}

.sig-card-header-icon svg {
    width: 20px;
    height: 20px;
}

.sig-card-header-text h2 {
    color: #223245;
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
    line-height: 22px;
    margin: 0;
}

.sig-card-header-text p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    margin: 2px 0 0;
}

.sig-table {
    width: 100%;
    border-collapse: collapse;
    font-family: "Open Sans";
}

/* Header année */
.sig-table thead tr th {
    padding: 10px 20px;
    text-align: right;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: #F8FAFC;
    border-bottom: 2px solid #EEF2F7;
}

.sig-table thead tr th:first-child {
    text-align: left;
    width: 42%;
}

.sig-table thead tr th:not(:first-child) {
    width: 19.33%;
    min-width: 110px;
}

/* Cellules communes */
.sig-table td {
    padding: 9px 20px;
    text-align: right;
    font-family: "Open Sans";
    font-size: 13px;
    color: #344054;
    border-bottom: 1px solid #F5F7FA;
    vertical-align: middle;
    font-variant-numeric: tabular-nums;
}

.sig-table td:first-child {
    text-align: left;
    color: #344054;
}

/* Lignes CA (première ligne, légèrement surlignée) */
.sig-row--ca td {
    padding-top: 12px;
    padding-bottom: 12px;
    font-weight: 600;
    font-size: 13px;
    color: #223245;
    background: #fff;
}

/* Lignes déductions (indentées, grises) */
.sig-row--deduction td {
    color: #8A97A8;
    font-size: 12px;
    background: #FAFBFC;
}

.sig-row--deduction td:first-child {
    padding-left: 36px;
    position: relative;
}

.sig-row--deduction td:first-child::before {
    content: '';
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 1px;
    background: #C4CDD6;
}

/* Ligne subtotal (marge brute, EBITDA, EBIT, RAI) */
.sig-row--subtotal td {
    font-weight: 700;
    font-size: 13px;
    background: #EEF5FF;
    color: #0A58A5;
    border-bottom: 1px solid #D6E6FA;
    border-top: 1px solid #D6E6FA;
    padding-top: 11px;
    padding-bottom: 11px;
}

.sig-row--subtotal td:first-child {
    padding-left: 20px;
}

/* Ligne séparateur de groupe */
.sig-row--separator td {
    padding: 0;
    height: 6px;
    background: #F5F7FA;
    border: none;
}

/* Ligne résultat net final */
.sig-row--total td {
    font-weight: 700;
    font-size: 14px;
    background: linear-gradient(90deg, #1A2B3C 0%, #223245 100%);
    color: #fff;
    border: none;
    padding-top: 14px;
    padding-bottom: 14px;
}

.sig-row--total td:first-child {
    padding-left: 20px;
    color: rgba(255,255,255,0.95);
    letter-spacing: 0.2px;
}

/* Valeurs positives / négatives */
.sig-val--positive { color: #00A63E !important; }
.sig-val--negative { color: #DC2626 !important; }

/* Dans la ligne total (fond sombre), couleurs plus douces */
.sig-row--total .sig-val--positive { color: #5FE89A !important; }
.sig-row--total .sig-val--negative { color: #FF8080 !important; }

/* Badge taux de marge */
.sig-badge {
    display: inline-flex;
    align-items: center;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 20px;
    margin-left: 8px;
    vertical-align: middle;
    line-height: 16px;
}

.sig-badge--positive {
    background: rgba(0, 166, 62, 0.12);
    color: #00A63E;
    border: 1px solid rgba(0, 166, 62, 0.2);
}

.sig-badge--negative {
    background: rgba(220, 38, 38, 0.1);
    color: #DC2626;
    border: 1px solid rgba(220, 38, 38, 0.2);
}

/* Taux de marge % dans chaque cellule de la ligne Marge Brute */
.sig-mb-pct {
    display: block;
    font-size: 10px;
    font-weight: 700;
    opacity: 0.7;
    margin-top: 1px;
}

/* Note de bas de tableau */
.sig-note {
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: "Open Sans";
    font-size: 11px;
    color: #8A97A8;
    font-style: italic;
    padding: 10px 20px;
    background: #F8FAFC;
    border-top: 1px solid #EEF2F7;
    line-height: 16px;
}

.sig-note-dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #C4CDD6;
    flex-shrink: 0;
}

.sig-detail-title {
    color: #223245;
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
    margin: 8px 0 16px;
}

.cr-table-card{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 20px;
    margin-bottom: 20px;
}

.cr-table-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.cr-table-head h1{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
}

.cr-table-head button{
    background: none;
    border: none;
    color: #0A58A5;
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer;
}

.pf-cards{
    display: flex;
    gap: 16px;
    width: 100%;
    margin-bottom: 25px;
}

.pf-card{
    flex: 1;
    border-radius: 16px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 20px;
}

.pf-card h4{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.pf-card h5{
    color: #223245;
    font-family: "Open Sans";
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    margin-top: 5px;
}

.pf-card h5 span{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.pf-toggle-info{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pf-toggle-sub{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.pf-amort-title{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 0;
}

/* BFR card — Plan de Financement */
.pf-bfr-card {
    border-radius: 16px;
    border: 1px solid #D6E6FA;
    background: linear-gradient(160deg, #F6F9FE 0%, #fff 100%);
    padding: 20px 24px;
    margin-bottom: 20px;
}

.pf-bfr-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}

.pf-bfr-icon {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: #0A58A5;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px;
    flex-shrink: 0;
}

.pf-bfr-title {
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 2px 0;
    line-height: 1.2;
}

.pf-bfr-subtitle {
    font-family: "Open Sans";
    font-size: 11px;
    color: #6E7F93;
    margin: 0;
}

.pf-bfr-years {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.pf-bfr-year {
    flex: 1;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #E8F0FE;
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pf-bfr-year-label {
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700;
    color: #8A97A8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.pf-bfr-year-val {
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    color: #223245;
}

.pf-bfr--positive { color: #00A63E !important; }
.pf-bfr--negative { color: #DC2626 !important; }

.pf-bfr-year-hint {
    font-family: "Open Sans";
    font-size: 10px;
    color: #6E7F93;
    font-style: italic;
}

.pf-bfr-detail {
    border-top: 1px solid #E8F0FE;
    padding-top: 12px;
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.pf-bfr-op {
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: "Open Sans";
    font-size: 12px;
    color: #6E7F93;
}

.pf-bfr-op strong {
    color: #223245;
    font-weight: 600;
}

/* Équilibre Besoins / Ressources */
.pf-equilibre-block {
    border-radius: 16px;
    border: 1px solid #D6E6FA;
    background: #fff;
    padding: 20px 24px;
    margin-bottom: 20px;
}

.pf-equilibre-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.pf-equilibre-title {
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
    color: #223245;
    margin: 0;
}

.pf-equilibre-badge {
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 20px;
    letter-spacing: 0.2px;
}

.pf-equilibre-badge--ok {
    background: rgba(0,166,62,0.1);
    color: #00A63E;
    border: 1px solid rgba(0,166,62,0.25);
}

.pf-equilibre-badge--gap {
    background: rgba(220,38,38,0.08);
    color: #DC2626;
    border: 1px solid rgba(220,38,38,0.2);
}

.pf-equilibre-cols {
    display: flex;
    gap: 0;
    align-items: stretch;
    margin-bottom: 16px;
}

.pf-eq-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.pf-eq-col--besoins {
    background: #FFF8F0;
    border-radius: 12px 0 0 12px;
    border: 1px solid #FDDCB0;
    overflow: hidden;
}

.pf-eq-col--ressources {
    background: #F0FDF4;
    border-radius: 0 12px 12px 0;
    border: 1px solid #BBF7D0;
    border-left: none;
    overflow: hidden;
}

.pf-eq-col-title {
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
    padding: 10px 16px 8px;
    text-transform: uppercase;
}

.pf-eq-col--besoins .pf-eq-col-title { color: #B45309; background: #FDDCB0; }
.pf-eq-col--ressources .pf-eq-col-title { color: #065F46; background: #BBF7D0; }

.pf-eq-rows {
    flex: 1;
    padding: 8px 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pf-eq-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(0,0,0,0.04);
}

.pf-eq-row:last-child { border-bottom: none; }

.pf-eq-row--empty {
    justify-content: center;
    opacity: 0.5;
    font-style: italic;
}

.pf-eq-label {
    font-family: "Open Sans";
    font-size: 12px;
    color: #4B5563;
    flex: 1;
}

.pf-eq-val {
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    color: #223245;
    white-space: nowrap;
}

.pf-eq-val em {
    font-style: normal;
    font-size: 10px;
    font-weight: 400;
    color: #8A97A8;
    margin-left: 2px;
}

.pf-eq-val--zero {
    color: #9CA3AF;
    font-weight: 400;
}

.pf-eq-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.pf-eq-col--besoins .pf-eq-total {
    background: linear-gradient(90deg, #FDDCB0 0%, #FDE8CC 100%);
    color: #92400E;
}

.pf-eq-col--ressources .pf-eq-total {
    background: linear-gradient(90deg, #BBF7D0 0%, #D1FAE5 100%);
    color: #065F46;
}

.pf-eq-total em {
    font-style: normal;
    font-size: 10px;
    font-weight: 400;
    opacity: 0.7;
    margin-left: 2px;
}

.pf-eq-divider {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    gap: 6px;
    flex-shrink: 0;
}

.pf-eq-divider-line {
    flex: 1;
    width: 1px;
    background: #D1D5DB;
    min-height: 20px;
}

.pf-eq-divider-icon {
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    color: #9CA3AF;
    line-height: 1;
}

.pf-equilibre-alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: rgba(220,38,38,0.06);
    border: 1px solid rgba(220,38,38,0.2);
    border-radius: 10px;
    padding: 14px 16px;
    color: #DC2626;
}

.pf-equilibre-alert svg { flex-shrink: 0; margin-top: 1px; }

.pf-equilibre-alert div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pf-equilibre-alert strong {
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    color: #B91C1C;
}

.pf-equilibre-alert span {
    font-family: "Open Sans";
    font-size: 11px;
    color: #7F1D1D;
}

.pf-equilibre-surplus {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(0,166,62,0.06);
    border: 1px solid rgba(0,166,62,0.2);
    border-radius: 10px;
    padding: 10px 14px;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    color: #065F46;
}

.pf-total-row{
    background: #F6F9FE;
}

.pf-total-row td{
    font-weight: 700;
    color: #223245;
}

.list-invest-table table tfoot tr td:first-child{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.5px;
    text-align: left;
}

.list-invest-table table tfoot tr td{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px;
}

.cr-edit-input, .cr-edit-select{
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    padding: 6px 10px;
    font-family: "Open Sans";
    font-size: 13px;
    outline: none;
}
.cr-edit-input:focus, .cr-edit-select:focus{
    border-color: #0A58A5;
}
.cr-edit-select--tva{
    width: 90px;
    font-size: 12px;
    padding: 5px 6px;
}
.cr-tva-badge{
    display: inline-block;
    background: #EBF3FC;
    color: #0A58A5;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 20px;
}
.cr-tva-badge--zero{
    background: #F0FDF4;
    color: #059669;
}

.exploit-type-tag{
    border-radius: 16777200px;
    padding: 2px 8px;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    white-space: nowrap;
}

.exploit-legend-label{
    color: inherit;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
}

.exploit-legend-value{
    color: inherit;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 400;
}

/* ── Bilan prévisionnel ── */

.bilan-container{
    display: flex;
    gap: 20px;
    width: 100%;
}

.bilan-bloc{
    flex: 1;
}

.bilan-bloc-header{
    border-radius: 20px 20px 0 0;
    border: 1px solid #E6EAF0;
    background: linear-gradient(180deg, #DFE5EC 9%, #FFF 50%);
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bilan-bloc-header-left{
    display: flex;
    align-items: center;
    gap: 10px;
}

.bilan-back-btn{
    width: 32px;
    height: 32px;
    border-radius: 16777200px;
    background: rgba(10, 88, 165, 0.06);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
}

.bilan-back-btn:hover{
    background: rgba(10, 88, 165, 0.12);
}

.bilan-header-info{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.bilan-header-info h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

.bilan-header-info p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.bilan-bloc-header .bilan-total{
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    line-height: 28px;
}

.bilan-bloc--actif .bilan-bloc-header .bilan-total{
    color: #0A58A5;
}

.bilan-bloc--passif .bilan-bloc-header .bilan-total{
    color: #FF9900;
}

.bilan-bloc-header .bilan-total span{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
}

.bilan-bloc-body{
    border-radius: 0 0 20px 20px;
    border-right: 1px solid #DFE5EC;
    border-bottom: 1px solid #DFE5EC;
    border-left: 1px solid #DFE5EC;
    background: #FFF;
    padding: 20px;
}

.bilan-section{
    margin-bottom: 16px;
}

.bilan-section:last-child{
    margin-bottom: 0;
}

.bilan-section-title{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 8px;
    border-bottom: 1px solid #F0F2F5;
    margin-bottom: 10px;
}

.bilan-section-title h4{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}

.bilan-section-title span{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}

.bilan-line{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
}

.bilan-line p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
}

.bilan-line span{
    color: #223245;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
}

.bilan-bloc--actif .bilan-line span,
.bilan-bloc--actif .bilan-section-title span{
    color: #0A58A5;
}

.bilan-bloc--passif .bilan-line span,
.bilan-bloc--passif .bilan-section-title span{
    color: #FF9900;
}

/* ── Bilan 3 ans ── */

.b3-wrap { margin-bottom: 24px; }

.b3-card {
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #fff;
    overflow: hidden;
}

.b3-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 16px;
    background: linear-gradient(180deg, #F6F9FE 0%, #fff 100%);
    border-bottom: 1px solid #EEF2F7;
}

.b3-head-title {
    display: flex;
    align-items: center;
    gap: 14px;
}

.b3-head-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0A58A5 0%, #1A72C8 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(10,88,165,0.2);
}

.b3-head-title h2 {
    color: #223245;
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
}

.b3-head-title p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    margin-top: 2px;
}

.b3-head-badge {
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    color: #0A58A5;
    background: rgba(10,88,165,0.08);
    border: 1px solid rgba(10,88,165,0.15);
    border-radius: 20px;
    padding: 4px 12px;
}

.b3-table-scroll { overflow-x: auto; }

.b3-table {
    width: 100%;
    border-collapse: collapse;
    font-family: "Open Sans";
    min-width: 520px;
}

.b3-table thead tr th {
    padding: 10px 16px;
    text-align: right;
    color: #6E7F93;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: #F8FAFC;
    border-bottom: 2px solid #EEF2F7;
    white-space: nowrap;
}

.b3-th-label { text-align: left !important; width: 44%; }

.b3-table td {
    padding: 8px 16px;
    text-align: right;
    font-size: 13px;
    color: #344054;
    border-bottom: 1px solid #F5F7FA;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.b3-row--section-header td {
    padding: 10px 16px 6px;
    text-align: left !important;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #0A58A5;
    background: #EEF5FF;
    border-bottom: 1px solid #D6E6FA;
    border-top: 2px solid #D6E6FA;
}

.b3-row--section-passif td {
    color: #B45309;
    background: #FFFBEB;
    border-color: #FDE68A;
}

.b3-row--group td {
    font-weight: 700;
    font-size: 13px;
    color: #223245;
    background: #FAFBFC;
}

.b3-row--group td:first-child { padding-left: 16px; }

.b3-row--detail td {
    font-size: 12px;
    color: #6E7F93;
    background: #fff;
}

.b3-row--detail td:first-child {
    padding-left: 32px;
    position: relative;
}

.b3-row--detail td:first-child::before {
    content: '';
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 1px;
    background: #C4CDD6;
}

.b3-row--total td {
    font-weight: 700;
    font-size: 14px;
    padding: 12px 16px;
    border-top: 2px solid;
}

.b3-row--total-actif td {
    background: linear-gradient(90deg, #0A58A5 0%, #1A72C8 100%);
    color: #fff;
    border-color: #0A58A5;
}

.b3-row--total-passif td {
    background: linear-gradient(90deg, #92400E 0%, #B45309 100%);
    color: #fff;
    border-color: #92400E;
}

.b3-row--total td:first-child { text-align: left; }

.b3-row--balance td {
    background: #F8FAFC;
    padding: 10px 16px;
    border-top: 1px solid #EEF2F7;
    border-bottom: none;
}

.b3-row--balance td:first-child {
    font-size: 11px;
    font-weight: 600;
    color: #8A97A8;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.b3-badge {
    display: inline-flex;
    align-items: center;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 20px;
}

.b3-badge--ok {
    background: rgba(0,166,62,0.1);
    color: #00A63E;
    border: 1px solid rgba(0,166,62,0.2);
}

.b3-badge--warn {
    background: rgba(220,38,38,0.08);
    color: #DC2626;
    border: 1px solid rgba(220,38,38,0.15);
}

.b3-neg { color: #DC2626 !important; }
.b3-pos { color: #00A63E !important; }

/* Bilan BFR row */
.b3-row--bfr td {
    background: #F0FDF4;
    font-weight: 600;
    font-size: 12px;
    padding: 10px 16px;
    border-top: 2px solid #BBF7D0;
    border-bottom: 1px solid #D1FAE5;
    color: #223245;
}

.b3-row--bfr td:first-child {
    text-align: left;
}

.b3-bfr-formula {
    font-size: 10px;
    font-weight: 400;
    color: #6E7F93;
    margin-left: 6px;
}

.b3-footnote {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    color: #8A97A8;
    font-style: italic;
    padding: 10px 20px;
    background: #F8FAFC;
    border-top: 1px solid #EEF2F7;
    flex-wrap: wrap;
}

.b3-fn-dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #C4CDD6;
    flex-shrink: 0;
}

/* ── Trésorerie prévisionnelle ── */

.treso-container{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    overflow: hidden;
}

.treso-header{
    border-bottom: 1px solid #E6EAF0;
    background: linear-gradient(180deg, #DFE5EC 9%, #FFF 50%);
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.treso-header h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

.treso-header-actions{
    display: flex;
    align-items: center;
    gap: 10px;
}

.treso-btn{
    border-radius: 16777200px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 6px 14px;
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.treso-btn:hover{
    border-color: #0A58A5;
    color: #0A58A5;
}

.treso-btn svg{
    flex-shrink: 0;
}

.treso-table-wrapper{
    overflow-x: auto;
    padding: 0;
}

.treso-table{
    width: 100%;
    border-collapse: collapse;
    min-width: 900px;
}

.treso-table th{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: 0.55px;
    text-transform: uppercase;
    text-align: right;
    padding: 12px 14px;
    border-bottom: 1px solid #F0F2F5;
    white-space: nowrap;
}

.treso-table th:first-child{
    text-align: left;
    padding-left: 20px;
}

.treso-table td{
    color: #223245;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    text-align: right;
    padding: 10px 14px;
    border-bottom: 1px solid #F0F2F5;
    white-space: nowrap;
}

.treso-table td:first-child{
    text-align: left;
    padding-left: 20px;
    font-weight: 600;
    color: #223245;
}

.treso-row--entrees td{
    color: #00A63E;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.treso-row--entrees td:first-child{ color: #00A63E; }
.treso-row--sorties td{
    color: #FC121B;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.treso-row--sorties td:first-child{ color: #FC121B; }
.treso-row--solde td:first-child{ color: #0A58A5; }

.treso-row--solde{
    background: #F6F9FE;
}

.treso-row--solde td{
    color: #0A58A5;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.treso-row--gap td {
    height: 4px;
    background: #EEF2F7;
    padding: 0;
    border: none;
}

.treso-row--cumul {
    background: linear-gradient(90deg, #1A2B3C 0%, #223245 100%);
}

.treso-row--cumul td {
    color: rgba(255,255,255,0.92);
    font-size: 12px;
    font-weight: 700;
    padding: 11px 12px;
    border-bottom: none;
}

.treso-row--cumul td:first-child {
    color: #fff;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.treso-cumul-init {
    font-size: 9px;
    font-weight: 400;
    color: rgba(255,255,255,0.45);
    font-style: italic;
}

.treso-val--positive { color: #5FE89A !important; }

.treso-val--negative { color: #FF8080 !important; }

.treso-val--danger {
    background: rgba(220,38,38,0.15) !important;
    border-radius: 4px;
}

.treso-low-badge {
    font-size: 9px;
    margin-left: 4px;
    color: #FF8080;
}

.treso-alert-strip {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: #FFF5F5;
    border-top: 1px solid #FECACA;
    color: #DC2626;
    font-family: "Open Sans";
    font-size: 12px;
}

.treso-alert-strip svg { flex-shrink: 0; }

.treso-ok-strip {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #F0FDF4;
    border-top: 1px solid #BBF7D0;
    color: #00A63E;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
}

/* ── Modal paramètres trésorerie ── */

.treso-modal{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.treso-modal.show{
    display: flex;
}

.treso-modal-overlay{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

.treso-modal-content{
    position: relative;
    background-color: #FFF;
    border-radius: 20px;
    width: 100%;
    max-width: 700px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    z-index: 1001;
}

.treso-modal-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
    background: linear-gradient(180deg, #E6ECF5 0%, #FFF 100%);
    border-radius: 20px 20px 0 0;
}

.treso-modal-header h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    margin: 0;
}

.treso-modal-close{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
}

.treso-modal-close:hover{
    background: #F8F9FA;
    color: #223245;
}

.treso-modal-body{
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.treso-hypotheses{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.treso-hypo-card{
    flex: 1;
    border-radius: 14px;
    border: 1px solid #E6EAF0;
    background: #FAFBFC;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.treso-hypo-card label{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.treso-hypo-card .treso-hypo-value{
    display: flex;
    align-items: center;
    gap: 6px;
}

.treso-hypo-input{
    width: 100%;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    padding: 8px 10px;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    outline: none;
    background: #FFF;
}

.treso-hypo-input:focus{
    border-color: #0A58A5;
    box-shadow: 0 0 0 2px rgba(10, 88, 165, 0.12);
}

.treso-hypo-unit{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    white-space: nowrap;
}

.treso-hypo-hint {
    font-family: "Open Sans";
    font-size: 10px;
    color: #8A97A8;
    font-style: italic;
    margin-top: 6px;
    line-height: 1.4;
}

.treso-hypo-card--is {
    flex: 0 0 100%;
    border-top: 2px solid #EEF2F7;
    margin-top: 4px;
}

.treso-edit-input{
    width: 100%;
    border: 1px solid #DFE5EC;
    border-radius: 6px;
    padding: 6px 8px;
    font-family: "Open Sans";
    font-size: 12px;
    color: #223245;
    outline: none;
    background: #FFF;
}
.treso-edit-input:focus{
    border-color: #0A58A5;
    box-shadow: 0 0 0 2px rgba(10, 88, 165, 0.12);
}

.treso-row--toggle{
    cursor: pointer;
}

.treso-row--toggle:hover{
    background: #FAFBFC;
}

.treso-row--toggle td:first-child{
    display: flex;
    align-items: center;
    gap: 6px;
}

.treso-toggle-icon{
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.treso-row--toggle.treso-open .treso-toggle-icon{
    transform: rotate(90deg);
}

.treso-detail-row{
    display: none;
}

.treso-detail-row.treso-visible{
    display: table-row;
}

.treso-detail-row td{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 400;
    line-height: 16.5px;
    padding: 6px 14px;
    border-bottom: 1px solid #F8F9FB;
}

.treso-detail-row td:first-child{
    padding-left: 40px;
    font-weight: 400;
    color: #6E7F93;
}

/* ── Dashboard header ── */

.dash-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    border-radius: 15px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    margin: 0 16px 24px 16px;
}

.dash-header-left h2{
    color: #223245;
    font-family: "Open Sans";
    font-size: 17px;
    font-weight: 700;
    line-height: 25.5px;
}

.dash-header-left p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 19.5px;
    margin-top: 2px;
}

.dash-scenario-tabs{
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 14px;
    border: 1px solid #DFE5EC;
    background: #F8F8FB;
    padding: 4px;
}

.dash-header-right{
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ── Sensitivity group (multipliers grouped with label) ── */
.dash-sensitivity-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 14px;
    border-radius: 12px;
    background: #F8F8FB;
    border: 1px solid #DFE5EC;
}

.dash-sensitivity-label {
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #8A97A8;
}

.dash-sensitivity-inputs {
    display: flex;
    gap: 12px;
}

.dash-sensitivity-inputs .dash-multiplier-item {
    padding: 0;
    background: none;
    border-radius: 0;
}

.dash-sensitivity-inputs .dash-multiplier-item + .dash-multiplier-item {
    padding-left: 12px;
    border-left: 1px solid #DFE5EC;
}

.dash-scenario-btn{
    border: none;
    background: transparent;
    padding: 6px 16px;
    border-radius: 10px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    line-height: 20px;
}

.dash-scenario-btn.active{
    background: #0A58A5;
    color: #FFF;
}

.dash-tabs-separator{
    width: 1px;
    height: 28px;
    background: #DFE5EC;
    margin: 0 4px;
}

.dash-multiplier-item{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 8px 16px;
    border-radius: 10px;
    background: #FFF;
}

.dash-multiplier-label{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
}

.dash-multiplier-value{
    color: #223245;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
    background: none;
    border: none;
    border-bottom: 1.5px dashed #A0AEC0;
    outline: none;
    width: 60px;
    text-align: center;
    padding: 0;
    cursor: text;
    -moz-appearance: textfield;
}
.dash-multiplier-value::-webkit-inner-spin-button,
.dash-multiplier-value::-webkit-outer-spin-button {
    -webkit-appearance: none;
}
.dash-multiplier-value:focus {
    border-bottom-color: #0A58A5;
    color: #0A58A5;
}

/* ── Dashboard KPI cards ── */

.dash-kpi-cards{
    display: flex;
    gap: 16px;
    padding: 0 16px;
    margin-bottom: 24px;
}

.dash-kpi-card{
    flex: 1;
    border-radius: 14px;
    border: 1px solid #E6EAF0;
    background: #FFF;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.dash-kpi-card h6{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin: 0;
}

.dash-kpi-card p{
    color: #223245;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
    margin: 0;
}

.dash-kpi-card p span{
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
}

.dash-kpi-negative{
    color: #DC2626 !important;
}

.dash-kpi-card--bfr {
    border-color: #D6E6FA;
    background: linear-gradient(160deg, #F6F9FE 0%, #fff 100%);
}

.dash-bfr-trend {
    display: flex;
    gap: 10px;
    margin-top: 4px;
}

.dash-bfr-yr {
    font-family: "Open Sans";
    font-size: 10px;
    color: #8A97A8;
    background: #F0F4F8;
    border-radius: 6px;
    padding: 2px 8px;
}

/* ── Primary KPIs row (CA / Marge / Résultat net) ── */
.dash-primary-kpis {
    display: flex;
    gap: 16px;
    padding: 0 16px;
    margin-bottom: 20px;
}

.dash-kpi-card--primary p {
    font-size: 26px !important;
}

.dash-is-note {
    font-size: 9px;
    font-weight: 400;
    opacity: 0.6;
    text-transform: none;
    letter-spacing: 0;
}

/* ── Main row : cashflow chart (65%) + sidebar (35%) ── */
.dash-main-row {
    display: flex;
    gap: 16px;
    padding: 0 16px;
    margin-bottom: 24px;
    align-items: flex-start;
}

.dash-chart-card--main {
    flex: 72;
}

.dash-sidebar {
    flex: 28;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.dash-sidebar-card {
    border-radius: 14px;
    border: 1px solid #E6EAF0;
    background: #FFF;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.dash-sidebar-card h6 {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin: 0;
}

.dash-sidebar-card p {
    color: #223245;
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 700;
    margin: 0;
}

.dash-sidebar-card p span {
    font-size: 12px;
    font-weight: 400;
    color: #6E7F93;
}

.dash-sidebar-card--chart {
    padding: 16px;
}

.dash-sidebar-card--chart h6 {
    margin-bottom: 8px;
}

/* ── Dashboard charts row (legacy kept for compat) ── */
.dash-charts-row{
    display: flex;
    gap: 16px;
    padding: 0 16px;
    margin-bottom: 24px;
}

.dash-chart-card{
    flex: 1;
    border-radius: 14px;
    border: 1px solid #E6EAF0;
    background: #FFF;
    padding: 20px;
}

.dash-chart-card h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 21px;
    margin-bottom: 16px;
}

.dash-chart-wrapper{
    position: relative;
}

/* ── Tableau d'amortissement – colonnes stylées ── */

.pv-item-content .list-invest-table table tbody td:nth-child(3){
    color: #0A58A5;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.pv-item-content .list-invest-table table tbody td:nth-child(4){
    color: #D97706;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.pv-item-content .list-invest-table{
    margin-top: 0;
}

.pv-item-content .list-invest-table table tbody td{
    color: #223245;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.pv-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    gap: 12px;
    text-align: center;
}

.pv-empty p {
    color: #6B7280;
    font-size: 14px;
    font-weight: 400;
    margin: 0;
}

/* ── Synthèse trésorerie 3 ans ── */
.cf3-card {
    background: #fff;
    border-radius: 16px;
    border: 1.5px solid #E5E7EB;
    padding: 0;
    margin-top: 20px;
    overflow: hidden;
}
.cf3-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px 14px;
    background: linear-gradient(90deg, #F0F5FF 0%, #fff 100%);
    border-bottom: 1px solid #E5E7EB;
}
.cf3-title {
    display: flex;
    align-items: center;
    gap: 8px;
}
.cf3-title h3 {
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    margin: 0;
}
.cf3-badge {
    font-size: 11px;
    font-weight: 700;
    color: #0A58A5;
    background: #EFF6FF;
    border-radius: 20px;
    padding: 3px 10px;
}
.cf3-table-wrap {
    overflow-x: auto;
}
.cf3-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cf3-table thead tr {
    background: #F8FAFC;
}
.cf3-table thead th {
    padding: 10px 16px;
    text-align: right;
    font-size: 12px;
    font-weight: 700;
    color: #6E7F93;
    border-bottom: 1px solid #E5E7EB;
    white-space: nowrap;
}
.cf3-table thead th.cf3-th-label {
    text-align: left;
    width: 40%;
}
.cf3-table tbody td {
    padding: 9px 16px;
    text-align: right;
    border-bottom: 1px solid #F1F5F9;
    color: #223245;
    font-size: 13px;
}
.cf3-table tbody td:first-child {
    text-align: left;
    color: #4B5563;
    font-weight: 500;
}
.cf3-row--section td {
    background: #F8FAFC;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #6E7F93 !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 7px 16px !important;
    border-bottom: none !important;
}
.cf3-row--sub td {
    color: #6E7F93 !important;
    font-size: 12px !important;
    padding-left: 28px !important;
}
.cf3-row--total-caf td {
    background: #EFF6FF;
    font-weight: 700 !important;
    color: #0A58A5 !important;
    border-top: 1.5px solid #BFDBFE;
    border-bottom: 1.5px solid #BFDBFE;
}
.cf3-row--total-caf td:first-child {
    color: #0A58A5 !important;
}
.cf3-row--flux td {
    font-weight: 700 !important;
    border-top: 1.5px solid #E5E7EB;
}
.cf3-row--position td {
    font-weight: 700 !important;
    font-size: 14px !important;
    background: #F8FAFC;
    border-top: 2px solid #223245;
}
.cf3-row--position td:first-child {
    color: #223245 !important;
    font-size: 13px !important;
}
.cf3-position-ok {
    color: #059669 !important;
}
.cf3-position-neg {
    color: #DC2626 !important;
}
.cf3-neg { color: #DC2626; }
.cf3-pos { color: #059669; }
.cf3-note {
    font-size: 11px;
    color: #9CA3AF;
    padding: 10px 20px 14px;
    margin: 0;
    font-style: italic;
    border-top: 1px solid #F1F5F9;
}

/* ── Charges sociales note (Fix 11) ── */
.exploit-cotisations-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 10px;
    background: #FEF9EC;
    border: 1px solid #FDE68A;
    color: #92400E;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 16px;
}
.exploit-cotisations-note svg {
    flex-shrink: 0;
    color: #D97706;
    margin-top: 1px;
}

/* ── Insolvency alert in Bilan (Fix 12) ── */
.b3-insolvency-alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 12px;
    background: #FFF1F2;
    border: 1.5px solid #FECDD3;
    color: #9F1239;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 16px;
}
.b3-insolvency-alert svg {
    flex-shrink: 0;
    color: #DC2626;
    margin-top: 1px;
}

/* ── TVA row in cashflow (Fix 6) ── */
.treso-row--tva td {
    background: #FFFBEB;
    color: #92400E;
    font-size: 11px;
    font-style: italic;
    border-top: 1px dashed #FDE68A;
}
.treso-val--tva {
    font-weight: 600;
    color: #D97706 !important;
}
.treso-tva-note {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 11px;
    color: #92400E;
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-radius: 8px;
    padding: 7px 12px;
    margin-top: 8px;
}
.treso-tva-note svg {
    flex-shrink: 0;
    margin-top: 1px;
    color: #D97706;
}

/* ── Seuil de rentabilité card ── */
.sig-seuil-card {
    display: flex;
    gap: 0;
    border-radius: 16px;
    border: 1.5px solid #E5E7EB;
    overflow: hidden;
    margin-bottom: 16px;
    background: #fff;
}
.sig-seuil-left {
    flex: 0 0 44%;
    padding: 20px 20px 18px;
    border-right: 1.5px solid #E5E7EB;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.sig-seuil-right {
    flex: 1;
    padding: 20px 20px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    justify-content: center;
}
.sig-seuil-header {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.sig-seuil-header h3 {
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
}
.sig-seuil-badge {
    font-size: 11px;
    font-weight: 700;
    border-radius: 20px;
    padding: 2px 10px;
}
.sig-seuil-badge--ok {
    background: #D1FAE5;
    color: #059669;
}
.sig-seuil-badge--warn {
    background: #FEF3C7;
    color: #D97706;
}
.sig-seuil-val {
    font-size: 26px;
    font-weight: 700;
    color: #223245;
    line-height: 1.1;
}
.sig-seuil-val span {
    font-size: 13px;
    font-weight: 500;
    color: #6E7F93;
    margin-left: 4px;
}
.sig-seuil-hint {
    font-size: 12px;
    color: #6E7F93;
    font-style: italic;
}
.sig-seuil-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: #223245;
    padding: 3px 0;
}
.sig-seuil-row span:last-child {
    font-weight: 600;
    color: #0A58A5;
}
.sig-seuil-row--sub {
    color: #6E7F93;
    padding-left: 12px;
}
.sig-seuil-row--sub span:last-child {
    font-weight: 500;
    color: #6E7F93;
}

/* ── Grace period rows in échéancier ── */
.ech-row--grace {
    background: #FFFBEB;
}
.ech-row--grace td {
    color: #92400E !important;
}
.ech-grace-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    background: #FDE68A;
    color: #92400E;
    border-radius: 10px;
    padding: 1px 7px;
    margin-left: 4px;
    vertical-align: middle;
}

/* ── Dashboard seuil KPI card ── */
.dash-kpi-card--seuil {
    border-color: #DDE8F8;
    background: linear-gradient(135deg, #EFF6FF 0%, #fff 100%);
}
.dash-kpi-card--seuil h6 {
    color: #0A58A5;
}
/* ── Variable charges — % du CA badge (Point 13) ── */
.exploit-pct-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    background: #EFF6FF;
    color: #0A58A5;
    border: 1px solid #BFDBFE;
    border-radius: 10px;
    padding: 2px 10px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}
.exploit-pct-badge.exploit-pct-badge--small {
    font-size: 11px;
    font-weight: 600;
    padding: 1px 7px;
    border-radius: 8px;
}
.exploit-pct-label {
    font-size: 10px;
    font-weight: 500;
    opacity: 0.8;
}

/* ── Point 14 — 5-year projection toggle ── */
.pf-5yr-col { display: none; }
.pf-5yr .pf-5yr-col { display: table-cell; }
th.pf-5yr-col { display: none; }
.pf-5yr th.pf-5yr-col { display: table-cell; }
.b3-th--ext, .b3-td--ext { background: #F0F7FF !important; color: #0A58A5; }
.sig-th--ext, .sig-td--ext { background: #F0F7FF !important; color: #0A58A5; }
.cf3-th--ext, .cf3-td--ext { background: #F0F7FF !important; color: #0A58A5; }
.pf-5yr-inline { display: none; }
.pf-5yr .pf-5yr-inline { display: inline; }
/* proj-years select card */



.treso-hypo-card--proj-years .treso-hypo-value { display: block; }
.treso-hypo-select { appearance: auto; cursor: pointer; }




/* ===== Écran d'accueil : formulaire de configuration ===== */
.pf-config-card{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    min-height: calc(100vh - 260px);
    padding: 20px 40px;
    gap: 6px;
}

.pf-config-title{
    color: #223245;
    font-size: 20px;
    font-weight: 700;
    margin: 6px 0 0;
}

.pf-config-subtitle{
    color: #6E7F93;
    font-size: 14px;
    line-height: 1.5;
    max-width: 460px;
    margin: 0;
}

.pf-config-form{
    width: 100%;
    max-width: 460px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 20px;
    text-align: left;
}

.pf-config-row{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pf-config-row > label,
.pf-config-models-label{
    font-size: 13px;
    font-weight: 600;
    color: #445972;
}

.pf-config-input{
    width: 100%;
    padding: 11px 12px;
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    background: #FFFFFF;
    color: #223245;
    font-size: 14px;
    font-family: inherit;
}

.pf-config-input:focus{
    outline: none;
    border-color: #0A58A5;
}

.pf-config-checks{
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 6px;
}

.pf-config-check{
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 14px;
    color: #223245;
    cursor: pointer;
}

.pf-config-check input{
    width: 16px;
    height: 16px;
    accent-color: #0A58A5;
    cursor: pointer;
}

.pf-config-form .seg-generate-main-btn{
    margin-top: 8px;
    align-self: center;
}
/* ===== Loader pour la génération ===== */

.business-plan-content{
    background: none !important;
    margin: 0 !important;
    height: calc(100vh - 90px) !important;
}

.bp-generation-loader {
    border-radius: 16px;
    border: 1px solid #E6EAF0;
    background: #FFF;
    padding: 98px 20%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    text-align: center;
    margin-top: 12
    0px !important;
    margin: 30px;
}

.bp-generation-loader .simple-loader-title {
    color: #223245;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.bp-loader-progress {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    max-width: 360px;
}

.bp-loader-progress-bar {
    flex: 1;
    height: 11px;
    background: #F6F7F8;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    overflow: hidden;
}

.bp-loader-progress-fill {
    height: 100%;
    background: var(--Color-2, #0A58A5);
    border-radius: 20px;
    transition: width 0.4s ease;
}

.bp-loader-percentage {
    font-size: 14px;
    font-weight: 600;
    color: var(--Color-2, #0A58A5);
    min-width: 40px;
    font-family: "Open Sans", sans-serif;
}

.business-plan-step-title{
    color: var(--Color1, #223245);
    font-size: 16px;
    font-weight: 700;
    line-height: 14px;
}

/* Radio Group Styles */
.business-plan-radio-group {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-top: 30px;
}

.business-plan-radio-option {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 30px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    border-radius: 15px;
border: 1px solid var(--stroke-1, #DFE5EC);
}

.business-plan-radio-option input[type="radio"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: var(--Color-2, #0A58A5);
    margin-top: 2px;
    flex-shrink: 0;
    display: none;
}


.business-plan-radio-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
    justify-content: center;
    align-items: center;
}

.business-plan-radio-title{
    color: var(--Color1, #223245);
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 70% */
}

.business-plan-radio-description{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    margin-top: 10px;
    text-align: center;
}

/* Checkbox Group Styles */
.business-plan-checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 8px;
}

.business-plan-checkbox-option {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border: 2px solid var(--stroke-1, #DFE5EC);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    background-color: #FFFFFF;
    width: 100%;
}

.business-plan-checkbox-option:hover {
    border-color: var(--Color-2, #0A58A5);
    background-color: #F0F7FF;
}

.business-plan-checkbox-option input[type="checkbox"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: var(--Color-2, #0A58A5);
    margin-top: 2px;
    flex-shrink: 0;
}


.business-plan-checkbox-option input[type="checkbox"]:checked + .business-plan-checkbox-label {
    color: var(--Color-2, #0A58A5);
    font-weight: 600;
}

.business-plan-checkbox-option:has(input[type="checkbox"]:checked) {
    border-color: var(--Color-2, #0A58A5);
    background-color: #F0F7FF;
}

.business-plan-checkbox-label {
    font-size: 14px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    line-height: 1.5;
    display: block;
    margin-bottom: 4px;
}

.business-plan-checkbox-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.business-plan-field{
    width: 100%;
    margin: 0;
}

.business-plan-field-description, .business-plan-step-description, .business-plan-checkbox-description{
    color: var(--Color2, #6E7F93);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    margin: 15px 0;
}

.projects-page.business-plan-page {
    padding: 0 !important;
    height: calc(100vh - 200px);
}

section.business-plan-content, .business-plan-step {
    height: 100%;
}

.business-plan-nav-block{
    height: 100px;
    border-top: 1px solid var(--stroke-1, #DFE5EC);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
}

.business-plan-config-form {
    width: 100%;
}

.business-plan-field{
    margin: 0 auto;
}

.business-plan-nav-button.business-plan-nav-button-next{
    border-radius: 15px;
    background: var(--Color-2, #0A58A5);
    height: 44px;
    padding: 16px 40px ;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; 
}

.business-plan-nav-button.business-plan-nav-button-next:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
.bp-height{
    height: calc(100vh - 183px);
    width: 80%;
    margin: 0 auto;
    padding-top: 30px;
    overflow: scroll;
    padding-bottom: 30px;
}

.business-plan-radio-option:has(input:checked) {
    border-radius: 15px;
    border: 1px solid var(--Color-2, #0A58A5);
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 6%, transparent);
}

.business-plan-nav-button.business-plan-nav-button-previous{
    border-radius: 15px;
    background: #FFF;
    height: 44px;
    padding: 16px 40px ;
    border: 1px solid var(--stroke-1, #DFE5EC);
    display: flex;

    align-items: center;
    justify-content: center;
    gap: 30px;
    color: #6E7F93  ;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; 
}

.business-plan-field{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 15px;
}

.business-plan-field-label{
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--Color1, #223245);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px; /* 85.714% */
}

.business-plan-field-label span{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 87.5% */
}


form .business-plan-field-label{
    color: var(--Color1, #223245);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px; /* 85.714% */
}

.business-plan-input{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 44px;
    padding: 1rem;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 85.714% */
    color: #223245;
    resize: none;
    overflow: auto;
    width: 100%;
}

.business-plan-textarea{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 100px;
    padding: 1rem;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 23px; /* 85.714% */
    color: #223245;
    resize: none;
    overflow: auto;
    width: 100%;
}

.business-plan-team-member-card{
    margin-top: 30px;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 20px;
}

.business-plan-team-member-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.business-plan-step-description{
    margin-bottom: 30px;
}

.business-plan-team-member-title{
    color: var(--Color1, #223245);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 75% */
}

.business-plan-remove-member-button{
    border: none
}

.business-plan-add-member-button{
    width: 100%;
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 44px;
}

.business-plan-add-member-button span{
    color: var(--Color-2, #0A58A5);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 85.714% */
}

.business-plan-select{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 1rem;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 85.714% */
    color: #223245;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 16px;
}

.business-plan-document-upload{
    display: flex;
    flex-direction: column;
    gap: 10px;
}


.business-plan-document-upload {
    padding: 16px;
    background-color: #F8F9FA;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 8px;
    margin-top: 15px;
    margin-bottom: 30px;
}

.business-plan-file-input {
    width: 100%;
    padding: 8px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 4px;
    background-color: #FFFFFF;
    cursor: pointer;
    margin-top: 8px;
}

.business-plan-file-input:focus {
    outline: none;
    border-color: var(--Color-2, #0A58A5);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--Color-2, #0A58A5) 10%, transparent);
}

.business-plan-file-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}

.business-plan-file-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    width: fit-content;
    gap: 10px;
}

.business-plan-file-remove{
    border: none;
}

.business-plan-sections-nav{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.business-plan-sections-nav a{
    display: flex;
    align-items: center;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 12px;
    color: #6A7282;
    gap: 12px;
}

.business-plan-sections-nav a span{
    font-size: 14px;
}

.business-plan-sections-nav a.active{
    border-radius: 10px;
    border: 1px solid var(--Color-2, #0A58A5);
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 6%, transparent);
    color: var(--Color-2, #0A58A5);
}

.business-plan-section-number{
    background-color: #F6F7F8;
    width: 25px;
    height: 25px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.business-plan-sections-nav a.active .business-plan-section-number{
    background-color: var(--Color-2, #0A58A5);
    color: #fff;
}

.business-plan-cover-container{
    background-color: #fff;
}

.bp-page{
    width: 595px;
    margin: 0 auto;
    /* gr1 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 15px;
    background: #FFF;
    
}

.bp-scroll{
    min-height: 842px;
    padding: 50px;
}

.cover-page{
    background: var(--Color1, #223245);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 50px;
    height: 842px;
}

.cover-page .bp-cover-top{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}

.cover-page .bp-cover-logo{
    display: inline-flex;
    padding: 14px 18px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

.cover-page .bp-cover-logo img{
    max-width: 180px;
    max-height: 80px;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.cover-page .bp-title{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 10px; /* 50% */
}

.cover-page .cover-body{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cover-page .cover-body p{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 50px; /* 125% */
}

.cover-page .cover-body .cover-date{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 10px; /* 71.429% */
}

.cover-footer{
    display: flex;
    align-items: start;
    justify-content: space-between;
}

.cover-footer .cover-footer-left{
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.cover-footer .cover-footer-left div{
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cover-footer .cover-footer-left div span, .elite span{
    color: rgba(255, 255, 255, 0.30);
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 500;
    line-height: 10px; /* 111.111% */
}

.cover-footer .cover-footer-left div h2, .elite h2{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 10px; /* 83.333% */
}

.business-plan-container{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.bp-section-title{
    border-bottom: 2px solid var(--Color-2, #0A58A5);
    padding-bottom: 12px;
}

.bp-page h1{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 18px !important;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 50% */
}

.ordonned-list{
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    margin-left: 1rem;
}

.ordonned-list li{
    color: var(--Color0, #445972);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 85.714% */
    padding: 20px 0;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
}

.ordonned-list li:last-child{
    border-bottom: none;
}

.bp-disclaimer{
    border-radius: 10px;
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 6%, transparent);
    padding: 15px 17px;
    margin-top: 20px;
}

.bp-disclaimer h2{
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 100% */
}

.bp-disclaimer p{
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 160% */
    margin-top: 10px;
}

.bp-text-bloc{
    margin-bottom: 10px;
}

.bp-text-bloc h2{
    color: #99A1AF;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 18px; /* 150% */
text-transform: uppercase;
}

.evo-table{
    margin-top: 20px;
}

.od-table.rounded-table td,
.od-table.rounded-table th,
.evo-table.rounded-table td,
.evo-table.rounded-table th {
    border-left: none !important;
    border-right: none !important;
}

.bp-titre{
    border-left: 3px solid var(--Color-2, #0A58A5);
    padding-left: 10px;
    margin: 25px 0;
    position: relative;
    z-index: 1;
}

.bp-titre span,
.bp-titre input{
    color: #223245;
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 142.857% */
}

.vmv{
    display: flex;
    align-items: stretch;
    gap: 10px;
}


.vmv-card{
    padding: 14px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    width: 33%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.vmv-title{
    display: flex;
    align-items: center;
    gap: 5px;
}

.vmv-title .dot{
    width: 8px;
    height: 8px;
    border-radius: 100%;
}



.vmv-card span{
font-family: "Open Sans";
font-size: 11px;
font-style: normal;
font-weight: 700;
line-height: 16.5px; /* 150% */
}

.vmv-card.vision .vmv-title div{
    background: var(--Color-2, #0A58A5);
}
.vmv-card.mission .vmv-title div{
    background: #FF9900;
}
.vmv-card.valeur .vmv-title div{
    background: #4CAF50;
}

.vmv-card.vision span{
    color: var(--Color-2, #0A58A5);
}
.vmv-card.mission span{
    color: #FF9900;
}
.vmv-card.valeur span{
    color: #4CAF50;
}

.vmv-card p{
    color: #223245;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 160% */
}

.jalons{
    border-radius: 10px;
border: 1px solid var(--stroke-1, #DFE5EC);
padding: 17px;
display: flex;
flex-direction: column;
gap: 20px;
}

.jalon{
    display: flex;
    align-items: center;
    gap: 15px;
}

.jalon .jal{
    width: 16px;
    height: 16px;
    border-radius: 16777200px;
    border: 2px solid #B5C1D0;
    background: #FFF;
}

.jalon .jal.blue{
    border-color: var(--Color-2, #0A58A5);
}

.jalon .jal.green{
    border-color: #4CAF50;
}

.jalon .jal.orange{
    border-color: #FF9900;
}

.jalon span{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px; /* 150% */
}

.jalon h2{
    color: #223245;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px; /* 150% */
}

.bp-text-bloc p, .verdict p, .avantage p, .strategieproduit p, .risky p{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 166.667% */
}


.verdict{
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--Color-2, #0A58A5) 20%, transparent);
    border: 1px solid color-mix(in srgb, var(--Color-2, #0A58A5) 20%, transparent);
    background: var(--bp-tint, #F0F6FF);
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 6%, #fff);
    margin-bottom: 10px;
    padding: 20px;
}

.risky{
    border-radius: 10px;
border: 1px solid rgba(229, 62, 62, 0.20);
background: #FEF0F0;
margin-bottom: 10px;
    padding: 20px;
}

.strategieproduit{
    border-radius: 10px;
    border: 1px solid rgba(255, 152, 0, 0.20);
    background: #FFF8F0;
    margin-bottom: 10px;
    padding: 20px;
}

.avantage{
    border-radius: 10px;
    border: 1px solid rgba(76, 175, 80, 0.20);
    background: #F0FAF0;
    margin-bottom: 10px;
    padding: 20px;
}

.verdict h2{
    color: var(--Color-2, #0A58A5);
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 163.636% */
}

.risky h2{
    color: #C62828;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
text-transform: uppercase;
}

.avantage h2{
    color: #2E7D32;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 163.636% */
}

.strategieproduit h2{
    color: #E65100;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
text-transform: uppercase;
}

.bp-content{
    margin-top: 1rem;
}

.resume-cards{
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 10px;
}

.resume-cards .card{
    position: relative;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    justify-content: space-between;
}

h2.subtitle{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 133.333% */
    text-transform: capitalize;
}

.resume-cards .card h2{
    color: #6A7282;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    line-height: 16px; /* 160% */
    text-transform: lowercase;
}

.resume-cards .card h1{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 125% */
}

.rounded-table {
    /* Key properties for rounding the outer border */
    border-collapse: separate; /* Required for border-radius to work */
    border-spacing: 0;         /* Removes space between cells to avoid double borders */
    border-radius: 10px;       /* Rounds the outer corners of the entire table */
    border: .6px solid var(--stroke-1, #DFE5EC);   /* Adds a single outer border */
    overflow: hidden;          /* Clips internal cell backgrounds to the rounded shape */
    width: 100%;
}

.rounded-table th, .rounded-table td {
    /* Internal borders and padding for cells */
    border: .6px solid var(--stroke-1, #DFE5EC);
    border-left: none;
    border-right: none;
    padding: 10px;
    text-align: left;
    font-size: 12px;
  }
  
  .rounded-table th {
    background-color: var(--bp-stroke-soft, #dfe5ec82); /* Optional: style for header cells */
  }

  .rounded-table tr td:first-child{
    color: #223245;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 16.5px; /* 150% */
  }

  .rounded-table tr td:last-child{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px; /* 150% */
  }

  .rounded-table tr td{
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 16.5px; /* 150% */
  }

.points-cles-table .rounded-table td,
.signal-table .rounded-table td {
    border-left: none !important;
    border-right: none !important;
}

.points-cles-table .rounded-table th {
    border-left: none !important;
    border-right: none !important;
}

.points-cles-table .rounded-table thead th {
    background: #F6F7F8;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px;
    text-transform: uppercase;
}

.resume-cards .card span{
    color: #99A1AF;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: italic;
    font-weight: 400;
    line-height: 15px; /* 166.667% */
}

/* ── Bar Chart (vertical) ── */
.bp-competitive-chart-wrapper{
    margin-top: 12px;
    border-radius: 10px;
    border: 1px solid #E5E7EB;
    background: #F6F7F8;
    padding: 15px;
}

.bp-competitive-chart-wrapper canvas{
    width: 100% !important;
}

.bp-bar-chart{
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bp-bar-chart-legend{
    display: flex;
    align-items: center;
    gap: 16px;
    justify-content: center;
}

.bp-legend-item{
    display: flex;
    align-items: center;
    gap: 5px;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 500;
    color: #6A7282;
}

.bp-legend-dot{
    width: 10px;
    height: 10px;
    border-radius: 3px;
    display: inline-block;
}

.bp-legend-nous{ background: #8EC5FF; }
.bp-legend-concurrent{ background: #BFDBFE; }

.bp-bar-groups{
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 30px;
    height: 180px;
    padding: 0 10px;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
}

.bp-bar-group{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    flex: 1;
    height: 100%;
}

.bp-bars{
    display: flex;
    align-items: flex-end;
    gap: 5px;
    flex: 1;
    width: 100%;
    justify-content: center;
}

.bp-bar{
    width: 28px;
    border-radius: 4px 4px 0 0;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 5px;
    transition: height 0.4s ease;
}

.bp-bar span{
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 700;
    color: #fff;
}

.bp-bar-label{
    color: #6B7280;
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding-bottom: 10px;
}

.bp-bar-nous{ background: #8EC5FF; }
.bp-bar-concurrent{ background: #BFDBFE; }

/* ── Pie Chart ── */
.bp-pie-chart-wrapper{
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 12px;
}

.bp-pie-chart{
    width: 150px;
    height: 150px;
    border-radius: 50%;
    position: relative;
    flex-shrink: 0;
}

.bp-pie-hole{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: #fff;
}

.bp-pie-legend{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bp-pie-legend-item{
    display: flex;
    align-items: center;
    gap: 8px;
}

.bp-pie-dot{
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.bp-pie-legend-label, .bp-pie-legend-value{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 34px; /* 242.857% */
}

/* ===== Diagramme en barres horizontales ===== */
.bp-hbar-chart {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 10px 0;
}

.bp-hbar-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.bp-hbar-label {
    color: #6E7F93;
text-align: right;
font-family: "Open Sans";
font-size: 10px !important;
font-style: normal;
font-weight: 400;
line-height: 15px; /* 150% */
    width: 90px;
    min-width: 90px;
    flex-shrink: 0;
}

.canal-dis{
    color: #B5C1D0;
font-family: "Open Sans";
font-size: 9px;
font-style: italic;
font-weight: 400;
line-height: 13.5px; /* 150% */
}

.seg-table table tr td{
    color: #6E7F93;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 400;
line-height: 15px; /* 150% */
border-left: none !important;
border-right: none !important;
}

.strat-seg{
    color: var(--Color-2, #0A58A5) !important;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 600 !important;
line-height: 15px; /* 150% */
}

.vol span{
    border-radius: 16777200px;
background: var(--bp-tint, #F0F6FF);
padding: 2px 6px;
color: var(--Color-2, #0A58A5);
font-family: "Open Sans";
font-size: 9px;
font-style: normal;
font-weight: 600;
line-height: 13.5px; /* 150% */
}

.margvol span{
    background: #F3E8FF;
    color: #7B1FA2;
}

.distri span{
    color: #E65100;
    background: #FFF8F0;
}

.marg span{
    color: #2E7D32;
    background: #F0FAF0;
}

.vis span{
    color: #7B1FA2;
    background: #F3E8FF;
}

.actions-table tr td{
    color: #6E7F93;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 400;
line-height: 15px; /* 150% */
border-left: none !important;
border-right: none !important;
}

.actions-table tr td:first-child{
    color: var(--Color-2, #0A58A5) !important;
    font-weight: 700 !important;
}

td.action{
    font-weight: 400 !important;
    color: #223245 !important;
}

.actions-table tr td:last-child{
    color: #223245 !important;
    font-weight: 600 !important;
}

.bp-processes{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.bp-process{
    display: flex;
    justify-content: space-between;
}

.bp-process h4{
    color: #B5C1D0;
font-family: "Open Sans";
font-size: 8px;
font-style: normal;
font-weight: 600;
line-height: 12px; /* 150% */
}

.trey{
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 16.5px;
}

.invest-table .four{
    color: #6E7F93 !important;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400 !important;
    line-height: 15px; /* 150% */
}

.invest-table td:last-child span{
    border-radius: 16777200px;
    background: #F6F7F8;
    padding: 2px 6px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 600;
    line-height: 13.5px; /* 150% */
}

span.imm{
    color: #2E7D32 !important;
font-family: "Open Sans";
font-size: 9px;
font-style: normal;
font-weight: 600 !important;
line-height: 13.5px; /* 150% */
padding: 2px 6px;

border-radius: 16777200px;
background: #F0FAF0 !important;

}

.invest-table tr td{
    border-left: none !important;
    border-right: none !important;
}

.invest-table tr:last-child{
    background: var(--bp-tint, #F0F6FF);
}

.invest-table tr:last-child td{
    border-top: 2px solid var(--Color-2, #0A58A5);
}

.invest-table tr:last-child td:last-child{
    color: var(--Color-2, #0A58A5) !important;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

/* Tableau investissements initiaux */
.investin-table {
    margin-top: 15px;
}

.investin-table .rounded-table td {
    border-left: none !important;
    border-right: none !important;
}

.investin-table .rounded-table th {
    border-left: none !important;
    border-right: none !important;
}

.investin-montant {
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px;
    white-space: nowrap;
}

.investin-bar-track {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.investin-bar-track > div {
    flex: 1;
    height: 8px;
    background: #E8EDF2;
    border-radius: 4px;
    overflow: hidden;
}

.investin-bar-fill {
    height: 100%;
    background: var(--Color-2, #0A58A5);
    border-radius: 4px;
}

.investin-bar-pct {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    white-space: nowrap;
    min-width: 35px;
    text-align: right;
}

.investin-table .rounded-table tfoot tr {
    background: var(--bp-tint, #F0F6FF);
}

.investin-table .rounded-table tfoot td {
    border-top: 2px solid var(--Color-2, #0A58A5);
    border-left: none !important;
    border-right: none !important;
    color: var(--Color-2, #0A58A5);
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 800;
line-height: 15px; /* 150% */
}

/* Diagramme projections financières */
.projfin-chart-container {
    margin-top: 15px;
}

.projfin-chart {
    width: 100%;
    max-height: 370px;
}

.projfin-axis-label {
    fill: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    text-anchor: end;
}

.projfin-axis-label-right {
    fill: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    text-anchor: start;
}

.projfin-axis-unit {
    fill: #6E7F93;
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 600;
    text-anchor: start;
}

.projfin-axis-year {
    fill: #223245;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    text-anchor: middle;
}

.projfin-val-blue {
    fill: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700;
    text-anchor: middle;
}

.projfin-val-green {
    fill: #2ECC71;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700;
    text-anchor: middle;
}

.projfin-val-orange {
    fill: #F39C12;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700;
    text-anchor: middle;
}

.projfin-legend {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 10px;
    flex-wrap: wrap;
}

.projfin-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.projfin-legend-bar {
    width: 16px;
    height: 10px;
    border-radius: 2px;
    display: inline-block;
}

.projfin-legend-line {
    width: 20px;
    height: 3px;
    border-radius: 2px;
    display: inline-block;
}

.projfin-legend-line-dashed {
    width: 20px;
    height: 0;
    border-top: 3px dashed #F39C12;
    display: inline-block;
}

.projfin-legend-label {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
}

/* Diagramme trésorerie mensuelle */
.treso-chart-container {
    margin-top: 15px;
}

.treso-chart {
    width: 100%;
    max-height: 380px;
}

.treso-axis-label {
    fill: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    text-anchor: end;
}

.treso-axis-unit {
    fill: #6E7F93;
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 600;
    text-anchor: start;
}

.treso-axis-month {
    fill: #223245;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    text-anchor: middle;
}

/* Matrice probabilité / impact */
.risk-matrix {
    margin-top: 15px;
}

.matrix-wrapper {
    display: flex;
    align-items: center;
}

.matrix-axis-left {
    writing-mode: vertical-lr;
    transform: rotate(180deg);
    color: #B5C1D0;
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 600;
    text-align: center;
    padding-right: 8px;
}

.matrix-axis-bottom {
    color: #B5C1D0;
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 600;
    text-align: center;
    padding-top: 6px;
}

.matrix-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 4px;
    table-layout: fixed;
}

.matrix-table td {
    width: 20%;
    border: none !important;
    text-align: center;
}

.matrix-table th {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    text-align: center;
    padding: 8px 4px;
}

.matrix-risk {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    color: #FFFFFF;
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 700;
    margin: 0 1px;
}

.matrix-risk.risk-low {
    background: #4CAF50;
}

.matrix-risk.risk-moderate {
    background: #FFB347;
}

.matrix-risk.risk-medium {
    background: #FF9900;
}

.matrix-risk.risk-high {
    background: #E53E3E;
}

.concu-table table tr td:nth-child(2) {
    color: #223245;
    font-family: "Open Sans";
    font-size: 9px !important;
    font-style: normal;
    font-weight: 600;
    line-height: 13.5px;
}

.concu-table table tr td:last-child {
    color: #6E7F93 !important;
    font-family: "Open Sans" !important;
    font-size: 9px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 14px !important;
}

.risk-category {
    border-radius: 4px;
    background: #F6F7F8;
    padding: 2px 4px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 7px;
    font-style: normal;
    font-weight: 400;
    line-height: 10.5px;
}

.concu-table table thead th {
    border-left: none !important;
    border-right: none !important;
}

.concu-table table tfoot tr.contingence-total td {
    border-top: 2px solid var(--Color-2, #0A58A5) !important;
    background: var(--bp-tint, #F0F6FF) !important;
    border-left: none !important;
    border-right: none !important;
}

.concu-table table tfoot tr.contingence-total td.contingence-montant,
.concu-table .rounded-table tr td.contingence-montant,
td.contingence-montant {
    color: var(--Color-2, #0A58A5) !important;
    font-family: "Open Sans" !important;
    font-size: 10px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 15px !important;
}

/* Scénarios de stress */
.scenario-cards {
    display: flex;
    gap: 12px;
}

.scenario-card {
    flex: 1;
    border: 1px solid #E8EDF2;
    border-radius: 8px;
    padding: 14px;
    background: #FFFFFF;
}

.scenario-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.scenario-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}

.scenario-title {
    color: #223245;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
}

.scenario-body p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 8px !important;
    font-weight: 400;
    line-height: 12px;
    margin: 0 0 10px;
}

.scenario-metrics {
    border-top: 1px solid #E8EDF2;
    padding-top: 8px;
}

.scenario-metric {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 3px 0;
}

.scenario-metric-label {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 8px;
    font-weight: 400;
}

.scenario-metric-value {
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
}

.matrix-label {
    color: #223245;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    text-align: right !important;
    padding-right: 10px !important;
    white-space: nowrap;
}

.matrix-green {
    background: #F0FAF0;
    height: 45px;
    border-radius: 4px;
}

.matrix-white {
    background: #FEF5F0;
    height: 45px;
    border-radius: 4px;
}

.matrix-orange {
    background: #FFF8F0;
    height: 45px;
    border-radius: 4px;
}

.matrix-red {
    background: #FEF0F0;
    height: 45px;
    border-radius: 4px;
}

.matrix-footer-label {
    color: #B5C1D0;
    font-family: "Open Sans";
    font-size: 7px;
    font-style: normal;
    font-weight: 400;
    line-height: 10.5px; /* 150% */
    text-align: center;
    border: none !important;
}

/* Bilan prévisionnel */
.bilan-table .rounded-table td {
    border-left: none !important;
    border-right: none !important;
}

.bilan-table .rounded-table th {
    border-left: none !important;
    border-right: none !important;
}

.bilan-table .rounded-table tbody td {
    color: #6E7F93 !important;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400 !important;
    line-height: 15px;
}

.bilan-table .rounded-table tbody td:first-child {
    text-align: left;
    color: #223245 !important;
}

.bilan-table .rounded-table tfoot td {
    color: var(--Color-2, #0A58A5) !important;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700 !important;
    line-height: 15px;
    border: none !important;
}

.bilan-table .rounded-table tfoot td:first-child {
    text-align: left;
}

.bilan-table .rounded-table tfoot tr {
    background: var(--bp-tint, #F0F6FF);
}

.bilan-total-row {
    background: var(--bp-tint, #F0F6FF);
}

.bilan-table .rounded-table .bilan-total-row td,
.bilan-table .rounded-table .bilan-total-row td:first-child,
.bilan-table .rounded-table .bilan-total-row td:last-child {
    color: var(--Color-2, #0A58A5) !important;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 15px;
    border: none !important;
}

.bgreen{
    color: #4CAF50 !important;
font-family: "Open Sans";
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 125% */
}

.bilan-table .rounded-table .bilan-total-row td:first-child {
    text-align: left;
}

/* Indicateurs financiers */
.indic-table .rounded-table td {
    border-left: none !important;
    border-right: none !important;
}

.indic-table .rounded-table th {
    border-left: none !important;
    border-right: none !important;
}

.indic-table .rounded-table tbody td {
    color: var(--Color-2, #0A58A5) !important;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 15px;
}

.indic-table .rounded-table tbody td:first-child {
    text-align: left;
    color: #223245 !important;
}

/* Compte de résultat prévisionnel */
.compte-resultat-table .rounded-table td {
    border-left: none !important;
    border-right: none !important;
}

.compte-resultat-table .rounded-table th {
    border-left: none !important;
    border-right: none !important;
}

.cr-row-ca {
    background: #FAFBFC;
}

.cr-row-ca td {
    color: var(--Color-2, #0A58A5);
    text-align: right;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px;
}

.cr-row-ca td:first-child {
    text-align: left;
    color: var(--Color-2, #0A58A5) !important;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 15px;
}

.cr-row-ca td:last-child {
    color: var(--Color-2, #0A58A5) !important;
    font-weight: 700 !important;
}

.cr-row-std td {
    text-align: right;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 15px;
}

.cr-row-std td:first-child {
    text-align: left;
    color: #223245 !important;
}

.cr-row-std td:last-child {
    font-weight: 600 !important;
}

.cr-row-mb {
    background: #FAFBFC;
}

.cr-row-mb td {
    color: #223245 !important;
    text-align: right;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 15px;
}

.cr-row-mb td:first-child {
    text-align: left;
}

.cr-row-rex {
    background: #FAFBFC;
}

.cr-row-rex td {
    color: #4CAF50 !important;
    text-align: right;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 15px;
}

.cr-row-rex td:first-child {
    text-align: left;
}

.cr-neg {
    color: #E74C3C !important;
}

.cr-pos {
    color: #2ECC71 !important;
}

.cr-zero {
    color: #223245 !important;
}

.bp-process .process-title{
    display: flex;
    align-items: center;
    gap: 10px;
}

.process-title span{
    border-radius: 16777200px;
    background: var(--Color-2, #0A58A5);
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    line-height: 13.5px; /* 150% */
}

.finplans{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}

.finplan{
    border-radius: 10px;
border: 1px solid var(--stroke-1, #DFE5EC);
padding: 15px;
position: relative;
}

.finplan-title{
    display: flex;
    align-items: center;
    gap: 10px;
}

.finplan-title div{
    width: 8px;
height: 8px;
border-radius: 16777200px;
background: var(--Color-2, #0A58A5);
}

.finplan-title h4{
    color: #223245;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

.finplan h5{
    color: var(--Color-2, #0A58A5);
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 800;
line-height: 21px; /* 150% */
margin-top: 6px;
}

.finplan-foot{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
}

.finplan-black{
    background: #223245 !important;
}

.finplan-green{
    background: #4CAF50 !important;
}

.finplan-orange{
    background: #F90 !important;
}


.finplan-foot span{
    border-radius: 16777200px;
background: #F6F7F8;
padding: 2px 6px;
color: #6E7F93;
font-family: "Open Sans";
font-size: 9px;
font-style: normal;
font-weight: 400;
line-height: 13.5px; /* 150% */
}

.finplan-foot h6{
    color: #B5C1D0;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700;
line-height: 15px; /* 150% */
}

.process-title h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 16.5px; /* 150% */
}

.bp-process p{
    margin-top: 6px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 9px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 14px; /* 155.556% */
    margin-left: 23px;
}

.bp-hbar-track {
    flex: 1;
    height: 28px;
    background: transparent;
    border-radius: 6px;
    overflow: hidden;
}

.bp-hbar-fill {
    height: 100%;
    border-radius: 6px;
    transition: width 0.5s ease;
}

.bp-hbar-fill-1 {
    background: #BFDBFE;
}

.bp-hbar-fill-2 {
    background: #8EC5FF;
}

.bp-hbar-fill-3 {
    background: var(--Color-2, #0A58A5);
}

.bp-hbar-value {
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--Color-2, #0A58A5);
    min-width: 160px;
    text-align: right;
}

/* ===== Diagramme de Gantt ===== */
.bp-gantt {
    width: 100%;
    overflow-x: auto;
}

.bp-gantt-header,
.bp-gantt-row {
    display: flex;
    align-items: center;
    gap: 0;
}

.bp-gantt-header {
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    padding-bottom: 8px;
    margin-bottom: 4px;
}

.bp-gantt-task-label {
    min-width: 160px;
    max-width: 160px;
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: #223245;
    padding: 8px 12px 8px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.module-page[data-business-plan-mode-value="edit"] .bp-gantt-task-label {
    min-width: 240px;
    max-width: 240px;
    overflow: visible;
    display: flex;
    align-items: center;
    font-size: 14px;
}

.bp-gantt-header .bp-gantt-task-label {
    font-weight: 400;
    color: transparent;
}

.bp-gantt-months {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 2px;
    position: relative;
    min-height: 28px;
    align-items: center;
}

.bp-gantt-header .bp-gantt-months {
    min-height: auto;
}

.bp-gantt-header .bp-gantt-months span {
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 600;
    color: #6E7F93;
    text-align: center;
}

.bp-gantt-row {
    border-bottom: 1px solid #F1F5F9;
}

.bp-gantt-row:last-child {
    border-bottom: none;
}

.bp-gantt-bar {
    height: 24px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
}

.bp-gantt-bar-dates {
    font-family: "Open Sans", sans-serif;
    font-size: 9px;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 0 4px;
    line-height: 24px;
}

.bp-gantt-bar-1 {
    background: var(--Color-2, #0A58A5);
}

.bp-gantt-bar-2 {
    background: #8EC5FF;
}

.bp-gantt-bar-2 .bp-gantt-bar-dates {
    color: #223245;
}

.bp-gantt-bar-3 {
    background: #BFDBFE;
}

.bp-gantt-bar-3 .bp-gantt-bar-dates {
    color: #223245;
}

/* ===== Graphique en ligne (Trajectoire) ===== */
.bp-line-chart {
    display: flex;
    gap: 8px;
    padding: 10px 0;
}

.bp-line-chart-y-axis {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 40px;
    text-align: right;
    padding-right: 8px;
}

.bp-line-chart-y-axis span {
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    color: #6E7F93;
    line-height: 1;
}

.bp-line-chart-area {
    flex: 1;
    position: relative;
    height: 220px;
}

.bp-line-chart-grid {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.bp-line-chart-grid-line {
    height: 1px;
    background: #F1F5F9;
}

.bp-line-chart-zero {
    background: var(--stroke-1, #DFE5EC);
}

.bp-line-chart-svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 30px);
}

.bp-line-nous {
    fill: none;
    stroke: var(--Color-2, #0A58A5);
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bp-line-c1 {
    fill: none;
    stroke: #2D7DD2;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bp-line-c2 {
    fill: none;
    stroke: #8EC5FF;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bp-line-c3 {
    fill: none;
    stroke: #BFDBFE;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bp-line-chart-dots {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 30px);
}

.bp-line-dot {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transform: translate(-50%, 50%);
}

.bp-line-dots-nous .bp-line-dot {
    background: var(--Color-2, #0A58A5);
}

.bp-line-dots-concurrents .bp-line-dot {
    background: #BFDBFE;
}

.bp-line-dot span {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    font-family: "Open Sans", sans-serif;
    font-size: 10px;
    font-weight: 600;
    color: #223245;
    white-space: nowrap;
}

.bp-line-chart-x-axis {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    height: 30px;
    align-items: flex-end;
}

.bp-line-chart-x-axis span {
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 600;
    color: #6E7F93;
}

.bp-line-legend {
    display: flex;
    gap: 20px;
    justify-content: center;
    padding-top: 8px;
}

.bp-line-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.bp-line-legend-line {
    width: 20px;
    height: 3px;
    border-radius: 2px;
}

.bp-line-legend-item span {
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    color: #445972;
}

/* ===== Indicateurs Clés du Marché (pie + table) ===== */
.bp-market-indicators {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 30px;
    padding: 10px 0;
}

.bp-market-pie {
    position: relative;
    flex-shrink: 0;
}

.bp-market-pie .bp-pie-chart {
    width: 160px;
    height: 160px;
}

.bp-market-pie .bp-pie-hole {
    width: 80px;
    height: 80px;
}

.bp-market-table {
    flex: 1;
    overflow-x: auto;
}

.bp-market-table .bp-pie-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin: 0 auto;
}

.bp-empty-content{
    color: #99A1AF;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    line-height: 20px;
    padding: 12px 0;
}

.bp-table{
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    font-family: "Open Sans";
    font-size: 12px;
}

.bp-table thead th{
    padding: 10px 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    color: var(--Color-3, #B5C1D0);
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.312px;
}

.bp-table thead th:first-child{
    border-radius: 6px 0 0 0;
}

.bp-table thead th:last-child{
    border-radius: 0 6px 0 0;
}

.bp-table tbody td{
    padding: 8px 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    color: var(--Color1, #223245);
    font-weight: 400;
}

.table-responsive{
    overflow-x: auto;
}

.bp-text-bloc ul{
    display: flex;
    flex-direction: column;
    gap: 10px;
    list-style-type: none;
}

.bp-text-bloc ul li{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.bp-text-bloc ul li span{
    font-weight: 700;
}

.bp-teams{
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}

.bp-team{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
}

.bp-team-photo{
    background: linear-gradient(135deg, var(--Color-2, #0A58A5) 0%, #42A5F5 100%);
    height: 46px;
    width: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px; /* 150% */
    border-radius: 100%;
}

.bp-team h3{
    color: #223245;
    text-align: center;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 127.273% */
    margin-top: 3px;
    text-align: center;
}

.bp-team span{
    color: var(--Color-2, #0A58A5);
text-align: center;
font-family: "Open Sans";
font-size: 9px;
font-style: normal;
font-weight: 600;
line-height: 12px; /* 133.333% */
text-align: center;
margin-top: 3px;
}

.bp-team p{
    text-align: center;
    margin-top: 7px;
    color: #6E7F93 !important;
    text-align: center;
    font-family: "Open Sans";
    font-size: 9px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 14px; /* 155.556% */
}

.bp-team-suggested{
    border-style: dashed !important;
    border-color: #B5C1D0 !important;
    background: #FAFBFC;
}

.bp-team-badge-suggested{
    color: #6E7F93 !important;
    background: #F0F2F5;
    border-radius: 100px;
    padding: 2px 8px;
    font-size: 8px !important;
    font-weight: 600;
}

.bp-organigram{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.bp-organigram .line{
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}

.enposte span{
    color: #2E7D32;
font-family: "Open Sans";
font-size: 9px;
font-style: normal;
font-weight: 600;
line-height: 13.5px; /* 150% */
border-radius: 16777200px;
background: #F0FAF0;
padding: 2px 6px;
}

.recrutement span{
    background: var(--bp-tint, #F0F6FF);
    color: var(--Color-2, #0A58A5);
}

.planifie span{
    color: #6E7F93;
    background: #F6F7F8;
}

.massaltot{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
    border-top: 1px solid var(--stroke-1, #DFE5EC);
    padding-top: 10px;

}

.massaltot span{
    color: #6E7F93;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 600;
line-height: 15px; /* 150% */
}

.massaltot h4{
    color: var(--Color-2, #0A58A5);
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 800;
line-height: 18px; /* 150% */
}

.radar-legend{
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
    justify-content: center;
    padding: 10px 0 5px;
}

.radar-legend-item{
    display: flex;
    align-items: center;
    gap: 6px;
}

.radar-legend-dot{
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.radar-legend-label{
    font-family: "Open Sans", sans-serif;
    font-size: 10px;
    font-weight: 500;
    color: #223245;
    line-height: 14px;
}

.radar-scores-table {
    margin-top: 15px;
}

.radar-scores-table td,
.radar-scores-table th {
    border-left: none !important;
    border-right: none !important;
}

.radar-scores-table thead th {
    background: #F6F7F8;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    text-transform: uppercase;
}

.radar-scores-table tbody td {
    font-family: "Open Sans";
    font-size: 11px;
    color: var(--Color-2, #0A58A5);
    font-weight: 700;
}

.radar-scores-table tbody td:first-child {
    color: #223245;
    font-weight: 600;
}

.org-line{
    width: 2px;
height: 12px;
background: var(--stroke-1, #DFE5EC);

}

.bp-organigram .line .organigram{
    border-radius: 8px;
    border: 1px solid var(--Color-2, #0A58A5);
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 1px;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.bp-organigram .line .organigram h4{
    color: #223245;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

.bp-organigram .line .organigram span{
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 8px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 150% */
}

.bp-team-infos{
    width: 40%;
    border-right: 1px solid var(--stroke-1, #DFE5EC);
    padding-right: 15px;
    display: flex;
    align-items: start;
    gap: 10px;
}

.bp-team-infos h1{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 116.667% */
}

.bp-team-infos span{
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 120% */
    margin-top: 5px;
}

.tamsamsom{
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 20px;
}

.tamsamsom .left, .tamsamsom .right{
    width: 50%;
}

.tamsamsom .tam{
    height: 190px;
    background-color: #E0F2FE;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 190px;
    border: 1px solid #B5C1D0;
}

.tamsamsom .sam{
    width: 124px;
    background-color: #B5C1D0;
    height: 124px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tamsamsom .som{
    width: 67.2px;
    height: 67.2px;
    background-color: #445972;
    border-radius: 100%;
}

.bp-segs{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bp-seg{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.bp-seg h2{
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 155.556% */
}

.bp-seg h1{
    -webkit-text-stroke-width: 0.5px;
    -webkit-text-stroke-color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 80% */
    background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.bp-seg p{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 8px;
    font-style: normal;
    font-weight: 500;
    line-height: 14px; /* 175% */
}

.bp-table{
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
}

.bp-table table{
    border-collapse: collapse;
}

.bp-table-title{
    color: var(--Color-3, #B5C1D0);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 133.333% */
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-bottom: none;
    background: #F6F7F8;
    padding: 10px 15px;
}

.bp-table table tr td{
    color: var(--Color-3, #B5C1D0);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.312px;
}

.nd{
    margin-top: 10px;
}

.bp-text-bloc p span{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}

.bp-swot-disclaimer{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 11px;
    font-style: italic;
    font-weight: 400;
    line-height: 18px; /* 163.636% */
    border-radius: 10px;
    background: #F6F7F8;
    padding: 18px 30px;
    margin: 10px 0;
}

.swot-item-text{
    color: var(--Color1, #223245) !important;
    font-family: "Open Sans";
    font-size: 12px !important;
    font-style: normal;
    font-weight: 400 !important;
    line-height: 18px; /* 150% */
}

.bp-text-bloc .swot-list{
    list-style-type: disc !important;
    padding-left: 10px !important;
    margin-left: 0 !important;
}
.bp-text-bloc .swot-item{
    list-style-type: disc !important;
    display: list-item !important;
}

.bp-text-bloc .swot-item[data-swot-index] {
    display: flex !important;
    align-items: flex-start;
}

.bp-text-bloc .swot-item[data-swot-index]::before {
    content: '•';
    flex-shrink: 0;
    margin-right: 6px;
    font-size: 16px;
    line-height: 18px;
}

.bp-swot-actions {
    display: inline-flex;
    margin-left: auto;
    flex-shrink: 0;
}
.bp-text-bloc .strengths-column .swot-item::marker{ color: #59B224; }
.bp-text-bloc .weaknesses-column .swot-item::marker{ color: #F54900; }
.bp-text-bloc .opportunities-column .swot-item::marker{ color: var(--Color-2, #0A58A5); }
.bp-text-bloc .threats-column .swot-item::marker{ color: #FF9900; }
.bp-text-bloc .strengths-column .swot-item[data-swot-index]::before { color: #59B224; }
.bp-text-bloc .weaknesses-column .swot-item[data-swot-index]::before { color: #F54900; }
.bp-text-bloc .opportunities-column .swot-item[data-swot-index]::before { color: var(--Color-2, #0A58A5); }
.bp-text-bloc .threats-column .swot-item[data-swot-index]::before { color: #FF9900; }

.catalogues{
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.catalogue{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 14px;
    display: flex;
    align-items: start;
    gap: 15px;
}

.cat-initials{
    height: 60px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 8%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: 21px; /* 150% */
    width: 60px;
}

.catalogue-content{
    display: flex;
    align-items: center;
    gap: 10px;
}

.cat-title{
    color: #223245;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 150% */
}

.catalog p {
    margin: 10px 0;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 15px; /* 150% */
}

.business-plan-form-grid{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cat-meta{
    display: flex;
    align-items: center;
    gap: 40px;
}

.cat-meta div{
    color: #B5C1D0;
font-family: "Open Sans";
font-size: 9px;
font-style: normal;
font-weight: 400;
line-height: 13.5px; /* 150% */
}

.cat-meta div span{
    color: var(--Color-2, #0A58A5);
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700;
line-height: 15px; /* 150% */
}

span.pour{
    color: #4CAF50 !important;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700;
line-height: 15px; /* 150% */
}

.tarif-details table  tr td{
    color: #6E7F93;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 400;
line-height: 15px; /* 150% */
}

.prixu{
    color: var(--Color-2, #0A58A5) !important;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700 !important;
line-height: 15px; /* 150% */
}

.marge{
    color: #4CAF50 !important;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700 !important;
line-height: 15px; /* 150% */
}

h1.orange-text{
    color: #F90 !important;
font-family: "Open Sans";
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 125% */
}

.catalogue-content span{
    border-radius: 16777200px;
    background: #F6F7F8;
    padding: 2.5px 6.117px 1.5px 6px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 8px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 150% */
}

/* Catalogue produits - position relative pour les boutons d'action */
.catalogue {
    position: relative;
}

.catalogue .bp-card-actions {
    position: absolute;
    top: 8px;
    right: 8px;
}

/* Formulaire d'édition inline catalogue */
.catalogue-editing {
    border: 2px solid var(--Color-2, #0A58A5) !important;
    background: #FAFBFC;
    padding: 16px !important;
    flex-direction: column !important;
}

.catalogue-edit-form {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.catalogue-edit-row {
    display: flex;
    gap: 10px;
}

.catalogue-edit-field {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.catalogue-edit-field label {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    line-height: 14px;
}

.catalogue-edit-field input,
.catalogue-edit-field textarea {
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 6px;
    padding: 6px 10px;
    font-family: "Open Sans";
    font-size: 11px;
    color: #223245;
    background: white;
    outline: none;
    transition: border-color 0.2s;
}

.catalogue-edit-field input:focus,
.catalogue-edit-field textarea:focus {
    border-color: var(--Color-2, #0A58A5);
}

.catalogue-edit-field textarea {
    resize: vertical;
    min-height: 40px;
}

.catalogue-edit-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
}

.bp-product{
    margin-top: 10px;
    display: flex;
    gap: 15px;
    align-items: stretch;
}

.bp-product img{
    width: 50%;
    height: 140px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
}

.bp-product-text{
    width: 50%;
    display: flex;
    flex-direction: column;
}

.bp-product-text h3{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 166.667% */
}

.bp-product-text span{
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}

.bp-details{
    display: flex;
    align-items: start;
    gap: 15px;
    margin-top: 15px;
}

.bp-detail{
    width: 33%;
}

.bp-detail .bp-product-text{
    width: 100%;
}

.bp-text-bloc ol{
    margin-left: 1rem;
}

.bp-equipes{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    margin-top: 10px;
}

.bp-equipe{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 13px 15px;
}

.bp-ekip-header{
    display: flex;
    align-items: center;
    gap: 10px;
}

.bp-ekip-header h4{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 116.667% */
}

.bp-ekip-header span{
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 120% */
}

.bp-ekip-initials{
    background-color: var(--Color-2, #0A58A5);
    width: 35px;
    height: 35px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    flex-shrink: 0;
}

.bp-team-avatar,
.bp-ekip-avatar{
    width: 35px;
    height: 35px;
    border-radius: 100%;
    object-fit: cover;
    flex-shrink: 0;
}

.bp-member-photo-upload{
    width: 80px;
    height: 80px;
    border-radius: 100%;
    border: 2px dashed var(--stroke-1, #DFE5EC);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.2s;
    margin: 0 auto;
}

.bp-member-photo-upload:hover{
    border-color: var(--Color-2, #0A58A5);
}

.bp-member-photo-preview{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.bp-member-photo-preview img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 100%;
}

.bp-member-photo-remove{
    position: absolute;
    top: -2px;
    right: -2px;
    width: 22px;
    height: 22px;
    border-radius: 100%;
    background: #EF4444;
    color: white;
    border: 2px solid white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    z-index: 2;
}

.bp-member-photo-remove:hover{
    background: #DC2626;
}

.bp-member-photo-placeholder{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: #9CA3AF;
}

.bp-member-photo-placeholder svg{
    color: #9CA3AF;
}

.bp-member-photo-placeholder span{
    font-size: 8px;
    text-align: center;
    line-height: 1.2;
}

/* ── Modal Image Upload (Produits) ── */
.bp-modal-image-upload{
    width: 100%;
    height: 120px;
    border-radius: 10px;
    border: 2px dashed var(--stroke-1, #DFE5EC);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.2s;
    background: #F9FAFB;
}

.bp-modal-image-upload:hover{
    border-color: var(--Color-2, #0A58A5);
}

.bp-modal-image-preview{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.bp-modal-image-preview img{
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 8px;
}

.bp-modal-image-remove{
    position: absolute;
    top: 6px;
    right: 6px;
    width: 24px;
    height: 24px;
    border-radius: 100%;
    background: #EF4444;
    color: white;
    border: 2px solid white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    z-index: 2;
}

.bp-modal-image-remove:hover{
    background: #DC2626;
}

.bp-modal-image-placeholder{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: #9CA3AF;
}

.bp-modal-image-placeholder svg{
    color: #9CA3AF;
}

.bp-modal-image-placeholder span{
    font-size: 12px;
    font-family: "Open Sans";
    color: #6B7280;
}

.bp-equipe p{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 145.455% */
    margin-top: 10px;
}

.bp-risks{
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bp-risk-mitigation {
    margin-top: 4px;
    padding: 8px 12px;
    background-color: #F0FDF4;
    border-left: 3px solid #22C55E;
    border-radius: 0 6px 6px 0;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    color: #166534;
}

.bp-footer{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    text-align: center;
    color: var(--Color-3, #B5C1D0);
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    padding: 20px;
}

.bp-contact-info{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 6%, transparent);
    padding: 20px;
    margin-top: 10px;
}

/* ===== Toast notifications ===== */
.bp-toast-container{
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 9999;
    display: flex;
    flex-direction: column-reverse;
    gap: 10px;
    pointer-events: none;
}

.bp-toast{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    border-left: 4px solid #6B7280;
    font-size: 14px;
    font-weight: 500;
    color: #1F2937;
    pointer-events: auto;
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
    max-width: 400px;
}

.bp-toast.visible{
    transform: translateY(0);
    opacity: 1;
}

.bp-toast.success{
    border-left-color: #10B981;
}

.bp-toast.success i{
    color: #10B981;
    font-size: 18px;
}

.bp-toast.error{
    border-left-color: #EF4444;
}

.bp-toast.error i{
    color: #EF4444;
    font-size: 18px;
}

.bp-toast.loading{
    border-left-color: var(--Color-2, #0A58A5);
}

.bp-toast.info{
    border-left-color: var(--Color-2, #0A58A5);
}

.bp-toast.info i{
    color: var(--Color-2, #0A58A5);
    font-size: 18px;
}

.bp-toast-spinner{
    width: 18px;
    height: 18px;
    border: 2.5px solid #E5E7EB;
    border-top-color: var(--Color-2, #0A58A5);
    border-radius: 50%;
    animation: bp-toast-spin 0.7s linear infinite;
    flex-shrink: 0;
}

@keyframes bp-toast-spin{
    to{ transform: rotate(360deg); }
}

/* ===== Export modal ===== */
.bp-export-modal-overlay{
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.5);
    backdrop-filter: blur(4px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.bp-export-modal-overlay.visible{
    opacity: 1;
    pointer-events: auto;
}

.bp-export-modal{
    background: #fff;
    border-radius: 20px;
    padding: 48px 40px 40px;
    width: 400px;
    max-width: 90vw;
    text-align: center;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.15);
    transform: scale(0.9) translateY(20px);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.bp-export-modal-overlay.visible .bp-export-modal{
    transform: scale(1) translateY(0);
}

.bp-export-modal-icon{
    position: relative;
    width: 72px;
    height: 72px;
    margin: 0 auto 24px;
}

.bp-export-modal-spinner{
    position: absolute;
    inset: 0;
    width: 72px;
    height: 72px;
    animation: bp-modal-spin 1.2s linear infinite;
}

.bp-export-modal-spinner circle{
    stroke: var(--Color-2, #0A58A5);
    stroke-dasharray: 90 150;
    stroke-dashoffset: 0;
}

.bp-export-modal-overlay.success .bp-export-modal-spinner circle{
    stroke: #10B981;
}

.bp-export-modal-overlay.error .bp-export-modal-spinner circle{
    stroke: #EF4444;
}

.bp-export-modal-overlay.success .bp-export-modal-spinner,
.bp-export-modal-overlay.error .bp-export-modal-spinner{
    animation: none;
}

.bp-export-modal-overlay.success .bp-export-modal-spinner circle,
.bp-export-modal-overlay.error .bp-export-modal-spinner circle{
    stroke-dasharray: 126 126;
    stroke-dashoffset: 0;
    transition: stroke-dasharray 0.4s ease, stroke 0.3s ease;
}

.bp-export-modal-icon i{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 24px;
    color: var(--Color-2, #0A58A5);
    transition: color 0.3s ease;
}

@keyframes bp-modal-spin{
    to{ transform: rotate(360deg); }
}

.bp-export-modal h2{
    font-size: 20px;
    font-weight: 700;
    color: #1F2937;
    margin: 0 0 6px;
    transition: color 0.3s ease;
}

.bp-export-modal p{
    font-size: 14px;
    color: #6B7280;
    margin: 0 0 32px;
}

.bp-export-modal-steps{
    display: flex;
    flex-direction: column;
    gap: 14px;
    text-align: left;
}

.bp-export-step{
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: #9CA3AF;
    transition: color 0.3s ease;
}

.bp-export-step.active{
    color: var(--Color-2, #0A58A5);
    font-weight: 600;
}

.bp-export-step.done{
    color: #10B981;
}

.bp-export-step-dot{
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px solid #E5E7EB;
    position: relative;
    flex-shrink: 0;
    transition: border-color 0.3s ease, background 0.3s ease;
}

.bp-export-step.active .bp-export-step-dot{
    border-color: var(--Color-2, #0A58A5);
    background: #EFF6FF;
}

.bp-export-step.active .bp-export-step-dot::after{
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    background: var(--Color-2, #0A58A5);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: bp-step-pulse 1.2s ease-in-out infinite;
}

@keyframes bp-step-pulse{
    0%, 100%{ opacity: 1; transform: translate(-50%, -50%) scale(1); }
    50%{ opacity: 0.5; transform: translate(-50%, -50%) scale(0.7); }
}

.bp-export-step.done .bp-export-step-dot{
    border-color: #10B981;
    background: #10B981;
}

.bp-export-step.done .bp-export-step-dot::after{
    content: '\f00c';
    font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 10px;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: none;
}


/* ===== Mode switching (Édition / Aperçu) ===== */
.module-page[data-business-plan-mode-value="edit"] .editable-text {
    cursor: pointer;
}

.module-page[data-business-plan-mode-value="edit"] .bp-section-title[data-field],
.module-page[data-business-plan-mode-value="edit"] .bp-subtitle[data-field],
.module-page[data-business-plan-mode-value="edit"] .bp-titre[data-field] {
    cursor: pointer;
}
.module-page[data-business-plan-mode-value="preview"] .bp-section-title,
.module-page[data-business-plan-mode-value="preview"] .bp-subtitle {
    cursor: default;
}

/* ===== Table inline editing ===== */
.rounded-table td input.bp-inline-edit {
    width: 100%;
    border: none;
    padding: 0;
    margin: 0;
    background: transparent;
    outline: none;
    font-size: inherit;
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    line-height: inherit;
    color: inherit;
}
.rounded-table tr.bp-editing-row {
    background-color: #F8F9FA;
}
.rounded-table tr.bp-editing-row td {
    border-left: 1px solid var(--stroke-1, #DFE5EC) !important;
    border-right: 1px solid var(--stroke-1, #DFE5EC) !important;
}

/* ===== Table row actions ===== */
.bp-action-col {
    width: 70px;
    text-align: center;
}
.module-page[data-business-plan-mode-value="preview"] .bp-action-col,
.module-page[data-business-plan-mode-value="preview"] .jalon .bp-row-actions,
.module-page[data-business-plan-mode-value="preview"] .bp-card-actions,
.module-page[data-business-plan-mode-value="preview"] .bp-segment-edit-actions,
.module-page[data-business-plan-mode-value="preview"] .trending .bp-row-actions {
    display: none;
}
.module-page[data-business-plan-mode-value="preview"] .bp-add-row-btn,
.module-page[data-business-plan-mode-value="preview"] .radar-scores-table,
.module-page[data-business-plan-mode-value="preview"] .bp-swot-actions {
    display: none;
}
.bp-card-actions {
    position: absolute;
    top: 4px;
    right: 4px;
}
.bp-row-actions {
    display: flex;
    gap: 4px;
    justify-content: center;
}
.bp-row-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    color: #6E7F93;
    transition: color 0.15s, background-color 0.15s;
}
.bp-row-btn:hover {
    background-color: #F3F4F6;
}
.bp-row-edit:hover {
    color: var(--Color-2, #0A58A5);
}
.bp-row-delete:hover {
    color: #E74C3C;
}
.bp-add-row-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 6px 12px;
    background: none;
    border: 1px dashed #B5C1D0;
    border-radius: 6px;
    color: #6E7F93;
    font-size: 12px;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}
.bp-add-row-btn:hover {
    color: var(--Color-2, #0A58A5);
    border-color: var(--Color-2, #0A58A5);
}

.module-page[data-business-plan-mode-value="edit"] .bp-page {
    margin: 0;
    width: 100%;
    height: fit-content;
}

.module-page[data-business-plan-mode-value="edit"] .bp-page.cover-page {
    width: 100%;
    height: 842px;
}

.module-page[data-business-plan-mode-value="preview"] .editable-text {
    cursor: default;
}

.module-page[data-business-plan-mode-value="preview"] .edit-mode-only {
    display: none !important;
}

.bp-detail img{
    width: 100%;
    height: 100px;
    border-radius: 8px;
    object-fit: cover;
}

/* ===== Cover color picker ===== */
.bp-cover-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    justify-content: space-between;
    width: 100%;
}

.module-page[data-business-plan-mode-value="edit"] .bp-cover-wrapper {
    width: calc(100% - 110px);
}

.bp-cover-wrapper .bp-page {
    flex-shrink: 0;
}

.bp-cover-color-picker {
    background: #fff;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 12px;
    padding: 20px;
    width: 30%;
    flex-shrink: 0;
}

.bp-cover-color-picker h3 {
    color: #223245;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    margin: 0 0 16px;
}

.bp-cover-color-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.bp-cover-color-option {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 2px solid transparent;
    padding: 3px;
    cursor: pointer;
    background: none;
    transition: border-color 0.2s ease;
}

.bp-cover-color-option:hover {
    border-color: #B5C1D0;
}

.bp-cover-color-option.active {
    border-color: var(--Color-2, #0A58A5);
}

.bp-cover-color-swatch {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 7px;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

/* ===== Card edit button ===== */
.bp-text-bloc li .bp-edit-metric-btn {
    display: inline-flex;
    vertical-align: middle;
    margin-left: 8px;
}

.bp-ekip-header .bp-edit-metric-btn,
.bp-team-infos .bp-edit-metric-btn {
    margin-left: auto;
    flex-shrink: 0;
}

.bp-seg-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.card-header-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.bp-edit-metric-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background-color: transparent;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.bp-edit-metric-btn:hover {
    background-color: #F8F9FA;
    border-color: var(--Color-2, #0A58A5);
    color: var(--Color-2, #0A58A5);
}

/* ===== Segments de clientèle ===== */
.bp-segment-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #F0F2F5;
}

.bp-segment-item:last-child {
    border-bottom: none;
}

.bp-segment-item.nd {
    margin-top: 0;
}

.bp-segment-item p {
    flex: 1;
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #223245;
}

.bp-segment-item p span {
    font-weight: 700;
}

.bp-segment-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.bp-delete-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background-color: transparent;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.bp-delete-btn:hover {
    background-color: #FEF2F2;
    border-color: #DC3545;
    color: #DC3545;
}

.bp-add-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    padding: 8px 16px;
    background-color: transparent;
    border: 1px dashed var(--Color-2, #0A58A5);
    border-radius: 8px;
    color: var(--Color-2, #0A58A5);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
    margin-bottom: 20px;
}

.bp-add-btn:hover {
    background-color: #E8F0FE;
}

.bp-empty-content {
    color: #6E7F93;
    font-style: italic;
    font-size: 14px;
    padding: 10px 0;
}

/* ===== Opportunités / Menaces row ===== */
.bp-opp-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.bp-contact-info span{
    font-weight: 400 !important;
}

.bp-opp-row.nd {
    margin-top: 10px;
}

.bp-opp-row p {
    flex: 1;
    margin: 0;
}

.bp-opp-row .bp-edit-metric-btn {
    margin-top: 2px;
    flex-shrink: 0;
}

/* ===== Edit buttons dans les listes et produits ===== */
.bp-text-bloc ol li,
.bp-text-bloc ul li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.bp-text-bloc ol li .bp-edit-metric-btn,
.bp-text-bloc ul li .bp-edit-metric-btn {
    margin-top: 3px;
    flex-shrink: 0;
}

.bp-product,
.bp-detail {
    position: relative;
}

.bp-product > .bp-edit-metric-btn,
.bp-detail > .bp-edit-metric-btn {
    position: absolute;
    top: 12px;
    right: 12px;
}

.risk .bp-opp-row {
    margin-bottom: 4px;
}

.risk .bp-opp-row h2 {
    flex: 1;
}

/* ===== Table actions (edit/delete dans les tableaux) ===== */
.bp-table-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.bp-table th.edit-mode-only,
.bp-table td.bp-table-actions {
    text-align: center;
}

/* Light cover text color override */
.cover-page.cover-page-light,
.cover-page.cover-page-light .bp-title,
.cover-page.cover-page-light .cover-body p,
.cover-page.cover-page-light .cover-body .cover-date,
.cover-page.cover-page-light .cover-footer .cover-footer-left div span,
.cover-page.cover-page-light .cover-footer .cover-footer-left div h2,
.cover-page.cover-page-light .elite span,
.cover-page.cover-page-light .elite h2 {
    color: #223245;
}

/* ===== Distribution Channels: item actions & add button ===== */
.bp-item-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    flex-shrink: 0;
}

.bp-delete-item-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background-color: transparent;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.bp-delete-item-btn:hover {
    background-color: #FEF2F2;
    border-color: #DC3545;
    color: #DC3545;
}

.bp-add-list-item-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    padding: 8px 16px;
    background-color: transparent;
    border: 1px dashed var(--Color-2, #0A58A5);
    border-radius: 8px;
    color: var(--Color-2, #0A58A5);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
    margin-bottom: 20px;
}

.bp-add-list-item-btn:hover {
    background-color: #E8F0FE;
}

/* Gantt row action buttons */
.bp-gantt-task-label {
    position: relative;
}

.bp-gantt-actions {
    display: inline-flex;
    margin-left: 6px;
    vertical-align: middle;
}

/* ===== Edit mode: +2px on all document font-sizes ===== */
.module-page[data-business-plan-mode-value="edit"] .bp-page h1 { font-size: 23px; }
.module-page[data-business-plan-mode-value="edit"] .bp-text-bloc h2 { font-size: 13px; }
.module-page[data-business-plan-mode-value="edit"] .bp-text-bloc p,
.module-page[data-business-plan-mode-value="edit"] .verdict p, .module-page[data-business-plan-mode-value="edit"] .avantage p { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .verdict h2, .module-page[data-business-plan-mode-value="edit"] .avantage h2 { font-size: 14px; text-transform: uppercase; }
.module-page[data-business-plan-mode-value="edit"] h2.subtitle { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-text-bloc p span { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-text-bloc ul li { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .ordonned-list li { font-size: 16px; }
.module-page[data-business-plan-mode-value="edit"] .bp-disclaimer h2 { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-disclaimer p { font-size: 12px; }
.module-page[data-business-plan-mode-value="edit"] .resume-cards .card h2 { font-size: 12px; }
.module-page[data-business-plan-mode-value="edit"] .resume-cards .card h1 { font-size: 18px; }
.module-page[data-business-plan-mode-value="edit"] .resume-cards .card span { font-size: 11px; }
.module-page[data-business-plan-mode-value="edit"] .bp-legend-item { font-size: 12px; }
.module-page[data-business-plan-mode-value="edit"] .bp-bar span { font-size: 11px; }
.module-page[data-business-plan-mode-value="edit"] .bp-bar-label { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-pie-legend-label,
.module-page[data-business-plan-mode-value="edit"] .bp-pie-legend-value { font-size: 16px; }
.module-page[data-business-plan-mode-value="edit"] .bp-hbar-label { font-size: 15px; }
.module-page[data-business-plan-mode-value="edit"] .bp-hbar-value { font-size: 15px; }
.module-page[data-business-plan-mode-value="edit"] .bp-gantt-header .bp-gantt-months span { font-size: 13px; }
.module-page[data-business-plan-mode-value="edit"] .bp-line-chart-y-axis span { font-size: 13px; }
.module-page[data-business-plan-mode-value="edit"] .bp-line-dot span { font-size: 12px; }
.module-page[data-business-plan-mode-value="edit"] .bp-line-chart-x-axis span { font-size: 13px; }
.module-page[data-business-plan-mode-value="edit"] .bp-line-legend-item span { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-empty-content { font-size: 16px; }
.module-page[data-business-plan-mode-value="edit"] .bp-table { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-table thead th { font-size: 16px; }
.module-page[data-business-plan-mode-value="edit"] .bp-table table tr td { font-size: 16px; }
.module-page[data-business-plan-mode-value="edit"] .bp-table-title { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-team-infos h1 { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-team-infos span { font-size: 12px; }
.module-page[data-business-plan-mode-value="edit"] .bp-team p { font-size: 13px; }
.module-page[data-business-plan-mode-value="edit"] .bp-seg h2 { font-size: 11px; }
.module-page[data-business-plan-mode-value="edit"] .bp-seg h1 { font-size: 22px; }
.module-page[data-business-plan-mode-value="edit"] .bp-seg p { font-size: 10px; }
.module-page[data-business-plan-mode-value="edit"] .bp-swot-disclaimer { font-size: 13px; }
.module-page[data-business-plan-mode-value="edit"] .swot-item-text { font-size: 14px !important; }
.module-page[data-business-plan-mode-value="edit"] .bp-product img { height: 200px; }
.module-page[data-business-plan-mode-value="edit"] .bp-detail img { height: 140px; }
.module-page[data-business-plan-mode-value="edit"] .bp-product-text h3 { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-product-text span { font-size: 12px; }
.module-page[data-business-plan-mode-value="edit"] .bp-ekip-header h4 { font-size: 14px; }
.module-page[data-business-plan-mode-value="edit"] .bp-ekip-header span { font-size: 12px; }
.module-page[data-business-plan-mode-value="edit"] .bp-ekip-initials { font-size: 18px; }
.module-page[data-business-plan-mode-value="edit"] .bp-equipe p { font-size: 13px; }
.module-page[data-business-plan-mode-value="edit"] .bp-footer { font-size: 13px; }
.module-page[data-business-plan-mode-value="edit"] .bp-segment-item p { font-size: 16px; }
.module-page[data-business-plan-mode-value="edit"] .bp-add-btn { font-size: 15px; }
.module-page[data-business-plan-mode-value="edit"] .bp-add-list-item-btn { font-size: 15px; }
.module-page[data-business-plan-mode-value="edit"] .cover-page .bp-title { font-size: 22px; }
.module-page[data-business-plan-mode-value="edit"] .cover-page .cover-body p { font-size: 42px; }
.module-page[data-business-plan-mode-value="edit"] .cover-page .cover-body .cover-date { font-size: 16px; }
.module-page[data-business-plan-mode-value="edit"] .cover-footer .cover-footer-left div span,
.module-page[data-business-plan-mode-value="edit"] .elite span { font-size: 11px; }
.module-page[data-business-plan-mode-value="edit"] .cover-footer .cover-footer-left div h2,
.module-page[data-business-plan-mode-value="edit"] .elite h2 { font-size: 14px; }

.financing-echeancier-hint{
    padding: 20px;
}

.financing-emprunt-btn{
    margin: 15px;
    margin-top: 0;
    width: calc(100% - 30px);
}

.mix-cards{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}

.mix-card{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 15px;
}

.mix-title{
    display: flex;
    align-items: center;
    gap: 10px;
}

.mix-title .p{
    border-radius: 6px;
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 8%, transparent);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    line-height: 18px; /* 150% */
}

.price .mix-title .p{
    border-radius: 6px;
    background: rgba(255, 153, 0, 0.08);
    color: #F90;
}

.place .mix-title .p{
    border-radius: 6px;
background: rgba(76, 175, 80, 0.08);
color: #4CAF50;
}

.promotion .mix-title .p{
    border-radius: 6px;
background: rgba(156, 39, 176, 0.08);
color: #9C27B0;

}

.mix-title span{
    color: var(--Color-2, #0A58A5);
font-family: "Open Sans";
font-size: 11px;
font-style: normal;
font-weight: 700;
line-height: 16.5px; /* 150% */
}

.price .mix-title span{
    color: #F90;
}

.place .mix-title span{
    color: #4CAF50;
}

.promotion .mix-title span{
    color: #9C27B0;
}

.mix-content{
    margin-top: 15px;
}

.mix-content ul{
    list-style-type: disc !important;
    padding-left: 10px !important;
    margin-left: 0 !important;
}

.mix-content ul li{
    color: #223245;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px; /* 150% */
    list-style-type: disc !important;
    display: list-item !important;
}

.mix-content ul li .mix-item-text{
    font-weight: 400 !important;
}

.mix-content ul li[data-mix-index]{
    display: flex !important;
    align-items: flex-start;
}

.mix-content ul li[data-mix-index]::before{
    content: '•';
    flex-shrink: 0;
    margin-right: 6px;
    font-size: 14px;
    line-height: 15px;
}

.bp-mix-actions{
    display: inline-flex;
    margin-left: auto;
    flex-shrink: 0;
}

.module-page[data-business-plan-mode-value="preview"] .bp-mix-actions{
    display: none;
}

.mix-card .mix-content ul li::before{ color: var(--Color-2, #0A58A5); }
.mix-card.price .mix-content ul li::before{ color: #F90; }
.mix-card.place .mix-content ul li::before{ color: #4CAF50; }
.mix-card.promotion .mix-content ul li::before{ color: #9C27B0; }

@media (max-width: 768px){

    .segmentation-chart, .catalogue-content{
        flex-direction: column;
    }

    .catalogue-content{
        align-items: start;
    }

    .catalogue-content span{
        width: fit-content;
    }

    .segmentation-donut{
        width: 100%;
    }

    /* ── Radio group: stack vertically ── */
    .business-plan-radio-group{
        display: flex;
        flex-direction: column;
    }

    .vmv{
        flex-direction: column;
    }

    .vmv-card{
        width: 100%;
    }

    .concu-table, .seg-table, .actions-table{
        width: 100%;
        overflow: scroll;
    }

    .mix-cards, .bp-teams{
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    /* ── Header: stack title + buttons ── */
    .module-page[data-controller="business-plan"] .page-header-content{
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
    }

    .module-page[data-controller="business-plan"] .etude-index-page-header-left{
        width: 100%;
    }

    .module-page[data-controller="business-plan"] .etude-title h1{
        font-size: 15px;
    }

    .module-page[data-controller="business-plan"] .projects-index-page-header-right{
        width: 100%;
        gap: 8px;
        justify-content: space-between;
    }

    .module-page[data-controller="business-plan"] .mode-toggle-group{
        width: auto;
        min-width: 0;
        height: 36px;
        flex: 1;
    }

    .module-page[data-controller="business-plan"] .mode-toggle-group button{
        padding: 4px 10px;
        gap: 5px;
    }

    .module-page[data-controller="business-plan"] .mode-toggle-group button span{
        display: none;
    }

    .module-page[data-controller="business-plan"] .mode-toggle-group button i{
        font-size: 14px;
    }

    .module-page[data-controller="business-plan"] .download-button{
        padding: 8px 10px;
        gap: 0;
    }

    .module-page[data-controller="business-plan"] .download-button span{
        display: none;
    }

    .module-page[data-controller="business-plan"] .export-dropdown-chevron{
        display: none;
    }

    .module-page[data-controller="business-plan"] .aide-button{
        padding: 8px 10px;
    }

    .module-page[data-controller="business-plan"] .aide-button span{
        display: none;
    }

    /* ── Sidebar → horizontal scrollable bar ── */
    .business-plan-sidebar.etude-marche-sidebar{
        width: 100%;
        height: auto;
        border-right: none;
        border-bottom: 1px solid var(--stroke-1, #DFE5EC);
        padding: 12px 0;
        flex-direction: row;
        position: sticky;
        top: 0;
        z-index: 10;
        background: #fff;
    }

    .business-plan-sections-nav{
        flex-direction: row;
        gap: 8px;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0 15px 2px;
    }

    .business-plan-sections-nav::-webkit-scrollbar{
        display: none;
    }

    .business-plan-sections-nav a{
        white-space: nowrap;
        padding: 8px 12px;
        gap: 8px;
        flex-shrink: 0;
        border-radius: 8px;
    }

    .business-plan-sections-nav a span{
        font-size: 12px;
        line-height: 16px;
    }

    .business-plan-section-number{
        width: 22px;
        height: 22px;
        font-size: 11px;
    }

    /* ── Content area ── */
    .business-plan-content.etude-marche-content{
        width: 100%;
        height: auto !important;
        overflow: visible;
        padding: 16px;
        height: calc(100vh - 276.5px) !important;
        overflow: scroll;
        margin-bottom: 76px;
    }

    /* ── BP Pages: full width on mobile ── */
    .bp-page{
        width: 100%;
        border-radius: 10px;
    }

    .module-page[data-business-plan-mode-value="edit"] .bp-page.cover-page{
        width: 100%;
        height: auto;
        gap: 20px;
        padding: 20px;
    }

    .bp-scroll{
        padding: 20px;
    }

    /* ── Cover wrapper: stack vertically ── */
    .bp-cover-wrapper{
        flex-direction: column;
        gap: 16px;
    }

    .module-page[data-business-plan-mode-value="edit"] .bp-cover-wrapper{
        width: 100%;
    }

    .bp-cover-color-picker{
        width: 100%;
    }

    /* ── Resume cards: stack ── */
    .resume-cards{
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .resume-cards .card{
        width: auto;
    }

    /* ── Generation loader ── */
    .bp-generation-loader{
        padding: 40px 20px;
    }

    /* ── Form steps: nav block ── */
    .business-plan-nav-block{
        padding: 0 16px;
        height: 80px;
    }

    .business-plan-config-form{
        padding: 0 16px;
    }

    .projects-page.business-plan-page{
        height: calc(100vh - 140px);
    }

    .business-plan-field-description,
    .business-plan-step-description,
    .business-plan-checkbox-description{
        font-size: 14px;
    }

    .tamsamsom, .bp-pie-chart-wrapper, .bp-details{
        flex-direction: column;
    }

    .tamsamsom .left, .tamsamsom .right, .bp-pie-legend{
        width: 100%;
    }

    .bp-detail{
        display: flex;
        align-items: start;
        gap: 10px;
        width: 100%;
    }

    .bp-detail img{
        width: 80px;
        height: 80px;
        flex-shrink: 0;
    }

    .bp-text-bloc ol{
        margin-left: 0;
    }
}

/* ========== Modules Checklist (Step 7) ========== */

.bp-modules-checklist{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
}

.bp-module-check-item{
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
}

.bp-module-check-icon{
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bp-module-check-info{
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.bp-module-check-name{
    color: var(--Color1, #223245);
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
}

.bp-module-check-desc{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.bp-module-check-button{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 8px;
    background: var(--Color-2, #0A58A5);
    color: #FFF;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s ease, transform 0.1s ease;
}

.bp-module-check-button:hover{
    background: #084A8A;
    transform: translateY(-1px);
}

.bp-module-check-button:active{
    transform: translateY(0);
}

.bp-modules-summary{
    margin-top: 16px;
    padding: 12px 16px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
}

.bp-modules-summary.all-done{
    background: #FFF;
    color: #166534;
    border: 1px solid var(--stroke-1, #DFE5EC);
}

.bp-modules-summary.some-missing{
    background: #FFF;
    color: #92400E;
    border: 1px solid var(--stroke-1, #DFE5EC);
}

@media (max-width: 600px) {
    .bp-module-check-item{
        flex-wrap: wrap;
        gap: 10px;
    }

    .bp-module-check-button{
        width: 100%;
        justify-content: center;
    }
}

/* ===== Annexes Section ===== */

/* Table des annexes */
.annexes-table .rounded-table td {
    border-left: none !important;
    border-right: none !important;
}

.annexes-table .rounded-table th {
    border-left: none !important;
    border-right: none !important;
}

.annexes-table .rounded-table td:first-child {
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    line-height: 13.5px; /* 150% */
}

.annexes-table .rounded-table td:nth-child(2) {
    color: #223245;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 400;
    line-height: 13.5px; /* 150% */
}

.annexes-table .rounded-table td:nth-child(3) span {
    border-radius: 16777200px;
    background: var(--bp-tint, #F0F6FF);
    padding: 2px 5px;
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 7px;
    font-style: normal;
    font-weight: 600;
    line-height: 10.5px; /* 150% */
}

.annexes-table .rounded-table thead th {
    background: #F6F7F8;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 8px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 150% */
    text-transform: uppercase;
}

.annexes-table .rounded-table td:nth-child(4) {
    color: #6E7F93;
    text-align: center;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 400;
    line-height: 13.5px; /* 150% */
}

.annexes-table .rounded-table td:nth-child(5) span {
    border-radius: 16777200px;
    padding: 2px 5px;
    font-family: "Open Sans";
    font-size: 7px;
    font-style: normal;
    font-weight: 600;
    line-height: 10.5px; /* 150% */
}

.annexes-table .rounded-table td:nth-child(5) span.status-finalise {
    background: #F0FAF0;
    color: #2E7D32;
}

.annexes-table .rounded-table td:nth-child(5) span.status-en-cours {
    background: #FFF8F0;
    color: #E65100;
}

.annexes-table .rounded-table td:nth-child(3) span.type-rh { background: #F0FAF0; color: #2E7D32; }
.annexes-table .rounded-table td:nth-child(3) span.type-marche { background: #F3E8FF; color: #7B1FA2; }
.annexes-table .rounded-table td:nth-child(3) span.type-finance { background: #FFF8F0; color: #E65100; }
.annexes-table .rounded-table td:nth-child(3) span.type-qualite { background: #FEF0F0; color: #C62828; }
.annexes-table .rounded-table td:nth-child(3) span.type-produit { background: #F6F7F8; color: #455A64; }
.annexes-table .rounded-table td:nth-child(3) span.type-infra { background: #F6F7F8; color: #455A64; }
.annexes-table .rounded-table td:nth-child(3) span.type-logistique { background: #F6F7F8; color: #455A64; }

/* Hypotheses financières */
.hypotheses-table .rounded-table td:first-child {
    color: #223245;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 600;
    line-height: 13.5px; /* 150% */
}

.hypotheses-table .rounded-table td:nth-child(2) {
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

.hypotheses-table .rounded-table td:nth-child(3) {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 400;
    line-height: 13.5px; /* 150% */
}

.hypotheses-table .rounded-table td:nth-child(4) span {
    border-radius: 16777200px;
    padding: 2px 5px;
    font-family: "Open Sans";
    font-size: 7px;
    font-style: normal;
    font-weight: 600;
    line-height: 10.5px; /* 150% */
}

.hypotheses-table .rounded-table td:nth-child(4) span.sensibilite-elevee {
    border-radius: 16777200px;
    background: #FEF0F0;
    color: #C62828;
}

.hypotheses-table .rounded-table td:nth-child(4) span.sensibilite-moyenne {
    border-radius: 16777200px;
    background: #FFF8F0;
    color: #E65100;
}

.hypotheses-table .rounded-table td:nth-child(4) span.sensibilite-faible {
    border-radius: 16777200px;
    background: #F0FAF0;
    color: #2E7D32;
}

/* Tableau scénarios */
.scenario-table .rounded-table td:first-child {
    color: #223245;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

.scenario-table .rounded-table td:nth-child(2) {
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

.scenario-table .rounded-table td:nth-child(3) {
    color: #F90;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

.scenario-table .rounded-table td:nth-child(4) {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 15px; /* 150% */
}

/* Calendrier prévisionnel */
.calendrier-bloc .jalon span {
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

.calendrier-bloc .jalon h2 {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 9px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 14px; /* 155.556% */
    text-transform: none;
}

.cal-status {
    border-radius: 16777200px;
    padding: 2px 5px;
    font-size: 7px !important;
    font-weight: 600 !important;
    line-height: 10.5px !important;
}

.cal-en-cours {
    background: var(--bp-tint, #F0F6FF);
    color: var(--Color-2, #0A58A5) !important;
}

.cal-planifie {
    background: #FFF8F0;
    color: #E65100 !important;
}

.cal-vision {
    background: #F6F7F8;
    color: #6E7F93 !important;
}

/* Tableau contacts & partenaires */
.contacts-table .rounded-table td:first-child {
    color: #223245;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    line-height: 13.5px; /* 150% */
}

.contacts-table .rounded-table td:nth-child(2) span {
    border-radius: 4px;
    padding: 2px 5px;
    font-family: "Open Sans";
    font-size: 7px;
    font-style: normal;
    font-weight: 600;
    line-height: 10.5px; /* 150% */
    background: var(--bp-tint, #F0F6FF);
    color: var(--Color-2, #0A58A5);
}

.contacts-table .rounded-table td:nth-child(2) span.ct-institution {
    background: #F3E8FF;
    color: #7B1FA2;
}

.contacts-table .rounded-table td:nth-child(2) span.ct-finance {
    background: var(--bp-tint, #F0F6FF);
    color: var(--Color-2, #0A58A5);
}

.contacts-table .rounded-table td:nth-child(2) span.ct-logistique {
    background: #F6F7F8;
    color: #455A64;
}

.contacts-table .rounded-table td:nth-child(2) span.ct-marketing {
    background: #FFF8F0;
    color: #E65100;
}

.contacts-table .rounded-table td:nth-child(2) span.ct-juridique {
    background: #F6F7F8;
    color: #455A64;
}

.contacts-table .rounded-table td:nth-child(2) span.ct-fournisseur {
    background: #FFF8F0;
    color: #E65100;
}

.contacts-table .rounded-table td:nth-child(2) span.ct-laboratoire {
    background: #F0FAF0;
    color: #2E7D32;
}

.contacts-table .rounded-table td:nth-child(5) span {
    border-radius: 16777200px;
    padding: 2px 5px;
    font-family: "Open Sans";
    font-size: 7px;
    font-style: normal;
    font-weight: 600;
    line-height: 10.5px;
}

.contacts-table .rounded-table td:nth-child(5) span.ct-dossier-depose {
    background: #F0FAF0;
    color: #2E7D32;
}

.contacts-table .rounded-table td:nth-child(5) span.ct-lettre-intention {
    background: var(--bp-tint, #F0F6FF);
    color: var(--Color-2, #0A58A5);
}

.contacts-table .rounded-table td:nth-child(5) span.ct-devis-obtenu {
    background: var(--bp-tint, #F0F6FF);
    color: var(--Color-2, #0A58A5);
}

.contacts-table .rounded-table td:nth-child(5) span.ct-convention-signe {
    background: #F0FAF0;
    color: #2E7D32;
}

.contacts-table .rounded-table td:nth-child(5) span.ct-en-cours {
    background: #FFF8F0;
    color: #E65100;
}

.contacts-table .rounded-table td:nth-child(5) span.ct-demarrage {
    background: #F6F7F8;
    color: #455A64;
}

.contacts-table .rounded-table td:nth-child(3),
.contacts-table .rounded-table td:nth-child(4) {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 8px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px; /* 150% */
}

/* Sources & références */
.sources-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sources-list p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px;
    margin: 0;
}

.source-ref {
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px;
    margin-right: 4px;
}

/* Module projet (checkbox rows) */
.bp-annexe-modules-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bp-annexe-module {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    transition: opacity 0.2s, background-color 0.3s;
}

.bp-annexe-module--unchecked {
    opacity: 0.5;
}

/* In preview mode, hide unchecked modules entirely */
.module-page[data-business-plan-mode-value="preview"] .bp-annexe-module--unchecked {
    display: none;
}

.bp-annexe-module-checkbox {
    display: flex;
    align-items: center;
    padding-top: 2px;
    flex-shrink: 0;
}

.bp-annexe-module-checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--Color-2, #0A58A5);
    cursor: pointer;
}

.bp-annexe-module-info {
    flex: 1;
    min-width: 0;
}

.bp-annexe-module-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.bp-annexe-module-name {
    font-weight: 600;
    font-size: 14px;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.bp-annexe-module-desc {
    font-size: 13px;
    color: #6B7280;
    margin: 0;
    line-height: 1.4;
    font-family: "Open Sans", sans-serif;
}

.bp-annexe-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    font-family: "Open Sans", sans-serif;
}

.bp-annexe-badge--done {
    background: #D1FAE5;
    color: #065F46;
}

.bp-annexe-badge--pending {
    background: #FEF3C7;
    color: #92400E;
}

/* Documents externes */
.bp-annexe-docs-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bp-annexe-doc {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    transition: background-color 0.3s, opacity 0.3s;
}

.bp-annexe-doc-info {
    flex: 1;
    min-width: 0;
}

.bp-annexe-doc-name {
    font-weight: 600;
    font-size: 14px;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.bp-annexe-doc-desc {
    font-size: 13px;
    color: #6B7280;
    margin: 4px 0 0;
    line-height: 1.4;
    font-family: "Open Sans", sans-serif;
}

.bp-annexe-file-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--Color-2, #0A58A5);
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
}

.bp-annexe-file-link:hover {
    text-decoration: underline;
}

.bp-annexe-file-link svg {
    flex-shrink: 0;
    transform: rotate(180deg);
}

/* File preview in modal */
.bp-annexe-file-preview {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    padding: 8px 12px;
    background: #F3F4F6;
    border-radius: 8px;
    font-size: 13px;
    color: #374151;
    font-family: "Open Sans", sans-serif;
}

.bp-annexe-file-preview svg {
    flex-shrink: 0;
    color: #6B7280;
}

.bp-annexe-file-preview-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* ===== Segmentation du marché ===== */
.segmentation-chart {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    margin-top: 10px;
    border-radius: 10px;
border: 1px solid var(--stroke-1, #DFE5EC);
padding: 17px;
}

.segmentation-donut {
    flex-shrink: 0;
    width: 50%;
    height: 180px;
}

.donut-svg {
    width: 100%;
    height: 100%;
}

.segmentation-legend {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.trendings{
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.trending{
    border-radius: 8px;
background: #F6F7F8;
padding: 10px;
display: flex;
align-items: start;
gap: 15px;
}
.trending .bp-row-actions {
    margin-left: auto;
    flex-shrink: 0;
}

.trending span{
    border-radius: 16777200px;
    background: var(--Color-2, #0A58A5);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 15px; /* 150% */
}

.trending-content{
    width: 60%;
}

.concu-table table tr td.status span{
    border-radius: 16777200px;
    ;height: 16px;
    padding: 2px 6px;
    
    font-family: "Open Sans";
    font-size: 9px;
    font-style: normal;
    font-weight: 600;
    line-height: 13.5px; /* 150% */
}

.concu-table table tr td.status.forte span{
    color: #C62828;
    background: #FEF0F0
}

.concu-table table tr td.status.moyenne span{
    color: #E65100;
    background: #FFF8F0;
}

.concu-table table tr td.status.faible span{
    color: #2E7D32;
    background: #F0FAF0;
}

.concu-table.concu-highlight-last table tr:last-child td{
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 4%, transparent);
    border: none;
}

.concu-table.concu-highlight-last table tr:last-child td:first-child{
    color: var(--Color-2, #0A58A5);
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700;
line-height: 15px; /* 150% */
}


.concu-table table tr td{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 8px;
    font-style: normal;
    font-weight: 400;
    line-height: 12px;
    border-left: none !important;
    border-right: none !important;
}

.trending-content h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    line-height: 16.5px; /* 150% */
}

.trending-content p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 160% */
    margin-top: 10px;
}

.segment-item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px;
}

.segment-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-top: 4px;
    flex-shrink: 0;
}

.segment-info {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
}

.segment-label {
    color: #6E7F93;
font-family: "Open Sans";
font-size: 11px;
font-style: normal;
font-weight: 400;
line-height: 16.5px; /* 150% */
}

.segment-pct {
    color: #6E7F93;
font-family: "Open Sans";
font-size: 11px;
font-style: normal;
font-weight: 400;
line-height: 16.5px; /* 150% */
}

.segment-desc {
    width: 100%;
    padding-left: 18px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    font-size: 10px;
    font-weight: 400;
    line-height: 15px;
    margin: 0;
}

/* ===== Écart offre/demande (SVG) ===== */
.ecart-subtitle {
    color: #6E7F93 !important;
    font-size: 10px !important;
    margin-bottom: 4px !important;
    margin-top: 0 !important;
}

.ecart-svg {
    width: 100%;
    height: auto;
    display: block;
}

/* ===== Audio Narration Modal ===== */
.bp-audio-body {
    padding: 20px 24px;
    max-height: 520px;
    overflow-y: auto;
}

.bp-audio-initial {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.bp-audio-initial-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--Color-2, #0A58A5) 0%, #0d6ecc 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.bp-audio-cost-box {
    background: #f8fafc;
    border-radius: 10px;
    padding: 14px 16px;
    width: 100%;
}

.bp-audio-generate-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(135deg, var(--Color-2, #0A58A5) 0%, #0d6ecc 100%);
    border-radius: 12px;
    padding: 16px 20px;
    width: 100%;
}

.bp-audio-generate-btn {
    background: white;
    color: var(--Color-2, #0A58A5);
    border: none;
    padding: 10px 24px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    font-size: 14px;
    transition: transform 0.15s;
}

.bp-audio-generate-btn:hover {
    transform: scale(1.03);
}

.bp-audio-sections {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bp-audio-section-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px 14px;
    transition: all 0.2s;
    margin-bottom: 10px;
}

.bp-audio-section-card:hover {
    border-color: #cbd5e1;
    background: #f1f5f9;
}

.bp-audio-section-card.playing {
    border-color: var(--Color-2, #0A58A5);
    background: #eff6ff;
}

.bp-audio-section-info {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    min-width: 0;
}

.bp-audio-section-num {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--Color-2, #0A58A5);
    color: white;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.bp-audio-section-name {
    font-size: 13px;
    font-weight: 500;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bp-audio-player {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.bp-audio-play-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: var(--Color-2, #0A58A5);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.15s, background 0.2s;
    flex-shrink: 0;
}

.bp-audio-play-btn:hover {
    background: #084a8a;
    transform: scale(1.08);
}

.bp-audio-progress-bar {
    width: 80px;
    height: 4px;
    background: #e2e8f0;
    border-radius: 2px;
    overflow: hidden;
}

.bp-audio-section-card.playing .bp-audio-progress-bar {
    background: #bfdbfe;
}

.bp-audio-progress-fill {
    height: 100%;
    background: var(--Color-2, #0A58A5);
    border-radius: 2px;
    transition: width 0.15s linear;
}

.bp-audio-duration {
    font-size: 12px;
    color: #94a3b8;
    font-variant-numeric: tabular-nums;
    min-width: 32px;
    text-align: right;
}

.bp-audio-section-card.bp-audio-disabled {
    opacity: 0.45;
    pointer-events: none;
}

.bp-audio-generate-btn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}

.bp-audio-section-card.playing .bp-audio-duration {
    color: var(--Color-2, #0A58A5);
    font-weight: 600;
}

/* Audio loading state */
.bp-audio-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 40px 20px;
    text-align: center;
}

/* ============================================================
   Redesign formulaire Business Plan (8 étapes) — style pf-config
   Inline pleine largeur · stepper à segments · icônes par étape
   ============================================================ */

/* Colonne de contenu centrée, plus resserrée */
.bp-height{
    width: 100%;
    max-width: 560px;
}

/* ── Stepper à segments ── */
.bp-stepper{
    width: 100%;
    margin-bottom: 24px;
}
.bp-stepper-meta{
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.bp-stepper-count{
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--Color-2, #0A58A5);
}
.bp-stepper-name{
    font-size: 12.5px;
    font-weight: 600;
    color: var(--Color2, #6E7F93);
    text-align: right;
}
.bp-stepper-track{
    display: flex;
    gap: 5px;
}
.bp-seg{
    flex: 1;
    height: 5px;
    border-radius: 99px;
    background: var(--stroke-1, #DFE5EC);
    transition: background 0.3s ease;
}
.bp-seg.is-done,
.bp-seg.is-current{
    background: var(--Color-2, #0A58A5);
}

/* ── En-tête d'étape : icône + titre + sous-titre ── */
.bp-step-head{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    margin-bottom: 26px;
}
.bp-step-head-icon{
    width: 52px;
    height: 52px;
    border-radius: 15px;
    background: color-mix(in srgb, var(--Color-2, #0A58A5) 8%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--Color-2, #0A58A5);
}
.bp-step-head-icon svg{ width: 26px; height: 26px; }
.bp-step-head-title{
    font-size: 21px;
    font-weight: 700;
    color: var(--Color1, #223245);
    margin: 2px 0 0;
    text-wrap: balance;
}
.bp-step-head-sub{
    font-size: 14px;
    line-height: 1.55;
    color: var(--Color2, #6E7F93);
    margin: 0;
    max-width: 440px;
}

/* ── Champs façon pf-config : fond blanc + focus bleu ── */
.bp-height .business-plan-input,
.bp-height .business-plan-textarea,
.bp-height .business-plan-select{
    background: #FFFFFF;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.bp-height .business-plan-input:focus,
.bp-height .business-plan-textarea:focus,
.bp-height .business-plan-select:focus{
    outline: none;
    border-color: var(--Color-2, #0A58A5);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--Color-2, #0A58A5) 15%, transparent);
}
.bp-height .business-plan-field-label{
    font-size: 13px;
    font-weight: 600;
    color: #445972;
}

/* ── Cartes radio resserrées ── */
.bp-height .business-plan-radio-group{ margin-top: 0; }
.bp-height .business-plan-radio-option{ padding: 20px 16px; }
.bp-height .business-plan-radio-content{ gap: 6px; }
.bp-height .business-plan-radio-title{
    font-size: 16px;
    line-height: 1.2;
}
.bp-height .business-plan-radio-description{
    font-size: 12.5px;
    margin-top: 4px;
    line-height: 1.45;
}

/* ── Bouton « ajouter un membre » en pointillés ── */
.bp-height .business-plan-add-member-button{
    border-style: dashed;
    border-width: 1.5px;
    background: var(--surface-alt, #F6F7F8);
    transition: border-color 0.15s ease;
}
.bp-height .business-plan-add-member-button:hover{
    border-color: var(--Color-2, #0A58A5);
}

/* ── Barre de navigation allégée ── */
.business-plan-nav-block{
    height: auto;
    padding: 16px 30px;
}
.business-plan-nav-button.business-plan-nav-button-next,
.business-plan-nav-button.business-plan-nav-button-previous{
    height: 46px;
    padding: 0 24px;
    gap: 10px;
    border-radius: 14px;
    font-size: 14.5px;
}
.business-plan-nav-button.business-plan-nav-button-previous:hover{
    border-color: var(--Color-2, #0A58A5);
    color: var(--Color-2, #0A58A5);
}
.business-plan-nav-button.business-plan-nav-button-next:hover:not(:disabled){
    background: #084A8A;
}
.login-container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
    height: 100vh;
    width: 600px;
    margin: 0 auto;
}

.login-container .login-content{
    border-radius: 30px;
    border: 1px solid var(--Contour-Color, #DFE5EC);
    background: var(--Blanc, #FFF);
    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    width: 100%;
    max-height: 85vh;
    overflow: scroll;
}

.login-form-title-section{
    border-radius: 30px 30px 0 0;
    border-bottom: 1px solid var(--Contour-Color, #DFE5EC);
    background: var(--gradient4, linear-gradient(180deg, #E6ECF5 0%, #FFF 100%));
    padding: 40px;
}

.login-form-title-section h1{
    color: var(--Color-Texte, #22364D);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 110% */
    text-align: center;
    margin: 0;
}

.profile-options{
    padding: 32px 40px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.profile-option{
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    border-radius: 16px;
    border: 1.5px solid #E2E8F0;
    background: #FFF;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.profile-option:hover{
    border-color: #0A58A5;
    box-shadow: 0 4px 16px rgba(10, 88, 165, 0.1);
    background: #F8FBFF;
}

.profile-container{
    flex: 1;
}

.profile-title{
    color: #0F172B;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px;
}

.profile-description{
    color: #62748E;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 19px;
    margin-top: 3px;
}

.profile-arrow{
    color: #B0BEC8;
    flex-shrink: 0;
    transition: color 0.2s ease, transform 0.2s ease;
}

.profile-option:hover .profile-arrow{
    color: #0A58A5;
    transform: translateX(3px);
}

.login--email-footer{
    text-align: center;
    border-radius: 0 0 30px 30px;
    border: 1px solid var(--Contour-Color, #DFE5EC);
    background: var(--Blanc, #FFF);
    padding: 20px 0;
    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.no-account-text{
    color: #45556C;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
    margin: 20px 0;
    margin-bottom: 40px;
}

.login-footer{
  padding: 0 40px;
}

.no-account-text a{
    color: #0A58A5;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
}

.profile-option.selected{
    border: 1.5px solid #0A58A5;
    background: #EEF5FF;
    box-shadow: 0 4px 16px rgba(10, 88, 165, 0.12);
}

.profile-option.selected .profile-arrow{
    color: #0A58A5;
}

.login-footer button{
    width: 100%;
    height: 48px;
    border-radius: 15px;
    background: #0A58A5;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
    border: none;
    cursor: pointer;
}

/* Alertes inline dans les formulaires auth */
.auth-inline-alert {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0 40px 16px;
}

.auth-inline-alert i {
    font-size: 15px;
    flex-shrink: 0;
}

.auth-inline-alert--error {
    background: #FEF2F2;
    border: 1px solid #FECACA;
    color: #991B1B;
}

.auth-inline-alert--error i {
    color: #EF4444;
}

.auth-inline-alert--success {
    background: #ECFDF5;
    border: 1px solid #A7F3D0;
    color: #065F46;
}

/* OTP verify page */
.otp-header {
    text-align: center;
    padding: 24px 40px 0;
}

.otp-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: #EEF5FF;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    font-size: 22px;
    color: #0A58A5;
}

.otp-title {
    color: #0F172B;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
}

.otp-subtitle {
    color: #62748E;
    font-size: 13px;
    line-height: 1.6;
    margin-bottom: 0;
}

.login-form-content-inner{
    padding: 40px;
    width: 600px;
}

.login-form-container{
  width: 600px;
}

.login-form-container{
  padding: 40px;
  padding-top: 0;
  padding-bottom: 0;
}

.back-link{
    display: flex;
    align-items: center;
    gap: 10px;
    border: none;
    color: #62748E;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
}

.login-form-title{
    color: #0F172B;
    text-align: center;
    font-size: 30px;
    font-style: normal;
    font-weight: 800;
    line-height: 36px; /* 120% */
    margin: 20px 0;
}


.password-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.forgot-password-link{
    color: #0A58A5;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
}

.password-input-wrapper{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 44px;
}

.password-input-wrapper input{
    width: 95%;
    border: none;
    background: transparent;
}

.password-input-wrapper button{
    border: none;
    background: transparent;
    cursor: pointer;
}

.password-toggle-button i{
    color: #62748E;
}

.password-reset-alert {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 12px;
    background: #FEF2F2;
    border: 1px solid #FECACA;
    margin-bottom: 16px;
}

.password-reset-alert i {
    color: #EF4444;
    font-size: 16px;
    flex-shrink: 0;
}

.password-reset-alert span {
    color: #991B1B;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
}

.form-input-error {
    border-color: #EF4444 !important;
}

.form-field-error {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 6px 0 0;
    color: #DC2626;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
}

.form-field-error i {
    font-size: 12px;
    flex-shrink: 0;
}

.login-submit-button{
    border-radius: 15px;
    background: var(--Color-2, #0A58A5);
    width: 100%;
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 114.286% */
    height: 48px;
    border: none;
    cursor: pointer;
}

.social-login-buttons{
    height: 44px;
    margin-top: 20px;
}

.login-form-content-inner .divider{
    border: .5px solid #DFE5EC;
    margin: 20px 0;
}

.google-button, .google{
    width: 100%;
    height: 44px;
    border-radius: 15px;
    color: #45556C;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 114.286% */
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #DFE5EC;
}

.login-form{
    width: 100%;
    margin-top: 20px;
}

.cgu-checkbox{
    display: flex;
    align-items: center;
    gap: 10px;
}

.cgu-checkbox-label a{
    color: #0A58A5;
}

.login-submit-button:disabled{
    opacity: 0.5;
    cursor: not-allowed;
}

.login-form-nav-section{
    margin-top: 20px;
}

.login-form-nav{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid #DFE5EC;
}

.login-form-nav button{
    border: none;
    background: transparent;
    cursor: pointer;
    width: 50%;
    padding: 8px 0;
    color: var(--Color2, #6E7F93);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 137.5% */
}

.login-form-nav-button.active{
    color: var(--Color-2, #0A58A5);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 137.5% */
    border-bottom: 1.5px solid var(--Color-2, #0A58A5);
}

.phone-input-wrapper{
    display: flex;
    align-items: center;
    gap: 0;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 44px;
    overflow: hidden;
    font-size: 14px;
    font-weight: 500;
}

.phone-country-select{
    flex-shrink: 0;
    height: 100%;
    border: none;
    border-right: 1px solid #DFE5EC;
    background: #ECEEF1;
    padding: 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: #22364D;
    cursor: pointer;
    outline: none;
    appearance: auto;
    min-width: 90px;
}

.phone-number-input{
    flex: 1;
    height: 100%;
    border: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px;
}

.phone-input-wrapper input{
    flex: 1;
    border: none;
    background: transparent;
    padding: 0 12px;
}

  .email-sent-section {
    text-align: center;
    padding: 40px 20px;
    width: 95%;
    margin: 0 auto;
  }

  .email-sent-icon {
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
  }

  .email-sent-instructions {
    background-color: #F8F9FA;
    border-radius: 8px;
    padding: 24px;
    margin: 30px 0;
    text-align: left;
  }

  .instruction-text {
    color: #223245;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 16px;
  }

  .instruction-list {
    color: #6E7F93;
    font-size: 14px;
    line-height: 1.8;
    padding-left: 20px;
    margin: 0;
  }

  .instruction-list li {
    margin-bottom: 8px;
  }

  .email-sent-help {
    display: flex;
    flex-direction: column;
    padding: 22px 54px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 15px;
    background: #F6F7F8;
    margin: 30px 0;
  }

  .email-sent-help h4{
    color: var(--Color-2, #0A58A5);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 27px; /* 168.75% */
  }

  .email-sent-help p{
    color: var(--Color2, #6E7F93);
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 27px;
  }

  .email-sent-actions {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
  }

  .resend-email-form {
    width: 100%;
    max-width: 300px;
  }

  .resend-email-button {
    width: 100%;
    background-color: #0A58A5;
    color: #ffffff;
    border: none;
    border-radius: 15px;
    padding: 14px 24px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease;
    font-family: 'Open Sans', Arial, sans-serif;
  }

  .email-sent-actions p{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 27px; /* 192.857% */
  }

  .resend-email-button:hover {
    background-color: #0C6BC2;
  }

  .resend-email-button:active {
    transform: translateY(1px);
  }

  .back-to-login-link {
    color: var(--Color0, #445972);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 27px; /* 192.857% */
  }

  .back-to-login-link:hover {
    color: #0C6BC2;
    text-decoration: underline;
  }

  .login-title{
    color: var(--Color1, #223245);
    font-size: 24px;
    font-weight: 700;
  }

  .login-subtitle{
    color: var(--Color0, #445972);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 27px; /* 168.75% */
    margin-top: 27px;
  }

  .login-form-nav-section{
    margin-bottom: 20px;
  }

@media (max-width: 768px) {

  .login-form-container{
    padding: 15px;
  }

  .login-form-container{
    width: 100%;
  }

  .login-form-title-section{
    padding: 20px;
  }

  .login-container{
    width: 95%;
    margin: 0 auto;
    justify-content: start;
    margin-top: 80px;

  }

  .profile-options, .email-sent-section{
    padding: 20px;
  }

  .login-footer{
    padding: 0 20px;
  }

  .login-form-content-inner{
    width: 100%;
    padding: 20px;
  }

  .login-container .login-content{
    max-height: 75vh;
  }

  .password-input-wrapper input {
    width: 92%;
  }

}
.idee-main-content {
    display: flex;
    flex-direction: row-reverse;
    gap: 26px;
}

.idee-tab-container-content{
    border-radius: 15px;
    background: #FFF;
    /* gr1 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.idee-top{
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 30%;
}

.idee-du-jour-card{
    height: 250px;
    padding: 20px;
    border-radius: 20px 20px 0 0;
    background-size: cover;
    background-position: center center !important;
}

span.idee-du-jour-card-text {
    border-radius: 20px;
    background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
    padding: 6px 12px;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 120% */
}

.idee-tab-content{
    padding: 25px;
}

.idee-title{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 100% */
}

.idee-description{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 157.143% */
    margin-top: 15px;
}

.idee-metadata{
    margin-top: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.idee-metadata-item{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    color: #6A7282;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 166.667% */
    padding: 0 15px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.idee-metadata-item.categ{
    border-radius: 30px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: rgba(10, 88, 165, 0.06);
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px; /* 160% */
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.idee-problem-opportunity{
    margin-top: 15px;
    display: flex;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 24px;
    gap: 15px;
}

.idee-section-title{
    color: #223245;
font-family: "Open Sans";
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 28px; /* 155.556% */
}

.idee-section{}

.idee-section p{
    color: #4A5565;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22.75px; /* 162.5% */
}

.idee-tabs{
    margin-top: 20px;
    border-radius: 10px;
border: 1px solid var(--stroke-1, #DFE5EC);
background: #F6F7F8;
width: 100%;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
padding: 4px;
}

.idee-tab{
    width: 33%;
    border: none;
    height: 100%;
    color: var(--Color-3, #B5C1D0);
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 20px; /* 166.667% */
}

.idee-tab.active{
    border-radius: 8px;
    background: #0A58A5;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 166.667% */
}

.idee-tab-panel-content{
    margin-top: 15px;
}

.idee-tab-container{
    width: 70%;
}

.idee-interest-card{
    border-radius: 20px;
background: #223245;
padding: 20px;
color: #fff;
}

.idee-interest-card h3{
    color: #FFF;
font-family: "Open Sans";
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 28px; /* 155.556% */
}

.idee-interest-card p{
    color: #D1D5DC;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 18px; /* 150% */
margin: 10px 0;
}

.idee-interest-card a{
    display: flex;
    width: 100%;
    border-radius: 14px;
    background: #0A58A5;
    height: 42px;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
}

.idee-validation-header{
    border-radius: 16px;
border: 1px solid var(--stroke-1, #DFE5EC);
background: var(--kkkk, linear-gradient(178deg, #DFE5EC -8.86%, #FFF 49.74%));

/* gr1 */
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
padding: 0 30px;
height: 70px;
display: flex;
align-items: center;
gap: 15px;
}

.idee-validation-header span{
    color: #59B224;
    text-align: center;
    font-family: "Open Sans";
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 114.286% */
}

.idee-validation-header h4{
    color: var(--Color0, #445972);
font-family: "Open Sans";
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 100% */
text-transform: uppercase;
}

.idee-validation-item{
    border-radius: 20px;
border: 1px solid #DFE5EC;
background: #FFF;

/* gr2 */
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
padding: 20px;
margin-top: 20px;
}

.idee-validation-item h5{
    color: #223245;
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 142.857% */
letter-spacing: 0.35px;
text-transform: uppercase;
margin-bottom: 20px;
}

.idee-progress-bar-test{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.idee-progress-bar-test span{
    color: #4A5565;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
}

.idee-validation-label{
    color: #223245;
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 142.857% */
}

.idee-entrepreneurs-count{
    color: #6A7282;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}

.idee-archives-section{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    
    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    padding: 20px;
    margin-top: 20px;
    height: 300px;
    overflow: scroll;
}

.idee-archives-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.concept-section{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.concept-section h3{
    color: var(--Color1, #223245);
font-family: "Open Sans";
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 28px; /* 155.556% */
}

.concept-section p{
    color: var(--Color2, #6E7F93);
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 22px; /* 157.143% */
}

.ssauce{
    border-radius: 10px;
border: 1px solid rgba(255, 153, 1, 0.20);
background: rgba(255, 153, 1, 0.10);
margin-top: 15px;
padding: 20px;
}

.ssauce h3{
    color: var(--Color1, #223245);
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 18px; /* 128.571% */
}

.ssauce p{
    color: var(--Color2, #6E7F93);
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 12px; /* 100% */
}

.mvp-section{
    margin-top: 15px;
    
    border-radius: 15px;
border: 1px solid var(--stroke-1, #DFE5EC);
padding: 20px;
}

.mvp-section h3{
    color: var(--Color1, #223245);
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 22px; /* 157.143% */
}

.mvp-section span{
    color: #223245;
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 20px; /* 142.857% */
}

.mvp-section p{
    color: #4A5565;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 133.333% */
}

/* ═══════════════════════════════════════════════════
   SECTION ICONES & SEPARATEUR (Problème / Opportunité)
   ═══════════════════════════════════════════════════ */

.idee-section{
    flex: 1;
}

.idee-section-icon{
    width: 40px;
    height: 40px;
    margin-bottom: 10px;
}

.idee-section-separator{
    width: 1px;
    background: #DFE5EC;
    align-self: stretch;
}

/* ═══════════════════════════════════════════════════
   USP LIST (Secret Sauce)
   ═══════════════════════════════════════════════════ */

.idee-usp-list{
    list-style: none;
    padding: 0;
    margin: 10px 0 0 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.idee-usp-list li{
    color: #4A5565;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    padding-left: 16px;
    position: relative;
}

.idee-usp-list li::before{
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #FF9901;
}

.idee-usp-list li strong{
    color: #223245;
    font-weight: 700;
}

/* ═══════════════════════════════════════════════════
   VALIDATION — Score, Progress bars
   ═══════════════════════════════════════════════════ */

.idee-validation-section{
    display: flex;
    flex-direction: column;
    gap: 0;
}

.idee-validation-item-test{
    margin-bottom: 0;
}

.idee-validation-percent{
    color: #59B224;
    text-align: center;
    font-family: "Open Sans";
    font-size: 28px;
    font-weight: 700;
    line-height: 32px;
}

.idee-progress-bar{
    width: 100%;
    height: 8px;
    border-radius: 4px;
    background: #EDF0F3;
    overflow: hidden;
    margin-bottom: 14px;
}

.idee-progress-fill{
    height: 100%;
    border-radius: 4px;
    transition: width 0.6s ease-out;
}

/* ═══════════════════════════════════════════════════
   ARCHIVES — Items sidebar
   ═══════════════════════════════════════════════════ */

.idee-section-heading{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    margin: 0;
}

.idee-archives-link{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.idee-archives-link:hover{
    text-decoration: underline;
}

.idee-archives-list{
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 12px;
}

.idee-archive-item{
    display: block;
    padding: 12px;
    border-bottom: 1px solid #EDF0F3;
    text-decoration: none;
    transition: background 0.2s;
    border-radius: 8px;
}

.idee-archive-item:last-child{
    border-bottom: none;
}

.idee-archive-item:hover{
    background: #F6F7F8;
    
}

.idee-archive-category{
    color: #6A7282;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.idee-archive-title{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    margin-top: 4px;
}

/* ═══════════════════════════════════════════════════
   BUSINESS MODEL — Investment / ROI Cards
   ═══════════════════════════════════════════════════ */

.idee-investment-roi-cards{
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
}

.idee-investment-card,
.idee-roi-card{
    flex: 1;
    border-radius: 16px;
    border: 1px solid #DFE5EC;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.idee-investment-card{
    background: linear-gradient(135deg, #EFF6FF 0%, #F0F4FF 100%);
}

.idee-roi-card{
    background: linear-gradient(135deg, #ECFDF5 0%, #F0FDF4 100%);
}

.idee-card-label{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.idee-card-amount{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
    line-height: 28px;
}

.idee-roi-amount{
    color: #059669;
}

/* ═══════════════════════════════════════════════════
   BUSINESS MODEL — Structure Financière Mensuelle
   ═══════════════════════════════════════════════════ */

.idee-monthly-financial{
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 12px;
    border-radius: 12px;
    border: 1px solid #DFE5EC;
    overflow: hidden;
}

.idee-financial-item{
    padding: 14px 20px;
    border-bottom: 1px solid #EDF0F3;
}

.idee-financial-item:last-child{
    border-bottom: none;
}

.idee-financial-item.idee-revenue{
    background: rgba(5, 150, 105, 0.04);
}

.idee-financial-item.idee-expense{
    background: rgba(239, 68, 68, 0.04);
}

.idee-financial-item.idee-margin{
    background: linear-gradient(135deg, #EFF6FF 0%, #EEF2FF 100%);
    border-top: 2px solid #0A58A5;
}

.idee-financial-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.idee-financial-label{
    color: #445972;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
}

.idee-financial-value{
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
}

.idee-financial-value.idee-positive{
    color: #059669;
}

.idee-financial-value.idee-negative{
    color: #EF4444;
}

.idee-financial-value.idee-margin-value{
    color: #0A58A5;
}

.idee-financial-detail{
    color: #6A7282;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 4px;
}

/* ═══════════════════════════════════════════════════
   PLAN D'ACTION — Timeline
   ═══════════════════════════════════════════════════ */

.idee-action-plan{
    padding: 20px;
}

.idee-timeline{
    position: relative;
    padding-left: 28px;
}

.idee-timeline::before{
    content: "";
    position: absolute;
    left: 8px;
    top: 6px;
    bottom: 6px;
    width: 2px;
    background: linear-gradient(180deg, #0A58A5 0%, #3B82F6 100%);
    border-radius: 1px;
}

.idee-timeline-item{
    position: relative;
    padding-bottom: 24px;
}

.idee-timeline-item:last-child{
    padding-bottom: 0;
}

.idee-timeline-dot{
    position: absolute;
    left: -24px;
    top: 4px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #FFF;
    border: 3px solid #0A58A5;
    z-index: 1;
}

.idee-timeline-item:first-child .idee-timeline-dot{
    background: #0A58A5;
    border-color: #0A58A5;
}

.idee-timeline-content{
    padding-left: 8px;
}

.idee-timeline-title{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}

.idee-timeline-description{
    color: #445972;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

/* ═══════════════════════════════════════════════════
   MODAL DE PARTAGE
   ═══════════════════════════════════════════════════ */

.share-modal{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.share-modal-overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(34, 50, 69, 0.5);
    backdrop-filter: blur(4px);
}

.share-modal-content{
    position: relative;
    z-index: 1;
    width: 480px;
    max-width: 90vw;
    border-radius: 20px;
    background: #FFF;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    padding: 28px;
    animation: chatScaleIn 0.3s ease-out;
}

.share-modal-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.share-modal-header h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    margin: 0;
}

.share-modal-close{
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #6A7282;
    transition: background 0.2s;
}

.share-modal-close:hover{
    background: #F6F7F8;
}

.share-modal-body label{
    display: block;
    color: #445972;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 8px;
}

.share-link-section{
    margin-bottom: 20px;
}

.share-link-input-group{
    display: flex;
    gap: 8px;
}

.share-link-input{
    flex: 1;
    height: 42px;
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    background: #F6F7F8;
    padding: 0 14px;
    font-family: "Open Sans";
    font-size: 13px;
    color: #445972;
    outline: none;
}

.share-copy-button{
    height: 42px;
    padding: 0 20px;
    border-radius: 10px;
    border: none;
    background: #0A58A5;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}

.share-copy-button:hover{
    background: #084a8a;
}

.share-social-buttons{
    display: flex;
    gap: 10px;
}

.share-social-button{
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 42px;
    border-radius: 10px;
    text-decoration: none;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    color: #FFF;
    transition: opacity 0.2s;
}

.share-social-button:hover{
    opacity: 0.85;
}

.share-social-button.facebook{
    background: #1877F2;
}

.share-social-button.twitter{
    background: #1DA1F2;
}

.share-social-button.linkedin{
    background: #0A66C2;
}

.share-social-button.whatsapp{
    background: #25D366;
}

/* ═══════════════════════════════════════════════════
   ARCHIVES IDÉES DU JOUR — Hero
   ═══════════════════════════════════════════════════ */

.archives-idj-hero{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 20px;
}

.archives-idj-hero-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.archives-idj-hero-title{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
}

.archives-idj-hero-description{
    margin-top: 10px;
    color: #DBEAFE;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.archives-idj-hero-stats{
    display: flex;
    gap: 10px;
}

.archives-idj-stat{
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(0, 0, 0, 0.10);
    padding: 12px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 100px;
}

.archives-idj-stat-value{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
}

.archives-idj-stat-label{
    color: #BEDBFF;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.archives-idj-search{
    margin-top: 20px;
}

.archives-idj-search-bar{
    border-radius: 12px;
    background: #FFF;
    height: 44px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    gap: 10px;
}

.archives-idj-search-bar i{ color: #6E7F93; font-size: 15px; }

.archives-idj-search-bar input{
    height: 100%;
    width: 100%;
    border: none;
    border-radius: 12px;
    font-family: "Open Sans";
    font-size: 14px;
    color: #223245;
}

.archives-idj-search-bar input:focus{ outline: none; }

/* ═══════════════════════════════════════════════════
   ARCHIVES IDÉES DU JOUR — Filters
   ═══════════════════════════════════════════════════ */

.archives-idj-filters{
    margin: 17px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.archives-idj-filter-dropdown-wrap{
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 6px 12px 6px 12px;
}

.archives-idj-filter-icon{
    color: #6E7F93;
    font-size: 13px;
    flex-shrink: 0;
}

.archives-idj-filter-select{
    appearance: none;
    -webkit-appearance: none;
    border: none;
    outline: none;
    background: transparent;
    color: #223245;
    font-size: 13px;
    font-weight: 500;
    font-family: "Open Sans";
    cursor: pointer;
    padding-right: 20px;
    min-width: 160px;
}

.archives-idj-filter-chevron{
    color: #6E7F93;
    font-size: 11px;
    pointer-events: none;
    flex-shrink: 0;
    margin-left: -18px;
}

.archives-idj-results-count{
    color: #6E7F93;
    font-size: 13px;
    font-family: "Open Sans";
    font-weight: 500;
    white-space: nowrap;
}

/* ═══════════════════════════════════════════════════
   ARCHIVES IDÉES DU JOUR — Grid & Cards
   ═══════════════════════════════════════════════════ */

.archives-idj-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.archives-idj-card{
    border-radius: 16px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    overflow: hidden;
    text-decoration: none;
    transition: all .25s ease;
    display: flex;
    flex-direction: column;
}

.archives-idj-card:hover{
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
    border-color: #0A58A5;
}

.archives-idj-card-image{
    height: 160px;
    background-size: cover;
    background-position: center;
    position: relative;
}

.archives-idj-card-overlay{
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(22, 25, 33, 0.50) 0%, rgba(22, 25, 33, 0.10) 100%);
    display: flex;
    align-items: flex-end;
    padding: 12px;
}

.archives-idj-card-badge{
    border-radius: 20px;
    background: linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%);
    padding: 4px 10px;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700;
    line-height: 14px;
}

.archives-idj-card-body{
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.archives-idj-card-top{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.archives-idj-card-category{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.archives-idj-card-date{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
}

.archives-idj-card-title{
    color: #223245;
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
    margin: 0;
}

.archives-idj-card-desc{
    color: #4A5565;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 19px;
    margin: 0;
}

.archives-idj-card-footer{
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid #EDF0F3;
}

.archives-idj-card-meta{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
}

.archives-idj-card-meta i{
    font-size: 11px;
    color: #9CA3AF;
}

.archives-idj-card-score{
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    margin-left: auto;
}

/* Empty & No Results */

.archives-idj-empty{
    grid-column: 1 / -1;
    text-align: center;
    padding: 60px 20px;
    color: #6E7F93;
    font-family: "Open Sans";
}

.archives-idj-empty i{
    font-size: 40px;
    color: #0A58A5;
    margin-bottom: 16px;
    display: block;
}

.archives-idj-no-results{
    text-align: center;
    padding: 40px 20px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.archives-idj-no-results i{ color: #9CA3AF; }

/* ═══════════════════════════════════════════════════
   ANIMATIONS — Idée du Jour
   ═══════════════════════════════════════════════════ */

/* Header */
.tendances-page-header{
    animation: fadeUp 0.4s ease-out both;
}

/* Interest Card */
.idee-interest-card{
    animation: scaleIn 0.5s ease-out 0.1s both;
}

/* Sidebar */
.idee-sidebar{
    animation: fadeUp 0.4s ease-out 0.2s both;
}

/* Image Card */
.idee-du-jour-card{
    animation: scaleIn 0.5s ease-out 0.15s both;
}

/* Tab Content */
.idee-intro-section{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

/* Problem & Opportunity */
.idee-section:nth-child(1){ animation: fadeUp 0.4s ease-out 0.3s both; }
.idee-section:nth-child(2){ animation: fadeUp 0.4s ease-out 0.4s both; }

/* Tabs */
.idee-tabs{
    animation: fadeUp 0.3s ease-out 0.35s both;
}

/* Tab panels */
.idee-tab-panel{
    animation: fadeUp 0.3s ease-out both;
}

/* Secret Sauce items */
.idee-usp-list li:nth-child(1){ animation: fadeUp 0.3s ease-out 0.1s both; }
.idee-usp-list li:nth-child(2){ animation: fadeUp 0.3s ease-out 0.15s both; }
.idee-usp-list li:nth-child(3){ animation: fadeUp 0.3s ease-out 0.2s both; }
.idee-usp-list li:nth-child(4){ animation: fadeUp 0.3s ease-out 0.25s both; }
.idee-usp-list li:nth-child(5){ animation: fadeUp 0.3s ease-out 0.3s both; }

/* Financial cards */
.idee-investment-card{ animation: scaleIn 0.4s ease-out 0.1s both; }
.idee-roi-card{ animation: scaleIn 0.4s ease-out 0.2s both; }
.idee-financial-item:nth-child(1){ animation: fadeUp 0.3s ease-out 0.25s both; }
.idee-financial-item:nth-child(2){ animation: fadeUp 0.3s ease-out 0.3s both; }
.idee-financial-item:nth-child(3){ animation: fadeUp 0.3s ease-out 0.35s both; }

/* Timeline items */
.idee-timeline-item:nth-child(1){ animation: fadeUp 0.3s ease-out 0.1s both; }
.idee-timeline-item:nth-child(2){ animation: fadeUp 0.3s ease-out 0.2s both; }
.idee-timeline-item:nth-child(3){ animation: fadeUp 0.3s ease-out 0.3s both; }
.idee-timeline-item:nth-child(4){ animation: fadeUp 0.3s ease-out 0.4s both; }
.idee-timeline-item:nth-child(5){ animation: fadeUp 0.3s ease-out 0.5s both; }
.idee-timeline-item:nth-child(6){ animation: fadeUp 0.3s ease-out 0.6s both; }

/* Archives items */
.idee-archive-item:nth-child(1){ animation: fadeUp 0.3s ease-out 0.3s both; }
.idee-archive-item:nth-child(2){ animation: fadeUp 0.3s ease-out 0.35s both; }
.idee-archive-item:nth-child(3){ animation: fadeUp 0.3s ease-out 0.4s both; }
.idee-archive-item:nth-child(4){ animation: fadeUp 0.3s ease-out 0.45s both; }
.idee-archive-item:nth-child(5){ animation: fadeUp 0.3s ease-out 0.5s both; }

/* Validation bars */
.idee-progress-fill{
    animation: progressFill 0.8s ease-out 0.4s both;
}

@keyframes progressFill {
    from { width: 0%; }
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — Mobile & Tablet (max-width: 768px)
   ═══════════════════════════════════════════════════ */

@media (max-width: 768px){
    .idee-main-content{
        flex-direction: column-reverse;
    }

    .idee-tab-container,
    .idee-top{
        width: 100%;
    }

    .idee-problem-opportunity{
        flex-direction: column;
    }

    .idee-section-separator{
        width: 100%;
        height: 1px;
    }

    .idee-investment-roi-cards{
        flex-direction: column;
    }

    .idee-title{
        font-size: 18px;
    }

    .idee-metadata{
        flex-wrap: wrap;
    }

    .idee-tabs{
        height: auto;
        flex-wrap: wrap;
    }

    .idee-tab{
        width: auto;
        flex: 1;
        font-size: 11px;
        padding: 8px 4px;
    }

    .share-social-buttons{
        flex-wrap: wrap;
    }

    .share-social-button{
        flex: 1 1 calc(50% - 5px);
    }

    .share-social-button span{
        display: none;
    }

    .idee-timeline{
        padding-left: 24px;
    }

    .idee-tab-content{
        padding: 15px;
    }

    .idee-du-jour-card{
        height: 120px;
    }

    .archives-idj-hero-content{
        flex-direction: column;
        align-items: flex-start;
    }

    .archives-idj-hero-stats{
        width: 100%;
    }

    .archives-idj-stat{ flex: 1; }

    .archives-idj-filters{
        flex-direction: column;
        align-items: flex-start;
    }

    .archives-idj-filter-dropdown-wrap{
        width: 100%;
    }

    .archives-idj-filter-select{
        width: 100%;
    }

    .archives-idj-grid{
        grid-template-columns: 1fr;
    }

    .archives-idj-card-image{
        height: 120px;
    }
}
/* ========================================
   Structure Registration Styles
   ======================================== */

/* Step Indicator */
.structure-steps-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0 40px;
  margin-bottom: 10px;
  width: 100%;
}

.structure-step-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.structure-step-circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  flex-shrink: 0;
  transition: all 0.3s ease;
}

.structure-step-item.upcoming .structure-step-circle {
  background: #F6F7F8;
  color: #6E7F93;
  border: 1px solid #DFE5EC;
}

.structure-step-item.active .structure-step-circle {
  background: #0A58A5;
  color: #FFF;
  border: 1px solid #0A58A5;
}

.structure-step-item.completed .structure-step-circle {
  background: #E8F5E9;
  color: #2E7D32;
  border: 1px solid #2E7D32;
}

.structure-step-label {
  color: #6E7F93;
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  white-space: nowrap;
}

.structure-step-item.active .structure-step-label {
  color: #0A58A5;
  font-weight: 700;
}

.structure-step-item.completed .structure-step-label {
  color: #2E7D32;
  font-weight: 600;
}

.structure-step-line {
  width: 40px;
  height: 2px;
  background: #DFE5EC;
  margin: 0 8px;
  flex-shrink: 0;
  transition: background 0.3s ease;
}

.structure-step-item.completed + .structure-step-line,
.structure-step-line.completed {
  background: #2E7D32;
}

/* Structure Form Content */
.structure-form-content {
  padding: 30px 40px;
}

.structure-form-title {
  color: #0F172B;
  font-size: 22px;
  font-weight: 800;
  line-height: 28px;
  margin: 0 0 4px 0;
}

.structure-form-subtitle {
  color: #6E7F93;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  margin: 0 0 24px 0;
}

/* Form Row (side-by-side fields) */
.form-row {
  display: flex;
  gap: 16px;
}

.form-row .form-group {
  flex: 1;
}

/* Form Help Text */
.form-help-text {
  color: #6E7F93;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  margin-top: 4px;
}

/* Navigation Buttons */
.structure-nav-buttons {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 40px;
  border-top: 1px solid #DFE5EC;
}

.structure-back-button {
  display: flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: 1px solid #DFE5EC;
  border-radius: 12px;
  padding: 10px 20px;
  color: #45556C;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
}

.structure-back-button:hover {
  background: #F6F7F8;
  border-color: #C5CDD8;
}

.structure-next-button {
  border-radius: 12px;
  background: #0A58A5;
  color: #FFF;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  padding: 12px 32px;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.structure-next-button:hover {
  background: #084A8A;
}

.structure-next-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Team Members Section */
.team-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.team-section-title {
  color: #0F172B;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.team-member-count {
  background: #F0F7FF;
  color: #0A58A5;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 20px;
}

.add-member-form {
  background: #F6F7F8;
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 20px;
}

.add-member-form .form-group {
  margin-bottom: 12px;
}

.add-member-form .form-label {
  font-size: 13px;
}

.add-member-button {
  width: 100%;
  padding: 10px;
  border-radius: 10px;
  background: #0A58A5;
  color: #FFF;
  font-size: 14px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background 0.2s ease;
}

.add-member-button:hover {
  background: #084A8A;
}

/* Member Item */
.member-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid #E2E8F0;
  background: #FFF;
  margin-bottom: 10px;
  transition: all 0.2s ease;
}

.member-item:hover {
  border-color: #C5CDD8;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.member-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0A58A5, #1976D2);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.member-avatar span {
  color: #FFF;
  font-size: 14px;
  font-weight: 700;
}

.member-info {
  flex: 1;
  min-width: 0;
}

.member-name {
  color: #0F172B;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  display: block;
}

.member-role {
  color: #0A58A5;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  display: block;
}

.member-contact {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 4px;
}

.member-contact span {
  font-size: 12px;
  color: #6E7F93;
}

.member-contact i {
  margin-right: 4px;
  font-size: 11px;
}

.member-actions {
  flex-shrink: 0;
}

.remove-member-button {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
  background: #FFF;
  color: #6E7F93;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  text-decoration: none;
}

.remove-member-button:hover {
  background: #FEE2E2;
  border-color: #FCA5A5;
  color: #DC2626;
}

.members-empty {
  text-align: center;
  color: #6E7F93;
  padding: 24px;
  font-size: 14px;
  background: #F6F7F8;
  border-radius: 12px;
}

.members-list {
  max-height: 300px;
  overflow-y: auto;
}

/* Recap Section */
.recap-container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.recap-card {
  border-radius: 16px;
  border: 1px solid #E2E8F0;
  background: #FFF;
  overflow: hidden;
}

.recap-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  background: #F8FAFC;
  border-bottom: 1px solid #E2E8F0;
}

.recap-card-title {
  color: #0F172B;
  font-size: 14px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
}

.recap-card-title i {
  color: #0A58A5;
  font-size: 14px;
}

.recap-edit-link {
  color: #0A58A5;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 4px;
}

.recap-edit-link:hover {
  text-decoration: underline;
}

.recap-card-body {
  padding: 16px 20px;
}

.recap-row {
  display: flex;
  align-items: flex-start;
  padding: 8px 0;
  border-bottom: 1px solid #F1F5F9;
}

.recap-row:last-child {
  border-bottom: none;
}

.recap-label {
  color: #6E7F93;
  font-size: 13px;
  font-weight: 500;
  width: 140px;
  flex-shrink: 0;
}

.recap-value {
  color: #0F172B;
  font-size: 13px;
  font-weight: 600;
  flex: 1;
}

.recap-members-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.recap-members-list li {
  color: #45556C;
  font-size: 13px;
  padding: 4px 0;
  display: flex;
  align-items: center;
  gap: 6px;
}

.recap-members-list li::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #0A58A5;
  flex-shrink: 0;
}

/* Finalize Button */
.structure-finalize-button {
  width: 100%;
  border-radius: 15px;
  background: #0A58A5;
  color: #FFF;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  height: 48px;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease;
}

.structure-finalize-button:hover {
  background: #084A8A;
}

/* Responsive */
@media (max-width: 768px) {
  .structure-steps-indicator {
    padding: 0 16px;
    gap: 0;
  }

  .structure-step-label {
    display: none;
  }

  .structure-step-line {
    width: 24px;
  }

  .structure-form-content {
    padding: 20px;
  }

  .form-row {
    flex-direction: column;
    gap: 0;
  }

  .structure-nav-buttons {
    padding: 16px 20px;
  }

  .structure-back-button {
    padding: 10px 16px;
    font-size: 13px;
  }

  .structure-next-button {
    padding: 10px 24px;
    font-size: 13px;
  }

  .recap-row {
    flex-direction: column;
    gap: 4px;
  }

  .recap-label {
    width: auto;
  }

  .add-member-form {
    padding: 16px;
  }
}
/* ========== Admin Login ========== */

.admin-login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #0F172B 0%, #1e293b 50%, #334155 100%);
  padding: 2rem;
}

.admin-login-card {
  width: 100%;
  max-width: 420px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  padding: 2.5rem;
}

.admin-login-header {
  text-align: center;
  margin-bottom: 2rem;
}

.admin-login-logo {
  margin-bottom: 1.25rem;
}

.admin-login-logo img {
  height: 48px;
  width: auto;
}

.admin-login-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #0F172B;
  margin: 0 0 0.5rem;
}

.admin-login-subtitle {
  font-size: 0.9rem;
  color: #64748b;
  margin: 0;
}

.admin-login-form {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.admin-form-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.admin-form-label {
  font-size: 0.875rem;
  font-weight: 600;
  color: #334155;
}

.admin-form-input {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  font-size: 1rem;
  color: #0F172B;
  background: #f8fafc;
  box-sizing: border-box;
  transition: border-color 0.2s, background 0.2s;
}

.admin-form-input:focus {
  outline: none;
  border-color: #0A58A5;
  background: #fff;
}

.admin-form-input::placeholder {
  color: #94a3b8;
}

.admin-login-submit {
  margin-top: 0.5rem;
  width: 100%;
  padding: 0.875rem 1.25rem;
  background: #0A58A5;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  transition: background 0.2s;
}

.admin-login-submit:hover {
  background: #084a8f;
}

.admin-login-footer {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e2e8f0;
  text-align: center;
}

.admin-login-back {
  font-size: 0.9rem;
  color: #64748b;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: color 0.2s;
}

.admin-login-back:hover {
  color: #0A58A5;
}

/* ========== Admin Dashboard (index) ========== */

.admin-main{
  display: flex;
  align-items: start;
  justify-content: start;
}

.admin-content{
  width: 100%;
}

/* ========== Admin Sidebar ========== */

.admin-sidebar{
  width: 350px;
  height: 100%;
  background-color: #fff;
  border-right: 1px solid #e2e8f0;
  border-right: 1px solid #1E2939;
  background: #1A2333;
  display: flex;
  flex-direction: column;
}

.admin-sidebar-header{
  padding: 20px;
}

.admin-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
  border-bottom: 1px solid #E6EAF0;
  background: #FFF;
  height: 85px;
}

.search-content{
  border-radius: 16777200px;
  border: 1px solid #E5E7EB;
  background: #F9FAFB;
  width: 448px;
  height: 36px;
  padding: 4px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.search-content input{
  border: none;
  background: transparent;
  width: 100%;
  height: 100%;
  outline: none;
  font-size: 14px;
  color: #64748B;
}

.admin-header-right{
  display: flex;
  align-items: center;
  gap: 30px;
}

.user-content{
  display: flex;
  border-radius: 16777200px;
  border: 1px solid #E5E7EB;
  padding: 6px 17px 6px 9px;
  align-items: center;
  gap: 10px;
}

.user-content img{
  width: 30px;
  height: 30px;
}

.user-content span{
  color: #364153;
  text-align: center;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
}

.notifications-content{
  position: relative;
}

.notifications-content span{
  color: #fff;
  text-align: center;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
  position: absolute;
  top: -10px;
    right: -8px;
  background-color: #FC121B;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.admin-content-inner{
  padding: 20px;
  overflow: scroll;
  height: calc(100vh - 85px);
}

.admin-activities-table-actor{
  display: flex;
  gap: 10px;
  flex-direction: column;
}

.admin-activities-table-actor span:first-child{
  color: #0F172B;
  font-family: "Open Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
}

.admin-activities-table-actor span:last-child{
  color: #62748E;
  font-family: "Open Sans";
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px; /* 133.333% */
}

.admin-dashboard-title{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}

.admin-dashboard-title h1{
  color: #223245;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px; /* 133.333% */
}

.admin-dashboard-title a{
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #fff;
  background: #0A58A5;
  padding: 10px 20px;
  border-radius: 14px;
  font-size: 14px;
}

.admin-dashboard-title button{
  border-radius: 14px;
  border: 1px solid #DFE5EC;
  background: #F0F0F8;
  padding: 10px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-dashboard-title button span{
  color: #223245;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
}

/* ========== Period Filter Dropdown ========== */
.admin-dashboard-title-actions{
  display: flex;
  align-items: center;
  gap: 12px;
}

.admin-title-btn-secondary {
  background: #F0F0F8 !important;
  color: #223245 !important;
  border: 1px solid #DFE5EC;
}

.admin-export-btn{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 14px;
  border: 1px solid #DFE5EC;
  background: #0A58A5;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s;
}

.admin-export-btn:hover{
  background: #084a8f;
}

.admin-export-btn i{
  font-size: 14px;
}

.admin-period-filter{
  position: relative;
}

.admin-period-filter-btn{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 14px;
  border: 1px solid #DFE5EC;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  color: #445972;
  transition: border-color 0.2s, background 0.2s;
}

.admin-period-filter-btn:hover{
  border-color: #0A58A5;
  background: #F0F4FF;
}

.admin-period-filter-btn i:first-child{
  color: #0A58A5;
  font-size: 14px;
}

.admin-period-filter-arrow{
  font-size: 10px;
  color: #94A3B8;
  transition: transform 0.2s;
}

.admin-period-filter-menu.open .admin-period-filter-arrow{
  transform: rotate(180deg);
}

.admin-period-filter-menu{
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  min-width: 200px;
  padding: 6px;
  z-index: 100;
}

.admin-period-filter-menu.open{
  display: flex;
  flex-direction: column;
}

.admin-period-filter-option{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 14px;
  color: #445972;
  text-decoration: none;
  transition: background 0.15s;
  background: transparent !important;
  color: #0F172B !important;
}

.admin-period-filter-option:hover{
  background: #F0F4FF;
  color: #0A58A5;
}

.admin-period-filter-option.active{
  background: #EFF6FF !important;
  color: #0A58A5 !important;
  font-weight: 600;
}

.admin-period-filter-option i{
  font-size: 11px;
  color: #0A58A5;
}

.admin-dashboard-metrics{
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.admin-dashboard-metric{
  border-radius: 20px;
  border: 1px solid #E5E7EB;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
  padding: 20px;
  width: 25%;
}

.admin-dashboard-metric-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.admin-dashboard-metric-header h2{
  color: #6A7282;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
}

.admin-dashboard-metric-content{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

.admin-dashboard-metric-content h3{
  color: #223245;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px; /* 133.333% */
}

.admin-dashboard-metric-content-arrow span{
  color: #096;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px; /* 133.333% */
}

.admin-dashboard-graphs{
  margin-top: 20px;
  display: flex;
  align-items: stretch;
  gap: 20px;
}

.croissance-graph{
  width: 65%;
  border-radius: 20px;
  border: 1px solid #E2E8F0;
  background: #FFF;
  padding: 20px;
}

/* Conteneur à hauteur fixe pour éviter l'expansion infinie des graphiques Chart.js */
.admin-chart-container {
  position: relative;
  height: 280px;
  width: 100%;
}

.projects-graph{
  width: 35%;
  border-radius: 20px;
  border: 1px solid #E2E8F0;
  background: #FFF;
  padding: 20px;
}

.admin-chart-container{
  margin-top: 20px;
}

.admin-dashboard-graphs h2{
  color: #1D293D;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px; /* 155.556% */
}

.admin-dashboard-graphs p{
  color: #6E7F93;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px; /* 150% */
}

/* Tableau des activités récentes */
.admin-activities-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  margin-top: 20px;
}

.admin-activities-table th,
.admin-activities-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid #E2E8F0;
}

.admin-activities-table th {
  color: #6E7F93;
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.admin-activities-table td {
  color: #1D293D;
}

.admin-activities-empty {
  color: #6E7F93;
  font-style: italic;
  text-align: center;
  padding: 20px !important;
}

.admin-activities-table-container{
  align-items: stretch;
}

.admin-activities-table-actor-project-name{
  color: #62748E;
  font-size: 12px;
  font-style: italic !important;
  font-weight: 400;
  line-height: 16px; /* 133.333% */
}

.admin-activities-table-actor-action{
  font-size: 14px !important;
  color: #314158 !important;

}

.admin-activities-table-date{
  color: #62748E !important;
  font-family: "Open Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
}

.admin-sidebar-content{
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 25px;
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}

/* Sidebar profile block */
.admin-sidebar-profile{
  padding: 16px 20px;
  border-top: 1px solid rgba(255,255,255,0.1);
  margin-top: auto;
}

.admin-sidebar-profile-info{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.admin-sidebar-profile-avatar{
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(255,255,255,0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  flex-shrink: 0;
}

.admin-sidebar-profile-details{
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow: hidden;
}

.admin-sidebar-profile-name{
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-sidebar-profile-role{
  color: #62748E;
  font-size: 12px;
}

.admin-sidebar-profile-btn{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

.admin-sidebar-profile-arrow{
  color: #62748E;
  font-size: 12px;
  transition: transform 0.2s;
}

.admin-sidebar-dropdown{
  display: none;
  flex-direction: column;
  background: #253044;
  border-radius: 10px;
  padding: 6px;
  margin-top: 10px;
}

.admin-sidebar-dropdown.show{
  display: flex;
}

.admin-sidebar-dropdown-item{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  color: #C8D1DB;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  border: none;
  background: none;
  cursor: pointer;
  transition: background 0.2s;
}

.admin-sidebar-dropdown-item:hover{
  background: rgba(255,255,255,0.08);
  color: #fff;
}

.admin-sidebar-dropdown-item i{
  width: 16px;
  text-align: center;
  font-size: 13px;
}

.admin-sidebar-dropdown-divider{
  height: 1px;
  background: rgba(255,255,255,0.08);
  margin: 4px 0;
}

.admin-sidebar-dropdown-logout{
  color: #DC2626;
}

.admin-sidebar-dropdown-logout:hover{
  background: rgba(220, 38, 38, 0.15);
  color: #DC2626;
}

.admin-sidebar-content a{
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #62748E;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
  transition: color 0.2s;
}

.admin-sidebar-content a:hover{
  color: #C8D1DB;
}

.admin-sidebar-content > a.active{
  color: #fff;
  font-weight: 600;
}

/* ========== Sidebar Settings Dropdown ========== */

.admin-sidebar-settings{
  margin-top: 4px;
}

.admin-sidebar-settings-toggle{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  color: #62748E;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  transition: color 0.2s;
}

.admin-sidebar-settings-toggle:hover{
  color: #fff;
}

.admin-sidebar-settings-toggle.active{
  color: #fff;
}

.admin-sidebar-settings-left{
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-sidebar-settings-arrow{
  font-size: 11px;
  transition: transform 0.25s ease;
}

.admin-sidebar-settings-arrow.open{
  transform: rotate(180deg);
}

.admin-sidebar-settings-menu{
  display: none;
  flex-direction: column;
  gap: 2px;
  margin-top: 10px;
  padding-left: 10px;
}

.admin-sidebar-settings-menu.open{
  display: flex;
}

.admin-sidebar-settings-item{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  color: #62748E !important;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}

.admin-sidebar-settings-item:hover{
  background: rgba(255,255,255,0.06);
  color: #C8D1DB !important;
}

.admin-sidebar-settings-item.active{
  background: rgba(10, 88, 165, 0.15);
  color: #60A5FA !important;
  font-weight: 600;
}

.admin-sidebar-settings-item i{
  width: 16px;
  text-align: center;
  font-size: 12px;
}

.admin-users-header{
  border-radius: 20px;
  border: 1px solid #E5E7EB;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
  padding: 16px 20px;
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.admin-users-search-form{
  display: flex;
  align-items: center;
}

.admin-users-header-right-filters{
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-filter-dropdown{
  position: relative;
}

.admin-filter-dropdown-btn{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid #E2E8F0;
  background: #fff;
  cursor: pointer;
  font-size: 13px;
  color: #445972;
  white-space: nowrap;
  transition: border-color 0.2s, background 0.2s;
}

.admin-filter-dropdown-btn:hover{
  border-color: #0A58A5;
  background: #F8FAFF;
}

.admin-filter-dropdown-btn i:first-child{
  color: #6E7F93;
  font-size: 13px;
}

.admin-filter-dropdown-arrow{
  font-size: 9px;
  color: #94A3B8;
  transition: transform 0.2s;
}

.admin-filter-dropdown .admin-period-filter-menu{
  min-width: 180px;
}

.admin-pagination{
  margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
}

.admin-pagination-info{
  color: #62748E;
}

.admin-pagination-links{
  display: flex;
  align-items: center;
  gap: 8px;
}

.admin-pagination-link{
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid #E5E7EB;
  background: #FFF;
  color: #314158;
  text-decoration: none;
  font-size: 13px;
}

.admin-pagination-link:hover{
  background: #F3F4F6;
}

.admin-pagination-link-disabled{
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}

.admin-users-table{
  border-radius: 16px;
  border: 1px solid #E5E7EB;
  background: #FFF;
  margin-top: 20px;
  overflow: visible;
}

.admin-users-table table{
  width: 100%;
}

.admin-users-table-user-name, .admin-users-table-user-role{
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.admin-users-table-user-name span:first-child, .admin-users-table-user-role span:first-child{
  color: #0F172B;
  font-family: "Open Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
}

.admin-users-table-user-name span:last-child, .admin-users-table-user-role span:last-child{
  color: #62748E;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px; /* 133.333% */
}

/* ========== Badges Statut ========== */
.admin-badge-confirmed{
  color: #14A44D;
  background: #E8F8EF;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
}

.admin-badge-unconfirmed{
  color: #FC121B;
  background: #FEE9EA;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
}

.admin-badge-locked{
  color: #FFF;
  background: #6E7F93;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.admin-badge-locked i{
  font-size: 10px;
}

/* ========== Actions Ellipsis Dropdown ========== */
.admin-actions-cell{
  position: relative;
  width: 50px;
  text-align: center;
}

.admin-actions-dropdown{
  position: relative;
  display: inline-block;
}

.admin-actions-ellipsis{
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  color: #6E7F93;
  font-size: 14px;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.admin-actions-ellipsis:hover{
  background: #F3F4F6;
  color: #0A58A5;
  border-color: #CBD5E1;
}

.admin-actions-menu{
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.06);
  min-width: 245px;
  padding: 6px;
  z-index: 200;
}

.admin-actions-menu.open{
  display: flex;
  flex-direction: column;
}

.admin-actions-menu-item{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  color: #334155;
  text-decoration: none;
  transition: background 0.15s;
}

.admin-actions-menu-item:hover{
  background: #F0F4FF;
  color: #0A58A5;
}

.admin-actions-menu-item i{
  width: 16px;
  text-align: center;
  font-size: 13px;
  color: #6E7F93;
}

.admin-actions-menu-item:hover i{
  color: #0A58A5;
}

.admin-actions-menu-divider{
  height: 1px;
  background: #F1F5F9;
  margin: 4px 6px;
}

.admin-actions-menu-item-danger{
  color: #DC2626;
}

.admin-actions-menu-item-danger i{
  color: #DC2626;
}

.admin-actions-menu-item-danger:hover{
  background: rgba(220, 38, 38, 0.06);
  color: #DC2626;
}

.admin-actions-menu-item-danger:hover i{
  color: #DC2626;
}

.admin-credits-badge{
  display: inline-block;
  padding: 2px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}

.admin-credits-badge.positive{
  background: rgba(20, 164, 77, 0.08);
  color: #14A44D;
}

.admin-credits-badge.zero{
  background: rgba(110, 127, 147, 0.08);
  color: #6E7F93;
}

/* Progression projet */
.admin-progress-cell{
  min-width: 160px;
}

.admin-progress-label{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}

.admin-progress-step{
  font-size: 12px;
  color: #445972;
  font-weight: 500;
}

.admin-progress-percent{
  font-size: 12px;
  color: #6E7F93;
  font-weight: 600;
}

.admin-progress-bar{
  width: 100%;
  height: 6px;
  background: #E8ECF0;
  border-radius: 3px;
  overflow: hidden;
}

.admin-progress-fill{
  height: 100%;
  background: #0A58A5;
  border-radius: 3px;
  transition: width 0.3s ease;
}

/* Finance detail spans inside metric cards */
.admin-finance-detail{
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.admin-finance-detail span{
  color: #6E7F93;
  font-size: 12px;
  line-height: 16px;
}

.admin-metric-icon{
  font-size: 20px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #F3F4F6;
}

/* Transaction type badge */
.admin-transaction-type{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 6px;
}

.admin-transaction-type.credit{
  color: #14A44D;
  background: rgba(20, 164, 77, 0.08);
}

.admin-transaction-type.debit{
  color: #DC2626;
  background: rgba(220, 38, 38, 0.08);
}

/* Transaction status badge */
.admin-transaction-status{
  display: inline-block;
  padding: 3px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}

.admin-transaction-status.success{
  color: #14A44D;
  background: rgba(20, 164, 77, 0.08);
}

.admin-transaction-status.pending{
  color: #F59E0B;
  background: rgba(245, 158, 11, 0.08);
}

.admin-transaction-status.failed{
  color: #DC2626;
  background: rgba(220, 38, 38, 0.08);
}

.admin-transaction-status.blocked{
  color: #7C3AED;
  background: rgba(124, 58, 237, 0.08);
}

/* Audit severity badge */
.admin-audit-severity{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 6px;
}

.admin-audit-severity.info{
  color: #0A58A5;
  background: rgba(10, 88, 165, 0.08);
}

.admin-audit-severity.warning{
  color: #F59E0B;
  background: rgba(245, 158, 11, 0.08);
}

.admin-audit-severity.critical{
  color: #DC2626;
  background: rgba(220, 38, 38, 0.08);
}

/* Table action button */
.admin-table-action-btn{
  border: 1px solid #E5E7EB;
  background: #FFF;
  border-radius: 8px;
  padding: 6px 10px;
  cursor: pointer;
  color: #6E7F93;
  transition: background 0.2s;
}

.admin-table-action-btn:hover{
  background: #F3F4F6;
  color: #0A58A5;
}

/* ========== Analytics Tabs ========== */
.admin-analytics-tabs{
  display: flex;
  gap: 4px;
  background: #F3F4F6;
  border-radius: 10px;
  padding: 3px;
  margin-top: 8px;
  margin-bottom: 20px;
  max-width: 480px;
}

.admin-analytics-tab{
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 12px;
  border: none;
  background: transparent;
  border-radius: 7px;
  font-size: 13px;
  font-weight: 500;
  color: #6E7F93;
  cursor: pointer;
  transition: all 0.2s;
}

.admin-analytics-tab:hover{
  color: #445972;
  background: rgba(255,255,255,0.5);
}

.admin-analytics-tab.active{
  background: #fff;
  color: #0A58A5;
  font-weight: 600;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.admin-analytics-panel{
  display: none;
}

.admin-analytics-panel.active{
  display: block;
}

/* ========== Geo Distribution ========== */
.admin-geo-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 16px;
  max-height: 420px;
  overflow-y: auto;
  padding-right: 4px;
}

.admin-geo-item-header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}

.admin-geo-region{
  font-size: 14px;
  font-weight: 500;
  color: #1A2333;
}

.admin-geo-stats{
  font-size: 13px;
  color: #6E7F93;
  font-weight: 500;
}

.admin-geo-bar-bg{
  width: 100%;
  height: 8px;
  background: #F3F4F6;
  border-radius: 4px;
  overflow: hidden;
}

.admin-geo-bar-fill{
  height: 100%;
  background: linear-gradient(90deg, #0A58A5, #3B82F6);
  border-radius: 4px;
  min-width: 2px;
  transition: width 0.4s ease;
}

/* ========== Types de comptes ========== */
.admin-type-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 16px;
}

.admin-type-item{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: #F9FAFB;
  border-radius: 10px;
  border: 1px solid #F3F4F6;
}

.admin-type-item-total{
  border: 1px dashed #D1D5DB;
  background: #fff;
}

.admin-type-item-icon{
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.admin-type-item-info{
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.admin-type-item-label{
  font-size: 13px;
  color: #6E7F93;
  font-weight: 500;
}

.admin-type-item-count{
  font-size: 20px;
  font-weight: 700;
  color: #1A2333;
}

/* ========== Engagement full-width + metrics ========== */
.admin-engagement-full{
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  border: 1px solid #E5E7EB;
  margin-top: 24px;
  margin-bottom: 24px;
}

.admin-engagement-full h2{
  font-size: 16px;
  font-weight: 600;
  color: #1A2333;
  margin: 0 0 4px;
}

.admin-engagement-full p{
  font-size: 13px;
  color: #6E7F93;
  margin: 0 0 16px;
}

.admin-engagement-metrics{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.admin-engagement-metrics .admin-dashboard-metric{
  min-height: 140px;
  padding: 24px;
  width: 100%;
}

/* ========== Top Incubateurs ========== */
.admin-top-incubateurs p{
  color: #6E7F93;
  font-size: 13px;
  margin: 2px 0 0;
}

.admin-top-incubateurs-list{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 16px;
}

.admin-top-incubateur-item{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #F9FAFB;
  border-radius: 12px;
  border: 1px solid #F3F4F6;
  transition: background 0.2s, border-color 0.2s;
}

.admin-top-incubateur-item:hover{
  background: #F0F4FF;
  border-color: #D6E4F0;
}

.admin-top-incubateur-rank{
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  flex-shrink: 0;
  background: #F3F4F6;
  color: #6E7F93;
}

.admin-top-incubateur-rank.rank-1{
  background: linear-gradient(135deg, #F59E0B, #D97706);
  color: #fff;
}

.admin-top-incubateur-rank.rank-2{
  background: linear-gradient(135deg, #94A3B8, #64748B);
  color: #fff;
}

.admin-top-incubateur-rank.rank-3{
  background: linear-gradient(135deg, #CD7F32, #A0522D);
  color: #fff;
}

.admin-top-incubateur-info{
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}

.admin-top-incubateur-name{
  font-size: 14px;
  font-weight: 600;
  color: #1A2333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-top-incubateur-type{
  font-size: 11px;
  color: #6E7F93;
  text-transform: capitalize;
}

.admin-top-incubateur-stats{
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}

.admin-top-incubateur-stat{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
}

.admin-top-incubateur-stat-value{
  font-size: 16px;
  font-weight: 700;
  color: #0A58A5;
}

.admin-top-incubateur-stat-label{
  font-size: 10px;
  color: #6E7F93;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.admin-top-incubateur-empty{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 40px 20px;
  color: #94A3B8;
  font-size: 14px;
}

.admin-top-incubateur-empty i{
  font-size: 28px;
  color: #CBD5E1;
}

/* ========== Admin User Show (profil) ========== */
.admin-back-link{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #6E7F93;
  text-decoration: none;
  transition: color 0.2s;
}

.admin-user-show{
  margin-top: 20px;
}

.admin-user-show-header{
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 24px;
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 16px;
}

.admin-user-show-avatar{
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: linear-gradient(135deg, #0A58A5, #3B82F6);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 700;
  flex-shrink: 0;
}

.admin-user-show-identity{
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.admin-user-show-identity h1{
  font-size: 22px;
  font-weight: 700;
  color: #1A2333;
  margin: 0;
  line-height: 1.2;
}

.admin-user-show-email{
  font-size: 14px;
  color: #6E7F93;
}

.admin-user-show-badges{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  flex-wrap: wrap;
}

.admin-user-show-role-badge{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  background: rgba(10, 88, 165, 0.08);
  color: #0A58A5;
}

.admin-user-show-status-badge{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}

.admin-user-show-status-badge.confirmed{
  background: rgba(20, 164, 77, 0.08);
  color: #14A44D;
}

.admin-user-show-status-badge.unconfirmed{
  background: rgba(220, 38, 38, 0.08);
  color: #DC2626;
}

.admin-user-show-status-badge.locked{
  background: rgba(124, 58, 237, 0.08);
  color: #7C3AED;
}

.admin-user-show-status-badge.admin-badge{
  background: rgba(245, 158, 11, 0.08);
  color: #D97706;
}

/* Métriques user show */
.admin-user-show-metrics{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 20px;
  margin-bottom: 24px;
}

.admin-user-show-metric-card{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px;
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
}

.admin-user-show-metric-icon{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.admin-user-show-metric-info{
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.admin-user-show-metric-value{
  font-size: 22px;
  font-weight: 700;
  color: #1A2333;
}

.admin-user-show-metric-label{
  font-size: 13px;
  color: #6E7F93;
  font-weight: 500;
}

/* Grille infos */
.admin-user-show-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 20px;
}

.admin-user-show-card{
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  padding: 24px;
  height: fit-content;
}

.admin-user-show-card + .admin-user-show-card{
  margin-top: 20px;
}

.admin-user-show-card h2{
  font-size: 16px;
  font-weight: 600;
  color: #1A2333;
  margin: 0 0 16px;
}

.admin-user-show-full{
  margin-top: 20px;
}

.admin-user-show-info-list{
  display: flex;
  flex-direction: column;
}

.admin-user-show-info-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #F3F4F6;
}

.admin-user-show-info-row:last-child{
  border-bottom: none;
}

.admin-user-show-info-label{
  font-size: 13px;
  color: #6E7F93;
  font-weight: 500;
}

.admin-user-show-info-value{
  font-size: 14px;
  color: #1A2333;
  font-weight: 500;
  text-align: right;
}

.admin-user-show-empty{
  color: #94A3B8;
  font-size: 14px;
  font-style: italic;
  text-align: center;
  padding: 24px;
}

.admin-user-show-card .admin-activities-table{
  margin-top: 0;
}

.admin-user-show-card code{
  background: #F3F4F6;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 12px;
  color: #445972;
}

/* ========== Admin User Edit Form ========== */
.admin-edit-fields{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.admin-edit-field{
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.admin-edit-field-full{
  grid-column: 1 / -1;
}

.admin-edit-field label{
  font-size: 13px;
  font-weight: 600;
  color: #445972;
}

.admin-edit-input{
  width: 100%;
  padding: 10px 14px;
  border: 1px solid #E2E8F0;
  border-radius: 10px;
  font-size: 14px;
  color: #1A2333;
  background: #F9FAFB;
  box-sizing: border-box;
  transition: border-color 0.2s, background 0.2s;
}

.admin-edit-input:focus{
  outline: none;
  border-color: #0A58A5;
  background: #fff;
}

.admin-edit-textarea{
  resize: vertical;
  min-height: 80px;
}

.admin-checkbox-label{
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 14px;
  color: #223245;
  font-weight: 500;
}

.admin-checkbox{
  width: 18px;
  height: 18px;
  accent-color: #0A58A5;
  cursor: pointer;
}

.admin-checkbox-label i{
  color: #0A58A5;
  font-size: 14px;
}

.admin-edit-actions{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid #E5E7EB;
}

.admin-edit-cancel{
  padding: 10px 24px;
  border-radius: 10px;
  border: 1px solid #E2E8F0;
  background: #fff;
  color: #445972;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: background 0.2s;
}

.admin-edit-cancel:hover{
  background: #F3F4F6;
}

.admin-edit-submit{
  padding: 10px 24px;
  border-radius: 10px;
  border: none;
  background: #0A58A5;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
}

.admin-edit-submit:hover{
  background: #084a8f;
}

/* ========== Admin Modal ========== */
.admin-modal-overlay{
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 43, 0.5);
  backdrop-filter: blur(4px);
  z-index: 1000;
  align-items: center;
  justify-content: center;
}

.admin-modal-overlay.open{
  display: flex;
}

.admin-modal{
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  width: 100%;
  max-width: 440px;
  overflow: hidden;
}

.admin-modal-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid #F1F5F9;
}

.admin-modal-header h2{
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 600;
  color: #1A2333;
  margin: 0;
}

.admin-modal-header h2 i{
  color: #0A58A5;
}

.admin-modal-close{
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: #F3F4F6;
  border-radius: 8px;
  color: #6E7F93;
  font-size: 14px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.admin-modal-close:hover{
  background: #E5E7EB;
  color: #1A2333;
}

.admin-modal-body{
  padding: 24px;
}

.admin-modal-body p{
  font-size: 14px;
  color: #445972;
  margin: 0 0 20px;
}

.admin-modal-actions{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 24px;
}

/* ========== Settings Tabs ========== */

.admin-settings-tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid #E5E9F0;
  margin-bottom: 24px;
}

.admin-settings-tab {
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 600;
  color: #6E7F93;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: all 0.2s;
}

.admin-settings-tab:hover {
  color: #0A58A5;
}

.admin-settings-tab.active {
  color: #0A58A5;
  border-bottom-color: #0A58A5;
}

/* ========== Toggle Switch ========== */

.admin-toggle {
  position: relative;
  display: inline-block;
  width: 48px;
  height: 26px;
  flex-shrink: 0;
}

.admin-toggle input {
  opacity: 0;
  width: 0;
  height: 0;
}

.admin-toggle-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 26px;
  transition: 0.3s;
}

.admin-toggle-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: 0.3s;
}

.admin-toggle input:checked + .admin-toggle-slider {
  background-color: #0A58A5;
}

.admin-toggle input:checked + .admin-toggle-slider::before {
  transform: translateX(22px);
}

/* ========== Notification Settings ========== */

.admin-notification-settings {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.admin-notification-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  border-bottom: 1px solid #E5E9F0;
}

.admin-notification-item:last-child {
  border-bottom: none;
}

.admin-notification-item-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.admin-notification-item-info strong {
  font-size: 14px;
  color: #1e293b;
}

.admin-notification-item-info span {
  font-size: 13px;
  color: #6E7F93;
}

/* ========== Team Members ========== */

.admin-team-members-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.admin-team-member-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #E5E9F0;
}

.admin-team-member-item:last-child {
  border-bottom: none;
}

.admin-team-member-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #0A58A5;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}

.admin-team-member-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.admin-team-member-info strong {
  font-size: 14px;
  color: #1e293b;
}

.admin-team-member-delete {
  color: #FC121B;
  font-size: 14px;
  padding: 8px;
  border-radius: 6px;
  transition: background 0.2s;
  text-decoration: none;
}

.admin-team-member-delete:hover {
  background: #fef2f2;
}

/* ========== Project Modules ========== */

.admin-project-modules {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}

.admin-project-module-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid #E5E9F0;
  background: #F9FAFB;
}

.admin-project-module-icon {
  font-size: 20px;
  flex-shrink: 0;
}

.admin-project-module-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.admin-project-module-info strong {
  font-size: 13px;
  color: #1e293b;
}

.admin-project-module-info span {
  font-size: 12px;
  color: #6E7F93;
}

/* ========== Integration Cards ========== */

.admin-integrations-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.admin-integration-card {
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  overflow: hidden;
}

.admin-integration-card-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 24px;
  border-bottom: 1px solid #F3F4F6;
}

.admin-integration-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.admin-integration-card-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.admin-integration-card-info h3 {
  font-size: 16px;
  font-weight: 600;
  color: #1A2333;
  margin: 0;
}

.admin-integration-card-info span {
  font-size: 13px;
  color: #6E7F93;
}

.admin-integration-card-body {
  padding: 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.admin-integration-card-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #F3F4F6;
}

.admin-integration-card-row:last-child {
  border-bottom: none;
}

.admin-integration-card-label {
  font-size: 13px;
  color: #6E7F93;
  font-weight: 500;
}

.admin-integration-card-value {
  font-size: 13px;
  color: #1A2333;
  font-weight: 500;
}

code.admin-integration-card-value {
  background: #F3F4F6;
  padding: 3px 8px;
  border-radius: 6px;
  font-family: monospace;
  font-size: 12px;
  color: #445972;
}

/* ========== Security Stats ========== */

.admin-security-stat {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  background: #F9FAFB;
  border-radius: 10px;
  border: 1px solid #F3F4F6;
}

.admin-security-stat-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.admin-security-stat-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.admin-security-stat-value {
  font-size: 22px;
  font-weight: 700;
  color: #1A2333;
}

.admin-security-stat-label {
  font-size: 13px;
  color: #6E7F93;
  font-weight: 500;
}

/* ========== Project Actions ========== */

.admin-project-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* ========== Explorer & Form Styles ========== */

.admin-dashboard-subtitle{
  color: #6E7F93;
  font-size: 14px;
  font-weight: 400;
  margin-top: 4px;
}

.admin-users-header-right{
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-action-button{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 10px;
  border: none;
  background: #0A58A5;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s;
}

.admin-action-button:hover{
  background: #084a8f;
}

.admin-action-button i{
  font-size: 12px;
}

.admin-badge{
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  background: #F0F4F8;
  color: #445972;
}

.admin-badge-success{
  background: #ECFDF5;
  color: #059669;
}

.admin-badge-warning{
  background: #FFFBEB;
  color: #D97706;
}

.admin-badge-danger{
  background: #FEF2F2;
  color: #DC2626;
}

.admin-empty-state{
  text-align: center;
  color: #6E7F93;
  padding: 40px 20px;
  font-size: 14px;
}

.admin-form-container{
  background: #fff;
  border-radius: 16px;
  border: 1px solid #E5E7EB;
  padding: 32px;
  margin-top: 20px;
}

.admin-form-errors{
  background: #FEF2F2;
  border: 1px solid #FECACA;
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 24px;
  color: #DC2626;
  font-size: 14px;
}

.admin-form-errors ul{
  margin: 8px 0 0 16px;
}

.admin-edit-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.admin-edit-label{
  font-size: 13px;
  font-weight: 600;
  color: #445972;
}

.admin-edit-textarea{
  width: 100%;
  padding: 10px 14px;
  border: 1px solid #E2E8F0;
  border-radius: 10px;
  font-size: 14px;
  color: #1A2333;
  background: #F9FAFB;
  box-sizing: border-box;
  transition: border-color 0.2s, background 0.2s;
  resize: vertical;
  min-height: 80px;
  font-family: "Open Sans", sans-serif;
}

.admin-edit-textarea:focus{
  outline: none;
  border-color: #0A58A5;
  background: #fff;
}

.admin-toggle-row{
  display: flex;
  align-items: center;
  gap: 12px;
}

.admin-toggle-checkbox{
  width: 44px;
  height: 24px;
  appearance: none;
  -webkit-appearance: none;
  background: #D1D5DB;
  border-radius: 12px;
  position: relative;
  cursor: pointer;
  transition: background 0.2s;
  flex-shrink: 0;
}

.admin-toggle-checkbox::before{
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  top: 3px;
  left: 3px;
  transition: transform 0.2s;
}

.admin-toggle-checkbox:checked{
  background: #0A58A5;
}

.admin-toggle-checkbox:checked::before{
  transform: translateX(20px);
}

.admin-toggle-label{
  font-size: 14px;
  color: #445972;
  font-weight: 500;
}

.admin-form-actions{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid #E5E7EB;
}

.admin-cancel-button{
  padding: 10px 24px;
  border-radius: 10px;
  border: 1px solid #E2E8F0;
  background: #fff;
  color: #445972;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: background 0.2s;
}

.admin-cancel-button:hover{
  background: #F3F4F6;
}

/* ========== Table Action Buttons ========== */

.admin-actions-cell{
  display: flex;
  align-items: center;
  gap: 6px;
}

.admin-table-action-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
  background: #fff;
  color: #445972;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
}

.admin-table-action-btn:hover{
  background: #F1F5F9;
  color: #1E3A5F;
  border-color: #CBD5E1;
}

.admin-table-action-danger{
  color: #DC2626;
  border-color: #FECACA;
}

.admin-table-action-danger:hover{
  background: #FEF2F2;
  color: #B91C1C;
  border-color: #FCA5A5;
}

/* ========== Allocate Search ========== */

.allocate-search-container{
  position: relative;
}

.allocate-search-input-wrapper{
  position: relative;
}

.allocate-search-icon{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #94A3B8;
  font-size: 13px;
  pointer-events: none;
}

.allocate-search-input-wrapper .admin-edit-input{
  padding-left: 36px;
}

.allocate-search-selected{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 14px;
  background: #F0F9FF;
  border: 1px solid #BAE6FD;
  border-radius: 10px;
  font-size: 14px;
  color: #0369A1;
  font-weight: 500;
}

.allocate-search-clear{
  background: none;
  border: none;
  color: #0369A1;
  font-size: 18px;
  cursor: pointer;
  padding: 0 4px;
  line-height: 1;
}

.allocate-search-clear:hover{
  color: #DC2626;
}

.allocate-search-dropdown{
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 50;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  max-height: 240px;
  overflow-y: auto;
  margin-top: 4px;
}

.allocate-search-option{
  display: flex;
  flex-direction: column;
  padding: 10px 14px;
  cursor: pointer;
  transition: background 0.15s;
}

.allocate-search-option:hover{
  background: #F1F5F9;
}

.allocate-search-option-name{
  font-size: 14px;
  font-weight: 600;
  color: #1E293B;
}

.allocate-search-option-meta{
  font-size: 12px;
  color: #64748B;
}

/* ═══════════════════════════════════════════════════
   ADMIN NOTIFICATIONS
   ═══════════════════════════════════════════════════ */

.admin-notification-type-badge{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}

.admin-notification-type-badge.payment{
  color: #0A58A5;
  background: rgba(10, 88, 165, 0.08);
}

.admin-notification-type-badge.info{
  color: #6E7F93;
  background: rgba(110, 127, 147, 0.08);
}

.admin-notification-type-badge.success{
  color: #14A44D;
  background: rgba(20, 164, 77, 0.08);
}

.admin-notification-type-badge.warning{
  color: #F59E0B;
  background: rgba(245, 158, 11, 0.08);
}

/* ═══════════════════════════════════════════════════
   ADMIN SETTINGS — Packs & Modules
   ═══════════════════════════════════════════════════ */

.admin-settings-packs-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}

.admin-settings-pack-card{
  border-radius: 12px;
  border: 1px solid #DFE5EC;
  background: #FFF;
  padding: 20px;
  transition: border-color 0.2s, opacity 0.2s;
}

.admin-settings-pack-card:hover{
  border-color: #0A58A5;
}

.admin-settings-pack-card.structure:hover{
  border-color: #7C3AED;
}

.admin-settings-pack-card.inactive{
  opacity: 0.5;
}

.admin-settings-pack-header{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 16px;
}

.admin-settings-pack-icon{
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: rgba(10, 88, 165, 0.08);
  color: #0A58A5;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}

.admin-settings-pack-icon.structure{
  background: rgba(124, 58, 237, 0.08);
  color: #7C3AED;
}

.admin-settings-pack-toggles{
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-end;
}

.admin-settings-pack-toggle-item{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: #6E7F93;
  font-weight: 600;
}

.admin-settings-pack-fields{
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.admin-settings-pack-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.admin-settings-pack-ratio{
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #6E7F93;
  padding: 6px 10px;
  background: #F8FAFC;
  border-radius: 6px;
}

.admin-settings-pack-add-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-top: 16px;
  padding: 12px;
  border-radius: 10px;
  border: 2px dashed #D1D5DB;
  background: transparent;
  color: #6E7F93;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.admin-settings-pack-add-btn:hover{
  border-color: #0A58A5;
  color: #0A58A5;
  background: rgba(10, 88, 165, 0.04);
}

.admin-settings-pack-add-btn.structure:hover{
  border-color: #7C3AED;
  color: #7C3AED;
  background: rgba(124, 58, 237, 0.04);
}

/* Modules grid */
.admin-settings-modules-grid{
  display: flex;
  flex-direction: column;
  gap: 0;
}

.admin-settings-module-card{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 0;
  border-bottom: 1px solid #F1F5F9;
}

.admin-settings-module-card:last-child{
  border-bottom: none;
}

.admin-settings-module-icon{
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.admin-settings-module-info{
  flex: 1;
  min-width: 0;
}

.admin-settings-module-name{
  font-size: 14px;
  font-weight: 600;
  color: #1E293B;
}

.admin-settings-module-desc{
  font-size: 12px;
  color: #64748B;
  margin-top: 2px;
}

.admin-settings-module-cost{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}

.admin-settings-module-cost-value{
  font-size: 22px;
  font-weight: 700;
  color: #0A58A5;
  line-height: 1;
}

.admin-settings-module-cost-label{
  font-size: 10px;
  color: #6E7F93;
  font-weight: 600;
  text-transform: uppercase;
}

/* Module stats */
.admin-settings-modules-stats{
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.admin-settings-module-stat{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.admin-settings-module-stat-left{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 500;
  color: #334155;
  min-width: 180px;
}

.admin-settings-module-stat-right{
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
}

.admin-settings-module-stat-bar{
  flex: 1;
  height: 6px;
  background: #F1F5F9;
  border-radius: 3px;
  overflow: hidden;
}

.admin-settings-module-stat-fill{
  height: 100%;
  border-radius: 3px;
  transition: width 0.6s ease-out;
}

.admin-settings-module-stat-count{
  font-size: 13px;
  font-weight: 700;
  color: #1E293B;
  min-width: 30px;
  text-align: right;
}

.admin-notif-title{
  font-size: 13px;
  font-weight: 600;
  color: #1E293B;
  line-height: 18px;
}

.admin-notif-description{
  font-size: 12px;
  color: #64748B;
  line-height: 16px;
  margin-top: 2px;
}
/* ========== Dashboard Marketing ========== */

/* Grille à 5 KPIs (la grille admin standard en compte 4) */
.marketing-metrics {
  flex-wrap: wrap;
}
.marketing-metrics .admin-dashboard-metric {
  flex: 1 1 calc(20% - 16px);
  min-width: 180px;
  width: auto;
}

.marketing-metric-unit {
  font-size: 14px;
  font-weight: 500;
  color: #6A7282;
}

/* Indicateur de tendance coloré */
.marketing-change span { color: #6A7282; }
.marketing-change-up span { color: #059669; }
.marketing-change-down span { color: #DC2626; }

.marketing-metrics-note {
  margin-top: 14px;
  font-size: 12px;
  color: #6A7282;
  display: flex;
  align-items: center;
  gap: 6px;
  line-height: 16px;
}
.marketing-metrics-note i { color: #0EA5E9; }

/* Sidebar : onglets "à venir" (phase 2) */
.marketing-nav-soon {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  color: #9AA4B2;
  cursor: default;
  font-size: 15px;
  border-radius: 8px;
}
.marketing-nav-soon > span:first-of-type {
  flex: 1;
}
.marketing-nav-badge {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: #EEF2F6;
  color: #8A94A6;
  padding: 2px 8px;
  border-radius: 999px;
}

/* Header marketing */
.marketing-header-title {
  font-size: 18px;
  font-weight: 700;
  color: #223245;
}
.marketing-logout-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: 16px;
  padding: 8px 14px;
  border: 1px solid #E5E7EB;
  border-radius: 10px;
  background: #FFF;
  color: #475467;
  font-size: 14px;
  cursor: pointer;
}
.marketing-logout-btn:hover {
  background: #F8FAFC;
  color: #DC2626;
  border-color: #FCA5A5;
}
.pm-sidebar{
  width: 260px;
  height: 100vh;
  background: #172033;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  flex-direction: column;
  padding: 22px 16px;
  flex-shrink: 0;
}

.pm-sidebar-brand{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.pm-sidebar-brand .logo{
  max-width: 124px;
  filter: brightness(0) invert(1);
  opacity: 0.95;
}

.pm-sidebar-brand span{
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #D8A31A;
}

.pm-sidebar-nav{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 24px;
}

.pm-sidebar-nav a{
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  color: #A7B4C8;
  font-size: 14px;
  font-weight: 600;
}

.pm-sidebar-nav a.active,
.pm-sidebar-nav a:hover{
  background: rgba(255, 255, 255, 0.1);
  color: #FFFFFF;
}

.pm-sidebar-nav i{
  width: 22px;
  text-align: center;
}

.pm-sidebar-profile{
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.pm-sidebar-avatar{
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #0A58A5;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 800;
  flex-shrink: 0;
}

.pm-sidebar-profile strong{
  display: block;
  color: #FFFFFF;
  font-size: 13px;
  line-height: 18px;
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-sidebar-profile span{
  display: block;
  color: #A7B4C8;
  font-size: 12px;
  line-height: 16px;
}

.pm-header{
  height: 64px;
  padding: 0 28px;
  border-bottom: 1px solid #E5E7EB;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}

.pm-header > span{
  color: #445972;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
}

.pm-logout-button{
  min-height: 38px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  background: #FFFFFF;
  color: #445972;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 700;
}

.pm-logout-button:hover{
  border-color: #DC2626;
  color: #DC2626;
}

.pm-content-inner{
  background: #F6F7F8;
}

.pm-product-dashboard{
  display: flex;
  flex-direction: column;
  gap: 20px;
  color: #223245;
}

.pm-dashboard-title{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.pm-title-kicker,
.pm-card-eyebrow{
  display: block;
  color: #0A58A5;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.pm-dashboard-title h1{
  color: #172033;
  font-size: 28px;
  line-height: 36px;
  font-weight: 800;
}

.pm-dashboard-title p{
  color: #62748E;
  font-size: 14px;
  line-height: 22px;
  margin-top: 4px;
}

.pm-refresh-button{
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 8px;
  background: #0A58A5;
  color: #FFFFFF;
  font-size: 14px;
  font-weight: 700;
  flex-shrink: 0;
}

.pm-refresh-button:hover{
  background: #084A8F;
}

.pm-overview-grid{
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
  gap: 16px;
}

.pm-north-star-card,
.pm-active-users-card,
.pm-kpi-card,
.pm-panel{
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.pm-north-star-card{
  padding: 24px;
  border-left: 4px solid #0A58A5;
}

.pm-active-users-card{
  padding: 22px;
}

.pm-card-header,
.pm-kpi-top,
.pm-panel-header{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.pm-card-header h2,
.pm-panel-header h2{
  color: #172033;
  font-size: 18px;
  line-height: 26px;
  font-weight: 800;
}

.pm-icon-badge{
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #EAF2FA;
  color: #0A58A5;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.pm-icon-badge-primary{
  background: #FFF7E0;
  color: #B77900;
}

.pm-north-star-value{
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-top: 28px;
}

.pm-north-star-value strong{
  color: #172033;
  font-size: 54px;
  line-height: 60px;
  font-weight: 800;
}

.pm-north-star-value span{
  color: #62748E;
  font-size: 14px;
  font-weight: 700;
}

.pm-north-star-footer{
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #62748E;
  font-size: 13px;
}

.pm-north-star-footer strong{
  color: #0A58A5;
  white-space: nowrap;
}

.pm-active-users-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 24px;
}

.pm-active-users-grid div{
  min-height: 84px;
  border: 1px solid #E7ECF2;
  border-radius: 12px;
  background: #F8FAFC;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 14px;
}

.pm-active-users-grid span{
  color: #6E7F93;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.pm-active-users-grid strong{
  color: #172033;
  font-size: 28px;
  line-height: 34px;
  font-weight: 800;
  margin-top: 4px;
}

.pm-muted-line{
  color: #6E7F93;
  font-size: 12px;
  line-height: 18px;
  margin-top: 18px;
}

.pm-kpi-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.pm-kpi-card{
  padding: 18px;
  min-height: 154px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.pm-kpi-card-highlight{
  border-color: #8AC5A3;
  background: #F2FBF5;
}

.pm-kpi-top span{
  color: #62748E;
  font-size: 13px;
  line-height: 18px;
  font-weight: 800;
}

.pm-kpi-top i{
  color: #0A58A5;
  font-size: 16px;
}

.pm-kpi-card-highlight .pm-kpi-top i{
  color: #15803D;
}

.pm-kpi-card > strong{
  color: #172033;
  font-size: 34px;
  line-height: 40px;
  font-weight: 800;
  margin-top: 16px;
}

.pm-kpi-breakdown{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.pm-kpi-breakdown span{
  border-radius: 999px;
  background: #EEF4FB;
  color: #445972;
  padding: 4px 8px;
  font-size: 11px;
  line-height: 16px;
  font-weight: 800;
}

.pm-kpi-card-highlight .pm-kpi-breakdown span{
  background: #DCFCE7;
  color: #166534;
}

.pm-detail-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
}

.pm-panel{
  padding: 20px;
}

.pm-panel-header p{
  color: #6E7F93;
  font-size: 13px;
  line-height: 20px;
  margin-top: 2px;
}

.pm-panel-value{
  color: #0A58A5;
  font-size: 22px;
  line-height: 28px;
  font-weight: 800;
  white-space: nowrap;
}

.pm-funnel-list,
.pm-module-list{
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 20px;
}

.pm-funnel-row{
  display: grid;
  grid-template-columns: minmax(160px, 0.85fr) minmax(160px, 1fr) minmax(86px, auto);
  align-items: center;
  gap: 12px;
}

.pm-funnel-label{
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: #334155;
  font-size: 13px;
  font-weight: 800;
}

.pm-funnel-label i{
  color: #0A58A5;
  width: 18px;
  text-align: center;
}

.pm-funnel-label span{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-funnel-meter,
.pm-module-meter{
  height: 8px;
  background: #EDF2F7;
  border-radius: 999px;
  overflow: hidden;
}

.pm-funnel-meter div,
.pm-module-meter div{
  height: 100%;
  border-radius: inherit;
  background: #0A58A5;
}

.pm-funnel-count{
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 8px;
  white-space: nowrap;
}

.pm-funnel-count strong{
  color: #172033;
  font-size: 14px;
  font-weight: 800;
}

.pm-funnel-count span,
.pm-module-rate{
  color: #6E7F93;
  font-size: 12px;
  font-weight: 700;
}

.pm-module-row{
  padding-bottom: 14px;
  border-bottom: 1px solid #EEF2F6;
}

.pm-module-row:last-child{
  padding-bottom: 0;
  border-bottom: 0;
}

.pm-module-heading{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.pm-module-heading span{
  color: #334155;
  font-size: 13px;
  line-height: 18px;
  font-weight: 800;
}

.pm-module-heading strong{
  color: #172033;
  font-size: 14px;
  font-weight: 800;
}

.pm-module-rate{
  display: block;
  margin-top: 6px;
}

.pm-funnel-panel{
  margin-top: 2px;
}

.pm-user-funnel-list{
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 20px;
}

.pm-user-funnel-row{
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
}

.pm-user-funnel-marker{
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 100%;
}

.pm-user-funnel-icon{
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 800;
}

.pm-user-funnel-rail{
  width: 2px;
  flex: 1;
  min-height: 16px;
  margin-top: 6px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(10, 88, 165, 0.18) 0%, rgba(10, 88, 165, 0.06) 100%);
}

.pm-user-funnel-card{
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  background: #FDFEFF;
  padding: 16px 18px;
  box-shadow: 0 1px 2px rgba(15, 23, 43, 0.04);
}

.pm-user-funnel-head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.pm-user-funnel-copy{
  min-width: 0;
}

.pm-user-funnel-label{
  display: block;
  color: #172033;
  font-size: 14px;
  line-height: 20px;
  font-weight: 800;
}

.pm-user-funnel-copy p{
  color: #6E7F93;
  font-size: 12px;
  line-height: 18px;
  margin-top: 3px;
}

.pm-user-funnel-stats{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  white-space: nowrap;
}

.pm-user-funnel-stats strong{
  color: #172033;
  font-size: 15px;
  font-weight: 800;
}

.pm-user-funnel-stats span{
  color: #6E7F93;
  font-size: 12px;
  font-weight: 700;
}

.pm-user-funnel-conversion{
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11px;
  line-height: 16px;
  font-weight: 800;
}

.pm-user-funnel-conversion.is-low{
  background: #FEE2E2;
  color: #B91C1C;
}

.pm-user-funnel-conversion.is-mid{
  background: #FEF3C7;
  color: #B45309;
}

.pm-user-funnel-conversion.is-high{
  background: #DCFCE7;
  color: #166534;
}

.pm-user-funnel-meter{
  height: 8px;
  background: #EDF2F7;
  border-radius: 999px;
  overflow: hidden;
  margin-top: 12px;
}

.pm-user-funnel-meter div{
  height: 100%;
  border-radius: inherit;
}

@media (max-width: 1180px){
  .pm-overview-grid,
  .pm-detail-grid{
    grid-template-columns: 1fr;
  }

  .pm-kpi-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px){
  .admin-main{
    height: auto;
    min-height: 100vh;
    overflow-y: auto;
  }

  .pm-sidebar{
    display: none;
  }

  .pm-header{
    padding: 0 16px;
  }

  .pm-header > span{
    font-size: 12px;
  }

  .pm-content-inner{
    padding: 18px 16px;
  }

  .pm-dashboard-title{
    flex-direction: column;
  }

  .pm-refresh-button{
    width: 100%;
    justify-content: center;
  }

  .pm-kpi-grid{
    grid-template-columns: 1fr;
  }

  .pm-active-users-grid{
    grid-template-columns: 1fr;
  }

  .pm-funnel-row{
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .pm-user-funnel-row{
    grid-template-columns: 1fr;
  }

  .pm-user-funnel-marker{
    display: none;
  }

  .pm-user-funnel-head{
    flex-direction: column;
  }

  .pm-user-funnel-stats{
    justify-content: flex-start;
  }

  .pm-funnel-label span{
    white-space: normal;
  }

  .pm-funnel-count{
    justify-content: flex-start;
  }

  .pm-north-star-value{
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
  }

  .pm-north-star-value strong{
    font-size: 44px;
    line-height: 50px;
  }

  .pm-north-star-footer{
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 520px){
  .pm-logout-button span{
    display: none;
  }

  .pm-dashboard-title h1{
    font-size: 24px;
    line-height: 32px;
  }

  .pm-panel-header{
    flex-direction: column;
  }
}
/* Page Cohortes */

/* Header bar (inside tendances-page-header) */
.cohortes-header-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

.cohortes-header-stats {
    display: flex;
    align-items: center;
    gap: 14px;
}

.cohortes-header-stat {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #4B5563;
    font-family: "Open Sans", sans-serif;
}

.cohortes-header-stat i {
    color: #0A58A5;
    font-size: 13px;
}

.cohortes-header-stat strong {
    font-weight: 700;
    color: #1F2937;
}

.cohortes-header-create-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: none;
    border-radius: 10px;
    background: #0A58A5;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: background 0.2s ease;
}

.cohortes-header-create-btn:hover {
    background: #084A8A;
}

.cohortes-header-create-btn i {
    font-size: 12px;
}

@media (max-width: 768px) {
    .cohortes-header-right {
        gap: 10px;
    }

    .cohortes-header-stats {
        display: none;
    }
}

/* Stats Block (index page) */
.cohortes-stats-block {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px;
    animation: fadeUp 0.4s ease-out 0.1s both;
}

.cohortes-stat-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    background: #ffffff;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease;
}

.cohortes-stat-item:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.cohortes-stat-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: rgba(10, 88, 165, 0.08);
    color: #0A58A5;
    font-size: 16px;
}

.cohortes-stat-icon.active {
    background: rgba(16, 185, 129, 0.1);
    color: #10B981;
}

.cohortes-stat-icon.terminated {
    background: rgba(107, 114, 128, 0.1);
    color: #6B7280;
}

.cohortes-stat-icon.draft {
    background: rgba(245, 158, 11, 0.1);
    color: #F59E0B;
}

.cohortes-stat-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cohortes-stat-value {
    font-size: 22px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    line-height: 1;
}

.cohortes-stat-label {
    font-size: 13px;
    font-weight: 500;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

@media (max-width: 768px) {
    .cohortes-stats-block {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
}

/* Search & Filter Bar */
.cohortes-search-filters {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
    animation: fadeUp 0.4s ease-out 0.2s both;
    margin-top: 20px;
}

.cohortes-search-bar {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    height: 44px;
    border-radius: 15px;
    border: 1px solid #DFE5EC;
    background: #F6F7F8;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.cohortes-search-bar:focus-within {
    border-color: #0A58A5;
    background: #ffffff;
}

.cohortes-search-icon {
    color: #9CA3AF;
    font-size: 14px;
    flex-shrink: 0;
}

.cohortes-search-input {
    flex: 1;
    height: 100%;
    border: none;
    background: transparent;
    font-size: 14px;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    outline: none;
}

.cohortes-search-input::placeholder {
    color: #9CA3AF;
}

.cohortes-filter-tabs {
    display: flex;
    align-items: center;
    gap: 4px;
    border-radius: 15px;
    border: 1px solid #DFE5EC;
    background: #F6F7F8;
    padding: 4px;
}

.cohortes-stats-block{
    margin-top: 30px;
}

.cohortes-filter-tab {
    padding: 8px 16px;
    border: none;
    border-radius: 12px;
    background: transparent;
    color: #6E7F93;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.cohortes-filter-tab:hover {
    color: #223245;
    background: rgba(10, 88, 165, 0.04);
}

.cohortes-filter-tab.active {
    background: #ffffff;
    color: #0A58A5;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* Table Card */
.cohortes-table-card {
    background: #ffffff;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    overflow: visible;
    animation: fadeUp 0.4s ease-out 0.25s both;
}

@media (max-width: 768px) {
    .cohortes-search-filters {
        flex-direction: column;
        align-items: stretch;
    }

    .cohortes-filter-tabs {
        overflow-x: auto;
    }
}

/* Show Page Styles */
.cohortes-show-content-wrapper {
    padding-top: 0 !important;
    overflow-x: hidden;
}

.cohortes-show-page-header {
    background-color: #FFFFFF;
    border-bottom: 1px solid #DFE5EC;
    position: sticky;
    top: 0;
    z-index: 99;
    width: calc(100% + 100px);
    margin: 0 -50px 32px -50px;
    padding: 0;
    max-width: calc(100vw - 48px);
}

.cohortes-show-page-header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 50px;
    max-width: 100%;
}

.cohortes-show-page-header-left {
    display: flex;
    align-items: center;
    gap: 32px;
}

.cohortes-show-page-title {
    font-size: 20px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.cohortes-show-page-header-actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.cohortes-allocate-btn {
    background-color: #DFE5EC;
    color: #223245;
}

.cohortes-allocate-btn:hover {
    background-color: #CED4DA;
}

.cohortes-invite-btn {
    background-color: #0A58A5;
    color: #FFFFFF;
}

.cohortes-invite-btn:hover {
    background-color: #084a8f;
}

.cohortes-show-page {
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
    overflow-x: hidden;
}

/* Détails de la cohorte */
.cohorte-details-card {
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    animation: fadeUp 0.4s ease-out both;
}

.cohorte-details-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.cohorte-details-header-left {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex: 1;
}

.cohorte-details-icon-wrapper {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(10, 88, 165, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #0A58A5;
    font-size: 18px;
}

.cohorte-details-title {
    font-size: 20px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
    line-height: 1.3;
}

.cohorte-details-description {
    font-size: 14px;
    color: #6E7F93;
    margin: 6px 0 0 0;
    font-family: "Open Sans", sans-serif;
    line-height: 1.5;
}

/* Status Badge */
.cohorte-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    flex-shrink: 0;
}

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

.cohorte-status-active {
    background: rgba(16, 185, 129, 0.1);
    color: #059669;
}

.cohorte-status-active .cohorte-status-dot {
    background: #10B981;
}

.cohorte-status-terminee {
    background: rgba(107, 114, 128, 0.1);
    color: #4B5563;
}

.cohorte-status-terminee .cohorte-status-dot {
    background: #6B7280;
}

.cohorte-status-brouillon {
    background: rgba(245, 158, 11, 0.1);
    color: #D97706;
}

.cohorte-status-brouillon .cohorte-status-dot {
    background: #F59E0B;
}

/* Statuts entrepreneurs */
.cohorte-status-en_cours {
    background: rgba(59, 130, 246, 0.1);
    color: #2563EB;
}

.cohorte-status-en_cours .cohorte-status-dot {
    background: #3B82F6;
}

.cohorte-status-termine {
    background: rgba(16, 185, 129, 0.1);
    color: #059669;
}

.cohorte-status-termine .cohorte-status-dot {
    background: #10B981;
}

.cohorte-status-bloque {
    background: rgba(239, 68, 68, 0.1);
    color: #DC2626;
}

.cohorte-status-bloque .cohorte-status-dot {
    background: #EF4444;
}

.cohorte-status-inactif {
    background: rgba(245, 158, 11, 0.1);
    color: #D97706;
}

.cohorte-status-inactif .cohorte-status-dot {
    background: #F59E0B;
}

.cohorte-status-nouveau {
    background: rgba(107, 114, 128, 0.1);
    color: #4B5563;
}

.cohorte-status-nouveau .cohorte-status-dot {
    background: #9CA3AF;
}

.cohorte-status-en_pause {
    background: rgba(139, 92, 246, 0.1);
    color: #7C3AED;
}

.cohorte-status-en_pause .cohorte-status-dot {
    background: #8B5CF6;
}

/* Meta Chips */
.cohorte-details-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #F0F2F5;
    flex-wrap: wrap;
}

.cohorte-detail-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 10px;
    background: #F6F7F8;
    border: 1px solid #EDF0F3;
    font-size: 13px;
    font-weight: 500;
    color: #445972;
    font-family: "Open Sans", sans-serif;
}

.cohorte-detail-chip i {
    font-size: 13px;
    color: #0A58A5;
}

/* Tabs */
.cohorte-tabs-container {
    margin-top: 32px;
}

.cohorte-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
    border-bottom: 2px solid #F0F0F8;
}

.cohorte-tab {
    padding: 12px 24px;
    background-color: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: #6E7F93;
    font-size: 16px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-bottom: -2px;
}

.cohorte-tab:hover {
    color: #223245;
}

.cohorte-tab.active {
    color: #0A58A5;
    border-bottom-color: #0A58A5;
}

/* Tab Content */
.cohorte-tab-contents {
    position: relative;
    margin-top: 20px;
}


/* Overview Top Section (KPIs + Attention) */
.cohorte-overview-top {
    display: flex;
    align-items: stretch;
    gap: 26px;
}

/* KPI Panel (gradient) */
.cohorte-kpi-panel {
    width: 70%;
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 24px;
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.cohorte-kpi-panel-title {
    color: #FFF;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-kpi-panel-subtitle {
    color: #DBEAFE;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    margin-top: 6px;
    font-family: "Open Sans", sans-serif;
}

.cohorte-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-top: 18px;
}

.cohorte-kpi-card {
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(0, 0, 0, 0.10);
    padding: 14px;
    animation: fadeUp 0.4s ease-out both;
}

.cohorte-kpi-card:nth-child(1) { animation-delay: 0.2s; }
.cohorte-kpi-card:nth-child(2) { animation-delay: 0.3s; }
.cohorte-kpi-card:nth-child(3) { animation-delay: 0.4s; }
.cohorte-kpi-card:nth-child(4) { animation-delay: 0.5s; }

.cohorte-kpi-value {
    color: #FFF;
    font-size: 28px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    line-height: 1;
}

.cohorte-kpi-label {
    color: #BEDBFF;
    font-size: 12px;
    font-weight: 400;
    font-family: "Open Sans", sans-serif;
    margin-top: 8px;
}

/* Attention Panel */
.cohorte-attention-panel {
    width: 30%;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: var(--Linear, linear-gradient(144deg, #DFE5EC 11.42%, #FFF 75.57%));
    padding: 20px;
    animation: scaleIn 0.5s ease-out 0.2s both;
}

.cohorte-attention-panel-header {
    color: #6E7F93;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 0.35px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: "Open Sans", sans-serif;
    margin-bottom: 16px;
}

.cohorte-attention-panel-header i {
    color: #F59E0B;
}

.cohorte-attention-panel-title {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
}

/* Bottom Section (Activité + Actions) */
.cohorte-overview-bottom {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 26px;
    margin-top: 26px;
}

.cohorte-overview-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 24px;
    border: 1px solid #DFE5EC;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.cohorte-overview-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.cohorte-overview-card-title {
    color: #223245;
    font-size: 16px;
    font-weight: 700;
    line-height: 18px;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-see-all-link {
    font-size: 14px;
    color: #0A58A5;
    text-decoration: none;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    transition: color 0.2s ease;
}

.cohorte-see-all-link:hover {
    color: #084a8f;
    text-decoration: underline;
}

/* Points d'attention */
.cohorte-attention-items {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cohorte-attention-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background-color: #FFF;
    border-radius: 14px;
    border: 1px solid #EDF0F3;
}

.cohorte-attention-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
}

.cohorte-attention-icon.warning {
    background-color: #FEF3C7;
    color: #F59E0B;
}

.cohorte-attention-icon.info {
    background-color: #DBEAFE;
    color: #3B82F6;
}

.cohorte-attention-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cohorte-attention-title {
    font-size: 13px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.cohorte-attention-subtitle {
    font-size: 11px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.cohorte-attention-empty {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    background: #F0FFF4;
    border-radius: 10px;
    color: #22C55E;
    font-size: 13px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
}

.cohorte-attention-empty i {
    font-size: 18px;
}

.cohorte-activity-empty{
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.cohorte-attention-action:hover {
    background-color: #FDE68A;
    border-color: #FBBF24;
}

/* Actions Rapides */
.cohorte-quick-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 16px;
}

.cohorte-quick-action-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background-color: #F6F7F8;
    border: 1px solid #EDF0F3;
    border-radius: 12px;
    color: #445972;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    font-family: "Open Sans", sans-serif;
    text-align: left;
    width: 100%;
}

.cohorte-quick-action-btn:hover {
    background-color: #EDF0F3;
    border-color: #DFE5EC;
    color: #223245;
}

.cohorte-quick-action-btn.primary {
    background-color: #0A58A5;
    border-color: #0A58A5;
    color: #FFFFFF;
}

.cohorte-quick-action-btn.primary:hover {
    background-color: #084a8f;
    border-color: #084a8f;
}

.cohorte-quick-action-btn i {
    font-size: 14px;
    width: 18px;
    text-align: center;
    color: #0A58A5;
}

.cohorte-quick-action-btn.primary i {
    color: #FFFFFF;
}

/* Activité récente */
.cohorte-recent-activity {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cohorte-activity-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.cohorte-activity-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0A58A5 0%, #3B82F6 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
    flex-shrink: 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-activity-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cohorte-activity-text {
    font-size: 14px;
    color: #223245;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

.cohorte-activity-link {
    color: #0A58A5;
    text-decoration: none;
    font-weight: 600;
}

.cohorte-activity-link:hover {
    text-decoration: underline;
}

.cohorte-activity-time {
    font-size: 12px;
    color: #9CA3AF;
    font-family: "Open Sans", sans-serif;
}

/* Responsive Overview */
@media (max-width: 768px) {
    .cohorte-overview-top {
        flex-direction: column;
    }

    .cohorte-kpi-panel,
    .cohorte-attention-panel {
        width: 100% !important;
    }

    .cohorte-kpi-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .cohorte-overview-bottom {
        grid-template-columns: 1fr;
    }
}

/* Entrepreneurs Header */
.cohorte-entrepreneurs-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
    animation: fadeUp 0.4s ease-out both;
}

.cohorte-entrepreneurs-search-bar {
    border-radius: 15px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    height: 44px;
    width: 50%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.cohorte-entrepreneurs-search-bar:focus-within {
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.cohorte-entrepreneurs-search-bar i {
    color: #B5C1D0;
    font-size: 14px;
    flex-shrink: 0;
}

.cohorte-entrepreneurs-search-bar input {
    height: 100%;
    width: 100%;
    border: none;
    outline: none;
    font-size: 14px;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    background: transparent;
}

.cohorte-entrepreneurs-search-bar input::placeholder {
    color: #B5C1D0;
}

.cohorte-entrepreneurs-header-right {
    display: flex;
    align-items: center;
    gap: 14px;
}

.cohorte-entrepreneurs-count {
    font-size: 13px;
    font-weight: 500;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
}

.cohorte-invite-entrepreneur-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background-color: #0A58A5;
    color: #ffffff;
    border: none;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.cohorte-invite-entrepreneur-btn:hover {
    background-color: #084A8A;
}

.cohorte-invite-entrepreneur-btn i {
    font-size: 13px;
}

/* Entrepreneurs Table Wrapper */
.cohorte-entrepreneurs-table-wrap {
    background: #FFF;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    overflow: visible;
    animation: fadeUp 0.4s ease-out 0.1s both;
}

.cohorte-entrepreneurs-table {
    width: 100%;
    border-collapse: collapse;
}

.cohorte-entrepreneurs-table thead th {
    background: #F6F7F8;
    color: #6E7F93;
    font-size: 12px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    padding: 14px 16px;
    text-align: left;
    white-space: nowrap;
    border-bottom: 1px solid #DFE5EC;
}

.cohorte-entrepreneurs-table thead th:first-child {
    border-top-left-radius: 20px;
    padding-left: 24px;
}

.cohorte-entrepreneurs-table thead th:last-child {
    border-top-right-radius: 20px;
    padding-right: 24px;
}

.cohorte-entrepreneurs-table tbody tr {
    border-bottom: 1px solid #F0F2F5;
    transition: background-color 0.15s ease;
}

.cohorte-entrepreneurs-table tbody tr:last-child {
    border-bottom: none;
}

.cohorte-entrepreneurs-table tbody tr:hover {
    background-color: #F9FAFB;
}

.cohorte-entrepreneurs-table tbody td {
    padding: 16px 16px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    color: #223245;
    vertical-align: middle;
}

.cohorte-entrepreneurs-table tbody td:first-child {
    padding-left: 24px;
}

.cohorte-entrepreneurs-table tbody td:last-child {
    padding-right: 24px;
    width: 48px;
}

.cohorte-entrepreneurs-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: 20px;
}

.cohorte-entrepreneurs-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: 20px;
}

/* Entrepreneur Cell */
.entrepreneur-cell {
    display: flex;
    align-items: center;
    gap: 12px;
}

.entrepreneur-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0A58A5 0%, #3B82F6 100%);
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
    flex-shrink: 0;
    font-family: "Open Sans", sans-serif;
}

.entrepreneur-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.entrepreneur-name {
    font-size: 14px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.entrepreneur-email {
    font-size: 12px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

/* Projet / Étape / Activité */
.projet-name {
    font-size: 13px;
    color: #223245;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
}

.no-projet, .no-etape, .no-progression, .no-activity {
    font-size: 13px;
    color: #B5C1D0;
    font-family: "Open Sans", sans-serif;
}

.etape-name {
    font-size: 13px;
    color: #0A58A5;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
}

.last-activity {
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

/* Empty state */
.cohorte-entrepreneurs-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
}

.cohorte-entrepreneurs-empty-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(10, 88, 165, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.cohorte-entrepreneurs-empty-icon i {
    font-size: 24px;
    color: #0A58A5;
}

.cohorte-entrepreneurs-empty h3 {
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 8px 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-entrepreneurs-empty p {
    font-size: 14px;
    color: #6E7F93;
    margin: 0 0 24px 0;
    font-family: "Open Sans", sans-serif;
}

button.status-tab {
    border: none;
}

@media (max-width: 768px) {
    .cohorte-entrepreneurs-header {
        flex-direction: column;
        align-items: stretch;
    }

    .cohorte-entrepreneurs-search-bar {
        width: 100%;
    }

    .cohorte-entrepreneurs-table-wrap {
        overflow-x: auto;
    }
}

/* Back Button */
.back-button {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    text-decoration: none;
    transition: color 0.2s ease;
}

.back-button svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}


/* Search and Filters Bar */
.search-filters-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.search-container {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.filters-container {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.filter-btn {
    padding: 10px 20px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    background-color: #ffffff;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.filter-btn:hover {
    background-color: #F6F7F8;
    border-color: #0A58A5;
    color: #0A58A5;
}

.filter-btn.active {
    background-color: #0A58A5;
    border-color: #0A58A5;
    color: #ffffff;
}

.filter-btn.active:hover {
    background-color: #084c94;
}

.cohortes-content {
    margin-top: 0;
}

/* Table */
.table-container {
    overflow-x: auto;
    overflow-y: visible;
    position: relative;
}

.cohortes-table {
    width: 100%;
    border-collapse: collapse;
    position: relative;
}

.cohortes-table thead {
    background-color: #F6F7F8;
}

.cohortes-table tbody tr.cohorte-row-hidden {
    display: none;
}

/* Cohorte Names (for entrepreneurs page) */
.cohorte-names {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.cohorte-name-tag {
    font-size: 14px;
    color: #0A58A5;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
}

.cohorte-separator {
    color: #6E7F93;
    font-size: 14px;
}

.cohorte-more {
    font-size: 14px;
    color: #6E7F93;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
}

.no-cohorte {
    font-size: 14px;
    color: #9CA3AF;
    font-family: "Open Sans", sans-serif;
}

/* Progression Cell */
.progression-cell {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 120px;
}

.progression-value {
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 133.333% */
    display: flex;
    justify-content: end;
}

.progression-bar-container {
    width: 100%;
    height: 8px;
    background-color: #EBF3FA;
    border-radius: 4px;
    overflow: hidden;
}

.progression-bar {
    height: 100%;
    background-color: #0A58A5;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.cohorte-tags{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 5px;
}

.cohorte-tags .tag{
    border-radius: 4px;
    background: #E8EDF3;
    height: 18.281px;
    padding: 0 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 14.286px; /* 142.857% */
    text-transform: uppercase;
}

/* Actions Cell */
.actions-cell {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.actions-cell:has(.dropdown-menu.active) {
    z-index: 10000;
}

.actions-cell .ellipsis-btn {
    position: relative;
    z-index: 1;
}

.actions-cell .dropdown-menu {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 10000;
    background-color: #ffffff;
}

.ellipsis-btn {
    border: none;
}

.ellipsis-btn:hover {
    background-color: #E0F2FE;
    border-color: #0A58A5;
    color: #0A58A5;
}

.ellipsis-btn i {
    font-size: 14px;
}

/* Dropdown Menu */
.dropdown-menu {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 4px;
    min-width: 220px;
    z-index: 10000;
    display: none;
    overflow: visible;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 8px;
}

.dropdown-menu.active {
    display: block;
}

.dropdown-item span{
    font-size: 14px;
    border-radius: 10px;
    color: var(--Color2, #6E7F93);
    font-weight: 500;
}

.dropdown-item-warning span{
    color: #FC121B !important;
}

.dropdown-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    
}

.dropdown-item:hover {
    background-color: #F6F7F8;
}

.dropdown-item i {
    width: 16px;
    text-align: center;
    color: #6E7F93;
    font-size: 14px;
}

.dropdown-item-danger {
    color: #DC2626;
}

.dropdown-item-danger:hover {
    background-color: #FEF2F2;
}

.dropdown-item-danger i {
    color: #DC2626;
}
/* Modal Styles */
.cohorte-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.cohorte-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

.cohorte-modal-content {
    position: relative;
    background-color: #ffffff;
    border-radius: 12px;
    width: 100%;
    max-width: 800px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    z-index: 1001;
}

.cohorte-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
}

.cohorte-modal-header h3 {
    font-size: 20px;
    font-weight: 600;
    color: #1F2937;
    margin: 0;
}

.cohorte-modal-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 6px;
    color: #6E7F93;
    cursor: pointer;
    transition: all 0.2s;
}

.cohorte-modal-close:hover {
    background-color: #F6F7F8;
    color: #1F2937;
}

.cohorte-modal-form {
    padding: 24px;
}

.form-input,
.form-textarea {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    color: #1F2937;
    background-color: #ffffff;
    transition: border-color 0.2s;
    font-family: inherit;
    box-sizing: border-box;
}

/* Supprimer les bordures rouges pour les champs required/invalid dans le formulaire de cohorte */
.cohorte-modal-form .form-input:required,
.cohorte-modal-form .form-input:invalid,
.cohorte-modal-form .form-input:required:invalid,
.cohorte-modal-form .form-input:required:invalid:focus,
.cohorte-modal-form .form-textarea:required,
.cohorte-modal-form .form-textarea:invalid,
.cohorte-modal-form .form-textarea:required:invalid,
.cohorte-modal-form .form-textarea:required:invalid:focus,
.cohorte-modal-form .form-input select:required,
.cohorte-modal-form .form-input select:invalid,
.cohorte-modal-form .form-input select:required:invalid,
.cohorte-modal-form .form-input select:required:invalid:focus,
.cohorte-modal-form input[type="text"]:required,
.cohorte-modal-form input[type="text"]:invalid,
.cohorte-modal-form input[type="date"]:required,
.cohorte-modal-form input[type="date"]:invalid,
.cohorte-modal-form textarea:required,
.cohorte-modal-form textarea:invalid {
    border-color: #DFE5EC !important;
    outline: none !important;
    box-shadow: none !important;
}

.form-input:focus,
.form-textarea:focus,
.form-input select:focus {
    outline: none;
    border-color: #0A58A5;
}

.form-input select {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    color: #223245;
    background-color: #ffffff;
    cursor: pointer;
    transition: border-color 0.2s;
    font-family: inherit;
    box-sizing: border-box;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%236E7F93' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 40px;
}

.form-input select:hover {
    border-color: #CED4DA;
}

/* Supprimer les bordures rouges pour les champs required/invalid dans le formulaire de cohorte */
.cohorte-modal-form .form-input:required,
.cohorte-modal-form .form-input:invalid,
.cohorte-modal-form .form-input:required:invalid,
.cohorte-modal-form .form-input:required:invalid:focus,
.cohorte-modal-form .form-input:required:invalid:not(:placeholder-shown),
.cohorte-modal-form .form-input:required:invalid:not(:placeholder-shown):focus,
.cohorte-modal-form .form-textarea:required,
.cohorte-modal-form .form-textarea:invalid,
.cohorte-modal-form .form-textarea:required:invalid,
.cohorte-modal-form .form-textarea:required:invalid:focus,
.cohorte-modal-form .form-input select:required,
.cohorte-modal-form .form-input select:invalid,
.cohorte-modal-form .form-input select:required:invalid,
.cohorte-modal-form .form-input select:required:invalid:focus,
.cohorte-modal-form input[type="text"]:required,
.cohorte-modal-form input[type="text"]:invalid,
.cohorte-modal-form input[type="date"]:required,
.cohorte-modal-form input[type="date"]:invalid,
.cohorte-modal-form textarea:required,
.cohorte-modal-form textarea:invalid {
    border-color: #DFE5EC !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Règles générales pour tous les formulaires de cohorte */
.form-input:required,
.form-input:invalid,
.form-input:required:invalid,
.form-input:required:invalid:focus,
.form-input:required:invalid:not(:placeholder-shown),
.form-input:required:invalid:not(:placeholder-shown):focus,
.form-textarea:required,
.form-textarea:invalid,
.form-textarea:required:invalid,
.form-textarea:required:invalid:focus,
.form-input select:required,
.form-input select:invalid,
.form-input select:required:invalid,
.form-input select:required:invalid:focus {
    border-color: #DFE5EC !important;
    outline: none !important;
    box-shadow: none !important;
}

.form-textarea {
    resize: vertical;
    min-height: 100px;
}

.cohorte-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #DFE5EC;
}

.btn-cancel {
    padding: 12px 20px;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    background-color: #ffffff;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-cancel:hover {
    background-color: #F6F7F8;
    border-color: #9CA3AF;
}

.btn-submit {
    padding: 12px 20px;
    border: none;
    border-radius: 16px;
    background-color: #0A58A5;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-submit:hover {
    background-color: #084c94;
}

.btn-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Empty State */
.empty-state {
    text-align: center;
    padding: 60px 20px;
}

.empty-state-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.empty-state-content i {
    font-size: 48px;
    color: #9CA3AF;
}

.empty-state-content p {
    font-size: 16px;
    color: #6E7F93;
    margin: 0;
}

/* Modal Inviter des entrepreneurs */
.invite-entrepreneur-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.invite-entrepreneur-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

.invite-entrepreneur-modal-content {
    position: relative;
    background-color: #ffffff;
    border-radius: 12px;
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    z-index: 1;
}

.invite-entrepreneur-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
}

.invite-entrepreneur-modal-title {
    font-size: 20px;
    font-weight: 600;
    color: #1F2937;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.invite-entrepreneur-modal-close {
    background: none;
    border: none;
    color: #6E7F93;
    font-size: 20px;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
}

.invite-entrepreneur-modal-close:hover {
    color: #1F2937;
}

.invite-entrepreneur-modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Invitations en attente */
.pending-invitations-section {
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #DFE5EC;
}

.pending-invitations-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.pending-invitations-title {
    font-size: 16px;
    font-weight: 600;
    color: #1F2937;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.pending-invitations-count {
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.pending-invitations-warning {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background-color: #FEF3C7;
    border: 1px solid #FCD34D;
    border-radius: 6px;
    margin-bottom: 16px;
    font-size: 12px;
    color: #92400E;
    font-family: "Open Sans", sans-serif;
}

.pending-invitations-warning i {
    font-size: 14px;
}

.pending-invitations-actions-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    padding: 8px 0;
}

.select-all-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
}

.select-all-checkbox input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.resend-selected-invitations-btn {
    padding: 6px 16px;
    background-color: #0A58A5;
    color: #FFFFFF;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.resend-selected-invitations-btn:hover {
    background-color: #084a8a;
}

.pending-invitations-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 340px;
    overflow-y: auto;
}

.pending-invitations-list::-webkit-scrollbar {
    width: 4px;
}

.pending-invitations-list::-webkit-scrollbar-track {
    background: transparent;
}

.pending-invitations-list::-webkit-scrollbar-thumb {
    background: #DFE5EC;
    border-radius: 4px;
}

.pending-invitations-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px 0 4px;
    border-top: 1px solid #EDF0F3;
    margin-top: 12px;
}

.pagination-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    color: #0A58A5;
    background: #F0F7FF;
    text-decoration: none;
    transition: background 0.2s ease;
    cursor: pointer;
}

.pagination-btn:hover {
    background: #DBEAFE;
}

.pagination-btn.disabled {
    color: #B5C1D0;
    background: #F6F7F8;
    cursor: default;
    pointer-events: none;
}

.pagination-btn i {
    font-size: 11px;
}

.pagination-info {
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    font-weight: 500;
}

.pending-invitation-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background-color: #F8F9FA;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    transition: all 0.2s ease;
}

.invitation-checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
    flex-shrink: 0;
}

.invitation-checkbox-input {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.pending-invitation-item:hover {
    background-color: #F0F2F5;
    border-color: #0A58A5;
}

.pending-invitation-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pending-invitation-email {
    font-size: 14px;
    font-weight: 500;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
}

.pending-invitation-date {
    font-size: 12px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.pending-invitation-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pending-invitation-status {
    font-size: 12px;
    font-weight: 500;
    color: #F59E0B;
    padding: 4px 8px;
    background-color: #FEF3C7;
    border-radius: 4px;
    font-family: "Open Sans", sans-serif;
}

.resend-invitation-btn {
    padding: 6px 12px;
    background-color: #0A58A5;
    color: #FFFFFF;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.resend-invitation-btn:hover {
    background-color: #084a8a;
}

.invite-entrepreneur-options {
    border-bottom: 1px solid #DFE5EC;
    display: flex;
    align-items: center;
    margin-bottom: 24px;
}

.invite-option-btn {
    border-radius: 10px 10px 0 0;
    display: flex;
    height: 44px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 0 16px;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px;
    border: none;
    cursor: pointer;
}

.invite-option-btn.active {
    color: var(--Color-2, #0A58A5);
    border-bottom: 1.5px solid rgb(10, 88, 165);
    background: rgba(10, 88, 165, 0.06);
}

.invite-option-btn i {
    font-size: 16px;
}

.invite-entrepreneur-form {
    margin-top: 24px;
}

.cohorte-modal-form .form-group {
    margin-bottom: 10px;
    gap: 0;
}


.form-textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    color: #1F2937;
    resize: vertical;
    transition: border-color 0.2s ease;
}

.form-textarea:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.form-textarea::placeholder {
    color: #9CA3AF;
}

.form-help-text {
    font-size: 12px;
    color: #6E7F93;
    margin-top: 8px;
    margin-bottom: 0;
    font-family: "Open Sans", sans-serif;
}

/* Email Fields */
.form-label-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.add-email-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    border: none;
    border-radius: 6px;
    color: #0A58A5;
    font-size: 13px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.add-email-btn i {
    font-size: 12px;
}

.email-fields-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.email-field-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.email-field-input {
    flex: 1;
    padding: 12px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    color: #1F2937;
    transition: border-color 0.2s ease;
}

.email-field-input:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.email-field-input::placeholder {
    color: #9CA3AF;
}

.email-field-remove-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    background-color: #F6F7F8;
    border: 1px solid #DFE5EC;
    border-radius: 6px;
    color: #6E7F93;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.email-field-remove-btn:hover {
    background-color: #FEE2E2;
    border-color: #DC2626;
    color: #DC2626;
}

.file-upload-container {
    position: relative;
}

.file-input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.file-upload-area {
    border: 2px dashed #DFE5EC;
    border-radius: 8px;
    padding: 40px 20px;
    text-align: center;
    background-color: #F6F7F8;
    transition: all 0.2s ease;
    cursor: pointer;
}

.file-upload-area:hover {
    border-color: #0A58A5;
    background-color: #F0F7FF;
}

.file-upload-icon {
    font-size: 48px;
    color: #9CA3AF;
    margin-bottom: 16px;
}

.file-upload-text {
    font-size: 14px;
    font-weight: 500;
    color: #1F2937;
    margin: 0 0 8px 0;
    font-family: "Open Sans", sans-serif;
}

.file-upload-hint {
    font-size: 12px;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.file-selected {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    background-color: #F6F7F8;
}

.file-selected i {
    font-size: 20px;
    color: #0A58A5;
}

.file-selected span {
    flex: 1;
    font-size: 14px;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
}

.file-remove-btn {
    background: none;
    border: none;
    color: #6E7F93;
    font-size: 16px;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
}

.file-remove-btn:hover {
    color: #DC2626;
}

.invite-entrepreneur-modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 24px;
    border-top: 1px solid #DFE5EC;
}

.invite-modal-btn {
    padding: 12px 24px;
    border: none;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.invite-modal-btn-cancel {
    background-color: #F6F7F8;
    color: #6E7F93;
}

.invite-modal-btn-cancel:hover {
    background-color: #DFE5EC;
    color: #1F2937;
}

.invite-modal-btn-submit {
    background-color: #0A58A5;
    color: #ffffff;
}

.invite-modal-btn-submit:hover {
    background-color: #084A8A;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(10, 88, 165, 0.3);
}

/* Statistics Section */
/* ===== Statistics Tab ===== */

/* Top: Summary panel + Chart panel */
.cohorte-stats-top {
    display: flex;
    align-items: stretch;
    gap: 26px;
    animation: fadeUp 0.4s ease-out both;
}

/* Summary panel (gradient) */
.cohorte-stats-summary-panel {
    width: 60%;
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 24px;
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.cohorte-stats-summary-title {
    color: #FFF;
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-stats-summary-subtitle {
    color: #DBEAFE;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    margin-top: 6px;
    font-family: "Open Sans", sans-serif;
}

.cohorte-stats-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 18px;
}

.cohorte-stats-summary-card {
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(0, 0, 0, 0.10);
    padding: 16px;
    animation: fadeUp 0.4s ease-out both;
}

.cohorte-stats-summary-card:nth-child(1) { animation-delay: 0.2s; }
.cohorte-stats-summary-card:nth-child(2) { animation-delay: 0.3s; }
.cohorte-stats-summary-card:nth-child(3) { animation-delay: 0.4s; }

.cohorte-stats-summary-value {
    color: #FFF;
    font-size: 28px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    line-height: 1;
}

.cohorte-stats-summary-label {
    color: #BEDBFF;
    font-size: 12px;
    font-weight: 400;
    font-family: "Open Sans", sans-serif;
    margin-top: 8px;
}

/* Chart panel (light gradient) */
.cohorte-stats-chart-panel {
    width: 40%;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: var(--Linear, linear-gradient(144deg, #DFE5EC 11.42%, #FFF 75.57%));
    padding: 20px;
    animation: scaleIn 0.5s ease-out 0.2s both;
    display: flex;
    flex-direction: column;
}

.cohorte-stats-chart-header {
    color: #6E7F93;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.35px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: "Open Sans", sans-serif;
    margin-bottom: 12px;
}

.cohorte-stats-chart-header i {
    color: #0A58A5;
}

.cohorte-stats-chart-title {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
}

.cohorte-stats-chart-wrapper {
    flex: 1;
    position: relative;
    min-height: 180px;
}

.cohorte-stats-chart-wrapper canvas {
    max-width: 100%;
    max-height: 100%;
    width: 100% !important;
    height: 100% !important;
}

/* Evolution card (full width) */
.cohorte-stats-evolution-card {
    background: #FFF;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    padding: 24px;
    margin-top: 26px;
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.cohorte-stats-evolution-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 20px;
}

.cohorte-stats-evolution-title {
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-stats-evolution-subtitle {
    font-size: 13px;
    color: #6E7F93;
    margin: 4px 0 0 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-stats-evolution-chart {
    width: 100%;
    height: 280px;
    position: relative;
}

.cohorte-stats-evolution-chart canvas {
    max-width: 100%;
    max-height: 100%;
    width: 100% !important;
    height: 100% !important;
}

/* Bottom: Modules + Secteurs */
.cohorte-stats-bottom {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 26px;
    margin-top: 26px;
}

.cohorte-stats-list-card {
    background: #FFF;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    padding: 24px;
    animation: fadeUp 0.4s ease-out 0.35s both;
}

.cohorte-stats-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.cohorte-stats-list-header i {
    color: #0A58A5;
    font-size: 16px;
}

.cohorte-stats-list-title {
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-stats-list-items {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cohorte-stats-list-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cohorte-stats-list-item-rank {
    display: flex;
    align-items: center;
    gap: 10px;
}

.rank-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: #0A58A5;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    flex-shrink: 0;
}

.cohorte-stats-list-item-name {
    font-size: 13px;
    font-weight: 500;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    min-width: 120px;
}

.cohorte-stats-list-item-bar {
    flex: 1;
    height: 8px;
    background: #EDF0F3;
    border-radius: 4px;
    overflow: hidden;
}

.cohorte-stats-list-item-fill {
    height: 100%;
    background: #0A58A5;
    border-radius: 4px;
    transition: width 0.5s ease;
}

.cohorte-stats-list-item-fill.green {
    background: #10B981;
}

.cohorte-stats-list-item-value {
    font-size: 14px;
    font-weight: 700;
    color: #0A58A5;
    font-family: "Open Sans", sans-serif;
    min-width: 40px;
    text-align: right;
}

.cohorte-statistics-empty {
    padding: 40px 20px;
    text-align: center;
    color: #B5C1D0;
    font-size: 14px;
    font-style: italic;
    font-family: "Open Sans", sans-serif;
}

.cohorte-chart-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    text-align: center;
    gap: 8px;
}

.cohorte-chart-empty i {
    font-size: 32px;
    color: #DFE5EC;
    margin-bottom: 4px;
}

.cohorte-chart-empty p {
    font-size: 14px;
    font-weight: 600;
    color: #4B5563;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-chart-empty span {
    font-size: 12px;
    color: #9CA3AF;
    font-family: "Open Sans", sans-serif;
    max-width: 260px;
    line-height: 1.4;
}

@media (max-width: 768px) {
    .cohorte-stats-top {
        flex-direction: column;
    }

    .cohorte-stats-summary-panel,
    .cohorte-stats-chart-panel {
        width: 100% !important;
    }

    .cohorte-stats-summary-grid {
        grid-template-columns: 1fr;
    }

    .cohorte-stats-bottom {
        grid-template-columns: 1fr;
    }
}

/* Settings Section */
/* Sous-onglets pour les paramètres de cohorte */


.cohorte-settings-subtab-content {
    display: none;
}

.cohorte-settings-subtab-content.active {
    display: block;
}

.cohorte-settings-section {
    margin-bottom: 32px;
    padding-bottom: 32px;
    border-bottom: 1px solid #DFE5EC;
}

.cohorte-settings-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.cohorte-settings-section-title {
    font-size: 18px;
    font-weight: 700;
    color: #1F2937;
    margin: 0 0 16px 0;
    font-family: "Open Sans", sans-serif;
}

.cohorte-settings-section-description {
    font-size: 14px;
    color: #6E7F93;
    margin: 0 0 24px 0;
    font-family: "Open Sans", sans-serif;
    line-height: 1.5;
}

.cohorte-settings-form {
    display: flex;
    flex-direction: column;
}

.cohorte-settings-form .form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.cohorte-settings-form .form-label {
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
}

.cohorte-settings-form .form-input,
.cohorte-settings-form .form-textarea,
.cohorte-settings-form .form-select {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    color: #1F2937;
    background-color: #FFFFFF;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.cohorte-settings-form .form-input:focus,
.cohorte-settings-form .form-textarea:focus,
.cohorte-settings-form .form-select:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.cohorte-settings-form .form-textarea {
    resize: vertical;
    min-height: 100px;
}

.cohorte-settings-form .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.cohorte-settings-form .form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.cohorte-settings-form .form-actions .btn {
    padding: 12px 32px;
    border: none;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 200px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.cohorte-settings-form .form-actions .btn i {
    font-size: 14px;
}

.cohorte-settings-form .form-actions .btn span {
    font-size: 14px;
    font-weight: 600;
}

.cohorte-settings-form .form-actions .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
}

.cohorte-settings-form .form-actions .btn:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.cohorte-settings-form .form-actions .btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.cohorte-actions-button{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 20px;
}

.cohorte-actions-button h3{
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
}

.cohorte-actions-button p{
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    line-height: 1.4;
}

/* Modules Configuration */
.modules-config-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
}

.module-config-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    transition: all 0.2s ease;
    background-color: #ffffff;
}

.module-config-item:hover {
    border-color: #0A58A5;
}

.module-toggle {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
    cursor: pointer;
    margin: 0;
}

.module-toggle-input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.module-toggle-slider {
    position: absolute;
    inset: 0;
    background-color: #D1D5DB;
    border-radius: 24px;
    transition: all 0.25s ease;
}

.module-toggle-slider::before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    left: 3px;
    bottom: 3px;
    background-color: #ffffff;
    border-radius: 50%;
    transition: transform 0.25s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.module-toggle-input:checked + .module-toggle-slider {
    background-color: #0A58A5;
}

.module-toggle-input:checked + .module-toggle-slider::before {
    transform: translateX(20px);
}

.module-toggle-input:focus-visible + .module-toggle-slider {
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.2);
}

.module-config-label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.module-config-label strong {
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
}

.module-config-description {
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    line-height: 1.4;
}

/* Drag and Drop */
.module-drag-handle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: #9CA3AF;
    cursor: grab;
    flex-shrink: 0;
    transition: color 0.2s ease;
}

.module-drag-handle:active {
    cursor: grabbing;
}

.module-drag-handle:hover {
    color: #0A58A5;
}

.module-position-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background-color: #0A58A5;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    flex-shrink: 0;
}

.module-sortable-ghost {
    border: 2px dashed #0A58A5 !important;
    background-color: rgba(10, 88, 165, 0.05) !important;
    opacity: 0.6;
}

.module-sortable-chosen {
    box-shadow: 0 4px 16px rgba(10, 88, 165, 0.25);
}

.module-sortable-drag {
    transform: rotate(1deg);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

/* Cohort Actions */
.cohorte-actions-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cohorte-actions-buttons {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cohorte-actions-buttons .btn {
    padding: 12px 24px;
    border: none;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}

.cohorte-settings-form .btn-primary,
.btn-primary {
    background-color: #0A58A5;
    color: #ffffff;
}

.cohorte-settings-form .btn-primary:hover,
.btn-primary:hover {
    background-color: #084A8A;
}

.cohorte-settings-form .btn-primary:focus,
.btn-primary:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.2);
}

.btn-warning {
    background-color: #FC121B;
    color: #ffffff;
}

.btn-warning:hover {
    background-color: #D97706;
}

.btn-success {
    background-color: #10B981;
    color: #ffffff;
}

.btn-success:hover {
    background-color: #059669;
}

.btn-secondary {
    background-color: #6E7F93;
    color: #ffffff;
}

.btn-secondary:hover {
    background-color: #556472;
}

.btn-info {
    background-color: #0A58A5;
    color: #ffffff;
}

.btn-info:hover {
    background-color: #084A8A;
}
/* Modules Config Status */
.save-status {
    margin-left: 12px;
    font-size: 14px;
    padding: 8px 12px;
    border-radius: 6px;
    display: inline-block;
    transition: all 0.3s ease;
}

.save-status-success {
    background-color: #D1FAE5;
    color: #065F46;
    border: 1px solid #10B981;
}

.save-status-error {
    background-color: #FEE2E2;
    color: #991B1B;
    border: 1px solid #EF4444;
}

.save-status-info {
    background-color: #DBEAFE;
    color: #1E40AF;
    border: 1px solid #3B82F6;
}

.form-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cohortes-table tr{
    border-bottom: 1px solid #DFE5EC;
}

/* ═══════════════════════════════════════════════
   COHORTES INDEX — card grid redesign
═══════════════════════════════════════════════ */

/* Header stats */
.coh-header-stats {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: #4B5563;
    font-family: "Open Sans", sans-serif;
}
.coh-header-stat { display: flex; align-items: center; gap: 5px; }
.coh-header-stat strong { font-weight: 700; color: #1F2937; }
.coh-header-stat-sep { width: 1px; height: 16px; background: #DFE5EC; }

/* Toolbar: search + filters */
.coh-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.coh-search {
    position: relative;
    flex: 1;
    min-width: 200px;
    max-width: 320px;
}
.coh-search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #9CA3AF;
    font-size: 13px;
    pointer-events: none;
}
.coh-search-input {
    width: 100%;
    padding: 9px 12px 9px 36px;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    font-size: 13px;
    font-family: "Open Sans", sans-serif;
    color: #223245;
    background: #fff;
    outline: none;
    transition: border-color .15s;
}
.coh-search-input:focus { border-color: #0A58A5; }

.coh-filters {
    display: flex;
    gap: 4px;
    background: #F1F5F9;
    border-radius: 10px;
    padding: 4px;
}
.coh-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 7px;
    border: none;
    background: none;
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    cursor: pointer;
    font-family: "Open Sans", sans-serif;
    transition: all .15s;
}
.coh-filter-btn:hover { color: #223245; }
.coh-filter-btn.active {
    background: #fff;
    color: #0A1929;
    box-shadow: 0 1px 4px rgba(0,0,0,.1);
}
.coh-filter-count {
    background: #E2E8F0;
    color: #475569;
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 20px;
    min-width: 18px;
    text-align: center;
}
.coh-filter-btn.active .coh-filter-count { background: #EFF6FF; color: #0A58A5; }

/* Card grid */
.coh-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
@media (max-width: 1100px) { .coh-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 680px)  { .coh-grid { grid-template-columns: 1fr; } }

/* Hidden state for filter */
.cohorte-row-hidden { display: none !important; }

/* Card */
.coh-card {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 14px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s, transform .15s;
}
.coh-card:hover {
    box-shadow: 0 8px 24px rgba(0,0,0,.08);
    transform: translateY(-2px);
}

/* Accent bar — color by status */
.coh-card-accent {
    height: 4px;
    width: 100%;
    flex-shrink: 0;
}
.coh-card--active   .coh-card-accent { background: linear-gradient(90deg, #0A58A5, #38BDF8); }
.coh-card--terminee .coh-card-accent { background: #CBD5E1; }
.coh-card--brouillon .coh-card-accent { background: repeating-linear-gradient(90deg, #F59E0B 0, #F59E0B 8px, transparent 8px, transparent 16px); }

/* Muted look for terminated */
.coh-card--terminee { opacity: .85; }

.coh-card-body {
    padding: 18px 20px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
}

/* Top row */
.coh-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}
.cohorte-name strong {
    font-size: 15px;
    font-weight: 700;
    color: #0A1929;
    font-family: "Open Sans", sans-serif;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Status badge */
.coh-status {
    font-size: 10px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: .4px;
    font-family: "Open Sans", sans-serif;
    flex-shrink: 0;
}
.coh-status--active   { background: #D1FAE5; color: #065F46; }
.coh-status--terminee { background: #F1F5F9; color: #475569; }
.coh-status--brouillon { background: #FEF3C7; color: #92400E; }

/* Meta */
.coh-card-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.coh-tag {
    font-size: 11px;
    font-weight: 600;
    background: #EFF6FF;
    color: #0A58A5;
    padding: 2px 8px;
    border-radius: 6px;
    font-family: "Open Sans", sans-serif;
    text-transform: capitalize;
}
.coh-period {
    font-size: 11px;
    color: #6E7F93;
    display: flex;
    align-items: center;
    gap: 4px;
    font-family: "Open Sans", sans-serif;
}

/* Progress */
.coh-progress-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
}
.coh-progress-bar {
    flex: 1;
    height: 6px;
    background: #F1F5F9;
    border-radius: 3px;
    overflow: hidden;
}
.coh-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #0A58A5, #38BDF8);
    border-radius: 3px;
    transition: width .4s;
}
.coh-card--terminee .coh-progress-fill { background: #94A3B8; }
.coh-progress-pct {
    font-size: 12px;
    font-weight: 700;
    color: #0A1929;
    width: 36px;
    text-align: right;
    font-family: "Open Sans", sans-serif;
    flex-shrink: 0;
}

/* Stats row */
.coh-card-stats {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: #4B5563;
    font-family: "Open Sans", sans-serif;
}
.coh-stat {
    display: flex;
    align-items: center;
    gap: 5px;
}
.coh-stat i { color: #0A58A5; font-size: 11px; }
.coh-stat strong { font-weight: 700; color: #0A1929; }
.coh-stat-sep { width: 1px; height: 14px; background: #E2E8F0; }

/* Actions */
.coh-card-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding-top: 4px;
    border-top: 1px solid #F1F5F9;
}
.coh-btn-primary {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 14px;
    background: #0A58A5;
    color: #fff;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: background .15s;
}
.coh-btn-primary:hover { background: #084788; }

.coh-btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #E2E8F0;
    color: #6E7F93;
    text-decoration: none;
    font-size: 13px;
    transition: all .15s;
}
.coh-btn-ghost:hover { border-color: #0A58A5; color: #0A58A5; background: #EFF6FF; }
.coh-btn-ghost--warn:hover { border-color: #EF4444; color: #EF4444; background: #FEE2E2; }
.coh-btn-ghost--success:hover { border-color: #059669; color: #059669; background: #D1FAE5; }

/* Empty states */
.coh-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 60px 20px;
    color: #94A3B8;
    text-align: center;
    font-family: "Open Sans", sans-serif;
}
.coh-empty-state i { font-size: 36px; }

/* ════════════════════════════════════════
   CSH — Cohorte Show
════════════════════════════════════════ */

/* Header */
.csh-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    text-decoration: none;
    white-space: nowrap;
    transition: color .15s;
    flex-shrink: 0;
}
.csh-back:hover { color: #0A58A5; }
.csh-back i { font-size: 11px; }

.csh-header-shortname {
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0 16px;
}

.csh-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex-shrink: 0;
}

.csh-btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    background: #fff;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    color: #223245;
    cursor: pointer;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: border-color .15s, background .15s;
}
.csh-btn-secondary:hover { border-color: #0A58A5; color: #0A58A5; background: #EFF6FF; }

/* Status badge */
.csh-status {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .03em;
    flex-shrink: 0;
}
.csh-status--active    { background: #D1FAE5; color: #065F46; }
.csh-status--terminee  { background: #F3F4F6; color: #374151; }
.csh-status--brouillon { background: #FEF3C7; color: #92400E; }

/* Welcome banner */
.csh-welcome {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #EFF6FF;
    border: 1px solid #BFDBFE;
    border-radius: 10px;
    padding: 14px 18px;
    margin: 16px 20px 0;
    font-family: "Open Sans", sans-serif;
}
.csh-welcome i { color: #3B82F6; font-size: 18px; margin-top: 2px; flex-shrink: 0; }
.csh-welcome strong { display: block; font-size: 13px; font-weight: 700; color: #1E3A5F; margin-bottom: 2px; }
.csh-welcome p { font-size: 12px; color: #3B5572; margin: 0; }

/* Detail card */
.csh-detail-card {
    background: #fff;
    border-bottom: 1px solid #EBF0F5;
    padding: 18px 24px;
    font-family: "Open Sans", sans-serif;
}
.csh-detail-main {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}
.csh-detail-logo {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid #EBF0F5;
}
.csh-detail-logo-placeholder {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: #DBEAFE;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 800;
    color: #1D4ED8;
    flex-shrink: 0;
}
.csh-detail-info { flex: 1; min-width: 0; }
.csh-detail-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.csh-detail-name {
    font-size: 17px;
    font-weight: 800;
    color: #223245;
    margin: 0;
    line-height: 1.2;
}
.csh-detail-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.csh-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: #F1F5F9;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    color: #4A6179;
}
.csh-chip i { font-size: 10px; color: #6E7F93; }
.csh-chip--progress { background: #EFF6FF; color: #1D4ED8; }
.csh-chip--progress i { color: #3B82F6; }
.csh-detail-objective {
    font-size: 12px;
    color: #6E7F93;
    margin: 8px 0 0;
    line-height: 1.5;
}

/* Tab navigation — sticky */
.csh-tabs {
    display: flex;
    align-items: center;
    border-bottom: 2px solid #EBF0F5;
    padding: 0 20px;
    background: #fff;
    position: sticky;
    top: 0;
    z-index: 20;
    overflow-x: auto;
    scrollbar-width: none;
}
.csh-tabs::-webkit-scrollbar { display: none; }

.csh-tab {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 13px 16px 11px;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    background: none;
    font-size: 13px;
    font-weight: 600;
    color: #6E7F93;
    cursor: pointer;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    transition: color .15s, border-color .15s;
}
.csh-tab i { font-size: 12px; }
.csh-tab:hover { color: #223245; }
.csh-tab.is-active { color: #0A58A5; border-bottom-color: #0A58A5; }

.csh-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 18px;
    padding: 0 6px;
    background: #EBF0F5;
    border-radius: 9px;
    font-size: 10px;
    font-weight: 700;
    color: #4A6179;
}
.csh-tab.is-active .csh-tab-count { background: #DBEAFE; color: #1D4ED8; }

/* Tab contents container */
.csh-tab-contents {
    padding-top: 20px;
    font-family: "Open Sans", sans-serif;
}

/* KPI band — overview */
.csh-kpi-band {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
.csh-kpi {
    background: #fff;
    border: 1px solid #EBF0F5;
    border-radius: 10px;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.csh-kpi-num {
    font-size: 28px;
    font-weight: 800;
    color: #223245;
    line-height: 1;
}
.csh-kpi-unit { font-size: 16px; font-weight: 700; color: #6E7F93; }
.csh-kpi-lbl { font-size: 11px; font-weight: 600; color: #6E7F93; text-transform: uppercase; letter-spacing: .05em; }
.csh-kpi-bar { height: 4px; background: #EBF0F5; border-radius: 2px; margin-top: 6px; overflow: hidden; }
.csh-kpi-fill { height: 100%; background: #0A58A5; border-radius: 2px; transition: width .5s ease; }

/* Overview 2-col grid */
.csh-overview-grid {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 12px;
    align-items: start;
}
.csh-overview-right { display: flex; flex-direction: column; gap: 12px; }

/* Generic card */
.csh-card {
    background: #fff;
    border: 1px solid #EBF0F5;
    border-radius: 10px;
    overflow: hidden;
}
.csh-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 12px;
    border-bottom: 1px solid #F1F5F9;
}
.csh-card-title {
    font-size: 13px;
    font-weight: 700;
    color: #223245;
    margin: 0;
}

/* Activity feed */
.csh-activity-feed {
    padding: 8px 0;
    max-height: 340px;
    overflow-y: auto;
}
.csh-activity-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid #F8FAFC;
    transition: background .1s;
}
.csh-activity-row:last-child { border-bottom: none; }
.csh-activity-row:hover { background: #F8FAFC; }

.csh-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #DBEAFE;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    color: #1D4ED8;
    flex-shrink: 0;
}
.csh-activity-body { flex: 1; min-width: 0; }
.csh-activity-text { font-size: 12px; color: #3B5572; line-height: 1.4; }
.csh-activity-text strong { color: #223245; }
.csh-activity-time { font-size: 11px; color: #94A3B8; margin-top: 2px; }

/* Attention points */
.csh-attention-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid #F8FAFC;
}
.csh-attention-row:last-child { border-bottom: none; }
.csh-attention-icon {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    flex-shrink: 0;
}
.csh-attention-icon--warning { background: #FEF3C7; color: #D97706; }
.csh-attention-icon--danger  { background: #FEE2E2; color: #DC2626; }
.csh-attention-icon--info    { background: #EFF6FF; color: #2563EB; }
.csh-attention-title { font-size: 12px; font-weight: 600; color: #223245; }
.csh-attention-sub   { font-size: 11px; color: #6E7F93; margin-top: 1px; }
.csh-all-clear {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    font-size: 12px;
    color: #10B981;
    font-weight: 600;
}

/* Quick actions */
.csh-quick-actions {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 4px 0;
}
.csh-action-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    background: none;
    border: none;
    border-bottom: 1px solid #F8FAFC;
    font-size: 12px;
    font-weight: 600;
    color: #4A6179;
    cursor: pointer;
    font-family: "Open Sans", sans-serif;
    text-decoration: none;
    transition: background .1s, color .1s;
}
.csh-action-btn:last-child { border-bottom: none; }
.csh-action-btn:hover { background: #F8FAFC; color: #0A58A5; }
.csh-action-btn i { width: 16px; text-align: center; font-size: 13px; color: #94A3B8; }
.csh-action-btn:hover i { color: #0A58A5; }
.csh-action-btn--primary { color: #0A58A5; }
.csh-action-btn--primary i { color: #0A58A5; }
.csh-action-btn--primary:hover { background: #EFF6FF; }

/* Empty */
.csh-empty {
    padding: 20px 16px;
    font-size: 12px;
    color: #94A3B8;
    text-align: center;
}

/* Responsive */
@media (max-width: 900px) {
    .csh-kpi-band { grid-template-columns: repeat(2, 1fr); }
    .csh-overview-grid { grid-template-columns: 1fr; }
    .csh-detail-card { padding: 14px; }
    .csh-tabs { padding: 0 12px; }
    .csh-tab-contents { padding: 14px; }
}
.coh-empty-state p { font-size: 14px; margin: 0; }
/* Dashboard Structures d'accompagnement */

/* Animations */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.structures-dashboard {
    max-width: 100%;
}

/* Dashboard Empty State */
.dashboard-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 60px 24px 48px;
    width: 100%;
    margin: 0 auto;
}

.dashboard-empty-illustration {
    position: relative;
    width: 140px;
    height: 140px;
    margin-bottom: 32px;
}

.dashboard-empty-icon-ring {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: linear-gradient(135deg, #E0F2FE 0%, #EDE9FE 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    animation: scaleIn 0.5s ease both;
}

.dashboard-empty-icon-circle {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0A58A5 0%, #6366F1 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-size: 36px;
    box-shadow: 0 8px 24px rgba(10, 88, 165, 0.25);
}

.dashboard-empty-orbits {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.dashboard-empty-orbit-dot {
    position: absolute;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #FFFFFF;
    border: 2px solid #DFE5EC;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #0A58A5;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    animation: fadeUp 0.4s ease both;
    animation-delay: var(--delay);
}

.dashboard-empty-orbit-dot:nth-child(1) { top: -8px; left: 50%; transform: translateX(-50%); }
.dashboard-empty-orbit-dot:nth-child(2) { bottom: 0; left: -10px; }
.dashboard-empty-orbit-dot:nth-child(3) { bottom: 0; right: -10px; }

.dashboard-empty-title {
    font-size: 24px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 12px 0;
    font-family: "Open Sans", sans-serif;
}

.dashboard-empty-description {
    font-size: 15px;
    color: #6E7F93;
    line-height: 1.6;
    margin: 0 0 36px 0;
    font-family: "Open Sans", sans-serif;
}

.dashboard-empty-steps {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 40px;
    width: 100%;
}

.dashboard-empty-step {
    flex: 1;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 20px;
    background: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    text-align: left;
    animation: fadeUp 0.4s ease both;
}

.dashboard-empty-step:nth-child(1) { animation-delay: 0.1s; }
.dashboard-empty-step:nth-child(3) { animation-delay: 0.2s; }
.dashboard-empty-step:nth-child(5) { animation-delay: 0.3s; }

.dashboard-empty-step-number {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #0A58A5;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
    font-family: "Open Sans", sans-serif;
}

.dashboard-empty-step-content h3 {
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 4px 0;
    font-family: "Open Sans", sans-serif;
}

.dashboard-empty-step-content p {
    font-size: 13px;
    color: #6E7F93;
    margin: 0;
    line-height: 1.4;
    font-family: "Open Sans", sans-serif;
}

.dashboard-empty-step-arrow {
    color: #CBD5E1;
    font-size: 14px;
    flex-shrink: 0;
}

.dashboard-empty-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.dashboard-empty-btn-primary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    background: #0A58A5;
    color: #FFFFFF;
    border: none;
    border-radius: 15px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: all 0.2s ease;
    box-shadow: 0 4px 12px rgba(10, 88, 165, 0.25);
}

.dashboard-empty-btn-primary:hover {
    background: #084a8f;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(10, 88, 165, 0.3);
}

.dashboard-empty-btn-secondary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    background: #FFFFFF;
    color: #0A58A5;
    border: 1px solid #DFE5EC;
    border-radius: 15px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: all 0.2s ease;
}

.dashboard-empty-btn-secondary:hover {
    background: #F6F9FC;
    border-color: #0A58A5;
    transform: translateY(-1px);
}

@media (max-width: 768px) {
    .dashboard-empty-steps {
        flex-direction: column;
    }

    .dashboard-empty-step-arrow {
        transform: rotate(90deg);
    }

    .dashboard-empty-actions {
        flex-direction: column;
        width: 100%;
    }

    .dashboard-empty-btn-primary,
    .dashboard-empty-btn-secondary {
        width: 100%;
        justify-content: center;
    }

    .dashboard-empty-title {
        font-size: 20px;
    }
}

/* Welcome Header */
.welcome-header {
    margin: 0 0 32px 0;
}

.welcome-title {
    font-size: 24px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 4px 0;
    font-family: "Open Sans", sans-serif;
}

.welcome-subtitle {
    font-size: 14px;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.welcome-period {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: 6px;
    padding: 2px 10px;
    background: #E0F2FE;
    color: #0A58A5;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
}

.welcome-period i {
    font-size: 10px;
}

/* Period Filter */
.dashboard-period-filter {
    display: flex;
    align-items: center;
    gap: 4px;
    background: #ECEEF1;
    border-radius: 10px;
    padding: 3px;
}

.period-filter-btn {
    padding: 5px 14px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #6E7F93;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.period-filter-btn:hover {
    color: #223245;
    background: rgba(255, 255, 255, 0.5);
}

.period-filter-btn.active {
    background: #FFFFFF;
    color: #0A58A5;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* KPIs Section */
.dashboard-kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 32px;
}

.kpi-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 20px;
    border: 1px solid #DFE5EC;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    animation: fadeUp 0.5s ease both;
}

.kpi-card:nth-child(1) { animation-delay: 0s; }
.kpi-card:nth-child(2) { animation-delay: 0.05s; }
.kpi-card:nth-child(3) { animation-delay: 0.1s; }
.kpi-card:nth-child(4) { animation-delay: 0.15s; }
.kpi-card:nth-child(5) { animation-delay: 0.2s; }

.kpi-card-credits {
    grid-column: span 2;
}

.kpi-credits-row {
    display: flex;
    gap: 24px;
    margin-bottom: 14px;
}

.kpi-credits-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.kpi-credits-value {
    font-size: 22px;
    font-weight: 700;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
}

.kpi-credits-remaining {
    color: #0A58A5;
}

.kpi-credits-label {
    font-size: 12px;
    color: #6E7F93;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
}

.kpi-credits-bar {
    width: 100%;
    height: 8px;
    background: #E5E7EB;
    border-radius: 4px;
    overflow: hidden;
}

.kpi-credits-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #0A58A5 0%, #6366F1 100%);
    border-radius: 4px;
    transition: width 0.6s ease;
}

.kpi-credits-bar-legend {
    display: flex;
    justify-content: flex-end;
    margin-top: 6px;
}

.kpi-credits-bar-legend span {
    font-size: 12px;
    color: #6E7F93;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
}

.kpi-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.08);
}

.kpi-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    position: relative;
}

.kpi-icon {
    color: inherit;
    font-size: 16px;
}

.kpi-icon-container {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.kpi-icon-container.blue {
    background: #E0F2FE;
    color: #0A58A5;
}

.kpi-icon-container.green {
    background: #D1FAE5;
    color: #059669;
}

.kpi-icon-container.orange {
    background: #FEF3C7;
    color: #D97706;
}

.kpi-icon-container.purple {
    background: #EDE9FE;
    color: #7C3AED;
}

.kpi-label {
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.kpi-percentage-badge {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #F59E0B;
    color: #ffffff;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
}

.kpi-value {
    font-size: 32px;
    font-weight: 700;
    color: #1F2937;
    margin-bottom: 8px;
}

.kpi-change {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 600;
}

.kpi-change.positive {
    color: #10B981;
}

.kpi-change.negative {
    color: #EF4444;
}

.kpi-change.neutral {
    color: #6E7F93;
}

.kpi-period {
    font-size: 11px;
    font-weight: 500;
    color: #9CA3AF;
    font-family: "Open Sans", sans-serif;
}

/* Dashboard Grid */
.dashboard-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 24px;
}

.dashboard-left,
.dashboard-right {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Dashboard Cards */
.dashboard-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 24px;
    border: 1px solid #DFE5EC;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    animation: scaleIn 0.4s ease both;
}

.dashboard-left .dashboard-card:nth-child(1) { animation-delay: 0.1s; }
.dashboard-left .dashboard-card:nth-child(2) { animation-delay: 0.2s; }
.dashboard-left .dashboard-card:nth-child(3) { animation-delay: 0.3s; }
.dashboard-right .dashboard-card:nth-child(1) { animation-delay: 0.15s; }
.dashboard-right .dashboard-card:nth-child(2) { animation-delay: 0.25s; }
.dashboard-right .dashboard-card:nth-child(3) { animation-delay: 0.35s; }

.card-header {
    display: flex;
    margin-bottom: 20px;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 16px;
    border-bottom: 1px solid #F0F2F5;
}

.card-title {
    font-size: 18px;
    font-weight: 700;
    color: #1F2937;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-subtitle {
    font-size: 14px;
    color: #6E7F93;
}

.warning-icon {
    color: #F59E0B;
}

.see-all-link {
    font-size: 14px;
    color: #0A58A5;
    text-decoration: none;
    font-weight: 600;
}

.see-all-link:hover {
    text-decoration: underline;
}

/* Charts */
.chart-container {
    height: 250px;
    margin-bottom: 12px;
}

.chart-footer {
    margin-top: 12px;
}

.chart-note {
    font-size: 12px;
    color: #9CA3AF;
}

/* Quick Actions */
.quick-actions-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.quick-action-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #ffffff;
    border: 1px solid #DFE5EC;
    border-radius: 15px;
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
    cursor: pointer;
    transition: all 0.2s;
    text-align: left;
    width: 100%;
    text-decoration: none;
}

.quick-action-btn:hover {
    background: #F6F9FC;
    border-color: #0A58A5;
    color: #0A58A5;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.quick-action-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #E0F2FE;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #0A58A5;
    font-size: 14px;
}

.quick-action-btn i {
    width: 20px;
    text-align: center;
    color: #0A58A5;
}

/* Watch List */
.watch-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 400px;
    overflow-y: auto;
    padding-right: 6px;
}

.watch-list::-webkit-scrollbar {
    width: 5px;
}

.watch-list::-webkit-scrollbar-track {
    background: transparent;
}

.watch-list::-webkit-scrollbar-thumb {
    background: #CBD5E1;
    border-radius: 10px;
}

.watch-list::-webkit-scrollbar-thumb:hover {
    background: #94A3B8;
}

.watch-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: #ffffff;
    border: 1px solid #DFE5EC;

    border-radius: 12px;
}

.watch-item-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #FEF3C7;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #D97706;
    font-size: 14px;
}

.watch-text {
    font-size: 14px;
    color: #374151;
    flex: 1;
}

.watch-action-btn {
    padding: 6px 16px;
    background: transparent;
    color: #0A58A5;
    border: 1px solid #0A58A5;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
    white-space: nowrap;
}

.watch-action-btn:hover {
    background: #0A58A5;
    color: #ffffff;
}

/* Activity List */
.activity-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 400px;
    overflow-y: auto;
    padding-right: 6px;
}

.activity-list::-webkit-scrollbar {
    width: 5px;
}

.activity-list::-webkit-scrollbar-track {
    background: transparent;
}

.activity-list::-webkit-scrollbar-thumb {
    background: #CBD5E1;
    border-radius: 10px;
}

.activity-list::-webkit-scrollbar-thumb:hover {
    background: #94A3B8;
}

.activity-list .activity-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid #DFE5EC;
    position: static;
    padding-left: 0;
}

.activity-list .activity-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.activity-list .activity-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #E0F2FE;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0A58A5;
    font-size: 16px;
    flex-shrink: 0;
    position: static;
    transform: none;
    border: none;
    margin-left: 0;
}

.activity-list .activity-content {
    margin-left: 0;
    padding-top: 0;
}

.activity-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.activity-text {
    font-size: 14px;
    color: #1F2937;
    font-weight: 500;
}

.activity-time {
    font-size: 12px;
    color: #9CA3AF;
}
/* Status Badges */
.status-badge.status-active {
    background: #D1FAE5;
    color: #065F46;
}

.status-badge.status-paused {
    background: #FEF3C7;
    color: #92400E;
}

.status-badge.status-inactive {
    background: #F3F4F6;
    color: #6B7280;
}

/* Table Card for Entrepreneurs */
.struct-table-card {
    background: #ffffff;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

/* Responsive */
@media (max-width: 768px) {
    .dashboard-kpis {
        grid-template-columns: repeat(2, 1fr);
    }

    .kpi-card-credits {
        grid-column: span 2;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .welcome-title {
        font-size: 20px;
    }

    .dashboard-period-filter {
        gap: 2px;
        padding: 2px;
    }

    .period-filter-btn {
        padding: 4px 10px;
        font-size: 12px;
    }
}

/* Entrepreneur Profile Page Styles */

/* Override content padding for this page */
.entrepreneur-profile-content {
    padding-top: 0 !important;
}

.profile-main-content {
    margin-top: 30px;
}

/* Entrepreneur Profile Avatar (in details card) */
.entrepreneur-profile-avatar {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0A58A5 0%, #084a8f 100%);
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    flex-shrink: 0;
    font-family: "Open Sans", sans-serif;
}

/* Vue d'ensemble tab */
.entrepreneur-profile-overview {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 4px;
}

.entrepreneur-profile-section-card {
    background: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    animation: fadeUp 0.4s ease-out both;
}

.entrepreneur-profile-section-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid #F0F2F5;
    margin-bottom: 20px;
}

.entrepreneur-profile-section-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(10, 88, 165, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #0A58A5;
    font-size: 15px;
}

.entrepreneur-profile-section-title {
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.entrepreneur-profile-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.entrepreneur-profile-info-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.entrepreneur-profile-info-label {
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans", sans-serif;
}

.entrepreneur-profile-info-value {
    font-size: 14px;
    font-weight: 500;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    line-height: 1.5;
    margin: 0;
}

.entrepreneur-profile-tags-row {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.entrepreneur-profile-tag-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.entrepreneur-profile-tag-group-label {
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans", sans-serif;
}

.entrepreneur-profile-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.entrepreneur-profile-experience-desc {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #F0F2F5;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.entrepreneur-profile-experience-desc p {
    white-space: pre-wrap;
}

.entrepreneur-profile-history {
    margin-top: 4px;
}

/* Responsive for entrepreneur profile */
@media (max-width: 768px) {
    .entrepreneur-profile-info-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

.back-button {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #223245;
    text-decoration: none;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    transition: opacity 0.2s;
}

.back-button:hover {
    opacity: 0.8;
}

.back-button svg {
    width: 20px;
    height: 20px;
}

.profile-form-value {
    margin: 0;
    padding: 8px 0;
    color: #1F2937;
    font-size: 15px;
}

.profile-tags-container {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.projets-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.projet-item {
    padding: 16px;
    border: 1px solid #E5E7EB;
    border-radius: 20px;
    background: #F9FAFB;
}

.projet-item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.projet-item-name {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #1F2937;
}

.projet-item-progress {
    font-size: 14px;
    font-weight: 600;
    color: #0A58A5;
}

.projet-item-details {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
    font-size: 14px;
    color: #6B7280;
}

.projet-item-progress-bar {
    width: 100%;
    height: 8px;
    background: #E5E7EB;
    border-radius: 4px;
    overflow: hidden;
}

.projet-item-progress-fill {
    height: 100%;
    background: #0A58A5;
    transition: width 0.3s;
}

.history-table-container {
    overflow-x: auto;
    margin-top: 16px;
}

.history-table {
    width: 100%;
    border-collapse: collapse;
}

.history-table thead {
    background: #F9FAFB;
    border-bottom: 2px solid #E5E7EB;
}

.history-table th {
    padding: 12px;
    text-align: left;
    font-weight: 600;
    font-size: 14px;
    color: #374151;
}

.history-table td {
    padding: 12px;
    border-bottom: 1px solid #E5E7EB;
    font-size: 14px;
    color: #1F2937;
}

.history-table tbody tr:hover {
    background: #F9FAFB;
}

.badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
}

.badge-credit {
    background: #D1FAE5;
    color: #065F46;
}

.badge-debit {
    background: #FEE2E2;
    color: #991B1B;
}

.text-success {
    color: #10B981;
}

.text-danger {
    color: #EF4444;
}

.empty-state {
    text-align: center;
    padding: 48px 24px;
    color: #6B7280;
}

.empty-state i {
    font-size: 48px;
    margin-bottom: 16px;
    color: #D1D5DB;
}

.empty-state p {
    margin: 0;
    font-size: 16px;
}

/* Sub Tabs Styles */
.sub-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
    border-bottom: 1px solid #DFE5EC;
    padding-bottom: 0;
}

.sub-tab {
    padding: 10px 20px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-bottom: -1px;
}

.sub-tab:hover {
    color: #0A58A5;
}

.sub-tab.active {
    color: #0A58A5;
    border-bottom-color: #0A58A5;
}

.sub-tab-content {
    display: none;
}

.sub-tab-content.active {
    display: block;
}

/* Block Access Form Styles */
.lock-status-block {
    padding: 20px;
    border-radius: 16px;
    border: 1px solid #DFE5EC;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.lock-status-block.locked {
    background: #FEF2F2;
    border-color: #FEE2E2;
}

.lock-status-block div h2{
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
}

.lock-status-block div p{
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    line-height: 1.4;
}

.lock-status-header {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.lock-status-header i {
    font-size: 24px;
    color: #EF4444;
    margin-top: 4px;
}

.lock-status-title {
    font-size: 18px;
    font-weight: 700;
    color: #1F2937;
    margin: 0 0 8px 0;
    font-family: "Open Sans", sans-serif;
}

.lock-status-subtitle {
    font-size: 14px;
    color: #6B7280;
    margin: 0;
    line-height: 1.6;
    font-family: "Open Sans", sans-serif;
}

.lock-status-text {
    font-size: 14px;
    color: #6B7280;
    margin: 0 0 16px 0;
    font-family: "Open Sans", sans-serif;
}

.block-access-button {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background-color: #EF4444;
    color: #FFFFFF;
    border: none;
    border-radius: 15px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
}


.block-access-button:hover {
    background-color: #DC2626;
}

.block-access-button i {
    font-size: 16px;
}

.block-form-container {
    margin-top: 24px;
    padding: 24px;
    background: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 20px;
}

.block-form {
    display: flex;
    flex-direction: column;
}

.block-form-actions {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 8px;
}

.block-form-submit-button {
    padding: 10px 24px;
    background-color: #EF4444;
    color: #FFFFFF;
    border: none;
    border-radius: 15px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
}

.block-form-submit-button:hover {
    background-color: #DC2626;
}

.block-form-cancel-button {
    padding: 10px 24px;
    background-color: #F3F4F6;
    color: #374151;
    border: 1px solid #D1D5DB;
    border-radius: 15px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
}

.block-form-cancel-button:hover {
    background-color: #E5E7EB;
}

.unlock-form {
    margin-top: 16px;
}

.unlock-button {
    padding: 10px 20px;
    background-color: #10B981;
    color: #FFFFFF;
    border: none;
    border-radius: 15px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
}

.unlock-button:hover {
    background-color: #059669;
}

/* Gestion de l'accès aux projets - Layout en deux colonnes */
.projet-access-management-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-top: 24px;
}

.projet-block-form-column,
.projet-locked-list-column {
    display: flex;
    flex-direction: column;
}

.no-available-projets-message {
    padding: 24px;
    text-align: center;
    color: #6B7280;
    font-size: 14px;
    margin: 0;
}

/* Liste des projets bloqués */
.locked-projets-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.locked-projet-item {
    padding: 20px;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    margin-top: 30px;
}

.locked-projet-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}

.locked-projet-icon {
    width: 40px;
    height: 40px;
    background-color: #DC2626;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    flex-shrink: 0;
}

.locked-projet-icon i {
    font-size: 18px;
}

.locked-projet-info {
    flex: 1;
}

.locked-projet-name {
    font-size: 16px;
    font-weight: 600;
    color: #223245;
    margin: 0 0 4px 0;
    font-family: "Open Sans", sans-serif;
}

.locked-projet-cohorte {
    font-size: 14px;
    color: #6B7280;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.locked-projet-details {
    margin-bottom: 16px;
}

.locked-projet-reason {
    font-size: 14px;
    color: #374151;
    margin: 0 0 8px 0;
    font-family: "Open Sans", sans-serif;
}

.locked-projet-reason strong {
    color: #DC2626;
    font-weight: 600;
}

.locked-projet-details-text {
    font-size: 14px;
    color: #6B7280;
    margin: 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

.locked-projet-details-text strong {
    color: #374151;
    font-weight: 600;
}

.unlock-projet-form {
    margin-top: 12px;
}

.unlock-projet-button {
    width: 100%;
    padding: 10px 20px;
    background-color: #10B981;
    color: #FFFFFF;
    border: none;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: "Open Sans", sans-serif;
}

.unlock-projet-button:hover {
    background-color: #059669;
}

.empty-locked-projets {
    text-align: center;
    padding: 48px 24px;
    color: #6B7280;
}

.empty-locked-projets i {
    font-size: 48px;
    margin-bottom: 16px;
    color: #10B981;
}

.empty-locked-projets p {
    margin: 0;
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
}

.form-help-text {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #6B7280;
    font-family: "Open Sans", sans-serif;
}

/* Historique des activités */
.activity-summary-item {
    padding: 16px;
    border-radius: 16px;
    border: 1px solid #E5E7EB;
}

.activity-summary-label {
    font-size: 12px;
    font-weight: 600;
    color: #6B7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    font-family: "Open Sans", sans-serif;
}

.activity-summary-value {
    font-size: 24px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.activities-timeline {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 24px;
    position: relative;
    padding-left: 0;
}

.activities-timeline::before {
    content: '';
    position: absolute;
    left: 19px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #E5E7EB;
}

.activity-item {
    display: flex;
    gap: 16px;
    padding: 20px 0;
    position: relative;
    padding-left: 0;
}

.activity-item:not(:last-child) {
    border-bottom: 1px solid #F3F4F6;
}

.activity-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 2px solid;
    position: absolute;
    left: 0;
    top: 20px;
    transform: translateX(-50%);
    z-index: 2;
    background: #FFFFFF;
    margin-left: 20px;
}

.activity-icon i {
    font-size: 18px;
}

.activity-content {
    flex: 1;
    padding-top: 2px;
    margin-left: 56px;
}

.activity-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
    gap: 16px;
}

.activity-title {
    font-size: 16px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.activity-date {
    font-size: 12px;
    color: #6B7280;
    white-space: nowrap;
    font-family: "Open Sans", sans-serif;
}

.activity-description {
    font-size: 14px;
    color: #6B7280;
    margin: 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

.profile-form-header h2{
    color: var(--Color2, #6E7F93);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px;
}

#projet-block-form{
    margin-top: 30px;
}

/* Activities History Page */
.activities-history-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.activities-history-count {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: #E0F2FE;
    color: #0A58A5;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
}

.activities-history-count i {
    font-size: 12px;
}

/* ═══════════════════════════════════════════════════
   NEW DASHBOARD — ndb-* namespace
═══════════════════════════════════════════════════ */

.ndb-wrap {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px 0 48px;
}

/* ── Header ── */
.ndb-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.ndb-header-left { display: flex; flex-direction: column; gap: 2px; }
.ndb-title {
    font-size: 22px;
    font-weight: 800;
    color: #0A1929;
    margin: 0;
    font-family: "Open Sans", sans-serif;
    letter-spacing: -.3px;
}
.ndb-subtitle {
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}
.ndb-header-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.ndb-period-tabs {
    display: flex;
    background: #F1F5F9;
    border-radius: 10px;
    padding: 4px;
    gap: 2px;
}
.ndb-period-tab {
    padding: 6px 14px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: all .15s;
    white-space: nowrap;
}
.ndb-period-tab:hover { color: #223245; }
.ndb-period-tab.is-active {
    background: #fff;
    color: #0A1929;
    box-shadow: 0 1px 4px rgba(0,0,0,.1);
}

.ndb-cta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 18px;
    background: #0A58A5;
    color: #fff;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: background .15s;
    white-space: nowrap;
}
.ndb-cta:hover { background: #084788; }

/* ── KPIs ── */
.ndb-kpis {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}
@media (max-width: 1100px) { .ndb-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px)  { .ndb-kpis { grid-template-columns: repeat(2, 1fr); } }

.ndb-kpi {
    background: #fff;
    border: 1px solid #E8EDF3;
    border-radius: 14px;
    padding: 20px 20px 18px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: box-shadow .2s;
}
.ndb-kpi:hover { box-shadow: 0 4px 20px rgba(0,0,0,.07); }

/* Le KPI principal a un fond légèrement bleuté pour attirer l'œil en premier */
.ndb-kpi--primary {
    background: #EFF6FF;
    border-color: #BFDBFE;
}
.ndb-kpi--credits {
    border-style: dashed;
}

.ndb-kpi-num {
    font-size: 32px;
    font-weight: 800;
    color: #0A1929;
    line-height: 1;
    font-family: "Open Sans", sans-serif;
    letter-spacing: -.5px;
}
.ndb-kpi--primary .ndb-kpi-num { color: #0A58A5; }
.ndb-kpi-unit { font-size: 18px; font-weight: 600; color: #6E7F93; }

.ndb-kpi-lbl {
    font-size: 11px;
    font-weight: 600;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: .5px;
    font-family: "Open Sans", sans-serif;
}

.ndb-kpi-delta {
    font-size: 12px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    margin-top: 4px;
}
.ndb-kpi-delta--up      { color: #059669; }
.ndb-kpi-delta--down    { color: #DC2626; }
.ndb-kpi-delta--neutral { color: #6E7F93; }

.ndb-kpi-warn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 600;
    color: #D97706;
    margin-top: 4px;
    font-family: "Open Sans", sans-serif;
}

/* ── Focus banner ── */
.ndb-focus {
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-left: 4px solid #F59E0B;
    border-radius: 12px;
    padding: 16px 20px;
    display: flex;
    gap: 20px;
    align-items: flex-start;
}
.ndb-focus-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 800;
    color: #92400E;
    text-transform: uppercase;
    letter-spacing: .5px;
    white-space: nowrap;
    padding-top: 2px;
    font-family: "Open Sans", sans-serif;
}
.ndb-focus-items { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ndb-focus-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.ndb-focus-text {
    font-size: 13px;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}
.ndb-focus-link {
    font-size: 12px;
    font-weight: 600;
    color: #0A58A5;
    text-decoration: none;
    white-space: nowrap;
}
.ndb-focus-link:hover { text-decoration: underline; }

/* ── Card base ── */
.ndb-card {
    background: #fff;
    border: 1px solid #E8EDF3;
    border-radius: 14px;
    overflow: hidden;
}
.ndb-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 20px 14px;
    border-bottom: 1px solid #F1F5F9;
}
.ndb-card-head--tabs {
    border-bottom: none;
    padding-bottom: 0;
    gap: 0;
}
.ndb-card-title {
    font-size: 13px;
    font-weight: 700;
    color: #0A1929;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}
.ndb-card-hint {
    font-size: 11px;
    color: #6E7F93;
    margin: 3px 0 0;
    font-family: "Open Sans", sans-serif;
}
.ndb-card-link {
    font-size: 12px;
    font-weight: 600;
    color: #0A58A5;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}
.ndb-card-link:hover { text-decoration: underline; }

.ndb-chart-wrap {
    position: relative;
    margin: 4px 20px 20px;
}
.ndb-chart-wrap canvas {
    display: block;
}

/* ── Main grid ── */
.ndb-main-grid {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 16px;
    align-items: start;
}
@media (max-width: 1050px) { .ndb-main-grid { grid-template-columns: 1fr; } }

/* ── Tabs ── */
.ndb-tab {
    padding: 14px 20px;
    font-size: 13px;
    font-weight: 600;
    color: #6E7F93;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    font-family: "Open Sans", sans-serif;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color .15s;
}
.ndb-tab:hover { color: #0A1929; }
.ndb-tab.is-active {
    color: #0A58A5;
    border-bottom-color: #0A58A5;
}
.ndb-tab-badge {
    background: #FEE2E2;
    color: #DC2626;
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 20px;
}

/* ── Rows (performers / risk) ── */
.ndb-panel { padding: 12px 20px 18px; display: flex; flex-direction: column; gap: 10px; }

.ndb-row {
    display: flex;
    align-items: center;
    gap: 10px;
}
.ndb-row-rank {
    width: 22px;
    height: 22px;
    background: #F1F5F9;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    color: #6E7F93;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-family: "Open Sans", sans-serif;
}
.ndb-row:first-child .ndb-row-rank { background: #FEF9C3; color: #854D0E; }
.ndb-row:nth-child(2) .ndb-row-rank { background: #F1F5F9; color: #475569; }

.ndb-row-warn {
    width: 22px; height: 22px;
    background: #FEE2E2; border-radius: 6px;
    font-size: 10px; color: #DC2626;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.ndb-row-info { flex: 1; min-width: 0; }
.ndb-row-name {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #0A1929;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: "Open Sans", sans-serif;
}
.ndb-row-sub {
    display: block;
    font-size: 11px;
    color: #6E7F93;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ndb-row-bar {
    width: 80px;
    height: 5px;
    background: #F1F5F9;
    border-radius: 3px;
    overflow: hidden;
    flex-shrink: 0;
}
.ndb-row-fill {
    height: 100%;
    background: #0A58A5;
    border-radius: 3px;
    transition: width .4s;
}
.ndb-row-fill--risk { background: #EF4444; }

.ndb-row-pct {
    font-size: 12px;
    font-weight: 700;
    color: #0A1929;
    width: 32px;
    text-align: right;
    flex-shrink: 0;
    font-family: "Open Sans", sans-serif;
}
.ndb-row-pct--risk { color: #EF4444; }

.ndb-all-clear {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 0;
    color: #059669;
    font-size: 13px;
    font-family: "Open Sans", sans-serif;
}
.ndb-all-clear i { font-size: 18px; }

.ndb-empty {
    font-size: 13px;
    color: #94A3B8;
    text-align: center;
    padding: 20px;
    font-family: "Open Sans", sans-serif;
}

/* ── Secondary grid ── */
.ndb-secondary-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
    align-items: start;
}
@media (max-width: 900px) { .ndb-secondary-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .ndb-secondary-grid { grid-template-columns: 1fr; } }

/* ── Cohort list ── */
.ndb-cohort-list { padding: 8px 20px; display: flex; flex-direction: column; }
.ndb-cohort-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #F8FAFC;
}
.ndb-cohort-row:last-child { border-bottom: none; }
.ndb-cohort-info { flex: 1; min-width: 0; }
.ndb-cohort-name {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #0A1929;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: "Open Sans", sans-serif;
}
.ndb-cohort-count { font-size: 11px; color: #6E7F93; }

.ndb-days {
    font-size: 11px;
    font-weight: 800;
    padding: 3px 10px;
    border-radius: 20px;
    white-space: nowrap;
    font-family: "Open Sans", sans-serif;
    flex-shrink: 0;
}
.ndb-days--red   { background: #FEE2E2; color: #991B1B; }
.ndb-days--amber { background: #FEF3C7; color: #92400E; }
.ndb-days--green { background: #ECFDF5; color: #065F46; }

.ndb-cohort-actions {
    display: flex;
    gap: 8px;
    padding: 14px 20px 18px;
    border-top: 1px solid #F1F5F9;
}
.ndb-ghost-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 8px;
    border: 1px solid #E2E8F0;
    font-size: 12px;
    font-weight: 600;
    color: #0A58A5;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: all .15s;
}
.ndb-ghost-btn:hover { background: #EFF6FF; border-color: #BFDBFE; }

/* ── Activity feed ── */
.ndb-card--feed .ndb-card-head { border-bottom: 1px solid #F1F5F9; }
.ndb-feed {
    padding: 8px 20px 20px;
    display: flex;
    flex-direction: column;
}
.ndb-feed-row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid #F8FAFC;
}
.ndb-feed-row:last-child { border-bottom: none; }

.ndb-feed-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 4px;
}
.ndb-feed-dot--user    { background: #0A58A5; }
.ndb-feed-dot--link    { background: #059669; }
.ndb-feed-dot--comment { background: #059669; }
.ndb-feed-dot--target  { background: #7C3AED; }
.ndb-feed-dot--clock   { background: #EA580C; }
.ndb-feed-dot--default { background: #94A3B8; }

.ndb-feed-text {
    flex: 1;
    font-size: 13px;
    color: #223245;
    line-height: 1.45;
    font-family: "Open Sans", sans-serif;
}
.ndb-feed-time {
    font-size: 11px;
    color: #94A3B8;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════
   REDESIGNED DASHBOARD — sd-* namespace
═══════════════════════════════════════════════════ */

/* Page header */
.sd-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 0 16px;
    flex-wrap: wrap;
}
.sd-page-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
}
.sd-page-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    font-weight: 700;
    color: #0A1929;
    font-family: "Open Sans", sans-serif;
}
.sd-page-title i { color: #0A58A5; }

.sd-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 600;
    color: #10B981;
    background: #D1FAE5;
    border-radius: 20px;
    padding: 3px 10px;
    font-family: "Open Sans", sans-serif;
}
.sd-live-badge i { font-size: 8px; animation: pulse-dot 1.5s infinite; }
@keyframes pulse-dot { 0%,100%{opacity:1} 50%{opacity:.3} }

.sd-period-filter {
    display: flex;
    gap: 4px;
    background: #F1F5F9;
    border-radius: 10px;
    padding: 4px;
}
.sd-period-btn {
    padding: 6px 14px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: all .15s;
}
.sd-period-btn:hover { color: #223245; background: #fff; }
.sd-period-btn.active { background: #fff; color: #0A58A5; box-shadow: 0 1px 4px rgba(0,0,0,.1); }

/* Layout wrapper */
.sd-layout {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-bottom: 40px;
}

/* ── KPI Band ── */
.sd-kpi-band {
    display: grid;
    grid-template-columns: 1fr 1.5fr 1.5fr 1fr 1.5fr;
    gap: 14px;
}
@media (max-width: 1200px) {
    .sd-kpi-band { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 768px) {
    .sd-kpi-band { grid-template-columns: 1fr 1fr; }
}

.sd-kpi {
    background: #fff;
    border-radius: 14px;
    padding: 18px;
    border: 1px solid #E8EDF3;
    display: flex;
    gap: 14px;
    align-items: flex-start;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
    transition: box-shadow .2s;
}
.sd-kpi:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); }

.sd-kpi-icon {
    width: 42px; height: 42px;
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 17px;
    flex-shrink: 0;
}
.sd-kpi-icon--blue    { background: #EFF6FF; color: #0A58A5; }
.sd-kpi-icon--purple  { background: #F5F3FF; color: #7C3AED; }
.sd-kpi-icon--green   { background: #ECFDF5; color: #059669; }
.sd-kpi-icon--orange  { background: #FFF7ED; color: #EA580C; }
.sd-kpi-icon--teal    { background: #F0FDFA; color: #0D9488; }

.sd-kpi-body {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    flex: 1;
}
.sd-kpi-value {
    font-size: 26px;
    font-weight: 700;
    color: #0A1929;
    line-height: 1;
    font-family: "Open Sans", sans-serif;
}
.sd-kpi-unit { font-size: 16px; font-weight: 600; color: #6E7F93; margin-left: 1px; }
.sd-kpi-label { font-size: 11px; font-weight: 600; color: #6E7F93; text-transform: uppercase; letter-spacing: .4px; font-family: "Open Sans", sans-serif; }

.sd-kpi-trend {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; font-weight: 600;
    padding: 2px 8px; border-radius: 20px; width: fit-content; margin-top: 4px;
}
.sd-kpi-trend--up      { color: #059669; background: #D1FAE5; }
.sd-kpi-trend--down    { color: #DC2626; background: #FEE2E2; }
.sd-kpi-trend--neutral { color: #6E7F93; background: #F1F5F9; }

.sd-kpi-alert {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; font-weight: 600; color: #D97706;
    background: #FEF3C7; border-radius: 20px;
    padding: 2px 8px; width: fit-content; margin-top: 4px;
}

/* Engagement bar */
.sd-engage-bar {
    display: flex; height: 6px; border-radius: 3px;
    overflow: hidden; background: #F1F5F9; margin-top: 6px;
}
.sd-engage-seg { height: 100%; transition: width .4s; }
.sd-engage-seg--active   { background: #10B981; }
.sd-engage-seg--risk     { background: #F59E0B; }
.sd-engage-seg--inactive { background: #EF4444; }

.sd-engage-legend {
    display: flex; gap: 8px; font-size: 10px; color: #6E7F93;
    font-family: "Open Sans", sans-serif; margin-top: 4px; flex-wrap: wrap;
}
.dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; }
.dot--green  { background: #10B981; }
.dot--amber  { background: #F59E0B; }
.dot--red    { background: #EF4444; }

/* Health chips */
.sd-health-chips { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 6px; }
.sd-chip {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 10px; font-weight: 600; padding: 3px 7px;
    border-radius: 6px; font-family: "Open Sans", sans-serif;
}
.sd-chip--green  { background: #D1FAE5; color: #065F46; }
.sd-chip--amber  { background: #FEF3C7; color: #92400E; }
.sd-chip--red    { background: #FEE2E2; color: #991B1B; }

/* Gauge bar */
.sd-gauge-bar {
    height: 6px; border-radius: 3px; background: #F1F5F9; overflow: hidden; margin-top: 6px;
}
.sd-gauge-fill { height: 100%; background: linear-gradient(90deg, #F59E0B, #EA580C); border-radius: 3px; transition: width .4s; }

/* Credits row */
.sd-credits-row { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.sd-credits-divider { width: 1px; height: 24px; background: #E8EDF3; }
.sd-credits-stat { display: flex; flex-direction: column; gap: 1px; }
.sd-credits-num  { font-size: 13px; font-weight: 700; color: #0A1929; }
.sd-credits-sub  { font-size: 10px; color: #6E7F93; }

/* ── Alerts row ── */
.sd-alerts-row {
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-radius: 14px;
    padding: 16px 20px;
}
.sd-alerts-title {
    font-size: 12px; font-weight: 700; color: #92400E;
    text-transform: uppercase; letter-spacing: .5px;
    margin-bottom: 12px;
    display: flex; align-items: center; gap: 6px;
    font-family: "Open Sans", sans-serif;
}
.sd-alerts-list { display: flex; flex-direction: column; gap: 8px; }
.sd-alert-card {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    background: #fff; border-radius: 8px; padding: 10px 14px;
    border: 1px solid #FDE68A;
}
.sd-alert-text { font-size: 13px; color: #223245; font-family: "Open Sans", sans-serif; flex: 1; }
.sd-alert-btn {
    font-size: 12px; font-weight: 600; color: #0A58A5;
    text-decoration: none; white-space: nowrap;
    padding: 4px 12px; border-radius: 6px; background: #EFF6FF;
    transition: background .15s;
}
.sd-alert-btn:hover { background: #DBEAFE; }

/* ── Card base ── */
.sd-card {
    background: #fff;
    border-radius: 14px;
    border: 1px solid #E8EDF3;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
    overflow: hidden;
}
.sd-card-header {
    display: flex; align-items: flex-start; justify-content: space-between;
    padding: 18px 20px 14px; gap: 12px;
}
.sd-card-title-group { display: flex; align-items: center; gap: 8px; }
.sd-card-title { font-size: 14px; font-weight: 700; color: #0A1929; margin: 0; font-family: "Open Sans", sans-serif; }
.sd-card-sub   { font-size: 12px; color: #6E7F93; margin: 2px 0 0; font-family: "Open Sans", sans-serif; }
.sd-card-link  { font-size: 12px; font-weight: 600; color: #0A58A5; text-decoration: none; white-space: nowrap; }
.sd-card-link:hover { text-decoration: underline; }

.sd-card-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.sd-card-dot--green { background: #10B981; }
.sd-card-dot--red   { background: #EF4444; }
.sd-card-dot--blue  { background: #0A58A5; }

.sd-card-badge {
    font-size: 10px; font-weight: 700; padding: 3px 9px;
    border-radius: 20px; white-space: nowrap; text-transform: uppercase; letter-spacing: .4px;
    font-family: "Open Sans", sans-serif;
}
.sd-card-badge--green { background: #D1FAE5; color: #065F46; }
.sd-card-badge--red   { background: #FEE2E2; color: #991B1B; }

/* ── Mid grid ── */
.sd-mid-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}
@media (max-width: 1100px) { .sd-mid-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px)  { .sd-mid-grid { grid-template-columns: 1fr; } }

/* Performers list */
.sd-performers-list { padding: 0 20px 20px; display: flex; flex-direction: column; gap: 12px; }
.sd-performer-row {
    display: flex; align-items: center; gap: 10px;
}
.sd-performer-rank {
    width: 22px; height: 22px; border-radius: 6px;
    font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; font-family: "Open Sans", sans-serif;
}
.sd-performer-rank--gold   { background: #FEF3C7; color: #92400E; }
.sd-performer-rank--silver { background: #F1F5F9; color: #475569; }
.sd-performer-rank--bronze { background: #FEF3C7; color: #B45309; opacity: .8; }
.sd-performer-rank--plain  { background: #F8FAFC; color: #94A3B8; }

.sd-performer-info { flex: 1; min-width: 0; }
.sd-performer-name { display: block; font-size: 13px; font-weight: 600; color: #0A1929; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Open Sans", sans-serif; }
.sd-performer-sub  { display: block; font-size: 11px; color: #6E7F93; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.sd-performer-bar-wrap { display: flex; align-items: center; gap: 6px; width: 90px; flex-shrink: 0; }
.sd-performer-bar { flex: 1; height: 5px; background: #F1F5F9; border-radius: 3px; overflow: hidden; }
.sd-performer-fill { height: 100%; background: linear-gradient(90deg, #0A58A5, #38BDF8); border-radius: 3px; transition: width .4s; }
.sd-performer-fill--risk { background: linear-gradient(90deg, #EF4444, #FCA5A5); }
.sd-performer-pct { font-size: 11px; font-weight: 700; color: #0A58A5; width: 30px; text-align: right; font-family: "Open Sans", sans-serif; }
.sd-performer-pct--risk { color: #EF4444; }

.sd-risk-icon { width: 22px; height: 22px; background: #FEE2E2; border-radius: 6px; display: flex; align-items: center; justify-content: center; color: #EF4444; font-size: 10px; flex-shrink: 0; }

.sd-all-good {
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    padding: 24px; color: #10B981; text-align: center;
    font-family: "Open Sans", sans-serif; font-size: 13px;
}
.sd-all-good i { font-size: 24px; }
.sd-empty-hint { font-size: 13px; color: #94A3B8; text-align: center; padding: 20px; font-family: "Open Sans", sans-serif; }

/* Timeline */
.sd-card--timeline .sd-card-header { padding-bottom: 12px; }
.sd-timeline-list { padding: 0 20px; display: flex; flex-direction: column; gap: 10px; }
.sd-timeline-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid #F1F5F9; }
.sd-timeline-row:last-child { border-bottom: none; }
.sd-timeline-info { flex: 1; min-width: 0; }
.sd-timeline-name { display: block; font-size: 13px; font-weight: 600; color: #0A1929; font-family: "Open Sans", sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sd-timeline-sub  { font-size: 11px; color: #6E7F93; }
.sd-timeline-days {
    font-size: 11px; font-weight: 800; padding: 4px 10px; border-radius: 20px;
    font-family: "Open Sans", sans-serif; white-space: nowrap;
}
.sd-timeline-days--urgent { background: #FEE2E2; color: #991B1B; }
.sd-timeline-days--soon   { background: #FEF3C7; color: #92400E; }
.sd-timeline-days--ok     { background: #ECFDF5; color: #065F46; }

.sd-timeline-actions {
    display: flex; gap: 8px; padding: 16px 20px 18px; flex-wrap: wrap;
}
.sd-quick-btn {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; font-weight: 600; color: #0A58A5;
    background: #EFF6FF; border-radius: 8px; padding: 7px 12px;
    text-decoration: none; transition: background .15s;
    font-family: "Open Sans", sans-serif;
}
.sd-quick-btn:hover { background: #DBEAFE; }

/* ── Bottom grid ── */
.sd-bottom-grid {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 16px;
    align-items: start;
}
@media (max-width: 1000px) { .sd-bottom-grid { grid-template-columns: 1fr; } }

.sd-charts-col { display: flex; flex-direction: column; gap: 16px; }
.sd-chart-wrap { padding: 0 20px 20px; }

.sd-realtime-dot { font-size: 10px; color: #10B981; font-weight: 600; display: flex; align-items: center; gap: 4px; }
.sd-realtime-dot i { font-size: 7px; animation: pulse-dot 1.5s infinite; }

/* Activity feed */
.sd-card--activity { height: fit-content; position: sticky; top: 20px; }
.sd-feed { padding: 0 20px 20px; display: flex; flex-direction: column; gap: 14px; max-height: 580px; overflow-y: auto; }
.sd-feed::-webkit-scrollbar { width: 4px; }
.sd-feed::-webkit-scrollbar-thumb { background: #E2E8F0; border-radius: 2px; }

.sd-feed-item { display: flex; gap: 10px; align-items: flex-start; }
.sd-feed-icon {
    width: 32px; height: 32px; border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; flex-shrink: 0;
}
.sd-feed-icon--user    { background: #EFF6FF; color: #0A58A5; }
.sd-feed-icon--link    { background: #ECFDF5; color: #059669; }
.sd-feed-icon--comment { background: #ECFDF5; color: #059669; }
.sd-feed-icon--target  { background: #EFF6FF; color: #0A58A5; }
.sd-feed-icon--clock   { background: #FFF7ED; color: #EA580C; }
.sd-feed-icon--default { background: #F1F5F9; color: #6E7F93; }

.sd-feed-body { display: flex; flex-direction: column; gap: 2px; }
.sd-feed-text { font-size: 13px; color: #223245; line-height: 1.4; font-family: "Open Sans", sans-serif; }
.sd-feed-time { font-size: 11px; color: #94A3B8; }

.sd-feed-empty {
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    padding: 32px; color: #94A3B8; text-align: center;
    font-family: "Open Sans", sans-serif; font-size: 13px;
}
.sd-feed-empty i { font-size: 28px; }


/* ════════════════════════════════════════
   ENT — Entrepreneurs list page
════════════════════════════════════════ */

/* Header stats */
.ent-header-stats {
    display: flex;
    align-items: center;
    gap: 0;
    margin-left: auto;
    font-family: "Open Sans", sans-serif;
}
.ent-hstat {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: #4A6179;
    padding: 0 12px;
}
.ent-hstat strong { font-weight: 700; color: #223245; }
.ent-hstat--active  i { color: #10B981; }
.ent-hstat--paused  i { color: #F59E0B; }
.ent-hstat--inactive i { color: #94A3B8; }
.ent-hstat-sep { width: 1px; height: 14px; background: #DFE5EC; flex-shrink: 0; }

/* Toolbar */
.ent-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 20px;
    flex-wrap: wrap;
}
.ent-search {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    padding: 0 12px;
    height: 36px;
    flex: 1;
    min-width: 200px;
    max-width: 320px;
    transition: border-color .15s;
}
.ent-search:focus-within { border-color: #0A58A5; }
.ent-search-icon { color: #94A3B8; font-size: 12px; }
.ent-search-input {
    border: none;
    outline: none;
    font-size: 13px;
    color: #223245;
    background: none;
    width: 100%;
    font-family: "Open Sans", sans-serif;
}
.ent-search-input::placeholder { color: #94A3B8; }

.ent-filters { display: flex; align-items: center; gap: 6px; }
.ent-filter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid #DFE5EC;
    border-radius: 20px;
    background: #fff;
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    cursor: pointer;
    font-family: "Open Sans", sans-serif;
    transition: all .15s;
}
.ent-filter:hover { border-color: #0A58A5; color: #0A58A5; }
.ent-filter.active { background: #0A58A5; border-color: #0A58A5; color: #fff; }
.ent-filter.active .ent-filter-count { background: rgba(255,255,255,.25); color: #fff; }
.ent-filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 16px;
    padding: 0 5px;
    background: #EBF0F5;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 700;
    color: #4A6179;
}

/* Card grid */
.ent-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;          
}
.cohorte-row-hidden { display: none !important; }

/* Card */
.ent-card {
    background: #fff;
    border: 1px solid #EBF0F5;
    border-radius: 12px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-family: "Open Sans", sans-serif;
    transition: box-shadow .15s, transform .15s;
}
.ent-card:hover { box-shadow: 0 4px 16px rgba(10,88,165,.08); transform: translateY(-2px); }

/* Top row */
.ent-card-top {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.ent-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #DBEAFE;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
    color: #1D4ED8;
    flex-shrink: 0;
}
.ent-identity { flex: 1; min-width: 0; }
.ent-name { font-size: 13px; font-weight: 700; color: #223245; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ent-email { font-size: 11px; color: #94A3B8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }

/* Status badge */
.ent-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .03em;
    flex-shrink: 0;
    margin-top: 2px;
}
.ent-badge--active   { background: #D1FAE5; color: #065F46; }
.ent-badge--paused   { background: #FEF3C7; color: #92400E; }
.ent-badge--inactive { background: #F1F5F9; color: #64748B; }

/* Cohortes */
.ent-cohortes { display: flex; flex-wrap: wrap; gap: 5px; }
.ent-cohorte-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    background: #EFF6FF;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    color: #1D4ED8;
    text-decoration: none;
    transition: background .1s;
}
.ent-cohorte-chip:hover { background: #DBEAFE; }
.ent-cohorte-chip i { font-size: 9px; }
.ent-cohorte-chip--more { background: #F1F5F9; color: #64748B; }
.ent-no-cohorte { font-size: 11px; color: #CBD5E1; font-style: italic; }

/* Projet */
.ent-projet { display: flex; flex-direction: column; gap: 3px; }
.ent-projet-name {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #223245;
}
.ent-projet-name i { color: #0A58A5; font-size: 11px; }
.ent-module-name {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: #6E7F93;
}
.ent-module-name i { color: #94A3B8; font-size: 10px; }
.ent-no-projet { font-size: 11px; color: #CBD5E1; font-style: italic; }

/* Progress */
.ent-progress-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}
.ent-progress-bar {
    flex: 1;
    height: 5px;
    background: #EBF0F5;
    border-radius: 3px;
    overflow: hidden;
}
.ent-progress-fill { height: 100%; background: #0A58A5; border-radius: 3px; transition: width .4s ease; }
.ent-progress-pct { font-size: 11px; font-weight: 700; color: #4A6179; width: 30px; text-align: right; flex-shrink: 0; }

.ent-last-seen {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: #94A3B8;
    margin-top: -4px;
}
.ent-last-seen i { font-size: 10px; }

/* Footer CTA */
.ent-card-footer { margin-top: auto; }
.ent-btn-primary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 9px 14px;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    color: #4A6179;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    transition: background .15s, color .15s, border-color .15s;
}
.ent-btn-primary:hover { background: #EFF6FF; border-color: #93C5FD; color: #0A58A5; }
.ent-btn-primary i { font-size: 11px; }

/* Empty state */
.ent-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 60px 20px;
    color: #94A3B8;
    text-align: center;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
}
.ent-empty-state i { font-size: 36px; }

/* Responsive */
@media (max-width: 1100px) { .ent-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px)  { .ent-grid { grid-template-columns: 1fr; } }

/* ════════════════════════════════════════
   EP — Entrepreneur Profile (show)
════════════════════════════════════════ */

/* Hero avatar */
.ep-hero-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 800;
    flex-shrink: 0;
}
.ep-hero-avatar--active { background: #DBEAFE; color: #1D4ED8; }
.ep-hero-avatar--locked { background: #FEE2E2; color: #DC2626; }

/* Unlock btn in header */
.ep-btn-unlock {
    background: #FEF2F2 !important;
    border-color: #FECACA !important;
    color: #DC2626 !important;
}
.ep-btn-unlock:hover { background: #FEE2E2 !important; }

/* KPI band */
.ep-kpi-band {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    padding: 20px 0;
}
.ep-kpi {
    background: #fff;
    border: 1px solid #EBF0F5;
    border-radius: 10px;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: "Open Sans", sans-serif;
}
.ep-kpi-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
}
.ep-kpi-icon--blue   { background: #DBEAFE; color: #1D4ED8; }
.ep-kpi-icon--green  { background: #D1FAE5; color: #065F46; }
.ep-kpi-icon--amber  { background: #FEF3C7; color: #92400E; }
.ep-kpi-icon--purple { background: #EDE9FE; color: #5B21B6; }
.ep-kpi-num { font-size: 22px; font-weight: 800; color: #223245; line-height: 1; }
.ep-kpi-lbl { font-size: 11px; font-weight: 600; color: #6E7F93; margin-top: 2px; }

/* Overview grid */
.ep-overview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

/* Section cards */
.ep-section-card {
    background: #fff;
    border: 1px solid #EBF0F5;
    border-radius: 10px;
    overflow: hidden;
    font-family: "Open Sans", sans-serif;
}
.ep-section-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 13px 16px 12px;
    border-bottom: 1px solid #F1F5F9;
}
.ep-section-icon { font-size: 13px; color: #0A58A5; width: 16px; text-align: center; }
.ep-section-title { font-size: 13px; font-weight: 700; color: #223245; margin: 0; }

/* Info grid */
.ep-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    padding: 0;
}
.ep-info-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 11px 16px;
    border-bottom: 1px solid #F8FAFC;
    border-right: 1px solid #F8FAFC;
}
.ep-info-item:nth-child(even) { border-right: none; }
.ep-info-lbl { font-size: 10px; font-weight: 700; color: #94A3B8; text-transform: uppercase; letter-spacing: .05em; }
.ep-info-val { font-size: 12px; color: #223245; font-weight: 500; }

/* Tags */
.ep-tag {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    background: #EFF6FF;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    color: #1D4ED8;
}

/* Projects list */
.ep-projet-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    border-bottom: 1px solid #F8FAFC;
}
.ep-projet-row:last-child { border-bottom: none; }
.ep-projet-info { flex: 1; min-width: 0; }
.ep-projet-name {
    font-size: 12px;
    font-weight: 600;
    color: #223245;
    display: flex;
    align-items: center;
    gap: 6px;
}
.ep-projet-cohorte {
    font-size: 11px;
    color: #6E7F93;
    margin-top: 2px;
    display: flex;
    align-items: center;
    gap: 4px;
}
.ep-projet-cohorte i { font-size: 9px; color: #94A3B8; }
.ep-locked-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 6px;
    background: #FEE2E2;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    color: #DC2626;
}
.ep-projet-progress { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }

/* Timeline */
.ep-timeline { padding: 8px 16px 16px; }
.ep-timeline-item {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #F8FAFC;
}
.ep-timeline-item:last-child { border-bottom: none; }
.ep-timeline-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    flex-shrink: 0;
    margin-top: 2px;
}
.ep-timeline-body { flex: 1; min-width: 0; }
.ep-timeline-title { font-size: 12px; font-weight: 700; color: #223245; }
.ep-timeline-desc  { font-size: 11px; color: #4A6179; margin-top: 2px; line-height: 1.4; }
.ep-timeline-date  { font-size: 10px; color: #94A3B8; margin-top: 3px; }

/* Empty */
.ep-empty { font-size: 12px; color: #94A3B8; padding: 12px 16px; }

/* profile-tabs active state override for csh-tab */
.csh-tab.profile-tab-btn.active { color: #0A58A5; border-bottom-color: #0A58A5; }

/* Responsive */
@media (max-width: 900px) {
    .ep-kpi-band { grid-template-columns: repeat(2, 1fr); }
    .ep-overview-grid { grid-template-columns: 1fr; }
    .ep-info-grid { grid-template-columns: 1fr; }
    .ep-info-item { border-right: none; }
}
/* ===================================================
   Page Crédits — Structures (redesign)
   sc-* = nouvelles classes, ne pas supprimer les anciennes
   =================================================== */

/* --- Hero stats row --- */
.sc-hero-row {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 16px;
    margin-bottom: 4px;
}

/* Carte solde principal */
.sc-balance-card {
    position: relative;
    background: linear-gradient(135deg, #0A58A5 0%, #063d75 100%);
    border-radius: 16px;
    padding: 28px 32px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 150px;
}

.sc-balance-card-decoration {
    position: absolute;
    right: -40px;
    top: -40px;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    pointer-events: none;
}

.sc-balance-card-decoration::before {
    content: "";
    position: absolute;
    right: 30px;
    bottom: -60px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.04);
}

.sc-balance-card-inner {
    position: relative;
    z-index: 1;
}

.sc-balance-label {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.75);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 6px;
    font-family: "Open Sans", sans-serif;
}

.sc-balance-value {
    font-size: 52px;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1;
    margin-bottom: 2px;
    font-family: "Open Sans", sans-serif;
}

.sc-balance-unit {
    font-size: 16px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 24px;
    font-family: "Open Sans", sans-serif;
}

.sc-balance-buy-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background-color: rgba(255, 255, 255, 0.15);
    border: 1.5px solid rgba(255, 255, 255, 0.3);
    border-radius: 10px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    backdrop-filter: blur(4px);
}

.sc-balance-buy-btn:hover {
    background-color: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.5);
    transform: translateY(-1px);
}

/* Cartes secondaires (droite) */
.sc-side-stats {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sc-stat-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    flex: 1;
    transition: box-shadow 0.2s ease;
}

.sc-stat-card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.sc-stat-icon-wrap {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}

.sc-stat-blue {
    background-color: #EFF6FF;
    color: #0A58A5;
}

.sc-stat-orange {
    background-color: #FFF7ED;
    color: #EA580C;
}

.sc-stat-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sc-stat-value {
    font-size: 22px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    line-height: 1;
}

.sc-stat-label {
    font-size: 12px;
    font-weight: 500;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    line-height: 1.3;
}

/* --- Info card (portefeuille tab) --- */
.sc-info-card {
    display: flex;
    gap: 16px;
    padding: 20px 24px;
    background-color: #F0F7FF;
    border: 1px solid #BFDBFE;
    border-radius: 12px;
    margin-bottom: 24px;
}

.sc-info-card-icon {
    width: 40px;
    height: 40px;
    background-color: #EFF6FF;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #0A58A5;
    flex-shrink: 0;
}

.sc-info-card-body h3 {
    font-size: 15px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 6px 0;
    font-family: "Open Sans", sans-serif;
}

.sc-info-card-body p {
    font-size: 13px;
    color: #4B6A8A;
    margin: 0;
    line-height: 1.6;
    font-family: "Open Sans", sans-serif;
}

/* --- Section activité récente --- */
.sc-recent-section {
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 14px;
    overflow: hidden;
}

.sc-recent-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid #DFE5EC;
}

.sc-recent-title {
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.sc-see-all-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    font-size: 13px;
    font-weight: 600;
    color: #0A58A5;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    font-family: "Open Sans", sans-serif;
    transition: background-color 0.2s ease;
}

.sc-see-all-btn:hover {
    background-color: #EFF6FF;
}

/* --- Transaction list (shared) --- */
.sc-transactions-list {
    display: flex;
    flex-direction: column;
}

.sc-transaction-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 20px;
    border-bottom: 1px solid #F3F4F6;
    transition: background-color 0.15s ease;
}

.sc-transaction-item:last-child {
    border-bottom: none;
}

.sc-transaction-item:hover {
    background-color: #FAFBFC;
}

.sc-transaction-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
}

.sc-icon-credit {
    background-color: #DCFCE7;
    color: #16A34A;
}

.sc-icon-debit {
    background-color: #FEE2E2;
    color: #DC2626;
}

.sc-transaction-details {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.sc-transaction-title {
    font-size: 14px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sc-transaction-date {
    font-size: 12px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.sc-transaction-amount {
    font-size: 15px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
}

.sc-amount-credit { color: #16A34A; }
.sc-amount-debit  { color: #DC2626; }

/* --- Card header with action --- */
.sc-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.sc-card-header-wrap {
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.sc-allocate-inline-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 16px;
    background-color: #0A58A5;
    color: #FFFFFF;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: background-color 0.2s ease;
    white-space: nowrap;
    flex-shrink: 0;
}

.sc-allocate-inline-btn:hover {
    background-color: #084a8f;
}

/* --- Cohortes grid (allocations tab) --- */
.sc-cohortes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

.sc-cohorte-card {
    padding: 20px;
    background-color: #FAFBFC;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.sc-cohorte-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.07);
    border-color: #C8D6E5;
}

.sc-cohorte-card-top {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.sc-cohorte-avatar-wrap {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-color: #EFF6FF;
    color: #0A58A5;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}

.sc-cohorte-meta {
    min-width: 0;
}

.sc-cohorte-name {
    font-size: 15px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 3px 0;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sc-cohorte-meta-label {
    font-size: 12px;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
    display: flex;
    align-items: center;
    gap: 4px;
}

.sc-cohorte-numbers {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: 14px;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    overflow: hidden;
}

.sc-cohorte-number {
    flex: 1;
    padding: 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sc-cohorte-divider {
    width: 1px;
    height: 36px;
    background-color: #DFE5EC;
}

.sc-cohorte-number-value {
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    line-height: 1;
}

.sc-value-consumed {
    color: #EA580C;
}

.sc-cohorte-number-label {
    font-size: 11px;
    font-weight: 500;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-family: "Open Sans", sans-serif;
}

.sc-progress-bar-wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sc-progress-bar {
    width: 100%;
    height: 6px;
    background-color: #F3F4F6;
    border-radius: 3px;
    overflow: hidden;
}

.sc-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #EA580C, #F97316);
    border-radius: 3px;
    transition: width 0.4s ease;
    min-width: 3px;
}

.sc-progress-labels {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.sc-cohorte-no-credits {
    font-size: 12px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    text-align: center;
    padding: 8px;
    background-color: #F9FAFB;
    border-radius: 6px;
    border: 1px dashed #DFE5EC;
}

/* --- Entrepreneurs list --- */
.sc-entrepreneurs-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sc-entrepreneur-row {
    padding: 16px 18px;
    background-color: #FAFBFC;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    transition: box-shadow 0.2s ease;
}

.sc-entrepreneur-row:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.sc-entrepreneur-row > .sc-entrepreneur-avatar,
.sc-entrepreneur-row > .sc-entrepreneur-info,
.sc-entrepreneur-row > .sc-entrepreneur-stats {
    /* top section = flex row */
}

.sc-entrepreneur-row {
    display: grid;
    grid-template-columns: 40px 1fr auto;
    grid-template-rows: auto auto;
    gap: 0 14px;
    align-items: center;
}

.sc-entrepreneur-allocations {
    grid-column: 1 / -1;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #EAECF0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sc-entrepreneur-avatar {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-color: #0A58A5;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sc-entrepreneur-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.sc-entrepreneur-name {
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.sc-entrepreneur-email {
    font-size: 12px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sc-entrepreneur-stats {
    display: flex;
    gap: 20px;
}

.sc-entrepreneur-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
}

.sc-entrepreneur-stat-value {
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    line-height: 1;
}

.sc-entrepreneur-stat-label {
    font-size: 11px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.sc-allocation-detail {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 12px;
    background-color: #FFFFFF;
    border: 1px solid #EAECF0;
    border-radius: 7px;
}

.sc-allocation-detail-left {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sc-allocation-detail-amount {
    font-size: 13px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.sc-allocation-detail-date {
    font-size: 11px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.sc-allocation-detail-motif {
    font-size: 11px;
    font-weight: 600;
    color: #0A58A5;
    padding: 3px 8px;
    background-color: #EFF6FF;
    border-radius: 4px;
    text-transform: capitalize;
    font-family: "Open Sans", sans-serif;
}

/* --- History filters --- */
.sc-history-filters {
    display: flex;
    gap: 6px;
}

.sc-history-filter {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    background-color: #F3F4F6;
    border: 1px solid transparent;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.18s ease;
}

.sc-history-filter:hover {
    background-color: #E8EAED;
    color: #223245;
}

.sc-history-filter.active {
    background-color: #0A58A5;
    color: #FFFFFF;
    border-color: #0A58A5;
}

/* History tab: transactions dans une card */
.sc-transactions-list .sc-transaction-item:first-child {
    border-radius: 0;
}

/* --- Empty states --- */
.sc-empty-state {
    padding: 40px 24px;
    text-align: center;
}

.sc-empty-state.sc-empty-centered {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.sc-empty-icon {
    font-size: 28px;
    color: #D1D5DB;
    display: block;
    margin-bottom: 4px;
}

.sc-empty-state p {
    font-size: 14px;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.sc-empty-cta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 4px;
    padding: 9px 18px;
    background-color: #EFF6FF;
    color: #0A58A5;
    border: 1px solid #BFDBFE;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.sc-empty-cta:hover {
    background-color: #DBEAFE;
}

/* --- Combobox entrepreneur avec recherche --- */
.sc-combo {
    position: relative;
}

.sc-combo-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.sc-combo-search-icon {
    position: absolute;
    left: 14px;
    color: #9CA3AF;
    font-size: 13px;
    pointer-events: none;
    z-index: 1;
}

.sc-combo-input {
    width: 100%;
    padding: 12px 40px 12px 38px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    color: #223245;
    background-color: #FFFFFF;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
}

.sc-combo-input:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.sc-combo-clear {
    position: absolute;
    right: 12px;
    background: none;
    border: none;
    color: #9CA3AF;
    font-size: 13px;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: color 0.15s ease;
}

.sc-combo-clear:hover {
    color: #374151;
}

/* Entrepreneur sélectionné (remplace le champ de saisie) */
.sc-combo-selected {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border: 1.5px solid #0A58A5;
    border-radius: 8px;
    background-color: #EFF6FF;
}

.sc-combo-selected-avatar {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background-color: #0A58A5;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sc-combo-selected-info {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    min-width: 0;
}

.sc-combo-selected-name {
    font-size: 14px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sc-combo-selected-email {
    font-size: 12px;
    color: #4B6A8A;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sc-combo-deselect {
    background: none;
    border: none;
    color: #6E7F93;
    font-size: 13px;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: color 0.15s ease, background-color 0.15s ease;
}

.sc-combo-deselect:hover {
    color: #223245;
    background-color: rgba(0, 0, 0, 0.05);
}

/* Dropdown résultats */
.sc-combo-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 1100;
    max-height: 240px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #DFE5EC transparent;
}

.sc-combo-dropdown::-webkit-scrollbar {
    width: 4px;
}

.sc-combo-dropdown::-webkit-scrollbar-track {
    background: transparent;
}

.sc-combo-dropdown::-webkit-scrollbar-thumb {
    background-color: #DFE5EC;
    border-radius: 2px;
}

.sc-combo-option {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 10px 14px;
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease;
    font-family: "Open Sans", sans-serif;
    border-bottom: 1px solid #F3F4F6;
}

.sc-combo-option:last-of-type {
    border-bottom: none;
}

.sc-combo-option:hover,
.sc-combo-option.highlighted {
    background-color: #F0F7FF;
}

.sc-combo-option-avatar {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background-color: #0A58A5;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sc-combo-option-info {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.sc-combo-option-name {
    font-size: 14px;
    font-weight: 600;
    color: #223245;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.sc-combo-option-email {
    font-size: 12px;
    color: #6E7F93;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.sc-combo-no-results {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 14px;
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    justify-content: center;
}

/* Page Crédits pour les Structures */

.structures-credits-page-header-actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.structures-credits-header-btn {
    padding: 10px 16px;
    border: none;
    border-radius: 16px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    font-weight: 600;
}

.structures-credits-buy-btn {
    background-color: #DFE5EC;
    color: #223245;
}

.structures-credits-allocate-btn {
    background-color: #0A58A5;
    color: #FFFFFF;
}

.structures-credits-header-btn i {
    font-size: 14px;
}

/* Dropdown pour Allouer des crédits */
.structures-credits-allocate-dropdown-wrapper {
    position: relative;
}

.structures-credits-allocate-dropdown-wrapper .structures-credits-allocate-btn {
    display: flex;
    align-items: center;
    gap: 8px;
}

.structures-credits-allocate-dropdown-wrapper .structures-credits-allocate-btn i.fa-chevron-down {
    font-size: 12px;
    transition: transform 0.2s ease;
}

.structures-credits-allocate-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    min-width: 220px;
    z-index: 1000;
    overflow: hidden;
}

.structures-credits-allocate-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    width: 100%;
    background: none;
    border: none;
    border-bottom: 1px solid #F3F4F6;
    color: #223245;
    text-align: left;
    font-family: inherit;
    font-size: inherit;
    text-decoration: none;
    transition: background-color 0.2s ease;
    cursor: pointer;
}

.structures-credits-allocate-option:last-child {
    border-bottom: none;
}

.structures-credits-allocate-option:hover {
    background-color: #F9FAFB;
    color: #0A58A5;
}

.structures-credits-allocate-option i {
    width: 20px;
    text-align: center;
    color: #6E7F93;
}

.structures-credits-allocate-option:hover i {
    color: #0A58A5;
}

.structures-credits-allocate-option span {
    font-size: 14px;
    font-weight: 500;
}

/* Filter tab icons */
.cohortes-filter-tab i {
    font-size: 13px;
}

.structures-credits-tab-content.hidden {
    display: none;
}

.structures-credits-tab-content{
    margin-top: 30px;
}

/* Sous-onglets pour Allocations & Budgets */
.structures-credits-sub-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
    border-bottom: 2px solid #DFE5EC;
    padding-bottom: 0;
}

.structures-credits-sub-tab {
    padding: 12px 24px;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: "Open Sans", sans-serif;
    margin-bottom: -2px;
}

.structures-credits-sub-tab:hover {
    color: #0A58A5;
    background-color: rgba(10, 88, 165, 0.05);
}

.structures-credits-sub-tab.active {
    color: #0A58A5;
    border-bottom-color: #0A58A5;
    background-color: rgba(10, 88, 165, 0.05);
}

.structures-credits-sub-tab i {
    font-size: 14px;
}

.structures-credits-sub-tab-content {
    padding: 0;
}

.structures-credits-sub-tab-content.hidden {
    display: none;
}

/* Summary Cards */
.structures-credits-summary-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 32px;
}

.structures-credits-card {
    border-radius: 16px;
    padding: 24px;
    transition: box-shadow 0.2s ease;
}

.structures-credits-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.structures-credits-card-primary {
    background: linear-gradient(135deg, #0A58A5 0%, #084a8f 100%);
    color: #ffffff;
    position: relative;
    overflow: hidden;
}

.structures-credits-card-white {
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
}

.structures-credits-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.structures-credits-card-label {
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-card-white .structures-credits-card-label {
    color: #6E7F93;
}

.structures-credits-card-icon {
    font-size: 24px;
    color: rgba(255, 255, 255, 0.9);
    opacity: 0.7;
}

.structures-credits-card-icon-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.structures-credits-card-icon-purple {
    background-color: #E9D5FF;
    color: #9333EA;
}

.structures-credits-card-icon-orange {
    background-color: #FED7AA;
    color: #EA580C;
}

.structures-credits-card-value {
    font-size: 40px;
    font-weight: 700;
    color: #FFFFFF;
    margin-bottom: 4px;
    font-family: "Open Sans", sans-serif;
    line-height: 1;
}

.structures-credits-card-value-secondary {
    font-size: 32px;
    font-weight: 700;
    color: #223245;
    margin-bottom: 8px;
}

.structures-credits-card-unit {
    font-size: 16px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 16px;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-card-white .structures-credits-card-unit {
    color: #6E7F93;
}

.structures-credits-card-autonomy {
    font-size: 14px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 20px;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-recharge-btn {
    padding: 10px 20px;
    background-color: #FFFFFF;
    color: #0A58A5;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.structures-credits-recharge-btn:hover {
    background-color: #F3F4F6;
    transform: translateY(-1px);
}

.structures-credits-card-description {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin-bottom: 12px;
    font-family: "Open Sans", sans-serif;
}

/* Progress Bars */
.structures-credits-progress-bar {
    width: 100%;
    height: 8px;
    background-color: #F3F4F6;
    border-radius: 4px;
    overflow: hidden;
}

.structures-credits-progress-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.structures-credits-progress-bar-purple {
    background-color: #9333EA;
}

.structures-credits-progress-bar-orange {
    background-color: #EA580C;
}

/* Info Section */
.structures-credits-info-section {
    display: flex;
    gap: 24px;
    padding: 24px;
    background-color: #F8F9FA;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    margin-top: 32px;
}

.structures-credits-info-icon {
    width: 48px;
    height: 48px;
    background-color: #EFF6FF;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.structures-credits-info-icon i {
    font-size: 24px;
    color: #0A58A5;
}

.structures-credits-info-content {
    flex: 1;
}

.structures-credits-info-title {
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 8px 0;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-info-description {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    line-height: 1.6;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocations-section{
    margin-top: 30px;
}

.settings-card-title{
    margin-bottom: 10px;
}

.form-checkbox{
    display: flex;
    align-items: center;
    gap: 10px;
}

.structures-credits-section-title {
    font-size: 24px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 8px 0;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-section-subtitle {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0 0 24px 0;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocations-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.structures-credits-allocation-item {
    padding: 20px;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    transition: box-shadow 0.2s ease;
}

.structures-credits-allocation-item:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.structures-credits-allocation-header {
    margin-bottom: 16px;
}

.structures-credits-allocation-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.structures-credits-allocation-cohorte-name {
    font-size: 16px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocation-entrepreneurs {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocation-stats {
    display: flex;
    gap: 32px;
}

.structures-credits-allocation-stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.structures-credits-allocation-stat-label {
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocation-stat-value {
    font-size: 20px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocation-stat-value-consumed {
    color: #EA580C;
}

.structures-credits-allocation-entrepreneur-name {
    font-size: 16px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocation-entrepreneur-email {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocation-details {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #DFE5EC;
}

.structures-credits-allocation-details-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.structures-credits-allocation-detail-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background-color: #F6F7F8;
    border-radius: 8px;
}

.structures-credits-allocation-detail-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.structures-credits-allocation-detail-amount {
    font-size: 14px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocation-detail-date {
    font-size: 12px;
    font-weight: 400;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-allocation-detail-motif {
    font-size: 12px;
    font-weight: 500;
    color: #0A58A5;
    padding: 4px 8px;
    background-color: rgba(10, 88, 165, 0.1);
    border-radius: 4px;
    text-transform: capitalize;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-transactions-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.structures-credits-transaction-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    transition: box-shadow 0.2s ease;
}

.structures-credits-transaction-item:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.structures-credits-transaction-icon {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.structures-credits-transaction-icon.transaction-icon-credit {
    background-color: #D1FAE5;
    color: #10B981;
}

.structures-credits-transaction-icon.transaction-icon-debit {
    background-color: #FEE2E2;
    color: #DC2626;
}

.structures-credits-transaction-details {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.structures-credits-transaction-title {
    font-size: 16px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-transaction-date {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-transaction-amount {
    font-size: 18px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
}

.structures-credits-transaction-amount.amount-credit {
    color: #10B981;
}

.structures-credits-transaction-amount.amount-debit {
    color: #DC2626;
}

/* Empty State */
.structures-credits-empty-state {
    padding: 48px;
    text-align: center;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
}

.structures-credits-empty-state p {
    font-size: 16px;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

/* Modal Acheter des crédits */
.buy-credits-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.buy-credits-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
}

.buy-credits-modal-content {
    position: relative;
    background-color: #ffffff;
    border-radius: 12px;
    width: 100%;
    max-width: 700px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    z-index: 1;
}

.buy-credits-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 24px;
    border-bottom: 1px solid #DFE5EC;
}

.buy-credits-modal-header-text {
    flex: 1;
}

.buy-credits-modal-title {
    font-size: 20px;
    font-weight: 600;
    color: #1F2937;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.buy-credits-modal-close {
    background: none;
    border: none;
    color: #6E7F93;
    font-size: 20px;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
    margin-left: 16px;
}

.buy-credits-modal-close:hover {
    color: #1F2937;
}

.buy-credits-modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

.buy-credits-modal-instructions {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0 0 24px 0;
    font-family: "Open Sans", sans-serif;
    line-height: 1.5;
}

/* Packs Section */
.buy-credits-packs-section {
    margin-bottom: 32px;
}

.buy-credits-packs-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.buy-credits-pack-card {
    position: relative;
    padding: 20px;
    background-color: #FFFFFF;
    border: 2px solid #DFE5EC;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.buy-credits-pack-radio {
    display: none;
}

/* Pack sélectionné - bordure bleue - PRIORITÉ MAXIMALE */
.buy-credits-pack-card.popular.selected,
label.buy-credits-pack-card.popular.selected,
label.buy-credits-pack-card.selected,
.buy-credits-pack-card.selected {
    border: 2px solid #0A58A5 !important;
    background-color: #EFF6FF !important;
    border-color: #0A58A5 !important;
    outline: none !important;
}

/* Pack populaire non sélectionné - bordure grise */
.buy-credits-pack-card.popular:not(.selected) {
    border: 2px solid #DFE5EC !important;
}

.buy-credits-pack-card:hover:not(.selected) {
    border-color: #0A58A5;
    box-shadow: 0 2px 8px rgba(10, 88, 165, 0.1);
}

.buy-credits-pack-badge {
    position: absolute;
    top: -10px;
    right: 16px;
    background-color: #0A58A5;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.buy-credits-pack-name {
    font-size: 18px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.buy-credits-pack-description {
    font-size: 13px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

.buy-credits-pack-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: auto;
}

.buy-credits-pack-credits {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #0A58A5;
    font-family: "Open Sans", sans-serif;
}

.buy-credits-pack-credits i {
    font-size: 14px;
}

.buy-credits-pack-price {
    font-size: 20px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

/* Terms Section */
.buy-credits-terms-section {
    margin-bottom: 24px;
}

.buy-credits-terms-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    user-select: none;
}

.buy-credits-terms-checkbox:hover {
    opacity: 0.9;
}

.buy-credits-terms-input {
    width: 20px;
    height: 20px;
    min-width: 20px;
    min-height: 20px;
    margin: 0;
    margin-top: 2px;
    cursor: pointer;
    accent-color: #0A58A5;
    flex-shrink: 0;
    border: 2px solid #DFE5EC;
    border-radius: 4px;
    background-color: #FFFFFF;
    display: block;
    position: relative;
}

.buy-credits-terms-input:checked {
    background-color: #0A58A5;
    border-color: #0A58A5;
    accent-color: #0A58A5;
}

.buy-credits-terms-input:checked::after {
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
}

.buy-credits-terms-input:focus {
    outline: 2px solid #EFF6FF;
    outline-offset: 2px;
}

.buy-credits-terms-text {
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

/* Modal Footer */
.buy-credits-modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 24px;
    border-top: 1px solid #DFE5EC;
}

.buy-credits-modal-btn {
    padding: 12px 24px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.buy-credits-modal-btn-cancel {
    background-color: #F6F7F8;
    color: #6E7F93;
}

.buy-credits-modal-btn-cancel:hover {
    background-color: #DFE5EC;
    color: #1F2937;
}

.buy-credits-modal-btn-submit {
    background-color: #0A58A5;
    color: #FFFFFF;
}

.buy-credits-modal-btn-submit:hover:not(:disabled):not(.disabled) {
    background-color: #084A8A;
}

.buy-credits-modal-btn-submit:disabled,
.buy-credits-modal-btn-submit.disabled {
    background-color: #0A58A5;
    color: #FFFFFF;
    cursor: not-allowed;
    opacity: 0.5;
}

/* Modal Allouer des crédits - Styles similaires au modal d'achat */
.allocate-credits-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.allocate-credits-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
}

.allocate-credits-modal-content {
    position: relative;
    background-color: #ffffff;
    border-radius: 12px;
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    z-index: 1;
}

.allocate-credits-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 24px;
    border-bottom: 1px solid #DFE5EC;
}

.allocate-credits-modal-header-text {
    flex: 1;
}

.allocate-credits-modal-title {
    font-size: 20px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.allocate-credits-modal-close {
    background: none;
    border: none;
    color: #6E7F93;
    font-size: 20px;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
    margin-left: 16px;
}

.allocate-credits-modal-close:hover {
    color: #1F2937;
}

.allocate-credits-modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

.allocate-credits-balance-section {
    background-color: #F9FAFB;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 24px;
}

.allocate-credits-balance-label {
    font-size: 14px;
    font-weight: 500;
    color: #6E7F93;
    margin-bottom: 8px;
}

.allocate-credits-balance-value {
    font-size: 24px;
    font-weight: 700;
    color: #0A58A5;
}

.allocate-credits-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.allocate-credits-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.allocate-credits-label {
    font-size: 14px;
    font-weight: 600;
    color: #223245;
}

.allocate-credits-label .required {
    color: #DC2626;
}

.allocate-credits-select,
.allocate-credits-input {
    padding: 12px 16px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    color: #223245;
    background-color: #FFFFFF;
    transition: border-color 0.2s ease;
    width: 100%;
}

.allocate-credits-select:focus,
.allocate-credits-input:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.allocate-credits-textarea {
    padding: 12px 16px;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    color: #223245;
    background-color: #FFFFFF;
    transition: border-color 0.2s ease;
    width: 100%;
    resize: vertical;
}

.allocate-credits-textarea:focus {
    outline: none;
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.allocate-credits-form .allocate-credits-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 24px 0 0 0;
    border-top: 1px solid #DFE5EC;
    margin-top: 8px;
}

.allocate-credits-modal-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all 0.2s ease;
}

.allocate-credits-modal-btn-cancel {
    background-color: #FFFFFF;
    color: #223245;
    border: 1px solid #DFE5EC;
}

.allocate-credits-modal-btn-cancel:hover {
    background-color: #F9FAFB;
}

.allocate-credits-modal-btn-submit {
    background-color: #0A58A5;
    color: #FFFFFF;
}

.allocate-credits-modal-btn-submit:hover:not(:disabled) {
    background-color: #084a8f;
}

.allocate-credits-modal-btn-submit:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.buy-credits-modal-btn-submit:disabled:hover,
.buy-credits-modal-btn-submit.disabled:hover {
    background-color: #0A58A5;
    color: #FFFFFF;
    cursor: not-allowed;
    opacity: 0.5;
}

.notification-preferences{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.notification-preference-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notification-preference-item .notification-preference-title{
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
    font-family: "Open Sans", sans-serif;
}

.notification-preference-item .notification-preference-description{
    font-size: 13px;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    line-height: 1.4;
}

.notification-preference-toggle{
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
    cursor: pointer;
    margin: 0;
}

.notification-preference-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.notification-preference-toggle input:checked + .notification-toggle-slider {
    background-color: #0A58A5;
}

.notification-toggle-slider {
    position: absolute;
    inset: 0;
    background-color: #D1D5DB;
    border-radius: 24px;
    transition: all 0.25s ease;
}

.notification-toggle-slider::before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    left: 3px;
    bottom: 3px;
    background-color: #ffffff;
    border-radius: 50%;
    transition: transform 0.25s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.notification-preference-toggle input:checked + .notification-toggle-slider::before {
    transform: translateX(20px);
}
/* ===== Profile Page ===== */
.profile-content{
    height: 100vh;
}

.profile-page{
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ===== Header (style discussions) ===== */
.profile-page-header{
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 64px;
    min-height: 64px;
    padding: 0 30px;
    animation: profileFadeUp 0.4s ease-out both;
}

.profile-page-header-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.profile-page-title{
    display: flex;
    align-items: center;
    gap: 10px;
}

.profile-page-title-avatar{
    width: 32px;
    height: 32px;
    border-radius: 10px;
    object-fit: cover;
}

.profile-page-title-initials{
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: rgba(10, 88, 165, 0.1);
    color: #0A58A5;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    flex-shrink: 0;
}

.profile-page-title span{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
}

.profile-export-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 12px;
    background: #0A58A5;
    padding: 0 17px;
    height: 38px;
    text-decoration: none;
    transition: background 0.2s;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
}

.profile-export-btn:hover{
    background: #084a8a;
}

.profile-export-btn i{
    font-size: 13px;
}

/* ===== Tabs Navigation ===== */
.profile-tabs-nav{
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0 30px;
    background: #FFF;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    min-height: 48px;
}

.profile-tab-btn{
    padding: 14px 20px;
    border: none;
    background: transparent;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: all 0.2s;
    white-space: nowrap;
}

.profile-tab-btn:hover{
    color: #0A58A5;
}

.profile-tab-btn.active{
    color: #0A58A5;
    border-bottom-color: #0A58A5;
}

/* ===== Page Layout (scrollable area) ===== */
.profile-page-layout{
    flex: 1;
    overflow: auto;
    padding: 30px;
    height: calc(100vh - 114px);
}

.profile-main-content{
    margin-top: 0;
}

/* ===== Overview Tab Layout ===== */
.profile-content-layout{
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 28px;
}

.profile-main-content{
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* ===== User Card ===== */
.profile-user-card{
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 28px;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    animation: profileFadeUp 0.4s ease-out both;
}

.profile-user-avatar{
    width: 72px;
    height: 72px;
    min-width: 72px;
    border-radius: 50%;
    background: var(--Dgrad, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    color: #FFF;
    font-family: "Open Sans";
    font-size: 24px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 1px;
}

.profile-user-info{
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.profile-user-name{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
}

.profile-user-details{
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.profile-user-detail-item{
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
}

.profile-user-detail-item i{
    font-size: 12px;
    color: #0A58A5;
}

.profile-user-tags{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 2px;
}

.profile-tag{
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    background: rgba(10, 88, 165, 0.08);
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}

.profile-edit-button{
    align-self: flex-start;
    margin-top: 4px;
    padding: 7px 20px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.profile-edit-button:hover{
    background: #F6F7F8;
    border-color: #0A58A5;
    color: #0A58A5;
}

/* ===== Profile Avatar ===== */
.profile-avatar-img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.profile-avatar-upload-group{
    margin-bottom: 4px;
}

.profile-avatar-upload{
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 8px;
}

.profile-avatar-preview{
    width: 72px;
    height: 72px;
    min-width: 72px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--Dgrad, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    display: flex;
    align-items: center;
    justify-content: center;
}

.profile-avatar-placeholder{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 1px;
}

.profile-avatar-input{
    display: none;
}

.profile-avatar-upload-info{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.profile-avatar-upload-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 18px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.profile-avatar-upload-btn:hover{
    background: #F6F7F8;
    border-color: #0A58A5;
    color: #0A58A5;
}

/* ===== Profile Completion Section ===== */
.profile-completion-section{
    padding: 28px;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    animation: profileFadeUp 0.4s ease-out 0.1s both;
}

.profile-completion-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    margin: 0 0 20px 0;
}

/* Progress Bar */
.profile-progress-bar-container{
    margin-bottom: 24px;
}

.profile-progress-bar-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.profile-progress-label{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
}

.profile-progress-percentage{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
}

.profile-progress-bar{
    width: 100%;
    height: 8px;
    background: #E8ECF1;
    border-radius: 4px;
    overflow: hidden;
}

.profile-progress-fill{
    height: 100%;
    border-radius: 4px;
    background: linear-gradient(90deg, #0A58A5, #1E7FD9);
    transition: width 0.8s ease;
}

/* Completion Steps */
.profile-completion-steps{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.profile-completion-step{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 20px;
    border-radius: 14px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FAFBFC;
    transition: all 0.2s;
}

.profile-completion-step.active{
    border-color: #0A58A5;
    background: #F0F7FF;
}

.profile-completion-step.completed{
    border-color: #D1FAE5;
    background: #F0FDF4;
}

.profile-completion-step.locked{
    opacity: 0.55;
}

.step-content{
    flex: 1;
}

.step-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    margin: 0;
}

.profile-completion-step.completed .step-title::before{
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    color: #10B981;
    margin-right: 8px;
    font-size: 12px;
}

.step-description{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    margin: 2px 0 0 0;
}

.step-action-button{
    padding: 7px 18px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}

.step-action-button:hover{
    background: #F6F7F8;
}

.step-action-button.primary{
    background: #0A58A5;
    color: #FFF;
    border-color: #0A58A5;
}

.step-action-button.primary:hover{
    background: #084a8a;
}

.step-action-button:disabled{
    cursor: not-allowed;
    opacity: 0.5;
}

/* ===== Profile Sidebar ===== */
.profile-sidebar{
    display: flex;
    flex-direction: column;
    gap: 20px;
    animation: profileFadeUp 0.4s ease-out 0.15s both;
}

.profile-sidebar-card{
    padding: 24px;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.sidebar-card-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
    line-height: 20px;
    margin: 0 0 4px 0;
}

.sidebar-card-subtitle{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    margin: 0 0 16px 0;
}

.sidebar-card-description{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    margin: 4px 0 16px 0;
}

/* Personalization Options */
.personalization-options{
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.personalization-option{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.option-label{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
}

.option-description{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.channel-buttons{
    display: flex;
    gap: 8px;
    margin-top: 4px;
}

.channel-button{
    padding: 6px 14px;
    border-radius: 8px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.channel-button:hover{
    border-color: #0A58A5;
    color: #0A58A5;
}

.channel-button.active{
    background: #0A58A5;
    color: #FFF;
    border-color: #0A58A5;
}

.learn-more-button{
    width: 100%;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid #0A58A5;
    background: #FFF;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.learn-more-button:hover{
    background: rgba(10, 88, 165, 0.06);
}

/* ===== Learn More Modal ===== */
.learn-more-modal-overlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.learn-more-modal{
    background: #FFF;
    border-radius: 20px;
    width: 100%;
    max-width: 540px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    animation: scaleIn 0.25s ease-out;
}

.learn-more-modal-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 28px 0;
}

.learn-more-modal-header h3{
    font-size: 18px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.learn-more-modal-close{
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: none;
    background: #F3F6F9;
    color: #6E7F93;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .15s ease;
}

.learn-more-modal-close:hover{
    background: #E8ECF1;
    color: #223245;
}

.learn-more-modal-body{
    padding: 24px 28px 28px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.learn-more-item{
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.learn-more-item-icon{
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(10, 88, 165, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #0A58A5;
    flex-shrink: 0;
}

.learn-more-item h4{
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 4px 0;
    font-family: "Open Sans", sans-serif;
}

.learn-more-item p{
    font-size: 13px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

/* ===== Profile Forms (Quick Profile & AI Assistant) ===== */
.profile-form-card{
    padding: 28px;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    animation: profileFadeUp 0.4s ease-out both;
}

.profile-form-header{
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
}

.profile-form-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    margin: 0 0 4px 0;
}

.profile-form-subtitle{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    margin: 0;
}

.profile-form{
    display: flex;
    flex-direction: column;
}

.profile-form-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.profile-form-label{
    display: block;
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
}

.form-group select{
    height: fit-content;
}

.profile-form-input{
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 10px;
    background: #F6F7F8;
    font-family: "Open Sans";
    font-size: 14px;
    color: #22364D;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
    height: 42px;
}

.profile-form-input:focus{
    border-color: #0A58A5;
    background: #FFF;
}

.profile-form-hint{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    margin: 4px 0 0 0;
}

.profile-form-actions{
    display: flex;
    justify-content: flex-end;
    padding-top: 10px;
}

.profile-form-submit-button{
    padding: 10px 28px;
    border-radius: 12px;
    background: #0A58A5;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: background 0.2s;
    height: 42px;
}

.profile-form-submit-button:hover{
    background: #084a8a;
}

/* ===== Detailed Profile ===== */
.detailed-profile-section{
    animation: profileFadeUp 0.4s ease-out both;
}

.detailed-profile-section-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 20px 0;
}

.detailed-profile-form{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Collapsible Sections */
.collapsible-section{
    border-radius: 16px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.collapsible-section-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    cursor: pointer;
    transition: background 0.2s;
}

.collapsible-section-header:hover{
    background: #FAFBFC;
}

.collapsible-section-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 700;
    margin: 0;
}

.collapsible-section-icon{
    color: #6E7F93;
    transition: transform 0.3s;
}

.collapsible-section.open .collapsible-section-icon{
    transform: rotate(180deg);
}

.collapsible-section-content{
    padding: 0 22px 22px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.detailed-form-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.detailed-form-label{
    display: block;
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
}

.detailed-form-input{
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 10px;
    background: #F6F7F8;
    font-family: "Open Sans";
    font-size: 14px;
    color: #22364D;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
    height: 42px;
}

.detailed-form-input:focus{
    border-color: #0A58A5;
    background: #FFF;
}

.detailed-form-input[readonly]{
    opacity: 0.6;
    cursor: not-allowed;
}

/* Phone input with indicatif */
.phone-input-wrapper{
    display: flex;
    align-items: center;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 10px;
    background: #F6F7F8;
    overflow: hidden;
    transition: border-color 0.2s;
}

.phone-input-wrapper:focus-within{
    border-color: #0A58A5;
    background: #FFF;
}

.phone-indicatif{
    padding: 0 12px;
    font-size: 14px;
    font-weight: 600;
    color: #445972;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
    border-right: 1px solid #DFE5EC;
    height: 42px;
    display: flex;
    align-items: center;
    background: #EDF0F3;
    flex-shrink: 0;
}

.phone-number-input.detailed-form-input{
    border: none;
    border-radius: 0;
    background: transparent;
    flex: 1;
}

.phone-number-input.detailed-form-input:focus{
    border: none;
    background: transparent;
}

.detailed-form-hint{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    margin: 4px 0 0 0;
}

.detailed-form-textarea{
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    border-radius: 10px;
    background: #F6F7F8;
    font-family: "Open Sans";
    font-size: 14px;
    color: #22364D;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
    resize: vertical;
}

.detailed-form-textarea:focus{
    border-color: #0A58A5;
    background: #FFF;
}

/* Slider */
.slider-container{
    display: flex;
    align-items: center;
    gap: 16px;
}

.availability-slider{
    flex: 1;
    -webkit-appearance: none;
    height: 6px;
    border-radius: 3px;
    background: #E8ECF1;
    outline: none;
}

.availability-slider::-webkit-slider-thumb{
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #0A58A5;
    cursor: pointer;
    border: 3px solid #FFF;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.slider-value{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    min-width: 45px;
    text-align: center;
}

/* Domaines Checkboxes */
.domaines-checkboxes{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 4px;
}

.domaine-checkbox{
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.domaine-checkbox input[type="checkbox"]{
    width: 16px;
    height: 16px;
    accent-color: #0A58A5;
}

.checkbox-label{
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
}

/* Yes/No Buttons */
.yes-no-buttons{
    display: flex;
    gap: 10px;
}

.yes-no-radio{
    display: none;
}

.yes-no-button{
    padding: 8px 24px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.yes-no-button:hover{
    border-color: #0A58A5;
}

.yes-no-button.active{
    background: #0A58A5;
    color: #FFF;
    border-color: #0A58A5;
}

.detailed-form-actions{
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.detailed-form-submit-button{
    padding: 10px 28px;
    border-radius: 12px;
    background: #0A58A5;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: background 0.2s;
    height: 42px;
}

.detailed-form-submit-button:hover{
    background: #084a8a;
}

/* ===== Settings Page ===== */
.settings-content{
    height: auto;
}

.settings-page{
    height: auto;
    display: flex;
    flex-direction: column;
    overflow: visible;
}

.settings-page-header{
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 64px;
    min-height: 64px;
    padding: 0 30px;
    animation: profileFadeUp 0.4s ease-out both;
}

.settings-page-header-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.settings-page-title{
    display: flex;
    align-items: center;
    gap: 10px;
}

.settings-page-title i{
    font-size: 18px;
    color: var(--Color-Texte, #22364D);
}

.settings-page-title span{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
}

.settings-page-layout{
    flex: 1;
    overflow: auto;
    padding: 30px;
}

/* Danger tab button */
.profile-tab-btn.danger{
    color: #EF4444;
}

.profile-tab-btn.danger.active{
    color: #EF4444;
    border-bottom-color: #EF4444;
}

/* ===== Sessions List ===== */
.active-sessions-list{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.active-session-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    border-radius: 14px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FAFBFC;
    transition: all 0.2s;
}

.active-session-item.current-session{
    border-color: #0A58A5;
    background: #F0F7FF;
}

.session-info{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.session-device{
    display: flex;
    align-items: center;
    gap: 10px;
}

.session-device strong{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
}

.current-session-badge{
    display: inline-flex;
    padding: 2px 10px;
    border-radius: 20px;
    background: rgba(10, 88, 165, 0.1);
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
}

.session-details{
    display: flex;
    align-items: center;
    gap: 14px;
}

.session-location{
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 500;
}

.session-location i{
    font-size: 11px;
    color: #0A58A5;
}

.status-badge{
    display: inline-flex;
    padding: 2px 8px;
    border-radius: 20px;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
}

.status-badge.active{
    background: #D1FAE5;
    color: #059669;
}

.session-time{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
}

.no-sessions-message{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    text-align: center;
    padding: 30px;
}

/* ===== RGPD Section ===== */
.rgpd-section{
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.rgpd-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-radius: 14px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FAFBFC;
}

.rgpd-item-title{
    color: var(--Color-Texte, #22364D);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 4px 0;
}

.rgpd-item-description{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    margin: 0;
}

.rgpd-export-button{
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    border-radius: 10px;
    border: 1px solid #0A58A5;
    background: #FFF;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
    white-space: nowrap;
}

.rgpd-export-button:hover{
    background: rgba(10, 88, 165, 0.06);
}

/* Toggle Switch */
.rgpd-toggle-form{
    display: flex;
    align-items: center;
}

.rgpd-toggle-switch{
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    cursor: pointer;
}

.rgpd-toggle-switch input{
    opacity: 0;
    width: 0;
    height: 0;
}

.rgpd-toggle-slider{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #DFE5EC;
    border-radius: 24px;
    transition: all 0.3s;
}

.rgpd-toggle-slider::before{
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background: #FFF;
    border-radius: 50%;
    transition: all 0.3s;
}

.rgpd-toggle-switch input:checked + .rgpd-toggle-slider{
    background: #0A58A5;
}

.rgpd-toggle-switch input:checked + .rgpd-toggle-slider::before{
    transform: translateX(20px);
}

/* ===== Danger Zone ===== */
.danger-zone-card{
    padding: 24px;
    border-radius: 14px;
    border: 1px solid #FECACA;
    background: #FEF2F2;
}

.danger-zone-title{
    color: #DC2626;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 8px 0;
}

.danger-zone-warning{
    color: #7F1D1D;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 20px 0;
}

.delete-account-form{
    display: inline;
}

.delete-account-button{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 10px;
    background: #DC2626;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: background 0.2s;
}

.delete-account-button:hover{
    background: #B91C1C;
}

/* ===== Animations ===== */
@keyframes profileFadeUp{
    from{
        opacity: 0;
        transform: translateY(20px);
    }
    to{
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== Responsive ===== */
@media (max-width: 1024px){
    .profile-content-layout{
        grid-template-columns: 1fr;
    }

    .profile-sidebar{
        flex-direction: row;
    }

    .profile-sidebar-card{
        flex: 1;
    }
}

@media (max-width: 768px){
    .profile-page-header{
        padding: 0 15px;
    }

    .profile-export-btn span{
        display: none;
    }

    .profile-tabs-nav{
        padding: 0 15px;
        overflow-x: auto;
    }

    .profile-tab-btn{
        padding: 12px 14px;
        font-size: 13px;
    }

    .profile-page-layout{
        padding: 20px 15px;
        height: calc(100% - 48px);
        overflow: scroll;
    }

    .profile-content-layout{
        padding: 0;
        gap: 16px;
    }

    .profile-user-card{
        flex-direction: column;
        text-align: center;
        padding: 24px 20px;
    }

    .profile-user-details{
        justify-content: center;
    }

    .profile-user-tags{
        justify-content: center;
    }

    .profile-edit-button{
        align-self: center;
    }

    .profile-completion-section{
        padding: 20px;
    }

    .profile-form-grid,
    .detailed-form-grid{
        grid-template-columns: 1fr;
    }

    .profile-sidebar{
        flex-direction: column;
    }

    .profile-form-card{
        padding: 20px;
    }

    /* Settings responsive */
    .settings-page-header{
        padding: 0 15px;
    }

    .settings-page-layout{
        padding: 20px 15px;
    }

    .rgpd-item{
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .delete-account-button span{
        font-size: 12px;
    }
}
/* ═══════════════════════════════════════════════════
   CREDITS & PAIEMENTS — Layout
   ═══════════════════════════════════════════════════ */

.credits-content{
    height: 100vh;
}

.credits-page-header{
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 64px;
    padding: 0 30px;
}

.credits-page-header-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.credits-page-header-left{
    display: flex;
    align-items: center;
}

.credits-page-title{
    display: flex;
    align-items: center;
    gap: 10px;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

.credits-page-title i{
    color: #0A58A5;
    font-size: 18px;
}

.credits-page-layout{
    padding: 30px;
    height: calc(100vh - 64px);
    overflow: scroll;
}

.hidden{
    display: none !important;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Hero (style favoris)
   ═══════════════════════════════════════════════════ */

.credits-hero{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 24px;
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.credits-hero-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.credits-hero-label{
    color: #BEDBFF;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    animation: fadeUp 0.4s ease-out 0.2s both;
}

.credits-hero-amount{
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-top: 8px;
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.credits-hero-value{
    color: #FFF;
    font-family: "Open Sans", sans-serif;
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
}

.credits-hero-unit{
    color: rgba(255, 255, 255, 0.80);
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 600;
}

.credits-hero-description{
    margin-top: 10px;
    color: #DBEAFE;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    max-width: 500px;
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.credits-hero-stats{
    display: flex;
    gap: 10px;
}

.credits-hero-stat{
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(0, 0, 0, 0.10);
    padding: 12px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 90px;
    animation: fadeUp 0.4s ease-out both;
}

.credits-hero-stat:nth-child(1){ animation-delay: 0.2s; }
.credits-hero-stat:nth-child(2){ animation-delay: 0.25s; }
.credits-hero-stat:nth-child(3){ animation-delay: 0.3s; }

.credits-hero-stat-value{
    color: #FFF;
    font-family: "Open Sans", sans-serif;
    font-size: 22px;
    font-weight: 700;
}

.credits-hero-stat-label{
    color: #BEDBFF;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.credits-hero-cta{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: #FFF;
    border-radius: 12px;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-top: 16px;
    animation: fadeUp 0.4s ease-out 0.35s both;
}

.credits-hero-cta:hover{
    background: rgba(255, 255, 255, 0.25);
}

.credits-hero-cta i{
    font-size: 12px;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Tabs (style favoris)
   ═══════════════════════════════════════════════════ */

.credits-tabs-wrapper{
    margin: 20px 0;
    animation: fadeUp 0.4s ease-out 0.35s both;
}

.credits-tabs{
    display: flex;
    gap: 10px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 5px;
}

.credits-tab{
    border: none;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    transition: all .2s ease-in-out;
    background: transparent;
    cursor: pointer;
    border-radius: 8px;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
}

.credits-tab:hover{
    color: #223245;
    background: #F8F9FA;
}

.credits-tab.active{
    background: #0A58A5;
    color: #fff;
}

.credits-tab i{
    font-size: 13px;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Transaction Filters
   ═══════════════════════════════════════════════════ */

.credits-filters{
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    animation: fadeUp 0.4s ease-out 0.4s both;
}

.credits-filter-btn{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    color: #6E7F93;
    font-size: 13px;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all .2s ease;
}

.credits-filter-btn:hover{
    background: #F8F9FA;
    color: #223245;
}

.credits-filter-btn.active{
    background: #0A58A5;
    border-color: #0A58A5;
    color: #FFF;
}

.credits-filter-btn.filter-credit{
    border-color: #10B981;
    color: #10B981;
}

.credits-filter-btn.filter-credit:hover{
    background: #D1FAE5;
}

.credits-filter-btn.filter-credit.active{
    background: #10B981;
    border-color: #10B981;
    color: #FFF;
}

.credits-filter-btn.filter-debit{
    border-color: #DC2626;
    color: #DC2626;
}

.credits-filter-btn.filter-debit:hover{
    background: #FEE2E2;
}

.credits-filter-btn.filter-debit.active{
    background: #DC2626;
    border-color: #DC2626;
    color: #FFF;
}

.credits-filter-btn i{
    font-size: 11px;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Transaction Items
   ═══════════════════════════════════════════════════ */

.credits-transactions{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.credits-transaction-item{
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    transition: all .2s ease;
    animation: scaleIn 0.4s ease-out both;
}

.credits-transaction-item:nth-child(1){ animation-delay: 0.4s; }
.credits-transaction-item:nth-child(2){ animation-delay: 0.45s; }
.credits-transaction-item:nth-child(3){ animation-delay: 0.5s; }
.credits-transaction-item:nth-child(4){ animation-delay: 0.55s; }
.credits-transaction-item:nth-child(5){ animation-delay: 0.6s; }
.credits-transaction-item:nth-child(6){ animation-delay: 0.65s; }
.credits-transaction-item:nth-child(7){ animation-delay: 0.7s; }
.credits-transaction-item:nth-child(8){ animation-delay: 0.75s; }

.credits-transaction-item:hover{
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-1px);
}

.credits-transaction-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    flex-shrink: 0;
    font-size: 16px;
}

.credits-transaction-icon.credit{
    background: #D1FAE5;
    color: #10B981;
}

.credits-transaction-icon.debit{
    background: #FEE2E2;
    color: #DC2626;
}

.credits-transaction-details{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.credits-transaction-title{
    font-size: 14px;
    font-weight: 600;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.credits-transaction-meta{
    font-size: 12px;
    font-weight: 400;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.credits-transaction-separator{
    margin: 0 4px;
    color: #DFE5EC;
}

.credits-transaction-amount{
    font-size: 15px;
    font-weight: 700;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
}

.credits-transaction-amount.credit{
    color: #10B981;
}

.credits-transaction-amount.debit{
    color: #DC2626;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Empty State
   ═══════════════════════════════════════════════════ */

.credits-empty-state{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    text-align: center;
    border-radius: 20px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    animation: fadeUp 0.5s ease-out 0.4s both;
}

.credits-empty-state i{
    font-size: 48px;
    color: #DFE5EC;
    margin-bottom: 16px;
}

.credits-empty-state h3{
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 8px 0;
    font-family: "Open Sans", sans-serif;
}

.credits-empty-state p{
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Pack Cards
   ═══════════════════════════════════════════════════ */

.credits-packs-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.credits-pack-card{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: all .25s ease-in-out;
    position: relative;
    text-align: center;
    animation: scaleIn 0.5s ease-out both;
}

.credits-pack-card:nth-child(1){ animation-delay: 0.4s; }
.credits-pack-card:nth-child(2){ animation-delay: 0.5s; }
.credits-pack-card:nth-child(3){ animation-delay: 0.6s; }

.credits-pack-card:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
    border-color: #0A58A5;
}

.credits-pack-card.selected{
    border-color: #0A58A5;
    background: #EFF6FF;
    box-shadow: 0 0 0 2px rgba(10, 88, 165, 0.2);
}

.credits-pack-card.popular{
    border-color: #F59E0B;
}

.credits-pack-badge{
    position: absolute;
    top: -10px;
    right: 16px;
    background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%);
    color: #FFF;
    font-size: 10px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans", sans-serif;
}

.credits-pack-icon{
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: rgba(10, 88, 165, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #0A58A5;
}

.credits-pack-card.selected .credits-pack-icon{
    background: rgba(10, 88, 165, 0.15);
}

.credits-pack-name{
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.credits-pack-amount{
    font-size: 26px;
    font-weight: 700;
    color: #0A58A5;
    font-family: "Open Sans", sans-serif;
}

.credits-pack-price{
    font-size: 14px;
    font-weight: 600;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Buy Mode Selector
   ═══════════════════════════════════════════════════ */

.credits-buy-mode-selector{
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
    background: #F3F6F9;
    padding: 4px;
    border-radius: 14px;
    width: fit-content;
}

.credits-buy-mode-btn{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border: none;
    border-radius: 11px;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    color: #6E7F93;
    background: transparent;
    cursor: pointer;
    transition: all .2s ease;
}

.credits-buy-mode-btn:hover{
    color: #223245;
}

.credits-buy-mode-btn.active{
    background: #FFF;
    color: #0A58A5;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.credits-buy-mode-btn i{
    font-size: 13px;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Custom Amount Card
   ═══════════════════════════════════════════════════ */

.credits-custom-card{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 28px;
    margin-bottom: 24px;
    animation: scaleIn 0.5s ease-out 0.4s both;
}

.credits-custom-header{
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.credits-custom-icon{
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: rgba(10, 88, 165, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #0A58A5;
    flex-shrink: 0;
}

.credits-custom-title{
    font-size: 17px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 4px 0;
    font-family: "Open Sans", sans-serif;
}

.credits-custom-subtitle{
    font-size: 13px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.credits-custom-input-group{
    margin-bottom: 20px;
}

.credits-custom-label{
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #445972;
    margin-bottom: 10px;
    font-family: "Open Sans", sans-serif;
}

.credits-custom-input-row{
    display: flex;
    align-items: center;
    gap: 0;
    max-width: 260px;
}

.credits-custom-step-btn{
    width: 44px;
    height: 44px;
    border: 1px solid #DFE5EC;
    background: #F9FAFB;
    color: #445972;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .15s ease;
    flex-shrink: 0;
}

.credits-custom-step-btn:first-child{
    border-radius: 12px 0 0 12px;
}

.credits-custom-step-btn:last-child{
    border-radius: 0 12px 12px 0;
}

.credits-custom-step-btn:hover{
    background: #EFF6FF;
    color: #0A58A5;
    border-color: #0A58A5;
}

.credits-custom-input{
    width: 100%;
    height: 44px;
    border: 1px solid #DFE5EC;
    border-left: none;
    border-right: none;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    color: #0A58A5;
    font-family: "Open Sans", sans-serif;
    outline: none;
    background: #FFF;
    -moz-appearance: textfield;
}

.credits-custom-input::-webkit-outer-spin-button,
.credits-custom-input::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
}

.credits-custom-input:focus{
    border-color: #0A58A5;
}

.credits-custom-presets{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.credits-custom-preset{
    padding: 6px 16px;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    background: #FFF;
    font-size: 13px;
    font-weight: 600;
    color: #445972;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all .15s ease;
}

.credits-custom-preset:hover{
    background: #EFF6FF;
    border-color: #0A58A5;
    color: #0A58A5;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Payment Summary
   ═══════════════════════════════════════════════════ */

.credits-payment-summary{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 24px;
    animation: fadeUp 0.5s ease-out 0.6s both;
}

.credits-payment-info{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.credits-payment-total{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.credits-payment-label{
    font-size: 13px;
    font-weight: 500;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

.credits-payment-amount{
    font-size: 28px;
    font-weight: 700;
    color: #0A58A5;
    font-family: "Open Sans", sans-serif;
}

.credits-pay-btn{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 32px;
    background: #0A58A5;
    color: #FFF;
    border: none;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all .2s ease;
}

.credits-pay-btn:hover{
    background: #084a8f;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(10, 88, 165, 0.3);
}

.credits-pay-btn i{
    font-size: 13px;
}

.credits-payment-note{
    font-size: 12px;
    font-weight: 400;
    color: #6E7F93;
    margin: 16px 0 0 0;
    font-family: "Open Sans", sans-serif;
    display: flex;
    align-items: center;
    gap: 6px;
}

.credits-payment-note i{
    color: #10B981;
    font-size: 13px;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Referral Section
   ═══════════════════════════════════════════════════ */

.credits-referral{
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.credits-referral-header{
    display: flex;
    align-items: flex-start;
    gap: 20px;
    animation: fadeUp 0.4s ease-out 0.4s both;
}

.credits-referral-icon{
    width: 56px;
    height: 56px;
    background: rgba(10, 88, 165, 0.08);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.credits-referral-icon i{
    font-size: 24px;
    color: #0A58A5;
}

.credits-referral-text{
    flex: 1;
}

.credits-referral-label{
    font-size: 11px;
    font-weight: 700;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans", sans-serif;
    display: block;
    margin-bottom: 6px;
}

.credits-referral-title{
    font-size: 22px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 10px 0;
    font-family: "Open Sans", sans-serif;
}

.credits-referral-description{
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    line-height: 1.6;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

/* Referral Code Card */
.credits-referral-code-card{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 24px;
    animation: scaleIn 0.5s ease-out 0.5s both;
}

.credits-referral-code-label{
    font-size: 11px;
    font-weight: 700;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans", sans-serif;
    display: block;
    margin-bottom: 12px;
}

.credits-referral-code-row{
    display: flex;
    gap: 10px;
    align-items: center;
}

.credits-referral-code-input{
    flex: 1;
    padding: 10px 14px;
    background: #F6F7F8;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.credits-referral-code-input:focus{
    outline: none;
    border-color: #0A58A5;
    background: #FFF;
}

.credits-copy-btn{
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    background: #0A58A5;
    color: #FFF;
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    cursor: pointer;
    transition: all .2s ease;
    white-space: nowrap;
}

.credits-copy-btn:hover{
    background: #084a8f;
}

.credits-copy-btn.copied{
    background: #10B981;
}

.credits-copy-btn i{
    font-size: 13px;
}

.credits-referral-hint{
    font-size: 13px;
    color: #6E7F93;
    margin: 12px 0 0 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

/* Referral Stats */
.credits-referral-stats{
    animation: fadeUp 0.4s ease-out 0.6s both;
}

.credits-referral-stats-title{
    font-size: 12px;
    font-weight: 700;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans", sans-serif;
    margin: 0 0 14px 0;
}

.credits-referral-stats-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.credits-referral-stat-card{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
}

.credits-referral-stat-icon{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(10, 88, 165, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #0A58A5;
}

.credits-referral-stat-icon.earned{
    background: rgba(16, 185, 129, 0.10);
    color: #10B981;
}

.credits-referral-stat-value{
    font-size: 32px;
    font-weight: 700;
    color: #223245;
    font-family: "Open Sans", sans-serif;
}

.credits-referral-stat-value.earned{
    color: #10B981;
}

.credits-referral-stat-label{
    font-size: 13px;
    font-weight: 400;
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Sidebar Badge (kept)
   ═══════════════════════════════════════════════════ */

.sidebar-bottom .credit-badge{
    position: absolute;
    right: 16px;
    background-color: #0A58A5;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    border-radius: 10px;
    min-width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 1;
    border: 2px solid #FFFFFF;
}

.sidebar-bottom .notification-badge{
    position: absolute;
    right: 16px;
    background-color: #DC2626;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    border-radius: 10px;
    min-width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 1;
    border: 2px solid #FFFFFF;
}

/* ═══════════════════════════════════════════════════
   CREDITS — Responsive
   ═══════════════════════════════════════════════════ */

@media (max-width: 900px){
    .credits-hero-content{
        flex-direction: column;
        align-items: flex-start;
    }

    .credits-hero-stats{
        flex-wrap: wrap;
    }

    .credits-tabs{
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .credits-packs-grid{
        grid-template-columns: 1fr;
    }

    .credits-payment-info{
        flex-direction: column;
        align-items: stretch;
    }

    .credits-custom-header{
        flex-direction: column;
        align-items: flex-start;
    }

    .credits-referral-stats-grid{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px){
    .credits-page-layout{
        padding: 20px 16px;
    }

    .credits-hero{
        padding: 20px;
    }

    .credits-hero-value{
        font-size: 32px;
    }

    .credits-hero-stats{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        width: 100%;
    }

    .credits-hero-stat{
        min-width: auto;
        padding: 10px;
    }

    .credits-tab{
        padding: 8px 12px;
        font-size: 13px;
    }

    .credits-filters{
        flex-wrap: wrap;
    }

    .credits-referral-header{
        flex-direction: column;
    }

    .credits-referral-code-row{
        flex-direction: column;
    }

    .credits-copy-btn{
        width: 100%;
        justify-content: center;
    }
}
/* ═══════════════════════════════════════════════════
   NOTIFICATIONS — Layout
   ═══════════════════════════════════════════════════ */

.notifs-content{
    height: 100vh;
}

.notifs-page-header{
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 64px;
    padding: 0 30px;
}

.notifs-page-header-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.notifs-page-header-left{
    display: flex;
    align-items: center;
}

.notifs-page-title{
    display: flex;
    align-items: center;
    gap: 10px;
    color: #223245;
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

.notifs-page-title i{
    color: #0A58A5;
    font-size: 18px;
}

.notifs-page-layout{
    padding: 30px;
    height: calc(100vh - 64px);
    overflow: scroll;
}

/* ═══════════════════════════════════════════════════
   NOTIFICATIONS — Hero
   ═══════════════════════════════════════════════════ */

.notifs-hero{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 20px;
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.notifs-hero-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.notifs-hero-title{
    color: #FFF;
    font-family: "Open Sans", sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    animation: fadeUp 0.4s ease-out 0.2s both;
}

.notifs-hero-description{
    margin-top: 10px;
    color: #DBEAFE;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.notifs-hero-stats{
    display: flex;
    gap: 10px;
}

.notifs-hero-stat{
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(0, 0, 0, 0.10);
    padding: 12px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 90px;
    animation: fadeUp 0.4s ease-out both;
}

.notifs-hero-stat:nth-child(1){ animation-delay: 0.2s; }
.notifs-hero-stat:nth-child(2){ animation-delay: 0.25s; }

.notifs-hero-stat-value{
    color: #FFF;
    font-family: "Open Sans", sans-serif;
    font-size: 22px;
    font-weight: 700;
}

.notifs-hero-stat-label{
    color: #BEDBFF;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* ═══════════════════════════════════════════════════
   NOTIFICATIONS — Controls (Tabs + Action)
   ═══════════════════════════════════════════════════ */

.notifs-controls{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 20px 0;
    animation: fadeUp 0.4s ease-out 0.35s both;
}

.notifs-tabs-wrapper{
    flex: 1;
}

.notifs-tabs{
    display: inline-flex;
    gap: 10px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 5px;
}

.notifs-tab{
    border: none;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    transition: all .2s ease-in-out;
    background: transparent;
    cursor: pointer;
    border-radius: 8px;
    font-family: "Open Sans", sans-serif;
    white-space: nowrap;
}

.notifs-tab:hover{
    color: #223245;
    background: #F8F9FA;
}

.notifs-tab.active{
    background: #0A58A5;
    color: #fff;
}

.notifs-tab i{
    font-size: 13px;
}

.notifs-tab-count{
    font-size: 11px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.10);
}

.notifs-tab.active .notifs-tab-count{
    background: rgba(255, 255, 255, 0.20);
}

/* Mark all button */
.notifs-mark-all-form{
    flex-shrink: 0;
}

.notifs-mark-all-btn{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
    color: #6E7F93;
    cursor: pointer;
    transition: all .2s ease;
    white-space: nowrap;
}

.notifs-mark-all-btn:hover{
    background: #F8F9FA;
    border-color: #0A58A5;
    color: #0A58A5;
}

.notifs-mark-all-btn i{
    font-size: 14px;
}

/* ═══════════════════════════════════════════════════
   NOTIFICATIONS — Card List
   ═══════════════════════════════════════════════════ */

.notifs-list{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.notifs-card{
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    border-radius: 16px;
    transition: all .2s ease;
    position: relative;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    animation: scaleIn 0.4s ease-out both;
}

.notifs-card:nth-child(1){ animation-delay: 0.4s; }
.notifs-card:nth-child(2){ animation-delay: 0.45s; }
.notifs-card:nth-child(3){ animation-delay: 0.5s; }
.notifs-card:nth-child(4){ animation-delay: 0.55s; }
.notifs-card:nth-child(5){ animation-delay: 0.6s; }
.notifs-card:nth-child(6){ animation-delay: 0.65s; }
.notifs-card:nth-child(7){ animation-delay: 0.7s; }
.notifs-card:nth-child(8){ animation-delay: 0.75s; }

.notifs-card:hover{
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-1px);
    text-decoration: none;
    color: inherit;
}

.notifs-card.unread{
    border-color: #0A58A5;
    background: #F8FBFF;
}

/* Icon */
.notifs-card-icon{
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
}

.notifs-icon-success{
    background: #D1FAE5;
    color: #10B981;
}

.notifs-icon-payment{
    background: #DBEAFE;
    color: #0A58A5;
}

.notifs-icon-info{
    background: #F3F4F6;
    color: #6E7F93;
}

.notifs-icon-warning{
    background: #FEF3C7;
    color: #D97706;
}

.notifs-icon-danger{
    background: #FEE2E2;
    color: #DC2626;
}

/* Content */
.notifs-card-content{
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.notifs-card-title{
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

.notifs-card.unread .notifs-card-title{
    color: #0A58A5;
}

.notifs-card-description{
    font-size: 13px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    line-height: 1.5;
    font-family: "Open Sans", sans-serif;
}

.notifs-card-time{
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 400;
    color: #B5C1D0;
    font-family: "Open Sans", sans-serif;
    margin-top: 2px;
}

.notifs-card-time i{
    font-size: 11px;
}

/* Unread dot */
.notifs-unread-dot{
    position: absolute;
    top: 18px;
    right: 18px;
    width: 9px;
    height: 9px;
    background: #0A58A5;
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.15);
}

/* ═══════════════════════════════════════════════════
   NOTIFICATIONS — Empty State
   ═══════════════════════════════════════════════════ */

.notifs-empty-state{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    text-align: center;
    border-radius: 20px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    animation: fadeUp 0.5s ease-out 0.4s both;
}

.notifs-empty-state i{
    font-size: 48px;
    color: #DFE5EC;
    margin-bottom: 16px;
}

.notifs-empty-state h3{
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 8px 0;
    font-family: "Open Sans", sans-serif;
}

.notifs-empty-state p{
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans", sans-serif;
}

/* ═══════════════════════════════════════════════════
   NOTIFICATIONS — Responsive
   ═══════════════════════════════════════════════════ */

@media (max-width: 768px){
    .notifs-content, .credits-content{
        height: calc(100vh - 56px - 77.5px) !important;
    }

    .notifs-page-layout, .credits-page-layout{
        height: calc(100% - 64px);
        padding: 20px;
    }

    .notifs-hero-content{
        flex-direction: column;
        align-items: start;
    }

    .notifs-controls{
        overflow: scroll;
        border-radius: 12px;
    }

    .credits-hero-cta, .credits-pay-btn{
        width: 100%;
        justify-content: center;
    }

    .credits-referral-code-input, .notifs-tabs{
        width: 100%;
    }

    .notifs-tabs{
        justify-content: space-between;
    }
}
.tendances-content{
    height: 100vh;
}

.tendances-page-header{
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    height: 64px;
    padding: 0 30px;
}

.tendances-page-header a{
    color: #0A58A5;
    display: flex;
    align-items: center;
    gap: 10px;
}

.tendances-page-title{
    display: flex;
    align-items: center;
}

.tendances-page-layout{
    padding: 30px;
    height: calc(100vh - 64px);
    overflow: scroll;
}

.tendances-pulse-section{
    display: flex;
    align-items: stretch;
    gap: 26px;
}

.tendances-pulse-section .pulse-marche-panel{
    width: 70%;
    border-radius: 20px;
background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
padding: 20px;
}

.pulse-marche-panel h2{
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 120% */
}

.pulse-marche-description{
    color: #DBEAFE;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 166.667% */
    margin-top: 10px;
}

.pulse-marche-cards{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

.pulse-marche-card{
    width: 50%;
    border-radius: 16px;
border: 1px solid var(--dee, #ffffff13);
background: rgba(0, 0, 0, 0.10);
padding: 12px;
}

.pulse-marche-card-title{
    color: #BEDBFF;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
}

.pulse-marche-card-subtitle{
    color: #FFF;
font-family: "Open Sans";
font-size: 18px;
font-style: normal;
font-weight: 700;
margin-top: 10px;
}

.mots-cles-panel{
    width: 30%;
    border-radius: 20px;
border: 1px solid #DFE5EC;
background: var(--Linear, linear-gradient(144deg, #DFE5EC 11.42%, #FFF 75.57%));
padding: 20px;
}

.mots-cles-header{
    color: var(--Color2, #6E7F93);
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 142.857% */
letter-spacing: 0.35px;
text-transform: uppercase;
display: flex;
align-items: center;
gap: 5px;
}

.mots-cles-tags{
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 5px;
}

.mots-cles-tag{
    border-radius: 14px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: start;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 16px; /* 133.333% */
    padding: 0 8px;
    width: fit-content;
}

.tendances-search-bar{
    margin-top: 13px;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    height: 46px;
    width: 50%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
}

.tendances-search-bar input{
    height: 100%;
    width: 100%;
    border: none;
}

.tendances-list{
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.tendance-card-new{
    border-radius: 15px;
border-right: 1px solid #F3F4F6;
background: #FFF;
padding: 20px;
/* gr1 */
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
display: flex;
gap: 10px;
}

.tendance-card-left{
    padding-right: 10px;
    border-right: 1px solid #DFE5EC;
    width: 65%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.tendance-card-top{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tendance-category-wrapper{
    border-radius: 8px;
background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
padding: 2px 8px;
color: var(--white, #FFF);
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700;
line-height: 15px; /* 150% */
letter-spacing: 0.5px;
text-transform: uppercase;
}

.tendance-growth-indicator{
    border-radius: 7px;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 150% */
    padding: 2px 8px;
}

.tendance-growth-indicator.green{
    border: 1px solid #59B224;
    background: rgba(89, 178, 36, 0.10);
    color: #59B224;
}

.tendance-growth-indicator.red{
    border-radius: 7px;
    border: 1px solid #FC121B;
    background: rgba(252, 18, 27, 0.08);
    color: #FC121B;
}

.tendance-title-new{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 140% */
    margin: 15px 0;
}

.tendance-description-new{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 171.429% */
}

.tendance-opportunities{
    margin-top: 15px;
}

.tendance-opportunities-header{
    color: #223245;
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px; /* 142.857% */
}

.tendance-opportunities-list{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

.tendance-opportunity-btn{
    border-radius: 16px;
border: 1px solid var(--stroke-1, #DFE5EC);
background: #F9FAFB;
padding: 7px 22px;
display: flex;
align-items: center;
gap: 10px;
color: var(--Color0, #445972);
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 20px; /* 166.667% */
}

.tendance-card-right{
    width: 35%;
}

.tendance-exploit-btn{
    border-radius: 10px;
    background: #0A58A5;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
    margin-top: 20px;
}

.tendance-save-btn{
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    margin-top: 8px;
    transition: all 0.25s ease;
    width: 100%;
}

.tendance-save-btn:hover{
    border-color: #0A58A5;
    color: #0A58A5;
    background: rgba(10, 88, 165, 0.04);
}

.tendance-save-btn.saved{
    border-color: #0A58A5;
    color: #0A58A5;
    background: rgba(10, 88, 165, 0.06);
}

.tendance-save-btn.saved:hover{
    border-color: #DC2626;
    color: #DC2626;
    background: rgba(220, 38, 38, 0.04);
}

.tendance-save-btn:disabled{
    opacity: 0.6;
    cursor: not-allowed;
}

.tendances-page-title span{
    color: var(--Color1, #223245);
    text-align: center;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
}

.tendance-graph-header{
    color: var(--Color-3, #B5C1D0);
text-align: center;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
text-transform: uppercase;
}

/* ========== Tendances Page Animations ========== */

.tendances-page-header{
    animation: fadeUp 0.4s ease-out both;
}

.pulse-marche-panel{
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.mots-cles-panel{
    animation: scaleIn 0.5s ease-out 0.2s both;
}

.pulse-marche-card:nth-child(1){ animation: fadeUp 0.4s ease-out 0.25s both; }
.pulse-marche-card:nth-child(2){ animation: fadeUp 0.4s ease-out 0.35s both; }

.mots-cles-tag{
    animation: fadeUp 0.3s ease-out both;
}

.mots-cles-tag:nth-child(1){ animation-delay: 0.3s; }
.mots-cles-tag:nth-child(2){ animation-delay: 0.35s; }
.mots-cles-tag:nth-child(3){ animation-delay: 0.4s; }
.mots-cles-tag:nth-child(4){ animation-delay: 0.45s; }
.mots-cles-tag:nth-child(5){ animation-delay: 0.5s; }
.mots-cles-tag:nth-child(6){ animation-delay: 0.55s; }
.mots-cles-tag:nth-child(7){ animation-delay: 0.6s; }

.tendances-search-bar{
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.tendance-card-new{
    animation: scaleIn 0.5s ease-out both;
}

.tendance-card-new:nth-child(1){ animation-delay: 0.35s; }
.tendance-card-new:nth-child(2){ animation-delay: 0.45s; }
.tendance-card-new:nth-child(3){ animation-delay: 0.55s; }
.tendance-card-new:nth-child(4){ animation-delay: 0.65s; }
.tendance-card-new:nth-child(5){ animation-delay: 0.75s; }
.tendance-card-new:nth-child(6){ animation-delay: 0.85s; }

/* ========== Search Animations ========== */

.tendances-search-bar{
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.tendances-search-bar:focus-within{
    border-color: #0A58A5;
    box-shadow: 0 0 0 3px rgba(10, 88, 165, 0.1);
}

.tendances-search-clear{
    background: none;
    border: none;
    color: #B5C1D0;
    cursor: pointer;
    padding: 4px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s, background 0.2s;
    opacity: 0;
    pointer-events: none;
}

.tendances-search-bar:has(input:not(:placeholder-shown)) .tendances-search-clear{
    opacity: 1;
    pointer-events: auto;
}

.tendances-search-clear:hover{
    color: #445972;
    background: #F3F4F6;
}

.tendances-result-count{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
    margin-top: 10px;
    opacity: 0;
    transform: translateY(-5px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    height: 0;
    overflow: hidden;
}

.tendances-result-count.visible{
    opacity: 1;
    transform: translateY(0);
    height: auto;
}

.tendances-no-results{
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    gap: 12px;
}

.tendances-no-results.visible{
    display: flex;
    animation: fadeUp 0.4s ease-out both;
}

.tendances-no-results i{
    font-size: 40px;
    color: #B5C1D0;
}

.tendances-no-results span{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 500;
}

@keyframes cardHide {
    from {
        opacity: 1;
        transform: scale(1);
    }
    to {
        opacity: 0;
        transform: scale(0.96) translateY(10px);
    }
}

@keyframes cardShow {
    from {
        opacity: 0;
        transform: scale(0.96) translateY(10px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.tendance-card-hiding{
    animation: cardHide 0.25s ease-in both;
}

.tendance-card-hidden{
    display: none !important;
}

.tendance-card-show{
    animation: cardShow 0.35s ease-out both;
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — Mobile & Tablet (max-width: 768px)
   ═══════════════════════════════════════════════════ */

@media (max-width: 768px){
    .tendances-page-header, .tendances-page-layout{
        padding: 0 20px;
    }

    .tendances-page-layout{
        padding-top: 20px;
        height: calc(100% - 64px);
        padding-bottom: 20px;
    }

    .tendances-content{
        height: calc(100vh - 56px - 77.5px);
    }

    .tendances-pulse-section, .pulse-marche-cards, .tendance-card-new{
        flex-direction: column;
    }

    .pulse-marche-panel, .pulse-marche-card, 
    .mots-cles-panel, .tendances-search-bar,
    .tendance-opportunity-btn, .tendance-card-right{
        width: 100% !important;
    }

    .tendance-card-left{
        width: 100% !important;
        border-right: none;
    }

    .tendance-opportunities-list{
        flex-direction: column;
    }
}
.fiches-idees-hero{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 20px;
}

.fiches-idees-hero-badge{
    border-radius: 8px;
background: #EBF3FA;
width: fit-content;

}

.fiches-idees-hero-title{
    color: #FFF;
font-family: "Open Sans";
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: 24px; /* 120% */
}

.fiches-idees-hero-description{
    margin: 10px 0;
    color: #DBEAFE;
font-family: "Open Sans";
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 28px; /* 200% */
}

.fiches-idees-propose-btn{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    height: 44px;
    padding: 12px 33px;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
}

.fiches-idees-search-filters{
    margin: 17px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.fiches-idees-search-bar, .fiches-idees-filter-pills{
    border-radius: 12px;
border: 1px solid var(--stroke-1, #DFE5EC);
background: #FFF;
width: 50%;
height: 44px;
display: flex;
align-items: center;
padding: 0 10Px;
gap: 10px;
}

.fiches-idees-search-bar input{
    height: 100%;
    width: 100%;
    border: none;
    border-radius: 12px;
}

.fiches-idees-tabs-filters{
    display: flex;
    flex-direction: row-reverse;
    gap: 20px;
}

.fiches-idees-tabs{
    display: flex;
    gap: 10px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    height: 44px;
    padding: 5px;
}

.fiches-idees-tabs button{
    border: none;
    padding: 0 15px;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--Color2, #6E7F93);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
    transition: all .2s ease-in-out;
}

.fiches-idees-tabs button.active{
    border-radius: 8px;
    background: #0A58A5;
    color: #fff;
}

.fiches-idees-filter-pills{
    padding: 5px;
}

.fiches-idees-filter-pills button{
    height: 100%;
    color: var(--Color2, #6E7F93);
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
    border: none;
    border-radius: 8px;
    transition: all .2s ease-in-out;
    padding: 0 12px;
}

.fiches-idees-filter-pills button.active{
    color: #0A58A5;
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
    background: #EBF3FA;
}

.fiches-idees-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 20px;
}

.fiche-idee-card{

    /* gr1 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: var(--Linear, linear-gradient(156deg, #DFE5EC 5.53%, #FFF 66.94%));
    padding: 20px;
    /* gr1 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.fiche-idee-card-header .fiche-idee-category-tag{
    border-radius: 8px;
border: 1px solid rgba(0, 0, 0, 0.00);
background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
height: 28px;
padding: 2px 8px;
color: #FFF;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
}

.fiche-idee-card-content{
    margin: 15px 0;
    margin-bottom: 0;
}

.fiche-idee-title{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 160% */
}

.fiche-idee-description{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 157.143% */
}

.fiche-idee-price-tag{
    display: flex;
    width: 121px;
    height: 38px;
    padding: 2px 8px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 30px;
    background: rgba(89, 178, 36, 0.10);
    margin: 15px 0;
    color: #59B224;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px; /* 100% */
}

.fiche-idee-price-tag.premium{
background: rgba(151, 71, 255, 0.10);
color: #9747FF;
}

.fiche-idee-author{
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 20px;
    background-color: #fff;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fiche-idee-author-content{
    display: flex;
    align-items: center;
    gap: 15px;
}

.fiche-idee-avatar{
    border-radius: 16777200px;
    background: var(--Linear, linear-gradient(295deg, #E4D5E1 -79.75%, #908B9F 167.09%));
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.fiche-idee-author-name{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.fiche-idee-author-role{
    color: #99A1AF;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 16px; /* 133.333% */
}

.fiche-idee-rating{
    border-radius: 16777200px;
background: #FEFCE8;
padding: 3.5px 7.148px 4.5px 8px;
color: #D08700;
font-family: "Open Sans";
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 16px; /* 133.333% */
}

.fiche-idee-card-footer{
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fiche-idee-stats{
    display: flex;
    align-items: center;
    gap: 15px;
}

.fiche-idee-stat{
    color: #6A7282;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}

.fiche-idee-details-btn{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.fiches-main{
    display: flex;
    gap: 20px;
}

/* ═══════════════════════════════════════════════════
   SHOW FICHE IDÉE — Redesigned Layout
   ═══════════════════════════════════════════════════ */

.fiche-show-content{
    width: 70%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* --- Hero Banner --- */
.fiche-show-hero{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 28px 28px 24px;
    position: relative;
    overflow: hidden;
}

.fiche-show-hero::before{
    content: '';
    position: absolute;
    top: -40%;
    right: -10%;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.04);
    pointer-events: none;
}

.fiche-show-hero::after{
    content: '';
    position: absolute;
    bottom: -30%;
    left: 20%;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.03);
    pointer-events: none;
}

.fiche-show-hero-inner{
    position: relative;
    z-index: 1;
}

.fiche-show-hero-badge{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(4px);
    padding: 5px 12px;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.fiche-show-hero-badge i{
    font-size: 11px;
    opacity: 0.8;
}

.fiche-show-hero-title{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
    line-height: 32px;
    margin-top: 14px;
}

.fiche-show-hero-description{
    margin-top: 10px;
    color: #DBEAFE;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
}

.fiche-show-hero-meta{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
    flex-wrap: wrap;
}

.fiche-show-meta-chip{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 20px;
    padding: 5px 14px;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.fiche-show-meta-chip.free{
    background: rgba(89, 178, 36, 0.15);
    color: #A3E67A;
}

.fiche-show-meta-chip.premium{
    background: rgba(151, 71, 255, 0.2);
    color: #D4BBFF;
}

.fiche-show-meta-chip.author{
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.85);
}

/* --- Content Sections --- */
.fiche-show-sections{
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fiche-show-section{
    border-radius: 16px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 22px;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.04);
    display: flex;
    gap: 18px;
    align-items: flex-start;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.fiche-show-section:hover{
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.07);
    transform: translateY(-1px);
}

.fiche-show-section-icon-wrap{
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.fiche-show-section-icon-wrap.problem{
    background: #FEF2F2;
    color: #DC2626;
}

.fiche-show-section-icon-wrap.solution{
    background: #F0FDF4;
    color: #16A34A;
}

.fiche-show-section-icon-wrap.market{
    background: #EFF6FF;
    color: #2563EB;
}

.fiche-show-section-icon-wrap.business{
    background: #FFFBEB;
    color: #D97706;
}

.fiche-show-section-icon-wrap.risks{
    background: #FFF7ED;
    color: #EA580C;
}

.fiche-show-section-icon-wrap.roadmap{
    background: #F5F3FF;
    color: #7C3AED;
}

.fiche-show-section-body{
    flex: 1;
    min-width: 0;
}

.fiche-show-section-title{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

.fiche-show-section-text{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    margin-top: 6px;
}

/* --- Duo Cards (Risks + Roadmap) --- */
.fiche-show-duo-cards{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.fiche-show-duo-card{
    border-radius: 16px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 22px;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.fiche-show-duo-card:hover{
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.07);
    transform: translateY(-1px);
}

.fiche-show-duo-card-header{
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.fiche-show-duo-card-header .fiche-show-section-icon-wrap{
    width: 38px;
    height: 38px;
    min-width: 38px;
    font-size: 16px;
}

/* --- Sidebar --- */
.fiche-show-sidebar{
    width: 30%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fiche-show-actions-box{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 20px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.fiche-show-exploit-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    height: 48px;
    background: linear-gradient(135deg, #0A58A5, #083D73);
    box-shadow: 0 4px 12px -2px rgba(10, 88, 165, 0.35);
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    gap: 10px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.fiche-show-exploit-btn:hover{
    transform: translateY(-1px);
    box-shadow: 0 6px 16px -2px rgba(10, 88, 165, 0.4);
}

.fiche-show-exploit-btn:active{
    transform: translateY(0);
}

.fiche-show-exploit-btn.disabled{
    background: #B0C4D8;
    box-shadow: none;
    cursor: not-allowed;
    pointer-events: none;
}

.fiche-show-exploit-hint{
    margin-top: 8px;
    color: #99A1AF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.fiche-show-save-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #6E7F93;
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    margin-top: 12px;
    cursor: pointer;
    background: none;
    transition: all .2s ease;
}

.fiche-show-save-btn:hover{
    color: #0A58A5;
    border-color: #0A58A5;
    background: rgba(10, 88, 165, 0.04);
}

.fiche-show-save-btn.saved{
    color: #0A58A5;
    border-color: #0A58A5;
    background: rgba(10, 88, 165, 0.06);
}

.fiche-show-save-btn.saved:hover{
    color: #DC2626;
    border-color: #DC2626;
    background: rgba(220, 38, 38, 0.04);
}

/* --- Expert Box --- */
.fiche-show-expert-box{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 22px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.fiche-show-expert-top{
    display: flex;
    align-items: center;
    gap: 14px;
}

.fiche-show-expert-avatar{
    width: 52px;
    height: 52px;
    border-radius: 100%;
    background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    flex-shrink: 0;
}

.fiche-show-expert-identity{
    flex: 1;
    min-width: 0;
}

.fiche-show-expert-name-row{
    display: flex;
    align-items: center;
    gap: 8px;
}

.fiche-show-expert-name{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

.fiche-show-expert-verified{
    color: #0A58A5;
    font-size: 14px;
}

.fiche-show-expert-title{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 18px;
    margin-top: 2px;
}

.fiche-show-expert-rating-row{
    display: flex;
    align-items: center;
    gap: 8px;
}

.fiche-show-expert-rating{
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 20px;
    border: 1px solid #FEF9C2;
    background: #FEFCE8;
    padding: 4px 12px;
    color: #A65F00;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.fiche-show-expert-rating i{
    color: #EAB308;
    font-size: 11px;
}

.fiche-show-expert-reviews{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.fiche-show-expert-bio{
    color: #4A5565;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: italic;
    font-weight: 400;
    line-height: 21px;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(10, 88, 165, 0.04);
    border-left: 3px solid rgba(10, 88, 165, 0.15);
}

.fiche-show-expert-contact-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: rgba(10, 88, 165, 0.06);
    height: 42px;
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    width: 100%;
}

.fiche-show-expert-contact-btn:hover{
    background: rgba(10, 88, 165, 0.12);
    border-color: #0A58A5;
}

.fiche-show-expert-contact-btn i{
    font-size: 13px;
}

/* --- Guarantee Box --- */
.fiche-show-guarantee-box{
    border-radius: 16px;
    border: 1px solid #D1E9D5;
    background: linear-gradient(135deg, #F0FDF4 0%, #ECFDF5 100%);
    padding: 18px;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.03);
}

.fiche-show-guarantee-header{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.fiche-show-guarantee-icon{
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 8px;
    background: rgba(22, 163, 74, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #16A34A;
    font-size: 14px;
}

.fiche-show-guarantee-title{
    color: #166534;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
}

.fiche-show-guarantee-text{
    color: #4D7C5A;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 21px;
}

/* Unlock Box (Premium) */
.fiche-idee-unlock-box {
    margin: 20px 0;
    padding: 28px 24px;
    border-radius: 16px;
    border: 1px solid #E0D4F5;
    background: linear-gradient(135deg, #F5F0FF 0%, #EDE5FF 100%);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.fiche-idee-unlock-icon {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #9747FF, #7C3AED);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    box-shadow: 0 4px 12px rgba(151, 71, 255, 0.3);
}

.fiche-idee-unlock-title {
    color: #223245;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
}

.fiche-idee-unlock-description {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    max-width: 380px;
}

.fiche-idee-unlock-btn {
    margin-top: 4px;
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, #9747FF, #7C3AED);
    color: #fff;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    padding: 12px 32px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(151, 71, 255, 0.25);
    transition: opacity 0.2s, transform 0.2s;
}

.fiche-idee-unlock-btn:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

.fiche-idee-unlock-btn:active {
    transform: translateY(0);
}

.fiche-idee-exploit-hint{
    margin-top: 5px;
    color: #99A1AF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px; /* 133.333% */
}
/* ═══════════════════════════════════════════════════
   EXPERTS GRID & CARDS
   ═══════════════════════════════════════════════════ */

.fiches-idees-experts-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 20px;
}

.expert-card{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: var(--Linear, linear-gradient(156deg, #DFE5EC 5.53%, #FFF 66.94%));
    padding: 24px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.expert-card:hover{
    transform: translateY(-2px);
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.08);
}

.expert-card-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.expert-avatar{
    width: 64px;
    height: 64px;
    border-radius: 100%;
    background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
    line-height: 18px;
    flex-shrink: 0;
}

.expert-info{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.expert-name-row{
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
}

.expert-name{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    line-height: 28px;
}

.expert-name-icon{
    color: #0A58A5;
    font-size: 14px;
}

.expert-title{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
}

.expert-quote{
    color: #4A5565;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: italic;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    padding: 12px 16px;
    border-radius: 12px;
    background: rgba(10, 88, 165, 0.04);
    width: 100%;
}

.expert-stats{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    padding-top: 16px;
    border-top: 1px solid #DFE5EC;
}

.expert-stat{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex: 1;
}

.expert-stat-value{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
}

.expert-stat-label{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 500;
    line-height: 16px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.expert-card-footer{
    width: 100%;
}

.expert-profile-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 42px;
    border-radius: 14px;
    background: rgba(10, 88, 165, 0.06);
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    transition: background 0.2s ease;
}

.expert-profile-btn:hover{
    background: rgba(10, 88, 165, 0.12);
}

.fiches-idees-empty{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 60px 20px;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
}

.fiches-idees-empty i{
    font-size: 32px;
    color: #DFE5EC;
}

/* ═══════════════════════════════════════════════════
   CARDS SHOW/HIDE ANIMATION
   ═══════════════════════════════════════════════════ */

.fiche-idee-card, .expert-card{
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.fiche-idee-card-hidden{
    display: none !important;
}

/* ═══════════════════════════════════════════════════
   CATEGORY PILLS (generated dynamically)
   ═══════════════════════════════════════════════════ */

.fiches-idees-category-pills{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.fiche-idee-category-pill{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 6px 16px;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.fiche-idee-category-pill:hover{
    border-color: #0A58A5;
    color: #0A58A5;
}

.fiche-idee-category-pill.active{
    background: rgba(10, 88, 165, 0.06);
    border-color: #0A58A5;
    color: #0A58A5;
    font-weight: 600;
}

/* ═══════════════════════════════════════════════════
   RESULTS BAR & EMPTY STATE
   ═══════════════════════════════════════════════════ */

.fiches-idees-results-bar{
    margin-bottom: 12px;
}

.fiches-idees-results-count{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
}

.fiches-idees-empty-state{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 60px 20px;
    border-radius: 20px;
    border: 1px dashed #DFE5EC;
    background: #FAFBFC;
}

.fiches-idees-empty-state i{
    font-size: 36px;
    color: #DFE5EC;
}

.fiches-idees-empty-state h3{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
}

.fiches-idees-empty-state p{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
}

/* ========== Fiches Idées Page Animations ========== */

.fiches-idees-hero{
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.fiches-idees-hero-title{
    animation: fadeUp 0.4s ease-out 0.2s both;
}

.fiches-idees-hero-description{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.fiches-idees-propose-btn{
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.fiches-idees-search-filters{
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.fiches-idees-results-bar{
    animation: fadeUp 0.3s ease-out 0.35s both;
}

.fiche-idee-card{
    animation: scaleIn 0.5s ease-out both;
}

.fiche-idee-card:nth-child(1){ animation-delay: 0.35s; }
.fiche-idee-card:nth-child(2){ animation-delay: 0.45s; }
.fiche-idee-card:nth-child(3){ animation-delay: 0.55s; }
.fiche-idee-card:nth-child(4){ animation-delay: 0.65s; }
.fiche-idee-card:nth-child(5){ animation-delay: 0.7s; }
.fiche-idee-card:nth-child(6){ animation-delay: 0.75s; }

.expert-card{
    animation: scaleIn 0.5s ease-out both;
}

.expert-card:nth-child(1){ animation-delay: 0.35s; }
.expert-card:nth-child(2){ animation-delay: 0.45s; }
.expert-card:nth-child(3){ animation-delay: 0.55s; }
.expert-card:nth-child(4){ animation-delay: 0.65s; }

/* ========== Show Fiche Idée Animations ========== */

.fiche-show-hero{
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.fiche-show-hero-title{
    animation: fadeUp 0.4s ease-out 0.2s both;
}

.fiche-show-hero-description{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.fiche-show-hero-meta{
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.fiche-show-section{
    animation: fadeUp 0.4s ease-out both;
}

.fiche-show-section:nth-child(1){ animation-delay: 0.2s; }
.fiche-show-section:nth-child(2){ animation-delay: 0.3s; }
.fiche-show-section:nth-child(3){ animation-delay: 0.4s; }
.fiche-show-section:nth-child(4){ animation-delay: 0.5s; }

.fiche-show-duo-cards{
    animation: fadeUp 0.4s ease-out 0.55s both;
}

.fiche-show-actions-box{
    animation: fadeUp 0.4s ease-out 0.15s both;
}

.fiche-show-expert-box{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.fiche-show-guarantee-box{
    animation: fadeUp 0.4s ease-out 0.35s both;
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — Mobile & Tablet (max-width: 768px)
   ═══════════════════════════════════════════════════ */

@media (max-width: 768px) {
    .fiches-idees-search-filters, .fiches-idees-tabs-filters{
        flex-direction: column;
        width: 100%;
    }

    .fiches-idees-search-bar, .fiches-idees-filter-pills{
        width: 100%;
    }

    .fiches-idees-tabs button{
        width: 50%;
        text-align: center;
        justify-content: center;
    }

    .fiches-idees-filter-pills button{
        width: 33%;
    }

    .fiches-idees-grid, .fiches-idees-experts-grid{
        display: flex;
        flex-direction: column;
    }

    .fiches-idees-category-pills{
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .fiche-idee-category-pill{
        white-space: nowrap;
        flex-shrink: 0;
    }

    .fiches-main{
        flex-direction: column;
    }

    .fiche-show-content, .fiche-show-sidebar{
        width: 100%;
    }

    .fiche-show-hero{
        padding: 20px;
    }

    .fiche-show-hero-title{
        font-size: 18px;
        line-height: 26px;
    }

    .fiche-show-section{
        padding: 18px;
    }

    .fiche-show-duo-cards{
        grid-template-columns: 1fr;
    }
}
/* ═══════════════════════════════════════════════════
   CARTOGRAPHIE — Hero
   ═══════════════════════════════════════════════════ */

.carto-hero{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 20px;
}

.carto-hero-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.carto-hero-title{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
}

.carto-hero-description{
    margin-top: 10px;
    color: #DBEAFE;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.carto-hero-stats{
    display: flex;
    gap: 10px;
}

.carto-hero-stat{
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(0, 0, 0, 0.10);
    padding: 12px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 100px;
}

.carto-hero-stat-value{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
}

.carto-hero-stat-label{
    color: #BEDBFF;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* ═══════════════════════════════════════════════════
   CARTOGRAPHIE — Search & Filters
   ═══════════════════════════════════════════════════ */

.carto-search-filters{
    margin: 17px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.carto-search-bar{
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    width: 50%;
    height: 44px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    gap: 10px;
}

.carto-search-bar input{
    height: 100%;
    width: 100%;
    border: none;
    border-radius: 12px;
    font-family: "Open Sans";
    font-size: 14px;
}

.carto-filters{
    display: flex;
    flex-direction: row-reverse;
    gap: 20px;
}

.carto-tabs{
    display: flex;
    gap: 10px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    height: 44px;
    padding: 5px;
}

.carto-tab{
    border: none;
    padding: 0 15px;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    transition: all .2s ease-in-out;
    background: transparent;
    cursor: pointer;
}

.carto-tab.active{
    border-radius: 8px;
    background: #0A58A5;
    color: #fff;
}

.carto-filter-pills{
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    height: 44px;
    display: flex;
    align-items: center;
    padding: 5px;
    gap: 4px;
}

.carto-filter-pill{
    height: 100%;
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    border: none;
    border-radius: 8px;
    background: transparent;
    transition: all .2s ease-in-out;
    padding: 0 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
}

.carto-filter-pill.active{
    color: #0A58A5;
    background: #EBF3FA;
}


/* ═══════════════════════════════════════════════════
   CARTOGRAPHIE — Results & Empty State
   ═══════════════════════════════════════════════════ */

.carto-results-bar{
    margin-bottom: 12px;
}

.carto-results-count{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
}

.carto-empty-state{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 60px 20px;
    border-radius: 20px;
    border: 1px dashed #DFE5EC;
    background: #FAFBFC;
}

.carto-empty-state i{ font-size: 36px; color: #DFE5EC; }
.carto-empty-state h3{ color: #223245; font-family: "Open Sans"; font-size: 16px; font-weight: 700; }
.carto-empty-state p{ color: #6E7F93; font-family: "Open Sans"; font-size: 14px; }

/* ═══════════════════════════════════════════════════
   CARTOGRAPHIE — Cards Grid
   ═══════════════════════════════════════════════════ */

.carto-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 20px;
}

.carto-card{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: var(--Linear, linear-gradient(156deg, #DFE5EC 5.53%, #FFF 66.94%));
    padding: 20px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.carto-card:hover{
    transform: translateY(-2px);
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.08);
}

.carto-card-hidden{
    display: none !important;
}

.carto-card-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.carto-card-tag{
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans";
}

.carto-card-tag.besoin{
    background: #FEE2E2;
    color: #DC2626;
}

.carto-card-tag.ressource{
    background: #DCFCE7;
    color: #008236;
}

.carto-card-tag.infra{
    background: #DBEAFE;
    color: #0A58A5;
}

.carto-card-favorite{
    background: none;
    border: none;
    color: #CED4DA;
    cursor: pointer;
    padding: 6px;
    transition: all .2s ease;
    font-size: 18px;
    border-radius: 8px;
}

.carto-card-favorite:hover{ color: #0A58A5; transform: scale(1.1); }
.carto-card-favorite.saved{ color: #0A58A5; }
.carto-card-favorite:disabled{ opacity: 0.6; cursor: not-allowed; }

.carto-card-content{
    margin-bottom: 15px;
}

.carto-card-title{
    color: var(--Color1, #223245);
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    line-height: 28px;
}

.carto-card-description{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    margin-top: 8px;
}

.carto-card-meta{
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 12px;
}

.carto-card-location, .carto-card-sector{
    display: flex;
    align-items: center;
    gap: 6px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 500;
}

.carto-card-location i, .carto-card-sector i{
    font-size: 12px;
    color: #0A58A5;
}

.carto-card-keywords{
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.carto-card-keyword{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 4px 10px;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 500;
}

.carto-card-footer{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 15px;
    border-top: 1px solid #DFE5EC;
}

.carto-card-impact{
    display: flex;
    align-items: center;
    gap: 6px;
    color: #223245;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
}

.carto-card-impact i{ color: #F59E0B; }

.carto-card-details-btn{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
}

/* ═══════════════════════════════════════════════════
   CARTOGRAPHIE — Map View
   ═══════════════════════════════════════════════════ */

.carto-map-wrapper{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    overflow: hidden;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.carto-map-container{
    position: relative;
    height: 600px;
    width: 100%;
}

#cartographie-map{
    width: 100% !important;
    height: 100% !important;
    z-index: 1;
}

.carto-map-legend{
    position: absolute;
    bottom: 20px;
    left: 20px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    z-index: 1000;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.carto-legend-item{
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 500;
    color: #223245;
    font-family: "Open Sans";
}

.carto-legend-dot{
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.carto-legend-dot.besoin{ background: #DC2626; }
.carto-legend-dot.ressource{ background: #008236; }
.carto-legend-dot.infra{ background: #0A58A5; }

/* Custom Markers */
.custom-marker{ background: transparent !important; border: none !important; width: 32px !important; height: 32px !important; }
.custom-marker-circle{ width: 32px !important; height: 32px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #FFF !important; box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; border: 2px solid #FFF !important; }
.custom-marker-circle i{ font-size: 14px !important; color: #FFF !important; z-index: 1 !important; }

/* ═══════════════════════════════════════════════════
   CARTOGRAPHIE — Detail Panel & Modal
   ═══════════════════════════════════════════════════ */

.carto-modal-overlay{
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1999;
}

.carto-detail-panel{
    position: fixed;
    top: 0;
    right: 0;
    width: 400px;
    height: 100vh;
    background: #FFF;
    border-left: 1px solid #DFE5EC;
    box-shadow: -4px 0 12px rgba(0, 0, 0, 0.1);
    z-index: 2000;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.carto-detail-header{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 24px;
    border-bottom: 1px solid #DFE5EC;
    position: sticky;
    top: 0;
    background: #FFF;
    z-index: 10;
}

.carto-detail-panel-title{
    font-size: 14px;
    font-weight: 700;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 4px 0;
    font-family: "Open Sans";
}

.carto-detail-panel-location{
    font-size: 16px;
    font-weight: 600;
    color: #223245;
    margin: 0;
    font-family: "Open Sans";
}

.carto-detail-close{
    background: none;
    border: none;
    color: #6E7F93;
    cursor: pointer;
    padding: 8px;
    border-radius: 6px;
    transition: all 0.2s ease;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.carto-detail-close:hover{ background: #F8F9FA; color: #223245; }

.carto-detail-content{
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.carto-detail-title{
    font-size: 22px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans";
    line-height: 1.3;
}

.carto-detail-description{
    font-size: 15px;
    color: #6E7F93;
    margin: 0;
    line-height: 1.6;
    font-family: "Open Sans";
}

.carto-detail-info{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.carto-detail-info-title{
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 8px 0;
    font-family: "Open Sans";
}

.carto-detail-info-item{
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-family: "Open Sans";
}

.carto-detail-info-label{ color: #6E7F93; font-weight: 500; }
.carto-detail-info-value{ color: #223245; font-weight: 600; }

.carto-detail-keywords-section{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.carto-detail-keywords-section h4{
    font-size: 14px;
    font-weight: 700;
    color: #223245;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
    font-family: "Open Sans";
}

.carto-detail-keywords{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.carto-detail-keyword{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 500;
    color: #223245;
    font-family: "Open Sans";
}

.carto-detail-actions{
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-top: 8px;
}

.carto-detail-action-btn, a.carto-detail-action-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 20px;
    border-radius: 14px;
    font-size: 14px;
    font-weight: 700;
    font-family: "Open Sans";
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
    text-decoration: none;
}

.carto-detail-action-btn.primary{ background: #0A58A5; color: #FFF; }
a.carto-detail-action-btn.primary:hover{ background: #084a8f; color: #FFF; }
.carto-detail-action-btn.secondary{ background: #FFF; color: #223245; border: 1px solid #DFE5EC; }
.carto-detail-action-btn.secondary:hover{ background: #F8F9FA; }

/* ═══════════════════════════════════════════════════
   CARTOGRAPHIE — Page Animations
   ═══════════════════════════════════════════════════ */

.carto-hero{
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.carto-hero-title{
    animation: fadeUp 0.4s ease-out 0.2s both;
}

.carto-hero-description{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.carto-hero-stat{
    animation: fadeUp 0.4s ease-out both;
}

.carto-hero-stat:nth-child(1){ animation-delay: 0.2s; }
.carto-hero-stat:nth-child(2){ animation-delay: 0.25s; }
.carto-hero-stat:nth-child(3){ animation-delay: 0.3s; }

.carto-search-filters{
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.carto-results-bar{
    animation: fadeUp 0.4s ease-out 0.35s both;
}

.carto-map-wrapper{
    animation: scaleIn 0.5s ease-out 0.4s both;
}

.carto-card{
    animation: scaleIn 0.5s ease-out both;
}

.carto-card:nth-child(1){ animation-delay: 0.4s; }
.carto-card:nth-child(2){ animation-delay: 0.5s; }
.carto-card:nth-child(3){ animation-delay: 0.6s; }
.carto-card:nth-child(4){ animation-delay: 0.65s; }
.carto-card:nth-child(5){ animation-delay: 0.7s; }
.carto-card:nth-child(6){ animation-delay: 0.75s; }

.carto-empty-state{
    animation: fadeUp 0.5s ease-out 0.4s both;
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — Mobile & Tablet
   ═══════════════════════════════════════════════════ */

@media (max-width: 768px) {
    .carto-hero-content{
        flex-direction: column;
        align-items: flex-start;
    }

    .carto-hero-stats{
        width: 100%;
    }

    .carto-hero-stat{
        flex: 1;
        min-width: 0;
        padding: 10px 12px;
    }

    .carto-search-filters{
        flex-direction: column;
    }

    .carto-search-bar{
        width: 100%;
    }

    .carto-filters{
        flex-direction: column;
        width: 100%;
    }

    .carto-tabs{
        width: 100%;
    }

    .carto-tab{
        flex: 1;
        justify-content: center;
    }

    .carto-filter-pills{
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .carto-filter-pill{
        white-space: nowrap;
        flex-shrink: 0;
    }

    .carto-grid{
        grid-template-columns: repeat(auto-fill, minmax(376px, 1fr));
    }

    .carto-detail-panel{
        width: 100%;
    }

    .carto-map-container{
        height: 400px;
    }
}
/* ═══════════════════════════════════════════════════
   FAVORIS — Hero
   ═══════════════════════════════════════════════════ */

.favoris-hero{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 20px;
}

.favoris-hero-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.favoris-hero-title{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
}

.favoris-hero-description{
    margin-top: 10px;
    color: #DBEAFE;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.favoris-hero-stats{
    display: flex;
    gap: 10px;
}

.favoris-hero-stat{
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(0, 0, 0, 0.10);
    padding: 12px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 90px;
}

.favoris-hero-stat-value{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
}

.favoris-hero-stat-label{
    color: #BEDBFF;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* ═══════════════════════════════════════════════════
   FAVORIS — Tabs
   ═══════════════════════════════════════════════════ */

.favoris-tabs-wrapper{
    margin: 17px 0;
}

.favoris-tabs{
    display: flex;
    gap: 10px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 5px;
}

.favoris-tab{
    border: none;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    transition: all .2s ease-in-out;
    background: transparent;
    cursor: pointer;
    border-radius: 8px;
    font-family: "Open Sans";
    white-space: nowrap;
}

.favoris-tab:hover{
    color: #223245;
    background: #F8F9FA;
}

.favoris-tab.active{
    background: #0A58A5;
    color: #fff;
}

.favoris-tab i{
    font-size: 13px;
}

.favoris-tab-count{
    font-size: 11px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.10);
}

.favoris-tab.active .favoris-tab-count{
    background: rgba(255, 255, 255, 0.20);
}

/* ═══════════════════════════════════════════════════
   FAVORIS — Grid
   ═══════════════════════════════════════════════════ */

.favoris-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
}

/* ═══════════════════════════════════════════════════
   FAVORIS — Card
   ═══════════════════════════════════════════════════ */

.favoris-card{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    padding: 20px;
    display: flex;
    flex-direction: column;
    transition: all .25s ease-in-out;
    cursor: default;
}

.favoris-card:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

.favoris-card-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
}

/* Tags */
.favoris-card-tag{
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans";
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.favoris-card-tag.fiche{
    background: #DBEAFE;
    color: #0A58A5;
}

.favoris-card-tag.idee{
    background: #FEF3C7;
    color: #92400E;
}

.favoris-card-tag.recherche{
    background: #DCFCE7;
    color: #008236;
}

.favoris-card-tag.besoin{
    background: #FEE2E2;
    color: #DC2626;
}

.favoris-card-tag.ressource{
    background: #DCFCE7;
    color: #008236;
}

.favoris-card-tag.infra{
    background: #DBEAFE;
    color: #0A58A5;
}

.favoris-card-tag.tendance{
    background: var(--fr, linear-gradient(148deg, #F90 -65.56%, rgba(167, 156, 216, 0.50) 130.83%));
    color: #FFF;
}

.favoris-card-tag i{
    font-size: 10px;
}

/* Bookmark button */
.favoris-card-bookmark{
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px;
    color: #CED4DA;
    font-size: 18px;
    transition: all .2s ease;
    border-radius: 8px;
}

.favoris-card-bookmark:hover{ color: #0A58A5; transform: scale(1.1); }
.favoris-card-bookmark.saved{ color: #0A58A5; }
.favoris-card-bookmark:disabled{ opacity: 0.6; cursor: not-allowed; }

/* Content */
.favoris-card-content{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.favoris-card-title{
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans";
    line-height: 1.3;
}

.favoris-card-description{
    font-size: 13px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    line-height: 1.6;
    font-family: "Open Sans";
}

/* Meta */
.favoris-card-meta{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 4px;
}

.favoris-card-meta-item{
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #6E7F93;
    font-family: "Open Sans";
}

.favoris-card-meta-item i{
    font-size: 11px;
    color: #0A58A5;
}

/* Keywords */
.favoris-card-keywords{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.favoris-card-keyword{
    font-size: 11px;
    font-weight: 600;
    color: #0A58A5;
    background: rgba(10, 88, 165, 0.06);
    padding: 3px 8px;
    border-radius: 6px;
    font-family: "Open Sans";
}

/* TRL */
.favoris-trl{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 4px;
}

.favoris-trl-bar{
    display: flex;
    gap: 4px;
}

.favoris-trl-dot{
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #DFE5EC;
    transition: all .2s ease;
}

.favoris-trl-dot.filled{
    background: #008236;
}

.favoris-trl-label{
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    font-family: "Open Sans";
}

/* Footer */
.favoris-card-footer{
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.favoris-card-details-btn{
    color: #0A58A5;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans";
    text-decoration: none;
    transition: all .2s ease;
}

.favoris-card-details-btn:hover{
    color: #084a8f;
}

/* ═══════════════════════════════════════════════════
   FAVORIS — Empty State
   ═══════════════════════════════════════════════════ */

.favoris-empty-state{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    text-align: center;
    border-radius: 20px;
    background: #FFF;
    border: 1px solid #DFE5EC;
}

.favoris-empty-state i{
    font-size: 48px;
    color: #DFE5EC;
    margin-bottom: 16px;
}

.favoris-empty-state h3{
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 8px 0;
    font-family: "Open Sans";
}

.favoris-empty-state p{
    font-size: 14px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    font-family: "Open Sans";
}

/* ========== Favoris Page Animations ========== */

.favoris-hero{
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.favoris-hero-title{
    animation: fadeUp 0.4s ease-out 0.2s both;
}

.favoris-hero-description{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.favoris-hero-stat{
    animation: fadeUp 0.4s ease-out both;
}

.favoris-hero-stat:nth-child(1){ animation-delay: 0.2s; }
.favoris-hero-stat:nth-child(2){ animation-delay: 0.25s; }
.favoris-hero-stat:nth-child(3){ animation-delay: 0.3s; }
.favoris-hero-stat:nth-child(4){ animation-delay: 0.35s; }
.favoris-hero-stat:nth-child(5){ animation-delay: 0.4s; }

.favoris-tabs-wrapper{
    animation: fadeUp 0.4s ease-out 0.35s both;
}

.favoris-card{
    animation: scaleIn 0.5s ease-out both;
}

.favoris-card:nth-child(1){ animation-delay: 0.4s; }
.favoris-card:nth-child(2){ animation-delay: 0.5s; }
.favoris-card:nth-child(3){ animation-delay: 0.6s; }
.favoris-card:nth-child(4){ animation-delay: 0.65s; }
.favoris-card:nth-child(5){ animation-delay: 0.7s; }
.favoris-card:nth-child(6){ animation-delay: 0.75s; }

.favoris-empty-state{
    animation: fadeUp 0.5s ease-out 0.4s both;
}

/* ═══════════════════════════════════════════════════
   FAVORIS — Responsive
   ═══════════════════════════════════════════════════ */

@media (max-width: 900px) {
    .favoris-hero-content{
        flex-direction: column;
        align-items: flex-start;
    }

    .favoris-hero-stats{
        flex-wrap: wrap;
    }

    .favoris-tabs{
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .favoris-grid{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .favoris-hero-stats{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        width: 100%;
    }

    .favoris-hero-stat{
        min-width: auto;
    }

    .favoris-tab{
        padding: 8px 12px;
        font-size: 13px;
    }
}
/* ═══════════════════════════════════════════════════
   R&D RECHERCHES — Hero
   ═══════════════════════════════════════════════════ */

.rd-hero{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.10), 0 4px 6px -4px rgba(0, 0, 0, 0.10);
    padding: 20px;
}

.rd-hero-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.rd-hero-badge{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px 12px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.10);
    color: #BEDBFF;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans";
    margin-bottom: 10px;
}

.rd-hero-badge i{ font-size: 12px; }

.rd-hero-title{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
}

.rd-hero-description{
    margin-top: 10px;
    color: #DBEAFE;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.rd-hero-stats{
    display: flex;
    gap: 10px;
}

.rd-hero-stat{
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(0, 0, 0, 0.10);
    padding: 12px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 100px;
}

.rd-hero-stat-value{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
}

.rd-hero-stat-label{
    color: #BEDBFF;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Search inside hero */
.rd-hero-search{
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.rd-hero-search-bar{
    flex: 1;
    border-radius: 12px;
    background: #FFF;
    height: 44px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    gap: 10px;
}

.rd-hero-search-bar i{ color: #6E7F93; font-size: 15px; }

.rd-hero-search-bar input{
    height: 100%;
    width: 100%;
    border: none;
    border-radius: 12px;
    font-family: "Open Sans";
    font-size: 14px;
    color: #223245;
}

.rd-hero-search-btn{
    padding: 0 24px;
    height: 44px;
    background: #FFF;
    border: none;
    border-radius: 12px;
    color: #0A58A5;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans";
    cursor: pointer;
    transition: all .2s ease;
    white-space: nowrap;
}

.rd-hero-search-btn:hover{
    background: #F0F4F8;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.3);
}

/* ═══════════════════════════════════════════════════
   R&D RECHERCHES — Filters
   ═══════════════════════════════════════════════════ */

.rd-filters{
    margin: 17px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.rd-filter-pills{
    display: flex;
    gap: 10px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 5px;
}

.rd-filter-pill{
    border: none;
    padding: 8px 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    transition: all .2s ease-in-out;
    background: transparent;
    cursor: pointer;
    border-radius: 8px;
    font-family: "Open Sans";
    white-space: nowrap;
}

.rd-filter-pill:hover{ color: #223245; background: #F8F9FA; }

.rd-filter-pill.active{
    background: #0A58A5;
    color: #fff;
}

.rd-results-count{
    color: #6E7F93;
    font-size: 13px;
    font-family: "Open Sans";
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════
   R&D RECHERCHES — Grid & Cards
   ═══════════════════════════════════════════════════ */

.rd-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 20px;
}

.rd-card{
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: all .25s ease-in-out;
    cursor: pointer;
}

.rd-card:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

.rd-card-hidden{ display: none !important; }

.rd-card-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.rd-card-tags{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.rd-card-tag{
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans";
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.rd-card-tag.category{ color: #FFF; }

.rd-card-tag.local{
    background: #DCFCE7;
    color: #008236;
}

.rd-card-tag.international{
    background: #EDE9FE;
    color: #6366F1;
}

.rd-card-tag i{ font-size: 10px; }

/* Bookmark */
.rd-card-bookmark{
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px;
    color: #CED4DA;
    font-size: 18px;
    transition: all .2s ease;
    border-radius: 8px;
}

.rd-card-bookmark:hover{ color: #0A58A5; transform: scale(1.1); }
.rd-card-bookmark.saved{ color: #0A58A5; }
.rd-card-bookmark:disabled{ opacity: 0.6; cursor: not-allowed; }

/* Content */
.rd-card-content{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rd-card-title{
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0;
    font-family: "Open Sans";
    line-height: 1.3;
}

.rd-card-description{
    font-size: 13px;
    font-weight: 400;
    color: #6E7F93;
    margin: 0;
    line-height: 1.6;
    font-family: "Open Sans";
}

.rd-card-meta{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.rd-card-meta-item{
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #6E7F93;
    font-family: "Open Sans";
}

.rd-card-meta-item i{
    font-size: 11px;
    color: #0A58A5;
}

/* Business potential block */
.rd-card-business{
    background: rgba(139, 92, 246, 0.06);
    border: 1px solid rgba(139, 92, 246, 0.12);
    border-radius: 12px;
    padding: 12px;
}

.rd-card-business-label{
    font-size: 10px;
    font-weight: 700;
    color: #8B5CF6;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: "Open Sans";
}

.rd-card-business-text{
    font-size: 13px;
    color: #223245;
    margin: 6px 0 0 0;
    line-height: 1.5;
    font-family: "Open Sans";
}

/* TRL */
.rd-card-trl{
    display: flex;
    align-items: center;
    gap: 10px;
}

.rd-card-trl-bar{
    display: flex;
    gap: 4px;
}

.rd-card-trl-dot{
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #DFE5EC;
    transition: all .2s ease;
}

.rd-card-trl-dot.filled{ background: #008236; }

.rd-card-trl-label{
    font-size: 12px;
    font-weight: 600;
    color: #6E7F93;
    font-family: "Open Sans";
}

/* Footer */
.rd-card-footer{
    padding-top: 14px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.rd-card-analyze-btn{
    width: 100%;
    padding: 10px;
    background: #0A58A5;
    border: none;
    border-radius: 10px;
    color: #FFF;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans";
    cursor: pointer;
    transition: all .2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.rd-card-analyze-btn:hover{
    background: #084a8f;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(10, 88, 165, 0.3);
}

/* ═══════════════════════════════════════════════════
   R&D RECHERCHES — Empty State
   ═══════════════════════════════════════════════════ */

.rd-empty-state{
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    text-align: center;
    border-radius: 20px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
}

.rd-empty-state i{ font-size: 48px; color: #DFE5EC; margin-bottom: 16px; }
.rd-empty-state h3{ font-size: 16px; font-weight: 700; color: #223245; margin: 0 0 8px 0; font-family: "Open Sans"; }
.rd-empty-state p{ font-size: 14px; color: #6E7F93; margin: 0; font-family: "Open Sans"; }

/* ═══════════════════════════════════════════════════
   R&D RECHERCHES — Detail Panel
   ═══════════════════════════════════════════════════ */

.rd-detail-panel{
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 9999;
    display: none;
}

.rd-detail-overlay{
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.5);
}

.rd-detail-content{
    position: absolute;
    top: 0; right: 0; bottom: 0;
    width: 600px;
    max-width: 90vw;
    background: #FFF;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.rd-detail-header{
    padding: 16px 20px;
    border-bottom: 1px solid #DFE5EC;
    display: flex;
    justify-content: flex-end;
    position: sticky;
    top: 0;
    background: #FFF;
    z-index: 10;
}

.rd-detail-close{
    width: 36px; height: 36px;
    border-radius: 8px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    color: #6E7F93;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease;
    font-size: 16px;
}

.rd-detail-close:hover{ background: #F8F9FA; color: #223245; }

.rd-detail-body{ padding: 24px; flex: 1; }

.rd-recherche-detail-category{ display: flex; gap: 10px; margin-bottom: 16px; }

.rd-detail-title{
    font-size: 22px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 12px 0;
    font-family: "Open Sans";
    line-height: 1.3;
}

.rd-detail-description{
    font-size: 14px;
    color: #6E7F93;
    margin: 0 0 24px 0;
    line-height: 1.7;
    font-family: "Open Sans";
}

.rd-detail-section{
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #F0F0F8;
}

.rd-detail-section:last-child{ border-bottom: none; padding-bottom: 0; }

.rd-detail-section-title{
    font-size: 16px;
    font-weight: 700;
    color: #223245;
    margin: 0 0 12px 0;
    font-family: "Open Sans";
}

.rd-detail-source{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}

.rd-detail-source i{ font-size: 18px; color: #6E7F93; margin-top: 2px; }

.rd-detail-source-info{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rd-detail-source-info span{ font-size: 14px; color: #223245; font-family: "Open Sans"; }
.rd-detail-date{ font-size: 13px; color: #6E7F93; }

.rd-detail-pdf-btn{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    border-radius: 8px;
    color: #223245;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans";
    cursor: pointer;
    transition: all .2s ease;
}

.rd-detail-pdf-btn:hover{ background: #F8F9FA; }
.rd-detail-pdf-btn i{ color: #DC2626; font-size: 14px; }

/* Detail tabs */
.rd-detail-tabs{
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
    border-bottom: 2px solid #F0F0F8;
}

.rd-detail-tab{
    padding: 10px 16px;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    font-family: "Open Sans";
    cursor: pointer;
    transition: all .2s ease;
    margin-bottom: -2px;
}

.rd-detail-tab:hover{ color: #223245; }
.rd-detail-tab.active{ color: #0A58A5; border-bottom-color: #0A58A5; }

.rd-detail-tab-content{ display: flex; flex-direction: column; gap: 20px; }

/* Business idea box */
.rd-detail-business-idea{
    background: #FFF7ED;
    border: 1px solid #FED7AA;
    border-radius: 12px;
    padding: 16px;
}

.rd-detail-business-idea-header{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.rd-detail-business-idea-header i{ font-size: 18px; color: #F59E0B; }
.rd-detail-business-idea-header span{ font-size: 13px; font-weight: 700; color: #92400E; text-transform: uppercase; letter-spacing: 0.5px; font-family: "Open Sans"; }
.rd-detail-business-idea p{ font-size: 14px; color: #223245; margin: 0; line-height: 1.6; font-family: "Open Sans"; }

.rd-detail-label{
    font-size: 11px;
    font-weight: 700;
    color: #6E7F93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 6px 0;
    font-family: "Open Sans";
}

.rd-detail-problem-row{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.rd-detail-block{ display: flex; flex-direction: column; }
.rd-detail-block p{ font-size: 14px; color: #223245; margin: 0; line-height: 1.6; font-family: "Open Sans"; }

/* Launch */
.rd-detail-launch{
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #DFE5EC;
}

.rd-detail-launch-btn{
    width: 100%;
    padding: 14px 20px;
    background: #0A58A5;
    border: none;
    border-radius: 12px;
    color: #FFF;
    font-size: 15px;
    font-weight: 700;
    font-family: "Open Sans";
    cursor: pointer;
    transition: all .2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.rd-detail-launch-btn:hover{
    background: #084a8f;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(10, 88, 165, 0.3);
}

.rd-detail-launch-btn i{ font-size: 16px; }

.rd-detail-launch-hint{
    font-size: 12px;
    color: #6E7F93;
    margin: 10px 0 0 0;
    text-align: center;
    font-family: "Open Sans";
}

/* Info box */
.rd-detail-info-box{
    background: #FFF7ED;
    border: 1px solid #FED7AA;
    border-radius: 12px;
    padding: 14px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.rd-detail-info-box i{ font-size: 18px; color: #F59E0B; margin-top: 2px; flex-shrink: 0; }
.rd-detail-info-box p{ font-size: 13px; color: #223245; margin: 0; line-height: 1.6; font-family: "Open Sans"; }

/* Projects */
.rd-detail-projects{ display: flex; flex-direction: column; gap: 12px; }
.rd-detail-projects-list{ display: flex; flex-direction: column; gap: 10px; }

.rd-detail-project-card{
    background: #FFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    padding: 14px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    transition: all .2s ease;
}

.rd-detail-project-card:hover{ border-color: #CED4DA; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); }

.rd-detail-project-icon{
    width: 36px; height: 36px;
    border-radius: 8px;
    background: #E9ECEF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #6E7F93;
    font-size: 16px;
}

.rd-detail-project-info{ flex: 1; }
.rd-detail-project-info h5{ font-size: 14px; font-weight: 700; color: #223245; margin: 0; font-family: "Open Sans"; }
.rd-detail-project-info p{ font-size: 13px; color: #6E7F93; margin: 4px 0 0 0; line-height: 1.5; font-family: "Open Sans"; }

.rd-detail-project-arrow{ color: #6E7F93; font-size: 14px; flex-shrink: 0; margin-top: 2px; }

.rd-detail-other-project{ background: #F8F9FA; border-style: dashed; border-color: #CED4DA; }
.rd-detail-other-project:hover{ background: #F1F3F5; border-color: #ADB5BD; }

/* ========== R&D Page Animations ========== */

.rd-hero{
    animation: scaleIn 0.5s ease-out 0.1s both;
}

.rd-hero-badge{
    animation: fadeUp 0.4s ease-out 0.2s both;
}

.rd-hero-title{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.rd-hero-description{
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.rd-hero-stat{
    animation: fadeUp 0.4s ease-out both;
}

.rd-hero-stat:nth-child(1){ animation-delay: 0.25s; }
.rd-hero-stat:nth-child(2){ animation-delay: 0.3s; }
.rd-hero-stat:nth-child(3){ animation-delay: 0.35s; }

.rd-hero-search{
    animation: fadeUp 0.4s ease-out 0.35s both;
}

.rd-filters{
    animation: fadeUp 0.4s ease-out 0.4s both;
}

.rd-card{
    animation: scaleIn 0.5s ease-out both;
}

.rd-card:nth-child(1){ animation-delay: 0.4s; }
.rd-card:nth-child(2){ animation-delay: 0.5s; }
.rd-card:nth-child(3){ animation-delay: 0.6s; }
.rd-card:nth-child(4){ animation-delay: 0.7s; }
.rd-card:nth-child(5){ animation-delay: 0.75s; }
.rd-card:nth-child(6){ animation-delay: 0.8s; }

/* ═══════════════════════════════════════════════════
   R&D RECHERCHES — Responsive
   ═══════════════════════════════════════════════════ */

@media (max-width: 900px){
    .rd-hero-content{ flex-direction: column; align-items: flex-start; }
    .rd-hero-stats{ flex-wrap: wrap; }
    .rd-hero-search{ flex-direction: column; }
    .rd-filters{ flex-direction: column; align-items: flex-start; gap: 10px; }
    .rd-filter-pills{ overflow-x: auto; -webkit-overflow-scrolling: touch;width: 100%; gap: 5px; }
    .rd-grid{ grid-template-columns: 1fr; }
    .rd-detail-problem-row{ grid-template-columns: 1fr; }
}

@media (max-width: 600px){
    .rd-hero-stats{ display: grid; grid-template-columns: repeat(3, 1fr); }
    .rd-hero-stat{ min-width: auto; padding: 10px; }
    .rd-filter-pill{ padding: 6px 12px; font-size: 13px; }
}

@media (max-width: 768px){
    .rd-hero-search-bar input{
        height: 44px;
    }

    .rd-detail-content{
        max-width: 100%;
    }
}
/* ═══════════════════════════════════════════════════
   THEME VARIABLES — Tambali
   Variables de base (thème clair). Le dark mode a été
   retiré de la plateforme ; ces variables restent
   nécessaires à toute l'application.
   ═══════════════════════════════════════════════════ */

:root {
    --Color-Texte: #22364D;
    --Color-2: #0A58A5;
    --Color0: #445972;
    --Color1: #223245;
    --Color2: #6E7F93;
    --stroke-1: #DFE5EC;
    --Blanc: #FFF;
}

/* Logos : seule la variante claire est affichée (la variante
   « dark » est rendue en double dans certains templates). */
.logo-dark {
    display: none;
}
/* Profile Completion Popup */
.profile-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 16px;
}

.profile-popup {
  background: #fff;
  border-radius: 16px;
  padding: 32px 28px;
  max-width: 420px;
  width: 100%;
  position: relative;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
  animation: popupSlideIn 0.3s ease;
}

@keyframes popupSlideIn {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.profile-popup__close {
  position: absolute;
  top: 12px;
  right: 12px;
  background: none;
  border: none;
  font-size: 18px;
  color: #9E9E9E;
  cursor: pointer;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, color 0.2s;
}

.profile-popup__close:hover {
  background: #F5F5F5;
  color: #616161;
}

.profile-popup__icon {
  width: 56px;
  height: 56px;
  background: linear-gradient(135deg, #E3F2FD, #BBDEFB);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  font-size: 24px;
  color: #0A58A5;
}

.profile-popup__title {
  font-size: 20px;
  font-weight: 700;
  color: #223245;
  margin-bottom: 8px;
}

.profile-popup__description {
  font-size: 14px;
  color: #6E7F93;
  margin-bottom: 20px;
  line-height: 1.5;
}

.profile-popup__progress {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.profile-popup__progress-bar {
  flex: 1;
  height: 10px;
  background: #F0F0F0;
  border-radius: 5px;
  overflow: hidden;
}

.profile-popup__progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #0A58A5, #1E88E5);
  border-radius: 5px;
  transition: width 0.3s ease;
}

.profile-popup__progress-text {
  font-size: 13px;
  font-weight: 700;
  color: #0A58A5;
  white-space: nowrap;
}

.profile-popup__steps {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.profile-popup__steps li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #795548;
}

.profile-popup__steps li.completed {
  color: #2E7D32;
}

.profile-popup__steps li.completed i {
  color: #2E7D32;
}

.profile-popup__steps li i {
  font-size: 14px;
  color: #BDBDBD;
  width: 16px;
  text-align: center;
}

.profile-popup__actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.profile-popup__cta {
  display: block;
  background: linear-gradient(135deg, #0A58A5, #1565C0);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  padding: 12px 24px;
  border-radius: 10px;
  text-decoration: none;
  text-align: center;
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 4px 12px rgba(10, 88, 165, 0.3);
}

.profile-popup__cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(10, 88, 165, 0.4);
}

.profile-popup__later {
  background: none;
  border: none;
  color: #9E9E9E;
  font-size: 13px;
  cursor: pointer;
  padding: 8px;
  transition: color 0.2s;
}

.profile-popup__later:hover {
  color: #616161;
}

/* Mobile */
@media (max-width: 640px) {
  .profile-popup {
    padding: 24px 20px;
    margin: 16px;
  }
}
.identity-menu{
    display: flex;
    height: 47px;
    padding: 14px 64px 15px 63px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    display: flex;
    align-items: center;
}

.id-menu-items{
    display: flex;
    align-items: center;
    gap: 70px;
}

.id-menu-item{
    display: flex;
    align-items: center;
    gap: 10px;
}

.id-menu-item span{
    color: var(--Color-3, #B5C1D0);
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
}

.id-menu-item div{
    border-radius: 13px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    display: flex;
    width: 18px;
    height: 18px;
    align-items: center;
    justify-content: center;
    color: var(--Color-3, #B5C1D0);
    text-align: center;
    font-family: "Open Sans";
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 142.857% */
}

.id-content{
    padding: 30px;
    height: calc(100vh - 206px);
    overflow: scroll;
}

.id-menu-item.active div{
    background-color: #0A58A5;
    color: #fff;
}

.id-menu-item.active span{
    color: #0A58A5;
    font-weight: 700
}

.id-brief{
    border-radius: 15px;
    border: 1px solid #E6F2FE;
    background: rgba(10, 88, 165, 0.06);
    padding: 15px 24px 15px 20px;
    display: flex;
    align-items: start;
    gap: 15px;
}

.id-brief h3{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 128.571% */
}

.id-brief p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 166.667% */
    margin-top: 5px;
}

.id-intros{
    display: flex;
    flex-direction: column;
    gap: 23px;
    margin-top: 30px;
}

.id-intro{
    border-radius:15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
}

.id-intro-title{
    border-radius: 15px 15px 0 0;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.id-title-left{
    display: flex;
    align-items: center;
    gap: 15px;
}

.id-title-left span{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 137.5% */
}

.id-title-left p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 19px; /* 146.154% */
}

.id-intro-title{
    cursor: pointer;
}

.id-intro-title img.id-drop-icon{
    transition: transform 0.3s ease;
}

.id-intro.closed .id-intro-title img.id-drop-icon{
    transform: rotate(-90deg);
}

.id-intro.closed .id-intro-content{
    display: none;
}

.id-intro-content{
    padding: 30px;
}

.id-intro-content .form-group{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.id-intro-content .form-group label{
    color: var(--Color1, #1A1A2E);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.id-intro-content .form-group input,
.id-intro-content .form-group textarea{
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 12px 16px;
    color: var(--Color1, #1A1A2E);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    outline: none;
    transition: border-color 0.2s ease;
}

.id-intro-content .form-group input:focus,
.id-intro-content .form-group textarea:focus{
    border-color: var(--Color-2, #0A58A5);
}

.id-intro-content .form-group textarea{
    min-height: 100px;
    resize: vertical;
}

.id-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.id-field-hint {
    color: var(--Color-3, #B5C1D0);
    font-weight: 400;
    font-size: 12px;
}

.id-sector-tags{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.id-sector-tag{
    border-radius: 9999px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 9px 16.828px 9.5px 17.5px;
    color: var(--Color2, #6E7F93);
    text-align: center;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: 19.5px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.id-sector-tag:hover{
    border-color: var(--Color-2, #0A58A5);
    color: var(--Color-2, #0A58A5);
}

.id-sector-tag.selected{
    border-radius: 9999px;
    border: 1px solid var(--Color-2, #0A58A5);
    background: rgba(10, 88, 165, 0.06);
    padding: 9px 16.969px 9.5px 17.5px;
    color: var(--Color-2, #0A58A5);
    font-weight: 500;
}

.id-label-row{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.id-selection-count{
    color: var(--Color-3, #B5C1D0);
    font-family: "Open Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px;
}

.id-color-palette{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 12px;
}

.id-color-swatch{
    width: 35px;
    height: 35px;
    border-radius: 6px;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
}

.id-color-swatch:hover{
    transform: scale(1.1);
}

.id-color-swatch.selected::after{
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
}

.id-selected-colors{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.id-selected-color{
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 10px;
border: 1px solid #E2E8F0;
background: #F8FAFC;
padding: 8px;
}

.id-selected-color-swatch{
    width: 16px;
    height: 16px;
    border-radius: 4px;
}

.id-selected-color-code{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 500;
}

.id-selected-color-remove{
    background: none;
    border: none;
    cursor: pointer;
    color: var(--Color-3, #B5C1D0);
    font-size: 14px;
    padding: 0;
    line-height: 1;
    transition: color 0.2s ease;
}

.id-selected-color-remove:hover{
    color: #E63946;
}

.id-derived-palettes{
    margin-top: 12px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.id-derived-palette{
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    padding: 16px;
}

.id-derived-palette:first-child{
    grid-column: 1 / -1;
    border: none;
    padding: 0;
}

.id-derived-palette.selected{
    border-radius: 15px;
    border: 1px solid var(--Color-2, #0A58A5);
    background: rgba(10, 88, 165, 0.06);
}

.id-derived-palette.selected .id-palette-label{
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    line-height: 19.5px;
}

.id-palette-label{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 500;
}

.id-palette-colors{
    display: flex;
    gap: 8px;
    border-radius: 15px;
    background: linear-gradient(0deg, #F6F7F8 0%, #F6F7F8 100%), #FFF;
    padding: 16px;
}

.id-proposal .id-palette-colors{
    background: none;
    padding: 0;
    border-radius: 0;
}

.id-logo-styles{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 12px;
}

.id-logo-style{
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.id-logo-style:hover{
    border-color: var(--Color-2, #0A58A5);
}

.id-logo-style.selected{
    border: 1px solid var(--Color-2, #0A58A5);
    background: rgba(10, 88, 165, 0.06);
}

.id-logo-style-text h4{
    color: var(--Color1, #1A1A2E);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 4px 0;
}

.id-logo-style-text p{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    margin: 0;
}

.id-logo-style-icon-left{
    width: 40px;
    height: 40px;
    flex-shrink: 0;
}

.id-logo-style-icon-left img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.id-logo-style-text{
    flex: 1;
}

.id-logo-style-icon{
    width: 40px;
    height: 40px;
    flex-shrink: 0;
}

.id-upload-zone{
    border-radius: 16px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #F6F7F8;
    padding: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    position: relative;
}

.id-upload-icon{
    width: 40px;
    height: 40px;
}

.id-upload-text{
    color: var(--Color1, #1A1A2E);
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 500;
    margin: 0;
}

.id-upload-browse{
    color: var(--Color-2, #0A58A5);
    font-weight: 600;
    cursor: pointer;
}

.id-upload-hint{
    color: var(--Color-3, #B5C1D0);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    margin: 0;
}

.id-upload-input{
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.id-upload-examples{
    color: var(--Color2, #6E7F93);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    font-style: italic;
    margin-top: 8px;
}

.id-astuce{
    border-radius: 12px;
    border: 1px solid #FFE8C0;
    background: #FFF9EF;
    padding: 16px;
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    margin-top: 12px;
}

.id-astuce-label{
    color: var(--Color0, #445972);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

.id-palette-color{
    width: 54px;
    height: 26px;
    border-radius: 5px;
}

.id-proposal .id-palette-color{
    width: 55px;
    height: 26px;
    border-radius: 5px;
}

.id-container{
    overflow: scroll;
}

.id-footer{
    height: 80px;
    border-top: 1px solid #DFE5EC;
    background: #FFF;
    box-shadow: 0 -2px 8px 0 rgba(0, 0, 0, 0.04);
    position: absolute;
    left: 350px;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
}

.id-footer button{
    border-radius: 12px;
    background: #0A58A5;
    padding: 12.75px 32px;
    border: none;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: 22.5px; /* 150% */
    opacity: .5;
    cursor: not-allowed;
}

/* Logo Gallery */
.id-logo-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 30px;
}

.id-logo-card{
    border-radius: 16px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.id-logo-card-footer{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    border-top: 1px solid #DFE5EC;
    gap: 8px;
}

.id-logo-card-footer .id-logo-card-label{
    color: #445972;
    font-size: 12px;
    font-weight: 600;
}

.id-logo-svg-btn{
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 6px;
    border: 1px solid #DFE5EC;
    background: #F6F7F8;
    color: #0A58A5;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s ease;
    flex-shrink: 0;
    font-family: inherit;
}

.id-logo-svg-btn:hover{
    background: rgba(10, 88, 165, 0.08);
    border-color: #0A58A5;
}

.id-logo-card:hover{
    border-color: var(--Color-2, #0A58A5);
    box-shadow: 0 4px 16px rgba(10, 88, 165, 0.12);
    transform: translateY(-2px);
}

.id-logo-card.selected{
    border-color: var(--Color-2, #0A58A5);
    background: rgba(10, 88, 165, 0.03);
}

.id-logo-card-image{
    width: 176.346px;
    height: 126.002px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
}

.id-logo-card-image img{
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.id-logo-card-info{
    padding: 12px 16px;
    border-top: 1px solid var(--stroke-1, #DFE5EC);
}

.id-logo-concept {
    padding: 12px 14px 10px;
    border-top: 1px solid #F0F3F7;
    background: #FAFBFC;
}

.id-logo-concept-name {
    display: block;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 5px;
}

.id-logo-concept-text {
    color: #5A6B7B;
    font-family: "Open Sans";
    font-size: 12px;
    font-style: italic;
    line-height: 1.55;
    margin: 0;
}

.id-logo-card.selected .id-logo-concept {
    background: rgba(10, 88, 165, 0.04);
}

.id-logo-card-label{
    color: var(--Color1, #1A1A2E);
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
}

.id-logos-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.id-logos-header-left h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
}

.id-logos-header-left p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin: 4px 0 0 0;
}

.id-btn-regenerate{
    border-radius: 10px;
    border: 1px solid var(--Color-2, #0A58A5);
    background: #FFF;
    padding: 10px 24px;
    color: #0A58A5;
    text-align: center;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 19.5px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.id-btn-regenerate:hover{
    background: rgba(10, 88, 165, 0.06);
}

.id-btn-validate{
    border-radius: 12px;
    background: #0A58A5;
    border: none;
    padding: 12px 32px;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 15px;
    font-weight: 600;
    line-height: 22.5px;
    cursor: pointer !important;
    opacity: 1 !important;
    transition: all 0.2s ease;
}

.id-btn-validate:hover{
    background: #084a8a;
}

.id-selected-logo-info{
    border-radius: 15px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: rgba(10, 88, 165, 0.06);
    padding: 18px 43px 19px 25px;
    margin: 24px 0;
    margin-bottom: 0;
}

.id-selected-logo-info h4{
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 22.5px;
    margin: 0 0 6px 0;
}

.id-selected-logo-info p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    margin: 0;
}

.id-btn-regenerate{
    border: 1px solid #084a8a !important;
    background: transparent !important;
    color: #084a8a !important;
    cursor: pointer !important;
    opacity: 1 !important;
}

/* === Charte Graphique === */

.charte-header{
    margin-bottom: 30px;
}

.charte-header h2{
    color: #223245;
    font-family: "Open Sans";
    font-size: 22px;
    font-weight: 700;
    line-height: 30px;
    margin: 0 0 6px 0;
}

.charte-header p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin: 0;
}

.charte-section{
    border-radius: 15px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 24px;
    margin-bottom: 24px;
}

.charte-section h3{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    margin: 0 0 20px 0;
}

.charte-logo-display{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.charte-logo-main{
    border-radius: 12px;
    border: 1px solid #DFE5EC;
    background: #F6F7F8;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.charte-logo-main img{
    max-width: 240px;
    max-height: 180px;
    object-fit: contain;
}

.charte-logo-versions{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.charte-logo-version{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.charte-logo-version span{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 500;
}

.charte-logo-box{
    border-radius: 12px;
    border: 1px solid #DFE5EC;
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.charte-logo-box img{
    max-width: 80px;
    max-height: 60px;
    object-fit: contain;
}

.charte-logo-box-gray{
    background: #F0F0F0;
}

/* Colors */
.charte-colors{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 16px;
}

.charte-color-card{
    border-radius: 12px;
    border: 1px solid #DFE5EC;
    overflow: hidden;
}

.charte-color-swatch{
    height: 80px;
    width: 100%;
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 6px 8px;
}

.charte-color-info{
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.charte-color-name{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
}

.charte-color-hex{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
}

/* Typography */
.charte-typo-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.charte-typo-card{
    border-radius: 16px;
    background: #FFF;
    border: 1px solid #DFE5EC;
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.charte-typo-label{
    display: none;
}

.charte-typo-font{
    color: #223245;
    line-height: 1.2;
}

.charte-typo-sample{
    color: #6E7F93;
    font-size: 16px;
    line-height: 1.4;
}

.charte-typo-usage{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.5px;
}

.charte-typo-detail{
    color: #B5C1D0;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
}

/* Applications visuelles */
.charte-applications-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.charte-application-card{
    border-radius: 16px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    overflow: hidden;
}

.charte-application-preview{
    background: #F0F2F5;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.charte-application-name{
    display: block;
    padding: 14px 16px;
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    line-height: 19.5px;
    text-align: center;
    border-top: 1px solid #DFE5EC;
}

.charte-mock-scene{
    perspective: 800px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Carte de visite */
.charte-mock-bcard{
    width: 220px;
    height: 130px;
    background: #FFF;
    border-radius: 10px;
    padding: 18px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.06);
    transform: rotateY(-5deg) rotateX(3deg);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}

.charte-mock-bcard-logo{
    width: 40px;
    height: 40px;
    border-radius: 6px;
    background: #E5E7EB;
    overflow: hidden;
}

.charte-mock-bcard-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.charte-mock-bcard-info{
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.charte-mock-bcard-name{
    font-size: 10px;
    font-weight: 700;
    color: #1A1A2E;
}

.charte-mock-bcard-role{
    font-family: "Open Sans";
    font-size: 7px;
    color: #6E7F93;
    margin-bottom: 4px;
}

.charte-mock-bcard-contact{
    font-family: "Open Sans";
    font-size: 6px;
    color: #99A1AF;
}

.charte-mock-bcard-stripe{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--charte-primary, #0A58A5);
}

/* Papier en-tete */
.charte-mock-letterhead{
    width: 150px;
    height: 190px;
    background: #FFF;
    border-radius: 4px;
    padding: 14px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.06);
    transform: rotateY(3deg) rotateX(2deg);
    display: flex;
    flex-direction: column;
}

.charte-mock-lh-header{
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 14px;
    padding-bottom: 8px;
    border-bottom: 1.5px solid var(--charte-primary, #0A58A5);
}

.charte-mock-lh-logo{
    width: 22px;
    height: 22px;
    border-radius: 4px;
    background: #E5E7EB;
    flex-shrink: 0;
    overflow: hidden;
}

.charte-mock-lh-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.charte-mock-lh-company{
    font-size: 8px;
    font-weight: 700;
    color: #1A1A2E;
}

.charte-mock-lh-body{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.charte-mock-lh-line{
    height: 3px;
    border-radius: 1.5px;
    background: #E5E7EB;
    width: 100%;
}

.charte-mock-lh-footer{
    margin-top: auto;
    padding-top: 8px;
}

/* Signature email */
.charte-mock-signature{
    width: 230px;
    background: #FFF;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.06);
}

.charte-mock-sig-divider{
    height: 1px;
    background: #E5E7EB;
    margin-bottom: 12px;
}

.charte-mock-sig-content{
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.charte-mock-sig-logo{
    width: 40px;
    height: 40px;
    border-radius: 6px;
    background: #E5E7EB;
    flex-shrink: 0;
    overflow: hidden;
}

.charte-mock-sig-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.charte-mock-sig-separator{
    width: 2px;
    height: 40px;
    background: var(--charte-primary, #0A58A5);
    flex-shrink: 0;
}

.charte-mock-sig-info{
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.charte-mock-sig-name{
    font-size: 9px;
    font-weight: 700;
    color: #1A1A2E;
}

.charte-mock-sig-role{
    font-family: "Open Sans";
    font-size: 7px;
    color: var(--charte-primary, #0A58A5);
    margin-bottom: 3px;
}

.charte-mock-sig-detail{
    font-family: "Open Sans";
    font-size: 6.5px;
    color: #99A1AF;
}

/* Reseaux sociaux */
.charte-mock-social{
    width: 200px;
    background: #FFF;
    border-radius: 10px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.06);
    overflow: hidden;
}

.charte-mock-social-cover{
    height: 50px;
    background: linear-gradient(135deg, var(--charte-primary, #0A58A5), var(--charte-dark, #084a8a));
}

.charte-mock-social-profile{
    padding: 0 14px 14px;
    display: flex;
    align-items: flex-end;
    gap: 8px;
    margin-top: -18px;
}

.charte-mock-social-avatar{
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #E5E7EB;
    border: 2px solid #FFF;
    flex-shrink: 0;
    overflow: hidden;
}

.charte-mock-social-avatar img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.charte-mock-social-info{
    display: flex;
    flex-direction: column;
    padding-bottom: 4px;
}

.charte-mock-social-name{
    font-size: 9px;
    font-weight: 700;
    color: #1A1A2E;
}

.charte-mock-social-handle{
    font-family: "Open Sans";
    font-size: 7px;
    color: #99A1AF;
}

/* Rules */
.charte-rules-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.charte-rule-card{
    border-radius: 12px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 20px;
}

.charte-rule-header{
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.charte-rule-icon{
    font-size: 20px;
    color: #0A58A5;
    flex-shrink: 0;
}

.charte-rule-card h4{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px;
    margin: 0;
}

.charte-rule-card p{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 400;
    line-height: 19px;
    margin: 0;
}

.charte-rule-dont{
    border-color: #FECACA;
    background: #FEF2F2;
}

.charte-rule-dont .charte-rule-icon{
    color: #E63946;
}

.logos-container{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
}

.logos-container .logo-container{
    width: 33%;
    border-radius:15px;
    border: 1px solid #DFE5EC;
}

.logo-container .span{
    border-radius: 0 0 15px 15px;
    border: 1px solid #DFE5EC;
    text-align: center;
    width: 100%;
    background-color: #DFE5EC;
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 19.5px; /* 150% */
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logos-container .logo-container .logo-img{
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logos-container .logo-container .logo-img img{
    width: 200px;
}

/* Charte - Palette de couleurs */
.charte-palette-section{
    margin-bottom: 8px;
}

.charte-palette-label{
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 12px;
    display: block;
}

.charte-colors-row{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.charte-color-card{
    border-radius: 12px;
    border: 1px solid #DFE5EC;
    overflow: hidden;
}

.charte-color-swatch{
    height: 80px;
    width: 100%;
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 6px 8px;
}

.swatch-hex-preview {
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    opacity: 0.75;
}

.charte-color-info{
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.contrast-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}

.contrast-chip {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border-radius: 20px;
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}

.contrast-pass { background: #E8F5E9; color: #2E7D32; border: 1px solid #A5D6A7; }
.contrast-warn { background: #FFF8E1; color: #E65100; border: 1px solid #FFE082; }
.contrast-fail { background: #FFEBEE; color: #C62828; border: 1px solid #EF9A9A; }

.contrast-warning {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 10px;
    background: #FFF3CD;
    border: 1px solid #FFCA28;
    color: #7A5C00;
    font-family: "Open Sans";
    font-size: 13px;
    margin-top: 16px;
    line-height: 1.5;
}

.contrast-warning svg {
    flex-shrink: 0;
    margin-top: 1px;
    color: #F57F17;
}

.charte-color-type{
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.5px;
}

.charte-color-hex{
    color: #6E7F93;
    font-family: Menlo;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}

.charte-color-usage{
    color: #99A1AF;
    font-family: "Open Sans";
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 16.5px;
}

.charte-derived-palette{
    display: flex;
    gap: 8px;
    border-radius: 12px;
    background: #F6F7F8;
    padding: 16px;
}

.charte-derived-color{
    width: 55px;
    height: 32px;
    border-radius: 6px;
}

/* ===== Supports Essentiels ===== */

.support-block{
    border: 1px solid #DFE5EC;
    border-radius: 15px;
    background: #FFF;
    margin-bottom: 20px;
}

.support-block-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #DFE5EC;
}

.support-block-title{
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
}

.support-block-actions{
    display: flex;
    gap: 10px;
}

.support-btn-outline{
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 7px 11px;
    color: #223245;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
}

.support-btn-icon{
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin-right: 6px;
    flex-shrink: 0;
}

.support-btn-outline:hover{
    background: #F5F7FA;
}

.support-btn-primary{
    border-radius: 10px;
    border: none;
    background: #0A58A5;
    padding: 7px 11px;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
}

.support-btn-primary:hover{
    background: #084a8a;
}

.support-export-wrapper{
    position: relative;
}

.support-export-tooltip{
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    width: 280px;
    background: #1A1A2E;
    border-radius: 10px;
    padding: 14px 16px;
    z-index: 10;
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

.support-export-wrapper:hover .support-export-tooltip{
    display: block;
}

.support-export-tooltip::before{
    content: '';
    position: absolute;
    top: -6px;
    right: 20px;
    width: 12px;
    height: 12px;
    background: #1A1A2E;
    transform: rotate(45deg);
    border-radius: 2px;
}

.support-export-tooltip-title{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    display: block;
    margin-bottom: 10px;
}

.support-export-tooltip-item{
    color: #B5C1D0;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    margin-bottom: 6px;
}

.support-export-tooltip-item:last-child{
    margin-bottom: 0;
}

.support-export-tooltip-item strong{
    color: #FFF;
    font-weight: 600;
}

.support-block-body{
    padding: 0;
    border-radius: 0 0 15px 15px;
    border: none;
}

/* Carte de visite - Support */

.support-bcard-layout{
    display: flex;
    gap: 0;
    align-items: stretch;
}

.support-bcard-sidebar{
    width: 25%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    background: #FFF;
    border-right: 1px solid #DFE5EC;
    border-radius: 0;
}

.support-bcard-sidebar-title{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.support-bcard-style{
    padding: 10px 16px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.support-bcard-style:hover{
    border-color: #0A58A5;
    color: #0A58A5;
}

.support-bcard-style.selected{
    border-radius: 8px;
    background: #F6F7F8;
    padding: 15px;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px;
    border: none;
}

.support-bcard-cards{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    padding: 30px 24px;
    background: #F6F7F8;
}

.support-bcard-preview{
    display: flex;
    gap: 40px;
    justify-content: center;
    align-items: flex-start;
}

.support-bcard-side{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.support-bcard-label{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ===== Carte de visite ===== */

.support-bcard{
    width: 371.062px;
    height: 205.649px;
    background: #FFF;
    border-radius: 16px;
    padding: 28px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.04);
    display: flex;
    flex-direction: row;
    align-items: stretch;
    position: relative;
    overflow: hidden;
}

/* Recto - left side */
.support-bcard-left{
    width: 32%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding-right: 24px;
    border-right: 1px solid #E8ECF0;
}

.support-bcard-logo{
    width: 56px;
    height: 56px;
    border-radius: 12px;
    overflow: hidden;
}

.support-bcard-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.support-bcard-left-brand{
    color: var(--charte-primary, #0A58A5);
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

/* Recto - right side */
.support-bcard-right{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-left: 24px;
}

.support-bcard-identity{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.support-bcard-name{
    color: var(--charte-primary, #0A58A5);
    font-size: 20px;
    font-weight: 700;
}

.support-bcard-role{
    color: var(--charte-primary, #0A58A5);
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 500;
    opacity: 0.6;
}

.support-bcard-contacts{
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.support-bcard-contact-row{
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--charte-primary, #0A58A5);
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 500;
}

.support-bcard-contact-row svg{
    color: var(--charte-primary, #0A58A5);
    flex-shrink: 0;
}

/* Bottom stripe */
.support-bcard-stripe{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 10px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 0 0 16px 16px;
}

/* ===== Verso ===== */
.support-bcard-verso{
    background: #FFF;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 28px;
}

.support-bcard-verso-logo{
    width: 72px;
    height: 72px;
    border-radius: 14px;
    overflow: hidden;
}

.support-bcard-verso-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.support-bcard-verso-brand{
    color: var(--charte-primary, #0A58A5);
    font-size: 20px;
    font-weight: 700;
}

/* Variants wrapper */
.support-bcard-variant{
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    width: 100%;
}

/* ===== CORPORATE ===== */
.corp-recto, .corp-verso{
    background: #1E1E2E;
    padding: 0;
    flex-direction: column;
}

.corp-accent-bottom{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--charte-primary, #0A58A5), var(--charte-secondary, #0A58A5), var(--charte-accent, #F9BD21));
    border-radius: 0 0 16px 16px;
}

.corp-accent-left{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 6px;
    height: 100%;
    background: var(--charte-primary, #0A58A5);
    border-radius: 16px 0 0 16px;
}

.corp-accent-top{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, var(--charte-primary, #0A58A5), var(--charte-secondary, #0A58A5), var(--charte-accent, #F9BD21));
    border-radius: 16px 16px 0 0;
}

.corp-gradient-bar{
    position: absolute;
    top: 0;
    right: 0;
    width: 140px;
    height: 6px;
    border-radius: 0 16px 0 16px;
    background: linear-gradient(90deg, var(--charte-primary, #0A58A5), var(--charte-secondary, #0A58A5), var(--charte-accent, #F9BD21));
}

/* Recto corporate */
.corp-recto-content{
    padding: 22px 22px 22px 20px;
    display: flex;
    flex-direction: row;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;
}

.corp-header{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.corp-brand-name{
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
}

.corp-brand-tagline{
    color: var(--charte-primary, #0A58A5);
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 2.5px;
    text-transform: uppercase;
}

.corp-logo-row{
    position: absolute;
    left: 28px;
    top: 50%;
    transform: translateY(-50%);
}

.corp-logo{
    width: 48px;
    height: 100%;
    border-radius: 10px;
    overflow: hidden;
    align-self: flex-start;
}

.corp-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.85;
}

.corp-person{
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.corp-person-name{
    color: #FFF;
    font-size: 14px;
    font-weight: 700;
}

.corp-person-role{
    color: #8B8B9E;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 400;
}

/* Verso corporate */
.corp-verso-content{
    padding: 22px 22px 22px 28px;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-between;
    height: 100%;
}

.corp-contacts{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 12px;
    margin-top: 10px;
}

.corp-contact-row{
    display: flex;
    align-items: center;
    gap: 12px;
    color: #E0E0E0;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 400;
}

.corp-contact-row svg{
    color: var(--charte-primary, #0A58A5);
    flex-shrink: 0;
}

.corp-verso-right{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.corp-verso-logo-watermark{
    width: 90px;
    height: 90px;
    border-radius: 10px;
    opacity: 0.25;
    overflow: hidden;
}

.corp-verso-logo-watermark img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

/* ===== MINIMAL ===== */

.mini-verso{
    background: #FFF;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px;
}

.mini-verso-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex: 1;
    justify-content: center;
}

.mini-verso-logo{
    width: 80px;
    height: 80px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 6px;
}

.mini-verso-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.mini-verso-brand{
    color: #223245;
    font-size: 18px;
    font-weight: 700;
}

.mini-verso-tagline{
    color: var(--charte-primary, #0A58A5);
    font-family: "Open Sans";
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 2.5px;
    text-transform: uppercase;
}

.mini-verso-bar{
    width: 40px;
    height: 4px;
    border-radius: 2px;
    background: var(--charte-primary, #0A58A5);
    margin: 0 auto;
}

/* Recto minimal */
.mini-recto{
    background: #FFF;
    flex-direction: column;
    padding: 28px;
}

.mini-recto-content{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.mini-recto-top{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.mini-person-name{
    color: #223245;
    font-size: 18px;
    font-weight: 700;
}

.mini-person-role{
    color: var(--charte-primary, #0A58A5);
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 500;
}

.mini-recto-bottom{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.mini-contacts{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.mini-contacts span{
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 400;
}

.mini-recto-logo{
    width: 36px;
    height: 36px;
    border-radius: 8px;
    overflow: hidden;
}

.mini-recto-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.corp-verso-grid-deco{
    opacity: 0.7;
}

/* =============================================
   POST RÉSEAUX SOCIAUX
   ============================================= */

/* Layout */
.support-social-layout{
    display: flex;
    border-radius: 0 0 15px 15px;
    overflow: hidden;
    background: #FFF;
    min-height: 420px;
}

.support-social-sidebar{
    width: 25%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    background: #FFF;
    border-right: 1px solid #DFE5EC;
}

.support-social-style{
    padding: 10px 16px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.support-social-style:hover{
    color: #0A58A5;
}

.support-social-style.selected{
    border-radius: 8px;
    background: #F6F7F8;
    padding: 15px;
    color: #0A58A5;
    font-weight: 700;
}

.support-social-cards{
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: #F6F7F8;
}

.support-social-variant{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* ===== FEED (300x300 carré Instagram) ===== */
.support-social-feed{
    width: 340px;
    height: 340px;
    border-radius: 12px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-color: #e0e0e0;
    box-shadow: 0 2px 16px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.social-feed-overlay{
    display: none;
}

.social-feed-logo-box,
.social-feed-caption-box{
    position: relative;
    z-index: 1;
    width: 270px;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.social-feed-logo-box{
    background: color-mix(in srgb, var(--charte-primary, #0A58A5) 45%, transparent);
    backdrop-filter: blur(6px);
    border-radius: 20px 20px 0 0;
}

.social-feed-caption-box{
    background: var(--charte-primary, #0A58A5);
    border-radius: 0 0 20px 20px;
    height: 70px;
}

.social-feed-logo{
    width: 130px;
    height: 130px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.social-feed-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.social-feed-caption{
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
}

/* ===== STORY (200x356 vertical 9:16) ===== */
.support-social-story{
    width: 253px;
    height: 380px;
    border-radius: 16px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-color: var(--charte-primary, #0A58A5);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 24px;
    position: relative;
    box-shadow: 0 2px 16px rgba(0,0,0,0.08);
}

.social-story-overlay{
    position: absolute;
    inset: 0;
    background: var(--charte-primary, #0A58A5);
    opacity: 0.6;
}

.social-story-header{
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
}

.social-story-avatar{
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    overflow: hidden;
    flex-shrink: 0;
}

.social-story-avatar img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.social-story-header-name{
    color: #FFF;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
}

.social-story-header-sponsored{
    color: rgba(255,255,255,0.7);
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 400;
}

.social-story-logo{
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.social-story-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.social-story-body{
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-align: center;
    padding: 0 20px;
}

.social-story-title{
    color: #FFF;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
}

.social-story-desc{
    color: rgba(255,255,255,0.85);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
}

.social-story-swipe{
    position: absolute;
    bottom: 20px;
    z-index: 1;
    color: #FFF;
    background: var(--charte-primary, #0A58A5);
    padding: 8px 20px 6px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

/* ===== RONDELLE (highlights circulaires) ===== */
.support-social-rondelle-group{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}

.support-social-rondelle-row{
    display: flex;
    align-items: flex-start;
    gap: 32px;
}

.support-social-rondelle-item{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.support-social-rondelle{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

.rondelle-main{
    width: 120px;
    height: 120px;
}

.rondelle-primary{
    background: var(--charte-primary, #0A58A5);
}

.rondelle-secondary{
    background: var(--charte-secondary, #0A58A5);
}

.rondelle-accent{
    background: var(--charte-dark, #1A1A2E);
}

.support-social-rondelle span{
    color: #FFF;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 600;
}

.social-rondelle-logo{
    width: 60px;
    height: 60px;
    overflow: hidden;
}

.social-rondelle-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.support-social-rondelle-label{
    color: #6E7F93;
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
}

/* ===== PROFIL (style Twitter/X) ===== */
.support-social-profil-wrapper{
    width: 520px;
    border-radius: 16px;
    overflow: hidden;
    background: #FFF;
    box-shadow: 0 2px 16px rgba(0,0,0,0.08);
}

.social-profil-banner{
    width: 100%;
    height: 130px;
    background-size: cover;
    background-position: center;
    background-color: var(--charte-primary, #0A58A5);
}

.social-profil-avatar-row{
    padding: 0 16px;
    margin-top: -36px;
}

.social-profil-avatar{
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: var(--charte-primary, #0A58A5);
    border: 4px solid #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.social-profil-logo{
    width: 48px;
    height: 48px;
    overflow: hidden;
}

.social-profil-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.social-profil-info{
    padding: 12px 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.social-profil-name{
    color: #0F1419;
    font-size: 18px;
    font-weight: 700;
}

.social-profil-handle{
    color: #536471;
    font-size: 14px;
    font-weight: 400;
}

.social-profil-bio{
    color: #0F1419;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.4;
    margin-top: 8px;
}

.social-profil-stats{
    display: flex;
    gap: 16px;
    margin-top: 12px;
}

.social-profil-stat{
    color: #536471;
    font-size: 13px;
}

.social-profil-stat strong{
    color: #0F1419;
    font-weight: 700;
}

/* =============================================
   GABAROME / ROLL UP
   ============================================= */

.support-rollup-layout{
    display: flex;
    border-radius: 0 0 15px 15px;
    overflow: hidden;
    background: #FFF;
    min-height: 420px;
}

.support-rollup-sidebar{
    width: 25%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    background: #FFF;
    border-right: 1px solid #DFE5EC;
}

.support-rollup-style{
    padding: 10px 16px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.support-rollup-style:hover{
    color: #0A58A5;
}

.support-rollup-style.selected{
    border-radius: 8px;
    background: #F6F7F8;
    padding: 15px;
    color: #0A58A5;
    font-weight: 700;
}

.support-rollup-cards{
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: #F6F7F8;
}

.support-rollup-variant{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* Roll up commun */
.support-rollup{
    width: 200px;
    height: 480px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0,0,0,0.12);
    display: flex;
    flex-direction: column;
    position: relative;
}

/* ===== CORPORATE ===== */
.rollup-corporate{
    background: #FFF;
}

.rollup-corp-header{
    padding: 24px 20px 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--charte-primary, #0A58A5);
}

.rollup-corp-logo{
    width: 40px;
    height: 40px;
    overflow: hidden;
    flex-shrink: 0;
}

.rollup-corp-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.rollup-corp-brand{
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
}

.rollup-corp-visual{
    height: 180px;
    background-size: cover;
    background-position: center;
    background-color: #ddd;
}

.rollup-corp-content{
    flex: 1;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rollup-corp-tagline{
    color: #0F1419;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

.rollup-corp-services{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.rollup-corp-services span{
    color: var(--charte-primary, #0A58A5);
    font-size: 12px;
    font-weight: 600;
}

.rollup-corp-footer{
    padding: 16px 20px;
    background: var(--charte-primary, #0A58A5);
}

.rollup-corp-contact{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.rollup-corp-contact span{
    color: #FFF;
    font-size: 10px;
    font-weight: 400;
}

/* ===== EVENEMENT / FOIRE ===== */
.rollup-evenement{
    background-size: cover;
    background-position: center;
    background-color: var(--charte-primary, #0A58A5);
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 32px 20px;
}

.rollup-event-overlay{
    position: absolute;
    inset: 0;
    background: var(--charte-primary, #0A58A5);
    opacity: 0.7;
}

.rollup-event-logo{
    width: 60px;
    height: 60px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.rollup-event-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.rollup-event-title{
    color: #FFF;
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    position: relative;
    z-index: 1;
}

.rollup-event-subtitle{
    color: rgba(255,255,255,0.8);
    font-size: 13px;
    font-weight: 500;
    text-align: center;
    position: relative;
    z-index: 1;
}

.rollup-event-date{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    margin-top: 12px;
    position: relative;
    z-index: 1;
}

.rollup-event-date span{
    color: #FFF;
    font-size: 12px;
    font-weight: 600;
}

.rollup-event-brand{
    position: absolute;
    bottom: 24px;
    z-index: 1;
    color: rgba(255,255,255,0.6);
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

/* =============================================
   PACKAGING PRODUIT
   ============================================= */

.support-packaging-layout{
    display: flex;
    border-radius: 0 0 15px 15px;
    overflow: hidden;
    background: #FFF;
    min-height: 420px;
}

.support-packaging-sidebar{
    width: 25%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    background: #FFF;
    border-right: 1px solid #DFE5EC;
}

.support-packaging-style{
    padding: 10px 16px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.support-packaging-style:hover{
    color: #0A58A5;
}

.support-packaging-style.selected{
    border-radius: 8px;
    background: #F6F7F8;
    padding: 15px;
    color: #0A58A5;
    font-weight: 700;
}

.support-packaging-cards{
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: #F6F7F8;
}

.support-packaging-variant{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* ===== SACHET / POCHETTE ===== */
.support-packaging-sachet{
    width: 180px;
    height: 260px;
    border-radius: 4px 4px 12px 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
    display: flex;
    flex-direction: column;
}

.packaging-sachet-top{
    height: 20px;
    background: repeating-linear-gradient(90deg, var(--charte-primary, #0A58A5) 0px, var(--charte-primary, #0A58A5) 6px, transparent 6px, transparent 10px);
}

.packaging-sachet-body{
    flex: 1;
    background: #FFF;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px;
    border: 2px solid var(--charte-primary, #0A58A5);
    border-top: none;
    border-radius: 0 0 12px 12px;
}

.packaging-sachet-logo{
    width: 56px;
    height: 56px;
    overflow: hidden;
}

.packaging-sachet-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.packaging-sachet-brand{
    color: var(--charte-primary, #0A58A5);
    font-size: 16px;
    font-weight: 700;
    text-align: center;
}

.packaging-sachet-desc{
    color: #6E7F93;
    font-size: 11px;
    font-weight: 500;
    text-align: center;
}

.packaging-sachet-weight{
    color: var(--charte-primary, #0A58A5);
    font-size: 13px;
    font-weight: 700;
}

/* ===== BOUTEILLE ===== */
.support-packaging-bouteille{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.packaging-bouteille-cap{
    width: 24px;
    height: 14px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 4px 4px 0 0;
}

.packaging-bouteille-neck{
    width: 20px;
    height: 40px;
    background: linear-gradient(180deg, rgba(255,255,255,0.3), rgba(255,255,255,0.1));
    border-left: 2px solid var(--charte-primary, #0A58A5);
    border-right: 2px solid var(--charte-primary, #0A58A5);
}

.packaging-bouteille-body{
    width: 120px;
    height: 280px;
    background: linear-gradient(180deg, rgba(255,255,255,0.95), rgba(240,240,240,0.95));
    border: 2px solid var(--charte-primary, #0A58A5);
    border-radius: 8px 8px 20px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

.packaging-bouteille-label{
    width: 100px;
    padding: 16px 8px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.packaging-bouteille-logo{
    width: 40px;
    height: 40px;
    overflow: hidden;
}

.packaging-bouteille-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.packaging-bouteille-brand{
    color: #FFF;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

.packaging-bouteille-desc{
    color: rgba(255,255,255,0.8);
    font-size: 10px;
    font-weight: 400;
    text-align: center;
}

.packaging-bouteille-vol{
    color: #FFF;
    font-size: 11px;
    font-weight: 600;
}

/* ===== COFFRET ===== */
.support-packaging-coffret{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.packaging-coffret-lid{
    width: 240px;
    height: 180px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 12px 12px 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

.packaging-coffret-lid-logo{
    width: 60px;
    height: 60px;
    overflow: hidden;
}

.packaging-coffret-lid-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.packaging-coffret-lid-brand{
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
}

.packaging-coffret-side{
    width: 240px;
    height: 40px;
    background: var(--charte-dark, #1A1A2E);
    border-radius: 0 0 4px 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* ===== GAMME ===== */
.support-packaging-gamme{
    display: flex;
    align-items: flex-end;
    gap: 20px;
}

.packaging-gamme-item{
    width: 100px;
    height: 160px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.gamme-primary{
    background: var(--charte-primary, #0A58A5);
    height: 180px;
}

.gamme-secondary{
    background: var(--charte-secondary, #0A58A5);
}

.gamme-accent{
    background: var(--charte-dark, #1A1A2E);
}

.packaging-gamme-logo{
    width: 36px;
    height: 36px;
    overflow: hidden;
}

.packaging-gamme-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.packaging-gamme-name{
    color: #FFF;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}

.packaging-gamme-type{
    color: rgba(255,255,255,0.7);
    font-size: 10px;
    font-weight: 500;
    text-align: center;
}

/* =============================================
   PAPIER EN-TÊTE
   ============================================= */

.support-letterhead-layout{
    display: flex;
    border-radius: 0 0 15px 15px;
    overflow: hidden;
    background: #FFF;
    min-height: 420px;
}

.support-letterhead-sidebar{
    width: 25%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    background: #FFF;
    border-right: 1px solid #DFE5EC;
}

.support-letterhead-style{
    padding: 10px 16px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.support-letterhead-style:hover{
    color: #0A58A5;
}

.support-letterhead-style.selected{
    border-radius: 8px;
    background: #F6F7F8;
    padding: 15px;
    color: #0A58A5;
    font-weight: 700;
}

.support-letterhead-cards{
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: #F6F7F8;
}

.support-letterhead-variant{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* Page commune */
.support-letterhead{
    width: 280px;
    height: 396px;
    background: #FFF;
    border-radius: 4px;
    box-shadow: 0 2px 20px rgba(0,0,0,0.08);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.support-letterhead.lh-moderne{
    background: color-mix(in srgb, var(--charte-primary, #0A58A5) 5%, #FAFAFA);
    box-shadow: 0 6px 24px 0 rgba(0, 0, 0, 0.08);
    position: relative;
}

.lh-moderne-watermark{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 160px;
    height: 160px;
    opacity: 0.04;
    overflow: hidden;
    pointer-events: none;
}

.lh-moderne-watermark img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Lignes de texte simulées */
.lh-text-line{
    height: 6px;
    background: #E8ECF0;
    border-radius: 3px;
    width: 100%;
}

/* ===== CLASSIQUE ===== */
.lh-classique{
    padding: 0;
}

.lh-classique-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
}

.lh-classique-logo{
    width: 40px;
    height: 40px;
    overflow: hidden;
    flex-shrink: 0;
}

.lh-classique-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lh-classique-contacts{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
}

.lh-classique-contacts span{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-classique-line{
    height: 2px;
    background: linear-gradient(90deg, var(--charte-primary, #0A58A5) 0%, var(--charte-secondary, #0A58A5) 50%, var(--charte-dark, #1A1A2E) 100%);
    margin: 0 24px;
}

.lh-classique-meta{
    display: flex;
    justify-content: space-between;
    padding: 10px 24px 0;
}

.lh-classique-meta span{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-classique-sender{
    padding: 8px 24px 0;
}

.lh-classique-sender-name{
    color: #0F1419;
    font-size: 10px;
    font-weight: 700;
}

.lh-classique-sender-role{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
    margin-top: 1px;
}

.lh-classique-objet{
    padding: 10px 24px 0;
    color: #0F1419;
    font-size: 8px;
    font-weight: 400;
    line-height: 1.4;
}

.lh-classique-objet strong{
    font-weight: 700;
}

.lh-classique-body{
    flex: 1;
    padding: 10px 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.lh-classique-footer{
    padding: 10px 24px;
    background: var(--charte-primary, #0A58A5);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.lh-classique-footer span{
    color: #FFF;
    font-size: 8px;
    font-weight: 500;
}

.lh-classique-footer-sep{
    opacity: 0.5;
}

/* ===== CORPORATE ===== */
.lh-corporate{
    background: #FFF;
    padding: 0;
}

.lh-corp-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 5px;
    background: var(--charte-dark, #1A1A2E);
    border-bottom: 4px solid;
    border-image: linear-gradient(90deg, var(--charte-primary, #0A58A5) 0%, var(--charte-secondary, #0A58A5) 100%) 1;
}

.lh-corp-logo{
    width: 40px;
    height: 40px;
    overflow: hidden;
    flex-shrink: 0;
}

.lh-corp-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.lh-corp-header-right{
    display: flex;
    align-items: center;
    gap: 12px;
}

.lh-corp-header-right span{
    color: rgba(255,255,255,0.6);
    font-size: 8px;
    font-weight: 400;
}

.lh-corp-meta{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 15px 24px;
}

.lh-corp-meta-left{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lh-corp-meta-name{
    color: #0F1419;
    font-size: 10px;
    font-weight: 700;
}

.lh-corp-meta-role{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-corp-meta-right{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
}

.lh-corp-meta-right span{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-corp-meta-ref{
    color: var(--charte-primary, #0A58A5) !important;
    font-weight: 600 !important;
}

.lh-corp-separator{
    height: 1px;
    background: #E8ECF0;
    margin: 0 24px;
}

.lh-corp-objet{
    padding: 10px 24px 0;
    color: #0F1419;
    font-size: 8px;
    font-weight: 400;
    line-height: 1.4;
}

.lh-corp-objet strong{
    font-weight: 700;
}

.lh-corp-body{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 24px;
}

.lh-corp-signature{
    padding: 0 24px 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
}

.lh-corp-signature-name{
    color: #0F1419;
    font-size: 9px;
    font-weight: 700;
}

.lh-corp-signature-role{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-corp-footer{
    padding: 10px 24px;
    background: var(--charte-dark, #1A1A2E);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.lh-corp-footer span{
    color: rgba(255,255,255,0.7);
    font-size: 6px;
    font-weight: 400;
}

.lh-text-line-dark{
    background: rgba(255,255,255,0.1);
}

/* ===== MODERNE ===== */
.lh-moderne{
    padding: 0;
    border-left: 4px solid;
    border-image: linear-gradient(180deg, var(--charte-primary, #0A58A5) 0%, var(--charte-secondary, #0A58A5) 100%) 1;
}

.lh-moderne-header{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px 24px;
    padding-bottom: 15px;
}

.lh-moderne-divider{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 24px;
}

.lh-moderne-divider-line{
    flex: 1;
    height: 1px;
    background: color-mix(in srgb, var(--charte-primary, #0A58A5) 10%, transparent);
}

.lh-moderne-divider-dots{
    display: flex;
    align-items: center;
    gap: 4px;
}

.lh-dot-primary{
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--charte-primary, #0A58A5);
}

.lh-dot-secondary{
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--charte-secondary, #0A58A5);
}

.lh-dot-dark{
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--charte-dark, #1A1A2E);
}

.lh-moderne-logo{
    width: 40px;
    height: 40px;
    overflow: hidden;
}

.lh-moderne-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lh-moderne-contacts{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
}

.lh-moderne-contacts span{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-moderne-meta{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 12px 24px 0;
}

.lh-moderne-meta-left{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lh-moderne-meta-name{
    color: #0F1419;
    font-size: 10px;
    font-weight: 700;
}

.lh-moderne-meta-role{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-moderne-meta-right{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
}

.lh-moderne-meta-right span{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-moderne-meta-ref{
    color: var(--charte-primary, #0A58A5) !important;
    font-weight: 600 !important;
}

.lh-moderne-objet{
    padding: 8px 24px 0;
    color: #0F1419;
    font-size: 8px;
    font-weight: 400;
    line-height: 1.4;
}

.lh-moderne-objet strong{
    font-weight: 700;
}

.lh-moderne-body{
    flex: 1;
    padding: 10px 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.lh-moderne-signature{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0 24px 12px;
}

.lh-moderne-signature-left{
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.lh-moderne-signature-name{
    color: #0F1419;
    font-size: 9px;
    font-weight: 700;
}

.lh-moderne-signature-role{
    color: #6E7F93;
    font-size: 8px;
    font-weight: 400;
}

.lh-moderne-signature-logo{
    width: 32px;
    height: 32px;
    opacity: 0.12;
    overflow: hidden;
}

.lh-moderne-signature-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lh-moderne-footer-divider{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 24px;
}

.lh-moderne-footer{
    padding: 10px 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.lh-moderne-footer span{
    color: #6E7F93;
    font-size: 6px;
    font-weight: 400;
}

.lh-moderne-brand{
    color: var(--charte-primary, #0A58A5);
    font-size: 8px;
    font-weight: 700;
    white-space: nowrap;
}

/* =============================================
   ENSEIGNE & SIGNALÉTIQUE
   ============================================= */

.support-sign-layout{
    display: flex;
    border-radius: 0 0 15px 15px;
    overflow: hidden;
    background: #FFF;
    min-height: 420px;
}

.support-sign-sidebar{
    width: 25%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    background: #FFF;
    border-right: 1px solid #DFE5EC;
}

.support-sign-style{
    padding: 10px 16px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.support-sign-style:hover{
    color: #0A58A5;
}

.support-sign-style.selected{
    border-radius: 8px;
    background: #F6F7F8;
    padding: 15px;
    color: #0A58A5;
    font-weight: 700;
}

.support-sign-cards{
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: #F6F7F8;
}

.support-sign-variant{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* ===== ENSEIGNE FAÇADE ===== */
.support-sign-facade{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sign-facade-board{
    width: 340px;
    height: 100px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 8px 8px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.sign-facade-logo{
    width: 48px;
    height: 48px;
    overflow: hidden;
}

.sign-facade-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.sign-facade-text{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sign-facade-brand{
    color: #FFF;
    font-size: 28px;
    font-weight: 700;
}

.sign-facade-details{
    display: flex;
    align-items: center;
    gap: 6px;
}

.sign-facade-details span{
    color: rgba(255,255,255,0.7);
    font-size: 11px;
    font-weight: 400;
}

.sign-facade-wall{
    width: 400px;
    height: 120px;
    background: repeating-linear-gradient(
        90deg,
        #E8E0D6 0px, #E8E0D6 48px,
        #D4CBC0 48px, #D4CBC0 50px
    );
    background-color: #E8E0D6;
    border-radius: 0 0 4px 4px;
}

/* ===== PANNEAU DIRECTIONNEL ===== */
.support-sign-panneau{
    display: flex;
    align-items: flex-start;
    position: relative;
    height: 200px;
}

.sign-panneau-pole{
    width: 8px;
    height: 200px;
    background: #8B8B8B;
    border-radius: 4px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.sign-panneau-arrows{
    display: flex;
    flex-direction: column;
    gap: 8px;
    position: relative;
    z-index: 1;
    padding-top: 16px;
}

.sign-panneau-arrow{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    border-radius: 4px;
    position: relative;
    min-width: 160px;
}

.arrow-primary{ background: var(--charte-primary, #0A58A5); }
.arrow-secondary{ background: var(--charte-secondary, #0A58A5); }
.arrow-dark{ background: var(--charte-dark, #1A1A2E); }

.sign-panneau-arrow span{
    color: #FFF;
    font-size: 13px;
    font-weight: 600;
}

.sign-panneau-arrow-logo{
    width: 20px;
    height: 20px;
    overflow: hidden;
}

.sign-panneau-arrow-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.sign-panneau-arrow-tip{
    position: absolute;
    right: -12px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent;
    border-left: 12px solid var(--charte-primary, #0A58A5);
}

.arrow-secondary .sign-panneau-arrow-tip{
    border-left-color: var(--charte-secondary, #0A58A5);
}

.arrow-dark .sign-panneau-arrow-tip{
    border-left-color: var(--charte-dark, #1A1A2E);
}

.tip-left{
    right: auto;
    left: -12px;
    border-left: none;
    border-right: 12px solid var(--charte-dark, #1A1A2E);
}

/* ===== VITRINE ADHÉSIVE ===== */
.support-sign-vitrine{
    display: flex;
    align-items: center;
    justify-content: center;
}

.sign-vitrine-glass{
    width: 320px;
    height: 220px;
    background: linear-gradient(135deg, rgba(200,220,240,0.3), rgba(180,210,240,0.15));
    border: 2px solid #C8D8E8;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 0 40px rgba(200,220,240,0.2);
}

.sign-vitrine-sticker{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 24px;
}

.sign-vitrine-logo{
    width: 56px;
    height: 56px;
    overflow: hidden;
}

.sign-vitrine-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sign-vitrine-brand{
    color: var(--charte-primary, #0A58A5);
    font-size: 22px;
    font-weight: 700;
}

.sign-vitrine-hours{
    color: #6E7F93;
    font-size: 12px;
    font-weight: 500;
}

.sign-vitrine-phone{
    color: var(--charte-primary, #0A58A5);
    font-size: 13px;
    font-weight: 600;
}

/* ===== HABILLAGE VÉHICULE ===== */
.support-sign-vehicule{
    display: flex;
    align-items: center;
    justify-content: center;
}

.sign-vehicule-body{
    width: 360px;
    height: 140px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 12px 12px 4px 4px;
    position: relative;
    box-shadow: 0 4px 20px rgba(0,0,0,0.12);
}

.sign-vehicule-side{
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px 28px;
    height: 100%;
}

.sign-vehicule-logo{
    width: 56px;
    height: 56px;
    overflow: hidden;
    flex-shrink: 0;
}

.sign-vehicule-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.sign-vehicule-info{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sign-vehicule-brand{
    color: #FFF;
    font-size: 22px;
    font-weight: 700;
}

.sign-vehicule-phone{
    color: rgba(255,255,255,0.8);
    font-size: 13px;
    font-weight: 500;
}

.sign-vehicule-site{
    color: rgba(255,255,255,0.6);
    font-size: 12px;
    font-weight: 400;
}

.sign-vehicule-wheel{
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #333;
    border: 4px solid #555;
    position: absolute;
    bottom: -18px;
}

.wheel-front{ left: 50px; }
.wheel-rear{ right: 50px; }

/* =============================================
   T-SHIRT ET AUTRES
   ============================================= */

.support-apparel-layout{
    display: flex;
    border-radius: 0 0 15px 15px;
    overflow: hidden;
    background: #FFF;
    min-height: 420px;
}

.support-apparel-sidebar{
    width: 25%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    background: #FFF;
    border-right: 1px solid #DFE5EC;
}

.support-apparel-style{
    padding: 10px 16px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: #6E7F93;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.support-apparel-style:hover{
    color: #0A58A5;
}

.support-apparel-style.selected{
    border-radius: 8px;
    background: #F6F7F8;
    padding: 15px;
    color: #0A58A5;
    font-weight: 700;
}

.support-apparel-cards{
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: #F6F7F8;
}

.support-apparel-variant{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* ===== T-SHIRT ===== */
.support-apparel-tshirt{
    display: flex;
    align-items: flex-start;
}

.apparel-tshirt-body{
    width: 180px;
    height: 220px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 0 0 8px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 40px;
    gap: 10px;
    position: relative;
}

.apparel-tshirt-collar{
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 16px;
    border-radius: 0 0 20px 20px;
    background: #F6F7F8;
}

.apparel-tshirt-sleeve{
    width: 50px;
    height: 70px;
    background: var(--charte-primary, #0A58A5);
    margin-top: 0;
}

.apparel-tshirt-sleeve.sleeve-left{
    border-radius: 8px 0 0 16px;
    transform: rotate(0deg) skewY(10deg);
}

.apparel-tshirt-sleeve.sleeve-right{
    border-radius: 0 8px 16px 0;
    transform: rotate(0deg) skewY(-10deg);
}

.apparel-tshirt-logo{
    width: 56px;
    height: 56px;
    overflow: hidden;
}

.apparel-tshirt-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.apparel-tshirt-brand{
    color: #FFF;
    font-size: 14px;
    font-weight: 700;
}

/* ===== POLO ===== */
.support-apparel-polo{
    display: flex;
    align-items: flex-start;
}

.apparel-polo-body{
    width: 180px;
    height: 220px;
    background: #FFF;
    border: 2px solid #E8ECF0;
    border-radius: 0 0 8px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 40px;
    gap: 10px;
    position: relative;
}

.apparel-polo-collar{
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 70px;
    height: 18px;
    border-radius: 0 0 6px 6px;
    background: var(--charte-primary, #0A58A5);
}

.apparel-polo-placket{
    position: absolute;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: 30px;
    background: #E8ECF0;
}

.apparel-polo-sleeve{
    width: 50px;
    height: 60px;
    background: #FFF;
    border: 2px solid #E8ECF0;
}

.apparel-polo-sleeve.sleeve-left{
    border-radius: 8px 0 0 16px;
    border-right: none;
    transform: skewY(10deg);
}

.apparel-polo-sleeve.sleeve-right{
    border-radius: 0 8px 16px 0;
    border-left: none;
    transform: skewY(-10deg);
}

.apparel-polo-logo{
    width: 40px;
    height: 40px;
    overflow: hidden;
    margin-top: 8px;
}

.apparel-polo-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.apparel-polo-brand{
    color: var(--charte-primary, #0A58A5);
    font-size: 12px;
    font-weight: 700;
}

/* ===== SWEAT & HOODIE ===== */
.support-apparel-sweat{
    display: flex;
    align-items: flex-start;
}

.apparel-sweat-body{
    width: 200px;
    height: 240px;
    background: var(--charte-dark, #1A1A2E);
    border-radius: 0 0 8px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 48px;
    gap: 10px;
    position: relative;
}

.apparel-sweat-hood{
    position: absolute;
    top: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 24px;
    border-radius: 12px 12px 0 0;
    background: var(--charte-dark, #1A1A2E);
    border: 2px solid rgba(255,255,255,0.1);
    border-bottom: none;
}

.apparel-sweat-sleeve{
    width: 56px;
    height: 100px;
    background: var(--charte-dark, #1A1A2E);
}

.apparel-sweat-sleeve.sleeve-left{
    border-radius: 8px 0 0 8px;
    transform: skewY(8deg);
}

.apparel-sweat-sleeve.sleeve-right{
    border-radius: 0 8px 8px 0;
    transform: skewY(-8deg);
}

.apparel-sweat-logo{
    width: 56px;
    height: 56px;
    overflow: hidden;
}

.apparel-sweat-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.apparel-sweat-brand{
    color: #FFF;
    font-size: 14px;
    font-weight: 700;
}

.apparel-sweat-pocket{
    width: 70px;
    height: 30px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 0 0 6px 6px;
    border-top: none;
    position: absolute;
    bottom: 30px;
}

/* ===== CASQUETTE ===== */
.support-apparel-casquette{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.apparel-casquette-crown{
    width: 160px;
    height: 100px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 80px 80px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.apparel-casquette-visor{
    width: 200px;
    height: 24px;
    background: var(--charte-dark, #1A1A2E);
    border-radius: 100px 100px 0 0;
    margin-bottom: -2px;
    position: relative;
    z-index: 0;
}

.apparel-casquette-logo{
    width: 48px;
    height: 48px;
    overflow: hidden;
}

.apparel-casquette-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

/* ===== TABLIER ===== */
.support-apparel-tablier{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.apparel-tablier-strap{
    width: 80px;
    height: 20px;
    border: 3px solid var(--charte-primary, #0A58A5);
    border-bottom: none;
    border-radius: 40px 40px 0 0;
}

.apparel-tablier-body{
    width: 160px;
    height: 220px;
    background: var(--charte-primary, #0A58A5);
    border-radius: 0 0 8px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 28px;
    gap: 10px;
    position: relative;
}

.apparel-tablier-logo{
    width: 48px;
    height: 48px;
    overflow: hidden;
}

.apparel-tablier-logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.apparel-tablier-brand{
    color: #FFF;
    font-size: 13px;
    font-weight: 700;
}

.apparel-tablier-pocket{
    width: 100px;
    height: 50px;
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 0 0 8px 8px;
    border-top: none;
    position: absolute;
    bottom: 40px;
}

/* ===== TAGLINE SECTION ===== */

.id-tagline-section {
    padding: 0 40px 32px;
}

.id-tagline-header {
    margin-bottom: 16px;
}

.id-tagline-header h4 {
    color: #223245;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 4px;
}

.id-tagline-header p {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 13px;
    margin: 0;
}

.id-tagline-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

.id-tagline-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    border-radius: 12px;
    border: 2px solid #DFE5EC;
    background: #F6F7F8;
    cursor: pointer;
    transition: border-color 0.18s, background 0.18s;
}

.id-tagline-option:hover {
    border-color: #0A58A5;
    background: #F0F6FF;
}

.id-tagline-option.selected {
    border-color: #0A58A5;
    background: #EAF2FF;
}

.id-tagline-num {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #DFE5EC;
    color: #6E7F93;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.18s, color 0.18s;
}

.id-tagline-option.selected .id-tagline-num {
    background: #0A58A5;
    color: #FFF;
}

.id-tagline-text {
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    font-style: italic;
}

.id-tagline-custom {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.id-tagline-custom label {
    color: #6E7F93;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.id-tagline-custom input {
    border-radius: 10px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    padding: 10px 14px;
    font-family: "Open Sans";
    font-size: 14px;
    color: #223245;
    outline: none;
    transition: border-color 0.2s;
}

.id-tagline-custom input:focus {
    border-color: #0A58A5;
}

/* === Variantes de composition du logo === */
.lv-section { padding: 4px 0 8px; }

.lv-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.lv-card {
    border-radius: 12px;
    border: 1px solid #DFE5EC;
    background: #FFF;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.lv-preview {
    background: #F8F9FA;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px 24px;
    min-height: 110px;
}

.lv-canvas {
    display: block;
    max-width: 100%;
}

.lv-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-top: 1px solid #DFE5EC;
    gap: 8px;
}

.lv-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lv-label {
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    color: #223245;
}

.lv-hint {
    font-family: "Open Sans";
    font-size: 10px;
    color: #9CA3AF;
}

.lv-dl-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    border-radius: 8px;
    border: 1px solid #DFE5EC;
    background: #F8F9FA;
    color: #223245;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
    flex-shrink: 0;
}

.lv-dl-btn:hover {
    background: #EFF2F7;
    border-color: #0A58A5;
    color: #0A58A5;
}

.lv-dl-btn:disabled { opacity: 0.45; cursor: not-allowed; }

/* === Ton éditorial (Brand Voice) === */
.charte-brand-voice {
    padding: 4px 0 8px;
}

.cbv-card {
    border-radius: 14px;
    border: 1px solid #DFE5EC;
    background: #FAFBFC;
    padding: 28px 32px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cbv-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.cbv-tag {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    background: var(--charte-primary, #0A58A5);
    color: #FFFFFF;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.cbv-quote {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.cbv-open-quote {
    font-size: 72px;
    line-height: 0.7;
    color: var(--charte-primary, #0A58A5);
    opacity: 0.18;
    font-family: Georgia, serif;
    flex-shrink: 0;
    user-select: none;
}

.cbv-sentences {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cbv-sentence {
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 400;
    color: #223245;
    line-height: 1.55;
    margin: 0;
}

.cbv-examples {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.cbv-example {
    border-radius: 10px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cbv-example-do {
    background: #F0FDF4;
    border: 1px solid #BBF7D0;
}

.cbv-example-dont {
    background: #FEF2F2;
    border: 1px solid #FECACA;
}

.cbv-example-header {
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.cbv-example-do .cbv-example-header   { color: #16A34A; }
.cbv-example-dont .cbv-example-header { color: #DC2626; }

.cbv-example-text {
    font-family: "Open Sans";
    font-size: 13px;
    font-style: italic;
    color: #374151;
    margin: 0;
    line-height: 1.5;
}

/* === Déclinaisons numériques === */
.charte-digital-icons {
    padding: 4px 0 8px;
}

.cdi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.cdi-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.cdi-preview {
    background: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 100%;
    flex-shrink: 0;
}

.cdi-size-app   { aspect-ratio: 1; }
.cdi-size-pwa   { aspect-ratio: 1; }
.cdi-size-touch { aspect-ratio: 1; }
.cdi-size-favicon {
    aspect-ratio: 1;
    border-radius: 6px;
    image-rendering: pixelated;
}

.cdi-preview-logo {
    max-width: 70%;
    max-height: 70%;
    object-fit: contain;
}

.cdi-preview-placeholder {
    width: 50%;
    height: 50%;
    background: #E5E7EB;
    border-radius: 4px;
}

.cdi-meta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.cdi-label {
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 700;
    color: #223245;
    text-align: center;
}

.cdi-dim {
    font-family: "Open Sans";
    font-size: 11px;
    color: #6E7F93;
}

.cdi-dl-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 8px;
    border: 1px solid #DFE5EC;
    background: #F8F9FA;
    color: #223245;
    font-family: "Open Sans";
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    white-space: nowrap;
}

.cdi-dl-btn:hover {
    background: #EFF2F7;
    border-color: #0A58A5;
    color: #0A58A5;
}

.cdi-dl-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.cdi-note {
    margin-top: 12px;
    font-family: "Open Sans";
    font-size: 11px;
    color: #9CA3AF;
    text-align: center;
}

/* === Zone de protection du logo === */
.charte-protection-zone {
    padding: 4px 0 8px;
}

.charte-protection-zone svg {
    display: block;
    max-width: 100%;
    border-radius: 12px;
    overflow: hidden;
}

/* === Règles DO/DON'T visuelles === */
.crv-section {
    margin-bottom: 4px;
}

.crv-section-header {
    display: flex;
    align-items: center;
    gap: 7px;
    font-family: "Open Sans";
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.7px;
    margin-bottom: 12px;
    padding-bottom: 8px;
}

.crv-do-header {
    color: #16A34A;
    border-bottom: 2px solid #BBF7D0;
}

.crv-dont-header {
    color: #DC2626;
    border-bottom: 2px solid #FECACA;
}

.crv-row {
    display: grid;
    gap: 12px;
}

.crv-do-row   { grid-template-columns: repeat(2, 1fr); }
.crv-dont-row { grid-template-columns: repeat(4, 1fr); }

.crv-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
}

.crv-preview {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid #DFE5EC;
}

.crv-bg-white { background: #FFFFFF; }
.crv-bg-dark  { background: #1A1A2E; border-color: #1A1A2E; }

.crv-logo {
    max-width: 68%;
    max-height: 68%;
    object-fit: contain;
}

.crv-logo-placeholder {
    width: 60%;
    height: 40%;
    background: #E5E7EB;
    border-radius: 4px;
}

.crv-badge {
    position: absolute;
    top: 7px;
    right: 7px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.crv-badge-do   { background: #16A34A; color: #FFFFFF; }
.crv-badge-dont { background: #DC2626; color: #FFFFFF; }

.crv-label {
    font-family: "Open Sans";
    font-size: 10px;
    font-weight: 600;
    color: #6E7F93;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.crv-min-note {
    margin-top: 4px;
    font-family: "Open Sans";
    font-size: 12px;
    color: #6E7F93;
    padding: 10px 14px;
    background: #F8F9FA;
    border-radius: 8px;
    line-height: 1.5;
}

.crv-min-note strong {
    color: #223245;
}

.charte-protection-note {
    margin-top: 12px;
    padding: 12px 16px;
    background: rgba(79, 70, 229, 0.05);
    border-left: 3px solid #4F46E5;
    border-radius: 0 8px 8px 0;
    font-family: "Open Sans";
    font-size: 13px;
    color: #4B5563;
    line-height: 1.6;
}


/* ============================================================
   Identité visuelle — STYLE COSMÉTIQUE UNIQUEMENT.
   Aucune hauteur, aucun overflow, on ne touche jamais .content :
   la page scrolle nativement comme les autres modules.
   ============================================================ */
.iv-header{ padding:22px 30px 6px; }
.iv-header h1{ font-size:20px; font-weight:700; color:#223245; margin:0; }
.iv-wrap{padding:22px 20px 32px; }
.iv-wrap--wide{ max-width:1040px; }
.iv-wrap--wide .iv-head p{ max-width:none; }

.iv-stepper{ width:100%; box-sizing:border-box; padding:22px 26px 0; margin:0 0 6px; }
.iv-regen{ display:inline-flex; align-items:center; gap:6px; margin-top:14px; padding:7px 14px; font-size:13px; font-weight:600; color:#0A58A5; background:#fff; border:1px solid #C9D8E8; border-radius:99px; cursor:pointer; transition:background .15s ease; }
.iv-regen:hover{ background:#F0F6FC; }
.iv-regen svg{ width:14px; height:14px; }
.iv-stepper-meta{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; }
.iv-stepper-count{ font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#0A58A5; }
.iv-stepper-name{ font-size:12.5px; font-weight:600; color:#6E7F93; }
.iv-stepper-track{ display:flex; gap:5px; }
.iv-seg{ flex:1; height:5px; border-radius:99px; background:#DFE5EC; }
.iv-seg-done, .iv-seg-cur{ background:#0A58A5; }

.iv-head{ text-align:center; margin-bottom:26px; }
.iv-head-icon{ width:52px; height:52px; border-radius:15px; background:rgba(10,88,165,0.08); display:inline-flex; align-items:center; justify-content:center; color:#0A58A5; }
.iv-head-icon svg{ width:26px; height:26px; }
.iv-head h2{ font-size:21px; font-weight:700; color:#223245; margin:10px 0 4px; }
.iv-head p{ font-size:14px; line-height:1.55; color:#6E7F93; margin:0 auto; max-width:440px; }

.iv-block{ display:flex; flex-direction:column; gap:16px; margin-bottom:28px; }
.iv-block + .iv-block{ border-top:1px solid #EEF2F6; padding-top:24px; }
.iv-block-title{ font-size:15px; font-weight:700; color:#0A58A5; margin:0; }

.iv-field{ display:flex; flex-direction:column; gap:7px; }
.iv-field > label{ font-size:13px; font-weight:600; color:#445972; }
.iv-input, .iv-textarea, .iv-select{ width:100%; font-family:inherit; font-size:14px; color:#223245; background:#fff; border:1px solid #DFE5EC; border-radius:10px; padding:11px 12px; }
.iv-input:focus, .iv-textarea:focus, .iv-select:focus{ outline:none; border-color:#0A58A5; box-shadow:0 0 0 3px rgba(10,88,165,.15); }
.iv-textarea{ resize:vertical; line-height:1.5; }
.iv-select{ appearance:none; -webkit-appearance:none; padding-right:34px; background-repeat:no-repeat; background-position:right 12px center; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%236E7F93' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }

.iv-radios{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.iv-radio{ cursor:pointer; border:1px solid #DFE5EC; border-radius:12px; background:#fff; padding:14px 12px; text-align:center; display:flex; flex-direction:column; gap:3px; }
.iv-radio input{ display:none; }
.iv-radio-t{ font-size:14px; font-weight:700; color:#223245; }
.iv-radio-d{ font-size:11.5px; color:#6E7F93; }
.iv-radio:hover{ border-color:#0A58A5; }
.iv-radio:has(input:checked){ border-color:#0A58A5; background:rgba(10,88,165,0.06); }

.iv-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.iv-chip{ cursor:pointer; }
.iv-chip input{ display:none; }
.iv-chip span{ display:inline-block; padding:8px 14px; border-radius:99px; border:1px solid #DFE5EC; background:#fff; font-size:13px; color:#445972; }
.iv-chip:hover span{ border-color:#0A58A5; }
.iv-chip input:checked + span{ border-color:#0A58A5; background:rgba(10,88,165,0.08); color:#0A58A5; font-weight:600; }
.iv-chip input:disabled + span{ opacity:.45; cursor:not-allowed; }

.iv-slider-top{ display:flex; align-items:center; justify-content:space-between; }
.iv-slider-bubble{ font-size:12.5px; font-weight:700; color:#0A58A5; }
.iv-slider{ -webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:99px; background:#E4EAF0; outline:none; margin:4px 0; }
.iv-slider::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:20px; height:20px; border-radius:50%; background:#0A58A5; border:3px solid #fff; cursor:pointer; }
.iv-slider::-moz-range-thumb{ width:20px; height:20px; border-radius:50%; background:#0A58A5; border:3px solid #fff; cursor:pointer; }
.iv-slider-ends{ display:flex; justify-content:space-between; margin-top:4px; font-size:11px; color:#93A1B2; }

.iv-navbar{ position:sticky; bottom:0; z-index:5; background:#fff; border-top:1px solid #DFE5EC; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 30px; }
.iv-btn{ font-family:inherit; font-size:14.5px; font-weight:600; padding:12px 26px; border-radius:14px; cursor:pointer; display:inline-flex; align-items:center; gap:10px; border:1px solid transparent; }
.iv-btn svg{ width:16px; height:16px; }
.iv-btn-prev{ background:#fff; border-color:#DFE5EC; color:#6E7F93; }
.iv-btn-next{ background:#0A58A5; color:#fff; }
.iv-btn-next:hover{ background:#084A8A; }
.iv-soon{ text-align:center; color:#6E7F93; font-size:14px; background:rgba(10,88,165,0.06); padding:16px; border-radius:12px; }

.iv-note{ font-size:13px; color:#6E7F93; background:#F6F7F8; border:1px solid #EEF2F6; border-radius:10px; padding:11px 12px; margin:0; }

/* ── Étape 2 : pistes artistiques (cosmétique) ── */
.iv-generate{ margin:8px auto 0; }
.iv-directions{ display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; align-items:stretch; }
.iv-dir{ position:relative; border:1.5px solid #E4EAF0; border-radius:16px; padding:18px; background:#fff; display:flex; flex-direction:column; gap:14px; cursor:pointer; transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.iv-dir:hover{ border-color:#B9CDE4; box-shadow:0 6px 18px rgba(10,88,165,0.08); }
.iv-dir.is-selected{ border-color:#0A58A5; box-shadow:0 0 0 3px rgba(10,88,165,0.12); }
.iv-dir-check{ position:absolute; top:14px; right:14px; width:24px; height:24px; border-radius:50%; background:#0A58A5; color:#fff; display:none; align-items:center; justify-content:center; }
.iv-dir-check svg{ width:15px; height:15px; }
.iv-dir.is-selected .iv-dir-check{ display:flex; }
@media (max-width:900px){ .iv-directions{ grid-template-columns:1fr; } }
.iv-dir-top h3{ font-size:18px; font-weight:700; color:#223245; margin:6px 0 4px; }
.iv-dir-top p{ font-size:13px; color:#6E7F93; line-height:1.5; margin:0; }
.iv-dir-arch{ font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#0A58A5; background:rgba(10,88,165,0.08); padding:3px 10px; border-radius:99px; }
.iv-type{ border-radius:12px; padding:20px 18px; text-align:center; border:1px solid #EEF2F6; }
.iv-type-brand{ font-size:30px; line-height:1.1; font-weight:700; }
.iv-type-base{ font-size:14px; margin-top:6px; }
.iv-type-label{ display:block; margin-top:12px; font-size:11px; color:#93A1B2; }
.iv-swatches{ display:flex; gap:8px; }
.iv-swatch{ flex:1; display:flex; flex-direction:column; align-items:center; gap:5px; }
.iv-sw-box{ width:100%; height:40px; border-radius:8px; border:1px solid rgba(0,0,0,0.06); }
.iv-sw-hex{ font-size:9.5px; font-weight:600; color:#6E7F93; letter-spacing:.02em; }
.iv-dir-kw{ display:flex; flex-wrap:wrap; gap:6px; }
.iv-dir-kw span{ font-size:11.5px; color:#445972; background:#F6F7F8; border-radius:99px; padding:4px 10px; }

/* Loader de génération dans ce module : présence homogène (pistes + symboles) */
.module-page .bp-generation-loader{ width:100%; max-width:100%; margin:24px auto; padding:64px 32px; min-height:360px; box-sizing:border-box; }

/* Étape 4 — Mockups (mise en situation) */
.iv-mockups{ background:#fff; border:1px solid #E4EAF0; border-radius:18px; padding:34px 38px; margin-top:14px; }
.iv-mock-head{ margin-bottom:22px; }
.iv-mock-head h3{ font-size:22px; font-weight:700; color:#223245; margin:4px 0 0; }
.iv-mock-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); gap:18px; }
.iv-mock{ display:flex; flex-direction:column; align-items:center; gap:10px; }
.iv-mock-frame{ position:relative; width:100%; aspect-ratio:4/3; background:#EDF1F6; border:1px solid #E4EAF0; border-radius:14px; overflow:hidden; display:flex; align-items:center; justify-content:center; padding:18px; }
.iv-mock-label{ font-size:12px; font-weight:600; color:#6E7F93; }
.iv-mock-logo-w{ filter:brightness(0) invert(1); }
/* Web */
.iv-mock-web{ padding:14px; }
.iv-mock-web > *{ box-sizing:border-box; }
.iv-mock-web .iv-mock-bar{ position:absolute; top:14px; left:14px; right:14px; height:22px; background:#E4E9EF; border-radius:8px 8px 0 0; display:flex; align-items:center; gap:5px; padding:0 10px; }
.iv-mock-bar i{ width:7px; height:7px; border-radius:50%; background:#C4CDD8; }
.iv-mock-url{ margin-left:10px; font-size:9px; color:#8494A6; background:#fff; border-radius:5px; padding:2px 10px; }
.iv-mock-web-body{ position:absolute; top:36px; left:14px; right:14px; bottom:14px; border-radius:0 0 8px 8px; padding:12px 14px; display:flex; flex-direction:column; }
.iv-mock-web-nav{ display:flex; align-items:center; justify-content:space-between; }
.iv-mock-web-nav img{ height:16px; max-width:66px; object-fit:contain; }
.iv-mock-web-links{ display:flex; gap:6px; }
.iv-mock-web-links em{ display:block; width:16px; height:4px; border-radius:2px; opacity:.5; }
.iv-mock-web-hero{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; text-align:center; }
.iv-mock-web-hero h4{ font-size:16px; font-weight:700; margin:0; line-height:1.2; max-width:80%; }
.iv-mock-btn{ width:60px; height:14px; border-radius:8px; }
/* Instagram */
.iv-mock-ig{ flex-direction:column; gap:8px; text-align:center; color:#fff; }
.iv-mock-ig img{ max-width:44%; max-height:40%; object-fit:contain; margin-bottom:2px; }
.iv-mock-ig-name{ font-size:18px; font-weight:700; }
.iv-mock-ig-tag{ font-size:10px; opacity:.85; }
/* Cartes de visite */
.iv-mock-cards{ perspective:none; }
.iv-mock-card{ position:absolute; width:60%; aspect-ratio:1.7/1; border-radius:8px; box-shadow:0 8px 20px rgba(20,40,70,.16); display:flex; align-items:center; justify-content:center; }
.iv-mock-card-a{ transform:translate(-18%, -14%) rotate(-7deg); z-index:2; }
.iv-mock-card-a img{ max-width:56%; max-height:52%; object-fit:contain; }
.iv-mock-card-b{ transform:translate(20%, 18%) rotate(5deg); flex-direction:column; gap:5px; padding:14px; }
.iv-mock-card-name{ font-size:13px; font-weight:700; }
.iv-mock-card-line{ width:52px; height:3px; border-radius:2px; opacity:.5; }
.iv-mock-card-line.short{ width:34px; }
/* T-shirt & tote */
.iv-mock-apparel svg{ width:100%; height:100%; }
.iv-mock-apparel-logo{ position:absolute; top:47%; left:50%; transform:translate(-50%,-50%); width:22%; }
.iv-mock-tote-logo{ position:absolute; top:56%; left:50%; transform:translate(-50%,-50%); width:34%; filter:brightness(0) invert(1); }
@media (max-width:760px){ .iv-mockups{ padding:26px 22px; } }

/* Étape 4 — Charte graphique (document) */
.iv-charte{ display:flex; flex-direction:column; gap:14px; margin-top:8px; }
.iv-charte section{ background:#fff; border:1px solid #E4EAF0; border-radius:18px; padding:34px 38px; }
.iv-ch-cover{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; padding:64px 38px; border:none; }
.iv-ch-cover-logo img{ max-width:170px; max-height:110px; object-fit:contain; }
.iv-ch-cover-name{ font-size:38px; font-weight:700; line-height:1.1; }
.iv-ch-cover-tag{ font-size:15px; opacity:.85; }
.iv-ch-cover-label{ margin-top:10px; font-size:11px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.55); }
.iv-ch-sec{ position:relative; }
.iv-ch-num{ font-size:13px; font-weight:800; letter-spacing:.1em; color:#B9C6D6; }
.iv-ch-sec h3{ font-size:22px; font-weight:700; color:#223245; margin:4px 0 20px; }
.iv-ch-story p{ font-size:15px; line-height:1.75; color:#44576B; margin:0 0 14px; }
.iv-ch-mission{ margin-top:18px; padding:18px 22px; border-left:4px solid; background:#F8FAFC; border-radius:0 12px 12px 0; }
.iv-ch-mission-label{ font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#6E7F93; }
.iv-ch-mission p{ font-size:20px; line-height:1.4; color:#223245; margin:8px 0 0; }
.iv-ch-values{ display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:18px; }
.iv-ch-value{ padding:18px; border:1px solid #EDF1F6; border-radius:14px; }
.iv-ch-value-dot{ display:block; width:12px; height:12px; border-radius:50%; margin-bottom:12px; }
.iv-ch-value h4{ font-size:15px; font-weight:700; color:#223245; margin:0 0 6px; }
.iv-ch-value p{ font-size:13px; line-height:1.55; color:#6E7F93; margin:0; }
.iv-ch-tone{ font-size:15px; line-height:1.7; color:#44576B; margin:0 0 16px; }
.iv-ch-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.iv-ch-chips span{ font-size:12.5px; font-weight:600; color:#0A58A5; background:rgba(10,88,165,.08); border-radius:99px; padding:5px 14px; }
.iv-ch-logos{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:24px; }
.iv-ch-logo{ position:relative; border-radius:14px; border:1px solid #EDF1F6; aspect-ratio:16/11; display:flex; align-items:center; justify-content:center; padding:26px; }
.iv-ch-logo img{ max-width:100%; max-height:100%; object-fit:contain; }
.iv-ch-logo--mono img{ filter:grayscale(1) contrast(1.05); }
.iv-ch-logo span{ position:absolute; bottom:8px; right:12px; font-size:10.5px; font-weight:600; color:#8494A6; }
.iv-ch-rules{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-bottom:22px; }
.iv-ch-rule h5{ font-size:13px; font-weight:700; color:#223245; margin:0 0 6px; }
.iv-ch-rule p{ font-size:13px; line-height:1.6; color:#6E7F93; margin:0; }
.iv-ch-dosdonts{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.iv-ch-dos h5, .iv-ch-donts h5{ font-size:13px; font-weight:700; margin:0 0 10px; }
.iv-ch-dos h5{ color:#1E8E5A; } .iv-ch-donts h5{ color:#C0392B; }
.iv-ch-dosdonts ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.iv-ch-dosdonts li{ font-size:13px; line-height:1.5; color:#556; padding-left:22px; position:relative; }
.iv-ch-dos li::before{ content:"✓"; position:absolute; left:0; color:#1E8E5A; font-weight:700; }
.iv-ch-donts li::before{ content:"✕"; position:absolute; left:0; color:#C0392B; font-weight:700; }
.iv-ch-colors{ display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:16px; }
.iv-ch-color{ border:1px solid #EDF1F6; border-radius:14px; overflow:hidden; }
.iv-ch-color-chip{ height:96px; }
.iv-ch-color-info{ display:flex; flex-direction:column; gap:3px; padding:14px 16px; }
.iv-ch-color-role{ font-size:14px; font-weight:700; color:#223245; margin-bottom:4px; }
.iv-ch-color-code{ font-size:11.5px; color:#6E7F93; font-variant-numeric:tabular-nums; }
.iv-ch-typo{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.iv-ch-font{ border:1px solid #EDF1F6; border-radius:14px; padding:22px; }
.iv-ch-font-meta{ display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 12px; margin-bottom:16px; }
.iv-ch-font-role{ font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#8494A6; }
.iv-ch-font-name{ font-size:16px; font-weight:700; color:#223245; }
.iv-ch-font-meta a{ font-size:12.5px; font-weight:600; color:#0A58A5; text-decoration:none; margin-left:auto; }
.iv-ch-font-meta a:hover{ text-decoration:underline; }
.iv-ch-specimen{ font-size:46px; line-height:1.1; margin-bottom:8px; }
.iv-ch-specimen-small{ font-size:14px; color:#6E7F93; }
@media (max-width:760px){
  .iv-ch-logos, .iv-ch-rules, .iv-ch-dosdonts, .iv-ch-typo{ grid-template-columns:1fr; }
  .iv-charte section{ padding:26px 22px; }
}

/* Étape 3 — 4 logos en image (sélection + bascule clair/sombre/mono) */
.iv-logos{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; align-items:stretch; }
.iv-logo-card{ position:relative; border:1.5px solid #E4EAF0; border-radius:16px; padding:10px; background:#fff; cursor:pointer; transition:border-color .15s ease, box-shadow .15s ease; }
.iv-logo-card:hover{ border-color:#B9CDE4; box-shadow:0 6px 18px rgba(10,88,165,0.08); }
.iv-logo-card.is-selected{ border-color:#0A58A5; box-shadow:0 0 0 3px rgba(10,88,165,0.12); }
.iv-logo-imgstage{ width:100%; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; border-radius:12px; padding:20px; background:var(--stage-bg,#F8FAFC); transition:background .2s ease; }
.iv-logo-imgstage img{ max-width:100%; max-height:100%; object-fit:contain; display:block; }
.iv-logos.mode-light .iv-logo-imgstage{ --stage-bg:var(--bg-light); }
.iv-logos.mode-dark .iv-logo-imgstage{ --stage-bg:var(--bg-dark); }
.iv-logos.mode-mono .iv-logo-imgstage{ --stage-bg:#ffffff; }
.iv-logos.mode-mono .iv-logo-imgstage img{ filter:grayscale(1) contrast(1.05); }
@media (max-width:900px){ .iv-logos{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .iv-logos{ grid-template-columns:1fr; } }

/* Étape 3 — assemblage du logo */
.iv-mode-toggle{ display:flex; gap:6px; justify-content:center; margin:0 auto 22px; background:#EEF2F6; padding:4px; border-radius:99px; width:fit-content; }
.iv-mode-toggle button{ border:none; background:transparent; padding:7px 16px; border-radius:99px; font-size:13px; font-weight:600; color:#5A6B7B; cursor:pointer; transition:background .15s ease, color .15s ease; }
.iv-mode-toggle button.is-active{ background:#fff; color:#0A58A5; box-shadow:0 1px 3px rgba(0,0,0,.12); }
.iv-logo-stage.mode-light{ --logo-bg:var(--bg-light); --logo-fg:var(--fg-light); }
.iv-logo-stage.mode-dark{ --logo-bg:var(--bg-dark); --logo-fg:var(--fg-dark); }
.iv-logo-stage.mode-mono{ --logo-bg:var(--bg-mono); --logo-fg:var(--fg-mono); }
.iv-lockups{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.iv-lockup{ display:flex; flex-direction:column; align-items:center; gap:10px; }
.iv-lockup-stage{ width:100%; aspect-ratio:4/3; display:flex; align-items:center; justify-content:center; padding:24px; border-radius:16px; border:1px solid #E4EAF0; background:var(--logo-bg); color:var(--logo-fg); transition:background .2s ease, color .2s ease; }
.iv-lockup-label{ font-size:12px; font-weight:600; color:#6E7F93; }
.iv-logo{ display:flex; color:var(--logo-fg); max-width:100%; }
.iv-logo--stacked{ flex-direction:column; align-items:center; text-align:center; gap:10px; }
.iv-logo--horizontal{ flex-direction:row; align-items:center; gap:14px; }
.iv-logo-sym{ color:var(--logo-fg); }
.iv-logo-sym svg{ display:block; }
.iv-logo--stacked .iv-logo-sym svg{ width:60px; height:60px; }
.iv-logo--horizontal .iv-logo-sym svg{ width:48px; height:48px; }
.iv-logo-name{ font-family:var(--disp), Georgia, serif; font-weight:700; font-size:23px; line-height:1.1; color:var(--logo-fg); word-break:break-word; }
.iv-logo--horizontal .iv-logo-name{ font-size:21px; }
.iv-logo-base{ font-family:var(--body), system-ui, sans-serif; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; opacity:.75; margin-top:3px; color:var(--logo-fg); }
.iv-monogram{ font-family:var(--disp), Georgia, serif; font-weight:700; font-size:32px; width:80px; height:80px; display:flex; align-items:center; justify-content:center; border-radius:50%; border:2.5px solid var(--logo-fg); color:var(--logo-fg); }
@media (max-width:900px){ .iv-lockups{ grid-template-columns:1fr; } }

/* Étape 3 — symboles */
.iv-symbols{ display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; align-items:stretch; }
.iv-sym{ position:relative; border:1.5px solid #E4EAF0; border-radius:16px; padding:16px; background:#fff; display:flex; flex-direction:column; align-items:center; gap:12px; cursor:pointer; transition:border-color .15s ease, box-shadow .15s ease; }
.iv-sym:hover{ border-color:#B9CDE4; box-shadow:0 6px 18px rgba(10,88,165,0.08); }
.iv-sym.is-selected{ border-color:#0A58A5; box-shadow:0 0 0 3px rgba(10,88,165,0.12); }
.iv-sym-canvas{ width:100%; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; background:#F8FAFC; border-radius:12px; padding:18px; }
.iv-sym-canvas svg{ width:100%; height:100%; max-width:120px; max-height:120px; display:block; }
.iv-sym-label{ font-size:12px; font-weight:600; color:#445972; }
@media (max-width:900px){ .iv-symbols{ grid-template-columns:repeat(2, 1fr); } }

/* Étape en flex-column : la barre (bouton back) descend en bas, sans toucher .content.
   min-height (pas height) : le contenu peut dépasser, .content scrolle nativement. */
[data-visual-identity-target="step"]{ flex-direction:column; min-height:calc(100vh - 84px); }
.iv-navbar{ margin-top:auto; }
.iv-generate{ display:flex; width:fit-content; margin:24px auto 0; }

/* Étape 4 — bouton de téléchargement du kit */
.iv-download{ display:inline-flex; align-items:center; gap:8px; margin-top:16px; padding:11px 22px; font-size:14px; font-weight:600; color:#fff; background:#0A58A5; border-radius:99px; text-decoration:none; transition:background .15s ease; }
.iv-download:hover{ background:#094881; }
.iv-download svg{ width:16px; height:16px; }

/* Éléments verrouillés (choix figé une fois l'étape suivante générée) */
.iv-locked{ opacity:.4; pointer-events:none; filter:grayscale(.4); cursor:default; }
/*



























 */

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Open Sans", sans-serif;
}

* {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

*::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Edge */
}

html, body {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Edge */
}

body{
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #333;
    background-color: #f5f5f5;
}

a{
    text-decoration: none;
}

input:focus, textarea:focus, select:focus{
    outline: none;
}

input:focus-visible, textarea:focus-visible, select:focus-visible{
    outline: none;
}

input:focus-within, textarea:focus-within, select:focus-within{
    outline: none;
}

textarea{
    resize: none;
}

button{
    background-color: transparent;
    cursor: pointer;   
}

main{
    display: flex;
    flex-direction: row;
    height: 100vh;
    background-color: #F6F7F8;
    overflow-y: hidden;
}

/* Flash Messages Container */
/* ═══════════════════════════════════════════════════
   Flash Toast Messages
   ═══════════════════════════════════════════════════ */

.flash-container {
    position: fixed;
    top: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 420px;
    width: calc(100% - 32px);
    pointer-events: none;
}

.flash-toast {
    border-radius: 10px;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-20px);
    transition: all 0.3s ease;
    pointer-events: auto;
}

.flash-toast.show {
    opacity: 1;
    transform: translateY(0);
}

.flash-toast.hide {
    opacity: 0;
    transform: translateY(-20px);
}

.flash-toast-body {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    font-size: 13px;
    font-weight: 600;
    font-family: "Open Sans", sans-serif;
}

.flash-toast-body i {
    font-size: 14px;
    flex-shrink: 0;
}

.flash-toast-body span {
    line-height: 1.4;
}

/* Success */
.flash-success {
    background: #ECFDF5;
    border: 1px solid #A7F3D0;
}

.flash-success .flash-toast-body {
    color: #065F46;
}

.flash-success .flash-toast-body i {
    color: #10B981;
}

.flash-success .flash-toast-progress {
    background: #10B981;
}

/* Error */
.flash-error {
    background: #FEF2F2;
    border: 1px solid #FECACA;
}

.flash-error .flash-toast-body {
    color: #991B1B;
}

.flash-error .flash-toast-body i {
    color: #EF4444;
}

.flash-error .flash-toast-progress {
    background: #EF4444;
}

/* Progress bar */
.flash-toast-progress {
    height: 3px;
    width: 100%;
    transform-origin: left;
}

@keyframes flash-progress {
    from { transform: scaleX(1); }
    to { transform: scaleX(0); }
}
  
  
  


/* Sidebar */

.sidebar-container {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100vh;
    border-right: 1px solid #DFE5EC;
    width: 350px;
    transition: width 0.3s ease;
    overflow: hidden;
}

.sidebar-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
}

.sidebar{
    width: 100%;
    padding: 24px;
    white-space: nowrap;
}

.sidebar  nav a img{
    width: 20px;
    height: 20px;
}

.sidebar-footer{
    padding: 24px;
}

.sidebar-footer .user-menu-button{
    width: 100%;
    justify-content: space-between;
    border-radius: 20px;
}

.sidebar-login-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px 20px;
    background-color: #0A58A5;
    color: #fff;
    border-radius: 12px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    transition: background-color 0.2s;
}

.sidebar-login-btn:hover {
    background-color: #084a8a;
}

.sidebar-login-btn svg {
    stroke: #fff;
    flex-shrink: 0;
}


.sidebar-header-mobile {
    display: none;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #DFE5EC;
}

.sidebar-close-button {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    color: #6E7F93;
    padding: 8px;
    border-radius: 4px;
    transition: background-color 0.2s;
}

.sidebar-close-button:hover {
    background-color: #F6F7F8;
}

.sidebar nav{
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.sidebar nav a{
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 10px;
    height: 48px;
    padding: 0 16px;
    font-size: 16px;
    font-weight: 600;
    color: #6E7F93;
}

span.sidebar-module-item{
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 10px;
    height: 48px;
    padding: 0 16px;
    font-size: 16px;
    font-weight: 600;
    color: #6E7F93;
}

.sidebar nav a.active{
    color: #0A58A5;
    background-color: #0a58a510;
    font-weight: 700;
    box-shadow: 0px 4px 8px 0px #0000000D;
    border: 1px solid var(--Color-2, #0A58A5)
}

.sidebar-title {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 20px;
}

.sidebar-title h1 {
    color: var(--stroke-1, #DFE5EC);
    font-size: 12px;
    font-weight: 700;
}

.divider {
    width: 100%;
    height: 1px;
    background-color: #DFE5EC;
}

.exit-button{
    padding: 0 !important;
}

.exit-button span{
    color: var(--Color0, #445972);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px; /* 100% */
}

.exit-button i{
    border-radius: 23px;
    background: #FFF;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0A58A5;
    /* gr1 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}

.sidebar-module-icon{
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #F6F7F8;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 8px; /* 66.667% */
}

.sidebar-module-item{
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
}

/* Main */

.main{
    flex: 1;
    width: calc(100% - 350px);
}

header{
    display: none;
}

/*
header{
    height: 70px;
    width: 100%;
    border-bottom: 1px solid #DFE5EC;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 0 24px;
    position: relative;
}

header .whatsapp-button{
    display: none;
}

*/

/* Mobile Menu Button */
.mobile-menu-button {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    color: #0A58A5;
    padding: 8px;
    border-radius: 4px;
    transition: background-color 0.2s;
    margin-right: 12px;
}

.mobile-menu-button:hover {
    background-color: #F6F7F8;
}

.mobile-menu-button svg {
    width: 24px;
    height: 24px;
}

.header-icons-group{
    display: flex;
    align-items: center;
    gap: 4px;
    margin-right: 30px;
}

.header-icon-button{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: none;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease;
    padding: 0;
    position: relative;
}


/* User Menu Container */
.user-menu-container {
    position: relative;

}

.user-menu-button {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    background: none;
    border: none;
    cursor: pointer;
    border-radius: 8px;
    transition: background-color 0.2s ease;
    border: 1px solid #DFE5EC;
    border-radius: 10px;
    white-space: nowrap;
    overflow: hidden;
}

.user-menu-button:hover {
    background-color: #F3F4F6;
}

.user-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #0A58A5;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    flex-shrink: 0;
    overflow: hidden;
}

.sidebar-avatar-img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.user-details {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.user-name {
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
    line-height: 1.4;
}

.user-role {
    font-size: 12px;
    color: #6E7F93;
    line-height: 1.4;
}

.dropdown-arrow {
    color: #6E7F93;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.user-menu-button:hover .dropdown-arrow {
    color: #0A58A5;
}

/* User Dropdown Menu */
.user-dropdown-menu {
    position: absolute;
    bottom: calc(100% + 8px);
    width: 100%;
    right: 0;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.037);
    min-width: 220px;
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s ease;
    z-index: 1000;
}

.user-dropdown-menu.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-item-icon{
    display: flex;
    align-items: center;
    gap: 10px;
}

.dropdown-item-icon span{
    color: var(--Color0, #445972);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 8px; /* 57.143% */
}

.notifications-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    color: #1F2937;
    text-decoration: none;
    border-radius: 8px;
    transition: background-color 0.2s ease;
    border: none;
    background: none;
    cursor: pointer;
    font-family: "Open Sans", sans-serif;
    text-align: left;
    font-weight: 600;
}

.dropdown-item:hover {
    background-color: #F3F4F6;
}

.dropdown-item.logout-item {
    color: #DC2626;
}

.dropdown-item.logout-item:hover {
    background-color: #FEE2E2;
    color: #991B1B;
}

.dropdown-divider {
    height: 1px;
    background-color: #DFE5EC;
    margin: 8px 0;
}

.dropdown-item-badge{
    border-radius: 30px;
    background: #FC121B;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF !important;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 8px; /* 80% */
}

.dropdown-item-text{
    color: var(--Color0, #445972) !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 600 !important;
    line-height: 8px; /* 57.143% */
}

.credits-balance{
    border-radius: 30px;
    background: #0A58A5;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF !important;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 8px; /* 80% */
}


/* Language Switcher */
.language-switcher-container {
    position: relative;
}

.language-switcher-button {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: none;
    border: none;
    cursor: pointer;
    border-radius: 8px;
    transition: background-color 0.2s ease;
    font-size: 16px;
    font-weight: 800;
    color: #6E7F93;
}

.language-switcher-button:hover {
    background-color: #F3F4F6;
}

.language-dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background-color: #FFFFFF;
    border: 1px solid #DFE5EC;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 180px;
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s ease;
    z-index: 1000;
}

.language-dropdown-menu.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.language-dropdown-menu .dropdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    color: #1F2937;
    text-decoration: none;
    border-radius: 8px;
    transition: background-color 0.2s ease;
    border: none;
    background: none;
    cursor: pointer;
    font-family: "Open Sans", sans-serif;
    text-align: left;
}

.language-dropdown-menu .dropdown-item:hover {
    background-color: #F3F4F6;
}

.langue-button span{
    font-size: 16px;
    font-weight: 800;
    color: #6E7F93;
}

.credit-badge{
    position: absolute;
    top: 2px;
    right: -7px;
    background-color: #0A58A5;
    color: #FFFFFF;
    font-size: 8px;
    font-weight: 700;
    border-radius: 10px;
    min-width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 1;
    border: 2px solid #FFFFFF;
}

.notification-badge{
    position: absolute;
    top: 2px;
    right: 6px;
    background-color: #DC2626;
    color: #FFFFFF;
    font-size: 8px;
    font-weight: 700;
    border-radius: 10px;
    min-width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 1;
    border: 2px solid #FFFFFF;
}

.action-card{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.content{
    height: 100vh;
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 0 30px;
    margin: 0 auto;
    padding-bottom: 30px;
}

.projects-index-content{
    margin: 0 auto;
    height: 100%;
}

.explorer-content{
    margin: 0 auto;
    padding: 0 0;
    height: 100vh;
    overflow: scroll;
}


.explorer-content .project-page-header-content{
    padding: 30px 0;
    padding-bottom: 0;
}


/* Mobile Bottom Navbar */
.mobile-bottom-navbar {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #FFFFFF;
    border-top: 1px solid #DFE5EC;
    padding: 8px 0 calc(8px + env(safe-area-inset-bottom));
    z-index: 999;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
}

.mobile-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 8px 12px;
    color: #6E7F93;
    text-decoration: none;
    font-size: 11px;
    font-weight: 500;
    position: relative;
    transition: color 0.2s;
    min-width: 60px;
}

.mobile-nav-item svg,
.mobile-nav-item .icon {
    width: 24px;
    height: 24px;
    position: relative;
}

.mobile-nav-item.active {
    color: #0A58A5;
}

.mobile-nav-login {
    color: #0A58A5;
    font-weight: 600;
}

.mobile-nav-login i {
    font-size: 22px;
}

.mobile-nav-item span {
    font-size: 11px;
}

.mobile-nav-badge {
    position: absolute;
    top: 6px;
    right: calc(50% - 20px);
    background-color: #EF4444;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 10px;
    min-width: 18px;
    text-align: center;
    line-height: 14px;
}

.mobile-nav-credit {
    position: absolute;
    top: 6px;
    right: 29px;
    background-color: #0A58A5;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 10px;
    min-width: 18px;
    text-align: center;
    line-height: 14px;
}

/* Sidebar Mobile Logout */
.sidebar-mobile-logout{
    display: none;
}

/* Mobile Menu Button */
.mobile-menu-button {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    color: #0A58A5;
    padding: 8px;
    border-radius: 4px;
    transition: background-color 0.2s;
    margin-right: 12px;
}

.mobile-menu-button:hover {
    background-color: #F6F7F8;
}

.mobile-menu-button svg {
    width: 24px;
    height: 24px;
}

.page-header-content{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--stroke-1, #DFE5EC);
    padding: 20px;
    background: linear-gradient(180deg, #E6ECF5 0%, #FFFFFF 100%);
    position: sticky;
    right: 0;
    top: 0;
    z-index: 9;
    height: 80px;
}

.page-header-content h1{
    color: var(--Color1, #223245);
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px; /* 100% */
}

.projects-index-page-title img{
    width: 30px !important;
    height: 30px !important;
}

.gross-margin-card p{
    color: #59B224;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 133.333% */
}

.page-header-content p{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px; 
    margin-top: 3px;
}

.page-header-content .add-project-button{
    display: flex;
    width: 185px;
    height: 44px;
    padding: 12px 17px;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 15px;
    background: #0A58A5;
    justify-content: center;
    align-items: center;
    color: #fff;
}

.page-header-content .add-project-button span{
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

.page-header-left{
    display: flex;
    gap: 12px;
    align-items: center;
}

.page-header-left .back-button{
    border-radius: 23px;
    background: #FFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    width: 42px;
    height: 42px;
    padding: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-header-left .back-button i{
    color: #0A58A5;
}

.project-cohorte-page-title{
    display: flex;
    gap: 10px ;
    align-items: center;
}

.project-cohorte-star-container{
    color: #59B224;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 12px; /* 100% */
    border-radius: 7px;
    border: 1px solid #59B224;
    align-items: center;
    display: flex;
    gap: 4px;
    padding: 7px 10px;
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(25px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.95) translateY(20px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.projects-index-page-header-left{
    width: 60%;
}

.projects-index-page-header-right{
    width: 40%;
    justify-content: end;
}

.home-page{
    padding: 60px 0;
    margin: 0 auto;
    height: 80vh;
    overflow: scroll;
}

/* Home Language Switcher */
.home-lang-switcher{
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-bottom: 4px;
    position: relative;
}

.home-lang-btn{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 10px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    padding: 7px 14px;
    color: #0A58A5;
    font-family: "Open Sans";
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.home-lang-btn:hover{
    background: rgba(10, 88, 165, 0.06);
    border-color: #0A58A5;
}

.home-lang-btn i{
    font-size: 14px;
    opacity: 0.8;
}

.home-lang-btn svg{
    opacity: 0.6;
    transition: transform 0.2s ease;
}

.home-lang-dropdown{
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 160px;
    border-radius: 12px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    padding: 6px;
    z-index: 100;
    animation: fadeUp 0.15s ease-out;
}

.home-lang-dropdown.show{
    display: block;
}

.home-lang-option{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 10px 14px;
    border-radius: 8px;
    border: none;
    background: none;
    color: #223245;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.home-lang-option:hover{
    background: #F6F7F8;
}

.home-lang-option.active{
    color: #0A58A5;
    font-weight: 600;
}

.home-lang-option.active:hover{
    background: rgba(10, 88, 165, 0.06);
}

.home-lang-option i{
    font-size: 12px;
    color: #0A58A5;
}

/* Session pages Language Switcher (login, registration) */
.session-lang-switcher{
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1000;
}

.home-page h1.greeting {
    animation: fadeUp 0.5s ease-out both;
}

.home-page .action-cards .action-card:nth-child(1),
.home-page .action-cards button:nth-child(1) {
    animation: scaleIn 0.5s ease-out 0.15s both;
}

.home-page .action-cards .action-card:nth-child(2),
.home-page .action-cards button:nth-child(2) {
    animation: scaleIn 0.5s ease-out 0.3s both;
}

.home-page .action-cards .action-card:nth-child(3),
.home-page .action-cards button:nth-child(3) {
    animation: scaleIn 0.5s ease-out 0.45s both;
}

.home-page .idee-du-jour {
    animation: fadeUp 0.6s ease-out 0.6s both;
}

.ai-badge{
    border-radius: 25px;
    background: rgba(10, 88, 165, 0.08);
    height: 32px;
    padding: 10px 41px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: fit-content;
    margin: 0 auto;
}

.ai-badge span{
    color: #0A58A5;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 12px; /* 85.714% */
}

h1.greeting{
    text-align: center;
    color: var(--Color1, #223245);
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px; /* 42.857% */
}

/* Home chat form */
.home-chat-form {
    position: sticky;
    bottom: 0;
    padding: 20px 0;
    background: linear-gradient(to bottom, transparent, #F6F7F8 30%);
    animation: fadeUp 0.5s ease-out 0.6s both;
    width: 100%;
    padding-bottom: 0;
}

.home-page-content{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.home-chat-input-wrapper {
    display: flex;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #fff;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    justify-content: space-between;
    flex-direction: column;
    align-items: end;
    padding: 20px;
    gap: 15px;
}

.home-chat-input {
    width: 100%;
    background-color: transparent;
    border: none;
    outline: none;
    color: var(--Color0, #445972);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 22px;
}

.home-chat-input::placeholder {
    color: var(--Color2, #6E7F93);
}

.home-chat-send {
    border-radius: 100%;
    background: #0A58A5;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    cursor: pointer;
    flex-shrink: 0;
}

.home-chat-send img {
    width: 16px;
    height: 16px;
    filter: brightness(0) invert(1);
}

p.subtitle{
    color: var(--Color2, #6E7F93);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 12px; /* 85.714% */
    margin-top: 26px;
    text-align: center;
}

.ai-assistant-intro .action-cards{
    margin-top: 47px;
    display: flex;
    align-items: stretch; 
    gap: 25px;
}

.ai-assistant-intro .action-cards .action-card, .ai-assistant-intro .action-cards button{
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;
    width: 33%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 24px;
}

.ai-assistant-intro .action-cards .action-card img, .ai-assistant-intro .action-cards button img{
    width: 46px;
    height: 46px;
}

.ai-assistant-intro .action-cards .action-card h2, .ai-assistant-intro .action-cards button h2{
    color: var(--Color1, #223245);
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 133.333% */
    text-align: left;
} 

.ai-assistant-intro .action-cards .action-card p, .ai-assistant-intro .action-cards button p{
    color: var(--Color2, #6E7F93);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 166.667% */
    text-align: left;
}

.ai-assistant-intro .action-cards .action-card .action-card-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 10px;
    background: rgba(10, 88, 165, 0.06);
    height: 32px;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.3s ease, gap 0.3s ease, transform 0.2s ease;
}

.ai-assistant-intro .action-cards .action-card .action-card-btn:hover{
    background: rgba(10, 88, 165, 0.12);
    gap: 14px;
}

.ai-assistant-intro .action-cards .action-card .action-card-btn:active{
    transform: scale(0.97);
}

.ai-assistant-intro .action-cards .action-card .action-card-btn span{
    color: var(--Color-2, #0A58A5);
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}

.ai-assistant-intro .action-cards .action-card .action-card-btn img{
    width: 16px;
    height: 16px;
    transition: transform 0.3s ease;
}

.ai-assistant-intro .action-cards .action-card .action-card-btn:hover img{
    transform: translateX(3px);
}

.idee-du-jour{
    margin-top: 27px;
    border-radius: 20px;
    padding: 29px;
    display: flex;
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-color: #161921;
    height: 300px;
    justify-content: center;
    align-items: center;
}

.tendances-page-title img{
    width: 35px;
    height: 35px;
}

.idee-du-jour-overlay{
    position: absolute;
    inset: 0;
    background: linear-gradient(97deg, rgba(10, 88, 165, 0.419) -8.25%, rgba(22, 25, 33, 0.9) 134.93%);
    z-index: 1;
}

.idee-du-jour-content{
    position: relative;
    z-index: 2;
    width: 100%;
}

.idee-tag{
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.10);
    padding: 8px 20px;
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 166.667% */
    width: fit-content;
}

.idee-du-jour-content h3{
    color: #FFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px; /* 83.333% */
    margin-top: 26px;
}

.idee-du-jour-content p{
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
    margin-top: 15px;
    margin-bottom: 30px;
}

.idee-du-jour-content a{
    border-radius: 20px;
    background: #FFF;
    height: 42px;
    padding: 11px 28px;
    color: #0A58A5;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
    margin-top: 30px;
}

.explorer-page{
    padding: 30px;
}

.explorer-page-header{
    border-radius: 20px;
    background: var(--gar, linear-gradient(97deg, #0A58A5 -8.25%, #161921 134.93%));
    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    padding: 25px;
}

.explorer-page-header-title{
    display: flex;
    gap: 10px;
    align-items: center;
}


.explorer-page-header-title h1{
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 25px; /* 138.889% */
}

.explorer-page-header-actions{
    margin-top: 30px;
    display: flex;
    align-items: stretch;
    gap: 30px;
}

.explorer-page-header-actions .explorer-page-header-action-button{
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 15px;
    border: 1px solid var(--dee, #ffffff2a);
    background: rgba(0, 0, 0, 0.10);
    padding: 12px 28px;
}

.explorer-page-header-actions .explorer-page-header-action-button h2{
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px; /* 77.778% */
}

.explorer-page-header-actions .explorer-page-header-action-button span{
    color: #BEDBFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px; /* 116.667% */
    margin-top: 4px;
}

.explorer-users{
    display: flex;
    align-items: center;
    gap: 27px;
}

.explorer-users img{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: -15px;
}

.explorer-users p{
    color: #BEDBFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
}

.ideation-title{
    margin-top: 30px;
}

.ideation-cards{
    margin-top: 15px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 24px;
    grid-row-gap: 24px;
}

.ideation-card{
    padding: 20px;
    border-radius: 20px;
    border: 1px solid var(--stroke-1, #DFE5EC);
    background: #FFF;

    /* gr2 */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    gap: 16px;
    justify-content: space-between;
}

.ideation-card h3{
    color: #223245;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 133.333% */
}

.ideation-card p{
    color: #6E7F93;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
}

.ideation-card a{
    border-radius: 10px;
    background: rgba(10, 88, 165, 0.06);
    height: 38px;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    color: #0A58A5;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
}

h2.ideation-title{
    color: var(--Color0, #445972);
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; /* 177.778% */
}

/* ========== Explorer Page Animations ========== */

.explorer-page-header{
    animation: fadeUp 0.4s ease-out both;
}

.explorer-page-header-title{
    animation: fadeUp 0.4s ease-out 0.1s both;
}

.explorer-page-header-action-button{
    animation: scaleIn 0.4s ease-out both;
}

.explorer-page-header-action-button:nth-child(1){ animation-delay: 0.15s; }
.explorer-page-header-action-button:nth-child(2){ animation-delay: 0.25s; }

.explorer-users{
    animation: fadeUp 0.4s ease-out 0.3s both;
}

.ideation-title{
    animation: fadeUp 0.4s ease-out 0.25s both;
}

.ideation-card{
    animation: scaleIn 0.5s ease-out both;
}

.ideation-card:nth-child(1){ animation-delay: 0.2s; }
.ideation-card:nth-child(2){ animation-delay: 0.3s; }
.ideation-card:nth-child(3){ animation-delay: 0.4s; }
.ideation-card:nth-child(4){ animation-delay: 0.45s; }
.ideation-card:nth-child(5){ animation-delay: 0.5s; }
.ideation-card:nth-child(6){ animation-delay: 0.55s; }

/* Phase 1 : le container se réduit, tout le contenu est clippé */
.sidebar-animating {
    width: 80px;
}

/* Phase 2 : layout final (display none + centrage des icônes) */
.sidebar-collapsed {
    width: 80px;
}

.sidebar-collapsed .sidebar {
    width: 100%;
    padding: 24px 12px;
}

.sidebar-collapsed .sidebar-footer {
    padding: 12px;
    padding-top: 0;
    padding-bottom: 24px;
}

.sidebar-collapsed .module-nav-header .exit-button,
.sidebar-collapsed .sidebar-module-project-title h3,
.sidebar-collapsed .sidebar-module-project-activity,
.sidebar-collapsed .sidebar-module-progress-header span:first-child,
.sidebar-collapsed .sidebar-module-progress-bar,
.sidebar-collapsed .sidebar-module-item span,
.sidebar-collapsed .sidebar nav a span,
.sidebar-collapsed .sidebar-title,
.sidebar-collapsed .user-details,
.sidebar-collapsed .dropdown-arrow,
.sidebar-collapsed .sidebar .logo {
    display: none;
}

.project-cohorte-badge{
    font-size: 16px !important;
}

.project-cohorte-mobile-only{
    display: none;
}

.project-cohorte-star-container img{
    width: 15px !important;
    height: 15px !important;
}

.sidebar-collapsed nav a{
    gap: 0;
}

.sidebar-collapsed .sidebar-module-project-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px 0;
    border: none;
    gap: 20px;
    height: 100px;
    justify-content: center;

}

.sidebar-collapsed .sidebar-module-project-title {
    justify-content: center;
}

.sidebar-collapsed .sidebar-module-progress-info {
    width: 100%;
}

.sidebar-collapsed .sidebar-module-progress-header {
    justify-content: center !important;
}

.sidebar-collapsed .sidebar-module-progress-header span {
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    margin-top: 5px;
}

.sidebar-collapsed .sidebar nav a,
.sidebar-collapsed .sidebar-module-item {
    justify-content: center;
    padding: 0;
    margin: 0 auto;
    width: 100%;
}

.sidebar-collapsed .module-nav-header {
    justify-content: center;
    height: 48px;
}

.sidebar-collapsed .module-nav-header button {
    margin: 0;
}

.sidebar-collapsed .user-menu-button {
    justify-content: center;
    padding: 8px;
}

.sidebar-collapsed .user-info {
    gap: 0;
}

/* Phase expand : le container s'élargit, texte encore clippé */

.module-navigation{
    margin-top: 0 !important;
}

.module-nav-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.module-nav-header button{
    border: none;
}

.sidebar-module-project-title{
    display: flex;
    align-items: center;
    gap: 10px;
}


/* ═══════════════════════════════════════════════════
   RESPONSIVE — Mobile & Tablet (max-width: 768px)
   ═══════════════════════════════════════════════════ */

@media (max-width: 768px) {

    .projects-modal-content{
        max-width: 100%;
    }

    .projects-list{
        display: flex;
        flex-direction: column;
        
    }

    /* ── Layout — .main is the single scroll container ── */
    main {
        flex-direction: column;
        height: 100vh;
        overflow: hidden;
    }

    .main {
        width: 100%;
        height: 100vh;
        overflow-y: auto;
        overflow-x: hidden;
    }

    /* ── Header fixed at top ── */
    header {
        display: flex;
        height: 56px;
        min-height: 56px;
        width: 100%;
        border-bottom: 1px solid #DFE5EC;
        align-items: center;
        justify-content: space-between;
        padding: 0 16px;
        position: sticky;
        top: 0;
        background: #fff;
        z-index: 100;
    }

    .mobile-menu-button {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* ── Sidebar hidden by default on mobile ── */
    .sidebar-container {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 300px;
        z-index: 1000;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        background: #fff;
    }

    .sidebar-container.mobile-open {
        transform: translateX(0);
    }

    .sidebar-container.mobile-open .sidebar-overlay {
        display: block;
    }

    /* Overlay: covers the full screen behind the sidebar */
    .sidebar-container .sidebar-overlay {
        position: fixed;
        top: 0;
        left: 300px;
        right: 0;
        bottom: 0;
        width: 100vw;
    }

    /* ── Mobile header inside sidebar ── */
    .sidebar-header-mobile {
        display: flex;
    }

    .sidebar-close-button {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .sidebar > .logo {
        display: none;
    }

    /* ── Sidebar content adjustments ── */
    .sidebar {
        overflow-y: auto;
        padding: 20px 16px;
        display: flex;
        flex-direction: column;
        flex: 1;
    }

    .sidebar-footer {
        display: none;
    }

    .sidebar-mobile-logout {
        display: block;
        padding: 16px 24px;
        margin-top: auto;
        border-top: 1px solid #E5E7EB;
    }

    .sidebar-mobile-logout-btn {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        padding: 12px;
        border: none;
        background: none;
        color: #DC2626;
        font-size: 14px;
        font-family: inherit;
        cursor: pointer;
        border-radius: 8px;
        transition: background-color 0.2s;
    }

    .sidebar-mobile-logout-btn:hover {
        background-color: #FEE2E2;
    }

    .sidebar-mobile-logout-btn i {
        font-size: 18px;
    }

    .sidebar-mobile-login-btn {
        color: #0A58A5;
        text-decoration: none;
    }

    .sidebar-mobile-login-btn:hover {
        background-color: #E0EFFF;
    }

    /* Disable collapse on mobile (always expanded) */
    .sidebar-container.sidebar-collapsed,
    .sidebar-container.sidebar-animating,
    .sidebar-container.sidebar-expanding {
        width: 300px;
    }

    /* Undo all collapsed display:none overrides on mobile */
    .sidebar-collapsed .sidebar-module-item span,
    .sidebar-collapsed .sidebar nav a span,
    .sidebar-collapsed .sidebar-title,
    .sidebar-collapsed .user-details,
    .sidebar-collapsed .dropdown-arrow,
    .sidebar-collapsed .sidebar .logo,
    .sidebar-collapsed .module-nav-header .exit-button,
    .sidebar-collapsed .sidebar-module-project-title h3,
    .sidebar-collapsed .sidebar-module-project-activity,
    .sidebar-collapsed .sidebar-module-progress-header span:first-child,
    .sidebar-collapsed .sidebar-module-progress-bar {
        display: revert;
    }

    .sidebar-collapsed nav a,
    .sidebar-collapsed .sidebar-module-item {
        justify-content: flex-start;
        padding: 0 12px !important;
        width: auto;
        height: 44px;
        margin: 0;
        display: flex;
        justify-content: start !important;
        gap: 10px;
    }

    .sidebar-collapsed .module-nav-header {
        justify-content: space-between;
        height: auto;
    }

    .sidebar-collapsed .sidebar-module-project-card {
        display: block;
        padding: 15px;
    }

    .sidebar-collapsed .user-menu-button {
        justify-content: space-between;
        padding: 12px;
    }

    .sidebar-collapsed .user-info {
        gap: 12px;
    }

    .sidebar-container .module-nav-header button[data-action*="toggleCollapse"] {
        display: none;
    }

    /* ── Module navigation ── */
    .module-navigation {
        gap: 6px;
    }

    .sidebar-module-item {
        font-size: 14px;
        height: 44px;
        padding: 0 12px;
    }

    .sidebar-module-item .sidebar-module-icon {
        width: 20px;
        height: 20px;
    }

    /* ── Header elements — masquer ce qui est déjà dans le bottom navbar ── */
    header .user-menu-container,
    header .header-icons-group,
    header .language-switcher-container {
        display: none;
    }

    /* ── Page header — sticky below the header ── */
    .page-header-content {
        
    }

    .page-header-content h1 {
        font-size: 16px;
    }

    .page-header-content p {
        font-size: 11px;
    }

    .etude-index-page-header-left img{
        width: 20px;
        height: 20px;
    }

    .page-header-content p{
        display: none;
    }

    .segment-actions{
        flex-direction: row !important;
    }

    .model-item-actions{
        width: 100%;
    }

    .distribution-modal-content, .metric-modal, .sizing-modal-content{
        width: 95% !important;
        max-width: 95% !important;
    }

    .projects-index-page-header-right{
        justify-content: end;
    }

    /* ── Aide button — icon only ── */
    .aide-button span {
        display: none;
    }

    /* ── Content — no own scroll context ── */
    .content {
        height: calc(100vh - 77.5px - 56px);
        overflow-y: visible;
        overflow-x: hidden;
        padding-bottom: 80px;
        padding: 0 20px;
        padding-bottom: 80px;
    }

    /* ── Bottom navbar ── */
    .mobile-bottom-navbar {
        display: flex;
    }

    .segments-clients-page{
        height: calc(100vh - 213.5px);
        padding: 15px;
    }

    .segments-header-count{
        display: none;
    }

    .segments-grid{
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .segment-metrics-items{
        display: flex;
        flex-direction: column;
    }

    .segment-edit-modal-content{
        max-width: 90%;
    }

    .segment-edit-modal-header, .segment-edit-modal-form{
        padding: 10px 20px;
    }

    .segment-edit-modal-header h3 {
        font-size: 16px;
    }

    .segment-edit-form-row{
        flex-direction: column;
    }

    .segment-edit-form-row .segment-edit-form-group{
        width: 100%;
    }

    .segment-edit-modal-cancel, .segment-edit-modal-save{
        width: 50%;
    }

    .value-prop-filters-actions{
        flex-direction: column;
    }

    .segment-dropdown-button{
        width: 100%;
    }

    .segment-dropdown-text{
        font-size: 10px;
    }

    .projects-page{
        padding: 20px;
        height: calc(100vh - 197.5px);
        overflow: scroll;
    }

    .view-toggle button{
        width: 100%;
        justify-content: center;
    }

    .segment-value-prop-content, .vp-row{
        flex-direction: column;
    }

    .vp-row{
        gap: 0;
    }

    .vp-row .vp-category, .summary-sub-item{
        width: 100%;
    }

    .summary-sub-sections{
        flex-direction: column;
    }

    .customer-profile-cards, .value-prop-map-cards{
        flex-direction: column;
    }

    .customer-profile-card, .value-prop-map-card{
        width: 100%;
    }

    .explorer-page{
        padding: 20px;
        height: 100%;
        overflow: scroll;
    }

    .explorer-page-header-actions{
        flex-direction: column;
    }

    .ideation-cards{
        display: flex;
        flex-direction: column;
    }

    .pf-content{
        height: calc(100% - 48px );
        overflow: scroll;
    }

    .profile-content{
        height: calc(100vh - 56px - 77.5px);
    }

    .home-chat-form{
        position: static;
    }

    .explorer-content{
        height: calc(100vh - 77.5px - 56px);
    }

    .home-page{
        overflow: auto;
        padding: 20px !important;
    }

    .idee-du-jour{
        height: fit-content;
        padding: 20px 15px;
    }

    .home-chat-form {
    }

    .home-page-content{
        padding-bottom: 20px;
        overflow: scroll;
        height: calc(100% - 56px - 77.5px);
        display: block;
    }

    .no-bottom-nav .home-page-content{
        height: calc(100% - 56px);
        padding-bottom: 20px;
    }

    .home-page{
        height: calc(100% - 135px);
    }

    .no-bottom-nav .home-page{
        height: calc(100% - 135px);
    }

    .filters-button span{
        display: none;
    }

    .pwa-banner {
        bottom: calc(77.5px + env(safe-area-inset-bottom));
    }

    .no-bottom-nav .pwa-banner {
        bottom: 0;
    }

}

/* ═══════════════════════════════════════════════════
   PWA Install Banner
   ═══════════════════════════════════════════════════ */
.pwa-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    transform: translateY(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 0 16px 16px;
}

.pwa-banner--visible {
    transform: translateY(0);
}

.pwa-banner__content {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border-radius: 16px;
    padding: 14px 16px;
    box-shadow: 0 -2px 16px rgba(0, 0, 0, 0.12);
    border: 1px solid #DFE5EC;
}

.pwa-banner__icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    flex-shrink: 0;
}

.pwa-banner__text {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.pwa-banner__text strong {
    font-size: 14px;
    font-weight: 700;
    color: #223245;
}

.pwa-banner__text span {
    font-size: 12px;
    color: #6E7F93;
    line-height: 1.4;
}

.pwa-banner__text span i {
    font-size: 11px;
}

.pwa-banner__install {
    flex-shrink: 0;
    border: none;
    border-radius: 10px;
    background: linear-gradient(135deg, #0A58A5, #0D6FD4);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    font-family: inherit;
    padding: 10px 18px;
    cursor: pointer;
    transition: opacity 0.2s;
}

.pwa-banner__install:hover {
    opacity: 0.9;
}

.pwa-banner__close {
    flex-shrink: 0;
    background: none;
    border: none;
    color: #6E7F93;
    cursor: pointer;
    padding: 6px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s;
}

.pwa-banner__close:hover {
    background-color: #F3F4F6;
    color: #374151;
}

/* CGU Page */
.cgu-page {
    min-height: 100vh;
    background: #F8FAFC;
    padding: 40px 20px;
}

.cgu-container {
    max-width: 760px;
    margin: 0 auto;
}

.cgu-header {
    margin-bottom: 40px;
}

.cgu-logo {
    height: 36px;
}

.cgu-content {
    background: #FFF;
    border-radius: 20px;
    border: 1px solid #DFE5EC;
    padding: 48px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.cgu-content h1 {
    color: #22364D;
    font-size: 26px;
    font-weight: 800;
    margin-bottom: 8px;
}

.cgu-updated {
    color: #6E7F93;
    font-size: 13px;
    margin-bottom: 36px;
}

.cgu-section {
    margin-bottom: 28px;
    padding-bottom: 28px;
    border-bottom: 1px solid #EEF1F5;
}

.cgu-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.cgu-section h2 {
    color: #22364D;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px;
}

.cgu-section p {
    color: #45556C;
    font-size: 14px;
    line-height: 1.7;
}