/* AlimakGroup.Blazor.Core's scoped CSS: only the sections of its bundle (AlimakGroup.Blazor.Core.bundle.scp.css) for the
   components that the Dashboard's pages render, copied unchanged. The whole bundle holds every component's CSS, far
   beyond the Dashboard's page budget (README: Package CSS). Do not edit this file: PackageCssTests fails when a section
   differs from the referenced package or a page renders a component whose section is missing, and writes the file to
   copy here. */
/* _content/AlimakGroup.Blazor.Core/Components/Button/AlimakGroupButton.razor.rz.scp.css */
/* AlimakGroupButton: the apps' button, ported from the mock-up "button dark&light.html". Dark values below follow
   <html data-theme="dark">. The focus ring takes each variant's colour (--_ring), the same in both themes. The app's
   icon has the app's scope attribute, not the button's, hence ::deep for its svg. */

.alimakgroup-button[b-lt9vgoq1kc] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 2.25rem;
    padding: .5rem 1rem;
    border: 1px solid transparent;
    border-radius: 10px;
    font-family: inherit;
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    text-decoration: none;
    transition: background .2s ease, box-shadow .2s ease, transform .2s ease, filter .2s ease;
}

.alimakgroup-button:not(:disabled):hover[b-lt9vgoq1kc] {
    transform: translateY(-1px);
}

.alimakgroup-button:not(:disabled):active[b-lt9vgoq1kc] {
    transform: translateY(0);
}

.alimakgroup-button:focus-visible[b-lt9vgoq1kc] {
    outline: 2px solid var(--_ring);
    outline-offset: 2px;
}

.alimakgroup-button--primary[b-lt9vgoq1kc] {
    --_ring: #1976d2;
}

.alimakgroup-button--save[b-lt9vgoq1kc] {
    --_ring: #2e9e4f;
}

.alimakgroup-button--accent[b-lt9vgoq1kc] {
    --_ring: #8B7FD8;
}

.alimakgroup-button--danger[b-lt9vgoq1kc] {
    --_ring: #C62828;
}

.alimakgroup-button--secondary[b-lt9vgoq1kc],
.alimakgroup-button--ghost[b-lt9vgoq1kc] {
    --_ring: #9dbbe6;
}

.alimakgroup-button:disabled[b-lt9vgoq1kc] {
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.alimakgroup-button--sm[b-lt9vgoq1kc] {
    min-height: 1.85rem;
    padding: .3rem .7rem;
    font-size: .72rem;
    border-radius: 8px;
}

.alimakgroup-button--icon[b-lt9vgoq1kc] {
    padding: 0;
    width: 2.25rem;
}

.alimakgroup-button--icon.alimakgroup-button--sm[b-lt9vgoq1kc] {
    width: 1.85rem;
}

/* The icon's wrapper takes no room of its own: the svg sits in the button's flex row as in the mock-up. Its font size
   makes font icons (<i class="bi …">) 14px, as the svgs. */
.alimakgroup-button__icon[b-lt9vgoq1kc] {
    display: inline-flex;
    flex: none;
    font-size: 14px;
    line-height: 1;
}

.alimakgroup-button__icon[b-lt9vgoq1kc]  svg {
    width: 14px;
    height: 14px;
    flex: none;
}

.alimakgroup-button__spinner[b-lt9vgoq1kc] {
    box-sizing: border-box;
    width: 13px;
    height: 13px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: alimakgroup-button-spin-b-lt9vgoq1kc .8s linear infinite;
}

@keyframes alimakgroup-button-spin-b-lt9vgoq1kc {
    to {
        transform: rotate(360deg);
    }
}

/* Primary */
.alimakgroup-button--primary[b-lt9vgoq1kc] {
    color: #fff;
    background: linear-gradient(135deg, #1976d2, #00368A);
    box-shadow: 0 2px 8px rgba(0, 54, 138, .3);
}

.alimakgroup-button--primary:not(:disabled):hover[b-lt9vgoq1kc] {
    background: linear-gradient(135deg, #0036D0, #002B8A);
    box-shadow: 0 4px 12px rgba(0, 54, 138, .4);
}

/* Save */
.alimakgroup-button--save[b-lt9vgoq1kc] {
    color: #fff;
    background: linear-gradient(135deg, #2e9e4f, #1a7a3c);
    box-shadow: 0 2px 8px rgba(30, 130, 70, .3);
}

.alimakgroup-button--save:not(:disabled):hover[b-lt9vgoq1kc] {
    background: linear-gradient(135deg, #268a43, #156830);
    box-shadow: 0 4px 12px rgba(30, 130, 70, .45);
}

/* Accent */
.alimakgroup-button--accent[b-lt9vgoq1kc] {
    color: #fff;
    background: linear-gradient(135deg, #8B7FD8, #6B5FC7);
    box-shadow: 0 3px 12px rgba(107, 95, 199, .4);
}

.alimakgroup-button--accent:not(:disabled):hover[b-lt9vgoq1kc] {
    background: linear-gradient(135deg, #7A6FC7, #5A4FB6);
    box-shadow: 0 6px 18px rgba(107, 95, 199, .5);
}

/* Danger */
.alimakgroup-button--danger[b-lt9vgoq1kc] {
    color: #fff;
    background: linear-gradient(135deg, #C62828, #8A0000);
    box-shadow: 0 2px 8px rgba(138, 0, 0, .3);
}

.alimakgroup-button--danger:not(:disabled):hover[b-lt9vgoq1kc] {
    background: linear-gradient(135deg, #D00000, #8A0000);
}

/* Secondary */
.alimakgroup-button--secondary[b-lt9vgoq1kc] {
    color: #00368A;
    background: #fff;
    border-color: #9dbbe6;
}

.alimakgroup-button--secondary:not(:disabled):hover[b-lt9vgoq1kc] {
    background: #e8f0fb;
    border-color: #00368A;
}

/* Ghost */
.alimakgroup-button--ghost[b-lt9vgoq1kc] {
    color: #00368A;
    background: transparent;
}

.alimakgroup-button--ghost:not(:disabled):hover[b-lt9vgoq1kc] {
    background: #e8f0fb;
}

/* Disabled */
.alimakgroup-button--primary:disabled[b-lt9vgoq1kc],
.alimakgroup-button--save:disabled[b-lt9vgoq1kc],
.alimakgroup-button--accent:disabled[b-lt9vgoq1kc],
.alimakgroup-button--danger:disabled[b-lt9vgoq1kc] {
    background: #d3dbe5;
    color: #5d7086;
}

.alimakgroup-button--secondary:disabled[b-lt9vgoq1kc] {
    background: #f5f7fa;
    border-color: #dfe5ee;
    color: #9aa8ba;
}

.alimakgroup-button--ghost:disabled[b-lt9vgoq1kc] {
    color: #9aa8ba;
    background: transparent;
}

/* Dark theme */
:root:where([data-theme="dark"]) .alimakgroup-button--primary[b-lt9vgoq1kc] {
    background: linear-gradient(135deg, #2f80e0, #1557c0);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .45);
}

:root:where([data-theme="dark"]) .alimakgroup-button--primary:not(:disabled):hover[b-lt9vgoq1kc] {
    background: linear-gradient(135deg, #4a93ec, #1f66d6);
}

:root:where([data-theme="dark"]) .alimakgroup-button--save[b-lt9vgoq1kc],
:root:where([data-theme="dark"]) .alimakgroup-button--danger[b-lt9vgoq1kc] {
    box-shadow: 0 2px 10px rgba(0, 0, 0, .45);
}

:root:where([data-theme="dark"]) .alimakgroup-button--accent[b-lt9vgoq1kc] {
    box-shadow: 0 2px 10px rgba(0, 0, 0, .45);
}

:root:where([data-theme="dark"]) .alimakgroup-button--secondary[b-lt9vgoq1kc] {
    background: #29466a;
    border-color: #526b89;
    color: #f1f5fc;
}

:root:where([data-theme="dark"]) .alimakgroup-button--secondary:not(:disabled):hover[b-lt9vgoq1kc] {
    background: #345783;
    border-color: #82b7ff;
    color: #fff;
}

:root:where([data-theme="dark"]) .alimakgroup-button--ghost[b-lt9vgoq1kc] {
    color: #94c4ff;
}

:root:where([data-theme="dark"]) .alimakgroup-button--ghost:not(:disabled):hover[b-lt9vgoq1kc] {
    background: #202f48;
}

:root:where([data-theme="dark"]) .alimakgroup-button--primary:disabled[b-lt9vgoq1kc],
:root:where([data-theme="dark"]) .alimakgroup-button--save:disabled[b-lt9vgoq1kc],
:root:where([data-theme="dark"]) .alimakgroup-button--accent:disabled[b-lt9vgoq1kc],
:root:where([data-theme="dark"]) .alimakgroup-button--danger:disabled[b-lt9vgoq1kc] {
    background: #354761;
    color: #9aa8ba;
}

:root:where([data-theme="dark"]) .alimakgroup-button--secondary:disabled[b-lt9vgoq1kc] {
    background: #1a2638;
    border-color: #2c3c55;
    color: #6d7d94;
}

:root:where([data-theme="dark"]) .alimakgroup-button--ghost:disabled[b-lt9vgoq1kc] {
    color: #6d7d94;
}

/* Reduced motion: no lift on hover, no transitions, a slower spinner. */
@media (prefers-reduced-motion: reduce) {
    .alimakgroup-button[b-lt9vgoq1kc] {
        transition: none;
    }

    .alimakgroup-button:not(:disabled):hover[b-lt9vgoq1kc] {
        transform: none;
    }

    .alimakgroup-button__spinner[b-lt9vgoq1kc] {
        animation-duration: 1.6s;
    }
}
/* _content/AlimakGroup.Blazor.Core/Components/CompanySelector/AlimakGroupCompanySelector.razor.rz.scp.css */
/* The company picker of AGCSS.Dashboard (its app.css), self-contained so it looks the same with or without
   Bootstrap. Sizes are in em, so a font-size on the component scales all of it.
   The tree is built in the browser, hence ::deep for its elements. */

/* The hover colour is shared with the data grid: the selector's orange in light mode, the grid's dark hover in dark
   mode. Apps change it on .company-picker (dark: :root[data-theme="dark"] .company-picker); :where() keeps these rules
   below those selectors. */
:where(.company-picker)[b-2qpdyfoxyj] {
    --company-picker-hover: rgba(246, 129, 33, 0.12);
}

:where(:root[data-theme="dark"]) .company-picker[b-2qpdyfoxyj] {
    --company-picker-hover: #29466a;
}

.company-picker[b-2qpdyfoxyj] {
    position: relative;
    width: 100%;
    margin-top: 0.25em;
    line-height: 1.5;
}

.company-picker[b-2qpdyfoxyj]  * {
    box-sizing: border-box;
}

.company-picker__summary[b-2qpdyfoxyj] {
    display: list-item;
    cursor: pointer;
    background: rgb(255, 250, 250, 0.5);
    border-radius: 8px;
    padding: 0.5em 0.75em;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.company-picker__summary:focus-visible[b-2qpdyfoxyj],
.company-picker__filter:focus-visible[b-2qpdyfoxyj],
.company-picker[b-2qpdyfoxyj]  .company-picker__toggle:focus-visible,
.company-picker[b-2qpdyfoxyj]  .company-picker__option:focus-visible {
    outline: 3px solid #f68121;
    outline-offset: 2px;
}

.company-picker__panel[b-2qpdyfoxyj] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 10;
    background: rgb(255, 250, 250);
    color: #2f2f2f;
    border-radius: 8px;
    padding: 0.75em;
    margin-top: 0.25em;
    box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.15);
}

.company-picker--up .company-picker__panel[b-2qpdyfoxyj] {
    top: auto;
    bottom: 100%;
    margin: 0 0 0.25em;
    box-shadow: 0 -0.5em 1em rgba(0, 0, 0, 0.15);
}

/* Fully set, so the label rules of an app do not leak in. */
.company-picker__label[b-2qpdyfoxyj] {
    display: block;
    margin: 0 0 0.25em;
    font-size: inherit;
    font-weight: 700;
    color: inherit;
}

.company-picker__filter[b-2qpdyfoxyj] {
    width: 100%;
    margin: 0 0 0.5em;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    padding: 0.4em 0.5em;
    font: inherit;
    -webkit-appearance: textfield;
    appearance: textfield;
}

.company-picker__list[b-2qpdyfoxyj] {
    max-height: var(--company-picker-list-height, 16em);
    overflow: auto;
}

.company-picker[b-2qpdyfoxyj]  [hidden] {
    display: none;
}

.company-picker__tree[b-2qpdyfoxyj],
.company-picker[b-2qpdyfoxyj]  .company-picker__children {
    margin: 0;
    padding: 0;
    list-style: none;
}

.company-picker[b-2qpdyfoxyj]  .company-picker__children {
    padding-left: 1.25em;
}

.company-picker[b-2qpdyfoxyj]  .company-picker__row {
    display: flex;
    align-items: center;
    gap: 0.15em;
}

.company-picker[b-2qpdyfoxyj]  .company-picker__toggle,
.company-picker[b-2qpdyfoxyj]  .company-picker__toggle-space {
    flex: none;
    width: 1.75em;
    height: 1.75em;
}

.company-picker[b-2qpdyfoxyj]  .company-picker__toggle {
    display: grid;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 6px;
    color: #676767;
    background: none;
    font: inherit;
    cursor: pointer;
}

.company-picker[b-2qpdyfoxyj]  .company-picker__toggle::before {
    content: "";
    width: 0.45em;
    height: 0.45em;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    transition: transform 150ms;
}

.company-picker[b-2qpdyfoxyj]  .company-picker__toggle[aria-expanded="true"]::before {
    transform: rotate(45deg);
}

.company-picker[b-2qpdyfoxyj]  .company-picker__option {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0;
    border: 0;
    background: transparent;
    color: #2f2f2f;
    font: inherit;
    text-align: left;
    border-radius: 6px;
    padding: 0.35em 0.5em;
    cursor: pointer;
}

.company-picker[b-2qpdyfoxyj]  .company-picker__toggle:hover,
.company-picker[b-2qpdyfoxyj]  .company-picker__option:hover {
    background: var(--company-picker-hover);
}

.company-picker[b-2qpdyfoxyj]  .company-picker__option[aria-current="true"] {
    font-weight: 700;
}

.company-picker[b-2qpdyfoxyj]  .company-picker__current {
    flex: none;
    padding: 0 0.643em; /* 0.45em of the row at this font size */
    border-radius: 999px;
    font-size: 0.7em;
    color: white;
    background: #f68121;
}

.company-picker__empty[b-2qpdyfoxyj] {
    margin: 0;
    padding: 0.35em 0.5em;
    color: #676767;
}
/* _content/AlimakGroup.Blazor.Core/Components/DropDownList/AlimakGroupDropDownList.razor.rz.scp.css */
/* AlimakGroupDropDownList: the apps' drop-down list, ported from the approved mock-ups
   ("dropdowns light.html"/"dropdowns dark.html" for the closed field's box, docs/superpowers/specs/2026-10-26-dropdownlist-
   component-mockup.html for the open list). Colours are custom properties: light values here, dark values below for
   <html data-theme="dark">; apps change colours only through them. The popup is a popover="manual" element: the UA's
   popover defaults (margin/inset/padding) are reset, and position: fixed is what the JS module (Task 4) assumes when it
   sets the popup's top/left/width inline — this stylesheet never sets those. The active row (.alimakgroup-dropdownlist__
   option--active) is toggled by that module. The field reserves no padding of its own on the right: the control's
   8px gap plus the chevron's own 12px width and 12px margin-right already give the mock-up's 32px gutter, so the field
   only adds it once. A read-only field renders no chevron, so the field (and the hint after it, if any) carries its
   own 10px right padding instead, as the mock-up's read-only box does. */

:where(.alimakgroup-dropdownlist)[b-fm62xwsy0q] {
    --alimakgroup-dropdownlist-label: #6c757d;
    --alimakgroup-dropdownlist-text: #212529;
    --alimakgroup-dropdownlist-placeholder: #6c757d;
    --alimakgroup-dropdownlist-muted: #6c757d;
    --alimakgroup-dropdownlist-icon: #212529;
    --alimakgroup-dropdownlist-surface: #fff;
    --alimakgroup-dropdownlist-border: #ced4da;
    --alimakgroup-dropdownlist-accent: #00368A;
    --alimakgroup-dropdownlist-ring: #00368A26;
    --alimakgroup-dropdownlist-readonly-surface: #f8f9fa;
    --alimakgroup-dropdownlist-readonly-border: #ced4da;
    --alimakgroup-dropdownlist-readonly-text: #212529;
    --alimakgroup-dropdownlist-disabled-surface: #e9ecef;
    --alimakgroup-dropdownlist-disabled-border: #dee2e6;
    --alimakgroup-dropdownlist-disabled-text: #6c757d;
    --alimakgroup-dropdownlist-error: #dc3545;
    --alimakgroup-dropdownlist-error-ring: #dc354526;
    --alimakgroup-dropdownlist-error-text: #b02a37;
    --alimakgroup-dropdownlist-success: #198754;
    --alimakgroup-dropdownlist-success-ring: #19875426;
    --alimakgroup-dropdownlist-warning: #c98a00;
    --alimakgroup-dropdownlist-warning-ring: #c98a0026;
    --alimakgroup-dropdownlist-warning-text: #8a5a00;
    --alimakgroup-dropdownlist-popup: #fff;
    --alimakgroup-dropdownlist-popup-border: #ced4da;
    --alimakgroup-dropdownlist-shadow: 0 8px 24px rgba(16, 24, 39, .14), 0 2px 6px rgba(16, 24, 39, .06);
    --alimakgroup-dropdownlist-hover: #f1f4f8;
    --alimakgroup-dropdownlist-selected: #e8f0fb;
    --alimakgroup-dropdownlist-selected-text: #00368A;
    --alimakgroup-dropdownlist-divider: #e9edf3;
}

.alimakgroup-dropdownlist[b-fm62xwsy0q] {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

:where(:root[data-theme="dark"]) .alimakgroup-dropdownlist[b-fm62xwsy0q] {
    --alimakgroup-dropdownlist-label: #b6c5da;
    --alimakgroup-dropdownlist-text: #f1f5fc;
    --alimakgroup-dropdownlist-placeholder: #8fa3bd;
    --alimakgroup-dropdownlist-muted: #8fa3bd;
    --alimakgroup-dropdownlist-icon: #b6c5da;
    --alimakgroup-dropdownlist-surface: #172238;
    --alimakgroup-dropdownlist-border: #526b89;
    --alimakgroup-dropdownlist-accent: #82b7ff;
    --alimakgroup-dropdownlist-ring: #82b7ff40;
    --alimakgroup-dropdownlist-readonly-surface: #141f32;
    --alimakgroup-dropdownlist-readonly-border: #354761;
    --alimakgroup-dropdownlist-readonly-text: #b6c5da;
    --alimakgroup-dropdownlist-disabled-surface: #1f2a3d;
    --alimakgroup-dropdownlist-disabled-border: #2c3c55;
    --alimakgroup-dropdownlist-disabled-text: #7d8ea6;
    --alimakgroup-dropdownlist-error: #f27a85;
    --alimakgroup-dropdownlist-error-ring: #f27a8540;
    --alimakgroup-dropdownlist-error-text: #ff9aa4;
    --alimakgroup-dropdownlist-success: #4cc38a;
    --alimakgroup-dropdownlist-success-ring: #4cc38a40;
    --alimakgroup-dropdownlist-warning: #f5c451;
    --alimakgroup-dropdownlist-warning-ring: #f5c45140;
    --alimakgroup-dropdownlist-warning-text: #f5c451;
    --alimakgroup-dropdownlist-popup: #172238;
    --alimakgroup-dropdownlist-popup-border: #526b89;
    --alimakgroup-dropdownlist-shadow: 0 10px 28px rgba(0, 0, 0, .5);
    --alimakgroup-dropdownlist-hover: #29466a;
    --alimakgroup-dropdownlist-selected: #253d5c;
    --alimakgroup-dropdownlist-selected-text: #b8d8ff;
    --alimakgroup-dropdownlist-divider: #2c3c55;
}

.alimakgroup-dropdownlist__label[b-fm62xwsy0q] {
    box-sizing: border-box;
    margin: 10px 0 4px;
    color: var(--alimakgroup-dropdownlist-label);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.alimakgroup-dropdownlist__control[b-fm62xwsy0q] {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 2.25rem;
    border: 1px solid var(--alimakgroup-dropdownlist-border);
    border-radius: 8px;
    background: var(--alimakgroup-dropdownlist-surface);
}

.alimakgroup-dropdownlist__control:focus-within[b-fm62xwsy0q],
[data-alimakgroup-dropdownlist-open] .alimakgroup-dropdownlist__control[b-fm62xwsy0q] {
    border-color: var(--alimakgroup-dropdownlist-accent);
    box-shadow: 0 0 0 3px var(--alimakgroup-dropdownlist-ring);
}

.alimakgroup-dropdownlist__field[b-fm62xwsy0q] {
    box-sizing: border-box;
    flex: 1 1 auto;
    min-width: 0;
    padding: 7px 0 7px 10px;
    color: var(--alimakgroup-dropdownlist-text);
    font-size: 12.5px;
    font-family: inherit;
    cursor: pointer;
    outline: none;
    /* The control centres its children (align-items: center), so a field with no content (no value, no placeholder)
       would otherwise shrink to its text line's height, leaving most of the 2.25rem control unclickable and
       unfocusable. align-self: stretch fills the control's full height; display: flex + align-items: center then
       centres the (possibly empty) value span inside that taller box. */
    align-self: stretch;
    display: flex;
    align-items: center;
}

.alimakgroup-dropdownlist__value[b-fm62xwsy0q] {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    /* Keeps a line box (and so a visible height) even with no text content, e.g. an empty value with no Placeholder. */
    min-height: 1.4em;
    line-height: 1.4;
}

.alimakgroup-dropdownlist__value--placeholder[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-placeholder);
}

/* Clear button, hint and status icon, flex siblings of the field */
.alimakgroup-dropdownlist__clear[b-fm62xwsy0q] {
    box-sizing: border-box;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--alimakgroup-dropdownlist-muted);
    cursor: pointer;
}

.alimakgroup-dropdownlist__clear[hidden][b-fm62xwsy0q] {
    display: none;
}

.alimakgroup-dropdownlist__clear:hover[b-fm62xwsy0q] {
    background: var(--alimakgroup-dropdownlist-hover);
    color: var(--alimakgroup-dropdownlist-text);
}

.alimakgroup-dropdownlist__clear:focus-visible[b-fm62xwsy0q] {
    outline: 2px solid var(--alimakgroup-dropdownlist-accent);
    outline-offset: 1px;
}

.alimakgroup-dropdownlist__hint[b-fm62xwsy0q] {
    box-sizing: border-box;
    flex: 0 0 auto;
    color: var(--alimakgroup-dropdownlist-muted);
    font-size: 10.5px;
}

.alimakgroup-dropdownlist__status[b-fm62xwsy0q] {
    flex: 0 0 auto;
    display: inline-flex;
}

/* The chevron: a normal flex item, sized and placed so it sits 12px from the control's right edge; it turns 180°
   while the list is open, and does not react to pointer events (clicks reach the field beneath it). */
.alimakgroup-dropdownlist__chevron[b-fm62xwsy0q] {
    box-sizing: border-box;
    flex: 0 0 auto;
    width: 12px;
    height: 12px;
    margin-right: 12px;
    color: var(--alimakgroup-dropdownlist-icon);
    transition: transform .15s;
    pointer-events: none;
}

[data-alimakgroup-dropdownlist-open] .alimakgroup-dropdownlist__chevron[b-fm62xwsy0q] {
    transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
    .alimakgroup-dropdownlist__chevron[b-fm62xwsy0q] {
        transition: none;
    }
}

/* Read-only */
.alimakgroup-dropdownlist__control--readonly[b-fm62xwsy0q] {
    background: var(--alimakgroup-dropdownlist-readonly-surface);
    border-color: var(--alimakgroup-dropdownlist-readonly-border);
}

.alimakgroup-dropdownlist__control--readonly .alimakgroup-dropdownlist__field[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-readonly-text);
    cursor: default;
    /* No chevron renders in a read-only field (the component only emits it when !ReadOnly): whatever is last — the
       field itself, or the hint after it — needs its own 10px right padding before the border, as the mock-up's
       read-only box (dropdowns light.html: .ui-field__box .ui-field__select / .ui-field__hint). */
    padding-right: 10px;
}

.alimakgroup-dropdownlist__control--readonly .alimakgroup-dropdownlist__hint[b-fm62xwsy0q] {
    padding-right: 10px;
}

/* Disabled */
.alimakgroup-dropdownlist__control--disabled[b-fm62xwsy0q] {
    background: var(--alimakgroup-dropdownlist-disabled-surface);
    border-color: var(--alimakgroup-dropdownlist-disabled-border);
    cursor: not-allowed;
}

.alimakgroup-dropdownlist__control--disabled .alimakgroup-dropdownlist__field[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-disabled-text);
    cursor: not-allowed;
}

.alimakgroup-dropdownlist__control--disabled .alimakgroup-dropdownlist__chevron[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-disabled-text);
}

/* Status (reuses the text box's three states) */
.alimakgroup-dropdownlist__control--error[b-fm62xwsy0q] {
    border-color: var(--alimakgroup-dropdownlist-error);
}

.alimakgroup-dropdownlist__control--error:focus-within[b-fm62xwsy0q],
[data-alimakgroup-dropdownlist-open] .alimakgroup-dropdownlist__control--error[b-fm62xwsy0q] {
    border-color: var(--alimakgroup-dropdownlist-error);
    box-shadow: 0 0 0 3px var(--alimakgroup-dropdownlist-error-ring);
}

.alimakgroup-dropdownlist__control--error .alimakgroup-dropdownlist__status[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-error);
}

.alimakgroup-dropdownlist__control--success[b-fm62xwsy0q] {
    border-color: var(--alimakgroup-dropdownlist-success);
}

.alimakgroup-dropdownlist__control--success:focus-within[b-fm62xwsy0q],
[data-alimakgroup-dropdownlist-open] .alimakgroup-dropdownlist__control--success[b-fm62xwsy0q] {
    border-color: var(--alimakgroup-dropdownlist-success);
    box-shadow: 0 0 0 3px var(--alimakgroup-dropdownlist-success-ring);
}

.alimakgroup-dropdownlist__control--success .alimakgroup-dropdownlist__status[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-success);
}

.alimakgroup-dropdownlist__control--warning[b-fm62xwsy0q] {
    border-color: var(--alimakgroup-dropdownlist-warning);
}

.alimakgroup-dropdownlist__control--warning:focus-within[b-fm62xwsy0q],
[data-alimakgroup-dropdownlist-open] .alimakgroup-dropdownlist__control--warning[b-fm62xwsy0q] {
    border-color: var(--alimakgroup-dropdownlist-warning);
    box-shadow: 0 0 0 3px var(--alimakgroup-dropdownlist-warning-ring);
}

.alimakgroup-dropdownlist__control--warning .alimakgroup-dropdownlist__status[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-warning);
}

.alimakgroup-dropdownlist__message[b-fm62xwsy0q] {
    margin-top: 4px;
    font-size: 11px;
}

.alimakgroup-dropdownlist__message--error[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-error-text);
}

.alimakgroup-dropdownlist__message--warning[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-warning-text);
}

/* The popup: a manual popover, positioned by the JS module (position: fixed; top/left/width set inline there). A
   popover renders in the top layer but stays in the same place in the DOM, so it would otherwise inherit whatever
   font-size its ancestors (outside the field) have, not the field's 12.5px: set it explicitly so every row, group
   heading, "No matches" and the search input (font: inherit) match the field. */
.alimakgroup-dropdownlist__popup[b-fm62xwsy0q] {
    margin: 0;
    inset: auto;
    padding: 0;
    position: fixed;
    box-sizing: border-box;
    display: none;
    flex-direction: column;
    border: 1px solid var(--alimakgroup-dropdownlist-popup-border);
    border-radius: 8px;
    background: var(--alimakgroup-dropdownlist-popup);
    box-shadow: var(--alimakgroup-dropdownlist-shadow);
    font-size: 12.5px;
    overflow: hidden;
}

/* The author's display would beat the popover's own closed state, so the popup is shown only while the browser has it open
   (the module's non-popover fallback sets display inline). */
.alimakgroup-dropdownlist__popup:popover-open[b-fm62xwsy0q] {
    display: flex;
}

.alimakgroup-dropdownlist__search[b-fm62xwsy0q] {
    box-sizing: border-box;
    position: relative;
    padding: 6px;
    border-bottom: 1px solid var(--alimakgroup-dropdownlist-divider);
}

.alimakgroup-dropdownlist__search-input[b-fm62xwsy0q] {
    box-sizing: border-box;
    width: 100%;
    min-height: 2rem;
    padding: 6px 10px;
    padding-left: 30px;
    border: 1px solid var(--alimakgroup-dropdownlist-border);
    border-radius: 6px;
    background: var(--alimakgroup-dropdownlist-surface);
    color: var(--alimakgroup-dropdownlist-text);
    font: inherit;
    outline: none;
}

.alimakgroup-dropdownlist__search-input:focus[b-fm62xwsy0q] {
    border-color: var(--alimakgroup-dropdownlist-accent);
    box-shadow: 0 0 0 3px var(--alimakgroup-dropdownlist-ring);
}

.alimakgroup-dropdownlist__search-input[b-fm62xwsy0q]::placeholder {
    color: var(--alimakgroup-dropdownlist-placeholder);
}

.alimakgroup-dropdownlist__search svg[b-fm62xwsy0q] {
    position: absolute;
    left: 16px;
    top: 50%;
    width: 12px;
    height: 12px;
    transform: translateY(-50%);
    color: var(--alimakgroup-dropdownlist-muted);
}

.alimakgroup-dropdownlist__list[b-fm62xwsy0q] {
    box-sizing: border-box;
    margin: 0;
    padding: 4px;
    max-height: 230px;
    overflow-y: auto;
    list-style: none;
}

/* A group's rows sit in their own <ul role="none"> (AlimakGroupDropDownList.razor), which otherwise keeps the user
   agent's default list margin/padding (~40px) and bullets, indenting every grouped row. */
.alimakgroup-dropdownlist__list ul[b-fm62xwsy0q] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.alimakgroup-dropdownlist__option[b-fm62xwsy0q] {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 6px;
    color: var(--alimakgroup-dropdownlist-text);
    cursor: pointer;
}

.alimakgroup-dropdownlist__option[hidden][b-fm62xwsy0q] {
    display: none;
}

.alimakgroup-dropdownlist__option--active[b-fm62xwsy0q] {
    background: var(--alimakgroup-dropdownlist-hover);
}

.alimakgroup-dropdownlist__option--selected[b-fm62xwsy0q] {
    background: var(--alimakgroup-dropdownlist-selected);
    color: var(--alimakgroup-dropdownlist-selected-text);
    font-weight: 600;
}

.alimakgroup-dropdownlist__option-text[b-fm62xwsy0q] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.alimakgroup-dropdownlist__check[b-fm62xwsy0q] {
    flex: 0 0 auto;
    width: 12px;
    height: 12px;
}

/* A static field renders the check in every row; the browser moves the selected class. */
.alimakgroup-dropdownlist__option:not(.alimakgroup-dropdownlist__option--selected) > .alimakgroup-dropdownlist__check[b-fm62xwsy0q] {
    display: none;
}

.alimakgroup-dropdownlist__option--disabled[b-fm62xwsy0q] {
    color: var(--alimakgroup-dropdownlist-muted);
    cursor: not-allowed;
}

.alimakgroup-dropdownlist__group[b-fm62xwsy0q] {
    box-sizing: border-box;
    padding: 8px 10px 4px;
    color: var(--alimakgroup-dropdownlist-label);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
}

/* A divider above every group but the first (groups render as consecutive <li role="group"> siblings). */
.alimakgroup-dropdownlist__list li[role="group"] + li[role="group"] > .alimakgroup-dropdownlist__group[b-fm62xwsy0q] {
    margin-top: 4px;
    border-top: 1px solid var(--alimakgroup-dropdownlist-divider);
}

.alimakgroup-dropdownlist__empty[b-fm62xwsy0q] {
    padding: 12px 10px;
    color: var(--alimakgroup-dropdownlist-muted);
    text-align: center;
}

.alimakgroup-dropdownlist__more[b-fm62xwsy0q] {
    flex: none;
    padding: 6px 10px;
    border-top: 1px solid var(--alimakgroup-dropdownlist-divider);
    color: var(--alimakgroup-dropdownlist-muted);
    font-size: 12px;
    text-align: center;
}

.alimakgroup-dropdownlist__popup[b-fm62xwsy0q]  mark {
    background: transparent;
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

@media (pointer: coarse) {
    .alimakgroup-dropdownlist__field[b-fm62xwsy0q],
    .alimakgroup-dropdownlist__popup[b-fm62xwsy0q],
    .alimakgroup-dropdownlist__search-input[b-fm62xwsy0q] {
        font-size: 16px;
    }
}
/* _content/AlimakGroup.Blazor.Core/Components/Spinner/AlimakGroupSpinner.razor.rz.scp.css */
/* AlimakGroupSpinner: the apps' loading spinner, ported value for value from the mock-up "spinner dark&light.html"
   (its .ag-spinner rules, renamed). Colours are custom properties: light values in :where() so that an app's own values,
   set on .alimakgroup-spinner in a stylesheet linked after {AppName}.styles.css, win; dark values below for
   <html data-theme="dark">. The mock-up sets box-sizing: border-box on every element, hence box-sizing here. The
   layouts set display, which beats the browser's own rule for the hidden attribute, so the [hidden] rule after them
   lets MVC pages and scripts hide the spinner. */

:where(.alimakgroup-spinner)[b-xo2deytoh1] {
    --alimakgroup-spinner-track: #dfe5ee;
    --alimakgroup-spinner-arc: #00368A;
    --alimakgroup-spinner-text: #6c757d;
    --alimakgroup-spinner-backdrop: rgba(255, 255, 255, .78);
}

.alimakgroup-spinner[b-xo2deytoh1] {
    --_size: 32px;
    --_stroke: 3px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--alimakgroup-spinner-text);
    font-size: 13px;
    line-height: 1.4;
    text-align: center;
}

.alimakgroup-spinner__ring[b-xo2deytoh1] {
    box-sizing: border-box;
    flex: none;
    width: var(--_size);
    height: var(--_size);
    border: var(--_stroke) solid var(--alimakgroup-spinner-track);
    border-top-color: var(--alimakgroup-spinner-arc);
    border-radius: 50%;
    animation: alimakgroup-spinner-spin-b-xo2deytoh1 .8s linear infinite;
}

.alimakgroup-spinner--sm[b-xo2deytoh1] {
    --_size: 16px;
    --_stroke: 2px;
    font-size: 12.5px;
    gap: 8px;
}

.alimakgroup-spinner--lg[b-xo2deytoh1] {
    --_size: 48px;
    --_stroke: 4px;
    font-size: 14px;
    gap: 12px;
}

/* Tone: Current takes the surrounding text colour (inline in links, chips, coloured bars). */
.alimakgroup-spinner--current[b-xo2deytoh1] {
    --alimakgroup-spinner-arc: currentColor;
    --alimakgroup-spinner-track: color-mix(in srgb, currentColor 22%, transparent);
    --alimakgroup-spinner-text: currentColor;
}

/* Dark theme. The Current tone repeats its tokens, or the dark ones would override it; its two classes outrank an app's
   dark values on :root[data-theme="dark"] .alimakgroup-spinner. */
:root:where([data-theme="dark"]) .alimakgroup-spinner[b-xo2deytoh1] {
    --alimakgroup-spinner-track: #354761;
    --alimakgroup-spinner-arc: #82b7ff;
    --alimakgroup-spinner-text: #b6c5da;
    --alimakgroup-spinner-backdrop: rgba(16, 24, 39, .72);
}

:root:where([data-theme="dark"]) .alimakgroup-spinner.alimakgroup-spinner--current[b-xo2deytoh1] {
    --alimakgroup-spinner-arc: currentColor;
    --alimakgroup-spinner-track: color-mix(in srgb, currentColor 22%, transparent);
    --alimakgroup-spinner-text: currentColor;
}

/* Layouts */
.alimakgroup-spinner--inline[b-xo2deytoh1] {
    display: inline-flex;
    flex-direction: row;
    justify-content: flex-start;
    text-align: start;
    vertical-align: middle;
}

.alimakgroup-spinner--block[b-xo2deytoh1] {
    width: 100%;
    min-height: 8rem;
    padding: 16px;
}

/* z-index 5: below the header (10) and the sidebar (9). It blocks clicks also while the delay waits. */
.alimakgroup-spinner--overlay[b-xo2deytoh1] {
    position: absolute;
    inset: 0;
    z-index: 5;
    background: var(--alimakgroup-spinner-backdrop);
    border-radius: inherit;
    cursor: progress;
}

.alimakgroup-spinner[hidden][b-xo2deytoh1] {
    display: none;
}

/* Delay: hidden for the first 300ms, then fades in. CSS only, so static SSR gets it too. */
.alimakgroup-spinner--delayed[b-xo2deytoh1] {
    animation: alimakgroup-spinner-show-b-xo2deytoh1 .15s ease-out 300ms both;
}

.alimakgroup-spinner__label[b-xo2deytoh1] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

@keyframes alimakgroup-spinner-spin-b-xo2deytoh1 {
    to {
        transform: rotate(360deg);
    }
}

@keyframes alimakgroup-spinner-show-b-xo2deytoh1 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Reduced motion: a slower ring, no fade; the 300ms wait stays. */
@media (prefers-reduced-motion: reduce) {
    .alimakgroup-spinner__ring[b-xo2deytoh1] {
        animation-duration: 1.6s;
    }

    .alimakgroup-spinner--delayed[b-xo2deytoh1] {
        animation-duration: 0s;
    }
}
/* _content/AlimakGroup.Blazor.Core/Components/TextBox/AlimakGroupTextBox.razor.rz.scp.css */
/* AlimakGroupTextBox: the apps' text box, ported from the approved mockup
   (docs/superpowers/specs/2026-10-22-textbox-component-mockup.html, its rules for the field, renamed). Colours are custom properties:
   light values here, dark values below for <html data-theme="dark">; apps change colours only through them. The mockup
   sets box-sizing: border-box on every element, hence box-sizing on the parts here. On touch screens the field's text
   is 16px, so iPhone Safari does not zoom in when the field is tapped. Apps set the colours on .alimakgroup-textbox in a
   later stylesheet: :where() keeps these below. */

:where(.alimakgroup-textbox)[b-5zlgrcwuio] {
    --alimakgroup-textbox-label: #6c757d;
    --alimakgroup-textbox-text: #212529;
    --alimakgroup-textbox-placeholder: #6c757d;
    --alimakgroup-textbox-hint: #6c757d;
    --alimakgroup-textbox-icon: #6c757d;
    --alimakgroup-textbox-surface: #fff;
    --alimakgroup-textbox-border: #ced4da;
    --alimakgroup-textbox-accent: #00368A;
    --alimakgroup-textbox-ring: #00368A26;
    --alimakgroup-textbox-hover: #f1f4f8;
    --alimakgroup-textbox-readonly-surface: #f8f9fa;
    --alimakgroup-textbox-readonly-border: #ced4da;
    --alimakgroup-textbox-readonly-text: #212529;
    --alimakgroup-textbox-disabled-surface: #e9ecef;
    --alimakgroup-textbox-disabled-border: #dee2e6;
    --alimakgroup-textbox-disabled-text: #6c757d;
    --alimakgroup-textbox-error: #dc3545;
    --alimakgroup-textbox-error-ring: #dc354526;
    --alimakgroup-textbox-error-text: #b02a37;
    --alimakgroup-textbox-success: #198754;
    --alimakgroup-textbox-success-ring: #19875426;
    --alimakgroup-textbox-warning: #c98a00;
    --alimakgroup-textbox-warning-ring: #c98a0026;
    --alimakgroup-textbox-warning-text: #8a5a00;
}

.alimakgroup-textbox[b-5zlgrcwuio] {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

:where(:root[data-theme="dark"]) .alimakgroup-textbox[b-5zlgrcwuio] {
    --alimakgroup-textbox-label: #b6c5da;
    --alimakgroup-textbox-text: #f1f5fc;
    --alimakgroup-textbox-placeholder: #8fa3bd;
    --alimakgroup-textbox-hint: #8fa3bd;
    --alimakgroup-textbox-icon: #8fa3bd;
    --alimakgroup-textbox-surface: #172238;
    --alimakgroup-textbox-border: #526b89;
    --alimakgroup-textbox-accent: #82b7ff;
    --alimakgroup-textbox-ring: #82b7ff40;
    --alimakgroup-textbox-hover: #29466a;
    --alimakgroup-textbox-readonly-surface: #141f32;
    --alimakgroup-textbox-readonly-border: #354761;
    --alimakgroup-textbox-readonly-text: #b6c5da;
    --alimakgroup-textbox-disabled-surface: #1f2a3d;
    --alimakgroup-textbox-disabled-border: #2c3c55;
    --alimakgroup-textbox-disabled-text: #7d8ea6;
    --alimakgroup-textbox-error: #f27a85;
    --alimakgroup-textbox-error-ring: #f27a8540;
    --alimakgroup-textbox-error-text: #ff9aa4;
    --alimakgroup-textbox-success: #4cc38a;
    --alimakgroup-textbox-success-ring: #4cc38a40;
    --alimakgroup-textbox-warning: #f5c451;
    --alimakgroup-textbox-warning-ring: #f5c45140;
    --alimakgroup-textbox-warning-text: #f5c451;
}

.alimakgroup-textbox__label[b-5zlgrcwuio] {
    box-sizing: border-box;
    margin: 10px 0 4px;
    color: var(--alimakgroup-textbox-label);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.alimakgroup-textbox__control[b-5zlgrcwuio] {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--alimakgroup-textbox-border);
    border-radius: 8px;
    background: var(--alimakgroup-textbox-surface);
}

.alimakgroup-textbox__control:focus-within[b-5zlgrcwuio] {
    border-color: var(--alimakgroup-textbox-accent);
    box-shadow: 0 0 0 3px var(--alimakgroup-textbox-ring);
}

.alimakgroup-textbox__control--readonly[b-5zlgrcwuio] {
    background: var(--alimakgroup-textbox-readonly-surface);
    border-color: var(--alimakgroup-textbox-readonly-border);
}

.alimakgroup-textbox__control--readonly .alimakgroup-textbox__input[b-5zlgrcwuio] {
    color: var(--alimakgroup-textbox-readonly-text);
}

.alimakgroup-textbox__input[b-5zlgrcwuio] {
    box-sizing: border-box;
    flex: 1 1 auto;
    min-width: 0;
    padding: 7px 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--alimakgroup-textbox-text);
    font-size: 12.5px;
    font-family: inherit;
    outline: none;
}

.alimakgroup-textbox__input[b-5zlgrcwuio]::placeholder {
    color: var(--alimakgroup-textbox-placeholder);
    opacity: 1;
}

.alimakgroup-textbox__hint[b-5zlgrcwuio] {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-right: 10px;
    color: var(--alimakgroup-textbox-hint);
    font-size: 10.5px;
    text-align: right;
}

/* Disabled */
.alimakgroup-textbox__control--disabled[b-5zlgrcwuio] {
    background: var(--alimakgroup-textbox-disabled-surface);
    border-color: var(--alimakgroup-textbox-disabled-border);
    cursor: not-allowed;
}

.alimakgroup-textbox__control--disabled .alimakgroup-textbox__input[b-5zlgrcwuio] {
    color: var(--alimakgroup-textbox-disabled-text);
    cursor: not-allowed;
}

.alimakgroup-textbox__control--disabled .alimakgroup-textbox__input[b-5zlgrcwuio]::placeholder {
    color: var(--alimakgroup-textbox-disabled-text);
}

/* Multiline */
.alimakgroup-textbox__control--multiline[b-5zlgrcwuio] {
    align-items: stretch;
}

textarea.alimakgroup-textbox__input[b-5zlgrcwuio] {
    resize: vertical;
    min-height: 60px;
    line-height: 1.45;
}

/* Icon before the text, clear button and status icon after it */
.alimakgroup-textbox__icon[b-5zlgrcwuio] {
    flex: 0 0 auto;
    display: inline-flex;
    margin-left: 10px;
    margin-right: -6px;
    color: var(--alimakgroup-textbox-icon);
}

.alimakgroup-textbox__input[b-5zlgrcwuio]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
}

.alimakgroup-textbox__clear[b-5zlgrcwuio] {
    box-sizing: border-box;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin-right: 4px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--alimakgroup-textbox-icon);
    cursor: pointer;
}

.alimakgroup-textbox__clear:hover[b-5zlgrcwuio] {
    background: var(--alimakgroup-textbox-hover);
    color: var(--alimakgroup-textbox-text);
}

.alimakgroup-textbox__clear:focus-visible[b-5zlgrcwuio] {
    outline: 2px solid var(--alimakgroup-textbox-accent);
    outline-offset: 1px;
}

/* A search box always has a placeholder (" " without one), so the button hides while the field is empty. */
.alimakgroup-textbox__input:placeholder-shown ~ .alimakgroup-textbox__clear[b-5zlgrcwuio] {
    display: none;
}

.alimakgroup-textbox__status[b-5zlgrcwuio] {
    flex: 0 0 auto;
    display: inline-flex;
    margin-right: 10px;
}

/* Status */
.alimakgroup-textbox__control--error[b-5zlgrcwuio] {
    border-color: var(--alimakgroup-textbox-error);
}

.alimakgroup-textbox__control--error:focus-within[b-5zlgrcwuio] {
    border-color: var(--alimakgroup-textbox-error);
    box-shadow: 0 0 0 3px var(--alimakgroup-textbox-error-ring);
}

.alimakgroup-textbox__control--error .alimakgroup-textbox__status[b-5zlgrcwuio] {
    color: var(--alimakgroup-textbox-error);
}

.alimakgroup-textbox__control--success[b-5zlgrcwuio] {
    border-color: var(--alimakgroup-textbox-success);
}

.alimakgroup-textbox__control--success:focus-within[b-5zlgrcwuio] {
    border-color: var(--alimakgroup-textbox-success);
    box-shadow: 0 0 0 3px var(--alimakgroup-textbox-success-ring);
}

.alimakgroup-textbox__control--success .alimakgroup-textbox__status[b-5zlgrcwuio] {
    color: var(--alimakgroup-textbox-success);
}

.alimakgroup-textbox__control--warning[b-5zlgrcwuio] {
    border-color: var(--alimakgroup-textbox-warning);
}

.alimakgroup-textbox__control--warning:focus-within[b-5zlgrcwuio] {
    border-color: var(--alimakgroup-textbox-warning);
    box-shadow: 0 0 0 3px var(--alimakgroup-textbox-warning-ring);
}

.alimakgroup-textbox__control--warning .alimakgroup-textbox__status[b-5zlgrcwuio] {
    color: var(--alimakgroup-textbox-warning);
}

.alimakgroup-textbox__message[b-5zlgrcwuio] {
    margin: 4px 0 0;
    font-size: 11px;
}

.alimakgroup-textbox__message--error[b-5zlgrcwuio] {
    color: var(--alimakgroup-textbox-error-text);
}

.alimakgroup-textbox__message--warning[b-5zlgrcwuio] {
    color: var(--alimakgroup-textbox-warning-text);
}

/* Compact, for table cells */
.alimakgroup-textbox__control--compact[b-5zlgrcwuio] {
    border-radius: 6px;
}

.alimakgroup-textbox__control--compact .alimakgroup-textbox__input[b-5zlgrcwuio] {
    padding: 3px 8px;
}

@media (pointer: coarse) {
    .alimakgroup-textbox__input[b-5zlgrcwuio] {
        font-size: 16px;
    }
}
/* _content/AlimakGroup.Blazor.Core/Components/Tooltip/AlimakGroupInfoTip.razor.rz.scp.css */
/* The info button, as the mock-up's info trigger (tooltip dark&light.html). The colours
   are custom properties; an app's values in a stylesheet linked after {AppName}.styles.css win over these :where()
   ones. While its tooltip is open the button has aria-describedby, and looks hovered. */
:where(.alimakgroup-infotip)[b-i0t25yb9lm] {
    --alimakgroup-infotip-icon: #5d7086;
    --alimakgroup-infotip-hover: #e8f0fb;
    --alimakgroup-infotip-hover-icon: #00368A;
    --alimakgroup-infotip-ring: #1976d2;
}

:root[data-theme="dark"] :where(.alimakgroup-infotip)[b-i0t25yb9lm] {
    --alimakgroup-infotip-icon: #8fa3bd;
    --alimakgroup-infotip-hover: #253d5c;
    --alimakgroup-infotip-hover-icon: #b8d8ff;
    --alimakgroup-infotip-ring: #82b7ff;
}

.alimakgroup-infotip[b-i0t25yb9lm] {
    display: inline-grid;
    place-items: center;
    flex: none;
    width: 18px;
    height: 18px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--alimakgroup-infotip-icon);
    cursor: help;
    opacity: .75;
    transition: opacity .15s ease, background .15s ease;
}

.alimakgroup-infotip:hover[b-i0t25yb9lm],
.alimakgroup-infotip[aria-describedby][b-i0t25yb9lm] {
    opacity: 1;
    background: var(--alimakgroup-infotip-hover);
    color: var(--alimakgroup-infotip-hover-icon);
}

.alimakgroup-infotip:focus-visible[b-i0t25yb9lm] {
    outline: 2px solid var(--alimakgroup-infotip-ring);
    outline-offset: 1px;
    opacity: 1;
}

.alimakgroup-infotip svg[b-i0t25yb9lm] {
    width: 14px;
    height: 14px;
}

@media (prefers-reduced-motion: reduce) {
    .alimakgroup-infotip[b-i0t25yb9lm] {
        transition: none;
    }
}
/* _content/AlimakGroup.Blazor.Core/Components/Tooltip/AlimakGroupTooltip.razor.rz.scp.css */
/* The wrapper takes the trigger's place without changing its layout. The bubble itself is styled by wwwroot/tooltip.css:
   the module appends it to <body>, where this file's scope does not reach. */
.alimakgroup-tooltip[b-ycmrqzug1d] {
    display: inline-flex;
    max-width: 100%;
}

/* A long press on a link or button shows the tooltip, not iOS's link callout. */
.alimakgroup-tooltip:has(a, button)[b-ycmrqzug1d] {
    -webkit-touch-callout: none;
}