/* Global corrections that apply to every layout, moved out of the inline <style> block in
 * App.razor. CLAUDE.md rules out inline <style> in razor files, and an inline block is
 * unreachable for a browser cache, a linter, or a search across the stylesheets.
 *
 * It stays global rather than moving into the per-layout head: #blazor-error-ui and the toast
 * container render from App.razor itself, so their rules have to reach MainLayout and
 * EmptyLayout as well.
 *
 * Three things are corrected in the move; everything else is verbatim:
 *   - the nested blocks are written out. Plain CSS nesting without a leading & is invalid in
 *     Safari below 17.2, so the toast background and every dropdown-item colour silently did
 *     nothing there.
 *   - z-index 99999999999 is written as 2147483647. Not a change of behaviour: the CSSOM of
 *     the running application already reports 2147483647, because that is int32 max and the
 *     parser clamps to it. The old number only looked like it did something.
 *   - the four dropdown colours resolve through the navigation tokens. They were already the
 *     same four values ThemeSelector hands the bar as LightColors.
 */

/* Nimbus's own tokens. They live here rather than in nimbus-tokens.css because nothing else
 * declares them: no library competes for the --nimbus- prefix, so their position in the
 * cascade does not matter and they can be loaded globally, including under MainLayout and
 * EmptyLayout where NimbusAppHead is not used. The rules further down depend on them.
 *
 * Values come from ThemeSelector.cs, which is the only place they exist today. */
:root {
    /* Brand */
    --nimbus-primary: #235695;
    --nimbus-primary-hover: #1D497E;
    --nimbus-primary-active: #1C4477;
    --nimbus-on-primary: #FFFFFF;

    /* The other seven variants, from the two identical ColorOptions blocks in
       ThemeSelector.cs. They are declared here and consumed by nimbus-tokens.css so that the
       palette has exactly one place, the way --nimbus-primary already does. Bootstrap's own
       --bs-secondary and friends are deliberately NOT overridden: the theme provider never
       wrote .text-{variant} either, so those keep Bootstrap's colours, and overriding the
       variables would recolour them as a side effect. */
    --nimbus-secondary: #7EC3EF;
    --nimbus-success: #23C02E;
    --nimbus-info: #9BD8FE;
    --nimbus-warning: #F8B86C;
    --nimbus-danger: #F95741;
    --nimbus-light: #F0F0F0;
    --nimbus-dark: #535353;

    /* Foreground for a surface painted in one of the above. The provider picks white below
       YIQ 150 and #343A40 above it; these four are the ones that land above. */
    --nimbus-on-light-surface: #343A40;

    /* Navigation, from ThemeSelector.GetCustomerPanelTheme's bar options */
    --nimbus-nav-bg: #F7F9FC;
    --nimbus-nav-color: #5889be;
    --nimbus-nav-active-bg: #E0ECFF;
    --nimbus-nav-active-color: #007BFF;
    --nimbus-nav-hover-bg: #D6E6FF;
    --nimbus-nav-hover-color: #007BFF;

    /* Shell dimensions, from the two BarOptions blocks in ThemeSelector.cs. There is
       deliberately no sidebar width token: nothing defines one today, the sider takes its
       width from its content, and a made-up number here would quietly become the value the
       shell rework builds against. BZ-33 adds it once it means something. */
    --nimbus-topbar-height-mgmt: 72px;
    --nimbus-topbar-height-cp: 64px;
    --nimbus-sidebar-flyout-width: 220px;
}

body {
    min-height: 100vh;
    /* mobile viewport bug fix */
    min-height: -webkit-fill-available;
}

html {
    height: -webkit-fill-available;
}

/* The close button sits flush with the header padding instead of adding to it. */
.modal-header .btn-close {
    margin: -.5rem 0 -.5rem auto;
}

.toast-container {
    margin-top: 40px;
    /* int32 max. Toasts have to clear the Syncfusion dialog stack, which climbs into the
       five digit range. */
    z-index: 2147483647;
}

.toast-container .toast {
    background-color: rgba(255, 255, 255, .95);
}

.dropdown-menu {
    background-color: var(--nimbus-nav-bg);
}

.dropdown-menu .dropdown-item {
    color: var(--nimbus-nav-color);
}

.dropdown-menu .dropdown-item:hover {
    background-color: var(--nimbus-nav-hover-bg);
    color: var(--nimbus-nav-hover-color);
}

/* The pressed state. Bootstrap paints the brand colour behind the entry - nimbus-tokens.css
   points --bs-dropdown-link-active-bg at it - but the rule above would leave the label in the
   navigation blue on top of it, which is unreadable. The provider wrote white here with
   !important; the extra class in the selector is enough. */
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active {
    color: var(--nimbus-on-primary);
}

.spinner-border.spinner-border-sm {
    margin-right: .5rem;
}

/* Syncfusion floating label: without the full width the text is clipped mid-word once the
   label sits above the field. */
.e-float-input label.e-float-text.e-label-top {
    width: 100% !important;
}

#sentry-feedback {
    --z-index: 100;
}