@import '_content/Perial.Blazor/Perial.Blazor.4yczf8b0d1.bundle.scp.css';

/* /Components/Overlays/Modals/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-gcr19ld0l2],
.components-reconnect-repeated-attempt-visible[b-gcr19ld0l2],
.components-reconnect-failed-visible[b-gcr19ld0l2],
.components-pause-visible[b-gcr19ld0l2],
.components-resume-failed-visible[b-gcr19ld0l2],
.components-rejoining-animation[b-gcr19ld0l2] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-gcr19ld0l2],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-gcr19ld0l2],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-gcr19ld0l2],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-gcr19ld0l2],
#components-reconnect-modal.components-reconnect-retrying[b-gcr19ld0l2],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-gcr19ld0l2],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-gcr19ld0l2],
#components-reconnect-modal.components-reconnect-failed[b-gcr19ld0l2],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-gcr19ld0l2] {
    display: block;
}

#components-reconnect-modal[b-gcr19ld0l2] {
    background-color: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.20) !important;
    border-radius: calc(var(--mud-default-borderradius) * 2);
    box-shadow: var(--mud-elevation-8);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-gcr19ld0l2 0.5s both;

    &[open] {
        animation: components-reconnect-modal-slideUp-b-gcr19ld0l2 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s,
                   components-reconnect-modal-fadeInOpacity-b-gcr19ld0l2 0.5s ease-in-out 0.3s;
        animation-fill-mode: both;
    }
}

#components-reconnect-modal[b-gcr19ld0l2]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-gcr19ld0l2 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-gcr19ld0l2 {
    0%   { transform: translateY(30px) scale(0.95); }
    100% { transform: translateY(0); }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-gcr19ld0l2 {
    0%   { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-gcr19ld0l2 {
    0%   { opacity: 1; }
    100% { opacity: 0; }
}

.components-reconnect-container[b-gcr19ld0l2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-gcr19ld0l2] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-gcr19ld0l2] {
    border: 0;
    background-color: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
    padding: 6px 24px;
    border-radius: var(--mud-default-borderradius);
    font-family: inherit;
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.2s;
}

#components-reconnect-modal button:hover[b-gcr19ld0l2] {
    background-color: var(--mud-palette-primary-darken);
}

#components-reconnect-modal button:active[b-gcr19ld0l2] {
    background-color: var(--mud-palette-primary-lighten);
}

.components-rejoining-animation[b-gcr19ld0l2] {
    position: relative;
    width: 80px;
    height: 80px;
}

.components-rejoining-animation div[b-gcr19ld0l2] {
    position: absolute;
    border: 3px solid var(--mud-palette-primary);
    opacity: 1;
    border-radius: 50%;
    animation: components-rejoining-animation-b-gcr19ld0l2 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

.components-rejoining-animation div:nth-child(2)[b-gcr19ld0l2] {
    animation-delay: -0.5s;
}

@keyframes components-rejoining-animation-b-gcr19ld0l2 {
    0%    { top: 40px; left: 40px; width: 0;    height: 0;    opacity: 0; }
    4.9%  { top: 40px; left: 40px; width: 0;    height: 0;    opacity: 0; }
    5%    { top: 40px; left: 40px; width: 0;    height: 0;    opacity: 1; }
    100%  { top: 0;    left: 0;    width: 80px; height: 80px; opacity: 0; }
}
/* /Components/Pages/Home/HomePage.razor.rz.scp.css */
/* On mobile / small tablets (below MudBlazor's md breakpoint of 960px), the two
   columns stack. In that case the "À faire" action rail must come first. */
@media (max-width: 959.98px) {
    .cockpit-zone[b-u14g8a0hh0]  .home-rail {
        order: -1;
    }
}

/* Project list rows (favoris, mon portefeuille, projets récemment créés): keep the
   status chip and the progress percentage aligned in fixed columns across rows,
   regardless of the project name length. */
.projet-row-meta[b-u14g8a0hh0] {
    flex: 0 0 auto;
}

.projet-row-meta[b-u14g8a0hh0]  .mud-chip {
    min-width: 96px;
    justify-content: center;
    margin: 0;
}

.projet-row-pct[b-u14g8a0hh0] {
    min-width: 42px;
    text-align: right;
}
/* /Components/Pages/Projets/ProjetDetailPage.razor.rz.scp.css */
/* Project detail tab bar — "pill" styling.
   The active tab is filled with the Perial logo blue (#2e5397, taken from the
   logo gradient), with readable white text/icon. Inactive tabs stay neutral
   with a discreet hover. Scoped to this page via CSS isolation so other MudTabs
   instances (Time Tracking, Reporting, …) keep their default look, and so the
   global theme primary color is left untouched. */

.projet-tabs[b-s5dol4du89] {
    /* Perial logo blue and a slightly darker shade for the active hover state. */
    --perial-tab-active: #2e5397;
    --perial-tab-active-hover: #264676;
}

/* Hide the default sliding indicator: the active state is shown as a filled pill. */
.projet-tabs[b-s5dol4du89]  .mud-tab-slider {
    display: none;
}

/* Base tab: neutral text, rounded corners, comfortable spacing. */
.projet-tabs[b-s5dol4du89]  .mud-tab {
    border-radius: 8px;
    margin: 4px 2px;
    min-height: 42px;
    text-transform: none;
    color: var(--mud-palette-text-secondary);
    transition: background-color .15s ease, color .15s ease;
}

/* Discreet hover on inactive tabs (light and dark via theme tokens). */
.projet-tabs[b-s5dol4du89]  .mud-tab:hover:not(.mud-tab-active) {
    background-color: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-primary);
}

/* Active tab: filled Perial-blue pill with white text and icon. */
.projet-tabs[b-s5dol4du89]  .mud-tab.mud-tab-active {
    background-color: var(--perial-tab-active);
    color: #fff;
    box-shadow: 0 4px 14px rgba(46, 83, 151, .30);
}

.projet-tabs[b-s5dol4du89]  .mud-tab.mud-tab-active:hover {
    background-color: var(--perial-tab-active-hover);
}

.projet-tabs[b-s5dol4du89]  .mud-tab.mud-tab-active .mud-icon-root {
    color: #fff;
}
/* /Components/Pages/Reporting/DureeProjetsBarChart.razor.rz.scp.css */
.pd-duree-chart[b-1n7jk1lxnh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pd-duree-row[b-1n7jk1lxnh] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pd-duree-label[b-1n7jk1lxnh] {
    flex: 0 0 220px;
    font-size: 0.8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pd-duree-track[b-1n7jk1lxnh] {
    flex: 1 1 auto;
    background: var(--mud-palette-table-lines);
    border-radius: 4px;
    height: 14px;
    overflow: hidden;
}

.pd-duree-bar[b-1n7jk1lxnh] {
    height: 100%;
    min-width: 3px;
    border-radius: 4px;
}

.pd-duree-bar--primary[b-1n7jk1lxnh] {
    background: #1976d2;
}

.pd-duree-bar--success[b-1n7jk1lxnh] {
    background: #2d9c6a;
}

.pd-duree-value[b-1n7jk1lxnh] {
    flex: 0 0 40px;
    text-align: right;
    font-size: 0.8rem;
    color: var(--mud-palette-text-secondary);
}
/* /Components/Pages/Reporting/ProjetsGanttChart.razor.rz.scp.css */
/* Gantt des projets — styles présentationnels scopés au composant.
   Les couleurs réutilisent les variables de palette MudBlazor lorsqu'elles existent ;
   les nuances spécifiques (gris-bleu, hachures) restent en valeurs dédiées. */

.pd-gantt-scroll[b-ifkzblgwf6] {
    overflow-x: auto;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--mud-default-borderradius);
}

.pd-gantt[b-ifkzblgwf6] {
    width: 100%;
}

/* ── Lignes d'en-tête (années / trimestres) ───────────────────────── */
.pd-gantt-headrow[b-ifkzblgwf6] {
    display: flex;
    align-items: stretch;
    background-color: var(--mud-palette-background-grey);
}

.pd-gantt-scale[b-ifkzblgwf6] {
    display: flex;
    flex: 1;
}

.pd-gantt-year[b-ifkzblgwf6],
.pd-gantt-quarter[b-ifkzblgwf6] {
    border-left: 1px solid var(--mud-palette-lines-default);
    text-align: center;
    padding: 6px 4px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--mud-palette-text-secondary);
}

.pd-gantt-year[b-ifkzblgwf6] {
    flex-basis: 0;
    color: var(--mud-palette-text-primary);
}

.pd-gantt-quarter[b-ifkzblgwf6] {
    flex: 1;
}

/* ── Colonne de libellé (partagée en-têtes et lignes) ─────────────── */
.pd-gantt-label[b-ifkzblgwf6] {
    width: 230px;
    min-width: 230px;
    padding: 6px 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* Colonne figée pendant le défilement horizontal (AC1). Fond opaque pour
       masquer barres/gridlines qui glissent dessous ; z-index < repère « Aujourd'hui ». */
    position: sticky;
    left: 0;
    z-index: 2;
    background-color: var(--mud-palette-surface);
}

/* En-têtes (coin années + « Projet ») : fond gris cohérent avec la bande d'en-tête. */
.pd-gantt-headrow .pd-gantt-label[b-ifkzblgwf6] {
    background-color: var(--mud-palette-background-grey);
}

/* Conserve le survol de ligne sur la cellule de libellé figée (sinon masqué par son fond opaque). */
.pd-gantt-row:hover .pd-gantt-label[b-ifkzblgwf6] {
    background-color: var(--mud-palette-action-default-hover);
}

.pd-gantt-corner[b-ifkzblgwf6] {
    background-color: var(--mud-palette-background-grey);
}

.pd-gantt-projname[b-ifkzblgwf6] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Corps ────────────────────────────────────────────────────────── */
.pd-gantt-body[b-ifkzblgwf6] {
    position: relative;
}

.pd-gantt-group[b-ifkzblgwf6] {
    background-color: var(--mud-palette-action-default-hover);
    font-weight: 600;
    font-size: 0.82rem;
    padding: 7px 14px;
    color: var(--mud-palette-text-primary);
    border-top: 1px solid var(--mud-palette-lines-default);
}

/* Le nom du programme reste figé à gauche pendant le scroll horizontal (AC1). */
.pd-gantt-group__label[b-ifkzblgwf6] {
    position: sticky;
    left: 14px;
    display: inline-block;
}

.pd-gantt-row[b-ifkzblgwf6] {
    display: flex;
    align-items: stretch;
    border-top: 1px solid var(--mud-palette-lines-default);
    cursor: pointer;
}

.pd-gantt-row:hover[b-ifkzblgwf6] {
    background-color: var(--mud-palette-action-default-hover);
}

.pd-gantt-track[b-ifkzblgwf6] {
    position: relative;
    flex: 1;
    height: 38px;
}

.pd-gantt-gridlines[b-ifkzblgwf6] {
    position: absolute;
    inset: 0;
    display: flex;
}

.pd-gantt-gridlines span[b-ifkzblgwf6] {
    flex: 1;
    border-left: 1px solid var(--mud-palette-lines-default);
}

/* ── Barres projet ────────────────────────────────────────────────── */
.pd-gantt-bar[b-ifkzblgwf6] {
    position: absolute;
    top: 9px;
    height: 20px;
    border-radius: 5px;
    color: #fff;
    font-size: 0.68rem;
    line-height: 20px;
    padding: 0 8px;
    white-space: nowrap;
    overflow: hidden;
    box-shadow: var(--mud-elevation-1);
}

.pd-gantt-bar__label[b-ifkzblgwf6] {
    pointer-events: none;
}

.pd-bar--ademarrer[b-ifkzblgwf6] {
    background-color: #90a4c4;
}

.pd-bar--encours[b-ifkzblgwf6] {
    background-color: var(--mud-palette-primary);
}

.pd-bar--ferme[b-ifkzblgwf6] {
    background-color: var(--mud-palette-success);
}

.pd-bar--abandonne[b-ifkzblgwf6] {
    background-color: var(--mud-palette-error);
}

.pd-bar--overshoot[b-ifkzblgwf6] {
    border-radius: 0 5px 5px 0;
    background: repeating-linear-gradient(45deg, var(--mud-palette-error), var(--mud-palette-error) 4px, #ef9a9a 4px, #ef9a9a 8px);
}

/* ── Jalons (losanges positionnés sur la barre projet) ────────────── */
.pd-gantt-jalon[b-ifkzblgwf6] {
    position: absolute;
    top: 19px;
    transform: translate(-50%, -50%);
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pd-gantt-jalon__mark[b-ifkzblgwf6] {
    width: 13px;
    height: 13px;
    transform: rotate(45deg);
    border-radius: 2px;
    border: 2px solid #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.pd-gantt-jalon__label[b-ifkzblgwf6] {
    margin-top: 9px;
    max-width: 88px;
    font-size: 0.6rem;
    line-height: 1.1;
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    pointer-events: none;
}

/* Couleurs des jalons selon le statut (cohérentes avec l'onglet Jalons). */
.pd-jalon--planifie[b-ifkzblgwf6] {
    background-color: var(--mud-palette-warning);
}

.pd-jalon--encours[b-ifkzblgwf6] {
    background-color: var(--mud-palette-info);
}

.pd-jalon--atteint[b-ifkzblgwf6] {
    background-color: var(--mud-palette-success);
}

.pd-jalon--retard[b-ifkzblgwf6] {
    background-color: var(--mud-palette-error);
}

.pd-jalon--annule[b-ifkzblgwf6] {
    background-color: #9e9e9e;
}

/* ── Repère « Aujourd'hui » ───────────────────────────────────────── */
.pd-gantt-today-line[b-ifkzblgwf6] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background-color: var(--mud-palette-error);
    z-index: 5;
    pointer-events: none;
}

.pd-gantt-today-flag[b-ifkzblgwf6] {
    position: absolute;
    top: -1px;
    transform: translateX(-50%);
    background-color: var(--mud-palette-error);
    color: #fff;
    font-size: 0.62rem;
    padding: 1px 6px;
    border-radius: 3px;
    z-index: 6;
    white-space: nowrap;
    pointer-events: none;
}

/* ── Légende ──────────────────────────────────────────────────────── */
.pd-gantt-legend[b-ifkzblgwf6] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 0.78rem;
    color: var(--mud-palette-text-secondary);
}

.pd-gantt-legend--jalons[b-ifkzblgwf6] {
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1px dashed var(--mud-palette-lines-default);
}

.pd-gantt-legend__group[b-ifkzblgwf6] {
    font-weight: 600;
    color: var(--mud-palette-text-primary);
}

.pd-gantt-legend__item[b-ifkzblgwf6] {
    display: flex;
    gap: 7px;
    align-items: center;
}

.pd-gantt-swatch[b-ifkzblgwf6] {
    width: 26px;
    height: 12px;
    border-radius: 3px;
    display: inline-block;
}

.pd-gantt-jalon-swatch[b-ifkzblgwf6] {
    width: 13px;
    height: 13px;
    transform: rotate(45deg);
    border-radius: 2px;
    border: 2px solid #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    display: inline-block;
    margin: 0 3px;
}
/* /Components/Shared/BudgetGauge.razor.rz.scp.css */
.budget-gauge[b-pvwto1738i] {
    position: relative;
}

/* Ligne verticale marquant la limite du budget (100 %). La zone remplie au-delà
   de ce repère matérialise le dépassement. */
.budget-gauge__limit[b-pvwto1738i] {
    position: absolute;
    top: -2px;
    bottom: -2px;
    width: 2px;
    background-color: var(--mud-palette-dark);
    opacity: 0.6;
    transform: translateX(-1px);
    pointer-events: none;
}
/* /Components/Shared/PageKpiCard.razor.rz.scp.css */
/* Carte KPI : hauteur minimale uniforme pour un alignement homogène sur la grille. */
.page-kpi-card[b-qtf63j4qgm] {
    min-height: 104px;
}
/* /Components/Shared/PageShell.razor.rz.scp.css */
/* Réserve une hauteur FIXE pour le fil d'Ariane afin que la mise en page reste identique
   entre les pages qui en possèdent un et celles qui n'en ont pas.
   Une hauteur fixe (et non min-height) est indispensable : sinon le slot grandit à la hauteur
   réelle du fil d'Ariane quand il est présent, ce qui recrée le décalage. */
.pd-breadcrumbs-slot[b-vizvx9b37s] {
    display: flex;
    align-items: center;
    height: 1.75rem;
}

/* Neutralise les marges / paddings internes de MudBreadcrumbs pour que sa hauteur ne dépasse
   pas celle du slot réservé. */
.pd-breadcrumbs-slot[b-vizvx9b37s]  .mud-breadcrumbs {
    margin: 0;
    padding: 0;
}
/* /Components/Shared/PdfPreviewPanel.razor.rz.scp.css */
.pdf-preview-panel[b-rdv4tz46h3] {
    position: fixed;
    top: 0;
    right: 0;
    width: 55%;
    max-width: 900px;
    min-width: 400px;
    height: 100vh;
    z-index: 1300;
    background: var(--mud-palette-surface);
    box-shadow: var(--mud-elevation-16);
    display: flex;
    flex-direction: column;
    animation: slide-in-right-b-rdv4tz46h3 0.25s ease-out;
}

.pdf-preview-header[b-rdv4tz46h3] {
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.pdf-preview-content[b-rdv4tz46h3] {
    flex: 1;
    position: relative;
}

.pdf-preview-loader[b-rdv4tz46h3] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mud-palette-surface);
    z-index: 1;
}

.pdf-preview-iframe[b-rdv4tz46h3] {
    width: 100%;
    height: 100%;
    border: none;
}

@keyframes slide-in-right-b-rdv4tz46h3 {
    from {
        transform: translateX(100%);
    }

    to {
        transform: translateX(0);
    }
}
