/* ==========================================
   MODERN COMPONENT STYLES
   Cards, Buttons, Forms, Data Grids with minimal shadows
   ========================================== */

/* ========== GLOBAL ICON FIXES ========== */
/* Ensure all icons are properly displayed and aligned */
.mud-icon-root {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    vertical-align: middle !important;
}

.mud-icon-button .mud-icon-root {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ========== GLOBAL STAT CARDS ========== */
/* Used across all index pages for metric summary cards */

.stat-card {
    overflow: hidden !important;
    position: relative !important;
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    opacity: 0.85;
}

.stat-card-primary::before  { background: var(--mud-palette-primary); }
.stat-card-success::before  { background: var(--mud-palette-success); }
.stat-card-warning::before  { background: var(--mud-palette-warning); }
.stat-card-info::before     { background: var(--mud-palette-info); }
.stat-card-error::before    { background: var(--mud-palette-error); }
.stat-card-secondary::before { background: var(--mud-palette-secondary); }/* ========== DATA GRID MODERN ========== */
/* Flat grids with a border instead of elevation shadow */

.grid-modern {
    overflow: hidden !important;
}/* Card Headers - minimal changes */
.mud-card-header {
    border-bottom: 1px solid var(--mud-palette-divider) !important;
}.mud-button-outlined {
    border-width: 1.5px !important;
}

.mud-button-outlined:hover {
    border-width: 1.5px !important;
}

/* Icon Buttons */
.mud-icon-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}/* Loading Buttons */
.mud-button-root.mud-button-loading {
    opacity: 0.7;
}

.mud-button-root.mud-button-loading .mud-button-label {
    opacity: 0.5;
}.mud-button-group .mud-button-root:first-child {
    border-top-left-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
}

.mud-button-group .mud-button-root:last-child {
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}.mud-input-outlined-border {
    border-width: 1.5px !important;
}.mud-input-outlined.mud-input-focused .mud-input-outlined-border {
    border-width: 2px !important;
}

.mud-input-label {
    margin-bottom: 8px !important;
}

.mud-input-helper-text {
    margin-top: 4px !important;
}.mud-input-error-text {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-top: 4px !important;
}/* ========== DATA GRID & TABLES ========== */
/*
   Modern table design:
   - Column headers: 11px uppercase, letter-spacing, muted color — NOT primary-tinted
   - Rows: clean white surface, thin separator lines
   - Hover: gentle primary tint (5%)
   - No alternating stripes
*/

/* ── MudTable ─────────────────────────────────────────────────── */

.mud-table {
    overflow: hidden !important;
}/* Header cells — uppercase label style */
.mud-table-head .mud-table-cell {
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
    white-space: nowrap !important;
}/* Body cells — thin separator */
.mud-table-cell {
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
}

/* No border on last row */
.mud-table-row:last-child .mud-table-cell {
    border-bottom: none !important;
}

/* Icon alignment */
.mud-table-head .mud-table-cell .mud-icon-root,
.mud-table-cell .mud-icon-root {
    display: inline-flex !important;
    vertical-align: middle !important;
}

.mud-table-head .mud-icon-button,
.mud-table-cell .mud-icon-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ── MudDataGrid ──────────────────────────────────────────────── */

.mud-data-grid {
    overflow: hidden !important;
}/* Header cells — uppercase label style */
.mud-data-grid-header-cell {
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
    white-space: nowrap !important;
}/* Data grid body cells */
.mud-data-grid .mud-table-cell {
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
}

.mud-data-grid .mud-table-row:last-child .mud-table-cell {
    border-bottom: none !important;
}

/* Data grid toolbar (search bar area) */
.mud-data-grid .mud-toolbar {
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
}

/* Icon alignment */
.mud-data-grid .mud-icon-root {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.mud-data-grid .mud-icon-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}/* Pagination */
.mud-pagination {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
}

.mud-pagination-item {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}/* Rows-per-page select: its options popover takes the select's width, so keep it to the size of "200". */
.mud-table-pagination-select {
    flex: 0 0 auto !important;
    width: 88px !important;
    max-width: 88px !important;
}/* Using MudBlazor default padding for dialog content and actions */

/* ========== CHIPS ========== */
.mud-chip {
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
}.mud-chip .mud-icon-root {
    display: inline-flex !important;
    align-items: center !important;
}/* ========== TABS ========== */
.mud-tabs {
    border-bottom: 1px solid var(--mud-palette-divider) !important;
}.mud-tab-slider {
    height: 3px !important;
}

/* ========== DIVIDERS ========== */
.mud-divider {
    opacity: 1 !important;
}.mud-badge-dot {
    min-width: 8px !important;
    height: 8px !important;
}

@keyframes badgePulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}/* ========== PROGRESS ========== */
.mud-progress-linear {
    overflow: hidden;
}@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}/* ========== EXPANSION PANELS ========== */
.mud-expand-panel {
    margin-bottom: 8px !important;
}/* ========== SLIDERS ========== */
.mud-slider {
    height: 6px !important;
}

.mud-slider-thumb {
    width: 18px !important;
    height: 18px !important;
}.mud-input-root-text-area textarea {
    resize: vertical !important;
    min-height: 80px !important;
    line-height: 1.6 !important;
    padding: 10px 14px !important;
}

/* ========== SELECT / AUTOCOMPLETE POPUP ========== */
.mud-popover-paper {
    overflow: hidden !important;
}

.mud-popover .mud-list {
    padding: 6px !important;
}

.mud-popover .mud-list-item {
    margin: 1px 0 !important;
}

.mud-popover .mud-list-item {
    padding-block: 6px !important;
}

.mud-popover .mud-list-item-text {
    margin: 0 !important;
}

.mud-popover .mud-list-item-text p {
    margin: 0 !important;
    line-height: 1.5 !important;
}

.mud-popover .mud-list-item .normal-flag {
    flex-shrink: 0;
    margin: -9.75px -13px;
}.mud-checkbox .mud-icon-button:focus-visible {
    outline: 2px solid var(--mud-palette-primary) !important;
    outline-offset: 2px !important;
}

/* Tri-state indeterminate icon */
.mud-checkbox .mud-checkbox-icon-indeterminate {
    opacity: 0.7 !important;
}

/* ========== MUD SIMPLE TABLE ========== */
.mud-simple-table {
    overflow: hidden !important;
}

.mud-simple-table thead tr th {
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
    padding: 10px 16px !important;
    white-space: nowrap !important;
}.mud-simple-table tbody tr td {
    border-bottom: 1px solid var(--mud-palette-lines-default) !important;
    padding: 10px 16px !important;
}

.mud-simple-table tbody tr:last-child td {
    border-bottom: none !important;
}

/* Tenant Control Center - version picker popover (rendered outside the component, so not scoped) */
.tcc-version-popover {
    min-width: 440px !important;
}

.tcc-version-option {
    display: grid;
    grid-template-columns: minmax(96px, auto) 56px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    width: 100%;
    white-space: nowrap;
}.tcc-version-option__revision {
    overflow: hidden;
    text-overflow: ellipsis;
}

.tcc-version-option__state {
    display: inline-flex;
    justify-content: flex-end;
    min-width: 24px;
}

.tcc-version-option--empty {
    display: block;
    padding: 8px 16px;
}

/* Subdomains grid toolbar - MudBlazor fixes the toolbar at 64px; the bulk bar needs a second row */
.mud-table-toolbar:has(.sd-toolbar) {
    height: auto;
    min-height: 56px;
    padding-block: 8px;
}