/* Effets partagés avec EventCalendar/wwwroot/site.css. */
:root {
    --brand-gradient: linear-gradient(115deg, #dfc15f 0%, #9fc375 32%, #45b179 64%, #008f84 100%);
    --brand-card-gradient: linear-gradient(115deg,
        rgb(223 193 95 / 10%) 0%, rgb(159 195 117 / 8%) 32%,
        rgb(69 177 121 / 8%) 64%, rgb(0 143 132 / 10%) 100%);
    /* 60 % de transparence : alpha 0.4, sans atténuer le texte. */
    --brand-tooltip-gradient: linear-gradient(115deg,
        rgba(223, 193, 95, .4) 0%, rgba(159, 195, 117, .4) 32%,
        rgba(69, 177, 121, .4) 64%, rgba(0, 143, 132, .4) 100%);
}

.page-content :is(.page-hero, .filters-card, .table-card,
    .request-section, .right-card, .soldes-resume-card, .solde-family,
    .absence-agenda-card, .agenda-all-card, .validation-card,
    .validation-popup-card, .popup-card, .mud-card),
.mud-dialog.demande-agenda-dialog {
    position: relative;
    background-color: var(--ec-card-base, rgba(255, 255, 255, .88)) !important;
    background-image: var(--brand-card-gradient) !important;
}

/* Les compteurs conservent la teinte CP/RTT sous le voile dégradé. */
.page-content .solde-family-cp {
    --ec-card-base: var(--ft-absence-conge-bg, #e3f2fd);
}

.page-content .solde-family-rtt {
    --ec-card-base: var(--ft-absence-rtt-bg, #ede7f6);
}

/* Le contour dégradé est réservé à la date d'aujourd'hui, dans les deux agendas. */
.absence-agenda-card .month-day.today,
.agenda-all-card .agency-day.today {
    box-shadow: none !important;
}

.absence-agenda-card .month-day.today::before,
.agenda-all-card .agency-day.today::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 2px;
    border-radius: inherit;
    background: var(--brand-gradient);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

/* Menu : mêmes fonds et états interactifs que dans EventCalendar. */
.mud-drawer.app-drawer {
    border-right: 1px solid rgba(120, 137, 164, .18);
    background: rgba(255, 255, 255, .82) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.app-drawer .nav-menu .mud-nav-link {
    position: relative;
    background: var(--brand-card-gradient) !important;
    transition: background-color 160ms ease, box-shadow 160ms ease;
}

.app-drawer .nav-menu .mud-nav-link:hover,
.app-drawer .nav-menu .mud-nav-link:focus-visible,
.app-drawer .nav-menu .mud-nav-link.active {
    background: linear-gradient(115deg,
        rgb(223 193 95 / 24%) 0%, rgb(159 195 117 / 20%) 32%,
        rgb(69 177 121 / 20%) 64%, rgb(0 143 132 / 24%) 100%) !important;
}

.app-drawer .nav-menu .mud-nav-link.active {
    color: #006b60 !important;
    font-weight: 600;
    box-shadow: 0 2px 8px rgb(38 56 46 / 8%);
}

.app-drawer .nav-menu .mud-nav-link.active .mud-icon-root {
    color: inherit !important;
}

.app-drawer .nav-menu .mud-nav-link:focus-visible {
    outline: 2px solid #006b60;
    outline-offset: 2px;
}

/* Les MudTooltip sont rendus hors de .page-content par le portail MudBlazor. */
.mud-tooltip,
.absence-agenda-card .ft-agenda-event .agenda-tooltip {
    background: var(--brand-tooltip-gradient) !important;
    color: #07142d !important;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.absence-agenda-card .ft-agenda-event .agenda-tooltip::after {
    background: var(--brand-tooltip-gradient) !important;
}

/* MudBlazor oriente la flèche par rotation : conserver les trois côtés transparents. */
.mud-tooltip.mud-tooltip-arrow::after {
    border-color: rgba(69, 177, 121, .4) transparent transparent transparent !important;
}
