﻿aside {
	overflow: visible!important;
}

.mud-nav-item {
	overflow: visible!important;
}

.mi-grid-config-grid .mud-toolbar.mud-toolbar-gutters.mud-table-toolbar {
	height: unset!important;
}

button.spinning > span {
	animation: spin 2s linear infinite;
}

.mi-dialog-small {
	width: 400px !important;
}

.mi-dialog-med {
	width: 700px !important;
}

.mi-dialog-large {
	width: 1200px !important;
}

.mi-dialog-x-large {
	width: 1800px !important;
}

.mi-dialog-60 {
	width: 60vw !important;
}

.mi-dialog {
	background-color: var(--mud-palette-background);
	overflow-y: auto;
	overflow-x: hidden;
	max-width: 100vw !important;
}

	.mi-dialog .mud-dialog-title, .mi-quick-search-dialog .mud-dialog-title > h6 {
		display: none !important;
	}

.mi-audit-dialog .mud-dialog-content {
	position: static !important;
	overflow: hidden !important;
}

.mi-audit-dialog .mud-dialog-title {
	padding: 24px !important;
}

.mi-audit-dialog .mi-audit-timeline {
	position: absolute;
	left: 12px;
	right: 12px;
	top: 0;
	overflow-y: scroll;
	bottom: 0;
}

.mi-audit-dialog-inner {
	height: 600px;
	overflow: hidden;
	margin-top: 0;
	margin-bottom: 16px;
	position: relative;
}

.mi-audit-entry {
	padding: 8px 12px;
}

.mi-audit-icon-col {
	padding-top: 2px;
}

.mi-audit-table th {
	background-color: var(--mud-palette-background-grey);
	font-weight: 600;
}

.mi-manage-columns-show-presets-button .mud-button-icon-end {
	transform: rotate(0deg);
	transition: transform 500ms;
}

.mi-manage-columns-show-presets-button.expanded .mud-button-icon-end {
	transform: rotate(-180deg);
	transition: transform 500ms;
}

.mi-manage-columns-preset-radio-list .mud-radio-content {
	white-space: nowrap;
	font-size: 14px;
}

.mi-manage-columns-preset-button.mud-icon-button {
	float: right;
}

.mi-manage-columns-preset-button.mud-icon-button:hover {
	background-color: unset;
}

.mi-panel-group-force-d-block .mud-tabs-panels {
	display: block !important;
	overflow-y: hidden !important;
}

/* Dashboard GridStack - Hide all resize handles completely */
.grid-stack-item > .ui-resizable-handle,
.grid-stack-item > .gs-resize-handle {
	display: none !important;
}

/* Dashboard widget menu - position absolutely inside the card, hide by default */
.grid-stack-item-content {
	position: relative !important;
}

.widget-menu-btn {
	position: absolute !important;
	top: 8px !important;
	right: 8px !important;
	z-index: 100 !important;
	opacity: 0 !important;
	transition: opacity 0.2s ease;
	pointer-events: none;
}

.widget-menu-btn.show,
.grid-stack-item-content:hover .widget-menu-btn {
	opacity: 1 !important;
	pointer-events: auto;
}

/* US #111331 - Responsive Dialogs & Modals */
@media (max-width: 599px) {

	/* AC1: Override the MudBlazor overlay flex centering */
	.mud-overlay.mud-overlay-dialog {
		align-items: flex-start !important;
		justify-content: flex-start !important;
	}

	/* AC1: Remove container padding/centering so the dialog can fill the screen */
	.mud-dialog-container {
		padding: 0 !important;
		align-items: flex-start !important;
		justify-content: flex-start !important;
		width: 100vw !important;
		height: 100vh !important;
		height: 100dvh !important;
	}

	/* AC1: All dialog size variants expand to full-screen — position:fixed pins it
	   to the viewport regardless of any parent flex/padding constraints, and
	   overrides the MaxWidth.Medium (mud-dialog-maxwidth-md) cap from MudDialogProvider */
	.mi-dialog,
	.mi-dialog-small,
	.mi-dialog-med,
	.mi-dialog-large,
	.mi-dialog-x-large,
	.mi-dialog-60,
	.mud-dialog {
		position: fixed !important;
		inset: 0 !important;
		width: 100vw !important;
		max-width: 100vw !important;
		height: 100vh !important;
		height: 100dvh !important; /* Accounts for mobile browser chrome in supporting browsers */
		max-height: 100dvh !important;
		margin: 0 !important;
		border-radius: 0 !important;
	}

	/* AC2 + AC6: Flex column layout — body scrolls, buttons stay fixed at bottom */
	.mi-dialog,
	.mi-dialog-small,
	.mi-dialog-med,
	.mi-dialog-large,
	.mi-dialog-x-large,
	.mi-dialog-60,
	.mud-dialog {
		display: flex !important;
		flex-direction: column !important;
	}

	/* AC3: Title bar (contains close/dismiss control) pinned at top, never scrolls away */
	.mud-dialog-title {
		flex-shrink: 0 !important;
		position: sticky !important;
		top: 0 !important;
		z-index: 1 !important;
		background-color: var(--mud-palette-surface) !important;
		/* Bug 130657: Reserve right space so long title text cannot flow under the close button */
		padding-right: 56px !important;
	}

	/* AC2 + AC6: Dialog body scrolls independently */
	.mud-dialog-content {
		flex: 1 1 auto !important;
		overflow-y: auto !important;
		overflow-x: hidden !important;
	}

	/* AC2 + AC6: Action buttons container stays fixed at bottom */
	.mud-dialog-actions {
		flex-shrink: 0 !important;
		gap: 8px !important; /* AC4: minimum 8px separation between buttons */
		flex-wrap: wrap !important;
	}

	/* AC4: Minimum 44px tap target height on action buttons */
	.mud-dialog-actions .mud-button-root {
		min-height: 44px !important;
	}

	/* Bug 130669: */
	.mud-popover,
	.mud-select-popover {
		min-width: fit-content !important;
	}

	/* Bug 130669 (label notch): */
	.mud-input-outlined-border legend {
		box-sizing: content-box;
		padding-right: 16px;
	}
}

/* ───────────────────────────────────────────────────────────────── */
/* DLP — Unsaved Changes + Auto-Save (133473 / 133474 / 133452)      */
/* ───────────────────────────────────────────────────────────────── */

/* Page header wrapper (PageHeader.razor) */
.mi-page-header { display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 20px; gap: 12px; flex-wrap: wrap; }

/* Auto-save chip — three states */
.mi-autosave-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px;
    border-radius: 20px; font-size: 12px; font-weight: 500; transition: all .3s; border: 1px solid; }
.mi-autosave-chip--saved   { background: #E8F5E9; color: #2E7D32; border-color: #A5D6A7; }
.mi-autosave-chip--saving  { background: #E3F2FD; color: #1565C0; border-color: #90CAF9; }
.mi-autosave-chip--unsaved { background: #FFEBEE; color: #C62828; border-color: #EF9A9A; }
.mi-autosave-icon { width: 14px; height: 14px; }
.mi-spin { animation: mi-spin 1s linear infinite; }
@keyframes mi-spin { to { transform: rotate(360deg); } }

/* Per-tab dirty dot */
.mi-tab-dirty-dot { width: 7px; height: 7px; border-radius: 50%;
    background: #C62828; display: inline-block; margin-left: 6px; vertical-align: middle; }

/* Navigate-away dialog + timeout dialog — shared danger header */
.mi-dlp-dialog-header { padding: 16px 20px; display: flex; align-items: center; gap: 10px; color: #fff; }
.mi-dlp-dialog-header--danger { background: #C62828; }
.mi-dlp-dialog-title { font-size: 15px; font-weight: 600; }

/* Session timeout dialog: make the red header go edge-to-edge by
   killing MudDialog's default title/content padding. Our own
   .mi-dlp-dialog-header and .mi-session-body provide the padding. */
.mi-timeout-dialog .mud-dialog-title { padding: 0; }
.mi-timeout-dialog .mud-dialog-content { padding: 0; }
.mi-timeout-dialog .mud-dialog-actions { padding: 0 24px 20px; justify-content: center; }

/* Preview Warning Dialog button on Business Operations > Settings >
   Auto Logout Time. Inline at the bottom-right of the panel (not a
   viewport FAB) so it only appears alongside the setting it previews. */
.mi-preview-warning-fab {
    background: #C62828; color: #fff; border: none;
    padding: 12px 20px; border-radius: 24px;
    font-size: 13px; font-weight: 700; cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    display: inline-flex; align-items: center; gap: 8px;
}
.mi-preview-warning-fab:hover { background: #B71C1C; }
.mi-preview-warning-fab__icon { font-size: 11px; }

/* Dirty notice block used inside the dialogs */
.mi-dlp-dirty-notice { background: #FFEBEE; border: 1px solid #EF9A9A; border-radius: 4px;
    padding: 10px 14px; margin-top: 12px; font-size: 13px; color: #C62828;
    display: flex; align-items: center; gap: 8px; }

/* Restore-on-return banner (133474) */
.mi-restore-banner { background: #E3F2FD; border: 1px solid #90CAF9; border-radius: 6px;
    padding: 14px 18px; display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 20px; gap: 16px; }
.mi-restore-banner-left { display: flex; align-items: center; gap: 12px; }
.mi-restore-banner-text { font-size: 13px; color: #1565C0; }
.mi-restore-banner-actions { display: flex; gap: 10px; align-items: center; }

/* Session timeout dialog body (133452) */
.mi-session-body { padding: 20px 24px; text-align: center; }
.mi-session-line { color: #424242; font-size: 14px; line-height: 1.6; margin-bottom: 4px; }
.mi-countdown-ring { width: 100px; height: 100px; margin: 0 auto 16px; position: relative; }
.mi-countdown-ring svg { width: 100px; height: 100px; display: block; }
.mi-countdown-ring circle { fill: none; stroke-width: 8; }
.mi-ring-bg { stroke: #FFCDD2; }
.mi-ring-fg { stroke: #C62828; stroke-linecap: round; stroke-dasharray: 283; transition: stroke-dashoffset .5s; }
.mi-countdown-num {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    font-size: 26px; font-weight: 700; color: #C62828;
}
.mi-countdown-label { text-align: center; font-size: 12px; color: #9e9e9e; margin-top: -8px; margin-bottom: 20px; }
