/* Surcharges Syncfusion EJ2 pour coller a la charte graphique NeoCompta (theme Velzon).
   Meme principe que kendoCustom.css : on garde le theme "bootstrap5" fourni par Syncfusion
   et on ne touche que les couleurs / la typo / les rayons pour matcher la marque.
   On s'appuie sur les variables --vz-* deja exposees par app.css (theme actif) plutot que
   des couleurs figees, pour suivre automatiquement le skin (data-theme-colors) actif. */

.e-grid,
.e-toolbar,
.e-dropdownlist,
.e-ddl,
.e-input-group input.e-input,
.e-input-group textarea.e-input,
.e-richtexteditor,
.e-upload {
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
}

/* Champs texte / dropdown : meme habillage que les champs Kendo (.k-input-inner) */
.e-input-group,
.e-input-group.e-control-wrapper,
.e-ddl.e-input-group {
    border-color: rgb(206, 212, 218);
    border-radius: .25rem;
}

.e-input-group.e-input-focus,
.e-input-group.e-control-wrapper.e-input-focus,
.e-ddl.e-input-group.e-input-focus {
    border-color: var(--vz-primary, #405189);
    box-shadow: 0 0 0 0.15rem rgba(var(--vz-primary-rgb, 64, 81, 137), 0.25);
}

/* Popup de selection des dropdowns */
.e-ddl.e-popup .e-list-item.e-active,
.e-ddl.e-popup .e-list-item.e-active.e-hover {
    background-color: var(--vz-primary, #405189);
    border-color: var(--vz-primary, #405189);
    color: #fff;
}

/* Switch (ejs-switch) aligne sur la couleur primaire du site */
.e-switch-wrapper .e-switch-on,
.e-css.e-switch-wrapper .e-switch-on {
    background-color: var(--vz-primary, #405189);
    border-color: var(--vz-primary, #405189);
}

.e-switch-wrapper .e-switch-handle.e-switch-active,
.e-css.e-switch-wrapper .e-switch-handle.e-switch-active {
    border-color: var(--vz-primary, #405189);
}

/* Boutons */
.e-btn.e-primary,
.e-css.e-btn.e-primary {
    background-color: var(--vz-primary, #405189);
    border-color: var(--vz-primary, #405189);
}

.e-btn.e-primary:hover,
.e-css.e-btn.e-primary:hover {
    background-color: var(--vz-primary-hover, #364775);
    border-color: var(--vz-primary-hover, #364775);
}

.e-btn.e-flat.e-primary,
.e-css.e-btn.e-flat.e-primary {
    color: var(--vz-primary, #405189);
}

/* Grille */
.e-grid .e-headercell,
.e-grid .e-detailheadercell {
    background-color: var(--vz-light, #f3f6f9);
    color: var(--vz-heading-color, #212529);
    font-weight: 600;
}

.e-grid .e-row:hover .e-rowcell,
.e-grid .e-row.e-hovered .e-rowcell {
    background-color: rgba(var(--vz-primary-rgb, 64, 81, 137), 0.05);
}

.e-grid .e-row.e-selectionbackground .e-rowcell {
    background-color: rgba(var(--vz-primary-rgb, 64, 81, 137), 0.1) !important;
}

/* Pagination */
.e-pager .e-currentitem,
.e-pager .e-currentitem:hover {
    background-color: var(--vz-primary, #405189);
    border-color: var(--vz-primary, #405189);
    color: #fff;
}

/* Toolbar (grille / editeur de texte riche) */
.e-toolbar .e-toolbar-item.e-active .e-tbar-btn,
.e-toolbar .e-toolbar-item .e-tbar-btn:hover {
    background-color: rgba(var(--vz-primary-rgb, 64, 81, 137), 0.1);
    color: var(--vz-primary, #405189);
}

.e-richtexteditor .e-rte-toolbar {
    border-radius: .25rem .25rem 0 0;
}

/* Uploader */
.e-upload .e-upload-browse-btn,
.e-upload .e-css.e-btn.e-flat {
    color: var(--vz-primary, #405189);
}