/* Utilities */
/* ------------------------------------------------------------------------- */

/* Shared primitive tokens, modeled on the shadcn/ui (Tailwind) system.
   New primitives use the --ea- prefix to avoid clashes with host-app / Bootstrap /
   third-party CSS variables.*/
:root {
    /* Components reference these for all animations instead of defining their own timing. */
    /* Easing curves */
    --ea-ease-in: cubic-bezier(0.4, 0, 1, 1);
    --ea-ease-out: cubic-bezier(0, 0, 0.2, 1);
    --ea-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

    /* Duration scale */
    --ea-duration-fast: 100ms; /* overlay fades */
    --ea-duration-default: 150ms; /* default — colors / interactive controls */
    --ea-duration-slow: 200ms; /* rotations, transforms */
    --ea-duration-slower: 300ms; /* drawer / panel slides */

    /* Convenience defaults (used when a component doesn't need to pick) */
    --ea-transition-duration: var(--ea-duration-default);
    --ea-transition-timing: var(--ea-ease-in-out);
}

/* Shared border-radius tokens, modeled on the shadcn/ui radius scale and tied to
   the project's --border-radius* variables. Components expose a "radius" option
   that adds one of these classes; when unset, they inherit the default radius.
   These are loaded last so they reliably override component default radii. */
.ea-rounded-none {
    border-radius: var(--border-radius-none);
}
.ea-rounded-sm {
    border-radius: var(--border-radius-sm);
}
.ea-rounded-md {
    border-radius: var(--border-radius);
}
.ea-rounded-lg {
    border-radius: var(--border-radius-lg);
}
.ea-rounded-full {
    border-radius: var(--border-radius-full);
}

/* Bootstrap's gutter utilities, re-declared on the spacing scale so that grid
   gutters in user content follow the density knob like everything else
   (values are identical to Bootstrap's at the default --ea-spacing). Being in
   the last 'ea' sublayer also lets them defeat the '.row' gutter re-basing of
   variables-theme.css, which would otherwise always win over the original
   utilities of the 'vendor' layer (#7768) */
.g-0,
.gx-0 {
    --bs-gutter-x: 0;
}
.g-0,
.gy-0 {
    --bs-gutter-y: 0;
}
.g-1,
.gx-1 {
    --bs-gutter-x: var(--ea-sp-2);
}
.g-1,
.gy-1 {
    --bs-gutter-y: var(--ea-sp-2);
}
.g-2,
.gx-2 {
    --bs-gutter-x: var(--ea-sp-4);
}
.g-2,
.gy-2 {
    --bs-gutter-y: var(--ea-sp-4);
}
.g-3,
.gx-3 {
    --bs-gutter-x: var(--ea-sp-8);
}
.g-3,
.gy-3 {
    --bs-gutter-y: var(--ea-sp-8);
}
.g-4,
.gx-4 {
    --bs-gutter-x: var(--ea-sp-12);
}
.g-4,
.gy-4 {
    --bs-gutter-y: var(--ea-sp-12);
}
.g-5,
.gx-5 {
    --bs-gutter-x: var(--ea-sp-24);
}
.g-5,
.gy-5 {
    --bs-gutter-y: var(--ea-sp-24);
}
@media (min-width: 576px) {
    .g-sm-0,
    .gx-sm-0 {
        --bs-gutter-x: 0;
    }
    .g-sm-0,
    .gy-sm-0 {
        --bs-gutter-y: 0;
    }
    .g-sm-1,
    .gx-sm-1 {
        --bs-gutter-x: var(--ea-sp-2);
    }
    .g-sm-1,
    .gy-sm-1 {
        --bs-gutter-y: var(--ea-sp-2);
    }
    .g-sm-2,
    .gx-sm-2 {
        --bs-gutter-x: var(--ea-sp-4);
    }
    .g-sm-2,
    .gy-sm-2 {
        --bs-gutter-y: var(--ea-sp-4);
    }
    .g-sm-3,
    .gx-sm-3 {
        --bs-gutter-x: var(--ea-sp-8);
    }
    .g-sm-3,
    .gy-sm-3 {
        --bs-gutter-y: var(--ea-sp-8);
    }
    .g-sm-4,
    .gx-sm-4 {
        --bs-gutter-x: var(--ea-sp-12);
    }
    .g-sm-4,
    .gy-sm-4 {
        --bs-gutter-y: var(--ea-sp-12);
    }
    .g-sm-5,
    .gx-sm-5 {
        --bs-gutter-x: var(--ea-sp-24);
    }
    .g-sm-5,
    .gy-sm-5 {
        --bs-gutter-y: var(--ea-sp-24);
    }
}
@media (min-width: 768px) {
    .g-md-0,
    .gx-md-0 {
        --bs-gutter-x: 0;
    }
    .g-md-0,
    .gy-md-0 {
        --bs-gutter-y: 0;
    }
    .g-md-1,
    .gx-md-1 {
        --bs-gutter-x: var(--ea-sp-2);
    }
    .g-md-1,
    .gy-md-1 {
        --bs-gutter-y: var(--ea-sp-2);
    }
    .g-md-2,
    .gx-md-2 {
        --bs-gutter-x: var(--ea-sp-4);
    }
    .g-md-2,
    .gy-md-2 {
        --bs-gutter-y: var(--ea-sp-4);
    }
    .g-md-3,
    .gx-md-3 {
        --bs-gutter-x: var(--ea-sp-8);
    }
    .g-md-3,
    .gy-md-3 {
        --bs-gutter-y: var(--ea-sp-8);
    }
    .g-md-4,
    .gx-md-4 {
        --bs-gutter-x: var(--ea-sp-12);
    }
    .g-md-4,
    .gy-md-4 {
        --bs-gutter-y: var(--ea-sp-12);
    }
    .g-md-5,
    .gx-md-5 {
        --bs-gutter-x: var(--ea-sp-24);
    }
    .g-md-5,
    .gy-md-5 {
        --bs-gutter-y: var(--ea-sp-24);
    }
}
@media (min-width: 992px) {
    .g-lg-0,
    .gx-lg-0 {
        --bs-gutter-x: 0;
    }
    .g-lg-0,
    .gy-lg-0 {
        --bs-gutter-y: 0;
    }
    .g-lg-1,
    .gx-lg-1 {
        --bs-gutter-x: var(--ea-sp-2);
    }
    .g-lg-1,
    .gy-lg-1 {
        --bs-gutter-y: var(--ea-sp-2);
    }
    .g-lg-2,
    .gx-lg-2 {
        --bs-gutter-x: var(--ea-sp-4);
    }
    .g-lg-2,
    .gy-lg-2 {
        --bs-gutter-y: var(--ea-sp-4);
    }
    .g-lg-3,
    .gx-lg-3 {
        --bs-gutter-x: var(--ea-sp-8);
    }
    .g-lg-3,
    .gy-lg-3 {
        --bs-gutter-y: var(--ea-sp-8);
    }
    .g-lg-4,
    .gx-lg-4 {
        --bs-gutter-x: var(--ea-sp-12);
    }
    .g-lg-4,
    .gy-lg-4 {
        --bs-gutter-y: var(--ea-sp-12);
    }
    .g-lg-5,
    .gx-lg-5 {
        --bs-gutter-x: var(--ea-sp-24);
    }
    .g-lg-5,
    .gy-lg-5 {
        --bs-gutter-y: var(--ea-sp-24);
    }
}
@media (min-width: 1200px) {
    .g-xl-0,
    .gx-xl-0 {
        --bs-gutter-x: 0;
    }
    .g-xl-0,
    .gy-xl-0 {
        --bs-gutter-y: 0;
    }
    .g-xl-1,
    .gx-xl-1 {
        --bs-gutter-x: var(--ea-sp-2);
    }
    .g-xl-1,
    .gy-xl-1 {
        --bs-gutter-y: var(--ea-sp-2);
    }
    .g-xl-2,
    .gx-xl-2 {
        --bs-gutter-x: var(--ea-sp-4);
    }
    .g-xl-2,
    .gy-xl-2 {
        --bs-gutter-y: var(--ea-sp-4);
    }
    .g-xl-3,
    .gx-xl-3 {
        --bs-gutter-x: var(--ea-sp-8);
    }
    .g-xl-3,
    .gy-xl-3 {
        --bs-gutter-y: var(--ea-sp-8);
    }
    .g-xl-4,
    .gx-xl-4 {
        --bs-gutter-x: var(--ea-sp-12);
    }
    .g-xl-4,
    .gy-xl-4 {
        --bs-gutter-y: var(--ea-sp-12);
    }
    .g-xl-5,
    .gx-xl-5 {
        --bs-gutter-x: var(--ea-sp-24);
    }
    .g-xl-5,
    .gy-xl-5 {
        --bs-gutter-y: var(--ea-sp-24);
    }
}
@media (min-width: 1400px) {
    .g-xxl-0,
    .gx-xxl-0 {
        --bs-gutter-x: 0;
    }
    .g-xxl-0,
    .gy-xxl-0 {
        --bs-gutter-y: 0;
    }
    .g-xxl-1,
    .gx-xxl-1 {
        --bs-gutter-x: var(--ea-sp-2);
    }
    .g-xxl-1,
    .gy-xxl-1 {
        --bs-gutter-y: var(--ea-sp-2);
    }
    .g-xxl-2,
    .gx-xxl-2 {
        --bs-gutter-x: var(--ea-sp-4);
    }
    .g-xxl-2,
    .gy-xxl-2 {
        --bs-gutter-y: var(--ea-sp-4);
    }
    .g-xxl-3,
    .gx-xxl-3 {
        --bs-gutter-x: var(--ea-sp-8);
    }
    .g-xxl-3,
    .gy-xxl-3 {
        --bs-gutter-y: var(--ea-sp-8);
    }
    .g-xxl-4,
    .gx-xxl-4 {
        --bs-gutter-x: var(--ea-sp-12);
    }
    .g-xxl-4,
    .gy-xxl-4 {
        --bs-gutter-y: var(--ea-sp-12);
    }
    .g-xxl-5,
    .gx-xxl-5 {
        --bs-gutter-x: var(--ea-sp-24);
    }
    .g-xxl-5,
    .gy-xxl-5 {
        --bs-gutter-y: var(--ea-sp-24);
    }
}