:root {
    --uxp-font-default: 'Rubik', 'Helvetica', 'Arial', sans-serif;
    --uxp-font-monospace: 'Chivo Mono', monospace;
    --uxp-font-icon: 'Font Awesome 7 Free';
    --uxp-modal-close-button: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
    /* --------------------------------------------------------- */
    /* --- PALETTE --------------------------------------------- */
    /* --------------------------------------------------------- */
    /* --- Gradient --- */
    --uxp-palette-gradient-orange-light: #fe9921;
    --uxp-palette-gradient-orange-dark: #f15f11;
    /* --- Neutral --- */
    --uxp-palette-neutral-50: #fafafb;
    --uxp-palette-neutral-100: #f1f2f4;
    --uxp-palette-neutral-150: #e7eaec;
    --uxp-palette-neutral-200: #e0e4e7;
    --uxp-palette-neutral-250: #d7dce0;
    --uxp-palette-neutral-300: #cad1d7;
    --uxp-palette-neutral-350: #bac2c9;
    --uxp-palette-neutral-400: #a6afb8;
    --uxp-palette-neutral-500: #95a1ad;
    --uxp-palette-neutral-600: #89929a;
    --uxp-palette-neutral-700: #63717f;
    --uxp-palette-neutral-750: #495866;
    --uxp-palette-neutral-800: #364553;
    --uxp-palette-neutral-850: #2c3945;
    --uxp-palette-neutral-900: #26303a;
    --uxp-palette-neutral-950: #1e272f;
    --uxp-palette-neutral-1000: #0e1317;
    --uxp-palette-neutral-1100: #090c0f;
    --uxp-palette-neutral-black: #000000;
    --uxp-palette-neutral-white: #ffffff;
    /* --- Magenta --- */
    --uxp-palette-magenta-100: #fff0f9;
    --uxp-palette-magenta-200: #fadeef;
    --uxp-palette-magenta-250: #fac5e6;
    --uxp-palette-magenta-300: #fa91d2;
    --uxp-palette-magenta-400: #fa69c2;
    --uxp-palette-magenta-500: #fa2dab;
    --uxp-palette-magenta-600: #de048a;
    --uxp-palette-magenta-700: #bf0477;
    --uxp-palette-magenta-800: #9c0361;
    --uxp-palette-magenta-850: #7d024e;
    --uxp-palette-magenta-900: #5e023b;
    --uxp-palette-magenta-1000: #43012a;
    /* --- Pink --- */
    --uxp-palette-pink-100: #fff0f7;
    --uxp-palette-pink-200: #ffe0f0;
    --uxp-palette-pink-250: #ffc7e3;
    --uxp-palette-pink-300: #ff99cc;
    --uxp-palette-pink-400: #ff66b2;
    --uxp-palette-pink-500: #ff3399;
    --uxp-palette-pink-600: #e50571;
    --uxp-palette-pink-700: #bb045f;
    --uxp-palette-pink-800: #8f0348;
    --uxp-palette-pink-850: #660234;
    --uxp-palette-pink-900: #4d0121;
    --uxp-palette-pink-1000: #290111;
    /* --- Rose --- */
    --uxp-palette-rose-100: #fff5f8;
    --uxp-palette-rose-200: #ffe0e8;
    --uxp-palette-rose-250: #ffc2d1;
    --uxp-palette-rose-300: #ff8fab;
    --uxp-palette-rose-400: #ff5c85;
    --uxp-palette-rose-500: #ff3b6c;
    --uxp-palette-rose-600: #eb053f;
    --uxp-palette-rose-700: #c20433;
    --uxp-palette-rose-800: #940327;
    --uxp-palette-rose-850: #6b021d;
    --uxp-palette-rose-900: #4d0114;
    --uxp-palette-rose-1000: #26010a;
    /* --- Red --- */
    --uxp-palette-red-100: #fff0f0;
    --uxp-palette-red-200: #ffe0e0;
    --uxp-palette-red-250: #ffc2c2;
    --uxp-palette-red-300: #ff8f8f;
    --uxp-palette-red-400: #ff5c5c;
    --uxp-palette-red-500: #ff3d3d;
    --uxp-palette-red-600: #db0404;
    --uxp-palette-red-700: #c20404;
    --uxp-palette-red-800: #990303;
    --uxp-palette-red-850: #700202;
    --uxp-palette-red-900: #470101;
    --uxp-palette-red-1000: #290101;
    /* --- Pumpkin --- */
    --uxp-palette-pumpkin-100: #ffefeb;
    --uxp-palette-pumpkin-200: #ffe0d6;
    --uxp-palette-pumpkin-250: #ffc0ad;
    --uxp-palette-pumpkin-300: #ff997a;
    --uxp-palette-pumpkin-400: #ff6a3d;
    --uxp-palette-pumpkin-500: #ff4b14;
    --uxp-palette-pumpkin-600: #db3604;
    --uxp-palette-pumpkin-700: #a82a03;
    --uxp-palette-pumpkin-800: #8a2203;
    --uxp-palette-pumpkin-850: #661a02;
    --uxp-palette-pumpkin-900: #3d1001;
    --uxp-palette-pumpkin-1000: #210801;
    /* --- Primary --- */
    --uxp-palette-primary-100: #fff0e8;
    --uxp-palette-primary-200: #ffdecd;
    --uxp-palette-primary-250: #ffcbaf;
    --uxp-palette-primary-300: #ffa97a;
    --uxp-palette-primary-400: #ff894a;
    --uxp-palette-primary-500: #f15f11;
    --uxp-palette-primary-600: #d94c00;
    --uxp-palette-primary-700: #a63c02;
    --uxp-palette-primary-800: #7a2b00;
    --uxp-palette-primary-850: #5e2100;
    --uxp-palette-primary-900: #401600;
    --uxp-palette-primary-1000: #260d00;
    /* --- Orange --- */
    --uxp-palette-orange-100: #fff9eb;
    --uxp-palette-orange-200: #ffe8bd;
    --uxp-palette-orange-250: #ffd78a;
    --uxp-palette-orange-300: #ffc35c;
    --uxp-palette-orange-400: #ffa929;
    --uxp-palette-orange-500: #fa9805;
    --uxp-palette-orange-600: #d98404;
    --uxp-palette-orange-700: #9e6003;
    --uxp-palette-orange-800: #7a4a02;
    --uxp-palette-orange-850: #5c3802;
    --uxp-palette-orange-900: #3b2401;
    --uxp-palette-orange-1000: #1f1301;
    /* --- Yellow --- */
    --uxp-palette-yellow-100: #fffde0;
    --uxp-palette-yellow-200: #fffbbd;
    --uxp-palette-yellow-250: #fef571;
    --uxp-palette-yellow-300: #ffed4d;
    --uxp-palette-yellow-400: #ffd905;
    --uxp-palette-yellow-500: #e8c605;
    --uxp-palette-yellow-600: #d4b404;
    --uxp-palette-yellow-700: #9e8703;
    --uxp-palette-yellow-800: #7a6802;
    --uxp-palette-yellow-850: #4a3f01;
    --uxp-palette-yellow-900: #2e2701;
    --uxp-palette-yellow-1000: #1c1801;
    /* --- Lime --- */
    --uxp-palette-lime-100: #f7ffeb;
    --uxp-palette-lime-200: #ebffcc;
    --uxp-palette-lime-250: #d2ff8a;
    --uxp-palette-lime-300: #afff2e;
    --uxp-palette-lime-400: #86d604;
    --uxp-palette-lime-500: #73b804;
    --uxp-palette-lime-600: #558a00;
    --uxp-palette-lime-700: #457000;
    --uxp-palette-lime-800: #365702;
    --uxp-palette-lime-850: #263d01;
    --uxp-palette-lime-900: #1d2e01;
    --uxp-palette-lime-1000: #101900;
    /* --- Green --- */
    --uxp-palette-green-100: #ebfff6;
    --uxp-palette-green-200: #d1ffec;
    --uxp-palette-green-250: #a5fad7;
    --uxp-palette-green-300: #55fab5;
    --uxp-palette-green-400: #08d680;
    --uxp-palette-green-500: #04bd70;
    --uxp-palette-green-600: #038a52;
    --uxp-palette-green-700: #026b3f;
    --uxp-palette-green-800: #025230;
    --uxp-palette-green-850: #014227;
    --uxp-palette-green-900: #01331e;
    --uxp-palette-green-1000: #011c11;
    /* --- Mint --- */
    --uxp-palette-mint-100: #edfff9;
    --uxp-palette-mint-200: #ccffee;
    --uxp-palette-mint-250: #8fffda;
    --uxp-palette-mint-300: #3dffbe;
    --uxp-palette-mint-400: #00d68f;
    --uxp-palette-mint-500: #00bd7e;
    --uxp-palette-mint-600: #008559;
    --uxp-palette-mint-700: #026b49;
    --uxp-palette-mint-800: #025238;
    --uxp-palette-mint-850: #01422c;
    --uxp-palette-mint-900: #013322;
    --uxp-palette-mint-1000: #012116;
    /* --- Teal --- */
    --uxp-palette-teal-100: #ebfffd;
    --uxp-palette-teal-200: #ccfffa;
    --uxp-palette-teal-250: #8ffff4;
    --uxp-palette-teal-300: #00f5dc;
    --uxp-palette-teal-400: #00d6c1;
    --uxp-palette-teal-500: #00ad9c;
    --uxp-palette-teal-600: #008073;
    --uxp-palette-teal-700: #02665c;
    --uxp-palette-teal-800: #02524a;
    --uxp-palette-teal-850: #013d37;
    --uxp-palette-teal-900: #01332e;
    --uxp-palette-teal-1000: #011c19;
    /* --- Cyan --- */
    --uxp-palette-cyan-100: #f0feff;
    --uxp-palette-cyan-200: #d1fbff;
    --uxp-palette-cyan-250: #99f7ff;
    --uxp-palette-cyan-300: #3defff;
    --uxp-palette-cyan-400: #00d2e5;
    --uxp-palette-cyan-500: #00a4bd;
    --uxp-palette-cyan-600: #007e94;
    --uxp-palette-cyan-700: #02627a;
    --uxp-palette-cyan-800: #024761;
    --uxp-palette-cyan-850: #023752;
    --uxp-palette-cyan-900: #01293d;
    --uxp-palette-cyan-1000: #011824;
    /* --- Blue --- */
    --uxp-palette-blue-100: #f0fbff;
    --uxp-palette-blue-200: #dbf4ff;
    --uxp-palette-blue-250: #c2eaff;
    --uxp-palette-blue-300: #75cfff;
    --uxp-palette-blue-400: #42b4ff;
    --uxp-palette-blue-500: #0099ff;
    --uxp-palette-blue-600: #006ce0;
    --uxp-palette-blue-700: #0457b5;
    --uxp-palette-blue-800: #033d8f;
    --uxp-palette-blue-850: #022c66;
    --uxp-palette-blue-900: #01214d;
    --uxp-palette-blue-1000: #011530;
    /* --- Indigo --- */
    --uxp-palette-indigo-100: #edf1ff;
    --uxp-palette-indigo-200: #dbe4ff;
    --uxp-palette-indigo-250: #c2d1ff;
    --uxp-palette-indigo-300: #94afff;
    --uxp-palette-indigo-400: #7598ff;
    --uxp-palette-indigo-500: #5e81ff;
    --uxp-palette-indigo-600: #2b60ff;
    --uxp-palette-indigo-700: #0839cf;
    --uxp-palette-indigo-800: #032ba3;
    --uxp-palette-indigo-850: #031882;
    --uxp-palette-indigo-900: #02115c;
    --uxp-palette-indigo-1000: #010a3b;
    /* --- Violet --- */
    --uxp-palette-violet-100: #efedff;
    --uxp-palette-violet-200: #e8e5ff;
    --uxp-palette-violet-250: #d2ccff;
    --uxp-palette-violet-300: #b2a8ff;
    --uxp-palette-violet-400: #978aff;
    --uxp-palette-violet-500: #8575ff;
    --uxp-palette-violet-600: #6842ff;
    --uxp-palette-violet-700: #4d20e0;
    --uxp-palette-violet-800: #3100a3;
    --uxp-palette-violet-850: #2d0382;
    --uxp-palette-violet-900: #20025c;
    --uxp-palette-violet-1000: #14013b;
    /* --- Purple --- */
    --uxp-palette-purple-100: #f6edff;
    --uxp-palette-purple-200: #f0e0ff;
    --uxp-palette-purple-250: #e8d1ff;
    --uxp-palette-purple-300: #d4a8ff;
    --uxp-palette-purple-400: #bf80ff;
    --uxp-palette-purple-500: #aa57ff;
    --uxp-palette-purple-600: #9124ff;
    --uxp-palette-purple-700: #7304e0;
    --uxp-palette-purple-800: #5b04b2;
    --uxp-palette-purple-850: #46038a;
    --uxp-palette-purple-900: #310261;
    --uxp-palette-purple-1000: #1e013b;
    /* --- Fuchsia --- */
    --uxp-palette-fuchsia-100: #fff0fd;
    --uxp-palette-fuchsia-200: #fce5ff;
    --uxp-palette-fuchsia-250: #f8c7ff;
    --uxp-palette-fuchsia-300: #f299ff;
    --uxp-palette-fuchsia-400: #eb6bff;
    --uxp-palette-fuchsia-500: #e226ff;
    --uxp-palette-fuchsia-600: #c404e0;
    --uxp-palette-fuchsia-700: #9e04b5;
    --uxp-palette-fuchsia-800: #78038a;
    --uxp-palette-fuchsia-850: #5b0269;
    --uxp-palette-fuchsia-900: #3e0147;
    --uxp-palette-fuchsia-1000: #230129;
    /* --------------------------------------------------------- */
    /* --- CONTENT --- */
    --color-sf-content-text-color: var(--uxp-input-text);
    --color-sf-content-text-color-selected: var(--uxp-input-text);
    --color-sf-content-bg-color-alt1: inherit;
    /* --- PRIMARY --- */
    --color-sf-primary: var(--uxp-button-primary);
    --color-sf-primary-text: var(--uxp-button-primary-text);
    --color-sf-primary-text-color: var(--uxp-button-primary-text);
    --color-sf-primary-bg-color: var(--uxp-button-primary);
    --color-sf-primary-border-color: var(--uxp-button-primary);
    --color-sf-primary-bg-color-hover: var(--uxp-button-primary-hover);
    --color-sf-primary-border-color-hover: var(--uxp-button-primary-hover);
    --color-sf-primary-text-hover: var(--uxp-button-primary-text);
    --color-sf-primary-bg-color-pressed: var(--uxp-button-primary-active);
    --color-sf-primary-border-color-pressed: var(--uxp-button-primary-active);
    --color-sf-primary-text-pressed: var(--uxp-button-primary-text);
    --color-sf-primary-bg-color-focus: var(--uxp-button-primary-hover);
    --color-sf-primary-border-color-focus: var(--uxp-button-primary-hover);
    --color-sf-primary-text-focus: var(--uxp-button-primary-text);
    --color-sf-primary-bg-color-disabled: var(--uxp-button-disabled);
    --color-sf-primary-border-color-disabled: var(--uxp-button-disabled);
    --color-sf-primary-text-disabled: var(--uxp-button-disabled-text);
    /* --- SECONDARY --- */
    --color-sf-secondary: var(--uxp-button-secondary);
    --color-sf-secondary-text-color: var(--uxp-button-secondary-text);
    --color-sf-secondary-bg-color: var(--uxp-button-secondary);
    --color-sf-secondary-border-color: var(--uxp-button-secondary-border);
    --color-sf-secondary-bg-color-hover: var(--uxp-button-secondary-hover);
    --color-sf-secondary-border-color-hover: var(--uxp-button-secondary-border);
    --color-sf-secondary-text-color-hover: var(--uxp-button-secondary-text);
    --color-sf-secondary-bg-color-pressed: var(--uxp-button-secondary-active);
    --color-sf-secondary-border-color-pressed: var(--uxp-button-secondary-border);
    --color-sf-secondary-text-color-pressed: var(--uxp-button-secondary-text);
    --color-sf-secondary-bg-color-focus: var(--uxp-button-secondary-hover);
    --color-sf-secondary-border-color-focus: var(--uxp-button-secondary-border);
    --color-sf-secondary-text-color-focus: var(--uxp-button-secondary-text);
    --color-sf-secondary-bg-color-disabled: var(--uxp-button-secondary);
    --color-sf-secondary-border-color-disabled: var(--uxp-button-disabled-text);
    --color-sf-secondary-text-color-disabled: var(--uxp-button-disabled-text);
    /* --- SUCCESS --- */
    --color-sf-success: var(--uxp-button-success);
    --color-sf-success-text: var(--uxp-button-success-text);
    --color-sf-success-bg-color: var(--uxp-button-success);
    --color-sf-success-border-color: var(--uxp-button-success);
    --color-sf-success-bg-color-hover: var(--uxp-button-success-hover);
    --color-sf-success-border-color-hover: var(--uxp-button-success-hover);
    --color-sf-success-text-hover: var(--uxp-button-success-text);
    --color-sf-success-bg-color-pressed: var(--uxp-button-success-active);
    --color-sf-success-border-color-pressed: var(--uxp-button-success-active);
    --color-sf-success-text-pressed: var(--uxp-button-success-text);
    --color-sf-success-bg-color-disabled: var(--uxp-button-disabled);
    --color-sf-success-border-color-disabled: var(--uxp-button-disabled);
    --color-sf-success-text-disabled: var(--uxp-button-disabled-text);
    /* --- WARNING --- */
    --color-sf-warning: var(--uxp-button-warning);
    --color-sf-warning-text: var(--uxp-button-warning-text);
    --color-sf-warning-bg-color: var(--uxp-button-warning);
    --color-sf-warning-border-color: var(--uxp-button-warning);
    --color-sf-warning-bg-color-hover: var(--uxp-button-warning-hover);
    --color-sf-warning-border-color-hover: var(--uxp-button-warning-hover);
    --color-sf-warning-text-hover: var(--uxp-button-warning-text);
    --color-sf-warning-bg-color-pressed: var(--uxp-button-warning-active);
    --color-sf-warning-border-color-pressed: var(--uxp-button-warning-active);
    --color-sf-warning-text-pressed: var(--uxp-button-warning-text);
    --color-sf-warning-bg-color-disabled: var(--uxp-button-disabled);
    --color-sf-warning-border-color-disabled: var(--uxp-button-disabled);
    --color-sf-warning-text-disabled: var(--uxp-button-disabled-text);
    /* --- DANGER --- */
    --color-sf-danger: var(--uxp-button-danger);
    --color-sf-danger-text: var(--uxp-button-danger-text);
    --color-sf-danger-bg-color: var(--uxp-button-danger);
    --color-sf-danger-border-color: var(--uxp-button-danger);
    --color-sf-danger-bg-color-hover: var(--uxp-button-danger-hover);
    --color-sf-danger-border-color-hover: var(--uxp-button-danger-hover);
    --color-sf-danger-text-hover: var(--uxp-button-danger-text);
    --color-sf-danger-bg-color-pressed: var(--uxp-button-danger-active);
    --color-sf-danger-border-color-pressed: var(--uxp-button-danger-active);
    --color-sf-danger-text-pressed: var(--uxp-button-danger-text);
    --color-sf-danger-bg-color-disabled: var(--uxp-button-disabled);
    --color-sf-danger-border-color-disabled: var(--uxp-button-disabled);
    --color-sf-danger-text-disabled: var(--uxp-button-disabled-text);
    /* --- INFO --- */
    --color-sf-info: var(--uxp-button-secondary-transparent);
    --color-sf-info-text: var(--uxp-button-secondary-transparent-text);
    --color-sf-info-bg-color: var(--uxp-button-secondary-transparent);
    --color-sf-info-border-color: var(--uxp-button-secondary-transparent);
    --color-sf-info-bg-color-hover: var(--uxp-button-secondary-transparent-hover);
    --color-sf-info-border-color-hover: var(--uxp-button-secondary-transparent);
    --color-sf-info-text-hover: var(--uxp-button-secondary-transparent-text);
    --color-sf-info-bg-color-pressed: var(--uxp-button-secondary-transparent-active);
    --color-sf-info-border-color-pressed: var(--uxp-button-secondary-transparent);
    --color-sf-info-text-pressed: var(--uxp-button-secondary-transparent-text);
    /* --- OUTLINES (Utilisés pour les focus ring ou bordures simples) --- */
    --color-sf-primary-outline: var(--uxp-button-primary);
    --color-sf-secondary-outline: var(--uxp-button-secondary);
    --color-sf-warning-outline: var(--uxp-button-warning);
    --color-sf-danger-outline: var(--uxp-button-danger);
    --color-sf-success-outline: var(--uxp-button-success);
    --color-sf-info-outline: var(--uxp-button-secondary-transparent);
}

* {
    scrollbar-color: var(--uxp-scrollbar) transparent;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6,
.e-control,
.e-css,
.e-error {
    font-family: var(--uxp-font-default);
}


/* ------------------------------------------------------------------------- */
/* --- Links --------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */

a,
a:visited {
    color: var(--uxp-link);
    text-decoration: none;
    cursor: pointer;
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
}

    a:hover,
    a:hover:visited {
        color: var(--uxp-link-hover);
        text-decoration: none;
    }

    a:active,
    a:active:visited {
        color: var(--uxp-link-active);
        text-decoration: none;
    }

        a .link-label,
        a:visited .link-label,
        a:hover .link-label,
        a:hover:visited .link-label,
        a:active .link-label,
        a:active:visited .link-label {
            text-decoration: underline;
            display: inline-flex;
            align-items: baseline;
            gap: 4px;
            text-decoration-thickness: from-font;
            text-underline-offset: 2px;
        }

    a > em {
        text-decoration: none;
    }

    a.disabled {
        pointer-events: none;
        cursor: default;
        color: var(--uxp-link-disabled);
    }

        a.disabled .link-label {
            text-decoration: none;
        }

/* ------------------------------------------------------------------------- */
/* --- Breadcrumb ---------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.breadcrumb {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    text-decoration: none;
}

    .breadcrumb > li.active {
        font-weight: 500;
        color: var(--uxp-breadcrumb-active);
    }

    /* Separator */
    .breadcrumb li:not(:last-child)::after {
        /*content: "\f054";
        font-family: var(--uxp-font-icon);
        font-weight: 900;*/
        content: "/";
        margin-left: 0.5rem;
        margin-right: 0.5rem;
        color: var(--uxp-breadcrumb-separator);
        vertical-align: middle;
    }

    .breadcrumb li {
        display: inline-flex;
        align-items: center;
    }

/* ------------------------------------------------------------------------- */
/* --- Buttons ------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.btn-block {
    display: flex;
    width: 100%;
}

.btn,
.e-btn,
.e-css.e-btn,
.e-daterangepicker.e-popup .e-footer .e-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    line-height: 20px;
    font-size: 14px;
    font-family: var(--uxp-font-default);
    border: 1px solid;
    height: 40px;
    padding: 0 12px;
    gap: 8px;
    flex-shrink: 0;
}

.btn-transparent {
    background-clip: padding-box;
}

.btn.disabled,
.btn:disabled,
fieldset:disabled .btn {
    background: var(--uxp-button-disabled);
    color: var(--uxp-button-disabled-text);
}

.btn.btn-xs {
    height: 24px;
    line-height: 16px;
    font-size: 12px;
    padding: 0 8px;
}

.btn.btn-sm,
.e-small .e-btn,
.e-small.e-btn,
.e-small .e-css.e-btn,
.e-small.e-css.e-btn {
    height: 32px;
    line-height: 20px;
    font-size: 14px;
    padding: 0 12px;
}

.btn.btn-lg {
    height: 48px;
}

.btn.btn-xl {
    height: 56px;
}

.btn.btn-primary.btn-primary-gradient {
    background: linear-gradient(90deg, var(--uxp-button-primary-gradient1) 0%, var(--uxp-button-primary-gradient2) 100%);
    color: var(--uxp-button-primary-text);
    border-color: none;
}


.btn.btn-primary,
.e-daterangepicker.e-popup .e-footer .e-btn.e-apply.e-flat.e-primary,
.e-daterangepicker.e-popup .e-footer .e-css.e-btn.e-apply.e-flat.e-primary,
.e-btn.e-flat.e-primary,
.e-css.e-btn.e-flat.e-primary,
.e-btn.e-flat.e-primary:focus,
.e-css.e-btn.e-flat.e-primary:focus,
.e-footer-content .e-btn.e-primary.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info) {
    background-color: var(--uxp-button-primary);
    color: var(--uxp-button-primary-text);
    border-color: var(--uxp-button-primary);
}

    .btn.btn-primary:hover,
    .e-daterangepicker.e-popup .e-footer .e-btn.e-apply.e-flat.e-primary:hover,
    .e-daterangepicker.e-popup .e-footer .e-css.e-btn.e-apply.e-flat.e-primary:hover,
    .e-btn.e-flat.e-primary:hover,
    .e-css.e-btn.e-flat.e-primary:hover,
    .e-footer-content .e-btn:hover.e-primary.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info) {
        color: var(--uxp-button-primary-text);
        background-color: var(--uxp-button-primary-hover);
        border-color: var(--uxp-button-primary-hover);
    }

    .btn.btn-primary:active,
    .e-daterangepicker.e-popup .e-footer .e-btn.e-apply.e-flat.e-primary:active,
    .e-daterangepicker.e-popup .e-footer .e-css.e-btn.e-apply.e-flat.e-primary:active,
    .e-btn.e-flat.e-primary:active,
    .e-css.e-btn.e-flat.e-primary:active,
    .e-footer-content .e-btn:active.e-primary.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info) {
        color: var(--uxp-button-primary-text);
        background-color: var(--uxp-button-primary-active);
        border-color: var(--uxp-button-primary-active);
    }

    .btn.btn-primary:disabled,
    .e-daterangepicker.e-popup .e-footer .e-btn.e-apply.e-flat.e-primary:disabled,
    .e-daterangepicker.e-popup .e-footer .e-css.e-btn.e-apply.e-flat.e-primary:disabled,
    .e-btn.e-flat.e-primary:disabled,
    .e-btn.e-flat.e-primary.e-disabled,
    .e-css.e-btn.e-flat.e-primary:disabled,
    .e-css.e-btn.e-flat.e-primary.e-disabled {
        color: var(--uxp-button-disabled-text);
        background: var(--uxp-button-disabled);
        border-color: var(--uxp-button-disabled);
    }

    .btn.btn-primary.btn-transparent,
    .btn.btn-light,
    .btn.btn-dark {
        background-color: var(--uxp-button-primary-transparent);
        color: var(--uxp-button-primary-transparent-text);
        border-color: var(--uxp-button-primary-transparent);
    }

        .btn.btn-primary.btn-transparent:hover,
        .btn.btn-light:hover,
        .btn.btn-dark:hover {
            color: var(--uxp-button-primary-transparent-text);
            background-color: var(--uxp-button-primary-transparent-hover);
            border-color: var(--uxp-button-primary-transparent-hover);
        }

        .btn.btn-primary.btn-transparent:active,
        .btn.btn-light:active,
        .btn.btn-dark:active {
            color: var(--uxp-button-primary-transparent-text);
            background-color: var(--uxp-button-primary-transparent-active);
            border-color: var(--uxp-button-primary-transparent-active);
        }

        .btn.btn-primary.btn-transparent:disabled,
        .btn.btn-light:disabled,
        .btn.btn-dark:disabled {
            color: var(--uxp-button-disabled-text);
            background-color: var(--uxp-button-secondary-transparent);
            border-color: var(--uxp-button-secondary-transparent);
        }


    .btn.btn-secondary,
    .e-css.e-btn.e-flat.e-primary.e-today {
        background-color: var(--uxp-button-secondary);
        color: var(--uxp-button-secondary-text);
        border-color: var(--uxp-button-secondary-border);
    }

        .btn.btn-secondary:hover,
        .e-css.e-btn.e-flat.e-primary.e-today:hover {
            color: var(--uxp-button-secondary-text);
            background-color: var(--uxp-button-secondary-hover);
            border-color: var(--uxp-button-secondary-border);
        }

        .btn.btn-secondary:active,
        .e-css.e-btn.e-flat.e-primary.e-today:active {
            color: var(--uxp-button-secondary-text);
            background-color: var(--uxp-button-secondary-active);
            border-color: var(--uxp-button-secondary-border);
        }

        .btn.btn-secondary:disabled,
        .e-css.e-btn.e-flat.e-primary.e-today:disabled {
            color: var(--uxp-button-disabled-text);
            background-color: var(--uxp-button-secondary);
            border-color: var(--uxp-button-disabled-text);
        }

        .btn.btn-secondary.btn-transparent,
        .btn.btn-info,
        .e-daterangepicker.e-popup .e-footer .e-btn.e-flat,
        .e-daterangepicker.e-popup .e-footer .e-css.e-btn.e-flat,
        .e-container .e-switch-ctrl-btn .e-ctrl-btn .e-btn.e-cancel,
        .e-footer-content .e-btn.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info) {
            background-color: var(--uxp-button-secondary-transparent);
            color: var(--uxp-button-secondary-transparent-text);
            border-color: var(--uxp-button-secondary-transparent);
        }

            .btn.btn-secondary.btn-transparent:hover,
            .btn.btn-info:hover,
            .e-daterangepicker.e-popup .e-footer .e-btn.e-flat:hover,
            .e-daterangepicker.e-popup .e-footer .e-css.e-btn.e-flat:hover,
            .e-container .e-switch-ctrl-btn .e-ctrl-btn .e-btn.e-cancel:hover,
            .e-footer-content .e-btn:hover.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info) {
                color: var(--uxp-button-secondary-transparent-text);
                background-color: var(--uxp-button-secondary-transparent-hover);
                border-color: var(--uxp-button-secondary-transparent-hover);
            }

            .btn.btn-secondary.btn-transparent:active,
            .btn.btn-info:active,
            .e-daterangepicker.e-popup .e-footer .e-btn.e-flat:active,
            .e-daterangepicker.e-popup .e-footer .e-css.e-btn.e-flat:active,
            .e-container .e-switch-ctrl-btn .e-ctrl-btn .e-btn.e-cancel:active,
            .e-footer-content .e-btn:active.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info) {
                color: var(--uxp-button-secondary-transparent-text);
                background-color: var(--uxp-button-secondary-transparent-active);
                border-color: var(--uxp-button-secondary-transparent-active);
            }

            .btn.btn-secondary.btn-transparent:disabled,
            .btn.btn-info:disabled {
                color: var(--uxp-button-disabled-text);
                background-color: var(--uxp-button-secondary-transparent);
                border-color: var(--uxp-button-secondary-transparent);
            }

.btn.btn-success {
    background-color: var(--uxp-button-success);
    color: var(--uxp-button-success-text);
    border-color: var(--uxp-button-success);
}

    .btn.btn-success:hover {
        color: var(--uxp-button-success-text);
        background-color: var(--uxp-button-success-hover);
        border-color: var(--uxp-button-success-hover);
    }

    .btn.btn-success:active {
        color: var(--uxp-button-success-text);
        background-color: var(--uxp-button-success-active);
        border-color: var(--uxp-button-success-active);
    }

    .btn.btn-success:disabled {
        color: var(--uxp-button-disabled-text);
        background-color: var(--uxp-button-disabled);
        border-color: var(--uxp-button-disabled);
    }

    .btn.btn-success.btn-transparent {
        background-color: var(--uxp-button-success-transparent);
        color: var(--uxp-button-success-transparent-text);
        border-color: var(--uxp-button-success-transparent);
    }

        .btn.btn-success.btn-transparent:hover {
            color: var(--uxp-button-success-transparent-text);
            background-color: var(--uxp-button-success-transparent-hover);
            border-color: var(--uxp-button-success-transparent-hover);
        }

        .btn.btn-success.btn-transparent:active {
            color: var(--uxp-button-success-transparent-text);
            background-color: var(--uxp-button-success-transparent-active);
            border-color: var(--uxp-button-success-transparent-active);
        }

        .btn.btn-success.btn-transparent:disabled {
            color: var(--uxp-button-disabled-text);
            background-color: var(--uxp-button-success-transparent);
            border-color: var(--uxp-button-success-transparent);
        }

.btn.btn-warning {
    background-color: var(--uxp-button-warning);
    color: var(--uxp-button-warning-text);
    border-color: var(--uxp-button-warning);
}

    .btn.btn-warning:hover {
        color: var(--uxp-button-warning-text);
        background-color: var(--uxp-button-warning-hover);
        border-color: var(--uxp-button-warning-hover);
    }

    .btn.btn-warning:active {
        color: var(--uxp-button-warning-text);
        background-color: var(--uxp-button-warning-active);
        border-color: var(--uxp-button-warning-active);
    }

    .btn.btn-warning:disabled {
        color: var(--uxp-button-disabled-text);
        background-color: var(--uxp-button-disabled);
        border-color: var(--uxp-button-disabled);
    }

    .btn.btn-warning.btn-transparent {
        background-color: var(--uxp-button-warning-transparent);
        color: var(--uxp-button-warning-transparent-text);
        border-color: var(--uxp-button-warning-transparent);
    }

        .btn.btn-warning.btn-transparent:hover {
            color: var(--uxp-button-warning-transparent-text);
            background-color: var(--uxp-button-warning-transparent-hover);
            border-color: var(--uxp-button-warning-transparent-hover);
        }

        .btn.btn-warning.btn-transparent:active {
            color: var(--uxp-button-warning-transparent-text);
            background-color: var(--uxp-button-warning-transparent-active);
            border-color: var(--uxp-button-warning-transparent-active);
        }

        .btn.btn-warning.btn-transparent:disabled {
            color: var(--uxp-button-disabled-text);
            background-color: var(--uxp-button-warning-transparent);
            border-color: var(--uxp-button-warning-transparent);
        }

.btn.btn-danger {
    background-color: var(--uxp-button-danger);
    color: var(--uxp-button-danger-text);
    border-color: var(--uxp-button-danger);
}

    .btn.btn-danger:hover {
        color: var(--uxp-button-danger-text);
        background-color: var(--uxp-button-danger-hover);
        border-color: var(--uxp-button-danger-hover);
    }

    .btn.btn-danger:active {
        color: var(--uxp-button-danger-text);
        background-color: var(--uxp-button-danger-active);
        border-color: var(--uxp-button-danger-active);
    }

    .btn.btn-danger:disabled {
        color: var(--uxp-button-disabled-text);
        background-color: var(--uxp-button-disabled);
        border-color: var(--uxp-button-disabled);
    }

    .btn.btn-danger.btn-transparent {
        background-color: var(--uxp-button-danger-transparent);
        color: var(--uxp-button-danger-transparent-text);
        border-color: var(--uxp-button-danger-transparent);
    }

        .btn.btn-danger.btn-transparent:hover {
            color: var(--uxp-button-danger-transparent-text);
            background-color: var(--uxp-button-danger-transparent-hover);
            border-color: var(--uxp-button-danger-transparent-hover);
        }

        .btn.btn-danger.btn-transparent:active {
            color: var(--uxp-button-danger-transparent-text);
            background-color: var(--uxp-button-danger-transparent-active);
            border-color: var(--uxp-button-danger-transparent-active);
        }

        .btn.btn-danger.btn-transparent:disabled {
            color: var(--uxp-button-disabled-text);
            background-color: var(--uxp-button-danger-transparent);
            border-color: var(--uxp-button-danger-transparent);
        }

button.dropdown-toggle.icon-only {
    min-width: 0;
    aspect-ratio: 1;
    padding: 0;
}

.btn.dropdown-toggle > em.fa-caret-down {
    transition: transform 300ms ease;
}


.btn.dropdown-toggle.show > em.fa-caret-down {
    transform: rotate(180deg);
    margin-right: 6px;
    /*padding-right: 6px;*/
}
/*.e-ddl.e-input-group.e-control-wrapper .e-ddl-icon::before {
    content: "\e729";
    font-family: "e-icons";
}*/

@keyframes spinner-border {
    to {
        transform: rotate(360deg);
    }
}

.spinner-border {
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: text-bottom;
    border: 1px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spinner-border .75s linear infinite;
}
/* ------------------------------------------------------------------------- */
/* --- Inputs -------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */

/* Placeholders */
input.e-input::-webkit-input-placeholder,
textarea.e-input::-webkit-input-placeholder,
.e-input-group input.e-input::-webkit-input-placeholder,
.e-input-group textarea.e-input::-webkit-input-placeholder,
.e-input-group.e-control-wrapper input.e-input::-webkit-input-placeholder,
.e-input-group.e-control-wrapper textarea.e-input::-webkit-input-placeholder {
    color: var(--uxp-input-placeholder);
}
/* Default */
/*Container (span) */
input.e-input,
.e-input-group input.e-input,
.e-input-group input,
.e-input-group.e-control-wrapper input.e-input,
.e-input-group.e-control-wrapper input,
.e-float-input input,
.e-float-input.e-input-group input,
.e-float-input.e-control-wrapper input,
.e-float-input.e-control-wrapper.e-input-group input,
.e-input-group,
.e-input-group.e-control-wrapper,
.e-float-input,
.e-float-input.e-control-wrapper,
.e-input.e-corner,
.e-input-group.e-corner.e-rtl input.e-input:only-child,
.e-input-group.e-control-wrapper.e-corner.e-rtl input.e-input:only-child,
.e-input-group.e-input-focus.e-corner,
.e-input-group.e-control-wrapper.e-input-focus.e-corner,
textarea.e-input,
.e-input-group textarea.e-input,
.e-input-group textarea,
.e-input-group.e-control-wrapper textarea.e-input,
.e-input-group.e-control-wrapper textarea,
.e-float-input textarea,
.e-float-input.e-input-group textarea,
.e-float-input.e-control-wrapper textarea,
.e-float-input.e-control-wrapper.e-input-group textarea,
/* Inputs composants SF */
.e-input:not(:valid),
.e-input:valid,
.e-float-input.e-control-wrapper input:not(:valid),
.e-float-input.e-control-wrapper input:valid,
.e-float-input input:not(:valid),
.e-float-input input:valid,
.e-input-group input:not(:valid),
.e-input-group input:valid,
.e-input-group.e-control-wrapper input:not(:valid),
.e-input-group.e-control-wrapper input:valid,
.e-float-input.e-control-wrapper textarea:not(:valid),
.e-float-input.e-control-wrapper textarea:valid,
.e-float-input textarea:not(:valid),
.e-float-input textarea:valid,
.e-input-group.e-control-wrapper textarea:not(:valid),
.e-input-group.e-control-wrapper textarea:valid,
.e-input-group textarea:not(:valid),
.e-input-group textarea:valid {
    border-radius: 8px; /* Spécifique NumericTextBox */
    background-color: var(--uxp-input-background);
    color: var(--uxp-input-text);
    font-family: var(--uxp-font-default);
    display: inline-flex;
    align-items: center;
    /*gap: 8px;*/
    padding: 0 8px;
    height: 40px; /* TODO : gérer taille */
}

    /* Input (dans container) */
    input.e-input,
    .e-input-group input.e-input,
    .e-input-group input,
    .e-input-group.e-control-wrapper input.e-input,
    .e-input-group.e-control-wrapper input,
    .e-float-input input.e-input,
    .e-float-input input,
    .e-float-input.e-control-wrapper input.e-input,
    .e-float-input.e-control-wrapper input,
    .e-input-group input.e-input:focus,
    .e-input-group.e-control-wrapper input.e-input:focus,
    .e-float-input.e-control-wrapper input:focus,
    .e-float-input input:focus,
    .e-input-group.e-input-focus input.e-input,
    .e-input-group.e-control-wrapper.e-input-focus input.e-input,
    .e-float-input.e-control-wrapper.e-input-focus input,
    .e-float-input.e-input-focus input {
        /*padding-left: 0px;*/
        padding: 0 4px;
        height: 100%;
        background: transparent;
    }
    /* Success */
    .e-input-group.e-success,
    .e-input-group.e-control-wrapper.e-success,
    .e-input-group.e-success:not(.e-float-icon-left),
    .e-input-group.e-control-wrapper.e-success:not(.e-float-icon-left),
    .e-input.e-success,
    .e-input.e-success:focus,
    .e-input-group.e-success input.e-input,
    .e-input-group.e-control-wrapper.e-success input.e-input,
    .e-input-group.e-success .e-input-group-icon,
    .e-input-group.e-control-wrapper.e-success .e-input-group-icon,
    .e-input-group.e-success textarea.e-input,
    .e-input-group.e-control-wrapper.e-success textarea.e-input {
        border-color: var(--uxp-input-border);
    }
    /* Default */
    .e-input-group:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error) {
        border-color: var(--uxp-input-border);
    }
    /* Hover */
    .e-input-group:hover:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-control-wrapper:hover:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group:hover:not(.e-disabled),
    .e-input-group.e-control-wrapper:hover:not(.e-disabled),
    .e-float-input:hover:not(.e-disabled),
    .e-float-input:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
    .e-float-input:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
    .e-float-input:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
    .e-float-input:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
    .e-float-input.e-control-wrapper:hover:not(.e-disabled),
    .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
    .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
    .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
    .e-float-input.e-control-wrapper:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
    /*Success*/
    .e-input-group.e-success:hover,
    .e-input-group.e-control-wrapper.e-success:hover,
    .e-input-group.e-success:hover:not(.e-float-icon-left),
    .e-input-group.e-control-wrapper.e-success:hover:not(.e-float-icon-left),
    .e-input.e-success:hover,
    .e-input-group.e-success:hover input.e-input,
    .e-input-group.e-control-wrapper.e-success:hover input.e-input,
    .e-input-group.e-success:hover .e-input-group-icon,
    .e-input-group.e-control-wrapper.e-success:hover .e-input-group-icon,
    .e-input-group.e-success:hover textarea.e-input,
    .e-input-group.e-control-wrapper.e-success:hover textarea.e-input,
    /* Inputs composants SF */
    .e-input:hover:not(.e-success):not(.e-warning):not(.e-error),
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:hover,
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:hover,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:hover,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:hover,
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group):hover input,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group):hover input {
        border-color: var(--uxp-input-border-hover);
        border-radius: 8px;
    }
    /* Hover */
    .e-input-group:not(.e-success):not(.e-warning):not(.e-error):hover,
    .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):hover {
        border-color: var(--uxp-input-border-hover);
    }
    /* Focus */
    .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
    .e-input-group.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
    .e-float-input.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
    .e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
    .e-float-input.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]),
    .e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]),
    .e-float-input.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]),
    .e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]),
    /*Success*/
    .e-input-group.e-input-focus:not(.e-error):not(.e-warning).e-success,
    .e-input-group.e-control-wrapper.e-input-focus:not(.e-error):not(.e-warning).e-success,
    .e-input-group.e-input-focus:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success,
    .e-input-group.e-input-focus.e-control-wrapper:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success,
    /* Inputs composants SF */
    .e-input:focus:not(.e-success):not(.e-warning):not(.e-error),
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus,
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus,
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group).e-input-focus input,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group).e-input-focus input {
        border-radius: 8px;
        border-color: var(--uxp-input-border-hover);
        box-shadow: inset 0 0 0 1px var(--uxp-input-border-hover);
    }
    /* Active */
    .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error) {
        box-shadow: none;
        border-color: var(--uxp-input-border);
    }
    /* Disabled */
    .e-input[disabled],
    .e-input-group .e-input[disabled],
    .e-input-group.e-control-wrapper .e-input[disabled],
    .e-input-group.e-disabled,
    .e-input-group.e-control-wrapper.e-disabled,
    .e-float-input input[disabled],
    .e-float-input.e-control-wrapper input[disabled],
    .e-float-input textarea[disabled],
    .e-float-input.e-control-wrapper textarea[disabled],
    .e-float-input.e-disabled,
    .e-float-input.e-control-wrapper.e-disabled,
    .e-input-group:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left).e-disabled,
    .e-input-group.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error).e-disabled .e-input-in-wrap,
    .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left).e-disabled,
    .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error).e-disabled .e-input-in-wrap {
        color: var(--uxp-input-disabled-text);
        background: var(--uxp-input-disabled);
        border-color: var(--uxp-input-disabled-border);
    }
        /* Disabled input*/
        .e-input[disabled],
        .e-input-group .e-input[disabled],
        .e-input-group.e-control-wrapper .e-input[disabled],
        .e-input-group.e-disabled,
        .e-input-group.e-disabled input,
        .e-input-group.e-disabled input.e-input,
        .e-input-group.e-disabled textarea,
        .e-input-group.e-disabled textarea.e-input,
        .e-input-group.e-control-wrapper.e-disabled,
        .e-input-group.e-control-wrapper.e-disabled input,
        .e-input-group.e-control-wrapper.e-disabled input.e-input,
        .e-input-group.e-control-wrapper.e-disabled textarea,
        .e-input-group.e-control-wrapper.e-disabled textarea.e-input,
        .e-float-input.e-disabled input,
        .e-float-input.e-disabled textarea,
        .e-float-input input[disabled],
        .e-float-input input.e-disabled,
        .e-float-input textarea[disabled],
        .e-float-input textarea.e-disabled,
        .e-float-input.e-control-wrapper.e-disabled input,
        .e-float-input.e-control-wrapper.e-disabled textarea,
        .e-float-input.e-control-wrapper input[disabled],
        .e-float-input.e-control-wrapper input.e-disabled,
        .e-float-input.e-control-wrapper textarea[disabled],
        .e-float-input.e-control-wrapper textarea.e-disabled,
        .e-input-group.e-disabled span,
        .e-input-group.e-control-wrapper.e-disabled span,
        .e-input-group.e-disabled input.e-input:not(:valid):first-child ~ .e-clear-icon,
        .e-input-group.e-control-wrapper.e-disabled input.e-input:not(:valid):first-child ~ .e-clear-icon,
        .e-float-input.e-disabled input:not(:valid):first-child ~ .e-clear-icon,
        .e-float-input.e-input-group.e-disabled input:not(:valid):first-child ~ .e-clear-icon,
        .e-float-input.e-input-group.e-control-wrapper.e-disabled input:not(:valid):first-child ~ .e-clear-icon,
        .e-float-input.e-control-wrapper.e-disabled input:not(:valid):first-child ~ .e-clear-icon,
        .e-input-group.e-disabled .e-clear-icon.e-clear-icon-hide,
        .e-input-group.e-control-wrapper.e-disabled .e-clear-icon.e-clear-icon-hide {
            cursor: default;
        }
            /* Disabled - Placeholder */
            input.e-input[disabled]::-webkit-input-placeholder,
            textarea.e-input[disabled]::-webkit-input-placeholder,
            .e-input-group input.e-input[disabled]::-webkit-input-placeholder,
            .e-input-group textarea.e-input[disabled]::-webkit-input-placeholder,
            .e-input-group.e-control-wrapper input.e-input[disabled]::-webkit-input-placeholder,
            .e-input-group.e-control-wrapper textarea.e-input[disabled]::-webkit-input-placeholder,
            .e-input-group.e-disabled input.e-input::-webkit-input-placeholder,
            .e-input-group.e-disabled textarea.e-input::-webkit-input-placeholder,
            .e-input-group.e-control-wrapper.e-disabled input.e-input::-webkit-input-placeholder,
            .e-input-group.e-control-wrapper.e-disabled textarea.e-input::-webkit-input-placeholder,
            .e-float-input input[disabled]::-webkit-input-placeholder,
            .e-float-input textarea[disabled]::-webkit-input-placeholder,
            .e-float-input.e-disabled input::-webkit-input-placeholder,
            .e-float-input.e-disabled textarea::-webkit-input-placeholder,
            .e-float-input.e-control-wrapper input[disabled]::-webkit-input-placeholder,
            .e-float-input.e-control-wrapper textarea[disabled]::-webkit-input-placeholder,
            .e-float-input.e-control-wrapper.e-disabled input::-webkit-input-placeholder,
            .e-float-input.e-control-wrapper.e-disabled textarea::-webkit-input-placeholder {
                color: var(--uxp-input-disabled-placeholder);
            }
    /* Icons */
    .e-input-group.e-success .e-input-group-icon,
    .e-input-group.e-control-wrapper.e-success .e-input-group-icon,
    .e-input-group.e-warning .e-input-group-icon,
    .e-input-group.e-control-wrapper.e-warning .e-input-group-icon,
    .e-input-group.e-error .e-input-group-icon,
    .e-input-group.e-control-wrapper.e-error .e-input-group-icon,
    .e-input-group.e-success:not(.e-disabled):not(:active) .e-input-group-icon:hover,
    .e-input-group.e-control-wrapper.e-success:not(.e-disabled):not(:active) .e-input-group-icon:hover,
    .e-input-group.e-warning:not(.e-disabled):not(:active) .e-input-group-icon:hover,
    .e-input-group.e-control-wrapper.e-warning:not(.e-disabled):not(:active) .e-input-group-icon:hover,
    .e-input-group.e-error:not(.e-disabled):not(:active) .e-input-group-icon:hover,
    .e-input-group.e-control-wrapper.e-error:not(.e-disabled):not(:active) .e-input-group-icon:hover,
    .e-input-group:not(.e-disabled) .e-input-group-icon:hover,
    .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:hover {
        color: var(--uxp-input-text);
    }
    /* Focus */
    /*.e-input:focus:not(.e-success):not(.e-warning):not(.e-error),
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus,
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus,
    .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group).e-input-focus input,
    .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group).e-input-focus input {

    }*/
    /*.textbox.e-input-group > input,*/
    input.e-input,
    .e-input-group input,
    .e-input-group.e-control-wrapper input,
    .e-input-group input.e-input,
    .e-input-group.e-control-wrapper input.e-input {
        line-height: 20px;
    }
    /* Icons */
    /*.e-input-group:not(.e-date-container):not(.e-date-range-container):not(.e-datetime-container):not(.e-time-wrapper) .e-input-group-icon,*/
    /*.e-input-group.e-control-wrapper:not(.e-date-container):not(.e-date-range-container):not(.e-datetime-container):not(.e-time-wrapper) .e-input-group-icon {*/
    .e-input-group .e-input-group-icon,
    .e-input-group.e-control-wrapper .e-input-group-icon {
        min-height: 20px;
        min-width: 20px;
        height: 20px;
        width: 20px;
        border: none;
        padding: 4px;
        border-radius: 4px;
        cursor: default;
        /*padding: 0 4px;*/
        /*pointer-events: none;*/
    }

        /* Icone à gauche des inputs : uniquement décoratif */
        .e-input-group .e-input-group-icon:first-child,
        .e-input-group.e-control-wrapper .e-input-group-icon:first-child {
            pointer-events: none;
            /*padding-left: 12px;*/
        }

        /* Icone chevron des dropdowns */
        .e-input-group .e-input-group-icon.e-ddl-icon,
        .e-input-group.e-control-wrapper .e-input-group-icon.e-ddl-icon {
            cursor: pointer;
        }

    /* Icones à droite des inputs : agissent comme bouton d'action */
    .e-input-group:not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child),
    .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child) {
        /*padding-right: 12px;*/
        cursor: pointer;
        /*color: var(--uxp-button-secondary-transparent-text);*/
        border: 1px solid;
        border-color: transparent;
    }

        .e-input-group:not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child):hover,
        .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child):hover {
            color: var(--uxp-button-secondary-transparent-text);
            background-color: var(--uxp-button-secondary-transparent-hover);
            border-color: var(--uxp-button-secondary-transparent-hover);
        }

        .e-input-group:not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child).e-active,
        .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child).e-active,
        .datepicker:has(> .e-control[aria-expanded="true"]):not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child),
        .daterangepicker:has(> .e-control[aria-expanded="true"]):not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child),
        .timepicker:has(> .e-control[aria-expanded="true"]):not(.e-disabled) .e-input-group-icon:not(.e-ddl-icon):not(:first-child) {
            color: var(--uxp-button-secondary-transparent-text);
            background-color: var(--uxp-button-secondary-transparent-hover);
            border-color: var(--uxp-button-secondary-transparent-text);
        }
    /* TextBox */
    .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error), .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error), .textbox.e-input-group, .numeric-textbox {
        /*padding: 9px;*/
        border-radius: 8px;
    }
    /* Multiline */
    .e-input-group.e-control-wrapper.multiline {
        height: auto;
        min-height: 40px;
        padding: 0;
    }

    textarea.e-input, .e-input-group textarea, .e-input-group textarea.e-input, .e-input-group.e-input-focus textarea, .e-input-group.e-input-focus textarea.e-input, .e-input-group.e-control-wrapper textarea, .e-input-group.e-control-wrapper.e-input-focus textarea, .e-input-group.e-control-wrapper textarea.e-input, .e-input-group.e-control-wrapper.e-input-focus textarea.e-input, .e-float-input textarea, .e-float-input.e-control-wrapper textarea, .e-input-group.e-input-focus.e-multi-line-input textarea.e-textbox {
        padding: 8px 12px;
        background: transparent;
    }

    /* ### Sizes ############################### */
    .e-input-group.textbox-xs,
    .e-input-group.dropdown-list-xs,
    .e-input-group.datepicker-xs,
    .e-btn.colorpicker-xs,
    .e-input-group.e-control-wrapper.e-multiselect.dropdown-list-xs {
        min-height: 24px;
        height: 24px;
        font-size: 12px;
        line-height: 16px;
    }

    .e-input-group.textbox-sm,
    .e-input-group.dropdown-list-sm,
    .e-input-group.datepicker-sm,
    .e-btn.colorpicker-sm,
    .e-input-group.e-control-wrapper.e-multiselect.dropdown-list-sm {
        min-height: 32px;
        height: 32px;
    }

    .e-input-group.textbox-lg,
    .e-input-group.dropdown-list-lg,
    .e-input-group.datepicker-lg,
    .e-btn.colorpicker-lg,
    .e-input-group.e-control-wrapper.e-multiselect.dropdown-list-lg {
        height: 48px;
    }

    .e-input-group.textbox-xl,
    .e-input-group.dropdown-list-xl,
    .e-input-group.datepicker-xl,
    .e-btn.colorpicker-xl,
    .e-input-group.e-control-wrapper.e-multiselect.dropdown-list-xl {
        height: 56px;
    }

/* Numeric TextBox */
/* Icones incrémenter décrémenter */
.e-numeric.e-control-wrapper.e-input-group .e-input-group-icon {
    padding: 0;
    pointer-events: auto;
}

    .e-numeric.e-control-wrapper.e-input-group .e-input-group-icon:last-of-type {
        margin-right: 4px;
    }
/* Textbox  & NumericTextBox */
.textbox-container {
    display: inline-flex; /* On reprend le style de l'input de base */
    width: 100%; /* On reprend le style de l'input de base */
    position: relative;
}

    .textbox-container .custom-icon {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        min-height: 20px;
        min-width: 20px;
        height: 20px;
        width: 20px;
        color: var(--uxp-input-text);
    }

    .textbox-container .left-icon {
        left: 12px; /* VARIABLE ? */
    }

    .textbox-container .right-icon {
        right: 12px; /* VARIABLE ? */
    }

    .textbox-container:has(.left-icon) input.e-input, .textbox-container:has(.left-icon) .e-input-group input.e-input, .textbox-container:has(.left-icon) .e-input-group input, .textbox-container:has(.left-icon) .e-input-group.e-control-wrapper input.e-input, .textbox-container:has(.left-icon) .e-input-group.e-control-wrapper input, .textbox-container:has(.left-icon) .e-float-input input.e-input, .textbox-container:has(.left-icon) .e-float-input input, .textbox-container:has(.left-icon) .e-float-input.e-control-wrapper input.e-input, .textbox-container:has(.left-icon) .e-float-input.e-control-wrapper input, .textbox-container:has(.left-icon) .e-input-group input.e-input:focus, .textbox-container:has(.left-icon) .e-input-group.e-control-wrapper input.e-input:focus, .textbox-container:has(.left-icon) .e-float-input.e-control-wrapper input:focus, .textbox-container:has(.left-icon) .e-float-input input:focus, .textbox-container:has(.left-icon) .e-input-group.e-input-focus input.e-input, .textbox-container:has(.left-icon) .e-input-group.e-control-wrapper.e-input-focus input.e-input, .textbox-container:has(.left-icon) .e-float-input.e-control-wrapper.e-input-focus input, .textbox-container:has(.left-icon) .e-float-input.e-input-focus input {
        padding-left: calc(12px + 20px + 4px); /* VARIABLE ? */
    }

    .textbox-container:has(.right-icon) input.e-input, .textbox-container:has(.right-icon) .e-input-group input.e-input, .textbox-container:has(.right-icon) .e-input-group input, .textbox-container:has(.right-icon) .e-input-group.e-control-wrapper input.e-input, .textbox-container:has(.right-icon) .e-input-group.e-control-wrapper input, .textbox-container:has(.right-icon) .e-float-input input.e-input, .textbox-container:has(.right-icon) .e-float-input input, .textbox-container:has(.right-icon) .e-float-input.e-control-wrapper input.e-input, .textbox-container:has(.right-icon) .e-float-input.e-control-wrapper input, .textbox-container:has(.right-icon) .e-input-group input.e-input:focus, .textbox-container:has(.right-icon) .e-input-group.e-control-wrapper input.e-input:focus, .textbox-container:has(.right-icon) .e-float-input.e-control-wrapper input:focus, .textbox-container:has(.right-icon) .e-float-input input:focus, .textbox-container:has(.right-icon) .e-input-group.e-input-focus input.e-input, .textbox-container:has(.right-icon) .e-input-group.e-control-wrapper.e-input-focus input.e-input, .textbox-container:has(.right-icon) .e-float-input.e-control-wrapper.e-input-focus input, .textbox-container:has(.right-icon) .e-float-input.e-input-focus input {
        padding-right: calc(12px + 20px + 4px); /* VARIABLE ? */
    }
/* ClearText */
.e-float-input .e-clear-icon, .e-float-input.e-control-wrapper .e-clear-icon, .e-input-group .e-clear-icon, .e-input-group.e-control-wrapper .e-clear-icon {
    color: var(--uxp-input-text);
}

    .e-float-input .e-clear-icon:hover, .e-float-input.e-control-wrapper .e-clear-icon:hover, .e-input-group .e-clear-icon:hover, .e-input-group.e-control-wrapper .e-clear-icon:hover {
        color: var(--uxp-input-text);
    }
/* DropDownList, Combobox & MultiSelect */
.e-input-group .e-input-group-icon.e-ddl-icon,
.e-input-group.e-control-wrapper .e-input-group-icon.e-ddl-icon {
    padding: 0px 4px;
    transition: transform 300ms ease;
    color: var(--uxp-input-action-icon);
}

.e-input-group.e-icon-anim .e-input-group-icon.e-ddl-icon,
.e-input-group.e-control-wrapper.e-icon-anim .e-input-group-icon.e-ddl-icon {
    transform: rotate(180deg);
}

.e-input-group.e-ddl .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon,
.e-input-group.e-control-wrapper.e-ddl .e-input[readonly] ~ span.e-input-group-icon.e-ddl-icon,
.e-float-input.e-ddl input[readonly] ~ span.e-input-group-icon.e-ddl-icon,
.e-float-input.e-control-wrapper.e-ddl input[readonly] ~ span.e-input-group-icon.e-ddl-icon {
    color: var(--uxp-input-text);
    border-color: transparent;
    background: none;
}

.e-ddl.e-input-group input[readonly].e-input,
.e-ddl.e-input-group input[readonly],
.e-ddl.e-input-group .e-dropdownlist,
.e-multiselect .e-multi-select-wrapper .e-delim-values {
    color: var(--uxp-input-text);
    -webkit-text-fill-color: var(--uxp-input-text);
    font-family: var(--uxp-font-default);
}

    .e-ddl.e-input-group input[disabled].e-input,
    .e-ddl.e-input-group input[disabled],
    .e-ddl.e-input-group .e-dropdownlist.e-disabled,
    .e-multiselect.e-disabled,
    .e-multiselect.e-disabled .e-multi-select-wrapper,
    .e-multiselect.e-disabled .e-multi-select-wrapper .e-delim-values {
        pointer-events: none;
        color: var(--uxp-input-disabled-text);
        -webkit-text-fill-color: var(--uxp-input-disabled-text);
        cursor: default;
    }

.e-input-group.e-control-wrapper.e-multiselect {
    min-height: 40px;
    height: auto;
    padding: 4px 0 4px 12px;
}

    .e-input-group.e-control-wrapper.e-multiselect .e-multi-select-wrapper {
        display: flex;
        flex-wrap: wrap;
        gap: 2px 8px;
        align-items: center;
    }

        .e-input-group.e-control-wrapper.e-multiselect .e-multi-select-wrapper .e-delim-values.e-delim-view {
            padding: 0;
        }

        .e-input-group.e-control-wrapper.e-multiselect .e-multi-select-wrapper .e-chips-collection {
            display: contents; /* permet aux chips de se comporter comme s'ils étaient directement dans le wrapper */
        }

            .e-input-group.e-control-wrapper.e-multiselect .e-multi-select-wrapper .e-chips-collection .e-chips {
                background: var(--uxp-input-popup-active);
                border: 2px solid var(--uxp-input-popup-active-border);
                margin: 0;
                padding: 0 6px;
            }

                .e-input-group.e-control-wrapper.e-multiselect .e-multi-select-wrapper .e-chips-collection .e-chips .e-chipcontent {
                    color: var(--uxp-input-text);
                    -webkit-text-fill-color: var(--uxp-input-text);
                    font-family: var(--uxp-font-default);
                }

                .e-input-group.e-control-wrapper.e-multiselect .e-multi-select-wrapper .e-chips-collection .e-chips .e-chips-close::before {
                    color: var(--uxp-input-popup-active-border);
                    -webkit-text-fill-color: var(--uxp-input-popup-active-border);
                }

        .e-input-group.e-control-wrapper.e-multiselect .e-multi-select-wrapper .e-multi-searcher {
            display: inline-flex;
            flex-grow: 1;
            min-width: 60px;
            float: none;
        }

            .e-input-group.e-control-wrapper.e-multiselect .e-multi-select-wrapper .e-multi-searcher input {
                height: 24px;
                min-height: 24px;
                background: transparent;
            }

/* ColorPicker */

.e-colorpicker-container .e-split-btn-wrapper .e-split-colorpicker.e-split-btn {
    border-radius: 8px;
    background: var(--uxp-input-background);
}

    .e-colorpicker-container .e-split-btn-wrapper .e-split-colorpicker.e-split-btn:hover {
        border-color: var(--uxp-input-border-hover);
    }

    .e-colorpicker-container .e-split-btn-wrapper .e-split-colorpicker.e-split-btn:active,
    .e-colorpicker-container .e-split-btn-wrapper .e-split-colorpicker.e-split-btn:focus {
        border-color: var(--uxp-input-border-hover);
        box-shadow: inset 0 0 0 1px var(--uxp-input-border-hover);
    }


    .e-colorpicker-container .e-split-btn-wrapper .e-split-colorpicker.e-split-btn::after {
        content: "\e729";
        font-family: "e-icons";
        color: var(--uxp-input-action-icon);
        transition: transform 300ms ease;
    }

    .e-colorpicker-container .e-split-btn-wrapper .e-split-colorpicker.e-split-btn:focus::after {
        transform: rotate(180deg);
    }

    .e-colorpicker-wrapper .e-split-btn-wrapper .e-split-colorpicker.e-split-btn .e-selected-color,
    .e-colorpicker-container .e-split-btn-wrapper .e-split-colorpicker.e-split-btn .e-selected-color {
        max-height: 20px;
        height: 100%;
        width: 100%;
        aspect-ratio: 1;
    }

.e-colorpicker-container .e-btn.e-icon-btn:not(.e-split-colorpicker) {
    display: none;
}

.e-colorpicker-container.responsive-colorpicker {
    display: flex;
}

    .e-colorpicker-container.responsive-colorpicker > div.e-colorpicker-popup {
        flex: 1;
    }

        .e-colorpicker-container.responsive-colorpicker > div.e-colorpicker-popup > button.e-colorpicker-popup.e-split-colorpicker {
            flex: 1;
        }

            .e-colorpicker-container.responsive-colorpicker > div.e-colorpicker-popup > button.e-colorpicker-popup.e-split-colorpicker > span.e-selected-color {
                width: 100%;
            }


/* Popups ColorPicker */
.e-container.sf-colorpicker {
    background: none;
    width: auto !important;
}

    .e-container.sf-colorpicker .e-switch-ctrl-btn .e-mode-switch-btn {
        width: 32px;
        height: 32px;
        padding: 0;
        border: 1px solid transparent;
    }

        .e-container.sf-colorpicker .e-switch-ctrl-btn .e-mode-switch-btn:hover {
            border-color: var(--uxp-input-popup-active-border);
        }

        .e-container.sf-colorpicker .e-switch-ctrl-btn .e-mode-switch-btn:focus {
            box-shadow: none;
        }
    /* Palette */
    .e-container.sf-colorpicker .e-custom-palette {
        padding: 16px 20px;
    }

        .e-container.sf-colorpicker .e-custom-palette .e-palette {
            overflow: hidden;
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

            .e-container.sf-colorpicker .e-custom-palette .e-palette .e-row {
                display: flex;
                gap: 8px;
            }

                .e-container.sf-colorpicker .e-custom-palette .e-palette .e-row .e-tile {
                    border-radius: 4px;
                }

                .e-container.sf-colorpicker .e-custom-palette .e-palette .e-row:last-of-type .e-tile {
                    border: 1px solid var(--uxp-input-popup-divider);
                    flex: 1;
                }
    /* Picker*/
    .e-container.sf-colorpicker .e-hsv-container {
        margin: 16px 20px 4px;
        border-radius: 4px;
    }

        .e-container.sf-colorpicker .e-hsv-container .e-hsv-color {
            border-radius: 4px;
        }

    .e-container.sf-colorpicker .e-slider-preview {
        padding: 4px 20px 4px;
        display: flex;
    }

        .e-container.sf-colorpicker .e-slider-preview .e-preview-container {
            height: fit-content;
            display: flex;
            flex-direction: column;
            border-color: var(--uxp-input-popup-divider);
            border-radius: 4px;
            overflow: hidden;
        }

            .e-container.sf-colorpicker .e-slider-preview .e-preview-container .e-preview {
                position: relative;
                border-color: var(--uxp-input-popup-divider);
                top: 0px;
            }

    .e-container.sf-colorpicker .e-selected-value {
        padding: 4px 20px 16px;
        margin-top: 16px;
        width: 430px;
        border-bottom: none;
        gap: 8px;
    }

        .e-container.sf-colorpicker .e-selected-value .e-input-container {
            display: flex;
            gap: 8px;
        }

        .e-container.sf-colorpicker .e-selected-value .e-value-switch-btn {
            margin: 0;
            color: var(--uxp-input-popup-calendar-text);
            height: 32px;
            width: 32px;
        }

            .e-container.sf-colorpicker .e-selected-value .e-value-switch-btn:hover {
                color: var(--uxp-input-popup-calendar-text-hover);
                background: var(--uxp-input-popup-calendar-hover);
            }

            .e-container.sf-colorpicker .e-selected-value .e-value-switch-btn:active {
                color: var(--uxp-input-popup-calendar-text-active);
                background: var(--uxp-input-popup-calendar-active);
            }

        .e-container.sf-colorpicker .e-selected-value .e-input-container .e-input-group {
            margin: 0;
            background: none;
        }

        .e-container.sf-colorpicker .e-selected-value .e-input-container .e-float-input:first-child {
            width: 100px;
            min-width: 100px;
            height: 32px;
        }

            .e-container.sf-colorpicker .e-selected-value .e-input-container .e-float-input:first-child > input {
                background: none !important;
                padding: 0;
            }

        .e-container.sf-colorpicker .e-selected-value .e-input-container .e-input-group.e-numeric.e-float-input {
            width: auto;
        }

            .e-container.sf-colorpicker .e-selected-value .e-input-container .e-input-group.e-numeric.e-float-input > input {
                padding: 0;
            }

    .e-container.sf-colorpicker .e-switch-ctrl-btn .e-ctrl-btn {
        display: flex;
        flex-direction: row-reverse;
        gap: 8px;
    }

/* Popups (from Dropdown and components (RichtextEditor, Datagrid...)) */
.uxp-popup {
    border-radius: 16px;
    margin-top: -7px;
    background: var(--uxp-input-popup);
    border: 1px solid var(--uxp-input-popup-border);
    box-shadow: var(--uxp-input-popup-elevation);
    font-family: var(--uxp-font-default);
}

.e-ddl.e-popup,
.e-dropdown-popup,
.e-datepicker.e-popup-wrapper,
.e-small.e-datepicker.e-popup-wrapper,
.e-daterangepicker.e-popup,
.e-timepicker.e-popup,
.e-datepicker.e-popup-wrapper,
.uxp-dropdown,
.e-tooltip-wrap.e-popup,
.e-popup.e-popup-open.e-dialog {
    border-radius: 8px;
    margin-top: 8px;
    background: var(--uxp-input-popup);
    border: 1px solid var(--uxp-input-popup-border);
    box-shadow: var(--uxp-input-popup-elevation);
    font-family: var(--uxp-font-default);
}

    .e-ddl.e-popup .e-dropdownbase,
    .e-timepicker.e-popup .e-content,
    .e-datetimepicker.e-popup > .e-content,
    .e-dropdown-popup:not(.e-colorpicker-popup),
    .uxp-dropdown {
        padding: 8px;
    }

    .e-dropdown-popup ul,
    .e-timepicker.e-popup ul,
    .e-datetimepicker.e-popup .e-list-parent.e-ul {
        border: none;
        background: none;
    }

.e-grid .e-ccdlg .e-footer-content,
.e-grid-popup .e-ccdlg .e-footer-content {
    border-color: var(--uxp-input-popup-divider);
}

.e-ddl.e-popup .e-filter-parent .e-input-group,
.e-ddl.e-popup .e-filter-parent,
.e-timepicker.e-popup .e-list-parent.e-ul,
.e-datepicker .e-calendar,
.e-small.e-datepicker .e-calendar,
.e-datetimepicker.e-popup .e-list-parent.e-ul {
    box-shadow: none;
    background: none;
}

    .e-dropdownbase .e-list-item,
    .e-dropdown-popup ul .e-item,
    .e-timepicker.e-popup .e-list-item,
    .e-datetimepicker.e-popup .e-list-parent.e-ul li.e-list-item,
    .e-dropdownbase .e-list-item.e-item-focus,
    .uxp-dropdown .dropdown-item {
        background: transparent;
        color: var(--uxp-input-popup-text);
        border: 2px solid transparent;
        border-radius: 8px;
        line-height: 20px;
        font-size: 14px;
        font-weight: 400;
        display: flex;
        height: 40px;
        align-items: center;
        text-indent: 0;
        padding: 0px 8px;
        margin-top: -2px;
        position: relative;
    }

        .uxp-dropdown .dropdown-item.error {
            color: var(--uxp-text-error) !important;
        }

            .uxp-dropdown .dropdown-item.disabled,
            .uxp-dropdown .dropdown-item.error.disabled {
                color: var(--uxp-input-popup-text-disabled) !important;
            }

        .e-dropdownbase .e-list-item:first-child {
            margin-top: 0px;
        }

        .e-dropdownbase .e-list-item:last-child {
            border-bottom: 2px solid transparent;
        }

        .e-dropdownbase .e-list-item.e-active:last-child {
            border-radius: 8px;
        }

    .e-timepicker.e-popup .e-list-parent.e-ul li.e-list-item,
    .e-popup.e-multi-select-list-wrapper .e-list-item {
        color: var(--uxp-input-popup-text);
        border: 2px solid transparent;
    }

    .e-dropdownbase .e-list-item:hover,
    .e-dropdown-popup ul .e-item:hover,
    .e-timepicker.e-popup .e-item:hover,
    .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover,
    .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover,
    /*.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-navigation,*/
    .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item:focus,
    .uxp-dropdown .dropdown-item:hover {
        border: 2px solid;
        background: var(--uxp-input-popup-hover);
        color: var(--uxp-input-popup-text);
        border-color: var(--uxp-input-popup-hover);
    }

    .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-hover {
        border: 2px solid;
        border-color: var(--uxp-input-popup-hover);
    }

    .e-dropdownbase .e-list-item.e-active,
    .e-dropdownbase .e-list-item.e-active.e-hover,
    .e-dropdown-popup ul .e-item.e-active,
    .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active,
    .e-timepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active:hover,
    .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active,
    .e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active.e-hover,
    .e-popup.e-multi-select-list-wrapper .e-list-item.e-active,
    .e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active,
    .e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active.e-hover,
    .uxp-dropdown .dropdown-item:active {
        border: 2px solid;
        background: var(--uxp-input-popup-active);
        color: var(--uxp-input-popup-active-text);
        border-color: var(--uxp-input-popup-active-border);
        z-index: 1;
    }

.e-ul.e-reorder {
    border-color: var(--uxp-input-popup-divider);
    padding-bottom: 4px;
    margin-bottom: 4px;
}

.e-popup.e-multi-select-list-wrapper .e-list-item.e-active.e-item-focus + li.e-active {
    border-top: 2px solid var(--uxp-input-popup-active-border);
}

.e-multi-select-list-wrapper .e-hide-listitem,
.e-multi-select-list-wrapper .e-hide-group-header {
    display: none !important;
}

.e-dropdownbase .e-list-group-item, .e-fixed-head {
    color: var(--uxp-input-popup-header-text);
    background: transparent;
    font-weight: 500;
}

.e-dropdownbase .e-fixed-head {
    background: var(--uxp-input-popup);
}

.e-filter-parent {
    box-shadow: none;
    border-bottom: 1px solid var(--uxp-input-disabled-border);
}

.e-ddl.e-popup .e-filter-parent .e-input-group,
.e-ddl.e-popup .e-filter-parent {
    background: none;
}
/* Popups DatePickers */
.e-calendar {
    max-width: 100%;
}

.e-daterangepicker.e-popup .e-calendar .e-header .e-next,
.e-daterangepicker.e-popup .e-calendar .e-header .e-prev {
    height: 24px;
    width: 24px;
    margin: 0;
}

.e-calendar .e-header .e-prev,
.e-calendar .e-header .e-next {
    background: transparent;
}

.e-calendar .e-date-icon-prev,
.e-calendar .e-date-icon-next {
    color: var(--uxp-input-popup-calendar-text-active);
}

.e-calendar .e-header .e-prev:hover,
.e-calendar .e-header .e-next:hover {
    background: var(--uxp-input-popup-calendar-hover);
}

    .e-calendar .e-prev:hover .e-date-icon-prev:hover,
    .e-calendar .e-next:hover .e-date-icon-next:hover,
    .e-calendar .e-header .e-prev:hover > span,
    .e-calendar .e-header .e-next:hover > span {
        color: var(--uxp-input-popup-calendar-text-active);
    }

.e-calendar .e-header .e-prev:active,
.e-calendar .e-header .e-next:active {
    background: var(--uxp-input-popup-calendar-active);
}



.e-datepicker .e-calendar,
.e-small.e-datepicker .e-calendar,
.e-daterangepicker.e-popup .e-range-header,
.e-daterangepicker.e-popup .e-calendar {
    background: none;
}

    .e-calendar .e-header .e-title,
    .e-calendar .e-header.e-decade .e-title,
    .e-calendar .e-header.e-year .e-title,
    .e-daterangepicker.e-popup .e-calendar .e-header .e-title {
        margin: 0;
        padding: 4px 8px;
        color: var(--uxp-input-popup-calendar-title);
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
    }

        .e-calendar .e-header .e-title:hover,
        .e-daterangepicker.e-popup .e-calendar .e-header .e-title:hover {
            background: var(--uxp-input-popup-calendar-hover);
            color: var(--uxp-input-popup-calendar-text-hover);
        }

.e-calendar th {
    color: var(--uxp-input-popup-calendar-legend);
    background: transparent;
    font-weight: 500;
    font-size: 14px;
    line-height: 40px;
}

.e-calendar .e-content table {
    table-layout: auto;
}

.e-calendar .e-content span,
.e-calendar .e-content td.e-today span.e-day,
.e-calendar .e-content td.e-focused-date.e-today span.e-day {
    color: var(--uxp-input-popup-calendar-text);
}

.e-calendar .e-content .e-other-month span.e-day,
.e-calendar .e-content .e-other-month.e-today span.e-day {
    color: var(--uxp-input-popup-calendar-text-disabled);
}

.e-calendar .e-content .e-other-month:hover span.e-day {
    color: var(--uxp-input-popup-calendar-text-hover);
}

.e-calendar .e-content span.e-day,
.e-calendar .e-content.e-month td.e-today span.e-day {
    border: 1px solid;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border: 1px solid;
    border-color: transparent;
}

.e-calendar .e-content td:hover span.e-day,
.e-calendar .e-content td:focus span.e-day,
.e-calendar .e-content td.e-focused-date span.e-day,
.e-daterangepicker.e-popup .e-calendar .e-content .e-range-hover span {
    border: 1px solid;
    border-color: transparent;
}

.e-calendar .e-content.e-month td.e-today span.e-day {
    font-weight: 500;
}

.e-calendar .e-content td.e-focused-date.e-today span.e-day,
.e-calendar .e-content td.e-focused-date.e-today:focus span.e-day {
    border: 1px solid;
    background: transparent;
    color: var(--uxp-input-popup-calendar-text);
    border-color: transparent;
}

.e-calendar .e-content td:hover span.e-day,
.e-calendar .e-content td:focus span.e-day,
.e-calendar .e-content td.e-today:hover span.e-day,
.e-calendar .e-content td.e-focused-date:hover span.e-day,
.e-daterangepicker.e-popup .e-calendar .e-range-hover:not(.e-selected):hover span.e-day,
.e-calendar .e-content td.e-focused-date.e-today:hover span.e-day {
    border: 1px solid;
    background: var(--uxp-input-popup-calendar-hover);
    color: var(--uxp-input-popup-calendar-text-hover);
    border-color: var(--uxp-input-popup-calendar-hover);
}


.e-daterangepicker.e-popup .e-calendar .e-content .e-range-hover {
    background: var(--uxp-input-popup-calendar-hover);
}

    .e-daterangepicker.e-popup .e-calendar .e-content .e-range-hover span {
        background: var(--uxp-input-popup-calendar-hover);
        color: var(--uxp-input-popup-calendar-text);
        border-color: var(--uxp-input-popup-calendar-hover);
    }


.e-calendar .e-content td.e-selected span.e-day,
.e-calendar .e-content td.e-selected:hover span.e-day,
.e-calendar .e-content.e-year td.e-selected:hover span.e-day,
.e-calendar .e-content td.e-today.e-selected:hover span.e-day,
.e-calendar .e-content td.e-selected:hover span.e-day,
.e-calendar .e-content td.e-selected.e-focused-date span.e-day,
.e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day,
.e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day {
    border: 1px solid;
    border-radius: 4px;
    background: var(--uxp-input-popup-calendar-active);
    color: var(--uxp-input-popup-calendar-text-active);
    border-color: var(--uxp-input-popup-calendar-text-active);
}

.e-range-header,
.e-daterangepicker.e-popup .e-separator {
    display: none;
}

.e-daterangepicker.e-popup .e-calendar-container .e-left-container {
    border: none;
}

.e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

    .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

.e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

    .e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

.e-daterangepicker.e-popup .e-calendar .e-content .e-other-month.e-range-hover span,
.e-daterangepicker.e-popup .e-calendar .e-content .e-other-month.e-range-hover:hover span.e-day,
.e-daterangepicker.e-popup .e-calendar .e-content .e-other-month.e-range-hover {
    color: var(--uxp-input-popup-calendar-text-disabled);
    background: none;
}

.e-daterangepicker.e-popup .e-footer,
.e-calendar .e-footer-container,
.e-container.sf-colorpicker .e-switch-ctrl-btn {
    background: var(--uxp-modal-footer-background);
    border-top: 1px solid;
    border-color: var(--uxp-input-popup-divider);
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    display: flex;
    justify-content: space-between;
    padding: 16px 20px;
    height: auto;
}

.e-calendar .e-footer-container {
    justify-content: center;
}

.e-daterangepicker.e-popup .e-footer .e-btn.e-apply {
    margin: 0;
}
/* RichTextEditor */
.uxp-richtext-editor {
    position: relative;
}

    .uxp-richtext-editor .collapse-button-container {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        cursor: pointer;
        z-index: 1;
        border-top: 1px solid var(--uxp-richtext-border);
        height: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .uxp-richtext-editor .collapse-button-container .btn.btn-tertiary {
            padding: 0;
            height: 20px;
            width: 20px;
            border-radius: 4px;
            font-size: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: transform 300ms ease;
        }

    .uxp-richtext-editor.collapsed .collapse-button-container .btn.btn-tertiary {
        transform: rotate(180deg);
    }

    .uxp-richtext-editor.collapsable .e-richtexteditor .e-rte-container .e-rte-content {
        margin-bottom: calc(28px - 1px);
    }

    .uxp-richtext-editor.collapsable.collapsed .collapse-button-container {
        border-top: none;
    }

    .uxp-richtext-editor.collapsable.collapsed .e-richtexteditor {
        height: fit-content !important;
        min-height: 0;
        transition: all 300ms ease;
    }

        .uxp-richtext-editor.collapsable.collapsed .e-richtexteditor .e-rte-container .e-rte-content .e-content {
            padding: 0;
            height: 0;
            min-height: 0;
            opacity: 0;
            transition: all 300ms ease;
        }

.e-richtexteditor {
    width: 100% !important; /* Resize vertical only */
    min-height: 200px;
    background: transparent;
}

    .e-richtexteditor .e-rte-content, .e-richtexteditor .e-source-content {
        color: var(--uxp-richtext-text);
        background: var(--uxp-richtext-background);
    }

    .e-richtexteditor .e-rte-container {
        border-radius: 4px;
        overflow: hidden;
        border-color: var(--uxp-richtext-border);
    }

    .e-richtexteditor .e-resize-handle.e-south-east {
        cursor: ns-resize;
        height: 12px;
        width: 12px;
        font-size: 10px;
    }

    .e-richtexteditor .e-rte-content .e-content, .e-richtexteditor .e-source-content .e-content, .e-richtexteditor .e-rte-iframe-content .e-content {
        padding: 8px 12px;
    }

    .e-richtexteditor .e-rte-container.e-count-enabled:not(:has(.e-rte-tb-bottom)) .e-rte-content, .e-richtexteditor .e-rte-container.e-count-enabled:not(:has(.e-rte-tb-bottom)) .e-source-content, .e-richtexteditor .e-rte-container.e-resize-enabled:not(:has(.e-rte-tb-bottom)) .e-rte-content, .e-richtexteditor .e-rte-container.e-resize-enabled:not(:has(.e-rte-tb-bottom)) .e-source-content {
        margin-bottom: 8px;
    }

    .e-richtexteditor .e-rte-container.e-count-enabled .e-content, .e-richtexteditor .e-rte-container.e-resize-enabled .e-content {
        /*padding-bottom: 8px;*/
    }

.e-toolbar {
    padding: 4px 0px;
    background: var(--uxp-richtext-header-background);
}

    .e-toolbar .e-toolbar-item .e-tbar-btn {
        color: var(--uxp-richtext-header-button-text);
    }

    .e-toolbar .e-toolbar-items, .e-toolbar.e-extended-toolbar .e-toolbar-pop,
    .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:not(:hover):not(:focus):not(:active):not(.e-active),
    .e-toolbar .e-toolbar-item .e-tbar-btn,
    .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn {
        background: transparent;
        border-radius: 4px;
        height: auto;
        width: auto;
    }
        /* icon */
        .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover .e-tbar-btn-text,
        .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover .e-icons.e-btn-icon,
        .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:hover .e-icons,
        .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn:hover .e-icons,
        .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn .e-icons,
        .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item.e-active .e-tbar-btn .e-icons,
        .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn .e-icons,
        .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn .e-icons,
        .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu,
        .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu,
        .e-richtexteditor .e-rte-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn .e-icons,
        .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn .e-icons {
            color: var(--uxp-richtext-header-button-text);
        }
    /* disabled */
    .e-toolbar .e-toolbar-item.e-overlay, .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-overlay {
        background: var(--uxp-button-disabled);
        color: var(--uxp-button-disabled-text);
        border-radius: 4px;
    }
    /* hover*/
    .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:hover,
    .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:focus,
    .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn:hover,
    .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn:focus,
    .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover,
    .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:hover,
    .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:focus,
    .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu:hover,
    .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu:focus,
    .e-richtexteditor .e-rte-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn:hover,
    .e-richtexteditor .e-rte-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn:focus,
    .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn:hover,
    .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn:focus {
        background: var(--uxp-richtext-header-button-hover);
        color: var(--uxp-richtext-header-button-text);
        height: auto;
        width: auto;
    }
/*active*/
.e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn,
.e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item.e-active .e-tbar-btn,
.e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn:active,
.e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item.e-active .e-tbar-btn:active,
.e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:active,
.e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu.e-active,
.e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu:active,
.e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu.e-active,
.e-richtexteditor .e-rte-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn:focus,
.e-richtexteditor .e-rte-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn:active,
.e-richtexteditor .e-rte-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn.e-active,
.e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn:focus,
.e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn:active,
.e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item:not(.e-overlay) .e-tbar-btn.e-active,
.e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active:not(.e-overlay) .e-tbar-btn,
.e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item.e-active:not(.e-overlay) .e-tbar-btn {
    background: var(--uxp-richtext-header-button-active);
    color: var(--uxp-richtext-header-button-text);
    height: auto;
    width: auto;
}

.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn:hover,
.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn:focus,
.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn:active,
.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:hover,
.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:focus,
.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:active {
    padding: 0px;
}

.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:focus {
    box-shadow: none;
}

.e-toolbar .e-toolbar-item.e-separator {
    margin: 0 8px;
    border-color: var(--uxp-richtext-separator);
}

.e-toolbar-wrapper, .e-toolbar-container {
    border-color: var(--uxp-richtext-border);
}

.e-toolbar .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child, .e-toolbar .e-toolbar-items:not(.e-tbar-pos):not(.e-toolbar-multirow) .e-toolbar-item:first-child {
    /*margin-left: 0px;*/
}

.e-toolbar.e-extended-toolbar .e-toolbar-extended {
    /*padding: 0px;*/
    min-height: 32px;
    width: 100% !important;
}

    .e-toolbar .e-toolbar-item:not(.e-separator):not(.e-spacer), .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item:not(.e-separator) {
        padding: 0px;
        min-height: 32px;
    }

.e-richtexteditor .e-linkheader, .e-richtexteditor .e-audioheader, .e-richtexteditor .e-videoheader, .e-richtexteditor .e-video-url-wrap, .e-rte-elements .e-linkheader, .e-rte-elements .e-audioheader, .e-rte-elements .e-videoheader, .e-rte-elements .e-video-url-wrap {
    font-family: var(--uxp-font-default);
    color: var(--uxp-label-text);
}
/* ------------------------------------------------------------------------- */
/* --- TranslationsTexBox -------------------------------------------------- */
/* ------------------------------------------------------------------------- */

.translation-collapse {
    width: calc(100% - 12px) !important;
    margin: 8px 0 0 12px;
    background: transparent;
    transition: background 300ms ease;
    font-size: 14px;
}

    .translation-collapse:has(.uxp-collapse-container.uxp-collapse-entered),
    .translation-collapse:has(.uxp-collapse-container.uxp-collapse-entering) {
        background: var(--uxp-translations-collapse-background);
    }

        .translation-collapse:has(.uxp-collapse-container.uxp-collapse-entered) .translation-dropdown,
        .translation-collapse:has(.uxp-collapse-container.uxp-collapse-entering) .translation-dropdown {
            margin-bottom: 16px;
        }

    .translation-collapse .translation-dropdown {
        font-size: 12px;
        line-height: 16px;
        color: var(--uxp-translations-dropdown);
        display: flex;
        align-items: center;
        gap: 4px;
        cursor: pointer;
        transition: margin-bottom 300ms ease;
    }

        .translation-collapse .translation-dropdown .uxp-badge {
            height: 16px;
            font-size: 12px;
            line-height: 16px;
            margin-left: 4px;
        }

        .translation-collapse .translation-dropdown .translation-icon {
            position: relative;
            color: var(--uxp-translations-dropdown);
            background: var(--uxp-translations-collapse-background);
            border: 1px solid var(--uxp-translations-dropdown);
            height: 14px;
            width: 14px;
            display: inline-flex;
            justify-content: center;
            align-items: center;
            font-size: 8px;
            border-radius: 20px;
            transition: transform 300ms ease;
        }

            .translation-collapse .translation-dropdown .translation-icon em {
                position: absolute;
                height: 14px;
                width: 14px;
            }

            .translation-collapse .translation-dropdown .translation-icon.expanded {
                transform: rotate(180deg);
                color: var(--uxp-translations-collapse-background);
                background: var(--uxp-translations-dropdown);
                border: 1px solid var(--uxp-translations-dropdown);
            }

    .translation-collapse .uxp-collapse-container {
        width: 100%;
    }

        .translation-collapse .uxp-collapse-container .uxp-collapse-wrapper {
            padding: 8px 20px;
            border-left: 2px solid var(--uxp-translations-collapse-border);
        }
/* ------------------------------------------------------------------------- */
/* --- Checkbox------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
div:has(> .e-checkbox-wrapper) {
    line-height: 20px;
}

.e-checkbox-wrapper > label, .e-css.e-checkbox-wrapper > label {
    padding: 0 12px 8px 0;
}
/* Unchecked */
.e-checkbox-wrapper .e-frame, .e-css.e-checkbox-wrapper .e-frame {
    height: 16px;
    width: 16px;
    border: 1px solid var(--uxp-checkbox-border);
    background: var(--uxp-checkbox-background);
}

.e-checkbox-wrapper:hover .e-frame, .e-css.e-checkbox-wrapper:hover .e-frame, .e-checkbox-wrapper:hover .e-checkbox:focus + .e-frame, .e-css.e-checkbox-wrapper:hover .e-checkbox:focus + .e-frame {
    background: var(--uxp-checkbox-background-hover);
    border-color: var(--uxp-checkbox-border-hover);
}

.e-checkbox-wrapper:active .e-frame, .e-css.e-checkbox-wrapper:active .e-frame, .e-checkbox-wrapper .e-checkbox:active + .e-frame, .e-css.e-checkbox-wrapper .e-checkbox:active + .e-frame {
    background: var(--uxp-checkbox-background-hover);
    border-color: var(--uxp-checkbox-border-active);
    box-shadow: none;
}

.e-checkbox-wrapper .e-checkbox:focus + .e-frame, .e-css.e-checkbox-wrapper .e-checkbox:focus + .e-frame {
    background: var(--uxp-checkbox-background);
    border-color: var(--uxp-checkbox-border);
    box-shadow: none;
}
    /* Checked */
    .e-checkbox-wrapper .e-frame.e-check, .e-css.e-checkbox-wrapper .e-frame.e-check, .e-checkbox-wrapper .e-checkbox:focus + .e-frame.e-check, .e-css.e-checkbox-wrapper .e-checkbox:focus + .e-frame.e-check {
        background: var(--uxp-checkbox-background-active);
        border-color: var(--uxp-checkbox-border-active);
        color: var(--uxp-checkbox-active-symbol);
    }

.e-checkbox-wrapper:hover .e-frame.e-check, .e-css.e-checkbox-wrapper:hover .e-frame.e-check, .e-checkbox-wrapper:hover .e-checkbox:focus + .e-frame.e-check, .e-css.e-checkbox-wrapper:hover .e-checkbox:focus + .e-frame.e-check {
    background: var(--uxp-checkbox-background-active);
    border-color: var(--uxp-checkbox-border-active);
    color: var(--uxp-checkbox-active-symbol);
}

.e-checkbox-wrapper .e-checkbox:active + .e-frame.e-check, .e-css.e-checkbox-wrapper .e-checkbox:active + .e-frame.e-check {
    background: var(--uxp-checkbox-background-active);
    border-color: var(--uxp-checkbox-border-active);
    color: var(--uxp-checkbox-active-symbol);
    box-shadow: none;
}

.e-checkbox-wrapper .e-checkbox:focus + .e-frame.e-check,
.e-css.e-checkbox-wrapper .e-checkbox:focus + .e-frame.e-check {
    background: var(--uxp-checkbox-background-active);
    border-color: var(--uxp-checkbox-border-active);
    color: var(--uxp-checkbox-active-symbol);
    box-shadow: none;
}

/* Unknown */
.e-checkbox-wrapper .e-frame.e-stop,
.e-css.e-checkbox-wrapper .e-frame.e-stop,
.e-checkbox-wrapper:hover .e-frame.e-stop,
.e-css.e-checkbox-wrapper:hover .e-frame.e-stop {
    background: var(--uxp-checkbox-background-active);
    border-color: var(--uxp-checkbox-border-active);
    color: var(--uxp-checkbox-active-symbol);
}

/* Disabled */
.e-checkbox-wrapper.e-checkbox-disabled,
.e-css.e-checkbox-wrapper.e-checkbox-disabled {
    opacity: 1;
}

    .e-checkbox-wrapper.e-checkbox-disabled .e-label,
    .e-css.e-checkbox-wrapper.e-checkbox-disabled .e-label {
        color: var(--uxp-checkbox-disabled);
    }

    .e-checkbox-wrapper.e-checkbox-disabled .e-frame,
    .e-css.e-checkbox-wrapper.e-checkbox-disabled .e-frame {
        background: var(--uxp-checkbox-background);
        border-color: var(--uxp-checkbox-disabled);
    }

        .e-checkbox-wrapper.e-checkbox-disabled .e-frame.e-check,
        .e-css.e-checkbox-wrapper.e-checkbox-disabled .e-frame.e-check {
            background: var(--uxp-checkbox-disabled);
            border-color: var(--uxp-checkbox-disabled);
            color: var(--uxp-checkbox-active-symbol);
        }

.e-checkbox-wrapper .e-check::before,
.e-css.e-checkbox-wrapper .e-check::before {
    line-height: 14px;
}

.e-checkbox-wrapper .e-frame + .e-label,
.e-css.e-checkbox-wrapper .e-frame + .e-label {
    line-height: 16px;
}

.e-checkbox-wrapper .e-label,
.e-css.e-checkbox-wrapper .e-label,
.e-checkbox-wrapper:hover .e-label,
.e-css.e-checkbox-wrapper:hover .e-label {
    font-family: var(--uxp-font-default);
    color: var(--uxp-label-text);
}

/* ------------------------------------------------------------------------- */
/* --- Label & ValidationGroup --------------------------------------------- */
/* ------------------------------------------------------------------------- */
.form-group {
    margin-bottom: 16px;
}

    .form-group.is-required:not(.hide-required-asterisk) > label::after {
        content: "*";
        order: 1;
        font-size: 14px;
        color: var(--uxp-label-required);
        line-height: 20px;
        font-family: var(--uxp-font-default);
    }

    .form-group.is-required:not(.hide-required-asterisk) > label > * {
        order: 2;
    }

label, .e-rte-label label {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    font-family: var(--uxp-font-default);
    color: var(--uxp-label-text);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 4px;
}

    label.label-no-margin {
        margin-bottom: 0;
    }

    label.no-bold {
        font-weight: 400;
    }
/* ------------------------------------------------------------------------- */
/* --- TextValue ----------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.text-value {
    font-size: 14px;
    line-height: 20px;
    min-width: 1px;
    font-weight: 400;
    color: var(--uxp-textvalue-text);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

    .text-value.empty-background {
        background-color: var(--cso-gray-100);
        border-radius: 4px;
    }

    .text-value.bold {
        font-weight: 700;
    }
    /*.text-value.text-value-number,*/
    .text-value.text-value-date {
        font-family: var(--uxp-font-monospace);
    }
/* ------------------------------------------------------------------------- */
/* --- Tooltip ------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */

.e-tooltip {
    font-size: 14px;
    width: fit-content;
}

/* The helper icon is the badge carrying an explanation next to a label.
   The element carries the icon font classes too, and those come from a stylesheet
   loaded after this one, so the selector has to be more specific than a single class to win back
   the display, the size and the line height. Making it a flex box is what centers the glyph in
   the badge, and the badge on the text of its label, whatever the metrics of the icon font. */
em.tooltip-helper {
    box-sizing: border-box;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border: 1px solid var(--uxp-tooltip-helper);
    border-radius: 50%;
    color: var(--uxp-tooltip-helper);
    font-size: 8px;
    line-height: 1;
}

    em.tooltip-helper.alert-tooltip {
        color: var(--uxp-palette-danger);
        border-color: var(--uxp-palette-danger);
    }

/* Correctif pour tooltips des grids */
.e-tooltip-wrap.e-popup {
    z-index: 1056; /* Doit être supérieur au z-index des modals */
    margin: 0;
    /* Le tooltip ne doit jamais capter le curseur, sinon le survoler déclenche un mouseleave sur la cible
       (fermeture) puis un mouseenter (réouverture) => clignotement. */
    /*pointer-events: none;*/
    background: var(--uxp-tooltip-background);
    border-color: var(--uxp-tooltip-border);
    box-shadow: var(--uxp-elevation-tooltip);
}

.e-tooltip-wrap .e-arrow-tip-outer.e-tip-top {
    border-bottom-color: var(--uxp-tooltip-border);
}

.e-tooltip-wrap .e-arrow-tip-outer.e-tip-bottom {
    border-top-color: var(--uxp-tooltip-border);
}

.e-tooltip-wrap .e-arrow-tip-outer.e-tip-left {
    border-right-color: var(--uxp-tooltip-border);
}

.e-tooltip-wrap .e-arrow-tip-outer.e-tip-right {
    border-left-color: var(--uxp-tooltip-border);
}

.e-tooltip-wrap .e-arrow-tip-inner {
    color: var(--uxp-tooltip-background);
}

.e-tooltip-wrap .e-tip-content {
    padding: 8px 16px;
    color: var(--uxp-tooltip-text);
    line-height: 20px;
    font-size: 14px;
    font-weight: 400;
}

.configuration-tooltip {
    color: var(--uxp-configuration-tooltip-helper);
}

/* ------------------------------------------------------------------------- */
/* --- ValidationGroup ----------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.form-group.has-error label {
    color: var(--uxp-label-text);
}

.form-group.has-error .help-block {
    color: var(--uxp-palette-danger);
    line-height: 16px;
    font-size: 12px;
    position: relative;
    margin-top: 6px;
    margin-left: 16px;
}

    .form-group.has-error .help-block::before {
        position: absolute;
        left: -16px;
        top: 1px;
        content: "\f06a";
        font-family: var(--uxp-font-icon);
        font-weight: 900;
        -webkit-font-smoothing: antialiased;
        display: var(--fa-display, inline-block);
        font-style: normal;
        font-variant: normal;
        line-height: 1;
        text-rendering: auto;
        width: 12px;
        height: 12px;
        margin-right: 2px;
    }
/* ValidationGroup error */
/*Default*/
.form-group.has-error .e-input-group.e-success, .form-group.has-error .e-input-group.e-control-wrapper.e-success, .form-group.has-error .e-input-group.e-success:not(.e-float-icon-left), .form-group.has-error .e-input-group.e-control-wrapper.e-success:not(.e-float-icon-left), .form-group.has-error .e-input.e-success, .form-group.has-error .e-input.e-success:focus, .form-group.has-error .e-input-group:not(.e-success):not(.e-warning):not(.e-error), .form-group.has-error .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error),
/*Focus*/
.form-group.has-error .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error), .form-group.has-error .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error), .form-group.has-error .e-input-group.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled), .form-group.has-error .e-input-group.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled), .form-group.has-error .e-float-input.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled), .form-group.has-error .e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled), .form-group.has-error .e-float-input.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]), .form-group.has-error .e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]), .form-group.has-error .e-float-input.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]), .form-group.has-error .e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]),
/*Success*/
.form-group.has-error .e-input-group.e-input-focus:not(.e-error):not(.e-warning).e-success, .form-group.has-error .e-input-group.e-control-wrapper.e-input-focus:not(.e-error):not(.e-warning).e-success, .form-group.has-error .e-input-group.e-input-focus:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success, .form-group.has-error .e-input-group.e-input-focus.e-control-wrapper:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success {
    border-color: var(--uxp-palette-danger);
    box-shadow: inset 0 0 0 1px var(--uxp-palette-danger);
}
/* ------------------------------------------------------------------------- */
/* --- Tooltip Picker ------------------------------------------------------ */
/* ------------------------------------------------------------------------- */
.tooltip-picker-menu.show {
    width: 152px;
    display: flex !important;
    flex-wrap: wrap;
}

.tooltip-picker-menu .dropdown-item {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #efefef;
}

    .tooltip-picker-menu .dropdown-item:has(em):not(.disabled) {
        border: solid 1px white;
        background-color: #FF6600;
        border-radius: 50%;
    }
/* ------------------------------------------------------------------------- */
/* --- FullSizeText -------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.full-size-text {
    height: 100%;
    line-height: 1;
    white-space: nowrap;
}

    .full-size-text > div {
        width: 100%;
        height: 100%;
    }
/* -------------------------------------- */
/* RowCol Visibility Animation (Collapse) */
/* -------------------------------------- */
.cso-collapse:not(.show) {
    display: none;
}

.cso-collapse-horizontal {
    max-width: 0;
}

    .cso-collapse-horizontal.show {
        max-width: 100%;
    }

.cso-collapsing {
    overflow: hidden;
}

    .cso-collapsing.before-showing {
        opacity: 0;
        visibility: hidden;
        height: 0;
        width: 0;
        padding: 0;
        margin: 0;
        border: none;
    }

    .cso-collapsing.cso-collapse-horizontal {
        transition: max-width .35s ease, padding .35s ease, margin .35s ease;
    }

        .cso-collapsing.cso-collapse-horizontal.hiding {
            max-width: 0 !important;
            padding-left: 0;
            padding-right: 0;
        }
/* ------------------------------------------------------------------------- */
/* --- Spinner ------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.uxp-spinner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

    .uxp-spinner .spinner-container {
        display: flex;
        height: 44px;
        width: 44px;
    }

    .uxp-spinner.spinner-xs .spinner-container, .uxp-spinner.spinner-sm .spinner-container {
        height: 20px;
        width: 20px;
    }

    .uxp-spinner.spinner-xl .spinner-container, .uxp-spinner.spinner-lg .spinner-container {
        height: 56px;
        width: 56px;
    }

    .uxp-spinner.spinner-xl label, .uxp-spinner.spinner-lg label {
        font-size: 16px;
    }

    .uxp-spinner svg {
        animation: rotate 0.8s linear infinite;
        width: 100%;
        height: 100%;
    }

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

.page-spinner {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1060;
    display: none;
    overflow: hidden;
    outline: 0;
    background: var(--uxp-modal-backdrop);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    user-select: none;
}
/* ------------------------------------------------------------------------- */
/* --- Modals, Dialogs (from components) & Boxes (TODO : référencer Box dans Modals) ------------------------------------------------------ */
/* ------------------------------------------------------------------------- */
.modal-backdrop {
    display: none;
}

.modal {
    background: var(--uxp-modal-backdrop);
    backdrop-filter: blur(4px);
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: var(--bs-modal-margin);
}

    .modal > div {
        display: contents;
    }

.modal-dialog {
    max-height: calc(100dvh - 2 * var(--bs-modal-margin));
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    width: var(--uxp-modal-size);
    max-width: var(--uxp-modal-size);
}
/* Variantes de tailles */
.modal-sm {
    width: var(--uxp-modal-size-sm);
    max-width: var(--uxp-modal-size-sm);
}

.modal-lg {
    width: var(--uxp-modal-size-lg);
    max-width: var(--uxp-modal-size-lg);
}

.modal-xl {
    width: var(--uxp-modal-size-xl);
    max-width: var(--uxp-modal-size-xl);
}

.modal-fit {
    width: fit-content;
    max-width: fit-content;
}

.modal-fullwidth {
    width: calc(100% - (2* var(--bs-modal-margin)));
    max-width: calc(100% - (2* var(--bs-modal-margin)));
}

.modal-content, .box, .e-popup.e-popup-open.e-dialog {
    flex: 0 1 auto;
    min-height: 0;
    border-radius: 16px;
    background: var(--uxp-modal-background);
    border: 1px solid var(--uxp-modal-border);
    color: var(--uxp-modal-text);
    display: flex;
    flex-direction: column;
    max-height: 100%;
    min-height: 0;
}

.modal-content, .box {
    position: relative;
}

.modal-content {
    box-shadow: var(--uxp-elevation-modal);
}

.box {
    display: flex;
    flex-direction: column;
    width: 100%;
    box-shadow: none;
    margin-bottom: 16px; /* TODO */
}

    .box > .box-body {
        overflow: unset;
    }

    .box.grow-box {
        height: 100%;
        min-height: 0;
    }

        .box.grow-box > .box-body {
            overflow: auto;
            flex-grow: 1;
        }

    .box.box-full-height {
        max-height: 100%;
        height: 100%;
    }

        .box.box-full-height > .box-body {
            overflow: auto;
            max-height: 100%;
            height: 100%;
        }

    /* Box : small titles */
    .box.small-title > .box-header {
        position: absolute;
        z-index: 1;
        background: var(--uxp-modal-background);
        border-radius: 8px;
        padding: 2px 8px;
        border: 1px solid var(--uxp-modal-border);
        top: -13px;
        left: 20px;
        min-height: 20px;
        min-width: 40px;
    }

        .box.small-title > .box-header > .box-title {
            font-size: 16px;
            margin-bottom: 0;
        }

    .box.small-title > .box-body {
        padding-top: 20px;
    }

.modal-header,
.box-header,
.e-dialog .e-dlg-header-content {
    flex: 0 0 auto;
    padding: 16px 20px 8px;
    line-height: 24px;
    border-bottom: 0px;
    align-items: flex-start;
}

    .modal-title,
    .box-title,
    .e-dialog .e-dlg-header-content .e-dlg-header {
        font-size: 20px;
        font-weight: 500;
        line-height: 24px;
        color: var(--uxp-modal-title);
        margin-bottom: 0;
    }

.modal-subtitle,
.box-subtitle {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.modal-subtitle {
    color: var(--uxp-modal-subtitle);
}

.box-subtitle {
    color: var(--uxp-text-descriptive);
}


.modal-body,
.box-body,
.e-dialog .e-dlg-content {
    flex: 0 1 auto;
    overflow-y: auto;
    min-height: 0;
    padding: 20px 20px 16px;
    background: transparent;
}

.e-dialog .e-dlg-header-content + .e-dlg-content {
    padding: 8px 20px 16px;
}

.modal-footer, .box-footer, .e-dialog .e-footer-content {
    flex: 0 0 auto;
    padding: 16px 24px;
    gap: 16px;
    background: var(--uxp-modal-footer-background);
    border-top: 1px solid var(--uxp-modal-border);
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

    .modal-footer > * {
        margin: 0;
    }

.modal-header .btn-close {
    padding: 0;
    margin: 0 !important;
}

.btn-close, .e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
    background-image: none;
    mask-image: var(--uxp-modal-close-button);
    -webkit-mask-image: var(--uxp-modal-close-button);
    background-color: var(--uxp-close-button);
    padding: 0;
    height: 16px;
    width: 16px;
}

    .btn-close:hover, .e-dialog .e-btn.e-dlg-closeicon-btn:hover {
        background-color: var(--uxp-close-button-hover);
    }

    .btn-close, .btn-close:hover, .btn-close:focus, .btn-close:active, .e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn, .e-dialog .e-btn.e-dlg-closeicon-btn:hover, .e-dialog .e-btn.e-dlg-closeicon-btn:focus, .e-dialog .e-btn.e-dlg-closeicon-btn:active {
        opacity: 1;
    }

.e-dialog .e-icon-dlg-close::before {
    content: none;
}

.e-dialog .e-img-uploadwrap .e-droptext, .e-dialog .e-aud-uploadwrap .e-droptext, .e-dialog .e-vid-uploadwrap .e-droptext, .e-dialog .e-word-uploadwrap .e-droptext, .e-dialog.e-device .e-vid-uploadwrap .e-droptext {
    font-family: var(--uxp-font-default);
    color: var(--uxp-label-text);
}
/* Inversion des boutons dans le footer SF */
.e-dialog .e-footer-content {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}

    .e-dialog .e-footer-content .e-btn {
        margin-left: 0px;
    }
/* HorizontalRule (hr) */
hr {
    border: 0;
    border-top: 1px solid var(--uxp-horizontal-rule);
    opacity: 1;
    margin: 1rem 0;
}

.uxp-horizontal-rule {
    position: relative;
}

.uxp-horizontal-rule-title {
    position: absolute;
    background: var(--uxp-horizontal-rule-title-background);
    border: 1px solid var(--uxp-horizontal-rule);
    border-radius: 8px;
    padding: 2px 8px;
    width: fit-content;
    height: fit-content;
    line-height: 1;
    font-size: 16px;
    font-weight: 700;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
/* ------------------------------------------------------------------------- */
/* --- Tabs ---------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
/* TODO : à suppr lors de la suppression du composant BoxTab */
.box-tab:not(.box-rounded) {
    border-radius: 0 !important;
}
/* Tab in paper */
.uxp-paper > .uxp-tabs .uxp-tabs-content {
    padding: 16px 24px 20px;
}

/* Tab in modal - overflow dans le tab plutot quand le modal-body */
.modal-body:has(> .uxp-tabs) {
    overflow: visible !important;
}

.modal-body > .uxp-tabs .uxp-tabs-content > .uxp-tabs-panel {
    max-height: calc(100dvh - 207px); /*TODO gérer avec variables*/
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
}
/* Tab vertical in modal - gestion du style */
.modal-body:has(> .uxp-tabs.tab-left-header),
.modal-body:has(> form > fieldset > .uxp-tabs.tab-left-header) {
    padding: 0;
}

.modal-body > .uxp-tabs.tab-left-header > .uxp-tabs-navigation,
.modal-body > form > fieldset > .uxp-tabs.tab-left-header > .uxp-tabs-navigation {
    background: var(--uxp-modal-footer-background); /* TODO */
    border-right: none;
}




/* Wizard dans Modal HideFooter */
.modal-body.hide-footer:has(.wizard.wizard-replace-modal-footer) {
    padding: 0;
}

/* ------------------------------------------------------------------------- */
/* --- AssociationListbox -------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.association-listbox-container .e-list-item,
.association-listbox-container .e-listbox-container:not(.e-list-template) .e-list-item {
    height: auto;
}

.association-listbox-container .e-listbox-container {
    background: var(--uxp-association-listbox-background) !important;
    color: var(--uxp-input-text);
    border: 1px solid var(--uxp-association-listbox-border) !important;
    border-radius: 16px;
    padding: 20px;
}

    .association-listbox-container .e-listbox-wrapper .e-list-item,
    .association-listbox-container .e-listbox-container .e-list-item,
    .e-listboxtool-wrapper .e-list-item {
        color: var(--uxp-input-text);
        border: 2px solid transparent;
        box-sizing: border-box;
        position: relative;
        display: flex;
        justify-content: space-between;
        align-items: center;
        word-break: break-word;
    }

        .association-listbox-container .e-list-item::after,
        .e-listboxtool-wrapper .e-list-item::after {
            content: "";
            display: inline-block;
            width: 16px;
            height: 16px;
            margin-left: 12px;
            flex-shrink: 0;
        }

        .e-listbox-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled),
        .e-listbox-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
        .e-listbox-container .e-list-item:hover:not(.e-selected):not(.e-disabled),
        .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
        .e-listboxtool-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled),
        .e-listboxtool-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
            background-color: var(--uxp-association-listbox-hover-background);
            border-color: transparent;
            color: var(--uxp-input-text);
            border-radius: 8px;
        }

.e-list-parent .e-list-item.e-selected {
    background-color: var(--uxp-association-listbox-selected-background);
    border-color: transparent;
    border-radius: 8px;
}

    .e-list-parent .e-list-item.e-selected::before {
        content: '';
        position: absolute;
        top: -2px;
        left: -2px;
        right: -2px;
        bottom: -2px;
        border: 2px solid var(--uxp-association-listbox-selected-border);
        border-radius: 8px;
        box-sizing: border-box;
        pointer-events: none;
    }

    .e-list-parent .e-list-item.e-selected::after {
        content: "\f00c";
        font-family: var(--uxp-font-icon);
        color: var(--uxp-association-listbox-selected-border);
        font-weight: 900;
    }

    .e-list-parent .e-list-item.e-selected:has(+ .e-list-item.e-selected) {
        /*border-bottom-color: var(--uxp-association-listbox-selected-background);*/
        /*border-bottom-width: 1px;*/
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .e-list-parent .e-list-item.e-selected + .e-list-item.e-selected {
        border-top-width: 2px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

        .e-list-parent .e-list-item.e-selected + .e-list-item.e-selected::before {
            border-top-width: 2px;
            border-top-left-radius: 0;
            border-top-right-radius: 0;
        }

    .e-list-parent .e-list-item.e-selected:has(+ .e-list-item.e-selected)::before {
        border-bottom: none;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }



/* ------------------------------------------------------------------------- */
/* --- DataGrid ------------------------------------------------------------ */
/* ------------------------------------------------------------------------- */
/*.e-grid .e-table {
    border-collapse: collapse !important;
}*/
/* Width 100% après autofit des colonnes */
.uxp-grid-container {
    position: relative;
    display: flex;
    flex-direction: column;
}

.uxp-grid-toolbar:not(:has(> div:not(:empty))) {
    height: 0;
    margin: 0;
}

.uxp-loaded-grid .e-table, .uxp-loaded-grid .e-table.e-tableborder {
    min-width: 100% !important;
}

.e-grid {
    font-family: var(--uxp-font-default);
    border: none;
}

    .e-grid .e-groupdroparea,
    .e-grid .e-detailheadercell,
    .e-grid .e-table,
    .e-grid .e-gridheader,
    .e-grid .e-content,
    .e-grid .e-gridcontent,
    .e-grid .e-rowdragheader,
    .e-grid .e-grouptopleftcell {
        background: transparent;
    }

    .e-grid.sf-grid :is(.e-groupdroparea,.e-groupdroparea .e-groupsort,.e-groupdroparea .e-ungroupbutton,.e-headercontent th.e-headercell:not(.e-menu-item):not(.e-editedbatchcell),.e-headercontent td.e-rowcell:not(.e-menu-item):not(.e-editedbatchcell),.e-content td.e-rowcell:not(.e-menu-item):not(.e-editedbatchcell),.e-content td.e-groupcaption:not(.e-menu-item):not(.e-editedbatchcell),.e-content td.e-recordplusexpand:not(.e-menu-item):not(.e-editedbatchcell),.e-content td.e-recordpluscollapse:not(.e-menu-item):not(.e-editedbatchcell),.e-content td.e-detailrowcollapse:not(.e-menu-item):not(.e-editedbatchcell),.e-content td.e-detailrowexpand:not(.e-menu-item):not(.e-editedbatchcell),.e-content th.e-detailcell:not(.e-menu-item):not(.e-editedbatchcell)):is(:focus,:focus-visible) {
        box-shadow: none;
    }

    .e-grid .e-groupdroparea.e-grouped,
    .e-grid .e-summarycell,
    .e-grid .e-groupcaption,
    .e-grid .e-indentcell,
    .e-grid .e-recordplusexpand,
    .e-grid .e-recordpluscollapse {
        background: transparent;
        color: var(--uxp-grid-text);
    }

    .e-grid .e-rowcell,
    .e-grid .e-groupcaption,
    .e-grid .e-indentcell,
    .e-grid .e-recordplusexpand,
    .e-grid .e-recordpluscollapse,
    .e-grid .e-rowdragdropcell,
    .e-grid .e-detailrowcollapse,
    .e-grid .e-detailrowexpand,
    .e-grid .e-detailindentcell,
    .e-grid .e-detailcell,
    .e-grid .e-emptyrow.e-show-added-row .e-lastrowcell {
        border-color: var(--uxp-grid-header-border);
    }

    .uxp-grid,
    .e-grid .e-groupdroparea,
    .e-grid .e-table,
    .e-grid.sf-grid.e-default.e-bothlines .e-headercell,
    .e-grid.sf-grid.e-default.e-bothlines .e-detailheadercell {
        border: none;
    }

    .e-grid .e-toolbar {
        border: none;
        background: transparent;
    }

    .e-grid.toolbar-disabled .e-toolbar {
        display: none;
    }

    .e-grid .e-headercontent {
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
    }

    .e-grid .e-headercell {
        background: var(--uxp-grid-header-background);
        height: 52px;
        /*padding: 8px 16px;*/ /* Padding trop grand rendant de nombreux header illisibles avec "..." */
    }

    .e-grid .e-gridheader {
        border-top: none;
        border-bottom: 1px solid var(--uxp-grid-header-border);
    }

    .e-grid .e-headertext {
        -ms-flex-order: 0 !important;
        order: 0 !important;
        text-align: left !important;
        color: var(--uxp-grid-header-text);
        font-size: 14px;
        line-height: 20px;
        font-weight: 500;
    }

    .e-grid .e-rightalign .e-headercell-container .e-headercelldiv,
    .e-grid .e-rightalign .e-headercell-container .e-headertext {
        order: 0;
    }

    .e-grid th.e-headercell[aria-sort=ascending]:not(.e-columnselection) .e-headertext,
    .e-grid th.e-headercell[aria-sort=descending]:not(.e-columnselection) .e-headertext,
    .e-grid th.e-headercell[aria-sort=ascending] .e-sortfilterdiv,
    .e-grid th.e-headercell[aria-sort=descending] .e-sortfilterdiv {
        color: var(--uxp-grid-header-text);
    }


    .e-grid.e-resize-lines .e-headercell .e-rhandler,
    .e-grid.e-resize-lines .e-headercell .e-rsuppress {
        border-right: 2px solid var(--uxp-grid-header-separator);
        height: 20px;
        top: 50%;
        transform: translateY(-50%);
    }

    .e-grid .e-gridheader .e-icons:not(.e-icon-hide):not(.e-check):not(.e-stop):not(.e-icon-reorderuparrow):not(.e-icon-reorderdownarrow):not(.e-sortfilterdiv) {
        color: var(--uxp-grid-header-text);
    }

    .e-grid .e-sortfilterdiv,
    .e-grid .e-filtered::before {
        color: var(--uxp-button-secondary-transparent-text) !important;
    }

    .e-grid.sf-grid.e-resize-lines th:focus .e-rhandler,
    .e-grid.sf-grid.e-resize-lines th:focus .e-rsuppress,
    .e-grid.sf-grid.e-resize-lines th:focus-visible .e-rhandler,
    .e-grid.sf-grid.e-resize-lines th:focus-visible .e-rsuppress {
        border-right: 2px solid var(--uxp-grid-header-separator);
    }

    .e-grid.e-bothlines .e-rowcell {
        border-color: var(--uxp-grid-border);
        border-left: none;
    }


    .e-grid .e-rowcell:not(.e-editedbatchcell):not(.e-updatedtd),
    .e-grid .e-detailrowcollapse:not(.e-editedbatchcell):not(.e-updatedtd),
    .e-grid .e-detailrowexpand:not(.e-editedbatchcell):not(.e-updatedtd),
    .e-grid .e-gridcontent .e-rowdragdrop:not(.e-editedbatchcell):not(.e-updatedtd),
    .e-grid .e-gridheader .e-rowdragdrop:not(.e-editedbatchcell):not(.e-updatedtd),
    .e-grid .e-emptyrow:not(.e-editedbatchcell):not(.e-updatedtd) {
        color: var(--uxp-grid-text);
    }

        .e-grid .e-rowcell:not(.e-editedbatchcell):not(.e-updatedtd) > div {
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }

    .e-grid .e-headercontent,
    .e-grid.sf-grid .e-gridfooter .e-summarycontent {
        border-color: transparent;
    }

    .e-grid .e-rowcell .e-checkbox-wrapper,
    .e-grid .e-rowcell .e-css.e-checkbox-wrapper {
        height: 100%;
        top: 0;
        display: flex;
    }

.e-grid {
    padding-top: 0;
}

    .e-grid .e-headercelldiv:has(.uxp-grid-header),
    .e-grid .e-headercelldiv:has(.uxp-grid-header) .e-headertext,
    .e-grid .uxp-grid-header {
        display: contents;
    }

    .e-grid .uxp-grid-header-text {
        order: 0;
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .e-grid .e-headercell-container:has(.uxp-grid-header) .e-sortfilterdiv {
        order: 1;
    }

    .e-grid .uxp-grid-header-group {
        order: 2;
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        font-size: 12px;
        color: var(--uxp-grid-header-text);
        cursor: pointer;
    }

        .e-grid .uxp-grid-header-group.is-grouped {
            color: var(--uxp-button-secondary-transparent-text);
        }

    .e-grid .e-headercell-container:has(.uxp-grid-header) .e-filtermenudiv {
        order: 3;
    }

    .e-grid .e-groupheadercell,
    .e-grid .e-groupheadercell:hover {
        background: var(--uxp-input-popup-active);
        border: 2px solid var(--uxp-input-popup-active-border);
        margin: 0;
        padding: 0 6px;
        display: flex;
        align-items: center;
    }



        .e-grid .e-groupheadercell > div {
            display: flex;
            gap: 8px;
        }

            .e-grid .e-groupheadercell > div > span {
                margin: 0;
                padding: 0;
                color: var(--uxp-input-text);
            }
    /* Summary Cells */
    .e-grid .e-summaryrow .e-summarycell,
    .e-grid .e-summaryrow .e-templatecell,
    .e-grid .e-summarycontent .e-indentcell,
    .e-grid .e-indentcell.e-detailindentcelltop,
    .e-grid .e-groupfooterrow.e-summaryrow .e-indentcell.e-indentcelltop {
        background-color: var(--uxp-grid-aggregate-background);
        border-color: var(--uxp-grid-border);
        color: var(--uxp-grid-text);
    }

    .e-grid .e-gridfooter,
    .e-grid .e-gridfooter .e-leftfreeze,
    .e-grid .e-gridfooter .e-rightfreeze,
    .e-grid .e-gridfooter .e-fixedfreeze {
        background-color: transparent;
    }
/*th.uxp-actions-column,
td.uxp-actions-column {
    width: 1% !important;
    white-space: nowrap;
}*/
/* Boutons actions dans une grille */
td.uxp-actions-column > div {
    width: fit-content;
    display: flex;
    gap: 4px;
}
/* Correctif pour Grid Height 100% */
.uxp-grid-container:has(.grid-100h) {
    height: 100%;
}

.uxp-grid-container .grid-100h {
    height: calc(100% - var(--uxp-grid-header-toolbar-height) - var(--uxp-grid-header-toolbar-margin-top) - var(--uxp-grid-header-toolbar-margin-bottom)) !important; /*TODO */
}
/* --- Selection --------------------------------- */
/* Le !important des box-shadow est nécessaire */
.e-grid td.e-active {
    background: transparent;
}
/* Cellules sélectionnées */
/*.e-grid .e-row:has(> td.e-active) {
    box-shadow: 0 1px 0 0 var(--uxp-grid-row-selected-border) !important;
    position: relative;
    z-index: 1;
}*/

.e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled) td {
    background-color: var(--uxp-grid-row-selected-background);
    box-shadow: inset 0 1px 0 0 var(--uxp-grid-row-selected-border), inset 0 -1px 0 0 var(--uxp-grid-row-selected-border) !important;
    border-color: var(--uxp-grid-row-selected-border) !important;
}

    .e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled) td:first-child {
        border-top-left-radius: 8px;
        box-shadow: inset 2px 1px 0 0 var(--uxp-grid-row-selected-border), inset 0 -1px 0 0 var(--uxp-grid-row-selected-border) !important;
    }

    .e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled) td:last-child {
        border-top-right-radius: 8px;
        box-shadow: inset -2px 1px 0 0 var(--uxp-grid-row-selected-border), inset 0 -1px 0 0 var(--uxp-grid-row-selected-border) !important;
    }
/*  Lignes consécutives */
.e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled) + .e-row:has(> td.e-active):not(.uxp-selection-disabled) td {
    /*border-color: var(--uxp-grid-row-selected-border);*/
    box-shadow: inset 0 -1px 0 0 var(--uxp-grid-row-selected-border) !important;
}

    .e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled) + .e-row:has(> td.e-active):not(.uxp-selection-disabled) td:first-child {
        border-top-left-radius: 0;
        box-shadow: inset 2px 0 0 0 var(--uxp-grid-row-selected-border), inset 0 -1px 0 0 var(--uxp-grid-row-selected-border) !important;
    }

    .e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled) + .e-row:has(> td.e-active):not(.uxp-selection-disabled) td:last-child {
        border-top-right-radius: 0;
        box-shadow: inset -2px 0 0 0 var(--uxp-grid-row-selected-border), inset 0 -1px 0 0 var(--uxp-grid-row-selected-border) !important;
    }
/* Dernière (et 1ère)ligne sélectionnée */
.e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled):not(:has(+ .e-row:not(.uxp-selection-disabled) > td.e-active)) { /* On triche en ciblant la ligne et pas la cellule */
    box-shadow: 0 1px 0 0 var(--uxp-grid-row-selected-border) !important;
    /*box-shadow: 0 1px 0 0 var(--uxp-grid-row-selected-border), 0 -1px 0 0 var(--uxp-grid-row-selected-border) !important;*/
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    position: relative;
    z-index: 1;
}
    /*.e-grid .e-row:has(> td.e-active):not(:has(+ .e-row > td.e-active)) td {
            box-shadow: 0 -2px 0 0 red !important;*/
    /*box-shadow: 0 1px 0 0 var(--uxp-grid-row-selected-border) !important;*/
    /*}*/


    .e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled):not(:has(+ .e-row:not(.uxp-selection-disabled) > td.e-active)) td:first-child {
        border-bottom-left-radius: 8px;
    }

    .e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled):not(:has(+ .e-row:not(.uxp-selection-disabled) > td.e-active)) td:last-child {
        border-bottom-right-radius: 8px;
    }

.e-grid .e-gridcontent tr.e-row:first-child .e-rowcell {
    border-top-width: 1px !important;
    border-top-style: solid !important;
}

.e-grid .e-gridcontent tr.e-row:first-child:not(:has(> td.e-active)) .e-rowcell,
.e-grid .e-gridcontent tr.e-row:first-child.uxp-selection-disabled .e-rowcell {
    border-top-color: transparent !important;
}

.e-grid .e-row:has(> td.e-active):not(.uxp-selection-disabled):not(:has(+ .e-row:not(.uxp-selection-disabled) > td.e-active)):has(> td.e-lastrowcell) {
    box-shadow: none !important;
}

.e-grid .e-table {
    padding-bottom: 1px;
}

/* Suppression multiple */
.e-grid .e-disabled.uxp-disabled-delete {
    cursor: default !important;
    pointer-events: none !important;
    user-select: none !important;
}

    .e-grid .e-disabled.uxp-disabled-delete .e-check {
        border: 1px solid var(--uxp-checkbox-border);
        background: var(--uxp-checkbox-background);
    }

        .e-grid .e-disabled.uxp-disabled-delete .e-check::before {
            content: "" !important;
        }


.uxp-grid-toolbar {
    margin: var(--uxp-grid-header-toolbar-margin-top) 0 var(--uxp-grid-header-toolbar-margin-bottom);
    height: var(--uxp-grid-header-toolbar-height);
}
/* --- Pager --------------------------------------------------------------- */
.e-grid .e-pager {
    display: none;
}

.uxp-pager {
    display: flex;
}

    .uxp-pager button {
        padding: 0;
        min-width: 32px !important;
        height: 32px;
        position: relative;
    }

        .uxp-pager button.active {
            font-weight: 500;
        }

            .uxp-pager button.active::after {
                content: "";
                position: absolute;
                left: 50%;
                bottom: 0;
                /* Ajustement du centrage horizontal */
                transform: translateX(-50%);
                /* Dimensions de la bande noire */
                width: 16px;
                height: 2px;
                /* Style visuel */
                background-color: var(--uxp-button-primary-transparent-text);
                border-radius: 2px;
            }
/*.uxp-pager .pager-btn {
    background: transparent;
    border: none;
}
*/
/* ------------------------------------------------------------------------- */
/* --- Backgrounds --------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.bg-primary {
    background-color: var(--uxp-badge-primary) !important;
}

.bg-danger {
    background-color: var(--uxp-badge-danger) !important;
}

.bg-warning {
    background-color: var(--uxp-badge-warning) !important;
}

.bg-success {
    background-color: var(--uxp-badge-success) !important;
}

.bg-info {
    background-color: var(--uxp-badge-info) !important;
}
/* ------------------------------------------------------------------------- */
/* --- Badge --------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.uxp-badge {
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    height: 24px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    border-radius: 4px;
    padding: 1px 7px;
    border: 1px solid;
}

    .uxp-badge > .uxp-badge-content {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        .uxp-badge > .uxp-badge-content > em:not(:only-child):first-child {
            margin-right: 4px;
        }

        .uxp-badge > .uxp-badge-content > em:not(:only-child):last-child {
            margin-left: 4px;
        }

    .uxp-badge.size-xs, .uxp-badge.size-sm {
        height: 20px;
    }

    .uxp-badge.size-xl, .uxp-badge.size-lg {
        height: 32px;
    }

    .uxp-badge.bg-neutral {
        background: var(--uxp-badge-neutral);
        color: var(--uxp-badge-neutral-text);
        border-color: var(--uxp-badge-neutral-border);
    }

    .uxp-badge.bg-primary {
        background: var(--uxp-badge-primary);
        color: var(--uxp-badge-primary-text);
        border-color: var(--uxp-badge-primary);
    }

    .uxp-badge.bg-danger {
        background: var(--uxp-badge-danger);
        color: var(--uxp-badge-danger-text);
        border-color: var(--uxp-badge-danger);
    }

    .uxp-badge.bg-warning {
        background: var(--uxp-badge-warning);
        color: var(--uxp-badge-warning-text);
        border-color: var(--uxp-badge-warning);
    }

    .uxp-badge.bg-success {
        background: var(--uxp-badge-success);
        color: var(--uxp-badge-success-text);
        border-color: var(--uxp-badge-success);
    }

    .uxp-badge.bg-info {
        background: var(--uxp-badge-info);
        color: var(--uxp-badge-info-text);
        border-color: var(--uxp-badge-info);
    }
/* ------------------------------------------------------------------------- */
/* --- Alerts -------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.alert-animate {
    position: fixed;
    z-index: 1100;
    bottom: 0;
    right: 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

    .modal > .alert-animate {
        display: flex;
    }

.alert {
    min-width: 400px;
    border: 2px solid;
    border-radius: 16px;
    padding: 12px 8px 12px 12px;
    display: flex;
    gap: 8px;
}

    .alert em {
        padding: 4px;
        width: 24px;
    }

    .alert .alert-content {
        flex: 1;
    }

        .alert .alert-content h4 {
            font-size: 14px;
            font-weight: 500;
            line-height: 20px;
            padding: 4px 0 2px;
            margin-bottom: 0;
        }

        .alert .alert-content p {
            font-size: 14px;
            font-weight: 400;
            line-height: 20px;
            margin-bottom: 0;
        }

    .alert .btn-close {
        position: relative;
        height: 16px;
        width: 16px;
        padding: 0;
    }

    .alert.alert-danger {
        background: var(--uxp-alert-danger);
        color: var(--uxp-alert-text);
        border-color: var(--uxp-alert-danger-border);
    }

        .alert.alert-danger em {
            color: var(--uxp-alert-danger-border);
        }

    .alert.alert-warning {
        background: var(--uxp-alert-warning);
        color: var(--uxp-alert-text);
        border-color: var(--uxp-alert-warning-border);
    }

        .alert.alert-warning em {
            color: var(--uxp-alert-warning-border);
        }

    .alert.alert-success {
        background: var(--uxp-alert-success);
        color: var(--uxp-alert-text);
        border-color: var(--uxp-alert-success-border);
    }

        .alert.alert-success em {
            color: var(--uxp-alert-success-border);
        }

    .alert.alert-info {
        background: var(--uxp-alert-info);
        color: var(--uxp-alert-text);
        border-color: var(--uxp-alert-info-border);
    }

        .alert.alert-info em {
            color: var(--uxp-alert-info-border);
        }

/* ------------------------------------------------------------------------- */
/* --- DashboardLayout ----------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.dashboard-panel-wrapper {
    height: 100%;
    width: 100%;
}

/* ------------------------------------------------------------------------- */
/* --- Avatars ------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.avatar {
    display: flex;
    height: 64px;
    justify-content: center;
    align-items: center;
    border-radius: var(--uxp-radius-circle);
    aspect-ratio: 1/1;
    background-color: var(--uxp-avatar-background);
    color: var(--uxp-avatar-text);
    font-weight: 700;
    font-size: var(--uxp-text-xl);
}

    .avatar img {
        width: 100%;
        height: 100%;
    }

.profile-menu-user-avatar {
    height: 32px;
    font-size: var(--uxp-text-xs);
}

.uxp-header-profile-avatar {
    height: 28px;
    width: 28px;
    color: var(--uxp-header-background);
    font-size: var(--uxp-text-xs);
}
/* ------------------------------------------------------------------------- */
/* --- Others -------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
.edit-avatar {
    position: relative;
    width: fit-content;
}

    .edit-avatar img {
        height: 64px;
        width: 64px;
    }

    .edit-avatar em {
        position: absolute;
        right: -2px;
        bottom: -2px;
        cursor: pointer;
        width: 24px;
        height: 24px;
        background-color: var(--uxp-modal-background);
        color: var(--uxp-modal-title);
        font-size: 16px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

.box.box-full-height {
    max-height: 100%;
    height: 100%;
}

    .box.box-full-height > .box-body {
        overflow: auto;
        max-height: 100%;
        height: 100%;
    }
/* -------------------------- */
/* ----- POPOVERS ----------- */
/* -------------------------- */
floating-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    transform: translate(var(--floating-left), var(--floating-top));
    min-width: var(--min-width);
    z-index: 1000;
}
/* -------------------------- */
/* ----- SKELETONS ---------- */
/* -------------------------- */
.e-skeleton.e-skeleton-square,
.e-skeleton.e-skeleton-rectangle {
    border-radius: 8px;
}

.e-skeleton.e-skeleton-text,
.e-skeleton.e-skeleton-square,
.e-skeleton.e-skeleton-rectangle,
.e-skeleton.e-skeleton-circle {
    border: 1px solid var(--uxp-skeleton-background);
    background: var(--uxp-skeleton-background);
}

.e-skeleton.e-shimmer-wave::after {
    animation: e-shimmer-wave 1.2s infinite;
    background: var(--uxp-skeleton-shimmer);
}
/* ------------------------- */
/* ----- TREE VIEW --------- */
/* ------------------------- */
.uxp-treeview .e-list-item {
    background-color: var(--uxp-treeview-background);
}

    .uxp-treeview .e-list-item .e-list-text,
    .e-treeview .e-icon-collapsible,
    .e-treeview .e-icon-expandable {
        color: var(--uxp-treeview-text);
    }

.e-treeview .e-list-item > .e-fullrow {
    border: none;
    box-shadow: none !important;
    border-radius: 8px;
}

.e-treeview .e-list-item.e-hover > .e-fullrow,
.e-treeview .e-list-item.e-node-focus > .e-fullrow {
    background-color: var(--uxp-treeview-background-hover);
}

.e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
.e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text,
.e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
.e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
.e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
.e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
    color: var(--uxp-treeview-text);
}

.e-treeview .e-list-item.e-active > .e-fullrow,
.e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
.e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
    background-color: var(--uxp-treeview-row-selected-background);
    border: 2px solid var(--uxp-treeview-row-selected-border);
}

.e-treeview .e-list-item.e-active > .e-text-content,
.e-treeview .e-list-item.e-active > .e-text-content .e-list-text,
.e-treeview .e-list-item.e-active > .e-text-content .e-icon-collapsible,
.e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable,
.e-treeview .e-list-item.e-active.e-hover > .e-text-content,
.e-treeview .e-list-item.e-active.e-node-focus > .e-text-content,
.e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
.e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
    color: var(--uxp-treeview-text);
}

.e-treeview.disabled .e-list-item,
.e-treeview.disabled .e-list-item > .e-fullrow,
.e-treeview.disabled .e-list-item > .e-text-content,
.e-treeview.disabled .e-list-item > .e-text-content:has(.e-list-text > .uxp-treeview-template) > .e-checkbox-wrapper,
.e-treeview .e-list-item > .e-text-content:has(.e-list-text > .uxp-treeview-template:not(.selectable)) > .e-checkbox-wrapper,
.e-treeview .e-list-item:has(.e-text-content > .e-list-text > .uxp-treeview-template:not(.selectable)):active,
.e-treeview .e-list-item:has(.e-text-content > .e-list-text > .uxp-treeview-template:not(.selectable)) > .e-fullrow:active,
.e-treeview .e-list-item:has(.e-text-content > .e-list-text > .uxp-treeview-template:not(.selectable)) > .e-text-content:active {
    /* 29/05/2026 (Tanguy S) Ensure no pointer events when tree item is not selectable. */
    pointer-events: none;
}


/* --- Row Grow ------------------------------------------------------------ */
.uxp-page.d-flex {
    min-height: 0 !important;
}

.uxp-page > .flex-page .row.grow-row {
    flex-grow: 1;
    min-height: 0 !important;
}

    .uxp-page > .flex-page .row.grow-row > .rowcol {
        display: flex;
        flex-direction: column;
    }

        .uxp-page > .flex-page .row.grow-row > .rowcol.col,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-1,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-2,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-3,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-4,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-5,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-6,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-7,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-8,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-9,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-10,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-11,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-12,
        .uxp-page > .flex-page .row.grow-row > .rowcol.col-auto {
            height: 100%;
        }

@media (min-width: 576px) {
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-1,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-2,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-3,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-4,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-5,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-6,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-7,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-8,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-9,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-10,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-11,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-12,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-sm-auto {
        height: 100%;
    }
}

@media (min-width: 768px) {
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-1,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-2,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-3,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-4,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-5,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-6,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-7,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-8,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-9,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-10,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-11,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-12,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-md-auto {
        height: 100%;
    }
}

@media (min-width: 992px) {
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-1,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-2,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-3,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-4,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-5,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-6,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-7,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-8,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-9,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-10,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-11,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-12,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-lg-auto {
        height: 100%;
    }
}

@media (min-width: 1200px) {
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-1,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-2,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-3,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-4,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-5,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-6,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-7,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-8,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-9,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-10,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-11,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-12,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xl-auto {
        height: 100%;
    }
}

@media (min-width: 1400px) {
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-1,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-2,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-3,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-4,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-5,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-6,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-7,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-8,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-9,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-10,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-11,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-12,
    .uxp-page > .flex-page .row.grow-row > .rowcol.col-xxl-auto {
        height: 100%;
    }
}
/* --- End : Row Grow ------------------------------------------------------- */