as the flex container so CSS isolation actually applies — a
* MudStack swallows the scoped [b-xxxx] attribute and silently no-ops. */
.ColourCell[b-fgjqwxs0mb] {
display: flex;
align-items: center;
gap: 12px;
}
/* Small clickable colour swatch — previews the row's BrandColourHex. */
.DistributorColourSwatch[b-fgjqwxs0mb] {
width: 28px;
height: 28px;
border-radius: 4px;
border: 1px solid var(--mud-palette-lines-default);
flex: 0 0 28px;
}
/* Wrapping
for the MudColorPicker. Scoped isolation lands on this
* div; ::deep reaches into the Mud internals to force the input/control
* elements to fill the wrapper rather than auto-sizing to content. */
.DistributorColourPicker[b-fgjqwxs0mb] {
width: 160px;
flex: 0 0 160px;
}
.DistributorColourPicker[b-fgjqwxs0mb] .mud-picker,
.DistributorColourPicker[b-fgjqwxs0mb] .mud-input-control,
.DistributorColourPicker[b-fgjqwxs0mb] .mud-input,
.DistributorColourPicker[b-fgjqwxs0mb] .mud-input-slot,
.DistributorColourPicker[b-fgjqwxs0mb] input {
width: 100%;
min-width: 0;
max-width: 100%;
box-sizing: border-box;
}
/* Inline DisplayName edit — same constrained width as the colour picker
* so the grid columns visually align. */
.DisplayNameField[b-fgjqwxs0mb] {
width: 240px;
}
/* /Pages/Catalogue/CatalogueListingListPage.razor.rz.scp.css */
.PaperWrapper[b-apdj8eh7hy] {
display: flex;
width: max-content;
}
.PaperWrapper[b-apdj8eh7hy] .Selector .mud-input-control-input-container {
min-width: 180px;
max-width: 200px;
}
/* /Pages/Catalogue/CatalogueOwnedBuyChoiceDialog.razor.rz.scp.css */
.ChoiceRow[b-7q2zcef94m] {
display: flex;
gap: 16px;
flex-wrap: wrap;
}
.ChoiceCard[b-7q2zcef94m] {
flex: 1 1 220px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 8px;
padding: 20px 16px;
border: 1px solid var(--mud-palette-lines-default);
border-radius: var(--mud-default-borderradius);
cursor: pointer;
transition: border-color .15s ease, background-color .15s ease;
}
.ChoiceCard:hover[b-7q2zcef94m],
.ChoiceCard:focus-visible[b-7q2zcef94m] {
border-color: var(--mud-palette-primary);
background-color: var(--mud-palette-primary-hover);
outline: none;
}
/* /Pages/Catalogue/CatalogueSetupWizardPage.razor.rz.scp.css */
/* Top nav row: Back left, step counter centred, Next right. The two side
regions share equal flex basis so the centre stays optically centred
regardless of button widths. */
.catalogue-setup-wizard .wiz-nav-side[b-f23v9uw040] {
flex: 1 1 0;
display: flex;
align-items: center;
}
.catalogue-setup-wizard .wiz-nav-right[b-f23v9uw040] {
justify-content: flex-end;
}
.catalogue-setup-wizard .wiz-nav-center[b-f23v9uw040] {
flex: 0 0 auto;
text-align: center;
}
.catalogue-setup-wizard .wz-step[b-f23v9uw040] {
display: flex;
align-items: center;
gap: 12px;
padding: 10px 6px;
border-radius: 6px;
}
.catalogue-setup-wizard .wz-step .wz-n[b-f23v9uw040] {
flex: 0 0 26px;
width: 26px;
height: 26px;
display: grid;
place-items: center;
border-radius: 6px;
border: 1px solid var(--mud-palette-lines-default);
font-size: 0.8rem;
color: var(--mud-palette-text-secondary);
}
.catalogue-setup-wizard .wz-step .wz-lbl[b-f23v9uw040] {
font-size: 0.9rem;
color: var(--mud-palette-text-secondary);
}
.catalogue-setup-wizard .wz-step.active[b-f23v9uw040] {
background: var(--mud-palette-action-default-hover);
}
.catalogue-setup-wizard .wz-step.active .wz-n[b-f23v9uw040] {
background: var(--mud-palette-primary);
border-color: var(--mud-palette-primary);
color: var(--mud-palette-primary-text);
font-weight: 600;
}
.catalogue-setup-wizard .wz-step.active .wz-lbl[b-f23v9uw040] {
color: var(--mud-palette-text-primary);
font-weight: 600;
}
.catalogue-setup-wizard .wz-step.done .wz-n[b-f23v9uw040] {
background: var(--mud-palette-success);
border-color: var(--mud-palette-success);
color: var(--mud-palette-success-text);
font-weight: 600;
}
/* /Pages/ContactSync/AutoContactSyncMap.razor.rz.scp.css */
[b-hvxz8ae3uu] .table-fixed {
table-layout: auto;
}
[b-hvxz8ae3uu] .table-fixed th,
[b-hvxz8ae3uu] .table-fixed td {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
[b-hvxz8ae3uu] .mud-table-container {
overflow-x: auto;
}
/* Fix for inline editable customer ID field */
[b-hvxz8ae3uu] .mud-input-text {
font-size: 0.875rem;
}
/* /Pages/ContactSync/Components/ContactSyncTrackingLegendDialog.razor.rz.scp.css */
.contactsync-tracking-legend-dialog__layout[b-sdmay035i7] {
min-width: 920px;
display: flex;
flex-direction: column;
gap: 16px;
}
.contactsync-tracking-legend-dialog__summary-grid[b-sdmay035i7] {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;
}
.contactsync-tracking-legend-dialog__section-grid[b-sdmay035i7] {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
align-items: stretch;
}
.contactsync-tracking-legend-dialog__summary-card[b-sdmay035i7],
.contactsync-tracking-legend-dialog__section-card[b-sdmay035i7] {
height: 100%;
}
.contactsync-tracking-legend-dialog__item-grid[b-sdmay035i7] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 12px;
}
.contactsync-tracking-legend-dialog__item-card[b-sdmay035i7] {
display: flex;
flex-direction: column;
gap: 10px;
}
.contactsync-tracking-legend-dialog__visual[b-sdmay035i7] {
display: grid;
justify-content: flex-start;
align-items: center;
min-width: 0;
}
.contactsync-tracking-legend-dialog__description[b-sdmay035i7] {
min-width: 0;
}
@media (max-width: 1280px) {
.contactsync-tracking-legend-dialog__summary-grid[b-sdmay035i7] {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 960px) {
.contactsync-tracking-legend-dialog__layout[b-sdmay035i7] {
min-width: 0;
}
.contactsync-tracking-legend-dialog__summary-grid[b-sdmay035i7] {
grid-template-columns: minmax(0, 1fr);
}
.contactsync-tracking-legend-dialog__section-grid[b-sdmay035i7] {
grid-template-columns: minmax(0, 1fr);
}
.contactsync-tracking-legend-dialog__item-grid[b-sdmay035i7] {
grid-template-columns: minmax(0, 1fr);
}
}
/* /Pages/Dashboard/CustomerStatus/DashboardCustomerDisabledTenantNotes.razor.rz.scp.css */
/* CSS Isolation */
.CardItem[b-nviflih9wf] {
margin: 4px;
max-width: 600px;
min-width: 600px;
max-height: 600px;
overflow: auto;
}
.CardItem table td[b-nviflih9wf]{
vertical-align: top
}
/* /Pages/Dashboard/CustomerStatus/DashboardCustomerStatus.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Dashboard/CustomerStatus/DatesPicker.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Dashboard/DashboardCustomerSecurity.razor.rz.scp.css */
.ChartGrid[b-8gccvffhav] {
margin-top: 14px;
}
/* /Pages/Dashboard/DashboardTenantAzureBaseline.razor.rz.scp.css */
.baseline-scroll[b-oz8gvisggt] {
overflow-x: auto;
border: 1px solid #d1d5db;
border-radius: 4px;
background: #fff;
}
.baseline-table[b-oz8gvisggt] {
border-collapse: collapse;
font-size: 11px;
width: max-content;
}
.baseline-table th[b-oz8gvisggt],
.baseline-table td[b-oz8gvisggt] {
border: 1px solid #d1d5db;
padding: 2px 4px;
text-align: right;
white-space: nowrap;
min-width: 70px;
}
.baseline-table th[b-oz8gvisggt] {
background: #f3f4f6;
font-weight: 600;
position: sticky;
top: 0;
z-index: 2;
text-align: center;
}
.baseline-table th.sub-col[b-oz8gvisggt],
.baseline-table td.sub-col[b-oz8gvisggt] {
text-align: left;
position: sticky;
left: 0;
z-index: 3;
background: #ffffff;
min-width: 260px;
font-weight: 500;
}
.baseline-table th.sub-col[b-oz8gvisggt] {
background: #f3f4f6;
z-index: 4;
}
.baseline-table .sub-meta[b-oz8gvisggt] {
color: #6b7280;
font-size: 10px;
font-weight: 400;
}
.baseline-table td .cell-main[b-oz8gvisggt] {
font-weight: 700;
line-height: 1.1;
}
.baseline-table td .cell-sub[b-oz8gvisggt] {
color: #475569;
font-size: 9px;
line-height: 1.1;
}
.baseline-table td.pending[b-oz8gvisggt] {
background: #f9fafb;
color: #9ca3af;
}
.baseline-table td.busy[b-oz8gvisggt] {
background: #dbeafe;
color: #1e3a8a;
}
.baseline-table td.has[b-oz8gvisggt] {
background: #d1fae5;
color: #065f46;
}
.baseline-table td.cached[b-oz8gvisggt] {
background: #e0e7ff;
color: #3730a3;
font-style: italic;
}
.baseline-table td.empty[b-oz8gvisggt] {
background: #fef3c7;
color: #92400e;
}
.baseline-table td.fail[b-oz8gvisggt] {
background: #fee2e2;
color: #991b1b;
cursor: help;
}
.baseline-table td.total-col[b-oz8gvisggt],
.baseline-table th.total-col[b-oz8gvisggt] {
background: #f9fafb;
font-weight: 700;
position: sticky;
right: 0;
min-width: 80px;
}
.baseline-table td.total-col.has[b-oz8gvisggt] {
background: #d1fae5;
}
.baseline-table .year-divider[b-oz8gvisggt] {
border-right: 2px solid #6b7280 !important;
}
.legend-swatch[b-oz8gvisggt] {
display: inline-block;
width: 12px;
height: 12px;
vertical-align: middle;
border: 1px solid #d1d5db;
margin: 0 4px 0 12px;
}
.legend-swatch.has[b-oz8gvisggt] { background: #d1fae5; }
.legend-swatch.empty[b-oz8gvisggt] { background: #fef3c7; }
.legend-swatch.busy[b-oz8gvisggt] { background: #dbeafe; }
.legend-swatch.fail[b-oz8gvisggt] { background: #fee2e2; }
.legend-swatch.cached[b-oz8gvisggt] { background: #e0e7ff; }
/* /Pages/Dashboard/DashboardTenantAzureCoverage.razor.rz.scp.css */
.coverage-scroll[b-h7zvk2jz18] {
overflow-x: auto;
border: 1px solid #d1d5db;
border-radius: 4px;
background: #fff;
}
.coverage-table[b-h7zvk2jz18] {
border-collapse: collapse;
font-size: 12px;
width: max-content;
}
.coverage-table th[b-h7zvk2jz18],
.coverage-table td[b-h7zvk2jz18] {
border: 1px solid #d1d5db;
padding: 4px 6px;
text-align: center;
white-space: nowrap;
}
.coverage-table th[b-h7zvk2jz18] {
background: #f3f4f6;
font-weight: 600;
position: sticky;
top: 0;
z-index: 2;
}
.coverage-table th.sub-col[b-h7zvk2jz18],
.coverage-table td.sub-col[b-h7zvk2jz18] {
text-align: left;
position: sticky;
left: 0;
z-index: 3;
background: #ffffff;
min-width: 240px;
font-weight: 500;
}
.coverage-table th.sub-col[b-h7zvk2jz18] {
background: #f3f4f6;
z-index: 4;
}
.coverage-table .sub-meta[b-h7zvk2jz18] {
color: #6b7280;
font-size: 10px;
font-weight: 400;
}
.coverage-table td.has[b-h7zvk2jz18] {
background: #d1fae5;
color: #065f46;
font-weight: 700;
}
.coverage-table td.empty[b-h7zvk2jz18] {
background: #fef3c7;
color: #92400e;
}
.coverage-table td.fail[b-h7zvk2jz18] {
background: #fee2e2;
color: #991b1b;
font-weight: 700;
cursor: help;
}
.coverage-table td.miss[b-h7zvk2jz18] {
background: #f3f4f6;
color: #9ca3af;
}
.coverage-table td.total-col[b-h7zvk2jz18],
.coverage-table th.total-col[b-h7zvk2jz18] {
background: #f9fafb;
font-weight: 700;
position: sticky;
right: 0;
}
.coverage-table td.total-col.has[b-h7zvk2jz18] {
background: #d1fae5;
}
.coverage-table td.total-col.empty[b-h7zvk2jz18] {
background: #fef3c7;
}
.coverage-table td.total-col.fail[b-h7zvk2jz18] {
background: #fee2e2;
}
.coverage-table .year-divider[b-h7zvk2jz18] {
border-right: 2px solid #6b7280 !important;
}
.legend-swatch[b-h7zvk2jz18] {
display: inline-block;
width: 12px;
height: 12px;
vertical-align: middle;
border: 1px solid #d1d5db;
margin: 0 4px 0 12px;
}
.legend-swatch.has[b-h7zvk2jz18] { background: #d1fae5; }
.legend-swatch.empty[b-h7zvk2jz18] { background: #fef3c7; }
.legend-swatch.fail[b-h7zvk2jz18] { background: #fee2e2; }
/* /Pages/Dashboard/DashboardTenantSecurity.razor.rz.scp.css */
.ChartGrid[b-h8r7nhz6r6] {
margin-top: -14px;
}
/* /Pages/Dashboard/LicensingSummary/EmptyLayout.razor.rz.scp.css */
*[b-bmq0nns9cv] {
font-family: Arial, Helvetica, sans-serif;
line-height: 1.6;
}
@page {
margin: 1.3cm;
}
/* /Pages/Dashboard/Mailbox/TenantMailboxGrid.razor.rz.scp.css */
body[b-efv47bcfqy] {
}
/* /Pages/Dashboard/TenantMfa/AcceptRiskDialog.razor.rz.scp.css */
.Title[b-xxr3z812wh] {
font-weight: bolder;
font-size: larger;
}
.ReasonTextBox[b-xxr3z812wh] {
}
.ButtonContainer button[b-xxr3z812wh] {
/*min-width: 72px;*/
}
/* /Pages/Diagnostics/DeveloperTools.razor.rz.scp.css */
.ForceAlign[b-4oao7suipk] {
margin-left: 12px !important;
}
/* /Pages/Diagnostics/EcpComponents/CodeExample.razor.rz.scp.css */
/* CSS Isolation — editor-style code window. Deliberate custom CSS: MudBlazor has no code
panel and the token colours target markup injected via MarkupString (hence ::deep). */
.code-window[b-0vlu3kckx9] {
border-radius: 10px;
overflow: hidden;
background: #1e1e2e;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}
.code-header[b-0vlu3kckx9] {
display: flex;
align-items: center;
gap: 6px;
padding: 4px 12px;
background: #181825;
border-bottom: 1px solid #313244;
}
.code-dot[b-0vlu3kckx9] {
width: 12px;
height: 12px;
border-radius: 50%;
display: inline-block;
}
.code-dot-red[b-0vlu3kckx9] {
background: #ff5f57;
}
.code-dot-amber[b-0vlu3kckx9] {
background: #febc2e;
}
.code-dot-green[b-0vlu3kckx9] {
background: #28c840;
}
.code-header[b-0vlu3kckx9] .code-title {
color: #a6adc8;
margin-left: 8px;
font-family: 'Cascadia Code', Consolas, monospace;
}
.code-lang[b-0vlu3kckx9] {
color: #89b4fa;
background: rgba(137, 180, 250, 0.12);
border: 1px solid rgba(137, 180, 250, 0.35);
border-radius: 999px;
padding: 1px 10px;
font-size: 0.7rem;
font-family: 'Cascadia Code', Consolas, monospace;
text-transform: uppercase;
letter-spacing: 0.08em;
}
.code-header[b-0vlu3kckx9] .code-copy {
color: #a6adc8;
}
.code-body[b-0vlu3kckx9] {
margin: 0;
padding: 14px 16px;
overflow-x: auto;
color: #cdd6f4;
font-family: 'Cascadia Code', Consolas, 'Courier New', monospace;
font-size: 0.8rem;
line-height: 1.6;
tab-size: 4;
}
.code-body[b-0vlu3kckx9] .tok-tag {
color: #89b4fa;
}
.code-body[b-0vlu3kckx9] .tok-attr {
color: #f9e2af;
}
.code-body[b-0vlu3kckx9] .tok-str {
color: #a6e3a1;
}
.code-body[b-0vlu3kckx9] .tok-razor {
color: #f38ba8;
}
.code-body[b-0vlu3kckx9] .tok-kw {
color: #cba6f7;
}
.code-body[b-0vlu3kckx9] .tok-com {
color: #6c7086;
font-style: italic;
}
/* /Pages/Diagnostics/EcpComponents/EcpComponents.razor.rz.scp.css */
/* CSS Isolation — hero banner for the component library page. ::deep is required because the
MudPaper/MudText elements are rendered by child components and do not carry the scope attribute. */
.ecp-components-page[b-f9z39wue6o] .components-hero {
background: linear-gradient(135deg, var(--mud-palette-primary) 0%, var(--mud-palette-info) 100%);
border-radius: var(--mud-default-borderradius);
}
.ecp-components-page[b-f9z39wue6o] .components-hero .mud-typography {
color: var(--mud-palette-primary-text);
}
.ecp-components-page[b-f9z39wue6o] .components-hero .mud-icon-root {
color: var(--mud-palette-primary-text);
opacity: 0.85;
}
/* /Pages/Diagnostics/EcpGridPageTemplate.razor.rz.scp.css */
.AcknowledgeContainer ul[b-btyrisbp3q] {
list-style: disc !important;
padding: revert;
}
.AcknowledgeContainer li[b-btyrisbp3q] {
display: list-item !important;
text-align: inherit !important;
unicode-bidi: inherit !important;
}
.AcknowledgeContainer li > ul[b-btyrisbp3q] {
padding-left: 20px;
}
.AcknowledgeContainer button[b-btyrisbp3q] {
text-transform: lowercase !important;
max-height: 50px;
}
/* /Pages/Diagnostics/EcpTabbedGridTemplate/EcpTabbedGridTemplate.razor.rz.scp.css */
body[b-8v84gk1zqe] {
}
/* /Pages/Document/DocumentView.razor.rz.scp.css */
@media print {
.e-richtexteditor[b-cdze3pub88], .e-rte-content[b-cdze3pub88], .e-rte-content .e-content[b-cdze3pub88] {
height: auto !important;
overflow: visible !important;
}
/* Hide scrollbars */
.e-rte-content .e-content[b-cdze3pub88] {
scrollbar-width: none; /* Firefox */
}
.e-rte-content .e-content[b-cdze3pub88]::-webkit-scrollbar {
display: none; /* Chrome, Safari */
}
/* Hide app bar*/
.mud-appbar[b-cdze3pub88] {
display: none !important;
}
.mud-toolbar[b-cdze3pub88] {
display: none !important;
}
}
/* Hidden in normal screen unless body has .print-only */
body.print-only *[b-cdze3pub88] {
display: none !important;
}
body.print-only #content-container[b-cdze3pub88],
body.print-only #content-container *[b-cdze3pub88] {
display: block !important;
}
body.print-only #content-container[b-cdze3pub88] {
position: absolute;
top: 0;
left: 0;
width: 100%;
box-sizing: border-box;
margin: 0;
padding: 0;
}
body.print-only #content-container img[b-cdze3pub88],
body.print-only #content-container pre[b-cdze3pub88],
body.print-only #content-container code[b-cdze3pub88] {
display: block !important;
}
/* /Pages/EmailSignature/EmailSignatureList.razor.rz.scp.css */
/* Inline signature thumbnail: a fixed, clipped frame that renders the full signature scaled down.
The iframe is laid out at full size (600x400) then scaled to fit the 96x64 frame, so the preview
is a faithful miniature of the real signature. pointer-events are disabled on the iframe so the
click lands on the container (which opens the full preview panel). */
.sig-thumb[b-1fyr3vszgu] {
width: 96px;
height: 64px;
overflow: hidden;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
background: #fff;
cursor: pointer;
position: relative;
}
.sig-thumb-frame[b-1fyr3vszgu] {
width: 600px;
height: 400px;
border: 0;
transform: scale(0.16);
transform-origin: top left;
pointer-events: none;
}
.sig-thumb-empty[b-1fyr3vszgu] {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
color: var(--mud-palette-text-disabled);
}
/* Drag-and-drop reorder: the Order cell is both the drag source (grip handle) and the drop
target. The dashed outline marks the row the dragged component would take the place of. */
.sig-order-cell[b-1fyr3vszgu] {
min-height: 32px;
padding: 2px 4px;
border-radius: 4px;
}
.sig-drag-handle[b-1fyr3vszgu] {
cursor: grab;
color: var(--mud-palette-text-secondary);
}
.sig-drag-over[b-1fyr3vszgu] {
outline: 2px dashed var(--mud-palette-info);
outline-offset: -2px;
}
/* Secondary halves of the compact columns: rule-summary values and the "by: name" line. */
.sig-summary-value[b-1fyr3vszgu] {
color: var(--mud-palette-text-secondary);
}
/* /Pages/EmailSignature/EmailSignatureOptionsDialog.razor.rz.scp.css */
/* Fixed dialog-content height so switching tabs never resizes the dialog: the tab header keeps
its natural height and the panel area fills the rest, scrolling when a tab's content is taller. */
.sig-options-root[b-5mdmvkvfu8] {
height: 70vh;
display: flex;
flex-direction: column;
}
.sig-options-root[b-5mdmvkvfu8] .mud-tabs {
height: 100%;
display: flex;
flex-direction: column;
}
.sig-options-root[b-5mdmvkvfu8] .mud-tabs-panels {
flex: 1;
overflow-y: auto;
}
/* /Pages/EmailSignature/EmailSignaturePreview.razor.rz.scp.css */
/* CSS Isolation */
/*
DEV note: MudBlazor does NOT play well with css-isolation
Use div or span wrappers
The "why this signature" trace styles used to live here. They moved to
SignaturePreviewPanel.razor.css when that markup became its own component: isolation rewrites
each rule to match only elements declared in the matching .razor file, so rules left behind
here matched nothing and the trace rendered unstyled.
*/
/* /Pages/EmailSignature/EmailSignatureUserFieldList.razor.rz.scp.css */
/* Drag-to-reorder cell — matches the signature-components grid look & feel. */
.sig-order-cell[b-6hkvafb16g] {
min-height: 32px;
padding: 2px 4px;
border-radius: 4px;
}
.sig-drag-handle[b-6hkvafb16g] {
cursor: grab;
color: var(--mud-palette-text-secondary);
}
.sig-drag-over[b-6hkvafb16g] {
outline: 2px dashed var(--mud-palette-info);
outline-offset: -2px;
}
/* /Pages/EmailSignature/EmailSignatureUserSettingsList.razor.rz.scp.css */
/* Cells whose value is inherited (no stored row) are muted, so an explicitly stored value stands out
and it is obvious which settings "restore default" would actually change. */
[b-fm508cup06] .sig-setting-inherited {
opacity: 0.55;
}
/* Keep the setting columns compact — the inline editors otherwise stretch the row height. */
[b-fm508cup06] .mud-table-cell .mud-input-control {
margin-top: 0;
}
/* /Pages/EmailSignature/RibbonInsertIconDialog.razor.rz.scp.css */
/* Icon picker grid — previews use the Font Awesome webfont where available, inline SVG
otherwise (icons newer than the loaded FA version, e.g. X). */
.sig-icon-grid[b-aylxrlwn1k] {
display: flex;
flex-wrap: wrap;
gap: 4px;
max-height: 230px;
overflow-y: auto;
padding: 4px;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
}
.sig-icon-tile[b-aylxrlwn1k] {
width: 72px;
height: 58px;
border: 2px solid transparent;
border-radius: 4px;
background: transparent;
cursor: pointer;
color: var(--mud-palette-text-primary);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 3px;
padding: 4px 2px;
}
.sig-icon-tile:hover[b-aylxrlwn1k] {
background: var(--mud-palette-action-default-hover, rgba(0, 0, 0, 0.06));
}
.sig-icon-tile.selected[b-aylxrlwn1k] {
border-color: var(--mud-palette-info);
}
.sig-icon-glyph[b-aylxrlwn1k] {
font-size: 20px;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
}
.sig-icon-glyph svg[b-aylxrlwn1k] {
width: 20px;
height: 20px;
}
.sig-icon-label[b-aylxrlwn1k] {
font-size: 0.62rem;
line-height: 1.1;
color: var(--mud-palette-text-secondary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 68px;
}
/* Live preview swatch (approximation of the rendered PNG). */
.sig-icon-preview[b-aylxrlwn1k] {
display: flex;
align-items: center;
justify-content: center;
}
.sig-icon-preview.circle[b-aylxrlwn1k],
.sig-icon-preview.circle-outline[b-aylxrlwn1k] {
border-radius: 50%;
}
.sig-icon-preview.square[b-aylxrlwn1k],
.sig-icon-preview.square-outline[b-aylxrlwn1k] {
border-radius: 12%;
}
/* /Pages/EmailSignature/RibbonInsertImageDialog.razor.rz.scp.css */
/* Thumbnail gallery of the entity-shared signature images. */
.sig-image-gallery[b-r3zpx8td22] {
display: flex;
flex-wrap: wrap;
gap: 8px;
max-height: 220px;
overflow-y: auto;
padding: 4px;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
}
.sig-image-tile[b-r3zpx8td22] {
position: relative;
width: 84px;
height: 84px;
border: 2px solid transparent;
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
background: var(--mud-palette-background-gray, #fafafa);
cursor: pointer;
}
.sig-image-tile.selected[b-r3zpx8td22] {
border-color: var(--mud-palette-info);
}
.sig-image-tile img[b-r3zpx8td22] {
max-width: 76px;
max-height: 76px;
object-fit: contain;
}
/* Delete overlay in the tile corner — visible on hover. */
.sig-image-tile[b-r3zpx8td22] .sig-image-delete {
position: absolute;
top: 0;
right: 0;
padding: 2px;
background: rgba(255, 255, 255, 0.85);
opacity: 0;
}
.sig-image-tile:hover[b-r3zpx8td22] .sig-image-delete {
opacity: 1;
}
/* /Pages/EmailSignature/RibbonSurveyDialog.razor.rz.scp.css */
/* Fixed-width label column so the Shape / Fill / Colour radio rows align. ::deep because the
class lands on MudText's own root element, which Blazor CSS isolation does not scope. */
.survey-option-row[b-ha9e9x9wuu] .survey-option-label {
width: 72px;
flex-shrink: 0;
}
/* /Pages/EmailSignature/RibbonTemplatePickerDialog.razor.rz.scp.css */
/* Vertically scrollable list of template previews; 10px gap between rows. */
.tmpl-list[b-j6fw1le4da] {
display: flex;
flex-direction: column;
gap: 10px;
max-height: 70vh;
overflow-y: auto;
padding-right: 4px;
}
/* One template: near-full-size preview on the left, name + Select on the right. */
.tmpl-row[b-j6fw1le4da] {
display: flex;
gap: 12px;
align-items: stretch;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 6px;
padding: 8px;
}
.tmpl-row-current[b-j6fw1le4da] {
outline: 2px solid var(--mud-palette-info);
}
.tmpl-preview[b-j6fw1le4da] {
flex: 1;
min-width: 0;
height: 240px;
overflow: hidden;
background: #fff;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
}
.tmpl-frame[b-j6fw1le4da] {
width: 100%;
height: 100%;
border: 0;
}
.tmpl-actions[b-j6fw1le4da] {
flex: 0 0 140px;
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: center;
gap: 6px;
}
/* Template name: small, grey, above the Select button. */
.tmpl-name[b-j6fw1le4da] {
font-size: 0.72rem;
color: var(--mud-palette-text-secondary);
text-align: center;
word-break: break-word;
}
/* /Pages/EmailSignature/SignatureHtmlEditor.razor.rz.scp.css */
/* Monaco needs an explicit container height — it sizes to its parent, and inside a
MudTabPanel the parent otherwise collapses to 0. Matches the design surface height. */
.html-source-editor[b-ry2o5419xr] .monaco-editor-container {
height: 550px;
}
/* ── CodeTwo-style ribbon ─────────────────────────────────────────────────── */
.sig-ribbon[b-ry2o5419xr] {
border: 1px solid var(--mud-palette-lines-default);
border-bottom: none;
border-radius: 4px 4px 0 0;
/* No overflow:hidden here — the colour dropdowns overhang the ribbon's bottom edge
and would be clipped. The tab strip rounds its own top corners instead. */
background: var(--mud-palette-surface);
position: relative;
z-index: 30; /* keep the colour dropdowns above the editor canvas */
}
/* Tab strip across the top (Main / Table layout) — same surface colour as the ribbon,
separated by a hairline; the active tab is marked by colour + underline. */
.ribbon-tabs[b-ry2o5419xr] {
display: flex;
background: var(--mud-palette-surface);
border-bottom: 1px solid var(--mud-palette-lines-default);
border-radius: 3px 3px 0 0;
}
.ribbon-tab[b-ry2o5419xr] {
border: none;
background: transparent;
color: var(--mud-palette-text-secondary);
padding: 8px 20px;
font-size: 0.85rem;
cursor: pointer;
border-bottom: 3px solid transparent;
margin-bottom: -1px; /* underline sits on the strip's hairline */
}
.ribbon-tab:hover[b-ry2o5419xr] {
color: var(--mud-palette-text-primary);
}
.ribbon-tab.active[b-ry2o5419xr] {
color: var(--mud-palette-info);
border-bottom-color: var(--mud-palette-info);
}
/* Row of captioned tool groups. */
.ribbon-groups[b-ry2o5419xr] {
display: flex;
align-items: stretch;
flex-wrap: wrap;
padding: 4px 8px 2px 8px;
}
[b-ry2o5419xr] .ribbon-group {
display: flex;
flex-direction: column;
padding: 0 10px;
border-right: 1px solid var(--mud-palette-lines-default);
}
[b-ry2o5419xr] .ribbon-group:last-child {
border-right: none;
}
[b-ry2o5419xr] .ribbon-group-buttons {
display: flex;
align-items: center;
gap: 2px;
flex: 1;
min-height: 58px; /* uniform group height — Font group's two rows set the tallest case */
}
[b-ry2o5419xr] .ribbon-group-caption {
text-align: center;
font-size: 0.7rem;
color: var(--mud-palette-text-secondary);
margin-top: 2px;
padding-bottom: 2px;
}
/* Large command icons at 32px — MudBlazor's Size.Large (36px) reads too heavy next to
Office ribbons. Duplicated under ::deep for markup inside child-content fragments. */
.ribbon-btn-inner .mud-icon-root[b-ry2o5419xr],
[b-ry2o5419xr] .ribbon-btn-inner .mud-icon-root {
font-size: 32px;
}
/* Icon-over-label buttons. */
[b-ry2o5419xr] .ribbon-btn {
min-width: 56px;
padding: 4px 6px;
text-transform: none;
}
[b-ry2o5419xr] .ribbon-btn-inner {
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
}
[b-ry2o5419xr] .ribbon-btn-label {
font-size: 0.7rem;
line-height: 1.1;
white-space: normal;
max-width: 76px;
color: var(--mud-palette-text-primary);
}
/* Two-row stack inside the Font group (selects above, format buttons below). */
.ribbon-font-stack[b-ry2o5419xr] {
display: flex;
flex-direction: column;
}
[b-ry2o5419xr] .ribbon-font-select {
width: 150px;
}
[b-ry2o5419xr] .ribbon-size-select {
width: 80px;
}
/* Compact the MudSelects so the Font group's two rows fit the uniform group height. */
[b-ry2o5419xr] .ribbon-font-select .mud-input,
[b-ry2o5419xr] .ribbon-size-select .mud-input {
font-size: 0.8rem;
}
[b-ry2o5419xr] .ribbon-font-select.mud-input-control,
[b-ry2o5419xr] .ribbon-size-select.mud-input-control {
margin: 0;
}
/* Active-state highlight on toggle buttons (HTML source, Preview, Sample email, Gridlines)
and format buttons (bold on bold text, etc.). Must read clearly in BOTH themes — the old
theme-hover tint was invisible in dark mode: accent fill plus an accent ring. */
[b-ry2o5419xr] .fmt-active {
background: rgba(33, 150, 243, 0.15); /* fallback for browsers without color-mix */
background: color-mix(in srgb, var(--mud-palette-info) 25%, transparent);
box-shadow: inset 0 0 0 1px var(--mud-palette-info);
border-radius: 4px;
}
/* Dimmed content for disabled ribbon buttons (Table layout tools outside a table). */
[b-ry2o5419xr] .ribbon-btn-disabled {
opacity: 0.4;
}
/* Text/highlight colour dropdowns — plain in-ribbon elements (no popover portal) so the
editor's selection survives the interaction. */
.ribbon-color-wrap[b-ry2o5419xr] {
position: relative;
}
.ribbon-icon-btn[b-ry2o5419xr] {
display: flex;
align-items: center;
background: transparent;
border: none;
padding: 6px;
border-radius: 4px;
cursor: pointer;
color: var(--mud-palette-text-primary);
}
.ribbon-icon-btn:hover[b-ry2o5419xr] {
background: var(--mud-palette-action-default-hover, rgba(0, 0, 0, 0.06));
}
.ribbon-palette-popup[b-ry2o5419xr] {
position: absolute;
top: 100%;
left: 0;
z-index: 20;
background: var(--mud-palette-surface);
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25);
width: 250px;
}
/* Inline (static) MudColorPicker inside the colour dropdowns — spectrum, sliders, hex input. */
[b-ry2o5419xr] .ribbon-color-picker {
width: 100%;
box-shadow: none;
}
.ribbon-tab:disabled[b-ry2o5419xr] {
opacity: 0.4;
cursor: default;
}
/* Preview surface (standalone Preview and the sample email thread). Deliberately WHITE in
both themes — signatures are judged against how the sent email renders, and emails are
read on white (same choice Word and CodeTwo make). Text colour is pinned dark so the
dark theme's light text doesn't wash out on the white surface. */
.sig-email-page[b-ry2o5419xr] {
border: 1px solid var(--mud-palette-lines-default);
border-radius: 0 0 4px 4px;
background: #fff;
color: #212121;
padding: 14px 18px;
}
/* Sandboxed iframe carrying the resolved signature; height is set to the content by
signatureSelection.resizePreviewFrame after each render. */
.sig-preview-frame[b-ry2o5419xr] {
display: block;
width: 100%;
border: 0;
background: #fff;
margin: 12px 0;
}
/* HTML / Plain text switch shown at the top of the preview renditions. */
.sig-preview-tabs[b-ry2o5419xr] {
display: flex;
gap: 4px;
margin-bottom: 10px;
}
/* Fixed colours — the pills sit on the always-white preview surface, so theme variables
would render light-on-white in dark mode. */
.sig-preview-tab[b-ry2o5419xr] {
border: 1px solid #c4c4c4;
background: transparent;
color: #666;
padding: 3px 14px;
font-size: 0.8rem;
border-radius: 12px;
cursor: pointer;
}
.sig-preview-tab.active[b-ry2o5419xr] {
color: #fff;
background: var(--mud-palette-info);
border-color: var(--mud-palette-info);
}
/* Plain-text rendition — fixed-width like plain-text emails render in Outlook. */
.sig-preview-text[b-ry2o5419xr] {
white-space: pre-wrap;
font-family: Consolas, "Courier New", monospace;
font-size: 0.85rem;
color: #000;
margin: 12px 0;
}
.sig-thread[b-ry2o5419xr] {
font-family: Calibri, Arial, sans-serif;
font-size: 0.85rem;
color: #8a8a8a;
}
.sig-thread p[b-ry2o5419xr] {
margin: 0 0 10px;
}
/* Symbol dropdown — grid of character tiles, with a footer hint pointing at the Icon dialog
for the concepts Unicode has no monochrome glyph for (fax, globe, building). */
.ribbon-char-popup[b-ry2o5419xr] {
width: auto;
}
.ribbon-char-menu[b-ry2o5419xr] {
display: grid;
grid-template-columns: repeat(10, 32px);
gap: 4px;
padding: 8px;
width: auto;
max-height: 320px;
overflow-y: auto;
}
.ribbon-char-hint[b-ry2o5419xr] {
border-top: 1px solid var(--mud-palette-lines-default);
padding: 6px 8px;
font-size: 0.7rem;
color: var(--mud-palette-text-secondary);
}
.ribbon-char-item[b-ry2o5419xr] {
width: 32px;
height: 32px;
font-size: 16px;
background: transparent;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
cursor: pointer;
color: var(--mud-palette-text-primary);
}
.ribbon-char-item:hover[b-ry2o5419xr] {
background: var(--mud-palette-action-default-hover, rgba(0, 0, 0, 0.06));
}
/* Raw-button trigger for in-ribbon dropdowns (needs its own reset — no MudButton base). */
[b-ry2o5419xr] .ribbon-menu-trigger {
background: transparent;
border: none;
cursor: pointer;
border-radius: 4px;
}
[b-ry2o5419xr] .ribbon-menu-trigger:hover {
background: var(--mud-palette-action-default-hover, rgba(0, 0, 0, 0.06));
}
/* Placeholder dropdown — scrollable token list (descriptions only; token in tooltip).
Rules are duplicated under ::deep because scope-attribute placement varies for markup
rendered through the ribbon's child-content fragments. */
.ribbon-token-menu[b-ry2o5419xr],
[b-ry2o5419xr] .ribbon-token-menu {
width: 230px;
max-height: 320px;
overflow-y: auto;
padding: 4px;
}
.ribbon-token-item[b-ry2o5419xr],
[b-ry2o5419xr] .ribbon-token-item {
display: block;
width: 100%;
text-align: left;
background: transparent;
border: none;
padding: 6px 10px;
font-size: 0.8rem;
border-radius: 4px;
cursor: pointer;
color: var(--mud-palette-text-primary);
}
.ribbon-token-item:hover[b-ry2o5419xr],
[b-ry2o5419xr] .ribbon-token-item:hover {
background: var(--mud-palette-action-default-hover, rgba(0, 0, 0, 0.06));
}
/* Colour swatch grids inside the text/highlight colour menus. */
.ribbon-palette[b-ry2o5419xr] {
display: grid;
grid-template-columns: repeat(8, 22px);
gap: 4px;
padding: 8px;
}
.ribbon-swatch[b-ry2o5419xr] {
width: 22px;
height: 22px;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 3px;
cursor: pointer;
padding: 0;
}
.ribbon-swatch:hover[b-ry2o5419xr] {
outline: 2px solid var(--mud-palette-info);
}
/* "No fill / clear colour" swatch: a white square crossed by a red diagonal — the
conventional "no colour" indicator. Clicking it removes the applied colour. */
.ribbon-swatch-clear[b-ry2o5419xr] {
background-color: #fff;
background-image: linear-gradient(to top right, transparent 0 calc(50% - 1px), #f44336 calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px) 100%);
}
/* The ribbon replaces Radzen's toolbar (ShowToolbar="false") — square off the top
corners so the canvas visually attaches to the ribbon. */
.sig-editor-shell[b-ry2o5419xr] .rz-html-editor {
border-radius: 0 0 4px 4px;
}
/* Editing canvas — same white-in-both-themes rule as the preview surface: signatures are
authored against the white background emails render on, and the dark theme's inherited
light text would wash out on it. */
.sig-editor-shell[b-ry2o5419xr] .rz-html-editor-content {
background: #fff;
color: #212121;
}
/* Word-style gridlines editing aid: faint dashed outlines make borderless table structure
visible. Outlines don't affect layout and exist only in the canvas CSS — the saved HTML
and the sent email are untouched. */
.sig-editor-shell.show-gridlines[b-ry2o5419xr] .rz-html-editor-content table,
.sig-editor-shell.show-gridlines[b-ry2o5419xr] .rz-html-editor-content td,
.sig-editor-shell.show-gridlines[b-ry2o5419xr] .rz-html-editor-content th {
outline: 1px dashed #b8b8b8;
outline-offset: -1px;
}
/* Hide-if-empty region cue: grays and outlines the content wrapped in a
… comment so the designer can see what disappears from
sent mail when its tokens are blank. Editor-only — the "ecp-hide-if-empty" class is added by
signatureSelection.decorateConditional and stripped by CleanEditorArtifacts before the body is
stored or sent, so it never reaches the signature. */
.sig-editor-shell[b-ry2o5419xr] .rz-html-editor-content .ecp-hide-if-empty {
opacity: 0.5;
outline: 1px dashed #1976d2;
outline-offset: 1px;
}
/* /Pages/EmailSignature/SignaturePreviewPanel.razor.rz.scp.css */
/* CSS Isolation */
/*
DEV note: MudBlazor does NOT play well with css-isolation
Use div or span wrappers
These rules live HERE, next to the markup they style, and not on the page that hosts this
component. Blazor's CSS isolation rewrites each rule to match only elements declared in the
matching .razor file, so leaving them on the parent page silently styled nothing once this
markup moved into a component — the thumbnails rendered unscaled and unclipped and the
verdict backgrounds vanished. Every element below is a plain div or iframe declared in
SignaturePreviewPanel.razor, which is what makes the scoping work; the MudText elements use
MudBlazor's own global classes instead, because isolation never reaches inside a child
component's rendered output.
*/
/* One component's verdict. Deliberately NOT interactive: there is nothing to click, and a
MudListItem's hover highlight plus click ripple made it look as though there were. */
.sig-trace-row[b-vgrcn4sa8a] {
display: flex;
align-items: flex-start;
gap: 10px;
padding: 8px;
margin-bottom: 8px;
border-radius: 4px;
border: 1px solid var(--mud-palette-lines-default);
}
/* Verdict is carried by the row background, so it reads before any text is parsed. Low-alpha tints of
the theme's own success/error colours, so they hold up in both light and dark themes rather than
fighting a hard-coded green/red. */
.sig-trace-included[b-vgrcn4sa8a] {
background: rgba(var(--mud-palette-success-rgb), 0.16);
}
.sig-trace-skipped[b-vgrcn4sa8a] {
background: rgba(var(--mud-palette-error-rgb), 0.12);
}
/* Same trick as the components list: lay the iframe out at full size, then scale it down, so the
miniature is a faithful rendering rather than a squashed one. The fixed, clipping box is what stops
a full-size signature from taking over the sidebar. pointer-events are off because the thumbnail is
illustrative — nothing here responds to a click. */
.sig-trace-thumb[b-vgrcn4sa8a] {
flex: 0 0 auto;
width: 96px;
height: 64px;
overflow: hidden;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
background: #fff;
position: relative;
}
.sig-trace-thumb-frame[b-vgrcn4sa8a] {
width: 600px;
height: 400px;
border: 0;
transform: scale(0.16);
transform-origin: top left;
pointer-events: none;
}
.sig-trace-thumb-empty[b-vgrcn4sa8a] {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
font-size: 0.7rem;
text-align: center;
color: var(--mud-palette-text-disabled);
}
/* min-width:0 lets the text column shrink inside the flex row instead of forcing it wider than the
sidebar when a component name or reason is long. */
.sig-trace-body[b-vgrcn4sa8a] {
min-width: 0;
}
/* /Pages/EmailSignatureTemplate/EmailSignatureTemplateList.razor.rz.scp.css */
/* Inline template thumbnail: a fixed, clipped frame that renders the full template scaled down.
The iframe is laid out at full size (600x400) then scaled to fit the 96x64 frame, so the preview
is a faithful miniature of the real template. pointer-events are disabled on the iframe so the
click lands on the container (which opens the full preview panel). */
.sig-thumb[b-d7tall7139] {
width: 96px;
height: 64px;
overflow: hidden;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
background: #fff;
cursor: pointer;
position: relative;
}
.sig-thumb-frame[b-d7tall7139] {
width: 600px;
height: 400px;
border: 0;
transform: scale(0.16);
transform-origin: top left;
pointer-events: none;
}
.sig-thumb-empty[b-d7tall7139] {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
color: var(--mud-palette-text-disabled);
}
/* /Pages/Gdap/GdapOnboardingTest/GdapOnboardingTest.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Gdap/Template/ApplyGdapTemplateDialog.razor.rz.scp.css */
/* /Pages/Gdap/Template/GdapRelationshipsPanel.razor.rz.scp.css */
/* /Pages/Gdap/Template/GdapRoleSelectDialog.razor.rz.scp.css */
/* No scoped styles — MudBlazor dialogs render in a portal outside the component tree */
/* /Pages/Gdap/Template/GdapTemplateEdit.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Gdap/Template/GdapTemplateList.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Integrations/Components/ContactSyncIntegrationPanel.razor.rz.scp.css */
/* Contact Sync Integration Panel Styles */
/* /Pages/Integrations/Components/ContactSyncLicenseSelectionDialog.razor.rz.scp.css */
/* Contact Sync License Selection Dialog Styles */
/* /Pages/Integrations/Components/ServiceDeskIntegrationPanel.razor.rz.scp.css */
/* Service Desk Integration Panel Styles */
/* /Pages/Location/CSV/LocationImporter.razor.rz.scp.css */
.Results[b-96j2ki9azj] {
max-height: 150px;
overflow-y: auto;
padding: 5px;
}
.ResultItem[b-96j2ki9azj] {
padding-top: 2px !important;
padding-bottom: 2px !important;
}
/* /Pages/Location/LocationAdd.razor.rz.scp.css */
.TenantButtonContainer[b-lqyftnu0qp] {
display: inline-block;
margin: 5px;
}
/* /Pages/M365/DelegatedConsentTestPage.razor.rz.scp.css */
/* CSS Isolation */
.perm-detail[b-xqdqpcy9tz] {
color: var(--mud-palette-text-secondary);
font-size: 0.78rem;
}
/* /Pages/M365/OneDriveDelegationTestPage.razor.rz.scp.css */
/* CSS Isolation */
.perm-detail[b-0bpfqw1jgr] {
color: var(--mud-palette-text-secondary);
font-size: 0.78rem;
}
.onedrive-url[b-0bpfqw1jgr] {
word-break: break-all;
}
.dev-steps[b-0bpfqw1jgr] {
background: var(--mud-palette-background-grey);
padding: 12px;
border-radius: 4px;
overflow-x: auto;
font-size: 0.8rem;
line-height: 1.4;
white-space: pre;
margin: 0;
}
/* /Pages/M365/TenantPermissionsPage.razor.rz.scp.css */
/* CSS Isolation */
.perm-detail[b-z33fuhmi3v] {
color: var(--mud-palette-text-secondary);
}
/* /Pages/My/MyTaskList.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Newsletter/NewsletterList.razor.rz.scp.css */
/* Force card to flex column so thumbnail grows and content pins to bottom */
[b-ikyjqgp9dp] .newsletter-card {
display: flex !important;
flex-direction: column !important;
}
/* Thumbnail fills all available space above the card content */
.newsletter-thumbnail[b-ikyjqgp9dp] {
flex: 1 1 auto;
min-height: 180px;
background-color: transparent;
}
/* "Add Newsletter" placeholder card — dashed border with centred content */
[b-ikyjqgp9dp] .newsletter-add-card {
border: 2px dashed var(--mud-palette-primary);
background-color: transparent !important;
}
.newsletter-add-content[b-ikyjqgp9dp] {
flex: 1 1 auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 280px;
opacity: 0.7;
transition: opacity 0.2s ease;
}
.newsletter-add-content:hover[b-ikyjqgp9dp] {
opacity: 1;
}
/* Override MudItem to 5 columns on large screens (20% each) */
@media (min-width: 1280px) {
[b-ikyjqgp9dp] .mud-grid > .mud-grid-item-lg-2 {
flex-basis: 20% !important;
max-width: 20% !important;
}
}
/* /Pages/Notifications/DescriptionDialog.razor.rz.scp.css */
/* CSS Isolation */
/* Component-specific styles here */
/* /Pages/Notifications/UserVerificationReport.razor.rz.scp.css */
/* UserVerificationReport Styles */
/* /Pages/Policy/AdHoc/AdHocApplyTemplateWizard.razor.rz.scp.css */
fieldset.UrlContainer[b-8intp4bsn5] {
border: 1px solid lightgrey !important;
margin: 4px !important;
padding: 16px !important;
border-radius: 5px;
}
.UrlContainer legend[b-8intp4bsn5] {
padding-left: 4px;
padding-right: 4px;
}
/* /Pages/Policy/AdHoc/AdHocGoldenTenantReviewPage.razor.rz.scp.css */
/* CSS Isolation — Golden Tenant review page */
[b-jxqzaudy57] .golden-warning-row {
background-color: var(--mud-palette-warning-hover);
}
/* /Pages/Policy/AdHoc/AdHocSettingDetailDialog.razor.rz.scp.css */
/* Restore list styling inside HTML content rendered via MarkupString */
[b-6xp10w7uod] .content-container ul,
[b-6xp10w7uod] .content-container ol {
list-style-position: outside;
padding-left: 24px;
margin-top: 8px;
margin-bottom: 8px;
}
[b-6xp10w7uod] .content-container ul {
list-style-type: disc;
}
[b-6xp10w7uod] .content-container ol {
list-style-type: decimal;
}
[b-6xp10w7uod] .content-container li {
margin-bottom: 4px;
line-height: 1.5;
}
/* /Pages/Policy/AdHoc/AdHocSettingsCatalogPage.razor.rz.scp.css */
/* Non-rectifiable / manual intervention row styling */
[b-ya1janhy48] .manual-intervention-row {
background-color: rgba(255, 152, 0, 0.18) !important;
}
/* /Pages/Policy/AdHoc/AdHocTemplateEditPage.razor.rz.scp.css */
/* MudDataGrid group header styling */
.template-settings-group-header[b-y216j6sd0r] {
gap: 12px;
min-height: 36px;
}
/* Muted row style for excluded/disabled settings */
[b-y216j6sd0r] .template-settings-item-row-muted {
opacity: 0.55;
}
/* Pending root-removal rows should appear struck through until propagation approval */
[b-y216j6sd0r] .template-settings-item-row-stale {
text-decoration: line-through;
}
/* Non-rectifiable / manual intervention row styling */
[b-y216j6sd0r] .manual-intervention-row {
background-color: rgba(255, 152, 0, 0.18) !important;
}
/* Published toggle wrapper */
.publish-toggle-wrapper[b-y216j6sd0r] {
display: inline-flex;
}
/* ================================================================
Full-width settings grid
================================================================ */
/* Settings MudDataGrid — compact display */
[b-y216j6sd0r] .setting-grid {
font-size: 0.8125rem;
}
/* /Pages/Policy/AdHoc/AdHocTemplateGroupEditPage.razor.rz.scp.css */
/* Non-rectifiable / manual intervention row styling */
[b-8pm9pbt3nt] .manual-intervention-row {
background-color: rgba(255, 152, 0, 0.18) !important;
}
/* Settings MudDataGrid — compact display */
[b-8pm9pbt3nt] .templategroup-settings-grid {
font-size: 0.8125rem;
}
/* /Pages/Policy/AdHoc/AdHocTemplateListPage.razor.rz.scp.css */
/* Blinking dot indicator for "Updates available" chips */
.blink-dot[b-fm4bimlqmm] {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--mud-palette-error);
animation: blink-b-fm4bimlqmm 1s ease-in-out infinite;
margin-right: 4px;
vertical-align: middle;
}
@keyframes blink-b-fm4bimlqmm {
0%, 100% { opacity: 1; }
50% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
.blink-dot[b-fm4bimlqmm] {
animation: none;
}
}
/* /Pages/Policy/AdHoc/AdHocTenantAssignmentPage.razor.rz.scp.css */
/* Chart datapoint tooltips — larger, high-contrast text for readability.
MudBlazor renders tooltips as containing + .
The has inline font-size="12px" and fill="white" — override with !important. */
[b-5rlizmjycn] .mud-chart .svg-tooltip text {
font-size: 14px !important;
font-weight: 600 !important;
letter-spacing: 0.02em;
}
/* Tooltip background — slightly larger, rounded, subtle shadow */
[b-5rlizmjycn] .mud-chart .svg-tooltip rect {
rx: 6 !important;
ry: 6 !important;
}
/* /Pages/Policy/AdHoc/AdHocTenantCompliancePage.razor.rz.scp.css */
/* Compliance item row styling for MudDataGrid RowClassFunc */
[b-epvtcewtud] .compliance-item-row-muted {
opacity: 0.6;
}
/* License or permission restricted — greyed out to indicate the setting cannot run */
[b-epvtcewtud] .compliance-item-row-restricted {
opacity: 0.45;
background-color: rgba(158, 158, 158, 0.08) !important;
}
/* Non-rectifiable / manual intervention row styling */
[b-epvtcewtud] .manual-intervention-row {
background-color: rgba(255, 152, 0, 0.18) !important;
}
/* Paused section — dims the entire compliance area */
.compliance-paused-section[b-epvtcewtud] {
opacity: 0.4;
}
/* When Enforce mode is active, impact text turns red */
[b-epvtcewtud] .enforce-mode-active .impact-text {
color: var(--mud-palette-error) !important;
}
/* Chart datapoint tooltips — larger, high-contrast text for readability.
MudBlazor renders tooltips as containing + .
The has inline font-size="12px" and fill="white" — override with !important. */
[b-epvtcewtud] .mud-chart .svg-tooltip text {
font-size: 14px !important;
font-weight: 600 !important;
letter-spacing: 0.02em;
}
/* Tooltip background — slightly larger, rounded, subtle shadow */
[b-epvtcewtud] .mud-chart .svg-tooltip rect {
rx: 6 !important;
ry: 6 !important;
}
/* /Pages/Policy/AdHoc/AdHocTrackingReportPage.razor.rz.scp.css */
/* Scoped styles for AdHocTrackingReportPage */
/* /Pages/Policy/PayloadComparisonDialog.razor.rz.scp.css */
.mud-dialog .outline-none[b-o22ml5ge0o] {
height: 100%;
}
[b-o22ml5ge0o] .monaco-editor-container {
height: 100%;
}
/* /Pages/Policy/PolicyAddFromLibraryDialog.razor.rz.scp.css */
.mud-dialog .outline-none[b-rexh63a2hh] {
height: 100%;
}
[b-rexh63a2hh] .monaco-editor-container {
height: 100%;
}
/* /Pages/Policy/PolicyApplyTemplateToTenantDialog.razor.rz.scp.css */
.mud-dialog .outline-none[b-ct9z9jpi0p] {
height: 100%;
}
/* /Pages/Policy/PolicyComparisonDialog.razor.rz.scp.css */
.mud-dialog .outline-none[b-0k382zrguq] {
height: 100%;
}
[b-0k382zrguq] .monaco-editor-container {
height: 100%;
}
/* /Pages/Policy/PolicyManageTemplateDialog.razor.rz.scp.css */
.mud-dialog .outline-none[b-its7onhuph] {
height: 100%;
}
[b-its7onhuph] .monaco-editor-container {
height: 100%;
}
/* /Pages/Policy/PolicyTemplateEditComponent.razor.rz.scp.css */
.split[b-vb6kzkghx1] {
height: 100%;
width: 50%;
position: fixed;
z-index: 1;
top: 0;
overflow-x: hidden;
padding-top: 20px;
border: solid;
background: border-box;
border-style: groove;
border-width: thin;
box-shadow: rgba(0,0,0,0.2) 0px 0px 5px 0px;
}
.right[b-vb6kzkghx1] {
right: 0;
background-color: white;
}
/* /Pages/Policy/PolicyTemplateEditPage.razor.rz.scp.css */
.split[b-9qh9vpn7oo] {
height: 100%;
width: 50%;
position: fixed;
z-index: 1;
top: 0;
overflow-x: hidden;
padding-top: 20px;
border: solid;
background: border-box;
border-style: groove;
border-width: thin;
box-shadow: rgba(0,0,0,0.2) 0px 0px 5px 0px;
}
.right[b-9qh9vpn7oo] {
right: 0;
background-color: white;
}
/* /Pages/Policy/PolicyViewerEditorDialog.razor.rz.scp.css */
.mud-dialog .outline-none[b-45ur9j2b8z] {
height: 100%;
}
[b-45ur9j2b8z] .monaco-editor-container {
height: 100%;
}
/* /Pages/Policy/TenantPolicyVariableEditComponent.razor.rz.scp.css */
/* CSS Isolation */
[b-u8ig3sudvi] .mud-table-dense * .mud-table-row .mud-table-cell {
padding: 2px !important;
}
/* /Pages/Preview/Preview.razor.rz.scp.css */
/* CSS Isolation */
.Book[b-bqpfiwivvq] {
font-size: larger;
font-weight: bolder;
}
.Book1[b-bqpfiwivvq] {
/* background: red;*/
}
.Book2[b-bqpfiwivvq] {
/*background: orangered;*/
}
.Book3[b-bqpfiwivvq] {
/*background: orange;*/
}
.Book4[b-bqpfiwivvq] {
/*background: yellow;*/
}
.Book5[b-bqpfiwivvq] {
/*background: yellowgreen;*/
}
.Book6[b-bqpfiwivvq] {
/*background: green;*/
}
.Link[b-bqpfiwivvq],
a[b-bqpfiwivvq] {
margin: 10px;
padding: 5px;
border: 1px solid grey;
background: whitesmoke;
cursor: pointer;
box-shadow: 0 8px 10px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}
.Link:hover[b-bqpfiwivvq]{
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}
/* Remove default list styles (bullets and margins) */
.Vertical-Menu[b-bqpfiwivvq] {
list-style-type: none; /* Remove bullet points */
padding: 0; /* Remove default padding */
margin: 0; /* Remove default margin */
justify-content: center; /* Center the menu items horizontally */
z-index: 1111;
}
.Horizontal-Menu[b-bqpfiwivvq] {
list-style-type: none; /* Remove bullet points */
padding: 0; /* Remove default padding */
margin: 0; /* Remove default margin */
display: flex; /* Use flexbox to display items in a row */
justify-content: center; /* Center the menu items horizontally */
}
/* Style each list item */
.Horizontal-Menu li[b-bqpfiwivvq] {
margin-right: 20px; /* Space between menu items */
}
.Vertical-Menu li[b-bqpfiwivvq] {
margin-bottom: 5px;
}
/* Remove margin from the last item */
.Horizontal-Menu li:last-child[b-bqpfiwivvq] {
margin-right: 0;
}
/* Style links */
.Link[b-bqpfiwivvq],
.Vertical-Menu a[b-bqpfiwivvq],
.Horizontal-Menu a[b-bqpfiwivvq] {
text-decoration: none; /* Remove underline from links */
color: orange; /* Dark gray text color */
font-weight: bold; /* Make text bold */
padding: 10px 20px; /* Add some padding around the text */
display: block; /* Make the link fill the entire list item */
border-radius: 5px; /* Add rounded corners */
transition: background-color 0.3s; /* Smooth background transition on hover */
}
/* Add hover effect */
.Link:hover[b-bqpfiwivvq],
.Vertical-Menu a:hover[b-bqpfiwivvq],
.Horizontal-Menu a:hover[b-bqpfiwivvq] {
background-color: orange; /* Blue background on hover */
color: #333; /* White text on hover */
}
/* Optional: Add a border or highlight to the active menu item */
.Vertical-Menu a.active[b-bqpfiwivvq],
.Horizontal-Menu a.active[b-bqpfiwivvq] {
background-color: whitesmoke; /* Blue background for active link */
color: orange; /* text for active link */
}
/* Style for the floating link container */
.Floater[b-bqpfiwivvq] {
position: fixed; /* Fixed position relative to the viewport */
/*right: 20px;*/ /* 20px from the right edge of the screen */
/*bottom: 20px;*/ /* 20px from the bottom edge of the screen */
background-color: transparent; /* Background color of the link */
padding: 10px 15px; /* Add some padding around the link */
/* border-radius: 50px; /* Rounded corners for a pill shape */
/* box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2); /* Optional shadow effect */
z-index: 10000; /* Make sure the floating link appears above other content */
transition: background-color 0.3s ease; /* Smooth background color change */
}
.Floating-Trial[b-bqpfiwivvq] {
right: 20px;
top: 30px;
}
.Floating-Link[b-bqpfiwivvq] {
right: 20px;
bottom: 20px;
}
.Floating-Menu[b-bqpfiwivvq] {
left: 20px;
top: 250px;
text-align: center;
}
/* Style for the link itself */
.Floating-Trial a[b-bqpfiwivvq],
.Floating-Link a[b-bqpfiwivvq] {
color: orange; /* White text color */
text-decoration: none; /* Remove underline */
font-size: 16px; /* Set a reasonable font size */
font-weight: bold; /* Make the link bold */
display: block; /* Make the link fill the entire container */
text-align: center; /* Center the text inside the link */
}
/* Hover effect */
.Floating-Trial:hover[b-bqpfiwivvq],
.Floating-Link:hover[b-bqpfiwivvq] {
background-color: transparent; /* Darker blue on hover */
}
/* /Pages/Preview/SubscriptionMenuEdit.razor.rz.scp.css */
/* CSS Isolation */
.GroupRow[b-uwss5vpq2y] {
background: grey !important;
}
th .GroupRowButtons[b-uwss5vpq2y] {
text-align: end !important;
}
/* /Pages/Room/RoomList.razor.rz.scp.css */
/* CSS isolation for the Rooms list page. Styling is handled by MudBlazor utility classes. */
/* /Pages/ScheduledTasks/ScheduledTaskList.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/ScheduledTasks/ScheduledTaskListRoot.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Search/DocumentSearch.razor.rz.scp.css */
/* EcpBot answer card — typography for the MudMarkdown-rendered content.
::deep is required because MudMarkdown emits its own (non-scoped) elements. */
.ecpbot-answer[b-k5qz6q133g] h1,
.ecpbot-answer[b-k5qz6q133g] h2,
.ecpbot-answer[b-k5qz6q133g] h3,
.ecpbot-answer[b-k5qz6q133g] h4 {
margin-top: 1.1rem;
margin-bottom: 0.4rem;
font-weight: 600;
line-height: 1.3;
}
.ecpbot-answer[b-k5qz6q133g] h1 { font-size: 1.4rem; }
.ecpbot-answer[b-k5qz6q133g] h2 { font-size: 1.25rem; }
.ecpbot-answer[b-k5qz6q133g] h3 { font-size: 1.1rem; }
.ecpbot-answer[b-k5qz6q133g] h4 { font-size: 1rem; }
.ecpbot-answer[b-k5qz6q133g] p {
margin: 0.5rem 0;
line-height: 1.6;
}
.ecpbot-answer[b-k5qz6q133g] ul,
.ecpbot-answer[b-k5qz6q133g] ol {
margin: 0.5rem 0;
padding-left: 1.6rem;
}
.ecpbot-answer[b-k5qz6q133g] li {
margin: 0.25rem 0;
line-height: 1.6;
}
.ecpbot-answer[b-k5qz6q133g] li > p {
margin: 0.15rem 0;
}
.ecpbot-answer[b-k5qz6q133g] code {
background-color: rgba(0, 0, 0, 0.06);
padding: 0.1rem 0.35rem;
border-radius: 3px;
font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
font-size: 0.9em;
}
.ecpbot-answer[b-k5qz6q133g] pre {
background-color: rgba(0, 0, 0, 0.06);
padding: 0.75rem 1rem;
border-radius: 6px;
overflow-x: auto;
margin: 0.75rem 0;
}
.ecpbot-answer[b-k5qz6q133g] pre code {
background: transparent;
padding: 0;
font-size: 0.9rem;
}
.ecpbot-answer[b-k5qz6q133g] blockquote {
border-left: 3px solid var(--mud-palette-secondary);
margin: 0.75rem 0;
padding: 0.25rem 1rem;
color: var(--mud-palette-text-secondary);
}
.ecpbot-answer[b-k5qz6q133g] table {
border-collapse: collapse;
margin: 0.75rem 0;
width: 100%;
}
.ecpbot-answer[b-k5qz6q133g] th,
.ecpbot-answer[b-k5qz6q133g] td {
border: 1px solid var(--mud-palette-lines-default);
padding: 0.4rem 0.7rem;
text-align: left;
}
.ecpbot-answer[b-k5qz6q133g] th {
background-color: rgba(0, 0, 0, 0.04);
font-weight: 600;
}
.ecpbot-answer[b-k5qz6q133g] a {
color: var(--mud-palette-secondary);
text-decoration: none;
}
.ecpbot-answer[b-k5qz6q133g] a:hover {
text-decoration: underline;
}
.ecpbot-answer[b-k5qz6q133g] hr {
border: none;
border-top: 1px solid var(--mud-palette-lines-default);
margin: 1rem 0;
}
/* Tighten the very first/last element so the card padding does the work. */
.ecpbot-answer[b-k5qz6q133g] > :first-child {
margin-top: 0;
}
.ecpbot-answer[b-k5qz6q133g] > :last-child {
margin-bottom: 0;
}
/* /Pages/ServiceDesk/ServiceDeskTrackingReport.razor.rz.scp.css */
/* Ensure MudDataGrid child row content uses full width */
[b-v39ee7agli] .mud-table-child-content {
width: 100%;
}
/* /Pages/ServiceDesk/TicketActionTriage.razor.rz.scp.css */
/* CSS Isolation */
/*
DEV note: MudBlazor does NOT play well with css-isolation
Use div or span wrappers
*/
/* /Pages/Settings/FallbackHtmlPreviewDialog.razor.rz.scp.css */
/* Make the preview area large so the fallback HTML has room to show. */
.fallback-html-preview[b-lp5m52yl21] {
min-height: 70vh;
overflow: auto;
}
/* /Pages/Settings/PageTenantPermissions.razor.rz.scp.css */
/* CSS Isolation */
/* The left panel is natural height (the reference). The middle and right
panels stretch to match it via the grid's default align-items:stretch.
Their MudPaper carries inline "position:relative; overflow:hidden" (inline
so it survives CSS-isolation scoping on the component root). The content
below sits in an absolutely-positioned overlay so a long list can never
push the row taller than the left panel — it scrolls internally instead.
This keeps all three panels exactly equal height. */
.panel-body[b-w0jweevoiz] {
position: absolute;
inset: 0;
padding: 16px;
display: flex;
flex-direction: column;
overflow: hidden;
}
/* The panel height (calc(100vh - 300px)) lives INLINE on each MudPaper's Style attribute, NOT
here. MudBlazor renders its own root element, which CSS-isolation does NOT stamp with this
component's scope attribute, so an isolated class like `.left-panel` never matches a MudPaper
root — only inline Style (immune to scoping) reliably reaches it. A fixed height (not
max-height) keeps the panel full-height even with only a few rows; the internal lists scroll,
so it never clips. The middle/right panels carry the same inline height. */
/* Make the tab body fill the panel below the search so the list grows to the
panel's full height (no bottom gap) and scrolls internally. The legend is a
sibling after the tabs, so it stays pinned and visible. */
.left-panel[b-w0jweevoiz] .mud-tabs {
flex: 1 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
}
.left-panel[b-w0jweevoiz] .mud-tabs-panels {
flex: 1 1 auto;
min-height: 0;
overflow: hidden;
display: flex;
flex-direction: column;
}
.left-panel[b-w0jweevoiz] .mud-tab-panel {
flex: 1 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
}
.page-tree[b-w0jweevoiz] {
flex: 1 1 auto;
min-height: 0;
max-height: calc(100vh - 440px);
overflow-y: auto;
}
.legend-dot[b-w0jweevoiz] {
font-size: 0.9rem;
line-height: 1;
margin-right: -0.5rem;
}
.legend-gated[b-w0jweevoiz] {
color: var(--mud-palette-error);
}
.legend-contains[b-w0jweevoiz] {
color: #9c27b0;
}
/* Gated-pages quick list (Gated tab). Same scroll box as the tree so switching
tabs keeps the left panel a stable height. */
.gated-list[b-w0jweevoiz] {
display: flex;
flex-direction: column;
flex: 1 1 auto;
min-height: 0;
max-height: calc(100vh - 440px);
overflow-y: auto;
}
.gated-item[b-w0jweevoiz] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.25rem 0.5rem;
border-radius: var(--mud-default-borderradius);
cursor: pointer;
color: var(--mud-palette-text-primary);
}
.gated-item:hover[b-w0jweevoiz] {
background-color: var(--mud-palette-action-default-hover);
}
.gated-item.selected[b-w0jweevoiz] {
background-color: var(--mud-palette-primary-hover);
}
.gated-item-icon[b-w0jweevoiz] {
flex: 0 0 auto;
}
.gated-item-text[b-w0jweevoiz] {
flex: 1 1 auto;
font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
font-size: 0.8rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.gated-item-count[b-w0jweevoiz] {
flex: 0 0 auto;
font-size: 0.75rem;
opacity: 0.8;
}
/* Permission rows (required + available) */
.perm-list[b-w0jweevoiz] {
display: flex;
flex-direction: column;
border: 1px solid var(--mud-palette-lines-default);
border-radius: var(--mud-default-borderradius);
overflow: hidden;
/* This list is a direct flex child of the column-flex .panel-body. Because it has
overflow:hidden, its automatic flex min-size is 0 (per the flex spec), so when the
panel content is taller than the panel the flex algorithm would otherwise squeeze it
to zero height and clip the row entirely. Pin it so it always keeps its content height
(the available-perms list scrolls inside .perm-scroll, so this never starves that). */
flex: 0 0 auto;
}
.perm-row[b-w0jweevoiz] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.25rem 0.25rem 0.25rem 0.75rem;
border-bottom: 1px solid var(--mud-palette-lines-default);
}
.perm-row:last-child[b-w0jweevoiz] {
border-bottom: none;
}
.perm-row:hover[b-w0jweevoiz] {
background-color: var(--mud-palette-action-default-hover);
}
.perm-row-icon[b-w0jweevoiz] {
flex: 0 0 auto;
color: var(--mud-palette-text-secondary);
}
.perm-value[b-w0jweevoiz] {
flex: 1 1 auto;
font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
font-size: 0.85rem;
}
/* Middle-panel chrome above the available-permissions list (route header, impact, required
permissions, add-permission heading + search) — pinned at the top at its natural height so
nothing between the header and the list can grow/push it down, exactly like the right panel's
.fallback-chrome. The available list (.perm-scroll) is the single grower below it. */
.perm-chrome[b-w0jweevoiz] {
flex: 0 0 auto;
}
/* Available-permissions area fills the remaining panel height and scrolls. */
.perm-scroll[b-w0jweevoiz] {
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
}
/* Fallback HTML editor fills the remaining panel height.
A plain textarea (not MudTextField) is used here deliberately: it is a
scoped element we fully control, so it fills reliably without depending on
MudBlazor's internal input DOM via ::deep (which would not bind reliably). */
.fallback-html[b-w0jweevoiz] {
flex: 20 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
}
/* Chrome above the fallback body (heading, hint, component dropdown) — fixed height
at the top so nothing between the dropdown and the example can grow/push it down. */
.fallback-chrome[b-w0jweevoiz] {
flex: 0 0 auto;
}
/* Live example of the selected fallback component. Fills the space directly under
the dropdown (the component renders at the top of this box), scrolls if tall. */
.fallback-preview[b-w0jweevoiz] {
flex: 1 1 auto;
min-height: 0;
overflow: auto;
border: 1px solid var(--mud-palette-lines-default);
border-radius: var(--mud-default-borderradius);
padding: 12px;
}
/* The example component (PermissionUpgradeFallback) uses a top margin meant for the
real full-page fallback; pull it tight under the dropdown in this preview context. */
.fallback-preview[b-w0jweevoiz] .mud-container {
margin-top: 0 !important;
}
.fallback-textarea[b-w0jweevoiz] {
flex: 1 1 auto;
min-height: 0;
width: 100%;
resize: none;
border: 1px solid var(--mud-palette-lines-inputs);
border-radius: var(--mud-default-borderradius);
padding: 12px;
font-family: inherit;
font-size: 0.875rem;
line-height: 1.4;
background: transparent;
color: var(--mud-palette-text-primary);
}
.fallback-textarea:focus[b-w0jweevoiz] {
outline: none;
border-color: var(--mud-palette-primary);
border-width: 2px;
padding: 11px;
}
/* /Pages/Subscription/SubscriptionTenantEdit/ScheduledItems.razor.rz.scp.css */
.TopHeaderRow th[b-6sz66cnk2s] {
border-bottom: 0 !important;
font-weight: bold;
}
/* /Pages/Subscription/SubscriptionTenantEdit/SubscriptionTenantEdit.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/SupportUser/BulkSupportUserCreate.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/TaskType/TaskTypeList.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Templates/TemplateComponentBlank.razor.rz.scp.css */
/* CSS Isolation */
/*
DEV note: MudBlazor does NOT play well with css-isolation
Use div or span wrappers
*/
/* /Pages/Templates/TemplatePageBlank.razor.rz.scp.css */
/* CSS Isolation */
/*
DEV note: MudBlazor does NOT play well with css-isolation
Use div or span wrappers
*/
/* /Pages/Tenant/Add/CustomerAcknowledgementDialog.razor.rz.scp.css */
.MarkDownContainer[b-375h3s3ghh] {
border: grey solid 2px;
border-radius: 15px;
padding: 5px;
margin-top: 5px;
margin-bottom: 5px;
}
.HtmlContainer[b-375h3s3ghh] {
border: grey solid 2px;
border-radius: 15px;
padding: 5px;
margin-top: 5px;
margin-bottom: 5px;
}
.HR[b-375h3s3ghh] {
min-width: 90vw;
}
/* /Pages/Tenant/Bulk/BulkUnmanagedTenantOnboard.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/Tenant/Components/OnboardingDiagnosticsDialog.razor.rz.scp.css */
.onboarding-diagnostics-detail[b-iw6lyllwei] {
white-space: pre-wrap;
word-break: break-word;
font-size: 0.75rem;
background: var(--mud-palette-background-grey);
padding: 6px 8px;
border-radius: 4px;
margin: 4px 0 0 0;
}
/* /Pages/Tenant/NamedLocations/NamedLocations.razor.rz.scp.css */
:host[b-y67hqg9uzw] {
/* CSS Isolation: placeholder to satisfy linter; styles TBD */
}
/* /Pages/Tenant/NamedLocations/NamedLocationsEditDialog.razor.rz.scp.css */
.MarkDownContainer[b-b1wptj3zu7] {
border: grey solid 2px;
border-radius: 15px;
padding: 5px;
margin-top: 5px;
margin-bottom: 5px;
}
.HtmlContainer[b-b1wptj3zu7] {
border: grey solid 2px;
border-radius: 15px;
padding: 5px;
margin-top: 5px;
margin-bottom: 5px;
}
.HR[b-b1wptj3zu7] {
min-width: 90vw;
}
.Progress[b-b1wptj3zu7] {
display: flex;
align-items: center;
justify-content: center;
height: 70vh;
}
/* /Pages/Tenant/TenantSubscribeBillingOnlyV2.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/TestHarness/AdaptiveCards/AdaptiveCardsTestHarness.razor.rz.scp.css */
/* Adaptive Cards Test Harness Styles */
.preview-container[b-e8qm1g1l75] {
min-height: 200px;
padding: 16px;
border-radius: 8px;
background-color: #f8f9fa;
position: relative;
}
.preview-teams[b-e8qm1g1l75] {
background-color: #f3f2f1;
border: 1px solid #e1dfdd;
}
.preview-outlook[b-e8qm1g1l75] {
background-color: #faf9f8;
border: 1px solid #edebe9;
}
.preview-copilot[b-e8qm1g1l75] {
background-color: #f5f4f7;
border: 1px solid #e5e3e8;
}
.preview-default[b-e8qm1g1l75] {
background-color: #ffffff;
border: 1px solid #e0e0e0;
}
.card-preview-content[b-e8qm1g1l75] {
min-height: 150px;
display: flex;
align-items: flex-start;
justify-content: center;
flex-direction: column;
}
.editor-container[b-e8qm1g1l75] {
width: 100%;
height: 100%;
}
/* Custom scrollbar for code editors */
.editor-container [b-e8qm1g1l75]::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.editor-container [b-e8qm1g1l75]::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 4px;
}
.editor-container [b-e8qm1g1l75]::-webkit-scrollbar-thumb {
background: #c1c1c1;
border-radius: 4px;
}
.editor-container [b-e8qm1g1l75]::-webkit-scrollbar-thumb:hover {
background: #a8a8a8;
}
/* Adaptive Card Preview Styling */
#adaptive-card-preview .ac-container[b-e8qm1g1l75] {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-size: 14px;
line-height: 1.4;
}
/* Teams-specific styling */
.preview-teams #adaptive-card-preview[b-e8qm1g1l75] {
color: #252423;
}
.preview-teams #adaptive-card-preview .ac-container[b-e8qm1g1l75] {
background: white;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
padding: 16px;
}
/* Outlook-specific styling */
.preview-outlook #adaptive-card-preview[b-e8qm1g1l75] {
color: #323130;
}
.preview-outlook #adaptive-card-preview .ac-container[b-e8qm1g1l75] {
background: white;
border: 1px solid #edebe9;
border-radius: 4px;
padding: 16px;
}
/* CoPilot-specific styling */
.preview-copilot #adaptive-card-preview[b-e8qm1g1l75] {
color: #201f1e;
}
.preview-copilot #adaptive-card-preview .ac-container[b-e8qm1g1l75] {
background: white;
border: 1px solid #e1dfdd;
border-radius: 6px;
padding: 12px;
}
/* Error state styling */
.card-preview-error[b-e8qm1g1l75] {
background-color: #fef2f2;
border: 1px solid #fecaca;
color: #dc2626;
padding: 16px;
border-radius: 8px;
text-align: center;
}
/* Loading state */
.card-preview-loading[b-e8qm1g1l75] {
display: flex;
align-items: center;
justify-content: center;
min-height: 150px;
}
/* Header row alignment */
.header-actions[b-e8qm1g1l75] {
display: flex;
gap: 8px;
align-items: center;
}
/* Responsive adjustments */
@media (max-width: 1200px) {
.preview-container[b-e8qm1g1l75] {
margin-top: 16px;
}
}
@media (max-width: 768px) {
.editor-container[b-e8qm1g1l75] {
height: 300px;
}
.preview-container[b-e8qm1g1l75] {
margin-top: 16px;
padding: 12px;
}
}
/* Code block styling for JSON display */
.mud-code[b-e8qm1g1l75] {
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
font-size: 12px;
line-height: 1.4;
}
/* Expansion panel customization */
.mud-expand-panel .mud-expand-panel-header[b-e8qm1g1l75] {
padding: 12px 16px;
}
.mud-expand-panel .mud-expand-panel-content[b-e8qm1g1l75] {
padding: 0 16px 16px 16px;
}
/* /Pages/TestHarness/ContactSync/ContactSyncTestHarness.razor.rz.scp.css */
body[b-qd9i1aobw2] {
}
/* /Pages/TestHarness/EcpPickerTests/EcpPickerTests.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/User/Components/UserListHeader.razor.rz.scp.css */
/* One uniform control height across the header action row so the outlined text buttons,
borderless icon buttons and the Add User menu button all align on the same baseline.
MudBlazor gives each control type its own natural height, which no utility class fixes. */
[b-5sm5krqt4s] .mud-button-root {
height: 36px;
}
/* Icon buttons: fixed square, with the icon (or busy spinner) dead-centre. The label span
and the svg itself must also be flexed/blocked — an inline svg sits on the text baseline,
which reads as the icon hanging a few pixels off-centre. */
[b-5sm5krqt4s] .mud-icon-button {
width: 36px;
padding: 0;
display: inline-flex;
align-items: center;
justify-content: center;
}
[b-5sm5krqt4s] .mud-icon-button .mud-icon-button-label {
display: flex;
align-items: center;
justify-content: center;
}
[b-5sm5krqt4s] .mud-icon-button .mud-icon-root {
display: block;
}
/* /Pages/User/Security/UserIdentityVerification.razor.rz.scp.css */
.Verify button[b-ot2m3fcx11] {
min-width: 240px;
}
/* /Pages/User/Security/UserSecurityDialog.razor.rz.scp.css */
@keyframes fadeOut-b-6d7cfrz0sv {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
[b-6d7cfrz0sv] .fade-alert {
animation: fadeOut-b-6d7cfrz0sv 0.5s ease-in-out 2.5s forwards;
}
[b-6d7cfrz0sv] .user-security-dialog-content {
height: 600px;
}
/* /Pages/User/UserLicenseAssignedList.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/User/UserVerificationDetailsDialog.razor.rz.scp.css */
/* CSS Isolation */
/* Component-specific styles here */
/* /Pages/UserActionItem/ActionItemEventConfiguration.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/UserCalendarPermissions/UserCalendarPermissionsEdit.razor.rz.scp.css */
.strikethrough[b-c3lhe3olg2] {
text-decoration-line: line-through;
text-decoration-color: #ff0258cc;
}
/* /Pages/UserMail/Edit/ExchangeSettings.razor.rz.scp.css */
/* CSS Isolation */
/* /Pages/UserMail/Edit/SearchForwardingAddressDialog.razor.rz.scp.css */
.EmailList[b-cvbmrzh56w] {
overflow-y: auto;
overflow-x: hidden;
border-bottom: solid lightgrey 1px;
margin-bottom: 4px;
height: 75vh;
}
.EmailItem[b-cvbmrzh56w] {
border: solid lightgrey 1px;
cursor: pointer;
margin: 4px;
padding: 8px;
-moz-box-shadow: 1px 2px 1px lightgrey;
-webkit-box-shadow: 1px 2px 1px lightgrey;
box-shadow: 1px 2px 1px lightgrey;
}
.EmailItem:hover[b-cvbmrzh56w] {
background: rgb(235, 231, 231)!important;
}
.Selected[b-cvbmrzh56w] {
background: rgb(199, 244, 199) !important;
}
/* /Pages/UserMail/UserMailTrust.razor.rz.scp.css */
.GridWidthMax[b-zocj0gxs12] {
width: 1200px;
max-width: 1200px;
}
/* /Pages/Version/VersionList.razor.rz.scp.css */
.access-chip[b-o6dnt4x07k] {
min-width: 80px;
}
[b-o6dnt4x07k] .delete-menu-item {
color: var(--mud-palette-error);
}
/* /Pages/Workflow/Bulk/BulkWorkflowAdd.razor.rz.scp.css */
/* Layout (sidebar/content/footer/scroll) is owned by the shared EcpWizard shell — only
page-specific styling lives here. All rules are ::deep because they style Mud
components; the scope attribute lives on the page's .bulk-wizard-host wrapper div
(see BulkWorkflowAdd.razor). */
/* "Chosen so far" chip strip. The min-height that reserves the row before the first
selection lives INLINE in the markup (a cached styles bundle must not be able to
collapse it); flex-none keeps the strip out of the grid steps' flex growth, and
nowrap holds it to one line (the view model counts rather than listing). */
[b-e8d20ul1zw] .selection-chips {
display: flex;
flex: 0 0 auto;
flex-wrap: nowrap;
align-items: center;
gap: 6px;
overflow: hidden;
}
/* A single long name (a group or license titled in full) shortens with an ellipsis rather
than wrapping the strip onto a second row. */
[b-e8d20ul1zw] .selection-chips .EcpChip {
min-width: 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
/* Grid steps: the grid takes the space left under the step heading and scrolls its ROWS
only, so the toolbar, column headers and the Back/Next footer never move. Relies on
the shell's .wizard-content being a flex column with overflow hidden. */
[b-e8d20ul1zw] .wizard-grid {
flex: 1 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
}
[b-e8d20ul1zw] .wizard-grid .mud-table-container {
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
}
/* Schedule step: a date and a time are short values — sized to their content instead of
stretching to fill the pane (MudStack rows stretch children by default). */
[b-e8d20ul1zw] .schedule-date {
flex: 0 0 auto;
width: 200px;
}
[b-e8d20ul1zw] .schedule-time {
flex: 0 0 auto;
width: 140px;
}
[b-e8d20ul1zw] .attr-field {
flex-grow: 1;
border-radius: 4px;
padding: 0 6px;
}
/* Attribute will be SET on every selected user */
[b-e8d20ul1zw] .attr-changed {
background: var(--mud-palette-primary-hover);
}
/* Attribute will be CLEARED on every selected user */
[b-e8d20ul1zw] .attr-clear {
background: var(--mud-palette-error-hover);
}
/* Single-select manager list: the picked row keeps the primary tint (MudDataGrid has no
single-selection highlight of its own). */
[b-e8d20ul1zw] .manager-row--selected > td {
background-color: var(--mud-palette-primary-hover);
}
/* Operation cards: hover = neutral tint + primary border; selected = primary tint so the
two states read differently at a glance. */
[b-e8d20ul1zw] .op-card {
border: 2px solid var(--mud-palette-lines-default);
transition: border-color 0.15s ease, background-color 0.15s ease;
}
[b-e8d20ul1zw] .op-card:hover {
border-color: var(--mud-palette-primary);
background-color: var(--mud-palette-action-default-hover);
}
[b-e8d20ul1zw] .op-card--selected {
border-color: var(--mud-palette-primary);
background-color: var(--mud-palette-primary-hover);
}
[b-e8d20ul1zw] .op-card--selected:hover {
background-color: var(--mud-palette-primary-hover);
}
/* The "not available for this tenant" section: visibly present but completely inert —
pointer-events none also suppresses the shared .op-card hover styling. */
[b-e8d20ul1zw] .op-card--disabled {
opacity: 0.55;
pointer-events: none;
}
/* Off-board template step panels: what the selected template will run, beside the
picker, with the per-step option editors. Takes the width and height left in the pane
(a flex column on this step, like the grid steps) and scrolls internally so the
footer never moves. */
[b-e8d20ul1zw] .template-preview {
border: 1px solid var(--mud-palette-lines-default);
border-radius: 4px;
flex: 1 1 auto;
min-width: 320px;
min-height: 0;
overflow-y: auto;
}
/* /Pages/Workflow/Bulk/BulkWorkflowDetail.razor.rz.scp.css */
/*
A run and its detail are one thing to the operator, so the separator moves off the run's
own cells and onto the child cell — one line under the pair instead of a line between them.
MudDataGrid emits the ChildRowContent cell for EVERY row when there is no HierarchyColumn,
so a clean run still gets an empty | . With no padding it collapses to nothing and its
border lands directly under the run, exactly where the run's own border used to be.
*/
.runs-grid[b-vfw3jqcjg6] .mud-table-body .mud-table-row > td.mud-table-cell:not(.mud-table-child-content) {
border-bottom: none;
}
.runs-grid[b-vfw3jqcjg6] .mud-table-body .mud-table-row > td.mud-table-child-content {
padding: 0;
border-bottom: 1px solid var(--mud-palette-table-lines);
}
/* Indented from the User column so the detail reads as part of the row above it. */
.runs-grid[b-vfw3jqcjg6] .run-issues {
margin: 0 16px 8px 40px;
}
/* Separates one run's block from the next in the Results roll-up. */
.issue-run[b-vfw3jqcjg6] {
margin-bottom: 12px;
}
/*
Striping is on by default and MudBlazor bands on tr:nth-of-type(odd). Every run now owns
two rows (itself plus its detail row), so the plain rule lands every run on an odd index
and shades them all identically. Re-band on a four-row cycle instead, so a run and its
detail share one stripe and the zebra survives. The selectors mirror MudBlazor's own chain
because its rule is highly specific and would otherwise win.
*/
.runs-grid[b-vfw3jqcjg6] .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd) {
background-color: transparent;
}
.runs-grid[b-vfw3jqcjg6] .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(4n+1),
.runs-grid[b-vfw3jqcjg6] .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(4n+2) {
background-color: var(--mud-palette-table-striped);
}
/*
Hover the pair, not the halves. MudBlazor highlights the hovered | only, so a run and
its detail lit up separately; these three selectors are "the row itself", "the detail of
the hovered run", and "the run of the hovered detail" (the last two identify the detail
row by its child-content cell, since MudBlazor gives it no distinguishing class).
The selectors carry the full MudBlazor chain plus the table element so they outrank both
MudBlazor's own hover rule and the re-banded striping above.
*/
@media (hover: hover) and (pointer: fine) {
.runs-grid[b-vfw3jqcjg6] .mud-table-hover.mud-table-striped .mud-table-container table.mud-table-root .mud-table-body .mud-table-row:hover,
.runs-grid[b-vfw3jqcjg6] .mud-table-hover.mud-table-striped .mud-table-container table.mud-table-root .mud-table-body .mud-table-row:hover + .mud-table-row:has(> td.mud-table-child-content),
.runs-grid[b-vfw3jqcjg6] .mud-table-hover.mud-table-striped .mud-table-container table.mud-table-root .mud-table-body .mud-table-row:has(+ .mud-table-row:hover > td.mud-table-child-content) {
background-color: var(--mud-palette-table-hover);
}
}
/* /Pages/Workflow/OffBoard.razor.rz.scp.css */
/* CSS Isolation */
.CheckCol[b-9vsz8mjiwh] {
padding: 5px;
}
/*.mud-input-control-input-container p {
width: 150px;
}*/
.CheckCol2 .mud-input-control-boolean-input label > p[b-9vsz8mjiwh] {
width: 176px !important;
}
/* /Pages/Workflow/Onboarding/WorkflowOnboardingWizard.razor.rz.scp.css */
/* Layout (sidebar/content/footer/scroll) is owned by the shared EcpWizard shell —
only page-specific styling lives here. ::deep because the rule targets a Mud
component; the scope attribute sits on the EcpWizard's .wizard-root ancestor via
this page's own elements inside it. */
/* The "already in this MSP" section: visibly present but completely inert. */
[b-khw1jb1uoc] .template-table--disabled {
opacity: 0.55;
pointer-events: none;
}
/* /Shared/AdHocFrameworkMedallions.razor.rz.scp.css */
.adhoc-framework-medallion[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(241, 245, 249, 0.98) 100%);
--medallion-border: rgba(71, 85, 105, 0.28);
--medallion-text: #1e293b;
--medallion-seal-background: #334155;
--medallion-seal-text: #ffffff;
align-items: center;
background: var(--medallion-background);
border: 1px solid var(--medallion-border);
border-radius: 999px;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.75),
0 1px 2px rgba(15, 23, 42, 0.1);
color: var(--medallion-text);
display: inline-flex;
font-size: 0.72rem;
font-weight: 700;
gap: 0.4rem;
letter-spacing: 0.01em;
line-height: 1;
max-width: 100%;
min-height: 1.9rem;
padding: 0.18rem 0.65rem 0.18rem 0.22rem;
}
.adhoc-framework-medallion__seal[b-09sm5056rp] {
align-items: center;
background: var(--medallion-seal-background);
border: 1px solid rgba(255, 255, 255, 0.45);
border-radius: 999px;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
color: var(--medallion-seal-text);
display: inline-flex;
font-size: 0.63rem;
font-weight: 800;
height: 1.35rem;
justify-content: center;
min-width: 1.35rem;
padding: 0 0.2rem;
text-transform: uppercase;
}
.adhoc-framework-medallion__label[b-09sm5056rp] {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.adhoc-framework-medallion--cis[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #eef5ff 0%, #dcecff 100%);
--medallion-border: rgba(18, 82, 163, 0.35);
--medallion-text: #0f3f7f;
--medallion-seal-background: #1252a3;
}
.adhoc-framework-medallion--cisa[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #eff7ff 0%, #dbeafe 100%);
--medallion-border: rgba(0, 94, 162, 0.35);
--medallion-text: #0b4f86;
--medallion-seal-background: #005ea2;
}
.adhoc-framework-medallion--essential-eight[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #f7fbef 0%, #e7f4d7 100%);
--medallion-border: rgba(74, 124, 24, 0.32);
--medallion-text: #35591a;
--medallion-seal-background: #6a8b1f;
}
.adhoc-framework-medallion--lighthouse[b-09sm5056rp],
.adhoc-framework-medallion--ms-baseline[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #eef6ff 0%, #dcecff 100%);
--medallion-border: rgba(0, 120, 212, 0.32);
--medallion-text: #005ea6;
--medallion-seal-background: #0078d4;
}
.adhoc-framework-medallion--nist[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #f4f4fb 0%, #e5e7f5 100%);
--medallion-border: rgba(67, 56, 202, 0.28);
--medallion-text: #3730a3;
--medallion-seal-background: #4f46e5;
}
.adhoc-framework-medallion--iso27001[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #eef5ff 0%, #dbeafe 100%);
--medallion-border: rgba(37, 99, 235, 0.3);
--medallion-text: #1d4ed8;
--medallion-seal-background: #2563eb;
}
.adhoc-framework-medallion--soc2[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%);
--medallion-border: rgba(51, 65, 85, 0.32);
--medallion-text: #1f2937;
--medallion-seal-background: #334155;
}
.adhoc-framework-medallion--best-practice[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #f4fbf2 0%, #dcfce7 100%);
--medallion-border: rgba(22, 101, 52, 0.25);
--medallion-text: #166534;
--medallion-seal-background: #15803d;
}
.adhoc-framework-medallion--smb-bronze[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #f9efe9 0%, #edd4c5 100%);
--medallion-border: rgba(146, 64, 14, 0.26);
--medallion-text: #9a3412;
--medallion-seal-background: #b45309;
}
.adhoc-framework-medallion--smb-silver[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #f8fafc 0%, #e5e7eb 100%);
--medallion-border: rgba(100, 116, 139, 0.28);
--medallion-text: #475569;
--medallion-seal-background: #64748b;
}
.adhoc-framework-medallion--smb-gold[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #fff8db 0%, #fde68a 100%);
--medallion-border: rgba(180, 83, 9, 0.28);
--medallion-text: #92400e;
--medallion-seal-background: #ca8a04;
}
.adhoc-framework-medallion--smb-diamond[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #eef8ff 0%, #dbeafe 100%);
--medallion-border: rgba(14, 116, 144, 0.28);
--medallion-text: #155e75;
--medallion-seal-background: #0891b2;
}
.adhoc-framework-medallion--default[b-09sm5056rp] {
--medallion-background: linear-gradient(180deg, #f8fafc 0%, #edf2f7 100%);
--medallion-border: rgba(71, 85, 105, 0.25);
--medallion-text: #334155;
--medallion-seal-background: #475569;
}
/* Overflow "+N" indicator for truncated framework lists */
.adhoc-framework-medallion--overflow[b-09sm5056rp] {
--medallion-background: #ffffff;
--medallion-border: rgba(36, 115, 190, 0.4);
--medallion-text: #2473be;
border-style: dashed;
cursor: pointer;
padding: 0.18rem 0.55rem;
}
/* /Shared/Azure/AzurePermissionsUrlGenerator.razor.rz.scp.css */
fieldset.UrlContainer[b-fawsqc0myc] {
border: 1px solid lightgrey !important;
margin: 4px !important;
padding: 16px !important;
border-radius: 5px;
}
.UrlContainer legend[b-fawsqc0myc] {
padding-left: 4px;
padding-right: 4px;
}
/* /Shared/BreadcrumbMenuContents.razor.rz.scp.css */
/* Stack the level vertically. A flex column forces every child onto its own row so the popout
reads as a menu list.
Every match renders (issue #6577) so the level scrolls once it outgrows the viewport instead of
truncating; the max-height keeps the popover's own bounds on-screen. */
.breadcrumb-menu-contents[b-x248upgjci] {
display: flex;
flex-direction: column;
min-width: 220px;
max-height: 60vh;
overflow-y: auto;
overflow-x: hidden;
}
/* Flex children default to flex-shrink:1 - with the level's height now capped for scrolling, the
browser crams every row into the max-height (overlapping micro-text) instead of letting the
content overflow into the scrollbar. Pin every row type (filter, section headers, leaf items,
nested-menu roots) to its natural height so overflow actually scrolls. */
.breadcrumb-menu-contents .breadcrumb-menu-filter[b-x248upgjci],
.breadcrumb-menu-contents .breadcrumb-menu-section[b-x248upgjci],
.breadcrumb-menu-contents[b-x248upgjci] .mud-menu-item,
.breadcrumb-menu-contents[b-x248upgjci] .mud-menu {
flex-shrink: 0;
}
/* Container rows render as a nested MudMenu; its root is inline-width by default, which centres the
activator and makes the text shift on hover. Stretch the menu and its activator to full width so a
container row sits and left-aligns exactly like a leaf MudMenuItem. */
.breadcrumb-menu-contents[b-x248upgjci] .mud-menu {
width: 100%;
}
.breadcrumb-menu-contents[b-x248upgjci] .mud-menu > .mud-menu-activator {
width: 100%;
}
/* The clickable cascade row (tenant group / customer that has children). MudBlazor wraps our
ActivatorContent in its OWN .mud-menu-item (the .mud-menu-sub-menu-activator), which already
supplies the same 8px/12px inset as the plain MudMenuItem leaf rows. So this anchor must add
NO padding of its own - any padding here stacks on top of the wrapper and pushes the label
deeper than the leaf rows (the exact indent bug Ryan reported). Zero padding => the label lines
up pixel-for-pixel with the childless-group and tenant rows. Full width + space-between pins the
"has children" chevron to the right edge without shifting the label. */
.breadcrumb-menu-contents[b-x248upgjci] a.breadcrumb-popout-activator {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
width: 100%;
padding: 0;
color: inherit;
text-decoration: none;
/* The anchor has no href (navigation resolves through the nav menu on click), so the browser
no longer supplies the link cursor. */
cursor: pointer;
}
/* Right-aligned "expand" affordance on cascade rows - the standard nested-menu chevron, muted so it
reads as an affordance rather than content. flex-shrink:0 keeps it pinned to the right edge. */
.breadcrumb-menu-contents[b-x248upgjci] .breadcrumb-popout-chevron {
flex-shrink: 0;
color: var(--mud-palette-text-secondary);
}
/* Section header carrying the type chip (TG / T / C). */
.breadcrumb-menu-section[b-x248upgjci] {
padding: 4px 12px 2px 12px;
}
/* Indent every row's label (leaf tenants AND cascade group activators, which both render inside a
.mud-menu-item) deeper than the 12px section headers, so the list reads as items nested under a
heading. Left only - keeps the 12px right inset for the chevron. */
.breadcrumb-menu-contents[b-x248upgjci] .mud-menu-item {
padding-left: 24px;
}
/* Filter input row, shown when a level exceeds the configured maximum. Sticky so it stays reachable
while the (now scrollable) level is scrolled; the surface background stops rows showing through. */
.breadcrumb-menu-filter[b-x248upgjci] {
position: sticky;
top: 0;
z-index: 1;
padding: 4px 8px;
min-width: 220px;
background: var(--mud-palette-surface);
}
/* /Shared/Breadcrumbs.razor.rz.scp.css */
.ecp-breadcrumbs[b-e8btne5whu] {
display: contents;
}
/* Replicate MudBlazor's default breadcrumb link layout for the anchor nested
inside the hover menu activator (the stock .mud-breadcrumb-item > a rules
no longer match because the anchor is not a direct child of the li). */
[b-e8btne5whu] .mud-breadcrumb-item a.breadcrumb-popout-activator {
display: flex;
align-items: center;
}
[b-e8btne5whu] .mud-breadcrumb-item.mud-disabled a.breadcrumb-popout-activator {
pointer-events: none;
color: var(--mud-palette-action-disabled);
}
/* Keep the menu wrapper from stretching the crumb inside the flex list. */
[b-e8btne5whu] .mud-breadcrumb-item .mud-menu {
width: auto;
display: inline-flex;
}
/* Down-caret shown after a popout-capable crumb so the user knows it opens a menu.
Sized just above the crumb text and nudged in so it reads as part of the word.
Qualify with .mud-icon-root so this beats MudBlazor's own .mud-icon-size-* rule
(equal class count) and the size override reliably wins. */
[b-e8btne5whu] .mud-icon-root.breadcrumb-popout-caret {
font-size: 1.1rem;
margin-left: 2px;
opacity: 0.75;
}
/* /Shared/DeveloperTools/DevLoadTimes.razor.rz.scp.css */
.DevLoadTimes[b-kpnfdv67e7] {
position: fixed !important;
bottom: 0;
right: 0;
background: whitesmoke;
color: black;
}
/* /Shared/DialogIconPicker.razor.rz.scp.css */
/* Icon Picker Dialog - CSS Isolation */
/* Tile wrapper for click handling */
[b-2h2z3w14fd] .icon-tile-wrapper {
cursor: pointer;
}
[b-2h2z3w14fd] .icon-tile-wrapper:hover .mud-paper {
background-color: var(--mud-palette-action-default-hover);
}
/* Selected tile styling */
[b-2h2z3w14fd] .icon-item.selected {
background-color: var(--mud-palette-primary-lighten);
border: 2px solid var(--mud-palette-primary);
}
/* Scrollable panel content */
[b-2h2z3w14fd] .icon-panel-content {
max-height: calc(80vh - 250px);
overflow-y: auto;
padding: 8px;
}
/* Icon item base styling */
[b-2h2z3w14fd] .icon-item {
cursor: pointer;
transition: background-color 0.2s;
}
[b-2h2z3w14fd] .icon-item:hover {
background-color: var(--mud-palette-action-default-hover);
}
/* /Shared/Dialogs/UpdateTenantPermissionsDialog.razor.rz.scp.css */
fieldset.UrlContainer[b-qqixijigcf] {
border: 1px solid lightgrey !important;
margin: 4px !important;
padding: 16px !important;
border-radius: 5px;
}
.UrlContainer legend[b-qqixijigcf] {
padding-left: 4px;
padding-right: 4px;
}
/* /Shared/EcpCatalogue/EcpCatalogueListingPicker.razor.rz.scp.css */
.SplitPanels[b-4lpytb45h5] {
display: flex;
gap: 16px;
align-items: flex-start;
}
.LeftPanel[b-4lpytb45h5] {
flex: 0 0 420px;
max-height: calc(100vh - 220px);
overflow-y: auto;
border-right: 1px solid var(--mud-palette-table-lines);
padding-right: 8px;
}
.RightPanel[b-4lpytb45h5] {
flex: 1 1 auto;
min-width: 0;
}
.ProductList[b-4lpytb45h5] {
display: flex;
flex-direction: column;
}
.ProductRow[b-4lpytb45h5] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
padding: 8px 12px;
border-radius: 4px;
cursor: pointer;
transition: background-color 120ms ease;
}
.ProductRow:hover[b-4lpytb45h5] {
background-color: var(--mud-palette-action-default-hover);
}
.ProductRowActive[b-4lpytb45h5] {
background-color: var(--mud-palette-primary-hover);
}
.ProductRowTitle[b-4lpytb45h5] {
flex: 1 1 auto;
font-size: 0.9rem;
line-height: 1.3;
word-break: break-word;
}
.SearchBar[b-4lpytb45h5] {
gap: 4px;
}
.SearchField[b-4lpytb45h5] {
flex: 1 1 auto;
}
[b-4lpytb45h5] .AddAllButton {
flex: 0 0 auto;
}
[b-4lpytb45h5] .AddAllTooltip {
max-width: 280px;
padding: 4px 2px;
text-align: left;
}
[b-4lpytb45h5] .AddAllTooltipHeader {
display: flex;
align-items: center;
}
[b-4lpytb45h5] .AddAllTooltipFooter {
color: var(--mud-palette-text-secondary);
}
/* /Shared/EcpCatalogue/EcpDistributorChip.razor.rz.scp.css */
.DistributorChip[b-uewkhyqfs9] {
display: inline-flex;
align-items: center;
height: 24px;
padding: 0 10px;
border-radius: 12px;
border: 1.5px solid transparent;
font-size: 0.75rem;
font-weight: 600;
line-height: 1;
white-space: nowrap;
user-select: none;
}
/* /Shared/EcpCatalogue/EcpListingGrid.razor.rz.scp.css */
.EcpListingGrid[b-zttr75h65i] {
width: 100%;
}
.ListingGridImageCell[b-zttr75h65i] {
width: 56px;
}
.ListingGridImage[b-zttr75h65i] {
width: 40px;
height: 40px;
}
.ListingGridImage[b-zttr75h65i] img {
width: 40px;
height: 40px;
object-fit: contain;
}
.ListingGridTitle[b-zttr75h65i] {
font-weight: 600;
line-height: 1.15rem;
}
.ListingGridSub[b-zttr75h65i] {
font-size: 0.75rem;
line-height: 1rem;
}
.ListingGridSub-Muted[b-zttr75h65i] {
opacity: 0.7;
}
.ListingGridPrice[b-zttr75h65i] {
font-weight: 600;
white-space: nowrap;
}
.ListingGridRrpSaving[b-zttr75h65i] {
text-decoration: line-through;
opacity: 0.7;
}
.ListingGridActionCell[b-zttr75h65i] {
width: 1%;
white-space: nowrap;
}
.ListingGridActions[b-zttr75h65i] {
display: flex;
gap: 0.4rem;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
}
/* Action buttons in the grid are natural-width — the host fragment uses
FullWidth for the tile footer, which would otherwise blow the cell out. */
.ListingGridActions[b-zttr75h65i] .mud-button-root {
width: auto;
min-width: 0;
}
.ListingGridRow-Selected[b-zttr75h65i] {
background-color: var(--mud-palette-action-default-hover);
}
/* /Shared/EcpCatalogue/EcpListingGroupCard.razor.rz.scp.css */
.ProductGroup[b-9f4tlsal9o] {
background: rgba(128, 128, 128, 0.06);
border-radius: 4px;
transition: background-color 120ms ease;
}
.ProductGroup:hover[b-9f4tlsal9o] {
background: rgba(128, 128, 128, 0.12);
}
.ProductGroupTitle[b-9f4tlsal9o] {
font-weight: 500;
}
.TileGrid[b-9f4tlsal9o] {
display: grid;
grid-template-columns: repeat(auto-fill, 320px);
gap: 17px;
align-items: stretch;
}
/* /Shared/EcpCatalogue/EcpListingTile.razor.rz.scp.css */
/* Tile — V11 layout. Header banner (image + title), body (categories,
depends-on, spacer pushing foot down), foot row (segment chips left,
price right), action panel at the bottom. Tile width fixed at 320px;
height stretches to its grid cell so all tiles in a row match the
tallest. Consumers (CatalogueBuyPage, EcpCatalogueListingPicker) wrap
tiles in a CSS-grid container with `align-items: stretch`. */
.Tile[b-972i47sz1h] {
position: relative;
width: 320px;
height: 100%;
background: var(--mud-palette-surface);
border: 1px solid var(--mud-palette-lines-default);
border-radius: 10px;
box-shadow:
0 1px 2px rgba(0, 0, 0, 0.04),
0 2px 6px rgba(0, 0, 0, 0.05);
overflow: hidden;
display: flex;
flex-direction: column;
transition:
box-shadow 180ms ease,
border-color 180ms ease,
transform 180ms ease;
}
.Tile:hover[b-972i47sz1h] {
border-color: var(--mud-palette-primary);
box-shadow:
0 4px 10px rgba(0, 0, 0, 0.08),
0 8px 24px rgba(0, 0, 0, 0.06);
transform: translateY(-2px);
}
.Tile.Tile-Selected[b-972i47sz1h] {
border-color: var(--mud-palette-success);
}
.Tile.Tile-Selected:hover[b-972i47sz1h] {
border-color: var(--mud-palette-success);
}
/* ─── Hero layout (Test mode) ─────────────────────────────────────────── */
/* Title bar keeps the dark banner (inherited from .TileHeader) and shows just
the title. The central body becomes a row: image left, details right. */
.Tile-Hero .TileBody[b-972i47sz1h] {
flex-direction: row;
align-items: flex-start;
gap: 12px;
}
.TileHeroImageInline[b-972i47sz1h] {
flex: 0 0 auto;
}
/* Wraps the body content (chips, depends-on, price) so it stacks as a column
and, in hero mode, occupies the space to the right of the inline image. */
.TileBodyMain[b-972i47sz1h] {
display: flex;
flex-direction: column;
flex: 1 1 auto;
min-width: 0;
min-height: 0;
gap: 8px;
}
/* ─── Header banner ───────────────────────────────────────────────── */
.TileHeader[b-972i47sz1h] {
display: flex;
align-items: flex-start;
gap: 10px;
padding: 10px 12px;
background: linear-gradient(135deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.02));
border-bottom: 1px solid var(--mud-palette-lines-default);
flex: 0 0 auto;
}
.TileImageCol[b-972i47sz1h] {
flex: 0 0 50px;
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.TileImage[b-972i47sz1h] {
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
}
.TileImageIcons[b-972i47sz1h] {
display: flex;
gap: 4px;
justify-content: center;
min-height: 1.4rem;
}
.TileHeaderText[b-972i47sz1h] {
flex: 1 1 auto;
min-width: 0;
}
.TileTitle[b-972i47sz1h] {
font-weight: 700;
font-size: 0.85rem;
line-height: 1.05rem;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
color: var(--mud-palette-text-primary);
cursor: default;
}
.TileVariant[b-972i47sz1h] {
margin-top: 3px;
font-size: 0.68rem;
font-weight: 600;
color: var(--mud-palette-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.TilePublisher[b-972i47sz1h] {
margin-top: 2px;
font-size: 0.7rem;
font-weight: 600;
color: var(--mud-palette-text-secondary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* ─── Body ────────────────────────────────────────────────────────── */
.TileBody[b-972i47sz1h] {
flex: 1 1 auto;
min-height: 0;
padding: 10px 12px;
display: flex;
flex-direction: column;
gap: 8px;
}
.TileCats[b-972i47sz1h] {
display: flex;
flex-wrap: wrap;
gap: 4px;
}
.TileCat[b-972i47sz1h] {
font-size: 0.6rem;
padding: 1px 6px;
border-radius: 8px;
background: var(--mud-palette-action-default-hover);
color: var(--mud-palette-text-secondary);
}
.TileDependsOn[b-972i47sz1h] {
padding: 6px 8px;
background: var(--mud-palette-action-default-hover);
border-left: 2px solid var(--mud-palette-info-darken);
border-radius: 4px;
font-size: 0.7rem;
line-height: 1.05rem;
color: var(--mud-palette-text-secondary);
}
.TileDependsOn-Blocked[b-972i47sz1h] {
background: var(--mud-palette-error-hover);
border-left-color: var(--mud-palette-error-darken);
color: var(--mud-palette-error-darken);
}
.TileDependsOnLabel[b-972i47sz1h] {
display: flex;
align-items: center;
gap: 4px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.04em;
font-size: 0.6rem;
margin-bottom: 4px;
}
.TileDependsOnList[b-972i47sz1h] {
margin: 0;
padding-left: 16px;
list-style-type: disc;
}
.TileDependsOnList li[b-972i47sz1h] {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 100%;
}
.TileDependsOnMore[b-972i47sz1h] {
list-style: none;
margin-left: -12px;
font-style: italic;
opacity: 0.85;
}
.TileSpacer[b-972i47sz1h] {
flex: 1 1 auto;
min-height: 4px;
}
.TileFoot[b-972i47sz1h] {
display: flex;
justify-content: space-between;
align-items: flex-end;
gap: 8px;
}
.TileFootChips[b-972i47sz1h] {
display: flex;
flex-wrap: wrap;
gap: 4px;
align-content: flex-end;
}
.TilePrice[b-972i47sz1h] {
flex: 0 0 auto;
text-align: right;
line-height: 1;
}
.TilePriceLabel[b-972i47sz1h] {
font-size: 0.62rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--mud-palette-text-secondary);
margin-bottom: 0.15rem;
}
.TilePriceMain[b-972i47sz1h] {
font-size: 1.1rem;
font-weight: 700;
color: var(--mud-palette-text-primary);
line-height: 1.25rem;
font-variant-numeric: tabular-nums;
}
/* Small "ex GST" qualifier sitting beside the headline price. */
.TilePriceGst[b-972i47sz1h] {
font-size: 0.58rem;
font-weight: 600;
color: var(--mud-palette-text-secondary);
}
/* Secondary "inc GST" amount under the headline. */
.TilePriceInc[b-972i47sz1h] {
margin-top: 0.05rem;
font-size: 0.74rem;
font-weight: 600;
color: var(--mud-palette-text-primary);
line-height: 0.95rem;
font-variant-numeric: tabular-nums;
}
.TilePriceUnit[b-972i47sz1h] {
margin-top: 0.15rem;
font-size: 0.58rem;
line-height: 0.72rem;
color: var(--mud-palette-text-secondary);
font-weight: 500;
text-transform: lowercase;
letter-spacing: 0.01em;
}
.TilePriceRrp[b-972i47sz1h] {
margin-top: 0.1rem;
font-size: 0.68rem;
line-height: 0.85rem;
color: var(--mud-palette-text-secondary);
font-weight: 500;
font-variant-numeric: tabular-nums;
}
/* Strike-through only when RRP is shown as a saving (tenant price < RRP). The
admin RRP reference is shown plain — it's informational, not a "was" price. */
.TilePriceRrp-Saving[b-972i47sz1h] {
text-decoration: line-through;
}
.TilePriceMarkup[b-972i47sz1h] {
margin-top: 0.1rem;
font-size: 0.66rem;
line-height: 0.82rem;
font-weight: 700;
color: var(--mud-palette-primary);
font-variant-numeric: tabular-nums;
}
/* ─── Action panel ────────────────────────────────────────────────── */
.TileActionRow[b-972i47sz1h] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.75rem;
background: rgba(0, 0, 0, 0.05);
border-top: 1px solid var(--mud-palette-lines-default);
}
/* ─── Image-column icons (pencil sits under the image) ─────────────── */
.TilePencil[b-972i47sz1h] {
width: 1.4rem;
height: 1.4rem;
display: flex;
align-items: center;
justify-content: center;
background: var(--mud-palette-surface);
border-radius: 50%;
cursor: pointer;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
opacity: 0.92;
transition: opacity 120ms ease, background 120ms ease;
}
.TilePencil:hover[b-972i47sz1h] {
opacity: 1;
background: var(--mud-palette-action-default-hover);
}
[b-972i47sz1h] .TileOwned {
position: absolute;
top: 0.5rem;
right: 0.5rem;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
[b-972i47sz1h] .TileChipIcon {
width: 0.78rem !important;
height: 0.78rem !important;
font-size: 0.78rem !important;
}
/* /Shared/EcpChipBody.razor.rz.scp.css */
/* EcpChip visuals (scoped to EcpChipBody, which renders the pill element) — filled pill
matching MudChip Variant="Filled" Size="Size.Small".
Backgrounds use the MudBlazor palette per Color; text uses each palette's
pre-computed contrast text variable so the chip stays legible across light
and dark themes. TextColour* classes are optional overrides applied last. */
.EcpChip[b-jj0eqgefaa] {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 0 10px;
height: 24px;
border-radius: 16px;
font-size: 0.75rem;
line-height: 1.25rem;
font-weight: 500;
white-space: nowrap;
user-select: none;
}
.EcpChip.Dense[b-jj0eqgefaa] {
height: auto;
padding: 1px 8px;
border-radius: 10px;
font-size: 0.62rem;
font-weight: 600;
gap: 3px;
}
.CanClick[b-jj0eqgefaa] {
cursor: pointer;
}
/* Disabled — faded but still hoverable so the tooltip can explain why. */
.EcpChip.Disabled[b-jj0eqgefaa] {
opacity: 0.45;
cursor: default;
}
/* Leading-icon sizing — icon proportional to chip font so it scales with Dense. */
[b-jj0eqgefaa] .EcpChipIcon {
width: 0.85rem !important;
height: 0.85rem !important;
font-size: 0.85rem !important;
}
.Dense[b-jj0eqgefaa] .EcpChipIcon {
width: 0.78rem !important;
height: 0.78rem !important;
font-size: 0.78rem !important;
}
/* --- Subtle variant: lighter tint + darker text. Pairs with ColourXxx ---- */
.Subtle.ColourPrimary[b-jj0eqgefaa] { background: var(--mud-palette-primary-hover); color: var(--mud-palette-primary-darken); }
.Subtle.ColourSecondary[b-jj0eqgefaa] { background: var(--mud-palette-secondary-hover); color: var(--mud-palette-secondary-darken); }
.Subtle.ColourInfo[b-jj0eqgefaa] { background: var(--mud-palette-info-hover); color: var(--mud-palette-info-darken); }
.Subtle.ColourSuccess[b-jj0eqgefaa] { background: var(--mud-palette-success-hover); color: var(--mud-palette-success-darken); }
.Subtle.ColourWarning[b-jj0eqgefaa] { background: var(--mud-palette-warning-hover); color: var(--mud-palette-warning-darken); }
.Subtle.ColourError[b-jj0eqgefaa] { background: var(--mud-palette-error-hover); color: var(--mud-palette-error-darken); }
.Subtle.ColourDark[b-jj0eqgefaa] { background: var(--mud-palette-dark-hover); color: var(--mud-palette-dark); }
.Subtle.ColourDefault[b-jj0eqgefaa] { background: var(--mud-palette-action-default-hover); color: var(--mud-palette-text-primary); }
/* --- Outlined variant: transparent fill, coloured border + matching text - */
.Outlined[b-jj0eqgefaa] {
background: transparent !important;
border: 1px solid;
box-sizing: border-box;
}
.Outlined.ColourPrimary[b-jj0eqgefaa] { border-color: var(--mud-palette-primary); color: var(--mud-palette-primary); }
.Outlined.ColourSecondary[b-jj0eqgefaa] { border-color: var(--mud-palette-secondary); color: var(--mud-palette-secondary); }
.Outlined.ColourInfo[b-jj0eqgefaa] { border-color: var(--mud-palette-info); color: var(--mud-palette-info); }
.Outlined.ColourSuccess[b-jj0eqgefaa] { border-color: var(--mud-palette-success); color: var(--mud-palette-success); }
.Outlined.ColourWarning[b-jj0eqgefaa] { border-color: var(--mud-palette-warning); color: var(--mud-palette-warning); }
.Outlined.ColourError[b-jj0eqgefaa] { border-color: var(--mud-palette-error); color: var(--mud-palette-error); }
.Outlined.ColourDark[b-jj0eqgefaa] { border-color: var(--mud-palette-dark); color: var(--mud-palette-dark); }
.Outlined.ColourDefault[b-jj0eqgefaa] { border-color: var(--mud-palette-lines-default); color: var(--mud-palette-text-primary); }
/* --- Dashed outline: informational chip, not a control ------------------- */
.Outlined.Dashed[b-jj0eqgefaa] {
border-style: dashed;
}
.TextAlignLeft[b-jj0eqgefaa] { text-align: left; }
.TextAlignRight[b-jj0eqgefaa] { text-align: right; }
.TextAlignCentre[b-jj0eqgefaa] { text-align: center; }
/* --- Backgrounds (paired with palette contrast text) -------------------- */
.ColourPrimary[b-jj0eqgefaa] {
background: var(--mud-palette-primary);
color: var(--mud-palette-primary-text);
}
.ColourSecondary[b-jj0eqgefaa] {
background: var(--mud-palette-secondary);
color: var(--mud-palette-secondary-text);
}
.ColourInfo[b-jj0eqgefaa] {
background: var(--mud-palette-info);
color: var(--mud-palette-info-text);
}
.ColourSuccess[b-jj0eqgefaa] {
background: var(--mud-palette-success);
color: var(--mud-palette-success-text);
}
.ColourWarning[b-jj0eqgefaa] {
background: var(--mud-palette-warning);
color: var(--mud-palette-warning-text);
}
.ColourError[b-jj0eqgefaa] {
background: var(--mud-palette-error);
color: var(--mud-palette-error-text);
}
.ColourDark[b-jj0eqgefaa] {
background: var(--mud-palette-dark);
color: var(--mud-palette-dark-text);
}
.ColourDefault[b-jj0eqgefaa] {
background: var(--mud-palette-action-default-hover);
color: var(--mud-palette-text-primary);
}
.ColourTransparent[b-jj0eqgefaa] {
background: transparent;
color: var(--mud-palette-text-primary);
}
/* --- Optional text-colour overrides (win over .Colour* paired text) ----- */
.TextColourPrimary[b-jj0eqgefaa] { color: var(--mud-palette-primary) !important; }
.TextColourSecondary[b-jj0eqgefaa] { color: var(--mud-palette-secondary) !important; }
.TextColourInfo[b-jj0eqgefaa] { color: var(--mud-palette-info) !important; }
.TextColourSuccess[b-jj0eqgefaa] { color: var(--mud-palette-success) !important; }
.TextColourWarning[b-jj0eqgefaa] { color: var(--mud-palette-warning) !important; }
.TextColourError[b-jj0eqgefaa] { color: var(--mud-palette-error) !important; }
.TextColourDark[b-jj0eqgefaa] { color: var(--mud-palette-dark) !important; }
.TextColourTransparent[b-jj0eqgefaa] { color: transparent !important; }
/* /Shared/EcpGrid/EcpGridToolbar.razor.rz.scp.css */
/* CSS Isolation */
/*
The search field is the last toolbar item. margin-left: auto pins it hard against the
toolbar's right edge (independent of the MudSpacer), and the fixed flex basis holds it at
a third of the toolbar width instead of growing to fill all remaining space.
*/
.ecp-grid-search-field[b-hazh86eqeh] {
flex: 0 0 33%;
margin-left: auto;
}
/* /Shared/EcpSwitch.razor.rz.scp.css */
.container-lr[b-y03dezjpf6] {
display: flex;
}
.box-lr[b-y03dezjpf6] {
display: flex;
margin: 0;
padding: 0;
font-size: 1rem !important;
align-items: center;
line-height: 1;
}
.mud-grid-item[b-y03dezjpf6] {
padding-top: 0 !important;
}
.primary-text[b-y03dezjpf6] {
color: var(--mud-palette-text-primary) !important;
}
.description-text[b-y03dezjpf6] {
color: var(--mud-palette-text-secondary) !important;
}
.impact-text[b-y03dezjpf6] {
color: var(--mud-palette-text-disabled) !important;
}
.switch-inline-label-row[b-y03dezjpf6] {
gap: 0.75rem;
}
.switch-inline-label[b-y03dezjpf6] {
min-width: 5.5rem;
}
.switch-inline-label-active[b-y03dezjpf6] {
font-weight: 600;
}
.title-above[b-y03dezjpf6] {
margin-bottom: -8px;
}
.title-above-row[b-y03dezjpf6] {
gap: 0.5rem;
}
.title-above-label[b-y03dezjpf6] {
font-size: 0.75rem;
color: var(--mud-palette-text-secondary);
line-height: 1.15rem;
padding-left: 12px;
}
/* /Shared/EcpWizard.razor.rz.scp.css */
/* The scope attribute lands on .wizard-root (this component's own div); every Mud component
and page-supplied step body below it needs ::deep. The root's height is inline (it is
parameterised) — here it becomes a non-scrolling flex column so the footer stays pinned
and only div.step-scroll regions inside the content pane ever scroll. */
.wizard-root[b-ezs0mz3rru] {
display: flex;
flex-direction: column;
overflow: hidden;
}
[b-ezs0mz3rru] .wizard-body {
flex: 1 1 auto;
min-height: 0;
}
[b-ezs0mz3rru] .wizard-sidebar {
width: 220px;
border-right: 1px solid var(--mud-palette-lines-default);
}
[b-ezs0mz3rru] .wizard-content {
flex-grow: 1;
min-height: 0;
display: flex;
flex-direction: column;
overflow: hidden;
}
/* The ONE scrolling region per step — pages wrap their tables/lists in this. */
[b-ezs0mz3rru] .step-scroll {
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
}
[b-ezs0mz3rru] .wizard-footer {
background: var(--mud-palette-surface);
}
/* /Shared/Layout/EcpBotDrawer.razor.rz.scp.css */
/* EcpBot drawer — right-anchored panel surfaced from the top-bar button.
Layout matches the EcpDocumentsDrawer pattern (header + scrollable body +
fixed footer-style input). */
.ecpbot-drawer[b-olercbom8w] {
background-color: var(--mud-palette-surface);
}
.ecpbot-drawer-body[b-olercbom8w] {
display: flex;
flex-direction: column;
flex-grow: 1;
min-height: 0;
height: 100%;
}
.ecpbot-drawer-transcript[b-olercbom8w] {
flex-grow: 1;
overflow-y: auto;
padding: 12px;
display: flex;
flex-direction: column;
gap: 8px;
}
.ecpbot-drawer-input[b-olercbom8w] {
flex-shrink: 0;
padding: 8px 12px 12px 12px;
border-top: 1px solid rgba(0, 0, 0, 0.08);
background: var(--mud-palette-background);
}
.ecpbot-drawer-empty[b-olercbom8w] {
color: var(--mud-palette-text-secondary);
font-style: italic;
padding: 16px;
text-align: center;
}
.ecpbot-drawer-bubble-user[b-olercbom8w] {
align-self: flex-end;
background: var(--mud-palette-primary);
color: white;
padding: 8px 12px;
border-radius: 12px 12px 2px 12px;
max-width: 90%;
}
.ecpbot-drawer-bubble-user .mud-typography[b-olercbom8w] {
color: white;
}
.ecpbot-drawer-bubble-assistant[b-olercbom8w] {
align-self: flex-start;
background: rgba(0, 0, 0, 0.04);
padding: 8px 12px;
border-radius: 12px 12px 12px 2px;
max-width: 95%;
}
.ecpbot-drawer-thinking[b-olercbom8w] {
display: flex;
align-items: center;
padding: 8px 12px;
color: var(--mud-palette-text-secondary);
}
/* Header logo + title block */
.ecpbot-drawer-logo-wrap[b-olercbom8w] {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
}
.ecpbot-drawer-logo[b-olercbom8w] {
width: 32px;
height: 32px;
object-fit: contain;
border-radius: 4px;
}
.ecpbot-drawer-logo-fallback[b-olercbom8w] {
display: none;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
border-radius: 4px;
background: var(--mud-palette-primary);
color: white;
font-weight: 700;
font-size: 14px;
}
.ecpbot-drawer-title[b-olercbom8w] {
line-height: 1.1;
}
.ecpbot-drawer-subtitle[b-olercbom8w] {
color: var(--mud-palette-text-secondary);
line-height: 1.1;
}
/* Context-aware "Currently viewing" hint above the input */
.ecpbot-drawer-context[b-olercbom8w] {
display: flex;
align-items: center;
padding: 6px 12px;
background: rgba(33, 150, 243, 0.08);
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
/* /Shared/MainLayout.razor.rz.scp.css */
/* /Shared/Notifications/EcpDrawerNotifications.razor.rz.scp.css */
.Row[b-vdcdxhroqn] {
}
.Header[b-vdcdxhroqn] {
width: 100%;
display: table;
padding: 8px;
}
.Header-Row[b-vdcdxhroqn] {
display: table-row;
}
.Header-Left[b-vdcdxhroqn] {
display: table-cell;
width: 25px;
}
.Header-Left > div[b-vdcdxhroqn] {
margin-left: 8px;
margin-right: 20px;
}
.Header-Middle[b-vdcdxhroqn] {
display: table-cell;
margin-right: auto;
text-align: left;
vertical-align: top;
}
.Header-Right[b-vdcdxhroqn] {
display: table-cell;
width: 25px;
height: 25px;
margin-left: auto;
vertical-align: top;
padding-left: 2px;
}
.Content[b-vdcdxhroqn] {
padding-left: 32px;
}
.Font[b-vdcdxhroqn] {
font-size: 18px;
}
/* /Shared/Onboarding/OnboardingWizard.razor.rz.scp.css */
/* CSS Isolation */
/* /Shared/ServiceDesk/ServiceDeskReadOnlyBody.razor.rz.scp.css */
/* State strip — horizontal chips */
.sd-state-strip[b-43ytdqamlb] {
display: flex;
flex-wrap: wrap;
gap: 8px;
padding-bottom: 14px;
border-bottom: 1px solid var(--mud-palette-lines-default);
margin-bottom: 14px;
}
.sd-state-chip[b-43ytdqamlb] {
background: var(--mud-palette-background-grey);
border-radius: 8px;
padding: 6px 12px;
}
.sd-status-dot[b-43ytdqamlb] {
width: 8px;
height: 8px;
border-radius: 50%;
display: inline-block;
}
/* Two-column body — reuse panel grid */
.sd-body[b-43ytdqamlb] {
display: grid;
grid-template-columns: 1fr 1fr;
}
.sd-col[b-43ytdqamlb] {
padding: 14px 18px;
}
.sd-col-left[b-43ytdqamlb] {
border-right: 1px solid var(--mud-palette-lines-default);
}
.sd-meta-label[b-43ytdqamlb] {
font-size: 11px;
color: var(--mud-palette-text-secondary);
text-transform: uppercase;
letter-spacing: 0.3px;
margin-bottom: 3px;
}
.sd-meta-value[b-43ytdqamlb] {
font-size: 13.5px;
}
.sd-ro-group + .sd-ro-group[b-43ytdqamlb] {
margin-top: 14px;
}
/* Configured note — structured key/value */
.sd-cnote[b-43ytdqamlb] {
background: var(--mud-palette-background-grey);
border-radius: 8px;
padding: 10px 12px;
}
.sd-cnote-dl[b-43ytdqamlb] {
display: grid;
grid-template-columns: auto 1fr;
gap: 3px 10px;
}
[b-43ytdqamlb] .sd-cnote-dl dt {
font-size: 12px;
color: var(--mud-palette-text-secondary);
white-space: nowrap;
}
[b-43ytdqamlb] .sd-cnote-dl dd {
font-size: 12.5px;
margin: 0;
}
/* Activity log */
.sd-activity-log[b-43ytdqamlb] {
display: flex;
flex-direction: column;
gap: 8px;
max-height: 240px;
overflow-y: auto;
}
.sd-log-item[b-43ytdqamlb] {
display: flex;
gap: 10px;
align-items: flex-start;
}
.sd-log-icon[b-43ytdqamlb] {
width: 22px;
height: 22px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
margin-top: 1px;
}
.sd-log-icon-ok[b-43ytdqamlb] {
background: var(--mud-palette-success-lighten);
color: var(--mud-palette-success);
}
.sd-log-icon-fail[b-43ytdqamlb] {
background: var(--mud-palette-error-lighten);
color: var(--mud-palette-error);
}
.sd-log-icon-pending[b-43ytdqamlb] {
background: var(--mud-palette-warning-lighten);
color: var(--mud-palette-warning);
}
.sd-log-main[b-43ytdqamlb] {
flex: 1;
}
.sd-log-title[b-43ytdqamlb] {
font-size: 12.5px;
font-weight: 500;
display: flex;
align-items: center;
gap: 8px;
}
.sd-log-time[b-43ytdqamlb] {
font-size: 11px;
color: var(--mud-palette-text-secondary);
font-weight: 400;
margin-left: auto;
white-space: nowrap;
}
.sd-log-detail[b-43ytdqamlb] {
font-size: 12px;
color: var(--mud-palette-text-secondary);
margin-top: 2px;
}
@media (max-width: 820px) {
.sd-body[b-43ytdqamlb] {
grid-template-columns: 1fr;
}
.sd-col-left[b-43ytdqamlb] {
border-right: none;
border-bottom: 1px solid var(--mud-palette-lines-default);
}
}
/* /Shared/ServiceDesk/ServiceDeskSessionChip.razor.rz.scp.css */
/* ─── MudTimeline styling fixes ─── */
[b-z0xp5m96jd] .mud-timeline-item-opposite {
display: none !important;
}
[b-z0xp5m96jd] .mud-timeline-item {
padding: 2px 0 !important;
}
/* ─── Active dot animation ─── */
.sd-active-dot[b-z0xp5m96jd] {
display: inline-block;
width: 7px;
height: 7px;
background-color: #ff1744;
border-radius: 50%;
margin-right: 4px;
animation: sd-pulse-b-z0xp5m96jd 1.4s ease infinite;
}
@keyframes sd-pulse-b-z0xp5m96jd {
0%, 100% { opacity: 1; transform: scale(1); }
50% { opacity: 0.5; transform: scale(0.7); }
}
/* ─── Floating work panel ─── */
.sd-floating-work-panel[b-z0xp5m96jd] {
position: fixed;
z-index: 1200;
width: 520px;
max-width: calc(100vw - 32px);
background: var(--mud-palette-surface);
border: 1px solid var(--mud-palette-lines-default);
border-radius: 14px;
box-shadow: 0 18px 48px rgba(20,40,80,.18), 0 2px 6px rgba(20,40,80,.08);
overflow: hidden;
resize: both;
min-width: 340px;
min-height: 300px;
}
/* ─── Zone 1: Row 1 — ticket#, status, action icons ─── */
.sd-panel-row1[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 5px;
padding: 10px 12px 6px 14px;
background: var(--mud-palette-background-grey);
cursor: move;
user-select: none;
}
.sd-ticket-num[b-z0xp5m96jd] {
font-weight: 700;
font-size: 14px;
font-variant-numeric: tabular-nums;
letter-spacing: -.2px;
white-space: nowrap;
color: var(--mud-palette-text-primary);
}
.sd-status-pill[b-z0xp5m96jd] {
font-size: 10px;
font-weight: 700;
padding: 2px 7px;
border-radius: 20px;
letter-spacing: .3px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 170px;
}
.sd-pill-new[b-z0xp5m96jd] { background: rgba(33,150,243,.15); color: var(--mud-palette-primary); }
.sd-pill-inprog[b-z0xp5m96jd] { background: rgba(245,158,11,.15); color: #d97706; }
.sd-pill-resolved[b-z0xp5m96jd] { background: rgba(46,158,91,.15); color: #2e9e5b; }
.sd-pill-default[b-z0xp5m96jd] { background: var(--mud-palette-action-default-hover); color: var(--mud-palette-text-secondary); }
.sd-header-actions[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 0;
flex: none;
}
/* ─── Zone 2: Title line ─── */
.sd-panel-title[b-z0xp5m96jd] {
font-size: 13px;
font-weight: 600;
color: var(--mud-palette-text-primary);
padding: 4px 14px 8px;
background: var(--mud-palette-background-grey);
border-bottom: 1px solid var(--mud-palette-lines-default);
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 1.35;
white-space: normal;
}
.sd-floating-work-panel-body[b-z0xp5m96jd] {
padding: 12px 14px 14px;
overflow-y: auto;
max-height: calc(100vh - 180px);
display: flex;
flex-direction: column;
}
.sd-floating-work-panel-backdrop[b-z0xp5m96jd] {
position: fixed;
inset: 0;
z-index: 1199;
background: transparent;
}
/* ─── Zone 3: Meta strip (priority + SLA) ─── */
.sd-meta-strip[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 10px;
padding: 9px 14px;
font-size: 11.5px;
border-bottom: 1px solid var(--mud-palette-lines-default);
background: var(--mud-palette-surface);
color: var(--mud-palette-text-primary);
flex-wrap: wrap;
}
/* Linked-tenant line: shows the tenant the session ticket belongs to, as a click-to-navigate link. */
.sd-tenant-line[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 6px;
padding: 6px 14px;
font-size: 12px;
border-bottom: 1px solid var(--mud-palette-lines-default);
background: var(--mud-palette-surface);
color: var(--mud-palette-text-secondary);
}
.sd-tenant-name[b-z0xp5m96jd] {
color: var(--mud-palette-text-primary);
font-weight: 600;
}
.sd-sla-priority[b-z0xp5m96jd] {
font-size: 10px;
font-weight: 700;
padding: 2px 8px;
border-radius: 6px;
letter-spacing: .3px;
display: inline-flex;
align-items: center;
gap: 4px;
}
/* Priority pills: semantic accent tints — alpha-blended so they read on both light/dark */
.sd-prio-p1[b-z0xp5m96jd] { background: rgba(229,72,77,.15); color: #e5484d; }
.sd-prio-p2[b-z0xp5m96jd] { background: rgba(245,158,11,.15); color: #d97706; }
.sd-prio-p3[b-z0xp5m96jd] { background: rgba(33,150,243,.15); color: var(--mud-palette-primary); }
.sd-sla-due[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 5px;
font-weight: 600;
color: var(--mud-palette-text-secondary);
margin-left: auto;
}
.sd-sla-warn[b-z0xp5m96jd] { color: #d97706; }
.sd-sla-crit[b-z0xp5m96jd] { color: #e5484d; }
.sd-sla-met[b-z0xp5m96jd] {
color: #2e9e5b;
margin-left: auto;
font-weight: 700;
display: flex;
align-items: center;
gap: 4px;
}
/* ─── Status line ─── */
.sd-status-line[b-z0xp5m96jd] {
display: flex;
align-items: stretch;
border: 1px solid var(--mud-palette-lines-default);
border-radius: 10px;
overflow: hidden;
}
.sd-status-seg[b-z0xp5m96jd] {
flex: 1;
padding: 8px 6px;
text-align: center;
border-right: 1px solid var(--mud-palette-lines-default);
}
.sd-status-n[b-z0xp5m96jd] {
font-size: 17px;
font-weight: 700;
font-variant-numeric: tabular-nums;
line-height: 1;
}
.sd-status-label[b-z0xp5m96jd] {
font-size: 9.5px;
color: var(--mud-palette-text-secondary);
margin-top: 3px;
text-transform: uppercase;
letter-spacing: .4px;
}
.sd-n-changes[b-z0xp5m96jd] { color: #2e9e5b; }
.sd-n-topost[b-z0xp5m96jd] { color: #f08c00; }
.sd-n-auto[b-z0xp5m96jd] { color: #8b5cf6; }
.sd-status-timer[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 5px;
padding: 0 11px;
color: var(--mud-palette-text-secondary);
font-size: 12px;
font-variant-numeric: tabular-nums;
border-left: 1px solid var(--mud-palette-lines-default);
}
/* ─── "This page" smart strip ─── */
.sd-this-page[b-z0xp5m96jd] {
border: 1px dashed var(--mud-palette-primary);
background: color-mix(in srgb, var(--mud-palette-primary) 10%, var(--mud-palette-surface));
border-radius: 10px;
padding: 9px 11px;
}
.sd-tp-top[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 7px;
font-size: 11.5px;
color: var(--mud-palette-primary);
}
.sd-tp-sub[b-z0xp5m96jd] {
font-size: 10.5px;
color: var(--mud-palette-text-secondary);
margin: 4px 0 8px;
}
.sd-tp-actions[b-z0xp5m96jd] {
display: flex;
gap: 6px;
flex-wrap: wrap;
}
.sd-tp-btn-cust[b-z0xp5m96jd] {
border-color: #0e9384 !important;
color: #0e9384 !important;
font-size: 11px !important;
font-weight: 600 !important;
}
.sd-tp-btn-cust:hover[b-z0xp5m96jd] {
background: rgba(14,147,132,.1) !important;
}
.sd-tp-btn-int[b-z0xp5m96jd] {
color: var(--mud-palette-text-secondary) !important;
font-size: 11px !important;
font-weight: 600 !important;
}
.sd-tp-btn-int:hover[b-z0xp5m96jd] {
background: var(--mud-palette-action-default-hover) !important;
}
/* ─── Activity rows ─── */
.sd-grp-label[b-z0xp5m96jd] {
font-size: 10.5px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .5px;
color: var(--mud-palette-text-secondary);
display: flex;
align-items: baseline;
gap: 6px;
margin: 2px 0 6px;
}
.sd-grp-hint[b-z0xp5m96jd] {
font-weight: 500;
text-transform: none;
letter-spacing: 0;
color: var(--mud-palette-text-disabled);
font-size: 10.5px;
}
.sd-activity-row[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 9px;
padding: 6px 8px;
border-radius: 8px;
transition: .12s;
position: relative;
}
.sd-activity-row:hover[b-z0xp5m96jd] {
background: var(--mud-palette-action-default-hover);
}
.sd-stat[b-z0xp5m96jd] {
width: 18px;
height: 18px;
flex: none;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
}
/* Status pucks: solid colours (icon is white/contrasting), readable in both modes */
.sd-stat-done[b-z0xp5m96jd] { background: #2e9e5b; color: #fff; }
.sd-stat-queued[b-z0xp5m96jd] { background: rgba(240,140,0,.15); color: #f08c00; border: 1.5px solid #f08c00; }
.sd-stat-pending[b-z0xp5m96jd] { background: rgba(245,158,11,.15); color: #f59e0b; border: 1.5px solid #f59e0b; }
.sd-stat-failed[b-z0xp5m96jd] { background: #e5484d; color: #fff; }
.sd-stat-int[b-z0xp5m96jd] { background: var(--mud-palette-action-default-hover); color: var(--mud-palette-text-secondary); border: 1.5px solid var(--mud-palette-text-disabled); }
.sd-row-mid[b-z0xp5m96jd] {
flex: 1;
min-width: 0;
}
.sd-row-top[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 6px;
}
.sd-entity-tag[b-z0xp5m96jd] {
font-size: 10px;
font-weight: 700;
padding: 1px 7px;
border-radius: 6px;
letter-spacing: .2px;
}
/* Entity tags: alpha-tinted so they read on both light/dark surfaces */
.sd-ent-User[b-z0xp5m96jd] { background: rgba(33,150,243,.15); color: var(--mud-palette-primary); }
.sd-ent-Mailbox[b-z0xp5m96jd] { background: rgba(176,58,110,.12); color: #d4477f; }
.sd-ent-Subscription[b-z0xp5m96jd] { background: rgba(46,158,91,.12); color: #2e9e5b; }
.sd-ent-ActionItem[b-z0xp5m96jd] { background: rgba(139,92,246,.12); color: #8b5cf6; }
.sd-ent-Note[b-z0xp5m96jd] { background: rgba(14,147,132,.12); color: #0e9384; }
.sd-ent-Internal[b-z0xp5m96jd] { background: var(--mud-palette-action-default-hover); color: var(--mud-palette-text-secondary); }
.sd-row-when[b-z0xp5m96jd] {
font-size: 10.5px;
color: var(--mud-palette-text-disabled);
font-variant-numeric: tabular-nums;
}
.sd-row-desc[b-z0xp5m96jd] {
font-size: 11.5px;
color: var(--mud-palette-text-secondary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-top: 2px;
}
.sd-row-state[b-z0xp5m96jd] {
font-size: 10.5px;
font-weight: 700;
white-space: nowrap;
}
.sd-state-done[b-z0xp5m96jd] { color: #2e9e5b; }
.sd-state-queued[b-z0xp5m96jd] { color: #f08c00; }
.sd-state-pending[b-z0xp5m96jd] { color: #f59e0b; }
.sd-state-failed[b-z0xp5m96jd] { color: #e5484d; }
/* Edit/remove hover actions on queued rows */
.sd-row-edit-actions[b-z0xp5m96jd] {
display: none;
align-items: center;
gap: 2px;
}
.sd-row-editable:hover .sd-row-edit-actions[b-z0xp5m96jd],
.sd-row-editable:focus-within .sd-row-edit-actions[b-z0xp5m96jd] {
display: flex;
}
.sd-row-editable:hover .sd-row-state.sd-state-queued[b-z0xp5m96jd],
.sd-row-editable:focus-within .sd-row-state.sd-state-queued[b-z0xp5m96jd] {
display: none;
}
/* ─── Inline notes view ─── */
.sd-note-card[b-z0xp5m96jd] {
border: 1px solid var(--mud-palette-lines-default);
border-left: 3px solid var(--mud-palette-text-disabled);
border-radius: 9px;
padding: 9px 11px;
}
.sd-note-cust[b-z0xp5m96jd] { border-left-color: #0e9384; }
.sd-note-int[b-z0xp5m96jd] { border-left-color: var(--mud-palette-text-secondary); }
.sd-note-top[b-z0xp5m96jd] {
display: flex;
align-items: center;
gap: 7px;
margin-bottom: 4px;
}
/* ─── Composer ─── */
.sd-composer[b-z0xp5m96jd] {
border: 1.5px solid var(--mud-palette-lines-default);
border-radius: 11px;
overflow: hidden;
margin-bottom: 12px;
}
.sd-composer-cust[b-z0xp5m96jd] {
border-color: #0e9384;
}
.sd-comp-tabs[b-z0xp5m96jd] {
display: flex;
}
.sd-comp-tab[b-z0xp5m96jd] {
flex: 1;
padding: 8px;
font-size: 11.5px;
font-weight: 700;
text-align: center;
cursor: pointer;
background: var(--mud-palette-background-grey);
color: var(--mud-palette-text-secondary);
border-bottom: 1px solid var(--mud-palette-lines-default);
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
user-select: none;
}
.sd-comp-tab.active.cust[b-z0xp5m96jd] {
background: rgba(14,147,132,.12);
color: #0e9384;
border-bottom: 2px solid #0e9384;
}
.sd-comp-tab.active.int[b-z0xp5m96jd] {
background: var(--mud-palette-surface);
color: var(--mud-palette-text-primary);
border-bottom: 2px solid var(--mud-palette-text-secondary);
}
.sd-comp-body[b-z0xp5m96jd] {
padding: 10px 11px;
}
.sd-vis-note[b-z0xp5m96jd] {
font-size: 10.5px;
margin-bottom: 8px;
display: flex;
align-items: center;
gap: 5px;
}
.sd-vis-cust[b-z0xp5m96jd] { color: #0e9384; }
.sd-vis-int[b-z0xp5m96jd] { color: var(--mud-palette-text-secondary); }
.sd-post-btn-cust[b-z0xp5m96jd] {
background: #0e9384 !important;
color: #fff !important;
box-shadow: 0 2px 6px rgba(14,147,132,.35) !important;
border-radius: 9px !important;
font-weight: 700 !important;
font-size: 12.5px !important;
white-space: nowrap;
}
/* Keep the post-button label ("Post customer note · log 15m") on a single line. Anchor ::deep on
the authored .sd-post-row element (reliably carries the CSS-isolation scope) rather than the
MudButton's own class, and target MudButton's inner .mud-button-label wrapper directly. */
.sd-post-row[b-z0xp5m96jd] .mud-button-label {
white-space: nowrap;
}
.sd-post-btn-cust:hover[b-z0xp5m96jd] {
filter: brightness(.94);
}
.sd-post-btn-int[b-z0xp5m96jd] {
background: var(--mud-palette-text-secondary) !important;
color: #fff !important;
border-radius: 9px !important;
font-weight: 700 !important;
font-size: 12.5px !important;
white-space: nowrap;
}
.sd-post-btn-int:hover[b-z0xp5m96jd] {
filter: brightness(.94);
}
.sd-post-row[b-z0xp5m96jd] {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.sd-post-btn-fill[b-z0xp5m96jd] {
flex: 1;
}
.sd-preview-btn[b-z0xp5m96jd] {
border: 1px solid #0e9384 !important;
background: var(--mud-palette-surface) !important;
color: #0e9384 !important;
border-radius: 9px !important;
font-weight: 700 !important;
font-size: 12.5px !important;
}
.sd-preview-btn:hover[b-z0xp5m96jd] {
background: rgba(14, 147, 132, 0.08) !important;
}
/* /Shared/ServiceDesk/ServiceDeskTicketPanel.razor.rz.scp.css */
/* Panel styling: full accent border, tinted header, two-column read-only body */
.sd-panel[b-ov6plylrsd] {
border: 1px solid var(--mud-palette-warning-lighten);
border-radius: 8px;
overflow: hidden;
background: var(--mud-palette-surface);
}
.sd-header[b-ov6plylrsd] {
background: color-mix(in srgb, var(--mud-palette-warning-lighten) 12%, var(--mud-palette-surface));
min-height: 48px;
padding: 8px 14px;
}
.sd-header-divider[b-ov6plylrsd] {
border-top: 1px solid var(--mud-palette-lines-default);
}
.sd-body[b-ov6plylrsd] {
display: grid;
grid-template-columns: 1fr 1fr;
}
.sd-col[b-ov6plylrsd] {
padding: 14px 18px;
}
.sd-col-left[b-ov6plylrsd] {
border-right: 1px solid var(--mud-palette-lines-default);
}
.sd-meta-grid[b-ov6plylrsd] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px 20px;
}
.sd-meta-full[b-ov6plylrsd] {
grid-column: 1 / -1;
}
.sd-meta-label[b-ov6plylrsd] {
font-size: 11px;
color: var(--mud-palette-text-secondary);
text-transform: uppercase;
letter-spacing: 0.3px;
margin-bottom: 1px;
}
.sd-meta-value[b-ov6plylrsd] {
font-size: 13.5px;
}
/* Unlinked state: left-only accent border with warm tint background */
.sd-panel-unlinked[b-ov6plylrsd] {
border: 1px solid var(--mud-palette-lines-default);
border-left: 3px solid var(--mud-palette-warning-lighten);
border-radius: 8px;
overflow: hidden;
background: #fff8ec;
min-height: 52px;
padding: 8px 14px;
}
@media (max-width: 820px) {
.sd-body[b-ov6plylrsd] {
grid-template-columns: 1fr;
}
.sd-col-left[b-ov6plylrsd] {
border-right: none;
border-bottom: 1px solid var(--mud-palette-lines-default);
}
}
/* /Shared/Tasks/Dialogs/MyTasksReminderDialog.razor.rz.scp.css */
/* The daily reminder popup should use the full dialog height (the dialog's own
max-height ~80vh) rather than the compact 300px the dense table uses in the embedded
list-page panel. Raise the cap here only, scoped to this wrapper div — the div carries
the CSS-isolation scope attribute (MudBlazor component roots never do), so ::deep can
reach the table container inside MyTasksDashboard. The extra .my-tasks-dense-table
qualifier lifts specificity above MyTasksDashboard's own
".my-tasks-dense-table ::deep .mud-table-container" rule so this override wins. The calc leaves
room for the dialog title, intro line and action buttons, so the table grows with its
rows until the dialog fills the viewport, then scrolls within (sticky header intact). */
.TasksReminderBody[b-4annf8b4af] .my-tasks-dense-table .mud-table-container {
max-height: calc(80vh - 220px);
}
/* /Shared/Tasks/MyTasksDashboard.razor.rz.scp.css */
[b-2w8zt7qgdq] .mud-expansion-panel-content {
padding: 0;
}
/* Dense mode: cap the table height (scroll past ~7 rows) but shrink to fit fewer rows.
Selectors anchor on the plain div wrapper (which carries the isolation scope attribute)
because MudBlazor component roots never receive it. */
.my-tasks-dense-table[b-2w8zt7qgdq] .mud-table-container {
max-height: 300px;
overflow-y: auto;
}
.my-tasks-dense-table[b-2w8zt7qgdq] .mud-table-cell {
padding: 0 8px;
line-height: 1.0;
}
/* Icon buttons and chips are the tallest elements in each row — shrink them to the
icon/text size so the row collapses to roughly text height. */
.my-tasks-dense-table[b-2w8zt7qgdq] .mud-icon-button {
padding: 0;
}
.my-tasks-dense-table[b-2w8zt7qgdq] .mud-chip {
margin: 0;
height: 18px;
font-size: 0.68rem;
}
[b-2w8zt7qgdq] .actions-header .column-header {
justify-content: center;
text-align: center;
}
[b-2w8zt7qgdq] .ActionsHeader .column-header {
justify-content: center;
text-align: center;
}
/* /Shared/Tasks/MyTasksTile.razor.rz.scp.css */
[b-4s5gc1m0gx] .mud-table-cell {
padding: 4px 8px;
}
/* /Shared/TextInputDialog.razor.rz.scp.css */
/* CSS Isolation */