@import '_content/Solinfo.SyncEngine.UIComponents/Solinfo.SyncEngine.UIComponents.7f9pebb30y.bundle.scp.css';

/* /Components/Layout/AICodingAssistant.razor.rz.scp.css */
/* AI Assistant Box */

#ai-assistant[b-1fs96pio5z] {
    position: absolute;
    bottom: 64px;
    left: 9px;
    width: 188px;
    border: 1px solid transparent;
    border-radius: 11px;
    padding: 5px 16px;
    background: linear-gradient(var(--kendo-color-surface), var(--kendo-color-surface)) padding-box, linear-gradient(114deg, #4b5ffa 0%, #c158e4 93%) border-box;
}

    #ai-assistant[b-1fs96pio5z]::before {
        content: "";
        position: absolute;
        z-index: 0;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: .18;
        background: url(ai-circle.png) center center no-repeat;
        background-size: cover;
    }

    #ai-assistant h4[b-1fs96pio5z],
    #ai-assistant > p[b-1fs96pio5z],
    #ai-assistant > a[b-1fs96pio5z] {
        position: relative;
        padding-left: 41px;
        z-index: 2;
    }

    #ai-assistant h4[b-1fs96pio5z] {
        position: relative;
        margin: 0 0 .3em;
        font-size: 20px;
        line-height: 1.4;
        font-weight: 500;
    }

    #ai-assistant .k-icon[b-1fs96pio5z] {
        position: absolute;
        left: 0;
        top: 0;
        color: #4b5ffa;
    }

    #ai-assistant > a[b-1fs96pio5z] {
        color: #a75ae9;
        text-decoration: none;
    }

        #ai-assistant > a:hover[b-1fs96pio5z] {
            text-decoration: underline;
        }
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Drawer item styles */

.drawer-parent-item[b-yo6xvleyly],
.drawer-child-item[b-yo6xvleyly],
.drawer-regular-item[b-yo6xvleyly] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    cursor: pointer;
    white-space: nowrap;
}

.drawer-parent-item[b-yo6xvleyly] {
     
}

.drawer-parent-item .drawer-item-text[b-yo6xvleyly] {
    flex: 1;
}

.drawer-parent-item .drawer-arrow[b-yo6xvleyly] {
    margin-left: auto;
    flex-shrink: 0;
}

.drawer-child-item[b-yo6xvleyly] {
   
}

.drawer-regular-item[b-yo6xvleyly] {
     
}

/* -- Section titles and separators in drawer -- */

.drawer-separator[b-yo6xvleyly] {
    padding: 3px 0;
    width: 100%;
}

.drawer-separator hr[b-yo6xvleyly] {
    border: none;
    border-top: 1px solid var(--kendo-color-border, #444);
    margin: 0;
    opacity: 0.4;
}

.drawer-section-title[b-yo6xvleyly] {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--kendo-color-subtle, #6c757d);
    font-weight: 700;
    cursor: default;
    pointer-events: none;
    
    padding: 2px 0;
    border-left: 2px solid var(--kendo-color-primary, #dc4344);
    padding-left: 6px !important;
    margin-top: 2px;
}

/* ─── MENU USAGER (header) ───────────────────────────────────────────────── */

/* Bouton dans le header (vrai <button> : on neutralise le style natif) */
.user-menu-button[b-yo6xvleyly] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    cursor: pointer;
    background: none;
    border: none;
    color: inherit;
    font: inherit;
    min-height: 44px; /* cible tactile */
}

    .user-menu-button .user-menu-name[b-yo6xvleyly] {
        font-size: 14px;
        font-weight: 500;
        white-space: nowrap;
        max-width: 180px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .user-menu-button .user-menu-chevron[b-yo6xvleyly] {
        font-size: 10px;
        opacity: 0.7;
    }

/* Overlay transparent pour fermer le menu en cliquant ailleurs */
.user-menu-overlay[b-yo6xvleyly] {
    position: fixed;
    inset: 0;
    z-index: 1000;
}

/* Carte popup */
.user-menu-popup[b-yo6xvleyly] {
    position: fixed;
    top: 52px;
    right: 8px;
    z-index: 1001;
    width: min(320px, calc(100vw - 16px)); /* ne déborde jamais du viewport mobile */
    background: var(--kendo-color-surface-alt, #2a2a2a);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
    overflow: hidden;
    animation: user-menu-fadein-b-yo6xvleyly .15s ease;
}

@keyframes user-menu-fadein-b-yo6xvleyly {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Section infos usager */
.user-menu-info[b-yo6xvleyly] {
    padding: 14px 16px 12px;
}

.user-menu-fullname[b-yo6xvleyly] {
    font-size: 15px;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
}

.user-menu-email[b-yo6xvleyly] {
    font-size: 12px;
    color: var(--kendo-color-subtle-text, #999);
    margin-top: 2px;
    word-break: break-all;
}

.user-menu-role[b-yo6xvleyly] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    margin-top: 6px;
    color: var(--kendo-color-subtle-text, #999);
}

/* Séparateur */
.user-menu-divider[b-yo6xvleyly] {
    height: 1px;
    background: var(--kendo-color-border, #3a3a3a);
    margin: 0;
}

/* Liens d'action */
.user-menu-actions[b-yo6xvleyly] {
    padding: 6px 0;
}

.user-menu-action[b-yo6xvleyly] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 44px; /* cible tactile */
    padding: 9px 16px;
    font-size: 14px;
    color: var(--kendo-color-on-app-surface);
    background: none;
    border: none;
    text-decoration: none;
    cursor: pointer;
    transition: background .12s;
}

    .user-menu-action:hover[b-yo6xvleyly] {
        background: var(--kendo-color-base-hover, rgba(255,255,255,.07));
        color: var(--kendo-color-primary);
        text-decoration: none;
    }

.user-menu-logout[b-yo6xvleyly] {
    color: var(--kendo-color-error, #dc4344);
}

    .user-menu-logout:hover[b-yo6xvleyly] {
        color: var(--kendo-color-error, #dc4344);
    }
/* /Components/Pages/Admin/AdminIndex.razor.rz.scp.css */
.admin-page[b-nnlju4596g] {
    padding: 12px 16px;
}

.admin-title[b-nnlju4596g] {
    margin-bottom: 16px;
    font-size: 1.3rem;
    color: var(--kendo-color-primary);
}

/* Hauteur minimale pour que le TabStrip gauche s'affiche bien */
.admin-tabstrip[b-nnlju4596g] {
    min-height: calc(100vh - 120px);
}

/* Contenu des tabs : padding interne */
[b-nnlju4596g] .k-tabstrip-content {
    padding: 16px 20px;
}

/* Largeur fixe du panel de tabs gauche */
[b-nnlju4596g] .k-tabstrip-items-wrapper {
    min-width: 180px;
}
/* /Components/Pages/Admin/Sections/AdminProxyRoutingMatrix.razor.rz.scp.css */
.proxyrouting-header[b-bdihf4q5ef] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 0.5rem;
}

.proxyrouting-status[b-bdihf4q5ef] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.proxy-chip[b-bdihf4q5ef] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.2rem 0.6rem;
    border-radius: 1rem;
    font-size: 0.85rem;
}

.proxy-chip-ok[b-bdihf4q5ef] {
    background: rgba(40, 167, 69, 0.12);
}

.proxy-chip-err[b-bdihf4q5ef] {
    background: rgba(220, 53, 69, 0.15);
}

.proxy-chip-default[b-bdihf4q5ef] {
    opacity: 0.75;
    font-size: 0.8rem;
}

.proxyrouting-filters[b-bdihf4q5ef] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.matrix-badge[b-bdihf4q5ef] {
    display: inline-block;
    padding: 0.05rem 0.4rem;
    border-radius: 0.6rem;
    font-size: 0.7rem;
    vertical-align: middle;
    margin-left: 0.35rem;
}

.matrix-badge-default[b-bdihf4q5ef] {
    background: rgba(108, 117, 125, 0.18);
}

.matrix-badge-external[b-bdihf4q5ef] {
    background: rgba(255, 193, 7, 0.25);
}

.matrix-badge-ruletype[b-bdihf4q5ef] {
    background: rgba(13, 110, 253, 0.15);
    margin-left: 0;
    margin-right: 0.35rem;
}

.matrix-cell-explicit[b-bdihf4q5ef] {
    font-weight: 600;
}

.matrix-cell-default[b-bdihf4q5ef] {
    opacity: 0.8;
}

.matrix-cell-none[b-bdihf4q5ef] {
    color: #dc3545;
}

.proxyrouting-nonlicence[b-bdihf4q5ef] {
    margin-top: 1rem;
}

.proxyrouting-nonlicence h5[b-bdihf4q5ef] {
    font-size: 0.95rem;
}

.proxyrouting-nonlicence ul[b-bdihf4q5ef] {
    margin: 0.25rem 0 0 1rem;
    padding: 0;
}
/* /Components/Pages/Admin/Sections/AuditLogsViewer.razor.rz.scp.css */
.audit-detail-section-codes[b-cozkafo1js] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.audit-detail-table[b-cozkafo1js] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88em;
    margin-bottom: 8px;
}

.audit-detail-table th[b-cozkafo1js] {
    text-align: left;
    color: var(--kendo-color-subtle, #666);
    font-weight: 500;
    padding: 4px 8px 4px 0;
    width: 110px;
    vertical-align: top;
}

.audit-detail-table td[b-cozkafo1js] {
    padding: 4px 0;
    word-break: break-word;
    color: var(--kendo-color-on-app-surface, inherit);
}

.audit-detail-table code[b-cozkafo1js] {
    font-size: 0.95em;
    background: var(--kendo-color-base, rgba(0,0,0,0.05));
    padding: 1px 4px;
    border-radius: 3px;
}

.audit-detail-msg[b-cozkafo1js] {
    margin: 0 0 8px 0;
    padding: 8px;
    background: #1e1e1e;
    color: #d4d4d4;
    border: 1px solid var(--kendo-color-border, transparent);
    border-radius: 4px;
    font-family: monospace;
    font-size: 0.82em;
    white-space: pre-wrap;
    word-break: break-all;
    max-height: 240px;
    overflow: auto;
}

.audit-detail-empty[b-cozkafo1js] {
    color: var(--kendo-color-subtle, #888);
    font-style: italic;
    margin: 0 0 8px 0;
    font-size: 0.88em;
}

.edit-panel-body h5[b-cozkafo1js] {
    margin: 12px 0 6px 0;
    font-size: 0.9em;
    color: var(--kendo-color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid var(--kendo-color-border);
    padding-bottom: 2px;
}

.edit-panel-body h5:first-child[b-cozkafo1js] {
    margin-top: 0;
}

.audit-badge[b-cozkafo1js] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.78em;
    font-weight: 600;
    line-height: 1.4;
}

.audit-badge-code[b-cozkafo1js] {
    background: var(--kendo-color-primary-subtle, rgba(255, 99, 88, 0.15));
    color: var(--kendo-color-primary, #ff6358);
}

.audit-badge-subcode[b-cozkafo1js] {
    background: var(--kendo-color-base, rgba(0, 0, 0, 0.08));
    color: var(--kendo-color-on-app-surface, inherit);
}

.audit-badge-read[b-cozkafo1js] {
    background: var(--kendo-color-success-subtle, #d4edda);
    color: var(--kendo-color-success, #155724);
}

.audit-badge-unread[b-cozkafo1js] {
    background: var(--kendo-color-base, rgba(0, 0, 0, 0.08));
    color: var(--kendo-color-subtle, #666);
}
/* /Components/Pages/ERPConnector/ErpCompanyConnexionInfo.razor.rz.scp.css */
.licence-selector-bar[b-fg0te5w9vp] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0 12px;
}

.licence-selector-hint[b-fg0te5w9vp] {
    color: var(--kendo-color-warning, #ff6358);
    font-size: 0.875rem;
}

.required-star[b-fg0te5w9vp] {
    color: red;
}

.ext-prop-row[b-fg0te5w9vp] {
    display: flex;
    gap: 6px;
    align-items: center;
    margin-bottom: 4px;
}

.gateway-groupbox[b-fg0te5w9vp] {
    border: 1px solid #d5d5d5;
    border-radius: 4px;
    padding: 12px 12px 10px;
    margin: 14px 0;
    position: relative;
}

.gateway-groupbox-title[b-fg0te5w9vp] {
    position: absolute;
    top: -10px;
    left: 10px;
    background: white;
    padding: 0 6px;
    font-size: 0.82em;
    font-weight: 600;
    color: #555;
    letter-spacing: 0.02em;
}

.gateway-groupbox-body[b-fg0te5w9vp] {
    padding-top: 4px;
}

.gateway-checkbox-row[b-fg0te5w9vp] {
    display: flex;
    align-items: center;
    gap: 8px;
}
/* /Components/Pages/ERPConnector/ERPTaskLauncher.razor.rz.scp.css */
.task-launcher[b-bvaeful2dp] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 8px 8px 32px 8px;
    max-width: 1200px;
}

.section-card[b-bvaeful2dp] {
    border: 1px solid var(--kendo-color-border);
    border-radius: 6px;
    background: var(--kendo-color-surface-alt);
}

.section-card.section-disabled[b-bvaeful2dp] {
    opacity: 0.6;
    pointer-events: auto;
}

.disabled-notice[b-bvaeful2dp] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin-bottom: 8px;
    background: rgba(255, 193, 7, 0.12);
    border: 1px solid rgba(255, 193, 7, 0.5);
    border-radius: 4px;
    color: #ffd66b;
    font-size: 0.9em;
}

.form-row[b-bvaeful2dp] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.form-row > label[b-bvaeful2dp] {
    min-width: 160px;
    font-weight: 500;
}

.subsection-title[b-bvaeful2dp] {
    margin: 16px 0 8px 0;
    font-size: 1em;
    font-weight: 600;
    color: var(--kendo-color-subtle);
}

.pagination-row[b-bvaeful2dp] {
    display: flex;
    gap: 24px;
    margin-bottom: 12px;
}

.form-field[b-bvaeful2dp] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.form-field label[b-bvaeful2dp] {
    font-size: 0.85em;
    font-weight: 500;
    color: var(--kendo-color-subtle);
}

.filter-row[b-bvaeful2dp] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    padding: 6px;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: 4px;
}

.filter-value-placeholder[b-bvaeful2dp] {
    color: var(--kendo-color-subtle);
    font-style: italic;
    width: 220px;
}

.empty-hint[b-bvaeful2dp] {
    color: var(--kendo-color-subtle);
    font-style: italic;
    padding: 8px 0;
    font-size: 0.9em;
}

.fields-list[b-bvaeful2dp] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 4px 12px;
    padding: 4px 0;
}

.field-checkbox[b-bvaeful2dp] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px;
    cursor: pointer;
}

.field-checkbox small[b-bvaeful2dp] {
    color: var(--kendo-color-subtle);
    font-family: Consolas, monospace;
    font-size: 0.8em;
}

.json-preview[b-bvaeful2dp],
.json-result[b-bvaeful2dp] {
    background: #1e1e1e;
    color: #dcdcdc;
    padding: 12px;
    border-radius: 4px;
    font-family: Consolas, monospace;
    font-size: 0.85em;
    max-height: 500px;
    overflow: auto;
    white-space: pre;
    margin: 0;
}

.execute-row[b-bvaeful2dp] {
    display: flex;
    justify-content: flex-end;
    padding: 8px 0;
}

.execute-btn[b-bvaeful2dp] {
    min-width: 220px;
    font-size: 1em;
    font-weight: 600;
    padding: 10px 20px;
}

.result-card[b-bvaeful2dp] {
    border-top: 3px solid #2196f3;
}

.result-ok[b-bvaeful2dp] {
    color: #7ee787;
    font-weight: 700;
}

.result-ko[b-bvaeful2dp] {
    color: #ff9da7;
    font-weight: 700;
}

.result-meta[b-bvaeful2dp] {
    color: var(--kendo-color-subtle);
    font-weight: normal;
    font-size: 0.9em;
}

.error-msg[b-bvaeful2dp] {
    background: rgba(220, 67, 68, 0.12);
    border: 1px solid rgba(220, 67, 68, 0.5);
    color: #ff9da7;
    padding: 12px;
    border-radius: 4px;
    font-family: Consolas, monospace;
    font-size: 0.9em;
    margin-bottom: 12px;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ── Sommaire du résultat (onglet 1er niveau) ── */

.result-summary-grid[b-bvaeful2dp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 8px 0;
    font-size: 0.9em;
}

.rs-row[b-bvaeful2dp] {
    display: flex;
    align-items: baseline;
    gap: 12px;
    padding: 5px 8px;
    border-radius: 4px;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
}

.rs-label[b-bvaeful2dp] {
    min-width: 160px;
    font-weight: 600;
    color: var(--kendo-color-subtle);
    font-family: Consolas, monospace;
    font-size: 0.88em;
    flex-shrink: 0;
}

.rs-value[b-bvaeful2dp] {
    color: var(--kendo-color-on-app-surface);
    word-break: break-word;
}

.rs-number[b-bvaeful2dp] {
    font-family: Consolas, monospace;
    color: #79b8ff;
}

.rs-compressed[b-bvaeful2dp] {
    color: var(--kendo-color-subtle);
    font-size: 0.9em;
}
/* /Components/Pages/Onboarding/AgentVerifyPanel.razor.rz.scp.css */
/* Styles de la vérification agent — déménagés de OnboardingWizard.razor.css avec le markup.
   L'isolation CSS de Blazor ne traverse pas les composants : chaque composant extrait
   porte les règles de son propre markup (d'où la reprise de la règle de base p,
   qui venait de `.wizard-body p` côté wizard). */

p[b-inomikmrk8] {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--kendo-color-subtle, #b9b9c3);
}

.info-box[b-inomikmrk8],
.success-box[b-inomikmrk8] {
    padding: 0.6rem 0.85rem;
    border-radius: 6px;
    font-size: 0.85rem !important;
    line-height: 1.45;
    border: 1px solid transparent;
}

.info-box[b-inomikmrk8] {
    background: rgba(80, 120, 200, 0.12);
    border-color: rgba(80, 120, 200, 0.35);
    color: #b7c8ef !important;
}

.success-box[b-inomikmrk8] {
    background: rgba(60, 170, 90, 0.14);
    border-color: rgba(60, 170, 90, 0.4);
    color: #a5e6b8 !important;
}

.verify-block[b-inomikmrk8] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
}
/* /Components/Pages/Onboarding/ConnectionsEditor.razor.rz.scp.css */
/* Styles des connexions ERP — déménagés de OnboardingWizard.razor.css avec le markup.
   L'isolation CSS de Blazor ne traverse pas les composants : chaque composant extrait
   porte les règles de son propre markup (d'où la reprise des règles de base p/h4/field,
   qui venaient de `.wizard-body …` côté wizard). */

h4[b-v8983354bc] {
    margin: 0.4rem 0 0.2rem;
    font-size: 1rem;
    color: var(--kendo-color-on-app-surface, #e6e6e6);
}

p[b-v8983354bc] {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--kendo-color-subtle, #b9b9c3);
}

.field[b-v8983354bc] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.field > label[b-v8983354bc] {
    font-weight: 500;
    font-size: 0.85rem;
    color: var(--kendo-color-subtle, #a9a9b3);
}

.required-star[b-v8983354bc] {
    color: var(--kendo-color-primary, #dc4344);
    margin-left: 2px;
}

/* Largeur pleine par défaut pour les composants Telerik dans une carte */
.field[b-v8983354bc]  .k-input,
.field[b-v8983354bc]  .k-picker,
.field[b-v8983354bc]  .k-textbox {
    width: 100%;
}

.info-box[b-v8983354bc] {
    padding: 0.6rem 0.85rem;
    border-radius: 6px;
    font-size: 0.85rem !important;
    line-height: 1.45;
    border: 1px solid rgba(80, 120, 200, 0.35);
    background: rgba(80, 120, 200, 0.12);
    color: #b7c8ef !important;
}

.conn-list[b-v8983354bc] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.conn-list li[b-v8983354bc] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.5rem 0.75rem;
    background: var(--kendo-color-surface-alt, #2a2a4a);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
    border-radius: 6px;
    font-size: 0.88rem;
}

.conn-list li .badge[b-v8983354bc] {
    margin-left: auto;
    font-size: 0.72rem;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--kendo-color-subtle, #b9b9c3);
    white-space: nowrap;
}

.conn-editor[b-v8983354bc] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem;
    border: 1px dashed var(--kendo-color-border, #3a3a3a);
    border-radius: 8px;
}

.erp-form-host[b-v8983354bc] {
    padding-top: 0.25rem;
}

.conn-editor-actions[b-v8983354bc] {
    display: flex;
    gap: 0.5rem;
}
/* /Components/Pages/Onboarding/CustomerFormEditor.razor.rz.scp.css */
/* Styles du formulaire client — déménagés de OnboardingWizard.razor.css avec le markup.
   L'isolation CSS de Blazor ne traverse pas les composants : chaque composant extrait
   porte les règles de son propre markup. */

.new-customer-form[b-ri9mpx3jlk] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.field[b-ri9mpx3jlk] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.field > label[b-ri9mpx3jlk] {
    font-weight: 500;
    font-size: 0.85rem;
    color: var(--kendo-color-subtle, #a9a9b3);
}

.field-row[b-ri9mpx3jlk] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.field-row > .field[b-ri9mpx3jlk] {
    flex: 1 1 140px;
}

.required-star[b-ri9mpx3jlk] {
    color: var(--kendo-color-primary, #dc4344);
    margin-left: 2px;
}

.field-hint[b-ri9mpx3jlk] {
    font-size: 0.78rem;
    line-height: 1.35;
    color: var(--kendo-color-subtle, #a9a9b3);
}

.field-hint code[b-ri9mpx3jlk] {
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
    font-size: 0.95em;
    color: var(--kendo-color-base-emphasis, #d8d8de);
}

/* Largeur pleine par défaut pour les composants Telerik dans une carte */
.field[b-ri9mpx3jlk]  .k-input,
.field[b-ri9mpx3jlk]  .k-picker,
.field[b-ri9mpx3jlk]  .k-textbox {
    width: 100%;
}

@media (max-width: 680px) {
    .field-row[b-ri9mpx3jlk] {
        flex-direction: column;
    }
}
/* /Components/Pages/Onboarding/InstallationPanel.razor.rz.scp.css */
/* Styles du panneau d'installation — déménagés de OnboardingWizard.razor.css avec le markup.
   L'isolation CSS de Blazor ne traverse pas les composants : chaque composant extrait
   porte les règles de son propre markup (d'où la reprise de la règle de base p,
   qui venait de `.wizard-body p` côté wizard). */

p[b-g59fc9lybw] {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--kendo-color-subtle, #b9b9c3);
}

.info-box[b-g59fc9lybw],
.error-box[b-g59fc9lybw] {
    padding: 0.6rem 0.85rem;
    border-radius: 6px;
    font-size: 0.85rem !important;
    line-height: 1.45;
    border: 1px solid transparent;
}

.info-box[b-g59fc9lybw] {
    background: rgba(80, 120, 200, 0.12);
    border-color: rgba(80, 120, 200, 0.35);
    color: #b7c8ef !important;
}

.error-box[b-g59fc9lybw] {
    background: rgba(220, 67, 68, 0.14);
    border-color: rgba(220, 67, 68, 0.4);
    color: #f2a9aa !important;
}

/* Les boutons d'action (télécharger / courrieller / confirmer) tiennent sur une ligne et
   passent à la ligne d'eux-mêmes sur écran étroit. */
.install-actions[b-g59fc9lybw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

/* Clé maître absente : constat neutre sur une licence plus ancienne, pas une alerte —
   rien n'est cassé, l'ancien mot de passe global fonctionne toujours. */
.master-key-missing[b-g59fc9lybw] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.85rem 1rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
}

.master-key-missing .credentials-warning[b-g59fc9lybw] {
    margin: 0;
}

/* Confirmation de réémission : ambre, parce qu'on s'apprête à tuer un credential en service —
   ni neutre (ce n'est pas anodin), ni rouge (ce n'est pas une erreur). */
.reissue-confirm[b-g59fc9lybw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.85rem 1rem;
    border-radius: 8px;
    background: rgba(255, 176, 32, 0.10);
    border: 1px solid rgba(255, 176, 32, 0.35);
}

.reissue-confirm .credentials-warning[b-g59fc9lybw] {
    margin: 0;
}

/* ---------- Bloc jeton d'enrôlement (affiché une seule fois) ---------- */

.token-block[b-g59fc9lybw] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 0.85rem 1rem;
    background: var(--kendo-color-surface-alt, #2a2a4a);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
    border-radius: 8px;
}

.token-block > label[b-g59fc9lybw] {
    font-size: 0.82rem;
    color: var(--kendo-color-subtle, #a9a9b3);
    line-height: 1.45;
}

.token-row[b-g59fc9lybw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Le champ prend la place restante, le bouton garde sa largeur naturelle. */
.token-row > :first-child[b-g59fc9lybw] {
    flex: 1 1 auto;
    min-width: 0;
}

.token-row[b-g59fc9lybw]  .k-input-inner {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 0.88rem;
}

/* ---------- Clé maître (show-once) ---------- */

/* LA valeur à noter : cadre accentué à la couleur primaire, sans virer au rouge d'alerte —
   on souligne une consigne, on ne signale pas un problème. */
.master-key-block[b-g59fc9lybw] {
    border-color: rgba(220, 67, 68, 0.45);
}

.master-key-block > p[b-g59fc9lybw] {
    margin: 0;
}

/* ---------- Offre « créer une autre clé d'accès » ---------- */

.other-key-offer[b-g59fc9lybw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.85rem 1rem;
    border: 1px dashed var(--kendo-color-border, #3a3a3a);
    border-radius: 8px;
}

.other-key-offer h4[b-g59fc9lybw] {
    margin: 0;
    font-size: 1rem;
    color: var(--kendo-color-on-app-surface, #e6e6e6);
}

/* ---------- Identifiants de licence (show-once, repli « en cas de pépin ») ---------- */

/* Repli, donc discret : ce bloc ne doit pas concurrencer le jeton d'enrôlement, qui est
   le chemin normal. Fond neutre, pas d'orange d'alerte — on ne signale pas un problème,
   on range un outil de secours. */
.credentials-block[b-g59fc9lybw] {
    margin-top: 0.35rem;
    padding: 0.35rem 0.9rem 0.9rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
}

.credentials-block > summary[b-g59fc9lybw] {
    cursor: pointer;
    padding: 0.55rem 0;
    font-size: 0.88rem;
    color: var(--kendo-color-subtle, #9a9aa8);
    /* Marqueur par défaut retiré au profit du chevron ci-dessous, pour maîtriser l'espacement. */
    list-style: none;
}

.credentials-block > summary[b-g59fc9lybw]::-webkit-details-marker {
    display: none;
}

.credentials-block > summary[b-g59fc9lybw]::before {
    content: "▸";
    display: inline-block;
    width: 1.1em;
    transition: transform 0.15s ease;
}

.credentials-block[open] > summary[b-g59fc9lybw]::before {
    transform: rotate(90deg);
}

.credentials-block > summary:hover[b-g59fc9lybw] {
    color: var(--kendo-color-on-app-surface, #e6e6e6);
}

/* Le contenu déplié reprend l'espacement vertical des autres blocs du wizard. */
.credentials-block[open] > summary[b-g59fc9lybw] {
    margin-bottom: 0.5rem;
}

.credentials-warning[b-g59fc9lybw] {
    margin: 0 0 0.85rem;
    font-size: 0.85rem;
    line-height: 1.5;
    color: var(--kendo-color-subtle, #9a9aa8);
}
/* /Components/Pages/Onboarding/OnboardingCaseListPage.razor.rz.scp.css */
/* =========================================================
   Liste des mises en service — styles scopés
   Même langage visuel que le dossier (OnboardingCasePage).
   ========================================================= */

.case-list-page[b-jvlmmhvu9f] {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 2rem 1rem 3rem;
    box-sizing: border-box;
}

.case-list-card[b-jvlmmhvu9f] {
    background: var(--kendo-color-surface, #222244);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
    border-radius: 10px;
    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.28);
    width: 100%;
    max-width: 780px;
    padding: 1.75rem 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    box-sizing: border-box;
}

.case-list-header[b-jvlmmhvu9f] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.case-list-header h3[b-jvlmmhvu9f] {
    margin: 0 0 0.25rem;
    font-size: 1.35rem;
    color: var(--kendo-color-on-app-surface, #e6e6e6);
}

.case-list-muted[b-jvlmmhvu9f] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--kendo-color-subtle, #9a9aa8);
}

.case-list-toggle[b-jvlmmhvu9f] {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: var(--kendo-color-subtle, #9a9aa8);
    cursor: pointer;
    white-space: nowrap;
}

.case-list-empty[b-jvlmmhvu9f] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1rem 0 0.5rem;
}

.case-list-link[b-jvlmmhvu9f] {
    font-size: 0.9rem;
    color: var(--kendo-color-primary, #dc4344);
    text-decoration: none;
}

.case-list-link:hover[b-jvlmmhvu9f] {
    text-decoration: underline;
}

/* ---------- Lignes ---------- */

.case-rows[b-jvlmmhvu9f] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.case-row[b-jvlmmhvu9f] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 0.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.case-row:last-child[b-jvlmmhvu9f] {
    border-bottom: none;
}

.case-row-main[b-jvlmmhvu9f] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.case-row-title[b-jvlmmhvu9f] {
    color: var(--kendo-color-on-app-surface, #e6e6e6);
    font-size: 0.98rem;
    font-weight: 600;
}

.case-row-progress[b-jvlmmhvu9f] {
    height: 5px;
    max-width: 260px;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

.case-row-progress-fill[b-jvlmmhvu9f] {
    height: 100%;
    border-radius: 5px;
    background: var(--kendo-color-primary, #dc4344);
}

.case-row-badge[b-jvlmmhvu9f] {
    flex: none;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.case-row-badge-open[b-jvlmmhvu9f] {
    background: rgba(255, 176, 32, 0.16);
    color: #ffb020;
}

.case-row-badge-done[b-jvlmmhvu9f] {
    background: rgba(46, 176, 106, 0.16);
    color: #2eb06a;
}

.case-row-open[b-jvlmmhvu9f] {
    flex: none;
    font-size: 0.9rem;
    color: var(--kendo-color-primary, #dc4344);
    text-decoration: none;
}

.case-row-open:hover[b-jvlmmhvu9f] {
    text-decoration: underline;
}

/* ---------- Écrans étroits ---------- */

@media (max-width: 640px) {
    .case-list-card[b-jvlmmhvu9f] {
        padding: 1.25rem 1rem 1rem;
    }

    .case-list-header[b-jvlmmhvu9f] {
        flex-direction: column;
    }

    .case-row[b-jvlmmhvu9f] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Onboarding/OnboardingCasePage.razor.rz.scp.css */
/* =========================================================
   Dossier de mise en service — styles scopés
   Mêmes variables Kendo que le wizard, pour que le passage
   de l'un à l'autre ne change pas de langage visuel.
   ========================================================= */

.onboarding-case[b-h4oadilhfn] {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 2rem 1rem 3rem;
    box-sizing: border-box;
}

.case-card[b-h4oadilhfn] {
    background: var(--kendo-color-surface, #222244);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
    border-radius: 10px;
    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.28);
    /* Largeur fluide : suit la zone de contenu au resize, avec un plancher (sous 780px les
       explications et les champs de clés deviennent illisibles) et un plafond (au-delà, les
       lignes de texte deviennent trop longues à balayer). max-width borne le plancher sur
       petit écran, sinon la carte déborderait. Centrage : justify-content du parent. */
    width: clamp(780px, 70%, 1200px);
    max-width: 100%;
    padding: 1.75rem 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    box-sizing: border-box;
}

.case-header[b-h4oadilhfn] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.case-header h3[b-h4oadilhfn] {
    margin: 0 0 0.25rem;
    font-size: 1.35rem;
    color: var(--kendo-color-on-app-surface, #e6e6e6);
}

.case-muted[b-h4oadilhfn] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--kendo-color-subtle, #9a9aa8);
}

.case-badge[b-h4oadilhfn] {
    flex: none;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.case-badge-open[b-h4oadilhfn] {
    background: rgba(255, 176, 32, 0.16);
    color: #ffb020;
}

.case-badge-done[b-h4oadilhfn] {
    background: rgba(46, 176, 106, 0.16);
    color: #2eb06a;
}

/* ---------- Progression ---------- */

.case-progress[b-h4oadilhfn] {
    height: 6px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

.case-progress-fill[b-h4oadilhfn] {
    height: 100%;
    border-radius: 6px;
    background: var(--kendo-color-primary, #dc4344);
    transition: width 0.3s ease;
}

.case-done-banner[b-h4oadilhfn] {
    margin: 0;
    padding: 0.7rem 0.9rem;
    border-radius: 8px;
    font-size: 0.88rem;
    background: rgba(46, 176, 106, 0.12);
    border: 1px solid rgba(46, 176, 106, 0.35);
    color: #8fe0b4;
}

/* Avertissement non bloquant : le dossier est utilisable, mais quelque chose reste à rattraper
   par un administrateur (ex. le routage de la licence non épinglé). */
.case-warn-banner[b-h4oadilhfn] {
    margin: 0;
    padding: 0.7rem 0.9rem;
    border-radius: 8px;
    font-size: 0.88rem;
    background: rgba(240, 173, 78, 0.12);
    border: 1px solid rgba(240, 173, 78, 0.4);
    color: #f0c98a;
}

/* ---------- Checklist ---------- */

.case-items[b-h4oadilhfn] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.case-item[b-h4oadilhfn] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 0.75rem 0.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    /* L'éditeur ouvert est un 3ᵉ enfant qui prend toute la largeur sous la ligne (flex-basis 100%),
       d'où le wrap : sans lui il se serrerait à côté des boutons. */
    flex-wrap: wrap;
}

.case-item:last-child[b-h4oadilhfn] {
    border-bottom: none;
}

/* Pastille d'état : la couleur porte l'information, le title la répète en texte. */
.case-dot[b-h4oadilhfn] {
    flex: none;
    width: 11px;
    height: 11px;
    margin-top: 0.35rem;
    border-radius: 50%;
}

.case-dot-pending[b-h4oadilhfn] {
    background: transparent;
    border: 2px solid var(--kendo-color-subtle, #9a9aa8);
}

.case-dot-done[b-h4oadilhfn] {
    background: #2eb06a;
}

.case-dot-skipped[b-h4oadilhfn] {
    background: #ffb020;
}

.case-dot-na[b-h4oadilhfn] {
    background: rgba(255, 255, 255, 0.18);
}

.case-item-body[b-h4oadilhfn] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.case-item-label[b-h4oadilhfn] {
    color: var(--kendo-color-on-app-surface, #e6e6e6);
    font-size: 0.95rem;
}

.case-item-meta[b-h4oadilhfn] {
    font-size: 0.78rem;
    color: var(--kendo-color-subtle, #9a9aa8);
}

.case-item-note[b-h4oadilhfn] {
    font-size: 0.82rem;
    font-style: italic;
    color: var(--kendo-color-subtle, #9a9aa8);
    overflow-wrap: anywhere;
}

.case-item-actions[b-h4oadilhfn] {
    flex: none;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.case-skip-row[b-h4oadilhfn] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.4rem;
}

/* ---------- Éditeur ouvert sous un item de checklist ---------- */

/* Décalé sous la pastille, encadré : on doit voir d'un coup d'œil à quel item il appartient. */
.case-item-editor[b-h4oadilhfn] {
    /* La base doit RETRANCHER la marge gauche : une base de 100 % plus 1,9rem de marge dépasse
       la ligne d'exactement cette marge, et l'éditeur sortait de la carte par la droite. */
    flex: 1 0 calc(100% - 1.9rem);
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin: 0.75rem 0 0.25rem 1.9rem;
    padding: 1rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
}

.fiche-actions[b-h4oadilhfn] {
    display: flex;
    gap: 0.5rem;
}

/* ---------- Écrans étroits ---------- */

@media (max-width: 640px) {
    .case-card[b-h4oadilhfn] {
        padding: 1.25rem 1rem 1rem;
    }

    .case-item[b-h4oadilhfn] {
        flex-wrap: wrap;
    }

    .case-item-actions[b-h4oadilhfn] {
        width: 100%;
        padding-left: 1.9rem;
    }

    .case-skip-row[b-h4oadilhfn] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Onboarding/OnboardingWizard.razor.rz.scp.css */
/* =========================================================
   Wizard d'onboarding — styles scopés
   Carte centrée, thème sombre, variables Kendo/Telerik.
   ========================================================= */

.onboarding-wizard[b-s90flrmy1j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 2rem 1rem 3rem;
    box-sizing: border-box;
}

/* Carte principale au milieu de l'écran */
.wizard-card[b-s90flrmy1j] {
    background: var(--kendo-color-surface, #222244);
    border: 1px solid var(--kendo-color-border, #3a3a3a);
    border-radius: 10px;
    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.28);
    width: 100%;
    max-width: 640px;
    padding: 1.75rem 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    box-sizing: border-box;
}

/* ---------- En-tête + progression ---------- */

.wizard-header[b-s90flrmy1j] {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.wizard-header h2[b-s90flrmy1j] {
    margin: 0;
    font-size: 1.7rem;
    text-align: center;
    color: var(--kendo-color-on-app-surface, #e6e6e6);
}

.wizard-progress[b-s90flrmy1j] {
    height: 6px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

.wizard-progress-fill[b-s90flrmy1j] {
    height: 100%;
    border-radius: 6px;
    background: var(--kendo-color-primary, #dc4344);
    transition: width 0.3s ease;
}

.wizard-progress-label[b-s90flrmy1j] {
    font-size: 0.8rem;
    color: var(--kendo-color-subtle, #a9a9b3);
    text-align: center;
    letter-spacing: 0.02em;
}

/* ---------- Corps ---------- */

.wizard-body[b-s90flrmy1j] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    min-height: 180px;
}

.wizard-body h3[b-s90flrmy1j] {
    margin: 0 0 0.2rem;
    font-size: 1.25rem;
    color: var(--kendo-color-on-app-surface, #e6e6e6);
}

.wizard-body h4[b-s90flrmy1j] {
    margin: 0.4rem 0 0.2rem;
    font-size: 1rem;
    color: var(--kendo-color-on-app-surface, #e6e6e6);
}

.wizard-body p[b-s90flrmy1j] {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--kendo-color-subtle, #b9b9c3);
}

/* ---------- Champs de formulaire ---------- */

.field[b-s90flrmy1j] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.field > label[b-s90flrmy1j] {
    font-weight: 500;
    font-size: 0.85rem;
    color: var(--kendo-color-subtle, #a9a9b3);
}

.required-star[b-s90flrmy1j] {
    color: var(--kendo-color-primary, #dc4344);
    margin-left: 2px;
}

/* Largeur pleine par défaut pour les composants Telerik dans une carte */
.field[b-s90flrmy1j]  .k-input,
.field[b-s90flrmy1j]  .k-picker,
.field[b-s90flrmy1j]  .k-textbox {
    width: 100%;
}

/* ---------- Bascule choisir / créer (étape Client unifiée) ---------- */

.mode-switch[b-s90flrmy1j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    margin-top: 0.75rem;
}

.mode-switch-sep[b-s90flrmy1j] {
    font-size: 0.82rem;
    color: var(--kendo-color-subtle, #a9a9b3);
}

/* Lien discret de bascule (revenir à la sélection d'un client) */
.link-back[b-s90flrmy1j] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 0.82rem;
    color: var(--kendo-color-primary, #dc4344);
    font-family: inherit;
}

.link-back:hover[b-s90flrmy1j] {
    text-decoration: underline;
}

/* ---------- Aide contextuelle par étape ---------- */

.step-help[b-s90flrmy1j] {
    border: 1px solid rgba(80, 120, 200, 0.35);
    border-radius: 6px;
    background: rgba(80, 120, 200, 0.08);
    padding: 0.45rem 0.85rem;
    font-size: 0.85rem;
}

.step-help summary[b-s90flrmy1j] {
    cursor: pointer;
    color: #b7c8ef;
    font-weight: 600;
    user-select: none;
}

/* Le contenu vient d'un MarkupString : ses éléments n'ont pas l'attribut de scope CSS, d'où ::deep. */
.step-help-body[b-s90flrmy1j] {
    padding-top: 0.4rem;
    color: var(--kendo-color-on-app-surface, #d6d6e0);
    line-height: 1.5;
}

.step-help-body[b-s90flrmy1j]  p {
    margin: 0 0 0.4rem;
}

.step-help-body[b-s90flrmy1j]  ul {
    margin: 0.2rem 0 0.4rem 1.1rem;
    padding: 0;
}

/* ---------- Callouts (info / succès / erreur) ---------- */

.info-box[b-s90flrmy1j],
.error-box[b-s90flrmy1j] {
    padding: 0.6rem 0.85rem;
    border-radius: 6px;
    font-size: 0.85rem !important;
    line-height: 1.45;
    border: 1px solid transparent;
}

.info-box[b-s90flrmy1j] {
    background: rgba(80, 120, 200, 0.12);
    border-color: rgba(80, 120, 200, 0.35);
    color: #b7c8ef !important;
}

.error-box[b-s90flrmy1j] {
    background: rgba(220, 67, 68, 0.14);
    border-color: rgba(220, 67, 68, 0.4);
    color: #f2a9aa !important;
}

.error-list[b-s90flrmy1j] {
    margin: 0;
    padding-left: 1.2rem;
    color: #f2a9aa;
    font-size: 0.85rem;
}

/* ---------- Barre de navigation ---------- */

.wizard-nav[b-s90flrmy1j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-top: 0.9rem;
    margin-top: 0.4rem;
    border-top: 1px solid var(--kendo-color-border, #3a3a3a);
}

.wizard-nav .nav-left[b-s90flrmy1j],
.wizard-nav .nav-right[b-s90flrmy1j] {
    display: flex;
    gap: 0.5rem;
}

.wizard-nav .nav-right[b-s90flrmy1j] {
    margin-left: auto;
}

/* ---------- Responsive ---------- */

@media (max-width: 680px) {
    .wizard-card[b-s90flrmy1j] {
        padding: 1.25rem 1.1rem 1.1rem;
    }
}

/* Les styles des blocs extraits (formulaire client, connexions ERP, panneau d'installation,
   vérification agent) ont suivi leur markup dans les .razor.css des composants respectifs —
   l'isolation CSS de Blazor ne traverse pas les composants enfants. Le résumé et le passage
   de relais de l'ancienne étape Vérification ont disparu avec elle : le dossier EST la suite. */
/* /Components/Pages/Security/ChangePassword.razor.rz.scp.css */
/* =========================================================
   ChangePassword page — styles scopés
   Même identité visuelle que Login.razor et ForgotPassword.razor
   ========================================================= */

.login-container[b-k3atimskbq] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: var(--kendo-color-app-surface, #1a1a2e);
    padding: 1rem;
}

.login-card[b-k3atimskbq] {
    background: var(--kendo-color-surface, #222244);
    border-radius: 8px;
    padding: 2rem;
    width: 100%;
    max-width: 460px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* En-tête logo + titre */
.login-header[b-k3atimskbq] {
    text-align: center;
    margin-bottom: 0.25rem;
}

.login-logo[b-k3atimskbq] {
    max-width: 200px;
    margin-bottom: 0.5rem;
}

.login-header h2[b-k3atimskbq] {
    margin: 0;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

.login-subtitle[b-k3atimskbq] {
    margin: 0.2rem 0 0;
    font-size: 0.9rem;
    color: var(--kendo-color-subtle, #aaa);
}

/* Alertes — classes status-* du projet */
.login-alert[b-k3atimskbq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.9rem;
    border-radius: 4px;
    font-size: 0.88rem;
}

/* Champs de formulaire */
.form-group[b-k3atimskbq] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin-bottom: 0.5rem;
}

.form-group label[b-k3atimskbq] {
    font-weight: 500;
    font-size: 0.88rem;
    color: var(--kendo-color-subtle, #aaa);
}

.form-actions[b-k3atimskbq] {
    margin-top: 1rem;
    margin-bottom: 0.25rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Bouton étiré sur la place restante — flex: 1 et non width: 100%, parce qu'ici il partage
   la rangée avec le lien « Annuler ».

   Un bouton rendu par Telerik ne porte PAS l'attribut de scope de cette page : une règle
   posée sur sa classe est réécrite en « .login-btn-submit[b-xxxxx] » et ne matche jamais.
   On part donc de notre conteneur et on descend avec ::deep. */
.form-actions[b-k3atimskbq]  .k-button {
    flex: 1;
    justify-content: center;
}

/* Lien Annuler aligné avec le bouton */
.cancel-link[b-k3atimskbq] {
    white-space: nowrap;
    font-size: 0.88rem;
}

/* Liens */
.form-links[b-k3atimskbq] {
    text-align: center;
    margin-top: 0.25rem;
}

.login-link[b-k3atimskbq] {
    color: var(--kendo-color-primary, #4e9af1);
    text-decoration: none;
    font-size: 0.88rem;
}

.login-link:hover[b-k3atimskbq] {
    text-decoration: underline;
}
/* /Components/Pages/Security/ForgotPassword.razor.rz.scp.css */
/* =========================================================
   ForgotPassword page — styles scopés
   Même identité visuelle que Login.razor
   ========================================================= */

.login-container[b-httksiukir] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: var(--kendo-color-app-surface, #1a1a2e);
    padding: 1rem;
}

.login-card[b-httksiukir] {
    background: var(--kendo-color-surface, #222244);
    border-radius: 8px;
    padding: 2rem;
    width: 100%;
    max-width: 460px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* En-tête logo + titre */
.login-header[b-httksiukir] {
    text-align: center;
    margin-bottom: 0.25rem;
}

.login-logo[b-httksiukir] {
    max-width: 200px;
    margin-bottom: 0.5rem;
}

.login-header h2[b-httksiukir] {
    margin: 0;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

.login-subtitle[b-httksiukir] {
    margin: 0.2rem 0 0;
    font-size: 0.9rem;
    color: var(--kendo-color-subtle, #aaa);
}

/* Alertes — classes status-* du projet */
.login-alert[b-httksiukir] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.9rem;
    border-radius: 4px;
    font-size: 0.88rem;
}

/* Texte d'instructions */
.login-instructions[b-httksiukir] {
    font-size: 0.9rem;
    color: var(--kendo-color-subtle, #aaa);
    margin: 0;
}

/* Champs de formulaire */
.form-group[b-httksiukir] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin-bottom: 0.5rem;
}

.form-group label[b-httksiukir] {
    font-weight: 500;
    font-size: 0.88rem;
    color: var(--kendo-color-subtle, #aaa);
}

.form-actions[b-httksiukir] {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

/* Bouton pleine largeur.

   Un bouton rendu par Telerik ne porte PAS l'attribut de scope de cette page : une règle
   posée sur sa classe est réécrite en « .login-btn-submit[b-xxxxx] » et ne matche jamais.
   On part donc de notre conteneur et on descend avec ::deep. */
.form-actions[b-httksiukir]  .k-button {
    width: 100%;
    justify-content: center;
}

/* Liens */
.form-links[b-httksiukir] {
    text-align: center;
    margin-top: 0.25rem;
}

.login-link[b-httksiukir] {
    color: var(--kendo-color-primary, #4e9af1);
    text-decoration: none;
    font-size: 0.88rem;
}

.login-link:hover[b-httksiukir] {
    text-decoration: underline;
}
/* /Components/Pages/Security/Login.razor.rz.scp.css */
/* =========================================================
   Connexion — styles scopés

   Même gabarit que /signup : formulaire à gauche, argumentaire de marque à droite. Les
   deux pages se suivent dans le parcours ; deux mises en page différentes donneraient
   l'impression de changer de produit en cours de route.
   ========================================================= */

.login-page[b-7c8r6zhwns] {
    display: grid;
    grid-template-columns: 1fr 1fr;

    /* Rangée explicitement en 1fr : une rangée « auto » se dimensionnerait sur le contenu
       de ses items et ferait grandir la grille au-delà de sa propre hauteur — le
       débordement reviendrait alors dans body. */
    grid-template-rows: 1fr;

    /* height et non min-height : body est une colonne flex de hauteur fixe en
       overflow:hidden (voir app.css). Ce qui dépasse du viewport est rogné SANS barre de
       défilement, donc hors d'atteinte. On se cale sur le viewport et on fait défiler à
       l'intérieur du volet. */
    height: 100vh;
    height: 100dvh; /* dvh : exclut la barre d'adresse mobile (fallback vh ci-dessus) */

    background: var(--kendo-color-app-surface, #1a1a2e);
}

/* ─────────────────────────────── Volet formulaire ─────────────────────────────── */

.login-form-pane[b-7c8r6zhwns] {
    display: flex;
    padding: 2.5rem 2rem;
    background: var(--kendo-color-surface, #222244);

    /* Le formulaire est dense — SSO, deux champs, une case, trois liens, et jusqu'à trois
       alertes empilées. C'est ICI qu'on défile, jamais dans body. min-height: 0 pour que
       l'item de grille accepte d'être plus court que son contenu. */
    overflow-y: auto;
    min-height: 0;
}

.login-form-inner[b-7c8r6zhwns] {
    width: 100%;
    max-width: 420px;

    /* Centrage par marges auto, et non par align-items/justify-content: center — dès que le
       contenu dépasse la hauteur du volet, les marges auto retombent à zéro et le haut du
       formulaire reste atteignable au défilement. Un centrage flex le rendrait
       définitivement inaccessible. */
    margin: auto;

    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* En-tête centré : logo, titre et accroche. Le centrage s'arrête là — les libellés des
   champs restent alignés à gauche, sinon le formulaire devient pénible à parcourir. */
.login-logo[b-7c8r6zhwns] {
    max-width: 190px;
    margin-bottom: 0.5rem;
    margin-inline: auto;
}

/* Le h1 global fait 42px : hors d'échelle dans une colonne de 420 px. */
.login-form-inner h1[b-7c8r6zhwns] {
    margin: 0;
    font-size: 1.5rem;
    text-align: center;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

.login-lead[b-7c8r6zhwns] {
    margin: 0.3rem 0 0;
    font-size: 0.9rem;
    line-height: 1.45;
    text-align: center;
    color: var(--kendo-color-subtle, #aaa);
}

.login-subtitle[b-7c8r6zhwns] {
    margin: 0.2rem 0 0;
    font-size: 0.9rem;
    color: var(--kendo-color-subtle, #aaa);
}

/* Alertes — utilise les classes status-* du projet */
.login-alert[b-7c8r6zhwns] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.9rem;
    border-radius: 4px;
    font-size: 0.88rem;
}

/* Boutons pleine largeur.

   Un bouton rendu par Telerik ne porte PAS l'attribut de scope de cette page : une règle
   posée sur sa classe est réécrite en « .login-btn-submit[b-xxxxx] » et ne matche jamais.
   C'est pour ça que ces boutons étaient à largeur intrinsèque malgré un width: 100%.

   On part donc d'un conteneur qui est le nôtre et on descend avec ::deep. Ne pas remonter
   jusqu'à la carte : cela étirerait aussi les .k-button internes d'un futur composant
   Telerik (bascule de liste déroulante, incrémenteur). */
.login-sso[b-7c8r6zhwns]  .k-button,
.form-actions[b-7c8r6zhwns]  .k-button {
    width: 100%;
    justify-content: center;
}

/* Logo + libellé du bouton SSO. L'alignement se fait sur notre propre span : passer par le
   .k-button-text de Telerik marcherait aussi, mais nous rendrait tributaires d'un nom de
   classe interne. */
.login-sso[b-7c8r6zhwns]  .login-sso-label {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.login-sso[b-7c8r6zhwns]  .login-sso-label img {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

/* Séparateur "ou" */
.login-separator[b-7c8r6zhwns] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--kendo-color-subtle, #aaa);
    font-size: 0.82rem;
}

.login-separator[b-7c8r6zhwns]::before,
.login-separator[b-7c8r6zhwns]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
}

/* Champs de formulaire */
.form-group[b-7c8r6zhwns] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin-bottom: 0.5rem;
}

.form-group label[b-7c8r6zhwns] {
    font-weight: 500;
    font-size: 0.88rem;
    color: var(--kendo-color-subtle, #aaa);
}

.checkbox-group[b-7c8r6zhwns] {
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1em;
    margin-top: 1em;
}

.form-actions[b-7c8r6zhwns] {
    margin-top: 0.5rem;
}

/* Lien mot de passe oublié */
.form-links[b-7c8r6zhwns] {
    text-align: center;
    margin-top: 0.25rem;
}

.form-links a[b-7c8r6zhwns],
.login-link[b-7c8r6zhwns] {
    color: var(--kendo-color-primary, #4e9af1);
    text-decoration: none;
    font-size: 0.88rem;
}

.form-links a:hover[b-7c8r6zhwns],
.login-link:hover[b-7c8r6zhwns] {
    text-decoration: underline;
}

/* ─────────────────────────────── Volet marque ─────────────────────────────── */

/* Purement décoratif : s'il ne rentre pas, on rogne ICI plutôt que de laisser le volet
   pousser la page hors du viewport. min-height: 0 annule la taille minimale automatique de
   l'item de grille, qui sinon imposerait la hauteur de son contenu. */
.login-brand-pane[b-7c8r6zhwns] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.5rem;
    padding: 3rem 1.25rem;
    min-height: 0;
    overflow: hidden;
}

/* Animation de marque.

   La page d'animation mesure elle-même son cadre (ResizeObserver) et y adapte la
   composition 1280x720 : l'iframe remplit simplement sa boîte. Voir Signup.razor.css, qui
   porte le même bloc. */
.login-brand-anim[b-7c8r6zhwns] {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 8px;
    overflow: hidden;
    background: #06070A;
}

.login-brand-anim iframe[b-7c8r6zhwns] {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

/* 1,25rem (volet) + 1,75rem = le retrait de 3rem que le texte aurait eu sans la marge
   resserrée du volet, qui existe pour laisser l'animation approcher les bords. */
.login-brand-title[b-7c8r6zhwns],
.login-brand-lead[b-7c8r6zhwns] {
    padding-inline: 1.75rem;
}

.login-brand-title[b-7c8r6zhwns] {
    margin: 0;
    font-size: 1.9rem;
    line-height: 1.25;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

.login-brand-lead[b-7c8r6zhwns] {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--kendo-color-subtle, #aaa);
}

/* ─────────────────────────────── Responsive ─────────────────────────────── */

/* Sous 900 px, l'argumentaire s'efface et le formulaire prend toute la largeur. */
@media (max-width: 900px) {
    .login-page[b-7c8r6zhwns] {
        grid-template-columns: 1fr;
    }

    .login-brand-pane[b-7c8r6zhwns] {
        display: none;
    }
}

@media (max-width: 520px) {
    .login-form-pane[b-7c8r6zhwns] {
        padding: 1.5rem 1rem;
    }
}
/* /Components/Pages/Security/MyProfile.razor.rz.scp.css */
/* =========================================================
   MyProfile page — styles scopés
   ========================================================= */

/* Conteneur principal — limiter la largeur et centrer */
.my-profile-container[b-akwam7s8xl] {
    max-width: 760px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.5rem 1rem;
}

/* ── Carte d'informations lecture seule ─────────────────── */

.my-profile-info-card[b-akwam7s8xl] {
    background: var(--kendo-color-surface-alt, #2a2a44);
    border: 1px solid var(--kendo-color-border, #3a3a55);
    border-radius: 8px;
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.my-profile-info-row[b-akwam7s8xl] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.my-profile-label[b-akwam7s8xl] {
    font-size: 0.78rem;
    color: var(--kendo-color-subtle-text, #999);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.my-profile-value[b-akwam7s8xl] {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

/* ── Sections du formulaire ─────────────────────────────── */

.edit-panel-section[b-akwam7s8xl] {
    background: var(--kendo-color-surface-alt, #2a2a44);
    border: 1px solid var(--kendo-color-border, #3a3a55);
    border-radius: 8px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.edit-panel-section-title[b-akwam7s8xl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 0.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

.edit-panel-section-hint[b-akwam7s8xl] {
    font-size: 0.78rem;
    font-weight: 400;
    color: var(--kendo-color-subtle-text, #999);
    margin-left: 0.25rem;
}

/* ── Champs de formulaire ───────────────────────────────── */

.form-group[b-akwam7s8xl] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.form-group label[b-akwam7s8xl] {
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--kendo-color-subtle, #aaa);
}

/* Grille 2 colonnes pour les champs côte à côte */
.form-row-2col[b-akwam7s8xl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

@media (max-width: 560px) {
    .form-row-2col[b-akwam7s8xl] {
        grid-template-columns: 1fr;
    }
}

/* ── Boutons d'action ───────────────────────────────────── */

.my-profile-actions[b-akwam7s8xl] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    padding-top: 0.5rem;
}
/* /Components/Pages/Security/ResetPassword.razor.rz.scp.css */
/* =========================================================
   ResetPassword page — styles scopés
   Même identité visuelle que Login.razor
   ========================================================= */

.login-container[b-co9zpnvagc] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: var(--kendo-color-app-surface, #1a1a2e);
    padding: 1rem;
}

.login-card[b-co9zpnvagc] {
    background: var(--kendo-color-surface, #222244);
    border-radius: 8px;
    padding: 2rem;
    width: 100%;
    max-width: 460px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* En-tête logo + titre */
.login-header[b-co9zpnvagc] {
    text-align: center;
    margin-bottom: 0.25rem;
}

.login-logo[b-co9zpnvagc] {
    max-width: 200px;
    margin-bottom: 0.5rem;
}

.login-header h2[b-co9zpnvagc] {
    margin: 0;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

.login-subtitle[b-co9zpnvagc] {
    margin: 0.2rem 0 0;
    font-size: 0.9rem;
    color: var(--kendo-color-subtle, #aaa);
}

/* Alertes — classes status-* du projet */
.login-alert[b-co9zpnvagc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.9rem;
    border-radius: 4px;
    font-size: 0.88rem;
}

/* Champs de formulaire */
.form-group[b-co9zpnvagc] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin-bottom: 0.5rem;
}

.form-group label[b-co9zpnvagc] {
    font-weight: 500;
    font-size: 0.88rem;
    color: var(--kendo-color-subtle, #aaa);
}

.form-actions[b-co9zpnvagc] {
    margin-top: 0.5rem;
}

/* Bouton pleine largeur.

   Un bouton rendu par Telerik ne porte PAS l'attribut de scope de cette page : une règle
   posée sur sa classe est réécrite en « .login-btn-submit[b-xxxxx] » et ne matche jamais.
   On part donc de notre conteneur et on descend avec ::deep. */
.form-actions[b-co9zpnvagc]  .k-button {
    width: 100%;
    justify-content: center;
}

/* Liens */
.form-links[b-co9zpnvagc] {
    text-align: center;
    margin-top: 0.25rem;
}

.login-link[b-co9zpnvagc] {
    color: var(--kendo-color-primary, #4e9af1);
    text-decoration: none;
    font-size: 0.88rem;
}

.login-link:hover[b-co9zpnvagc] {
    text-decoration: underline;
}
/* /Components/Pages/Security/Signup.razor.rz.scp.css */
/* =========================================================
   Signup — styles scopés

   Mise en page deux colonnes : le formulaire à gauche, l'argumentaire à droite.
   Le découpage visuel vient du contraste entre les deux surfaces Kendo déjà
   utilisées par la page de connexion — volontairement, pour que /signup ne
   ressemble pas à une page étrangère au portail.
   ========================================================= */

.signup-page[b-1j1mwyfuc8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 100vh;
    background: var(--kendo-color-app-surface, #1a1a2e);
}

/* ─────────────────────────────── Volet formulaire ─────────────────────────────── */

.signup-form-pane[b-1j1mwyfuc8] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 2rem;
    background: var(--kendo-color-surface, #222244);
}

.signup-form-inner[b-1j1mwyfuc8] {
    width: 100%;
    max-width: 420px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* En-tête centré : logo, titre et accroche. Le centrage s'arrête là — les libellés des
   champs restent alignés à gauche, sinon le formulaire devient pénible à parcourir. */
.signup-logo[b-1j1mwyfuc8] {
    max-width: 190px;
    margin-bottom: 0.5rem;
    margin-inline: auto;
}

.signup-form-inner h1[b-1j1mwyfuc8] {
    margin: 0;
    font-size: 1.5rem;
    text-align: center;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

.signup-lead[b-1j1mwyfuc8] {
    margin: 0.3rem 0 0;
    font-size: 0.9rem;
    line-height: 1.45;
    text-align: center;
    color: var(--kendo-color-subtle, #aaa);
}

/* Alertes — reprend les classes status-* globales du projet pour les couleurs */
.signup-alert[b-1j1mwyfuc8] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.65rem 0.9rem;
    border-radius: 4px;
    font-size: 0.88rem;
    line-height: 1.5;
}

/* Prénom + nom côte à côte, empilés sur mobile */
.signup-row[b-1j1mwyfuc8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.form-group[b-1j1mwyfuc8] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin-bottom: 0.5rem;
}

.form-group label[b-1j1mwyfuc8] {
    font-weight: 500;
    font-size: 0.88rem;
    color: var(--kendo-color-subtle, #aaa);
}

.signup-hint[b-1j1mwyfuc8] {
    margin: 0.1rem 0 0;
    font-size: 0.78rem;
    color: var(--kendo-color-subtle, #aaa);
    opacity: 0.85;
}

.signup-actions[b-1j1mwyfuc8] {
    margin-top: 0.5rem;
}

/* Le bouton est rendu par Telerik : il ne porte donc pas l'attribut de scope de
   cette page, et une règle posée sur sa classe ne matcherait jamais. On part de
   notre propre conteneur et on descend avec ::deep. */
.signup-actions[b-1j1mwyfuc8]  .k-button {
    width: 100%;
    justify-content: center;
}

/* Le code OTP : espacé et centré, pour qu'on le relise facilement.
   ::deep est indispensable — le <input> est rendu par le composant Telerik,
   il ne porte donc pas l'attribut de scope de cette page. */
.signup-otp-code[b-1j1mwyfuc8]  input {
    text-align: center;
    letter-spacing: 0.4em;
    font-size: 1.15rem;
}

/* Pied de volet : liens secondaires */
.signup-footer[b-1j1mwyfuc8] {
    margin: 0.25rem 0 0;
    text-align: center;
    font-size: 0.88rem;
    color: var(--kendo-color-subtle, #aaa);
}

.signup-link[b-1j1mwyfuc8] {
    color: var(--kendo-color-primary, #4e9af1);
    text-decoration: none;
}

.signup-link:hover[b-1j1mwyfuc8] {
    text-decoration: underline;
}

.signup-sep[b-1j1mwyfuc8] {
    margin: 0 0.4rem;
    color: var(--kendo-color-subtle, #aaa);
    opacity: 0.6;
}

/* Bouton natif rendu comme un lien — évite le splatting d'attributs sur Telerik */
.signup-linkbtn[b-1j1mwyfuc8] {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: var(--kendo-color-primary, #4e9af1);
    cursor: pointer;
}

.signup-linkbtn:hover[b-1j1mwyfuc8] {
    text-decoration: underline;
}

.signup-linkbtn:disabled[b-1j1mwyfuc8] {
    opacity: 0.5;
    cursor: default;
    text-decoration: none;
}

/* ─────────────────────────────── Volet marque ─────────────────────────────── */

/* La marge horizontale du volet est réduite pour que l'animation approche les bords de la
   page : à cette taille, chaque pixel gagné compte pour la lisibilité de son texte. Le
   retrait d'origine est rendu au texte seul, plus bas — lui n'a rien à y gagner. */
.signup-brand-pane[b-1j1mwyfuc8] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.75rem;
    padding: 3rem 1.25rem;
}

/* Animation de marque.

   La page d'animation mesure elle-même son cadre (ResizeObserver) et y adapte la
   composition 1280x720. Inutile de refaire ce calcul en CSS : l'iframe remplit sa boîte,
   point. C'est aussi meilleur que de la mettre à l'échelle de l'extérieur — le texte est
   alors rendu à sa résolution finale au lieu d'être dessiné en 1280 puis réduit.

   Le fond reprend celui de l'animation, au pixel près : la bascule vers l'iframe ne se
   voit pas. */
.signup-brand-anim[b-1j1mwyfuc8] {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 8px;
    overflow: hidden;
    background: #06070A;
}

.signup-brand-anim iframe[b-1j1mwyfuc8] {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

/* 1,25rem (volet) + 1,75rem = les 3rem de retrait que le texte avait avant qu'on resserre
   la marge du volet pour l'animation. */
.signup-brand-title[b-1j1mwyfuc8],
.signup-brand-list[b-1j1mwyfuc8] {
    padding-inline: 1.75rem;
}

.signup-brand-title[b-1j1mwyfuc8] {
    margin: 0;
    font-size: 1.9rem;
    line-height: 1.25;
    color: var(--kendo-color-on-app-surface, #e0e0e0);
}

.signup-brand-list[b-1j1mwyfuc8] {
    list-style: none;
    margin: 0;
    padding-block: 0;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.signup-brand-list li[b-1j1mwyfuc8] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--kendo-color-subtle, #aaa);
}

.signup-brand-check[b-1j1mwyfuc8] {
    flex-shrink: 0;
    margin-top: 0.15rem;
    color: var(--kendo-color-primary, #4e9af1);
}

/* ─────────────────────────────── Responsive ─────────────────────────────── */

/* Sous 900 px, l'argumentaire s'effface et le formulaire prend toute la largeur. */
@media (max-width: 900px) {
    .signup-page[b-1j1mwyfuc8] {
        grid-template-columns: 1fr;
    }

    .signup-brand-pane[b-1j1mwyfuc8] {
        display: none;
    }
}

@media (max-width: 520px) {
    .signup-row[b-1j1mwyfuc8] {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .signup-form-pane[b-1j1mwyfuc8] {
        padding: 1.5rem 1rem;
    }
}
/* /Components/Pages/Security/User.razor.rz.scp.css */
/* ─── Custom context menu ─── */

.custom-context-menu-backdrop[b-ni7rbx0c3t] {
    position: fixed;
    inset: 0;
    z-index: 9998;
}

.custom-context-menu[b-ni7rbx0c3t] {
    position: fixed;
    z-index: 9999;
    background: var(--kendo-color-surface-alt, #2b2b2b);
    border: 1px solid var(--kendo-color-border, #444);
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
    min-width: 200px;
    padding: 4px 0;
}

.custom-context-menu ul[b-ni7rbx0c3t] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.custom-context-menu li[b-ni7rbx0c3t] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    cursor: pointer;
    font-size: .9em;
    color: var(--kendo-color-on-surface, #ddd);
    transition: background 0.15s;
}

.custom-context-menu li:hover[b-ni7rbx0c3t] {
    background: var(--kendo-color-primary-subtle, rgba(13, 110, 253, 0.15));
}

.custom-context-menu li.context-menu-danger:hover[b-ni7rbx0c3t] {
    background: rgba(220, 53, 69, 0.2);
    color: #f59da0;
}
/* /Components/Pages/Security/UserRightsEditor.razor.rz.scp.css */
.rights-editor[b-uyabm33evh] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 8px 4px;
}

/* ── Sections ── */

.rights-section[b-uyabm33evh] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: 6px;
    padding: 14px 16px;
}

.rights-section-title[b-uyabm33evh] {
    margin: 0 0 12px 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    border-bottom: 1px solid var(--kendo-color-border);
    padding-bottom: 8px;
}

/* ── Formulaire ── */

.rights-form-box[b-uyabm33evh] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: 4px;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rights-form-row[b-uyabm33evh] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.rights-form-actions[b-uyabm33evh] {
    padding-top: 6px;
    border-top: 1px solid var(--kendo-color-border);
    justify-content: flex-end;
}

/* Séparateur vertical entre groupes de champs */
.rights-form-separator[b-uyabm33evh] {
    width: 1px;
    height: 24px;
    background: var(--kendo-color-border);
    margin: 0 4px;
    flex-shrink: 0;
}

/* ── Textes ── */

.rights-label[b-uyabm33evh] {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--kendo-color-on-app-surface);
    white-space: nowrap;
}

.rights-radio-label[b-uyabm33evh] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--kendo-color-on-app-surface);
    white-space: nowrap;
}

/* ── Toggle vue ── */

.rights-view-toggle[b-uyabm33evh] {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--kendo-color-border);
}

/* ── Grille ── */

.rights-grid[b-uyabm33evh] {
    margin-top: 4px;
}

.rights-empty-message[b-uyabm33evh] {
    color: var(--kendo-color-subtle);
    font-style: italic;
    margin: 12px 0 0 0;
    font-size: 0.875rem;
}
/* /Components/Pages/SyncEngine/SchedulingJobDetail.razor.rz.scp.css */
.job-detail-page[b-014r0b74mc] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.job-detail-header[b-014r0b74mc] {
    display: flex;
    align-items: center;
}
/* /Components/Pages/SyncEngine/SchedulingJobHeader.razor.rz.scp.css */
.licence-filter[b-t219p813rs] {
    display: flex;
    align-items: center;
}
/* /Components/Pages/SyncEngine/SchedulingJobHistory.razor.rz.scp.css */
/* Styles spécifiques au composant SyncBatchDetailGrid — voir SyncBatchDetailGrid.razor.css */
/* /Components/Pages/SyncEngine/SchedulingJobRunning.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════
   SchedulingJobRunning — Scoped styles
   ═══════════════════════════════════════════════════════════════ */

.system-status-section .status-card[b-cwjyjhpt0j] {
    border-radius: 8px;
    transition: box-shadow 0.2s;
}

.system-status-section .status-card:hover[b-cwjyjhpt0j] {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

.status-icon[b-cwjyjhpt0j] {
    margin-bottom: 8px;
}

.status-label[b-cwjyjhpt0j] {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--kendo-color-subtle, #6c757d);
    margin-bottom: 4px;
}

.status-value[b-cwjyjhpt0j] {
    font-size: 1.1rem;
    font-weight: 600;
}

/* ── Running job cards ── */

.running-job-card[b-cwjyjhpt0j] {
    border-left: 4px solid var(--kendo-color-primary, #0d6efd);
}
/* /Components/Pages/SyncEngine/SyncBatchHeaders.razor.rz.scp.css */

/* Stats badges (grille batch headers) */

[b-ks0b1gf115] .stats-grid {
    display: grid;
    grid-template-columns: repeat(3, auto);
    gap: 3px 5px;
    font-size: .78em;
}

[b-ks0b1gf115] .stat-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 7px;
    border-radius: 4px;
    font-weight: 500;
    white-space: nowrap;
    line-height: 1.5;
}

[b-ks0b1gf115] .stat-badge .stat-label {
    opacity: .7;
    font-weight: 400;
}

[b-ks0b1gf115] .stat-total {
    background: #3a3a4a;
    color: #ccc;
}

[b-ks0b1gf115] .stat-success {
    background: #143d1a;
    color: #6fcf7c;
}

[b-ks0b1gf115] .stat-fail {
    background: #3d1417;
    color: #f59da0;
}

[b-ks0b1gf115] .stat-new {
    background: #142a3d;
    color: #6fb8e8;
}

[b-ks0b1gf115] .stat-update {
    background: #2d2a3d;
    color: #b0a8d8;
}

[b-ks0b1gf115] .stat-skip {
    background: #3d3520;
    color: #d4c47a;
}

/* ── Context menu ── */

.custom-context-menu-backdrop[b-ks0b1gf115] {
    position: fixed;
    inset: 0;
    z-index: 10000;
}

.custom-context-menu[b-ks0b1gf115] {
    position: fixed;
    z-index: 10001;
    background: var(--kendo-color-surface, #2b2b3b);
    border: 1px solid var(--kendo-color-border, #444);
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
    min-width: 260px;
    padding: 4px 0;
}

.custom-context-menu ul[b-ks0b1gf115] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.custom-context-menu li[b-ks0b1gf115] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    cursor: pointer;
    font-size: 0.88rem;
    color: var(--kendo-color-on-app-surface, #ddd);
    transition: background 0.15s;
}

.custom-context-menu li:hover[b-ks0b1gf115] {
    background: var(--kendo-color-primary, #0d6efd);
    color: #fff;
}

.custom-context-menu li.context-menu-danger:hover[b-ks0b1gf115] {
    background: #dc3545;
    color: #fff;
}