/*
 * Shared UI stylesheet.
 * Contains presentation shared by user and administration surfaces.
 * Values must come from design-tokens.css; administration-only rules belong
 * in Sli.Core/admin.css and page CSS contains only exceptional layout.
 */

/* SK: Spoločný navigačný riadok je jeden odkaz vrátane popisu; identita neobsahuje žiadnu akciu.
   EN: A shared navigation row is one link including its description; the identity summary has no action. */
.ui-page .ui-navigation-row { display: flex; align-items: center; gap: var(--ui-space-4); min-width: 0; padding: var(--ui-space-4) var(--ui-space-3); margin-inline: calc(-1 * var(--ui-space-3)); border-radius: var(--ui-radius-input); color: var(--ui-text); text-decoration: none; transition: var(--ui-transition); }
.ui-page .ui-navigation-row:hover { background: var(--ui-admin-soft); color: var(--ui-text); text-decoration: none; }
.ui-page .ui-navigation-row:focus-visible { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-focus-width); }
.ui-navigation-row-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 var(--ui-space-12); width: var(--ui-space-12); height: var(--ui-space-12); border-radius: var(--ui-radius-input); background: var(--ui-primary-soft); color: var(--ui-admin-accent-ink); }
.ui-navigation-row-icon .mud-icon-root { width: var(--ui-length-22px); height: var(--ui-length-22px); }
.ui-navigation-row-copy { display: flex; flex-direction: column; min-width: 0; flex: 1; gap: var(--ui-space-1); overflow-wrap: anywhere; }
.ui-navigation-row-copy strong { color: var(--ui-text); font-size: var(--ui-font-subtitle); font-weight: var(--ui-weight-strong); line-height: 1.3; }
.ui-navigation-row-copy > span { color: var(--ui-muted); font-size: var(--ui-font-body); line-height: 1.4; }
.ui-navigation-row-chevron { flex-shrink: 0; width: var(--ui-length-20px); height: var(--ui-length-20px); color: var(--ui-muted); transition: transform var(--ui-tab-transition-duration) ease; }
.ui-navigation-row:hover .ui-navigation-row-chevron { color: var(--ui-admin-accent-ink); transform: translateX(var(--ui-focus-width)); }
.ui-identity-summary { display: flex; align-items: center; gap: var(--ui-length-14px); min-width: 0; padding: var(--ui-identity-summary-padding); background: var(--ui-soft); border-radius: var(--ui-radius-input); }
.ui-identity-summary .ui-identity-summary-avatar { flex: 0 0 var(--ui-space-12); width: var(--ui-space-12); height: var(--ui-space-12); background: var(--ui-primary); color: var(--ui-on-primary); font-size: var(--ui-identity-summary-name-size); font-weight: var(--ui-weight-strong); }
.ui-identity-summary-copy { display: flex; flex-direction: column; min-width: 0; gap: var(--ui-space-1); overflow-wrap: anywhere; }
.ui-identity-summary-copy strong { font-size: var(--ui-identity-summary-name-size); font-weight: var(--ui-weight-strong); line-height: 1.3; }
.ui-identity-summary-copy span { color: var(--ui-muted); font-size: var(--ui-font-body); line-height: 1.4; }

/* Presentation is scoped to page content, never to portal navigation. */
.ui-page nav:is(.ui-breadcrumb,.user-detail-breadcrumb,.employee-group-breadcrumb) {
 display: flex; align-items: center; flex-wrap: wrap; gap: var(--ui-space-2); min-width: 0;
 color: var(--ui-muted); font-size: var(--ui-admin-breadcrumb-font-size); line-height: 1.5;
}
.ui-page nav:is(.ui-breadcrumb,.user-detail-breadcrumb,.employee-group-breadcrumb) a {
 display: inline-flex; align-items: center; gap: var(--ui-space-2); min-height: var(--ui-admin-breadcrumb-height);
 color: var(--ui-primary); font-weight: var(--ui-weight-strong); text-decoration: none;
}
.ui-page nav:is(.ui-breadcrumb,.user-detail-breadcrumb,.employee-group-breadcrumb) a:hover { text-decoration: underline; }
.ui-page nav:is(.ui-breadcrumb,.user-detail-breadcrumb,.employee-group-breadcrumb) a:focus-visible { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-focus-width); }
.ui-page nav:is(.ui-breadcrumb,.user-detail-breadcrumb,.employee-group-breadcrumb) > span[aria-hidden="true"] { color: var(--ui-admin-breadcrumb-separator-color); }
.ui-page nav:is(.ui-breadcrumb,.user-detail-breadcrumb,.employee-group-breadcrumb) .mud-icon-root { width: var(--ui-admin-breadcrumb-icon-size); height: var(--ui-admin-breadcrumb-icon-size); flex-shrink: 0; }
:is(.admin-content, .portal-content).mud-container {
 max-width: var(--ui-page-max) !important;
 width: 100%;
 padding-inline: var(--ui-page-gutter) !important;
 padding-block: var(--ui-space-8) !important;
 margin-inline: auto;
}
/* SK: Zoznam deklaruje šírku pred načítaním dát. Samotný grid ostáva spätnou
   kompatibilitou pre vložené tabuľky; osobitné šírky zostávajú v nadradených pravidlách.
   EN: Lists declare their width before data loads. The grid itself remains a
   fallback for embedded tables; specific widths remain controlled by overriding rules. */
:is(.admin-content, .portal-content).mud-container:has([data-ui-grid-page="true"], .ui-data-grid) {
 max-width: var(--ui-grid-page-max) !important;
}
/* SK: Nastavenia zachovajú odsadenie portálu a využijú šírku priloženého návrhu bez zmeny ostatných stránok.
   EN: Settings retain portal gutters and use the reference layout width without changing other pages. */
:is(.admin-content, .portal-content).mud-container:has(.profile-settings) {
 max-width: var(--ui-settings-page-max) !important;
}
body:has(.profile-settings) { background-color: var(--ui-admin-background); }
/* SK: Sekciový detail využije aj široký monitor; rozmery hlavičky a ostatných formulárov ostávajú pôvodné.
   EN: A sectioned detail can use a wide monitor; header controls and other forms retain their dimensions. */
.admin-content.mud-container:has(.accident-editor--sectioned) {
 max-width: var(--ui-grid-page-max) !important;
}
:is(.admin-content, .portal-content).mud-container:has(.login-page) {
 max-width: none !important;
}
.portal-content.mud-container:has(.internal-messages-page) {
 max-width: var(--ui-grid-page-max) !important;
 display: flex;
 flex: 1 1 auto;
 min-height: 0;
 flex-direction: column;
 padding-block: var(--ui-space-3) !important;
}
.mud-main-content:has(.internal-messages-page) {
 display: flex;
 flex-direction: column;
 height: 100dvh;
 min-height: 0;
 overflow: hidden;
}
.mud-main-content:has(.internal-messages-page) > .user-context-banner {
 flex: 0 0 auto;
}
.portal-content > .ui-page:has(> .internal-messages-page) {
 display: flex;
 flex: 1 1 auto;
 min-height: 0;
 flex-direction: column;
}
.ui-page:not(:has(.login-page)) { min-width: 0; color: var(--ui-text); font-size: var(--ui-font-body); }
.ui-page:not(:has(.login-page)) > * + :where(:not(.delete-confirmation-backdrop)) { margin-block-start: var(--ui-space-6); }
/* List creation actions share a tight rhythm between the heading and records. */
.ui-page:not(:has(.login-page)):has(> .ui-list-create) > .ui-page-header { margin-bottom: var(--ui-list-action-gap); }
.ui-page:not(:has(.login-page)) > .ui-list-create { margin-block: var(--ui-list-action-gap) 0 !important; }
.ui-page:not(:has(.login-page)) > .ui-list-create + * { margin-top: var(--ui-list-action-gap) !important; }
/* Component descendants are styled here rather than through page CSS isolation. */
.ui-page:not(:has(.login-page)) .ui-panel.admin-card {
 display: flex; flex-direction: column; align-items: flex-start;
 gap: var(--ui-overview-card-gap); min-height: var(--ui-overview-card-min-height);
 padding: var(--ui-overview-card-padding) !important;
}
.ui-page:not(:has(.login-page)) .ui-panel.admin-card > .ui-button { margin-top: calc(var(--ui-overview-action-gap) - var(--ui-overview-card-gap)); }
.ui-page:not(:has(.login-page)) .ui-data-grid.mud-data-grid .mud-table-body .mud-table-cell { font-size: var(--ui-grid-body-font); }
.ui-page:not(:has(.login-page)) .ui-data-grid.mud-data-grid .mud-table-head .mud-table-cell { font-size: var(--ui-grid-heading-font); }
.ui-page:not(:has(.login-page)) .ui-panel.organization-filters {
 display: block;
}
.ui-page:not(:has(.login-page)) .organization-filters .ui-input .mud-input-label { margin-bottom: var(--ui-filter-label-gap); }
@media (max-width: 959.98px) {
 .ui-page:not(:has(.login-page)) .ui-panel.organization-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599.98px) {
 .ui-page:not(:has(.login-page)) .ui-panel.organization-filters { grid-template-columns: minmax(0, 1fr); }
}
.ui-page:not(:has(.login-page)) .ui-page-navigation { display: flex; justify-content: flex-start; margin-bottom: var(--ui-space-4); }
.ui-page:not(:has(.login-page)) .ui-page-header {
 width: 100%; max-width: var(--ui-header-max);
 display: flex; align-items: center; flex-wrap: wrap; gap: var(--ui-space-5);
 padding: var(--ui-header-padding); margin: 0 0 var(--ui-space-8);
 border: var(--ui-border-width) solid var(--ui-divider); border-radius: var(--ui-radius);
 background: linear-gradient(120deg,var(--ui-surface),var(--ui-primary-soft)); box-shadow: var(--ui-shadow);
}
.ui-page-header-copy { flex: 1; min-width: 0; }
.ui-page:not(:has(.login-page)) .ui-page-title { margin: 0; color: var(--ui-text); font-size: var(--ui-font-title); font-weight: var(--ui-weight-title); letter-spacing: var(--ui-length-negative-d035em); line-height: 1.2; overflow-wrap: anywhere; }
.ui-page:not(:has(.login-page)) .ui-page-eyebrow { color: var(--ui-primary); font-size: var(--ui-font-xs); font-weight: var(--ui-weight-strong); text-transform: uppercase; letter-spacing: var(--ui-length-d06em); margin-bottom: var(--ui-space-2); }
.ui-page:not(:has(.login-page)) .ui-page-description { color: var(--ui-muted); font-size: var(--ui-font-body); margin-top: var(--ui-space-3); line-height: 1.5; }
.ui-page:not(:has(.login-page)) .ui-page-header-icon { width: var(--ui-header-icon-size); height: var(--ui-header-icon-size); padding: var(--ui-space-3); color: var(--ui-primary); background: var(--ui-primary-soft); border-radius: var(--ui-radius-input); flex: none; }
.ui-page-header-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: var(--ui-space-3); margin-inline-start: auto; }
.ui-page-header-footer { flex: 0 0 100%; min-width: 0; padding-top: var(--ui-space-5); border-top: var(--ui-border-width) solid var(--ui-divider); }
.ui-page:not(:has(.login-page)) > .ui-sticky-action-bar {
 position: sticky; top: calc(var(--admin-header-height, var(--ui-length-64px)) + var(--ui-space-3)); z-index: 20;
 display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: var(--ui-space-3);
 width: 100%; padding: var(--ui-space-3) var(--ui-space-4);
 border: var(--ui-border-width) solid var(--ui-divider); border-radius: var(--ui-radius-input);
 background: var(--ui-surface); box-shadow: var(--ui-shadow);
}
.ui-sticky-action-bar-help { display: flex; align-items: center; flex: 0 0 auto; order: -2; margin-inline-end: auto; }
.ui-sticky-action-bar-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: var(--ui-space-3); }
.ui-sticky-action-bar-actions > button.ui-button { display: inline-flex; align-items: center; justify-content: center; gap: var(--ui-space-2); cursor: pointer; }
.admin-content .ui-back-button { order: 99; margin-inline-start: auto; }
.admin-content .ui-sticky-action-bar .ui-back-button { margin-inline-start: 0; }
/* SK: Kompaktný variant dlhého formulára ponechá na mobile nápovedu a návrat v prvom riadku,
   ostatné akcie v druhom. Rozmery a oprávnenia tlačidiel ostávajú pôvodné.
   EN: The compact long-form variant keeps help and back on the first mobile row and other actions
   on the second. Button dimensions and authorization remain unchanged. */
@media (max-width: 599px) {
 .ui-page:not(:has(.login-page)) > .ui-sticky-action-bar.ui-action-bar-compact { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--ui-space-2); padding: var(--ui-space-2) var(--ui-space-3); }
 .ui-action-bar-compact .ui-sticky-action-bar-help { grid-column: 1; grid-row: 1; margin: 0; }
 .ui-action-bar-compact > .ui-back-button { grid-column: 2; grid-row: 1; justify-self: end; }
 .ui-action-bar-compact .ui-sticky-action-bar-actions { grid-column: 1 / -1; grid-row: 2; gap: var(--ui-space-2); min-width: 0; }
}
.ui-page:not(:has(.login-page)) .ui-panel {
 min-width: 0; max-width: 100%; padding: var(--ui-panel-padding) !important;
 border: var(--ui-border-width) solid var(--ui-divider); border-radius: var(--ui-radius) !important;
 background: var(--ui-surface); box-shadow: var(--ui-shadow) !important;
}
:is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator) { box-sizing: border-box; height: var(--ui-button-height) !important; min-height: var(--ui-button-height); display: inline-flex; align-items: center; justify-content: center; }
.ui-page:not(:has(.login-page)) :is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator), :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) :is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator) {
 --ui-button-color: var(--ui-text);
 min-width: 0; padding: 0 var(--ui-space-4) !important;
 border: var(--ui-length-1px) solid var(--ui-border) !important; border-radius: var(--ui-radius-input) !important;
 color: var(--ui-button-color) !important; background: var(--ui-surface) !important;
 font-size: var(--ui-font-sm); font-weight: var(--ui-weight-strong); letter-spacing: 0; text-transform: none;
 box-shadow: none !important; transform: none !important; transition: var(--ui-transition);
}
.ui-page:not(:has(.login-page)) .ui-button-primary, :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) .ui-button-primary {
 --ui-button-color: var(--ui-primary);
 border-color: var(--ui-primary) !important; color: var(--ui-on-primary) !important;
 background: var(--ui-primary) !important;
}
.ui-page:not(:has(.login-page)) .ui-button-danger, :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) .ui-button-danger {
 --ui-button-color: var(--ui-error);
 border-color: var(--ui-error) !important; color: var(--ui-error) !important;
 background: var(--ui-surface) !important;
}
.ui-page:not(:has(.login-page)) :is(.ui-button-secondary, :where(.ui-secondary-menu) > .mud-menu-button-activator):hover:not(:disabled), :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) :is(.ui-button-secondary, :where(.ui-secondary-menu) > .mud-menu-button-activator):hover:not(:disabled) { border-color: var(--ui-text) !important; background: var(--ui-soft) !important; }
.ui-page:not(:has(.login-page)) .ui-button-primary:hover:not(:disabled), :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) .ui-button-primary:hover:not(:disabled) { background: var(--ui-color-8b1752) !important; border-color: var(--ui-color-8b1752) !important; }
.ui-page:not(:has(.login-page)) .ui-button-danger:hover:not(:disabled), :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) .ui-button-danger:hover:not(:disabled) { background: var(--ui-primary-soft) !important; }
.ui-page:not(:has(.login-page)) :is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator):focus-visible, :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) :is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator):focus-visible { outline: var(--ui-focus-width) solid var(--ui-button-color); outline-offset: var(--ui-focus-width); }
.ui-page:not(:has(.login-page)) :is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator):disabled, :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) :is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator):disabled { opacity: .45; cursor: default; }
.ui-page:not(:has(.login-page)) .ui-button[aria-pressed="true"] { box-shadow: 0 0 0 var(--ui-length-2px) var(--ui-focus) !important; }
:is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator) .mud-button-label { gap: var(--ui-space-2); }
:is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator) .mud-button-icon-start { margin-inline: 0; }
:is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator) .mud-icon-root { width: var(--ui-icon); height: var(--ui-icon); }
.ui-page:not(:has(.login-page)) .mud-icon-button .mud-icon-root { width: var(--ui-icon); height: var(--ui-icon); }
.ui-page:not(:has(.login-page)) .ui-sticky-action-bar-help .mud-icon-button .mud-icon-root { width: var(--ui-help-icon-size); height: var(--ui-help-icon-size); }
.ui-page:not(:has(.login-page)) :is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator) .mud-button-label, :is(.ui-modal, .internal-message-calendar-actions, .ui-date-time-popover) :is(.ui-button, :where(.ui-secondary-menu) > .mud-menu-button-activator) .mud-button-label { white-space: nowrap; }
.ui-page:not(:has(.login-page)) .ui-field { display: flex; flex-direction: column; gap: var(--ui-space-2); min-width: 0; }
.ui-page:not(:has(.login-page)) .ui-field:is(.wide,.form-field-wide) { grid-column: 1 / -1; }
.ui-page:not(:has(.login-page)) .ui-field.checkbox-field { flex-direction: row; align-items: center; min-height: var(--ui-checkbox-hit-area); gap: var(--ui-space-3); }
.ui-page:not(:has(.login-page)) :is(.ui-field,form) label { color: var(--ui-text); font-weight: var(--ui-weight-strong); }
.ui-page:not(:has(.login-page)) :is(.ui-field-help,.ui-field small,form small,.mud-input-helper-text) { color: var(--ui-muted); font-size: var(--ui-font-xs); }
.ui-page:not(:has(.login-page)) :is(.ui-field-error,.validation-message,.mud-input-error .mud-input-helper-text) { color: var(--ui-error); font-size: var(--ui-font-xs); }
.ui-page:not(:has(.login-page)) form :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not(.mud-input-root),select,textarea:not(.mud-input-root)) {
 box-sizing: border-box; width: 100%; min-width: 0; min-height: var(--ui-field-height);
 padding: var(--ui-space-3) var(--ui-space-4); border: var(--ui-border-width) solid var(--ui-border); border-radius: var(--ui-radius-input);
 color: var(--ui-text); background: var(--ui-surface); font: inherit; transition: var(--ui-transition);
}
.ui-page:not(:has(.login-page)) form :is(input,select,textarea):focus-visible { outline: var(--ui-focus-width) solid var(--ui-focus); outline-offset: var(--ui-border-width); border-color: var(--ui-primary); }
.ui-page:not(:has(.login-page)) form :is(input,select,textarea):not(:is(.mud-checkbox-input,.mud-switch-input,input[type="file"])):disabled { opacity: .55; background: var(--ui-soft); }
.ui-page:not(:has(.login-page)) form input[type="radio"] { accent-color: var(--ui-primary); }

/* Checkbox geometry is shared by native forms and MudBlazor. */
.ui-page:not(:has(.login-page)) form label:has(> input[type="checkbox"]) {
 display: inline-flex; align-items: center; gap: var(--ui-space-3);
 min-height: var(--ui-checkbox-hit-area); cursor: pointer;
}
.ui-page:not(:has(.login-page)) form label:has(> input[type="checkbox"]:disabled) { cursor: default; }
.ui-page:not(:has(.login-page)) form input[type="checkbox"]:not(:is(.mud-checkbox-input,.mud-switch-input)) {
 appearance: none; -webkit-appearance: none; box-sizing: border-box; flex: none;
 width: var(--ui-checkbox-size); height: var(--ui-checkbox-size); margin: 0;
 border: var(--ui-length-2px) solid var(--ui-control-off); border-radius: var(--ui-checkbox-radius);
 background-color: var(--ui-surface); cursor: pointer; transition: var(--ui-transition);
}
.ui-page:not(:has(.login-page)) form input[type="checkbox"]:not(:is(.mud-checkbox-input,.mud-switch-input)):checked {
 border-color: var(--ui-primary); background-color: var(--ui-primary);
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='m5 11 4 4 8-9' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
 background-position: center; background-repeat: no-repeat; background-size: 100% 100%;
}
.ui-page:not(:has(.login-page)) form input[type="checkbox"]:not(:is(.mud-checkbox-input,.mud-switch-input)):hover:not(:disabled) { box-shadow: 0 0 0 var(--ui-length-5px) var(--ui-primary-soft); }
.ui-page:not(:has(.login-page)) form input[type="checkbox"]:not(:is(.mud-checkbox-input,.mud-switch-input)):focus-visible { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-length-3px); }
.ui-page:not(:has(.login-page)) form input[type="checkbox"]:not(:is(.mud-checkbox-input,.mud-switch-input)):disabled {
 border-color: var(--ui-control-disabled); background-color: var(--ui-soft);
 cursor: default; opacity: 1;
}
.ui-page:not(:has(.login-page)) form input[type="checkbox"]:not(:is(.mud-checkbox-input,.mud-switch-input)):checked:disabled {
 background-color: var(--ui-control-disabled);
}
@media (forced-colors: active) {
 .ui-page:not(:has(.login-page)) form input[type="checkbox"]:not(:is(.mud-checkbox-input,.mud-switch-input)) { appearance: auto; -webkit-appearance: checkbox; }
}
/* Checked controls use the customer theme; off and disabled are neutral. */
/* SK: Spoločný label prepínača zachová 12 px medzi ovládačom a textom; celý label ostáva klikateľný.
   EN: Shared switch labels retain 12 px between the control and text; the entire label remains clickable. */
label.mud-switch:has(> .mud-typography) { gap: var(--ui-space-3); }
.mud-switch-base.mud-checked:not(.mud-switch-disabled) { color: var(--ui-primary) !important; }
.mud-switch-base.mud-checked:not(.mud-switch-disabled) + .mud-switch-track { background-color: var(--ui-primary) !important; }
.mud-switch-base:not(.mud-checked):not(.mud-switch-disabled) + .mud-switch-track { background-color: var(--ui-control-off) !important; }
.mud-switch-base.mud-switch-disabled { color: var(--ui-control-disabled) !important; }
.mud-switch-base.mud-switch-disabled + .mud-switch-track { background-color: var(--ui-control-disabled) !important; }
.mud-checkbox { min-height: var(--ui-checkbox-hit-area); align-items: center; gap: var(--ui-space-3); }
.mud-checkbox .mud-button-root {
 position: relative; box-sizing: border-box; flex: none;
 width: var(--ui-checkbox-hit-area); height: var(--ui-checkbox-hit-area);
 display: inline-flex; align-items: center; justify-content: center;
}
.mud-checkbox .mud-button-root::before {
 content: ""; position: absolute; width: var(--ui-checkbox-size); height: var(--ui-checkbox-size);
 box-sizing: border-box; border: var(--ui-length-2px) solid var(--ui-control-off);
 border-radius: var(--ui-checkbox-radius); background: var(--ui-surface);
 pointer-events: none; transition: var(--ui-transition);
}
.mud-checkbox .mud-icon-root { visibility: hidden; }
.mud-checkbox:has(.mud-checkbox-input:checked) .mud-button-root::before,
.mud-checkbox .mud-button-root.mud-checkbox-true::before {
 border-color: var(--ui-primary); background-color: var(--ui-primary);
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='m5 11 4 4 8-9' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
 background-position: center; background-repeat: no-repeat; background-size: 100% 100%;
}
.mud-checkbox:has(.mud-checkbox-input:indeterminate) .mud-button-root::before,
.mud-checkbox .mud-button-root.mud-checkbox-indeterminate::before {
 border-color: var(--ui-primary); background-color: var(--ui-primary);
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M5 11h12' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
 background-position: center; background-repeat: no-repeat; background-size: 100% 100%;
}
.mud-checkbox .mud-button-root:hover:not(.mud-disabled)::before { box-shadow: 0 0 0 var(--ui-length-5px) var(--ui-primary-soft); }
.mud-checkbox:has(.mud-checkbox-input:focus-visible) .mud-button-root { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-length-2px); }
.mud-checkbox:has(.mud-checkbox-input:disabled) .mud-button-root::before,
.mud-checkbox.mud-disabled .mud-button-root::before {
 border-color: var(--ui-control-disabled); background-color: var(--ui-soft);
}
.mud-checkbox:has(.mud-checkbox-input:checked:disabled) .mud-button-root::before,
.mud-checkbox.mud-disabled .mud-button-root.mud-checkbox-true::before { background-color: var(--ui-control-disabled); }
.mud-data-grid .mud-table-cell .mud-checkbox {
 margin: 0; min-width: var(--ui-checkbox-hit-area);
 min-height: var(--ui-checkbox-hit-area);
}
.mud-data-grid .mud-table-cell .mud-checkbox > .mud-button-root {
 box-sizing: border-box; padding: 0;
 width: var(--ui-checkbox-hit-area); height: var(--ui-checkbox-hit-area);
}
@media (forced-colors: active) {
 .mud-checkbox .mud-button-root::before { display: none; }
 .mud-checkbox .mud-icon-root { visibility: visible; }
}
.ui-page:not(:has(.login-page)) .ui-input .mud-input-outlined { overflow: hidden; border-radius: var(--ui-radius-input); background: var(--ui-surface); }
.ui-page:not(:has(.login-page)) .ui-input .mud-input-outlined-border { border-color: var(--ui-border); border-radius: var(--ui-radius-input); }
.ui-page:not(:has(.login-page)) .ui-input .mud-input-outlined:focus-within .mud-input-outlined-border { border-color: var(--ui-primary); }
.ui-page:not(:has(.login-page)) .ui-input.mud-input-control { margin-block-start: var(--ui-space-2); }
.ui-page:not(:has(.login-page)) .ui-input .mud-input-label { font-weight: var(--ui-weight-strong); }
/* SK: Dlhá nápoveda sa môže zalomiť; počítadlo znakov zostáva čitateľné v jednom riadku aj na mobile.
   EN: Long helper text may wrap; keep the character counter readable on one line on mobile. */
.ui-page .ui-input .mud-input-control-helper-container .mud-input-helper-text { gap: var(--space-2); }
.ui-page .ui-input .mud-input-control-helper-container .mud-input-helper-text > .ms-auto { flex-shrink: 0; white-space: nowrap; }
.ui-page:not(:has(.login-page)) .ui-input .mud-input-error .mud-input-outlined-border { border-color: var(--ui-error); }
.ui-page:not(:has(.login-page)) :is(.user-form-grid,.technical-grid,.email-template-grid,.create-card .grid,.form-grid) {
 display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--ui-space-6);
}
.ui-page:not(:has(.login-page)) :is(.translation-grid,.permission-grid,.role-grid) {
 display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,var(--ui-dimension-260px)),1fr)); gap: var(--ui-space-4);
}
/* User-role selection keeps the checkbox, name and optional metadata in fixed columns. */
.ui-page:not(:has(.login-page)) .roles-card .role-grid {
 grid-template-columns: repeat(3,minmax(0,1fr)); grid-auto-rows: 1fr; align-items: stretch;
 gap: var(--ui-space-3);
}
.ui-page:not(:has(.login-page)) .roles-card .role-grid > label.role-tile {
 display: grid; grid-template-columns: var(--ui-checkbox-size) minmax(0,1fr);
 align-items: start; align-content: start; gap: var(--ui-space-3);
 min-width: 0; min-height: var(--ui-role-tile-min-height); box-sizing: border-box;
 padding: var(--ui-space-4); border: var(--ui-border-width) solid var(--ui-border);
 border-radius: var(--ui-radius-input); background: var(--ui-surface); transition: var(--ui-transition);
}
.ui-page:not(:has(.login-page)) .roles-card .role-tile:hover { background: var(--ui-soft); }
.ui-page:not(:has(.login-page)) .roles-card .role-tile:has(> input:checked) { border-color: var(--ui-primary); background: var(--ui-primary-soft); }
.ui-page:not(:has(.login-page)) .roles-card .role-tile:has(> input:focus-visible) { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-border-width); }
.ui-page:not(:has(.login-page)) .roles-card .role-tile-copy { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ui-space-2); min-width: 0; }
.ui-page:not(:has(.login-page)) .roles-card .role-tile-title { font-size: var(--ui-font-body); font-weight: var(--ui-weight-strong); line-height: 1.4; overflow-wrap: anywhere; }
.ui-page:not(:has(.login-page)) .roles-card .role-tile-code { font-size: var(--ui-font-xs); color: var(--ui-muted); overflow-wrap: anywhere; }
.ui-page:not(:has(.login-page)) .roles-card .role-tile-badge { display: inline-flex; padding: var(--ui-space-1) var(--ui-space-2); border-radius: var(--ui-radius-small); background: var(--ui-soft); color: var(--ui-muted); font-size: var(--ui-font-xs); font-weight: var(--ui-weight-medium); }
@media (max-width: 959.98px) {
 .ui-page:not(:has(.login-page)) .roles-card .role-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 599.98px) {
 .ui-page:not(:has(.login-page)) .roles-card .role-grid { grid-template-columns: minmax(0,1fr); }
}
.ui-page:not(:has(.login-page)) .translation-grid fieldset { min-width: 0; border: var(--ui-border-width) solid var(--ui-border); border-radius: var(--ui-radius-input); padding: var(--ui-space-4); }
.ui-page:not(:has(.login-page)) :is(.actions,.form-actions,.email-template-actions,.admin-actions,.detail-navigation) {
 display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-space-3);
}
.ui-page:not(:has(.login-page)) :is(.actions,.form-actions,.email-template-actions) { justify-content: flex-end; margin-top: var(--ui-space-8); }
.ui-page:not(:has(.login-page)) :is(.actions,.admin-actions):empty { display: none; }
.ui-page:not(:has(.login-page)) .ui-data-grid { width: 100%; border-radius: var(--ui-radius-grid) !important; }
.ui-page:not(:has(.login-page)) .ui-data-grid .ui-input { margin: 0; }
.ui-page:not(:has(.login-page)) .ui-empty-state {
 display: flex; flex-direction: column; align-items: center; justify-content: center;
 gap: var(--ui-space-3); padding: var(--ui-space-8); text-align: center; color: var(--ui-muted);
}
.ui-page:not(:has(.login-page)) .ui-empty-state > .mud-icon-root { color: var(--ui-primary); }
.ui-page:not(:has(.login-page)) .ui-alert { border-radius: var(--ui-radius-input); padding: var(--ui-space-4); box-shadow: none; }
/* SK: Voliteľný kompaktný oznam má jedno spoločné odsadenie bez vnoreného paddingu textu/ikony.
   EN: Optional compact alerts own spacing centrally without nested message/icon padding. */
.ui-page:not(:has(.login-page)) .ui-alert.ui-alert-compact { padding:var(--space-3) var(--space-4); align-items:center; }
.ui-alert.ui-alert-compact .mud-alert-message { padding:0; min-width:0; }
.ui-alert.ui-alert-compact .mud-alert-icon { padding-block:0; align-self:center; }
.ui-modal { border: var(--ui-border-width) solid var(--ui-divider); border-radius: var(--ui-radius); background: var(--ui-surface); padding: var(--ui-panel-padding); box-shadow: var(--ui-shadow); }
.ui-attachment-confirmation-content { display: flex; flex-direction: column; gap: var(--ui-space-4); }
.ui-attachment-confirmation-content > * { margin: 0; }
.ui-attachment-confirmation-body { overflow-wrap: anywhere; }
.ui-attachment-confirmation-content > .ui-attachment-confirmation-actions {
 display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;
 gap: var(--ui-space-3); margin-top: var(--ui-space-1);
}
.mud-snackbar { border-radius: var(--ui-radius-input); box-shadow: var(--ui-shadow); }
/* Snackbar items add a 16px top margin; keep the first one between the header and page actions. */
#mud-snackbar-container.mud-snackbar-location-top-right { top: calc(var(--ui-space-4rem) - var(--ui-space-3)); }
.ui-page:not(:has(.login-page)) :is(.admin-hero,.welcome-section) { max-width: none; margin: 0 0 var(--ui-space-8); text-align: start; }
.ui-page:not(:has(.login-page)) .welcome-accent { display: none; }
.ui-page:not(:has(.login-page)) .ui-panel.user-detail-card { max-width: 100%; }
.ui-page:not(:has(.login-page)) .ui-panel.activity-card { padding: 0 !important; }
.ui-page:not(:has(.login-page)) .login-form { max-width: 100%; }
.ui-page:not(:has(.login-page)) .mud-container { max-width: 100%; padding: 0; }
.ui-page:not(:has(.login-page)) .mud-icon-button:focus-visible { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-focus-width); }
.ui-page:not(:has(.login-page)) .mud-icon-button { transition: var(--ui-transition); }
/* Shared breakpoints follow MudBlazor: sm 600, md 960, lg 1280. */
@media (max-width: 599.98px) {
 .ui-page:not(:has(.login-page)) :is(.user-form-grid,.technical-grid,.email-template-grid,.create-card .grid,.form-grid) { grid-template-columns: minmax(0,1fr); }
 .ui-page:not(:has(.login-page)) .ui-page-header { padding: var(--ui-space-5); align-items: flex-start; }
 .ui-page-header-actions { width: 100%; }
 .ui-page:not(:has(.login-page)) :is(.actions,.form-actions,.email-template-actions) .ui-button { flex: 1 1 auto; }
 .ui-page:not(:has(.login-page)) .ui-field:is(.wide,.form-field-wide) { grid-column: auto; }
 .ui-page:not(:has(.login-page)) .ui-panel { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
 .ui-page:not(:has(.login-page)) *, .ui-modal * { transition: none !important; animation-duration: .01ms !important; }
}

.ui-page:not(:has(.login-page)) .ui-input .mud-input-outlined:not(.mud-input-multiline) { min-height: var(--ui-field-height); }
.ui-page:not(:has(.login-page)) .ui-input .mud-input-outlined:not(.mud-input-multiline) .mud-input-root { padding-block: var(--ui-space-3); }

.ui-page:not(:has(.login-page)) :is(.detail-form form,.authorization-form form,.translation-grid fieldset) { display: flex; flex-direction: column; gap: var(--ui-space-2); }
.ui-page:not(:has(.login-page)) :is(.role-grid,.permission-grid) label { display: flex; flex-wrap: wrap; gap: var(--ui-space-3); align-items: start; padding: var(--ui-space-4); border-radius: var(--ui-radius-input); background: var(--ui-soft); }
.ui-page:not(:has(.login-page)) .permission-grid small { width: 100%; }
.ui-page:not(:has(.login-page)) :is(.wide,.form-field-wide) { grid-column: 1 / -1; }
.ui-page:not(:has(.login-page)) .ui-alert.mud-alert-outlined-error { color: var(--ui-error); }
.ui-page:not(:has(.login-page)) .ui-alert.mud-alert-outlined-success { color: var(--ui-success); }
.ui-page:not(:has(.login-page)) .ui-alert.mud-alert-outlined-warning { color: var(--ui-warning); }
.ui-page:not(:has(.login-page)) .ui-alert.mud-alert-outlined-info { color: var(--ui-secondary); }

/* External labels match native form fields; MudBlazor still owns validation and binding. */
.ui-page:not(:has(.login-page)) .ui-input:has(.mud-input-label) { margin: 0; padding: 0; }
/* Inline pickers wrap their input control; normalize its spacing as well. */
.ui-page:not(:has(.login-page)) .ui-input.mud-picker-inline > .mud-input-control { margin: 0; }
/* An external FormField label already supplies the spacing above its control. */
.ui-page:not(:has(.login-page)) .ui-field .ui-input.mud-input-control { margin: 0; padding: 0; }
.ui-page:not(:has(.login-page)) [data-ui-aligned-control] { margin-block-start: var(--ui-field-alignment-offset); }
.ui-page:not(:has(.login-page)) [data-ui-aligned-cell] { align-self: start; }
.ui-page:not(:has(.login-page)) .ui-input .mud-input-control-input-container { display: flex; flex-direction: column; }
.ui-page:not(:has(.login-page)) .ui-input .mud-input-label {
 position: static; order: -1; transform: none !important;
 margin: 0 0 var(--ui-space-2); padding: 0 !important; align-self: flex-start;
 font-size: var(--ui-font-body); line-height: 1.5; color: var(--ui-text);
 white-space: normal; max-width: 100%; overflow-wrap: anywhere;
}
.ui-page:not(:has(.login-page)) .ui-input .mud-input-outlined-border legend { display: none; }
.ui-page:not(:has(.login-page)) form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not(.mud-input-root),
.ui-page:not(:has(.login-page)) form select { height: var(--ui-field-height); padding-block: var(--ui-space-2); }
.ui-page:not(:has(.login-page)) .ui-panel textarea:not(.mud-input-root) { resize: vertical; }
.ui-page:not(:has(.login-page)) .ui-page-navigation .ui-back-button { margin: 0; }
@media print { .ui-page-navigation { display: none !important; } }

/* Keep MudBlazor's 310px date/time picker inside narrow mobile viewports. */
@media (max-width: 359.98px) {
 .mud-picker-popover.mud-popover-open { left: max(var(--ui-length-5px), calc(50vw - var(--ui-length-155px))) !important; }
}


.ui-choice-popover .ui-choice-count {
 padding: var(--ui-space-2) var(--ui-space-4);
 color: var(--ui-muted);
 border-top: var(--ui-border-width) solid var(--ui-divider);
 background: var(--ui-soft);
 font-size: var(--ui-font-xs);
}

.ui-choice-popover { border: var(--ui-border-width) solid var(--ui-border); border-radius: var(--ui-radius-input); box-shadow: 0 var(--ui-length-8px) var(--ui-length-24px) color-mix(in srgb, var(--ui-text) 10%, transparent); overflow: hidden; }
.ui-choice-popover .mud-list { padding: var(--ui-space-1); }
.ui-choice-popover .mud-autocomplete-after-items:has(.ui-choice-count) { position: sticky; bottom: calc(-1 * var(--ui-space-1)); z-index: 2; margin: 0 calc(-1 * var(--ui-space-1)) calc(-1 * var(--ui-space-1)); background: var(--ui-soft); isolation: isolate; }
.ui-choice-popover .mud-list-item { min-height: var(--ui-checkbox-hit-area); border-radius: var(--ui-radius-small); padding: var(--ui-space-2) var(--ui-space-3); }
.ui-choice-popover .mud-list-item-text { min-width: 0; margin-block: 0; overflow-wrap: anywhere; }
.ui-choice-popover .mud-list-item:hover { background: var(--ui-soft); }
.ui-choice-popover :is(.mud-list-item-selected, [aria-selected="true"]) { background: var(--ui-primary-soft); color: var(--ui-primary); font-weight: var(--ui-weight-medium); }
.ui-choice-popover :is(.mud-list-item-selected, [aria-selected="true"]):not(:has(.mud-checkbox))::after { content: "\2713"; margin-inline-start: var(--ui-space-3); font-weight: var(--ui-weight-strong); }

.ui-date-time-popover { width: var(--ui-length-320px); max-width: calc(100vw - var(--ui-length-24px)); border: var(--ui-border-width) solid var(--ui-border); border-radius: var(--ui-radius-input); background: var(--ui-surface); padding: var(--ui-space-3); box-shadow: 0 var(--ui-length-8px) var(--ui-length-24px) color-mix(in srgb, var(--ui-text) 12%, transparent); z-index: 1401 !important; }
.ui-date-time-overlay { z-index: 1400 !important; background: transparent !important; }
.ui-date-time-popover .mud-picker, .ui-date-time-popover .mud-picker-calendar { width: 100%; min-width: 0; }
.ui-date-time-popover .mud-picker-calendar-container { padding: 0; }
.ui-date-time-popover .mud-picker-calendar-day { border-radius: var(--ui-radius-small); }
/* SK: Vyskakovací AppDatePicker preberá rovnaký rámik, povrch a focus ako spoločný dátum/čas.
   EN: Popup AppDatePicker shares the border, surface and focus of the shared date/time calendar.
   SK: Ide iba o prezentáciu; parser, výber dátumu a validačné pravidlá zostávajú bez zmeny.
   EN: Presentation only; date parsing, selection and validation rules remain unchanged. */
.mud-picker-popover {
 border: var(--ui-border-width) solid var(--ui-border);
 border-radius: var(--ui-radius-input);
 background: var(--ui-surface);
 color: var(--ui-text);
 box-shadow: 0 var(--ui-length-8px) var(--ui-length-24px) color-mix(in srgb, var(--ui-text) 12%, transparent);
 overflow: hidden;
}
.mud-picker-popover .mud-picker { background: var(--ui-surface); color: var(--ui-text); box-shadow: none; }
.mud-picker-popover :is(.mud-day, .mud-picker-calendar-day) { border-radius: var(--ui-radius-small); }
.mud-picker-popover button:focus-visible { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-length-1px); }
.ui-date-time-clock { display: flex; align-items: center; justify-content: space-between; gap: var(--ui-space-3); padding-block: var(--ui-space-3); border-top: var(--ui-border-width) solid var(--ui-divider); font-size: var(--ui-font-sm); }
.ui-date-time-clock > div { display: flex; align-items: center; gap: var(--ui-space-1); }
.ui-date-time-clock input { width: var(--ui-length-52px); height: var(--ui-length-40px); padding: var(--ui-space-1); text-align: center; border: var(--ui-border-width) solid var(--ui-border); border-radius: var(--ui-radius-small); color: var(--ui-text); background: var(--ui-surface); font: inherit; }
.ui-date-time-actions, .ui-date-time-actions > div { display: flex; align-items: center; justify-content: space-between; gap: var(--ui-space-2); }
.ui-date-time-actions .ui-button { padding-inline: var(--ui-space-3); }
.ui-date-time-today { border: 0; background: transparent; color: var(--ui-primary); font: inherit; font-weight: var(--ui-weight-medium); cursor: pointer; }
.ui-date-time-popover :is(button,input):focus-visible { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-length-1px); }

/* Grids and application bars retain their original inherited dimensions. */
:is(.ui-data-grid,.admin-appbar,.portal-appbar) {
 --ui-panel-padding: var(--ui-preserved-panel-padding);
 --ui-header-padding: var(--ui-preserved-header-padding);
 --ui-field-height: var(--ui-preserved-field-height);
 --ui-button-height: var(--ui-preserved-button-height);
 --ui-icon: var(--ui-preserved-icon);
 --ui-space-5: var(--ui-preserved-space-5);
 --ui-space-6: var(--ui-preserved-space-6);
 --ui-space-8: var(--ui-preserved-space-8);
 --ui-space-9: var(--ui-preserved-space-9);
 --ui-space-10: var(--ui-preserved-space-10);
 --ui-space-12: var(--ui-preserved-space-12);
 --ui-checkbox-hit-area: var(--ui-preserved-checkbox-hit-area);
 --ui-user-detail-profile-avatar-size: var(--ui-preserved-user-detail-profile-avatar-size);
 --ui-user-detail-section-header-height: var(--ui-preserved-user-detail-section-header-height);
 --ui-user-detail-section-icon-size: var(--ui-preserved-user-detail-section-icon-size);
 --ui-compact-control-height: var(--ui-preserved-compact-control-height);
 --ui-header-icon-size: var(--ui-preserved-header-icon-size);
 --ui-font-field: var(--ui-preserved-font-field);
 --ui-font-label: var(--ui-preserved-font-label);
 --ui-font-help: var(--ui-preserved-font-help);
 --ui-font-button: var(--ui-preserved-font-button);
 --ui-font-list: var(--ui-preserved-font-list);
 --ui-button-min-width: var(--ui-preserved-button-min-width);
 --ui-hit-size: var(--ui-preserved-hit-size);
 --ui-option-height: var(--ui-preserved-option-height);
}

/* Actual control geometry; no content scaling is used. */
.ui-page :is(h1,.mud-typography-h4):not(.rz-html-editor-content *):not(.ui-data-grid *) { font-size: var(--ui-font-title) !important; }
.ui-page :is(h2,.mud-typography-h6):not(.rz-html-editor-content *):not(.ui-data-grid *) { font-size: var(--ui-font-subtitle) !important; }
.ui-page .ui-section-heading { margin:0 0 var(--ui-space-5); color:var(--ui-text); font-size:var(--ui-font-subtitle); font-weight:var(--ui-weight-strong); line-height:1.3; }
.ui-page .ui-detail-values { margin: 0; }
/* SK: Zdieľaný variant formulára podľa manuálu 2.3. Rozostupy zostávajú centrálne,
   opt-in trieda neprepisuje staršie stránky ani veľkosti gridov.
   EN: Shared form variant follows manual 2.3. Spacing remains centralized;
   the opt-in class does not override older pages or grid dimensions. */
.ui-spaced-form { display:flex; flex-direction:column; gap:var(--space-5); min-width:0; }
.ui-spaced-form .ui-breadcrumb,.ui-spaced-form .ui-page-header { margin:0; }
.ui-spaced-form .ui-breadcrumb { flex-wrap:wrap; }
.ui-spaced-form .ui-breadcrumb a { gap:var(--space-2); }
.ui-page .ui-spaced-form .ui-form-actions { position:sticky; top:calc(var(--admin-header-height,var(--ui-length-64px)) + var(--space-3)); z-index:20; display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:var(--space-2); padding:var(--space-3) var(--space-4); border:var(--ui-border-width) solid var(--ui-divider); border-radius:var(--ui-radius); background:var(--ui-surface); box-shadow:var(--ui-shadow); }
.ui-spaced-form .ui-form-actions > .ui-back-button { order:0; margin-inline-start:0; }
.ui-spaced-form .ui-form-actions .ui-sticky-action-bar-actions { order:1; gap:var(--space-2); }
.ui-spaced-form .ui-form-actions .mud-button-label { gap:var(--space-2); }
.ui-spaced-form .ui-form-actions .mud-button-icon-start { margin:0; }
.ui-form-columns { display:grid; grid-template-columns:minmax(0,3fr) minmax(16rem,1fr); gap:var(--space-5); align-items:start; }
.ui-form-columns > * { min-width:0; }
/* SK: Opt-in pravidlo prekoná kompaktné odsadenie panelov; ostatné karty ostávajú pôvodné.
   EN: The opt-in rule overrides compact panel padding while other cards remain unchanged. */
.ui-page .ui-spaced-form .ui-panel.ui-form-card { padding:var(--space-6) !important; }
.ui-form-section { display:flex; flex-direction:column; gap:var(--space-6); padding-block:var(--space-6); border-bottom:var(--ui-border-width) solid var(--ui-divider); }
.ui-form-section-compact { gap:var(--space-4); }
.ui-form-section:first-child { padding-top:0; }
.ui-form-section:last-child { padding-bottom:0; border-bottom:0; }
.ui-form-section-heading { display:flex; align-items:center; gap:var(--space-3); flex-wrap:wrap; }
.ui-page .ui-spaced-form .ui-form-card h2.ui-form-section-title { margin:0; font-size:var(--ui-font-help) !important; font-weight:var(--ui-weight-strong); color:var(--ui-muted); text-transform:uppercase; letter-spacing:.06em; }
.ui-form-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-4) var(--space-5); align-items:start; }
.ui-form-fields-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.ui-form-fields > * { min-width:0; }
/* SK: Kontext opravy a sprievodné vysvetlenia používajú rovnaké rozostupy ako ostatné formuláre.
   EN: Correction context and supporting explanations share the standard form spacing. */
.ui-form-context { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-3) var(--space-5); padding:var(--space-3) var(--space-4); border:var(--ui-border-width) solid var(--ui-divider); border-radius:var(--ui-radius-input); background:var(--ui-soft); }
.ui-form-subheading { margin:0; font-size:var(--ui-font-body); font-weight:700; }
/* SK: Technický kód v editore má rovnakú šírku znakov ako čítací kód; popisok sa nemení.
   EN: Editable technical codes use the read-only code font without changing their label. */
.ui-code-input input.mud-input-slot { font-family:var(--ui-font-monospace); }
.ui-form-support { display:flex; flex-direction:column; gap:var(--space-4); }
.ui-form-pending { display:flex; align-items:flex-start; gap:var(--space-2); padding:var(--space-3) var(--space-4); border:var(--ui-border-width) solid var(--ui-dashboard-warning-border); border-radius:var(--ui-radius-input); background:var(--ui-warning-soft); color:var(--ui-warning); }
.ui-form-pending > span:not(.ui-pending-badge) { flex:1; min-width:0; }
.ui-form-pending .mud-icon-root,.ui-form-information .mud-icon-root { flex:none; width:var(--space-4); height:var(--space-4); margin-top:calc(var(--space-1) / 2); }
.ui-form-information { display:flex; align-items:flex-start; gap:var(--space-2); margin:0; color:var(--ui-muted); font-size:var(--ui-font-help); line-height:1.5; }
@media(max-width:599px) { .ui-form-context { grid-template-columns:minmax(0,1fr); } }
.ui-spaced-form .ui-input { margin-block:0; min-width:0; }
.ui-page:not(:has(.login-page)) .ui-spaced-form .ui-input .mud-input-label { margin-bottom:calc(var(--space-3) / 2); }
.ui-spaced-form .mud-input-control-helper-container { margin-top:calc(var(--space-3) / 2); padding-inline:0; }
.ui-spaced-form textarea { resize:vertical; }
.ui-form-hint { margin:0; color:var(--ui-muted); font-size:var(--ui-font-help); line-height:1.5; }
.ui-form-choice { display:flex; flex-direction:column; align-items:flex-start; gap:calc(var(--space-3) / 2); min-width:0; }
.ui-form-label { font-size:var(--ui-font-label); font-weight:var(--ui-weight-strong); }
/* SK: Jeden prepínač obsahového jazyka pre celý blok; medzery a stavy sú zdieľané.
   EN: One content-language selector per block; spacing and states are shared. */
.ui-content-language-options { display:flex; flex-wrap:wrap; gap:var(--space-1); padding:var(--space-1); border-radius:var(--ui-radius-small); background:var(--ui-grid-status-inactive-bg); max-width:100%; }
.ui-content-language-options .mud-button { text-transform:none; font-size:var(--ui-font-help); min-width:0; border-radius:var(--ui-radius-small); color:var(--ui-text); }
.ui-content-language-options .ui-content-language-selected { background:var(--ui-surface); color:var(--ui-primary); box-shadow:var(--ui-shadow); font-weight:var(--ui-weight-strong); }
/* SK: Prepínače v spoločnom formulári používajú biely jazdec na sémantickej dráhe.
   EN: Switches in shared forms use a white thumb on the semantic track. */
.ui-spaced-form .mud-switch-base .mud-switch-thumb-medium { background:var(--ui-surface); }
.ui-spaced-form .mud-switch-track { opacity:1 !important; }
.ui-form-segmented { display:inline-flex; max-width:100%; flex-wrap:wrap; border-radius:var(--ui-radius-input); overflow:hidden; }
.ui-spaced-form .ui-form-segmented .mud-button-root { min-height:var(--ui-field-height); padding-inline:var(--space-4); font-size:var(--ui-font-body); text-transform:none; }
.ui-spaced-form .ui-form-segmented .mud-toggle-item { border-radius:0; border-color:var(--ui-divider); }
.ui-spaced-form .ui-form-segmented .mud-toggle-item:not(.mud-toggle-item-selected) { color:var(--ui-text); background:var(--ui-surface); }
.ui-form-summary h2 { margin:0 0 var(--space-4); font-weight:var(--ui-weight-strong); }
.ui-form-summary-empty { display:flex; flex-direction:column; align-items:center; gap:var(--space-2); padding:var(--space-5) var(--space-2); border:calc(2 * var(--ui-border-width)) dashed var(--ui-divider); border-radius:var(--ui-radius-small); text-align:center; }
.ui-form-summary-empty .mud-icon-root { box-sizing:content-box; width:var(--space-6); height:var(--space-6); padding:var(--space-3); color:var(--ui-primary); background:var(--ui-primary-soft); border-radius:var(--ui-radius-small); }
.ui-form-summary-empty p { margin:0; color:var(--ui-muted); line-height:1.5; }
.ui-form-summary dl { margin:0 0 var(--space-4); }
.ui-form-summary dl > div { display:flex; justify-content:space-between; gap:var(--space-3); padding-block:var(--space-3); border-bottom:var(--ui-border-width) solid var(--ui-divider); }
.ui-form-summary dl > div:last-child { border:0; }
.ui-form-summary dt,.ui-form-readonly dt { color:var(--ui-muted); font-size:var(--ui-font-help); }
.ui-form-summary dd { margin:0; text-align:end; font-weight:var(--ui-weight-strong); font-variant-numeric:tabular-nums; }
.ui-form-readonly { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-4) var(--space-5); margin:0; }
.ui-form-readonly dd { margin:calc(var(--space-3) / 2) 0 0; overflow-wrap:anywhere; }
@media(max-width:1100px) { .ui-form-columns { grid-template-columns:minmax(0,1fr); } }
@media(max-width:599px) {
    .ui-form-fields,.ui-form-readonly { grid-template-columns:minmax(0,1fr); }
    .ui-page .ui-spaced-form .ui-panel.ui-form-card { padding:var(--space-5) !important; }
}
.ui-page .ui-section-heading-numbered { display: flex; align-items: center; gap: var(--ui-space-3); }
.ui-page .ui-section-number { display: inline-flex; flex: none; align-items: center; justify-content: center; width: var(--ui-space-8); height: var(--ui-space-8); border-radius: var(--ui-radius-pill); background: var(--ui-primary); color: var(--ui-on-primary); font-size: var(--ui-font-sm); }
.ui-page .ui-section-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--ui-space-4);
    margin-bottom: var(--ui-space-4);
}
.ui-page .ui-section-header .ui-section-heading { margin: 0; }
.ui-page .ui-section-header-copy { flex: 1 1 var(--ui-length-15rem); min-width: 0; }
.ui-page .ui-section-header-copy p { margin: var(--ui-space-2) 0 0; color: var(--ui-muted); }
.ui-page .ui-case-history {
    display: grid;
    gap: var(--ui-space-3);
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: ui-case-event;
}
.ui-page .ui-case-history > li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--ui-space-3);
    align-items: start;
    min-width: 0;
    padding: var(--ui-space-4);
    border: var(--ui-border-width) solid var(--ui-divider);
    border-radius: var(--ui-radius-input);
    counter-increment: ui-case-event;
    overflow-wrap: anywhere;
}
.ui-page .ui-case-history > li::before {
    content: counter(ui-case-event);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--ui-space-8);
    height: var(--ui-space-8);
    border-radius: var(--ui-radius-pill);
    background: var(--ui-primary-soft);
    color: var(--ui-primary);
    font-weight: var(--ui-weight-strong);
}
.ui-page .ui-case-history-entry {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--ui-space-1) var(--ui-space-4);
    min-width: 0;
}
.ui-page .ui-case-history-entry strong { color: var(--ui-text); }
.ui-page .ui-case-history-entry span,
.ui-page .ui-case-history-entry small { grid-column: 1 / -1; }
.ui-page .ui-case-history-entry > details { grid-column: 1 / -1; min-width: 0; }
.ui-page .ui-case-history .accident-detail-value { grid-template-columns: minmax(0, 1fr); }
.ui-page .ui-case-history time,
.ui-page .ui-case-history small { color: var(--ui-muted); }
@media (max-width: 599.98px) {
    .ui-page .ui-case-history-entry { grid-template-columns: minmax(0, 1fr); }
    .ui-page .ui-case-history time { grid-column: 1; }
}
.ui-page :is(p,.mud-typography-body1,.mud-typography-body2):not(.rz-html-editor-content *) { font-size: var(--ui-font-body); }
.ui-page .ui-field > label, .ui-page .ui-input .mud-input-label { font-size: var(--ui-font-label); }
.ui-page :is(.ui-field-help,.mud-input-helper-text,small) { font-size: var(--ui-font-help); }
.ui-page .ui-button { min-width: var(--ui-button-min-width); min-height: var(--ui-button-height); font-size: var(--ui-font-button); }
.ui-page .mud-icon-button:not(.mud-switch-base):not(.ui-data-grid *), .ui-modal .mud-icon-button { min-width: var(--ui-hit-size); min-height: var(--ui-hit-size); }
.ui-page form input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not(.mud-input-root), .ui-page form select { height: var(--ui-field-height); padding: var(--ui-control-padding); line-height: var(--ui-control-line-height); font-size: var(--ui-font-field); }
.ui-page .ui-input .mud-input:not(.mud-input-multiline) { min-height: var(--ui-field-height); }
.ui-page .ui-input .mud-input-slot:not(textarea) { padding: var(--ui-control-padding); line-height: var(--ui-control-line-height); font-size: var(--ui-font-field); }
.ui-page .content-language-select .mud-input { height: var(--ui-field-height); }

.ui-page .ui-choice-wrap { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; min-width: 0; }
.ui-page .ui-choice-wrap > .mud-select,
.ui-page .ui-choice-wrap .mud-input-control { display: grid; grid-area: 1 / 1 / 4 / 2; grid-template-columns: subgrid; grid-template-rows: subgrid; }
.ui-page:not(:has(.login-page)) .ui-choice-wrap .ui-input .mud-input-control-input-container { display: grid; grid-area: 1 / 1 / 3 / 2; grid-template-columns: subgrid; grid-template-rows: subgrid; }
.ui-page .ui-choice-wrap .mud-input-label { grid-area: 1 / 1; }
.ui-page:not(:has(.login-page)) .ui-choice-wrap .ui-input .mud-input { grid-area: 2 / 1; min-height: calc(var(--ui-field-height) + (var(--ui-choice-lines) - 1) * var(--ui-control-line-height)); }
.ui-page .ui-choice-wrap .mud-popover-cascading-value { position: absolute; }
.ui-page .ui-choice-wrap .mud-input-control-helper-container { grid-area: 3 / 1; }
.ui-page .ui-choice-value { grid-area: 2 / 1; align-self: stretch; padding: var(--ui-control-padding); padding-right: var(--ui-field-height); line-height: var(--ui-control-line-height); font-size: var(--ui-font-field); white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; pointer-events: none; visibility: hidden; z-index: 1; }
.ui-page .ui-choice-wrap:has(.mud-input-clear-button) .ui-choice-value { padding-right: calc(var(--ui-field-height) + var(--ui-space-8)); }
.ui-page .ui-choice-wrap-selected .ui-choice-value { visibility: visible; }
.ui-page .ui-choice-wrap-selected input.mud-input-slot { opacity: 0; }
.ui-page .ui-choice-wrap:has(input:disabled) .ui-choice-value { color: var(--mud-palette-text-disabled); }
.ui-page .content-language-select .mud-input-slot { padding-block: var(--ui-space-2); }
.ui-page .mud-switch-span { width: var(--ui-switch-width); height: var(--ui-hit-size); padding: calc((var(--ui-hit-size) - var(--ui-switch-height)) / 2) 0; flex: 0 0 auto; }
.ui-page .mud-switch-track { width: var(--ui-switch-width); height: var(--ui-switch-height); border-radius: var(--ui-radius-pill); }
.ui-page .mud-switch-base { width: var(--ui-switch-height); height: var(--ui-switch-height); min-width: 0; min-height: 0; padding: calc((var(--ui-switch-height) - var(--ui-switch-thumb)) / 2); top: calc((var(--ui-hit-size) - var(--ui-switch-height)) / 2); }
.ui-page .mud-switch-base.mud-checked { transform: translateX(var(--ui-switch-travel)); }
.ui-page [class*="mud-switch-thumb-"] { width: var(--ui-switch-thumb); height: var(--ui-switch-thumb); }
.ui-choice-popover .mud-list-item { min-height: var(--ui-option-height); font-size: var(--ui-font-list); }
.ui-choice-popover .mud-list-item-text > * { font-size: var(--ui-font-list); }
.ui-date-time-popover .mud-picker-calendar-day { min-width: var(--ui-hit-size); min-height: var(--ui-hit-size); }
.ui-data-grid { font-size: var(--ui-preserved-font-body); }
:is(.ui-data-grid,.admin-appbar,.portal-appbar) {
 --ui-font-body: var(--ui-preserved-font-body);
 --ui-font-sm: var(--ui-preserved-font-sm);
 --ui-font-subtitle: var(--ui-preserved-font-subtitle);
 --ui-font-title: var(--ui-preserved-font-title);
}
.ui-page .rz-html-editor-toolbar :is(.rz-button,.rz-dropdown) { min-width: var(--ui-hit-size); min-height: var(--ui-hit-size); }
.ui-page .rz-html-editor-toolbar .rz-button-icon-only { width: var(--ui-hit-size); height: var(--ui-hit-size); }
.ui-page .rz-html-editor-toolbar .rz-button .rzi { font-size: var(--ui-icon); }
.ui-page .ui-button.mud-button-size-small:not(.ui-data-grid *) { --ui-button-height: var(--ui-compact-control-height); }
/* SK: Číselné polia formulárov majú zvýšenie nad znížením v jednom stĺpci. Každá šípka zaberá polovicu
   výšky poľa; spoločná geometria zachováva výšku riadkov aj pri dlhých popisoch. Gridy ostávajú oddelené.
   EN: Form numeric inputs place increment above decrement in one column. Each arrow occupies half the
   field height; shared geometry preserves row height even with long labels. Grids retain their own layout. */
.ui-page .mud-input-numeric-spin:not(.ui-data-grid *) { flex-direction: column; align-items: stretch; flex: 0 0 var(--ui-hit-size); width: var(--ui-hit-size); height: var(--ui-field-height); }
.ui-page .mud-input-numeric-spin:not(.ui-data-grid *) .mud-button-root { min-width: var(--ui-hit-size); min-height: calc(var(--ui-field-height) / 2); height: calc(var(--ui-field-height) / 2); flex-shrink: 0; padding: 0; }

/* Shared grid geometry; headers, navigation and forms keep their current design. */
.ui-page .ui-data-grid.mud-data-grid {
 --ui-text: var(--ui-grid-original-text);
 --ui-muted: var(--ui-grid-original-muted);
 --ui-border: var(--ui-grid-original-border);
 --ui-divider: var(--ui-grid-original-divider);
 --ui-soft: var(--ui-grid-original-soft);
 --ui-surface: var(--ui-grid-original-surface);
 --ui-primary-soft: var(--ui-grid-original-primary-soft);
 --ui-shadow: var(--ui-grid-original-shadow);
 --ui-font-body: var(--ui-grid-font-body);
 --ui-font-sm: var(--ui-grid-font-heading);
 --ui-font-xs: var(--ui-grid-font-caption);
 --ui-font-subtitle: var(--ui-grid-font-subtitle);
 --ui-grid-body-font: var(--ui-grid-font-body);
 --ui-grid-heading-font: var(--ui-grid-font-heading);
 --ui-font-field: var(--ui-grid-font-body);
 --ui-font-label: var(--ui-grid-font-heading);
 --ui-font-button: var(--ui-grid-font-heading);
 --ui-font-help: var(--ui-grid-font-caption);
 --ui-space-1: var(--ui-grid-space-1);
 --ui-space-2: var(--ui-grid-space-2);
 --ui-space-3: var(--ui-grid-space-3);
 --ui-space-4: var(--ui-grid-space-4);
 --ui-space-5: var(--ui-grid-space-5);
 --ui-space-6: var(--ui-grid-space-6);
 --ui-space-8: var(--ui-grid-space-8);
 --ui-field-height: var(--ui-grid-field-height);
 --ui-button-height: var(--ui-grid-button-height);
 --ui-compact-control-height: var(--ui-grid-button-height);
 --ui-checkbox-size: var(--ui-grid-checkbox-size);
 --ui-checkbox-hit-area: var(--ui-grid-hit-area);
 --ui-icon: var(--ui-grid-icon-small);
 --ui-radius-grid: var(--ui-grid-radius);
 --ui-radius-input: var(--ui-grid-control-radius);
 --ui-admin-control-radius: var(--ui-grid-control-radius);
 --ui-length-1px: var(--ui-grid-border-width);
 --ui-length-20px: var(--ui-grid-icon-small);
 --ui-length-52px: var(--ui-grid-toolbar-height);
 font-size: var(--ui-grid-font-body);
 color: var(--ui-text);
 border-radius: var(--ui-grid-radius) !important;
}
.ui-page .ui-data-grid :is(.mud-typography-body1,.mud-input,.mud-select-input) { font-size: var(--ui-grid-font-body); }
.ui-page .ui-data-grid :is(.mud-typography-body2,.mud-typography-subtitle2,.mud-button-root) { font-size: var(--ui-grid-font-heading); }
.ui-page .ui-data-grid :is(.mud-typography-caption,.mud-typography-overline) { font-size: var(--ui-grid-font-caption); }
.ui-page .ui-data-grid .mud-icon-size-small { font-size: var(--ui-grid-icon-small); }
.ui-page .ui-data-grid .mud-icon-size-medium { font-size: var(--ui-grid-icon-medium); }
.ui-page .ui-data-grid .mud-icon-size-large { font-size: var(--ui-grid-icon-large); }
.ui-page .ui-data-grid .mud-icon-button:not(.mud-switch-base) {
 min-width: var(--ui-grid-min-hit-area);
 min-height: var(--ui-grid-min-hit-area);
}
.ui-page .ui-data-grid :is(.mud-table-toolbar,.mud-table-pagination-toolbar) { min-height: var(--ui-grid-toolbar-height); }
.ui-page .ui-data-grid .mud-table-pagination-actions { margin-left: var(--ui-grid-space-5); }

/* Viewport height is measured by the shared grid after its header is laid out. */
.ui-data-grid.ui-grid-loading-shell:not([data-ui-grid-ready="true"]) {
 position: relative;
 min-height: var(--ui-grid-loading-min-height);
 overflow: hidden;
}
.ui-data-grid.ui-grid-loading-shell.ui-grid-auto-size:not(.ui-grid-viewport-sized):not([data-ui-grid-ready="true"]) {
 height: var(--ui-grid-initial-height);
}
.ui-data-grid.ui-grid-loading-shell:not([data-ui-grid-ready="true"]) > * { visibility: hidden; }
.ui-data-grid.ui-grid-loading-shell:not([data-ui-grid-ready="true"]) > .mud-table-container { min-height: 0; }
.ui-data-grid.ui-grid-loading-shell:not([data-ui-grid-ready="true"])::after {
 content: "";
 position: absolute;
 inset: 0;
 margin: auto;
 width: var(--ui-grid-loading-size);
 height: var(--ui-grid-loading-size);
 border: var(--ui-grid-loading-stroke) solid var(--ui-primary-soft);
 border-top-color: var(--ui-primary);
 border-radius: 50%;
 animation: ui-grid-loading var(--ui-grid-loading-duration) linear infinite;
}
.ui-data-grid[data-ui-grid-ready="true"] + .ui-grid-loading-status { display: none; }
.ui-data-grid.ui-grid-loading-shell[data-ui-grid-ready="true"] > * {
 animation: ui-grid-reveal var(--ui-grid-reveal-duration) ease-out;
}
.ui-data-grid.ui-grid-paging-busy { position: relative; }
.ui-data-grid.ui-grid-paging-busy::before {
 content: "";
 position: absolute;
 z-index: 2;
 top: 0;
 left: 0;
 width: 100%;
 height: 3px;
 background: linear-gradient(90deg, transparent, var(--ui-primary), transparent);
 background-size: 50% 100%;
 background-repeat: no-repeat;
 animation: ui-grid-paging 1s linear infinite;
 pointer-events: none;
}
.ui-data-grid.ui-grid-paging-busy + .ui-grid-loading-status { display: block; }
@keyframes ui-grid-paging { from { background-position: -100% 0; } to { background-position: 200% 0; } }
@keyframes ui-grid-loading { to { transform: rotate(360deg); } }
@keyframes ui-grid-reveal { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
 .ui-data-grid.ui-grid-loading-shell::after,
 .ui-data-grid.ui-grid-loading-shell[data-ui-grid-ready="true"] > * { animation: none; }
}
.ui-data-grid.mud-data-grid.ui-grid-viewport-sized {
 height: var(--ui-grid-viewport-height);
 min-height: var(--ui-grid-min-height, 0);
}
.ui-data-grid.mud-data-grid.ui-grid-viewport-sized > .mud-table-container {
 min-height: 0;
 overflow-x: hidden;
 overflow-y: hidden;
}
.ui-page .ui-data-grid.mud-data-grid .mud-table-root {
 width: 100%;
 min-width: 0;
 table-layout: fixed;
}
.ui-page .ui-data-grid.mud-data-grid .mud-table-cell {
 min-width: 0 !important;
 white-space: normal !important;
 overflow-wrap: anywhere;
}
.ui-page .ui-data-grid.mud-data-grid .column-header {
 min-width: 0;
 display: flex;
 flex-wrap: nowrap;
 align-items: center;
 justify-content: flex-start;
 min-height: var(--ui-grid-min-hit-area);
 gap: var(--ui-grid-heading-gap);
 overflow-wrap: normal;
}
.ui-page .ui-data-grid.mud-data-grid { position: relative; }
.ui-page .ui-data-grid.mud-data-grid > .mud-table-toolbar { order: 1; }
.ui-page .ui-data-grid.mud-data-grid > .mud-table-container { order: 2; overflow: visible; min-width: 0; }
.ui-page .ui-data-grid.mud-data-grid > .mud-table-pagination { order: 0; flex-shrink: 0; margin-top: 0; overflow: visible; background: var(--ui-soft); border-bottom: var(--ui-border-width) solid var(--ui-divider); }
.ui-page .ui-data-grid.mud-data-grid .mud-table-pagination-toolbar { min-height: var(--ui-grid-pager-height); flex-wrap: wrap; gap: var(--ui-grid-space-2); }
.ui-page .ui-data-grid.mud-data-grid .mud-table-pagination-spacer { display: none; }
.ui-page .ui-data-grid.mud-data-grid .mud-table-pagination-caption { margin-right: auto; margin-left: 0; }
.ui-page .ui-data-grid.mud-data-grid .mud-table-pagination-actions { margin-inline-end: 0; }
.ui-page .ui-data-grid.mud-data-grid:has(> .mud-table-pagination) > .mud-table-toolbar:has(.ui-grid-settings):not(:has(.ui-button,.mud-input)) {
 position: absolute; inset-inline-start: auto; inset-inline-end: var(--ui-grid-space-2); top: calc((var(--ui-grid-pager-height) - var(--ui-grid-action-size)) / 2); bottom: auto;
 min-height: 0; height: var(--ui-grid-action-size); width: var(--ui-grid-action-size); padding: 0; z-index: 2;
 border: 0; background: transparent;
}
.ui-page .ui-data-grid.mud-data-grid:has(.ui-grid-settings) > .mud-table-pagination { padding-inline-end: calc(var(--ui-grid-action-size) + 2 * var(--ui-grid-space-2)); }
.ui-page .ui-data-grid.mud-data-grid .ui-grid-settings .mud-icon-button {
 width: var(--ui-grid-action-size); height: var(--ui-grid-action-size); padding: 0;
 color: var(--ui-muted); background: transparent; border: 0; box-shadow: none; border-radius: var(--ui-radius-small);
}
.ui-page .ui-data-grid.mud-data-grid .ui-grid-settings .mud-icon-button:hover { background: var(--ui-soft); }
.ui-page .ui-data-grid.mud-data-grid .mud-table-head .mud-table-cell {
 width: var(--ui-grid-column-width, auto) !important; height: var(--ui-grid-header-height);
 padding: var(--ui-grid-cell-padding-y) var(--ui-grid-cell-padding-x);
 background: var(--ui-soft); font-size: var(--ui-grid-font-heading); font-weight: 600; line-height: var(--ui-grid-heading-line-height); vertical-align: middle;
}
.ui-page .ui-data-grid.mud-data-grid .mud-table-body > tr > .mud-table-cell {
 height: var(--ui-grid-row-height); padding: var(--ui-grid-cell-padding-y) var(--ui-grid-cell-padding-x);
 font-size: var(--ui-grid-font-body); line-height: 1.4; border-bottom: var(--ui-border-width) solid var(--ui-divider);
}
.ui-page .ui-data-grid.mud-data-grid .mud-table-body > tr:nth-child(even) { background: color-mix(in srgb, var(--ui-soft) 35%, var(--ui-surface)); }
.ui-page .ui-data-grid.mud-data-grid .ui-grid-email-cell { word-break: break-all; }
.ui-page .ui-data-grid.mud-data-grid .sort-direction-icon { display: none; }
.ui-page .ui-data-grid.mud-data-grid th:has(.mud-direction-asc) .sortable-column-header::after { content: " \2191"; color: var(--ui-primary); }
.ui-page .ui-data-grid.mud-data-grid th:has(.mud-direction-desc) .sortable-column-header::after { content: " \2193"; color: var(--ui-primary); }
.ui-page .ui-data-grid.mud-data-grid .column-header > .sortable-column-header { width: auto; min-width: 0; min-height: var(--ui-grid-min-hit-area); display: flex; align-items: center; flex: 0 1 auto; overflow-wrap: normal; word-break: normal; }
.ui-page .ui-data-grid.mud-data-grid .sortable-column-header:focus-visible { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-length-2px); border-radius: var(--ui-radius-small); }
.ui-page .ui-data-grid.mud-data-grid .column-options { margin-inline-start: 0; flex-shrink: 0; }
.ui-page .ui-data-grid.mud-data-grid :is(.grid-actions,.admin-actions,.admin-grid-actions,.role-actions) {
 min-width: 0; display: flex; align-items: center; gap: var(--ui-grid-action-gap); flex-wrap: nowrap !important;
}
/* SK: Ikonové akcie patria dátovým bunkám, nie tlačidlám vloženého detailu.
   EN: Icon-only actions belong to data cells, not to buttons inside a row detail. */
.ui-page .ui-data-grid.mud-data-grid tbody > tr > td:not(.mud-table-child-content) .ui-button:has(.mud-button-icon-start,.mud-button-icon-end) {
 width: var(--ui-grid-action-size); min-width: var(--ui-grid-action-size); max-width: var(--ui-grid-action-size);
 height: var(--ui-grid-action-size) !important; min-height: var(--ui-grid-action-size);
 padding: 0 !important; flex: 0 0 var(--ui-grid-action-size); border-color: transparent !important; background: transparent !important; box-shadow: none !important;
 transition: color var(--ui-grid-reveal-duration), background-color var(--ui-grid-reveal-duration);
}
.ui-page .ui-data-grid.mud-data-grid tbody > tr > td:not(.mud-table-child-content) .ui-button-primary:has(.mud-button-icon-start,.mud-button-icon-end) { color: var(--ui-primary) !important; }
.ui-page .ui-data-grid.mud-data-grid tbody > tr > td:not(.mud-table-child-content) .ui-button:has(.mud-button-icon-start,.mud-button-icon-end):hover { background: var(--ui-primary-soft) !important; }
.ui-page .ui-data-grid.mud-data-grid tbody > tr > td:not(.mud-table-child-content) .ui-button-danger:has(.mud-button-icon-start,.mud-button-icon-end):hover { background: var(--ui-grid-status-inactive-bg) !important; }
.ui-page .ui-data-grid.mud-data-grid tbody > tr > td:not(.mud-table-child-content) .ui-button:has(.mud-button-icon-start,.mud-button-icon-end) .mud-button-label { gap: 0; }
.ui-page .ui-data-grid.mud-data-grid tbody > tr > td:not(.mud-table-child-content) .ui-button:has(.mud-button-icon-start,.mud-button-icon-end) :is(.mud-button-icon-start,.mud-button-icon-end) { margin: 0; }
.ui-page .ui-data-grid.mud-data-grid tbody > tr > td:not(.mud-table-child-content) :is(.ui-button,button.mud-icon-button:not(.mud-switch-base)) .mud-icon-root {
 font-size: var(--ui-grid-action-icon-size); width: var(--ui-grid-action-icon-size); height: var(--ui-grid-action-icon-size);
}
.ui-page .ui-data-grid.mud-data-grid tbody > tr > td:not(.mud-table-child-content) .ui-button:has(.mud-button-icon-start,.mud-button-icon-end) .ui-button-text {
 position: absolute; width: var(--ui-length-1px); height: var(--ui-length-1px); padding: 0; margin: -1px;
 overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.ui-grid-action-tooltip {
 position: fixed; z-index: 1600; pointer-events: none; max-width: var(--ui-length-280px);
 padding: var(--ui-grid-space-2) var(--ui-grid-space-3); border-radius: var(--ui-radius-small);
 background: var(--ui-text); color: var(--ui-surface); font-size: var(--ui-grid-font-caption); overflow-wrap: anywhere;
}
.ui-grid-status { display: inline-flex; padding: var(--ui-grid-status-padding); border-radius: var(--ui-radius-pill); font-size: var(--ui-grid-font-caption); font-weight: 600; color: var(--ui-grid-status-inactive-text); background: var(--ui-grid-status-inactive-bg); }
.ui-grid-status.is-active { color: var(--ui-grid-status-active-text); background: var(--ui-grid-status-active-bg); }
.ui-page .ui-data-grid.mud-data-grid .ui-grid-status { font-size: var(--ui-grid-font-caption); white-space: nowrap; }
/* SK: Stavový odznak zostáva nedeliteľný; jeho úplnú šírku vrátane odsadenia meria spoločný grid.
   EN: Status badges remain unbroken; shared grid measurement includes their complete padded width. */
.ui-page .ui-data-grid.mud-data-grid .ui-detail-badge { white-space:nowrap; }
/* SK: Opt-in zarovnanie textu odznaku s textom hlavičky odpočíta jeho vnútorné
   odsadenie od bunky; bez záporných okrajov. Responzívne karty si zachovajú vlastný layout.
   EN: Opt-in badge text alignment subtracts its inner inset from cell padding, without
   negative margins. Responsive cards retain their own layout. */
.ui-page .ui-data-grid.mud-data-grid:not(.ui-grid-cards) .mud-table-body > tr > .ui-grid-badge-text-aligned { padding-inline-start:max(0px,calc(var(--ui-grid-cell-padding-x) - var(--space-3))); }

/* Narrow grids retain every field and the existing header sorting/filter controls. */
/* SK: Prioritné stĺpce nie sú vymazané ani MudBlazor Hidden. Všetky sa odhalia jedným tlačidlom.
   EN: Priority columns are neither removed nor MudBlazor Hidden; one button reveals them all. */
.ui-page .ui-data-grid.mud-data-grid .mud-table-cell.ui-grid-secondary-column { display: none !important; }
.ui-page .ui-data-grid .ui-grid-column-toggle[hidden] { display: none !important; }
.ui-page .ui-data-grid .ui-grid-column-toggle { flex: 0 0 auto; margin-inline-start: var(--space-2); }
.ui-list-filter-toggle { display: none !important; }
/* SK: Mení geometriu zoznamov podľa dostupnej plochy, nie mierku písma alebo dotykové rozmery.
   EN: Adapt list geometry to available space, never font scaling or hit-target dimensions. */
@media (max-width:1199.98px), (max-height:700px) {
 .ui-page.ui-list-layout, .ui-page .ui-list-layout { --ui-list-action-gap: var(--space-3); }
 .ui-page .ui-list-layout > .ui-page-header,
 .ui-page.ui-list-layout > .ui-page-header { min-height: 0; padding: var(--space-3) var(--space-4); gap: var(--space-3); margin-block-end: var(--space-3); align-items: center; }
 .ui-page .ui-list-layout > .ui-page-header .ui-page-description,
 .ui-page.ui-list-layout > .ui-page-header .ui-page-description { margin-block-start: var(--space-1); }
 .ui-page .ui-list-layout > .ui-page-header .ui-page-header-icon,
 .ui-page.ui-list-layout > .ui-page-header .ui-page-header-icon { width: var(--ui-hit-size); height: var(--ui-hit-size); padding: var(--space-2); }
 .ui-page .ui-list-layout > .ui-page-header .ui-page-header-actions,
 .ui-page.ui-list-layout > .ui-page-header .ui-page-header-actions { width: auto; gap: var(--space-2); }
 .ui-page .ui-list-layout > * + *, .ui-page.ui-list-layout > * + :where(:not(.delete-confirmation-backdrop)) { margin-block-start: var(--space-3); }
 .ui-page .ui-list-filter-toggle { display: inline-flex !important; align-items: center; gap: var(--space-2); }
 .ui-page .ui-list-filter-toggle::after { content: '⌄'; font-size: var(--ui-font-sm); }
 .ui-page .ui-list-filter-toggle[aria-expanded="true"]::after { content: '⌃'; }
 .ui-page .ui-list-filter-panel.ui-list-filter-collapsed { display: none !important; }
 .ui-page .ui-list-filter-panel:not(.ui-list-filter-collapsed) { margin-block-start: var(--space-3); }
 .ui-page .ui-list-filter-panel.ui-panel { padding: var(--space-4) !important; }
 :is(.admin-content,.portal-content).mud-container:has(.ui-list-layout) { padding-block: var(--space-4) !important; }
}
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-root,
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards :is(.mud-table-head,.mud-table-body) { display: block; width: 100%; }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-head > tr { display: flex; flex-wrap: wrap; background: var(--ui-soft); padding: var(--ui-grid-space-2); }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-head .mud-table-cell { display: block; width: auto !important; height: auto; padding: var(--ui-grid-space-1); border: 0; }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-head .ui-grid-action-heading { display: none; }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-head .column-header { gap: var(--ui-grid-heading-gap); }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-head .sortable-column-header { height: auto; align-items: center; }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-body > tr { display: block; padding: var(--ui-grid-space-3) var(--ui-grid-space-4); border-bottom: var(--ui-border-width) solid var(--ui-divider); }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-body > tr > .mud-table-cell {
 display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); align-items: center;
 gap: var(--ui-grid-space-3); width: auto !important; height: auto; padding: var(--ui-grid-space-1) 0; border: 0;
}
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-body > tr > .mud-table-cell::before { content: attr(data-ui-grid-label); font-size: var(--ui-grid-font-caption); font-weight: 600; color: var(--ui-muted); overflow-wrap: anywhere; }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-body > tr > .mud-table-cell[colspan] { display: block; }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-body > tr > .mud-table-cell[colspan]::before { content: none; }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-cards .mud-table-cell > * { min-width: 0; }
.ui-page .ui-data-grid.mud-data-grid.ui-grid-wide-cards .mud-table-body > tr {
 display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--ui-grid-space-6);
}
.ui-page .ui-data-grid.mud-data-grid.ui-grid-wide-cards .mud-table-body > tr > :is(.ui-grid-action-cell,[colspan]) { grid-column: 1 / -1; }

/* Shared unsaved-change dialog, matching the user role editor. */
.role-leave-dialog.ui-modal { max-width: var(--ui-role-leave-dialog-width) !important; padding: 0; border-radius: var(--ui-user-detail-panel-radius); box-shadow: var(--ui-role-leave-dialog-shadow); }
.role-leave-content.mud-dialog-content { display: flex; flex-direction: column; gap: var(--ui-space-4); padding: var(--ui-role-leave-dialog-padding); position: relative; }
.role-leave-content .role-leave-close { position: absolute; inset-block-start: var(--ui-space-3); inset-inline-end: var(--ui-space-3); width: var(--ui-checkbox-hit-area); height: var(--ui-checkbox-hit-area); color: var(--ui-muted); }
.role-leave-icon { display: flex; align-items: center; justify-content: center; width: var(--ui-checkbox-hit-area); height: var(--ui-checkbox-hit-area); flex: 0 0 auto; border-radius: var(--ui-radius-input); background: color-mix(in srgb, var(--ui-warning) 10%, var(--ui-surface)); color: var(--ui-warning); }
.role-leave-icon .mud-icon-root { width: var(--ui-checkbox-size); height: var(--ui-checkbox-size); }
.role-leave-heading { display: grid; gap: var(--ui-space-2); padding-inline-end: var(--ui-space-8); }
.role-leave-heading h2 { margin: 0; font-size: var(--ui-font-subtitle); line-height: 1.35; font-weight: var(--ui-weight-strong); }
.role-leave-heading p { margin: 0; font-size: var(--ui-font-sm); line-height: 1.5; color: var(--ui-muted); }
.role-leave-changes { display: grid; gap: var(--ui-space-4); padding: var(--ui-space-4); border: var(--ui-border-width) solid var(--ui-divider); border-radius: var(--ui-radius-input); background: var(--ui-soft); max-height: var(--ui-dimension-260px); overflow-y: auto; }
.role-leave-change-group { display: grid; gap: var(--ui-space-3); }
.role-leave-change-group h3 { margin: 0; color: var(--ui-muted); text-transform: uppercase; font-size: var(--ui-font-xs); font-weight: var(--ui-weight-strong); }
.role-leave-chips { display: flex; flex-wrap: wrap; gap: var(--ui-space-2); }
.role-leave-chip { display: inline-flex; align-items: center; gap: var(--ui-space-1); padding: var(--ui-space-1) var(--ui-space-3); border-radius: var(--ui-radius-pill); font-size: var(--ui-font-xs); font-weight: var(--ui-weight-medium); overflow-wrap: anywhere; min-width: 0; }
.role-leave-chip .mud-icon-root { width: var(--ui-space-3); height: var(--ui-space-3); flex: 0 0 auto; }
.role-leave-chip.is-added { color: var(--ui-success); background: color-mix(in srgb, var(--ui-success) 12%, var(--ui-surface)); }
.role-leave-chip.is-removed { color: var(--ui-error); background: color-mix(in srgb, var(--ui-error) 10%, var(--ui-surface)); }
.role-leave-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: var(--ui-space-2); margin-top: var(--ui-space-1); }
.role-leave-actions .role-leave-stay.ui-button { margin-inline-end: auto; padding-inline: var(--ui-space-3); border-color: transparent !important; background: transparent !important; }
.role-leave-actions .role-leave-discard.ui-button-danger { color: var(--ui-error) !important; border-color: var(--ui-border) !important; background: var(--ui-surface) !important; }
.role-leave-actions .ui-button { min-height: var(--ui-checkbox-hit-area); padding-inline: var(--ui-space-3); }
.role-leave-chip:not(.is-added):not(.is-removed) { color: var(--ui-primary); background: var(--ui-primary-soft); }

@media (max-width: 599.98px) {
    .role-leave-content.mud-dialog-content { padding: var(--ui-space-5); }
    .role-leave-actions { align-items: stretch; }
    .role-leave-actions > .ui-button, .role-leave-actions > form { flex: 1 1 100%; }
    .role-leave-actions form .ui-button { width: 100%; }
}

.ui-choice-popover .ui-choice-footer {
 display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ui-space-2) var(--ui-space-4);
 padding: var(--ui-space-3) var(--ui-space-4);
}
.ui-choice-popover .ui-choice-footer .ui-button {
 min-height: var(--ui-checkbox-hit-area); width: auto; max-width: 100%; flex: 0 0 auto; margin: 0;
 padding: var(--ui-space-2) var(--ui-space-3);
 border: var(--ui-border-width) solid var(--ui-border); border-radius: var(--ui-radius-small);
 background: var(--ui-surface); color: var(--ui-text);
 font-size: var(--ui-font-xs); font-weight: var(--ui-weight-medium); line-height: 1.4;
 letter-spacing: 0; text-transform: none; box-shadow: none;
}
.ui-choice-popover .ui-choice-footer .ui-button-text { white-space: nowrap; }
.ui-choice-popover .ui-choice-footer .ui-button .mud-button-icon-start { margin-inline: 0 var(--ui-space-2); }
.ui-choice-popover .ui-choice-footer .ui-button:hover:not(:disabled) {
 border-color: var(--ui-primary); background: var(--ui-primary-soft); color: var(--ui-primary);
}
.ui-choice-popover .ui-choice-footer .ui-button:focus-visible {
 outline: var(--ui-length-2px) solid var(--ui-primary); outline-offset: var(--ui-length-2px);
}

.ui-choice-dialog.ui-modal { padding: 0; }
.ui-choice-dialog.ui-page > * + * { margin-block-start: 0; }
.ui-choice-dialog .mud-dialog-content { display: flex; flex-direction: column; gap: var(--ui-space-4); }
.ui-choice-dialog-search { display: flex; align-items: flex-end; gap: var(--ui-space-2); }
.ui-choice-dialog-search > .ui-input { flex: 1; min-width: 0; }
.ui-choice-dialog-search > .ui-button { flex-shrink: 0; }
@media (max-width: 599.98px) {
    /* Keep text-filter focus inside the viewport without horizontal page scrolling. */
    .column-filter-popup.mud-popover-open:has(.ui-grid-text-filter):not(.grid-filter-below-settings) {
        left: max(var(--ui-length-12px), calc((100vw - var(--ui-length-340px)) / 2)) !important;
        transform: none !important;
    }
}
.ui-choice-dialog.ui-page .ui-choice-dialog-grid.mud-data-grid > .mud-table-container { max-height: min(45vh, 600px); overflow: auto; }
.ui-choice-dialog.ui-page .ui-choice-dialog-grid .mud-table-pagination-toolbar { height: auto; }
.ui-choice-dialog-grid .mud-table-cell { overflow-wrap: anywhere; }

/* Shared contextual help: desktop side panel and mobile full-screen dialog. */
.ui-help-dialog.mud-dialog {
  width: min(44rem, 100vw);
  height: 100dvh;
  max-height: 100dvh;
  margin: 0;
  border-radius: var(--ui-radius-small) 0 0 var(--ui-radius-small);
}
.ui-help-dialog .mud-dialog-content { overflow-y: auto; }
.ui-help-dialog .mud-dialog-actions { flex-wrap: wrap; }
.ui-help-content { color: var(--ui-text); overflow-wrap: anywhere; line-height: 1.65; }
.ui-help-content h1 { font-size: 1.5rem; }
.ui-help-content h2 { font-size: 1.2rem; margin-top: 1.5rem; }
.ui-page .ui-attachment-panel > .ui-section-header { margin-bottom: var(--ui-space-2); }
.ui-attachment-upload {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--ui-space-3);
    padding: 0;
    border: 0;
    border-radius: var(--ui-radius-input);
}
.ui-attachment-file {
    min-width: 0;
    display: grid;
    gap: var(--ui-space-2);
    padding: 0;
    border: 0;
    border-radius: var(--ui-radius-input);
    background: var(--ui-surface);
}
.ui-attachment-picker {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--ui-button-height);
    padding: var(--ui-space-2) var(--ui-space-4);
    border: var(--ui-border-width) solid var(--ui-primary);
    border-radius: var(--ui-radius-small);
    background: var(--ui-surface);
    color: var(--ui-primary);
    font-size: var(--ui-font-button);
    font-weight: var(--ui-weight-medium);
    cursor: pointer;
}
.ui-attachment-picker input[type="file"] {
    position: absolute;
    inset: 0;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    height: 100%;
    padding: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}
.ui-attachment-picker:hover:not(:has(input:disabled)) { background: var(--ui-primary-soft); }
.ui-attachment-picker > .mud-icon-root { flex-shrink: 0; width: var(--ui-icon); height: var(--ui-icon); margin-inline-end: var(--ui-space-2); }
.ui-attachment-picker:has(input:focus-visible) { outline: var(--ui-focus-width) solid var(--ui-primary); outline-offset: var(--ui-space-1); }
.ui-attachment-picker:has(input:disabled) { opacity: .6; cursor: default; }
.ui-attachment-picker input:disabled { cursor: default; }
.ui-attachment-filename {
    min-width: 0;
    margin: 0;
    color: var(--ui-text);
    font-size: var(--ui-font-body);
    white-space: normal;
    overflow-wrap: anywhere;
}
.ui-attachment-help { margin: 0; color: var(--ui-muted); font-size: var(--ui-font-sm); }
.ui-attachment-confirm { min-width: 0; }
.ui-attachment-confirm .mud-checkbox { margin: 0; width: 100%; align-items: flex-start; }
.ui-attachment-confirm .mud-checkbox .mud-button-root { flex-shrink: 0; }
.ui-attachment-confirm .mud-checkbox .mud-typography { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.ui-attachment-actions { min-width: 0; display: flex; flex-direction: column; gap: var(--ui-space-2); }
.ui-attachment-actions .ui-button { width: 100%; max-width: 100%; white-space: normal; }
.ui-page .ui-attachment-empty { margin: var(--ui-space-2) 0 0; color: var(--ui-muted); }
.ui-page .ui-attachment-list { display: grid; gap: var(--ui-space-3); margin: var(--ui-space-3) 0 0; padding: 0; list-style: none; }
.ui-page .ui-attachment-list:empty { display: none; }
.ui-page .ui-attachment-panel--detail > .ui-section-header { margin-bottom: var(--ui-space-4); }
.ui-attachment-panel--detail .ui-attachment-upload { gap: var(--ui-space-6); }
.ui-attachment-panel--detail .ui-attachment-file { gap: var(--ui-space-3); }
.ui-page .ui-attachment-panel--detail .ui-attachment-empty,
.ui-page .ui-attachment-panel--detail .ui-attachment-list { margin-top: var(--ui-space-6); }
.ui-attachment-panel--detail .ui-attachment-selection { display: grid; gap: var(--ui-space-3); min-width: 0; }
.ui-page .ui-attachment-panel--detail .ui-attachment-selection > .ui-attachment-list { margin-top: 0; }
.ui-page .ui-attachment-list > li { min-width: 0; padding: var(--ui-space-3) var(--ui-space-4); border: var(--ui-border-width) solid var(--ui-divider); border-radius: var(--ui-radius-input); background: var(--ui-surface); overflow-wrap: anywhere; }
.ui-page .ui-attachment-list a { overflow-wrap: anywhere; color: var(--ui-primary); font-weight: var(--ui-weight-medium); }
.ui-page .ui-attachment-list small { display: block; margin-top: var(--ui-space-1); color: var(--ui-muted); font-size: var(--ui-font-sm); }
.ui-page .ui-button.ui-attachment-icon-action { width: var(--ui-button-height); min-width: var(--ui-button-height); height: var(--ui-button-height); flex: 0 0 var(--ui-button-height); padding: 0 !important; border-color: transparent !important; background: transparent !important; }
.ui-page .ui-button.ui-attachment-icon-action .mud-button-label { gap: 0; }
.ui-page .ui-button.ui-attachment-icon-action .ui-button-text { position: absolute; width: var(--ui-length-1px); height: var(--ui-length-1px); margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ui-page .ui-button.ui-attachment-icon-action:hover:not(:disabled) { background: var(--ui-primary-soft) !important; }
.ui-help-content h3 { font-size: 1.05rem; margin-top: 1rem; }
.ui-help-content p, .ui-help-content ul, .ui-help-content ol { margin-bottom: .8rem; }
.ui-help-content ul, .ui-help-content ol { padding-inline-start: 1.5rem; }
.ui-help-content code { font-family: var(--ui-font-monospace); background: var(--ui-soft); }
.ui-help-content pre { overflow-x: auto; padding: 1rem; background: var(--ui-soft); }
.ui-help-chapter { margin-top: 1rem; scroll-margin-top: 6rem; }
.ui-help-contents a { display: inline-flex; align-items: center; min-height: var(--ui-compact-control-height); color: var(--ui-primary); text-decoration: underline; text-underline-offset: .2em; }
.ui-help-contents a:focus-visible { outline: 2px solid var(--ui-primary); outline-offset: 2px; border-radius: var(--ui-radius-small); }
@media (max-width: 600px) {
  .ui-help-dialog.mud-dialog { width: 100vw; max-width: 100vw; border-radius: 0; }
}
/* SK: Zdieľané radenie vybraných preferencií. Farby a rozmery preberá z témy;
   úchyt zachytáva dotyk, zvyšok zoznamu umožňuje bežné posúvanie stránky.
   EN: Shared selected-preference ordering. Colors and sizes come from the theme;
   only the handle captures touch, leaving normal page scrolling available elsewhere. */
.ui-order-list { display: grid; gap: var(--ui-space-2); margin-top: var(--ui-space-3); }
.ui-order-row { display: flex; align-items: center; gap: var(--ui-space-2); min-width: 0; position: relative; padding: var(--ui-space-1) var(--ui-space-2); border: 1px solid var(--ui-border); border-radius: var(--ui-radius-small); background: var(--ui-surface); }
.ui-order-choice { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.ui-order-choice .mud-checkbox { width: 100%; }
.ui-order-choice .mud-typography { overflow-wrap: anywhere; }
.ui-order-number { color: var(--ui-muted); min-width: 2ch; text-align: center; font-variant-numeric: tabular-nums; }
.ui-order-actions { display: flex; flex-shrink: 0; }
.ui-order-handle { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: var(--ui-hit-size, 36px); height: var(--ui-hit-size, 36px); padding: 0; border: 0; color: var(--ui-muted); background: transparent; touch-action: none; cursor: grab; user-select: none; }
.ui-order-handle:disabled { color: var(--ui-control-disabled); cursor: default; }
.ui-order-handle:hover:not(:disabled) { background: var(--ui-primary-soft); }
.ui-order-handle:focus-visible { outline: 2px solid var(--ui-primary); outline-offset: 2px; }
.ui-order-row.ui-order-dragging { z-index: 2; transform: translateY(var(--order-drag-offset, 0px)); border-color: var(--ui-primary); background: var(--ui-primary-soft); box-shadow: var(--ui-shadow); }
.ui-order-dragging .ui-order-handle { cursor: grabbing; }
.ui-order-drop-before::before, .ui-order-drop-after::after { content: ""; position: absolute; z-index: 3; height: 3px; background: var(--ui-primary); inset-inline: 0; pointer-events: none; }
.ui-order-drop-before::before { top: calc(-1 * var(--ui-space-1)); }
.ui-order-drop-after::after { bottom: calc(-1 * var(--ui-space-1)); }
.ui-order-available { padding-inline-start: calc(var(--ui-hit-size, 36px) + 2ch + 2 * var(--ui-space-2)); }
.ui-order-announcement { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (pointer: coarse) { .ui-order-handle, .ui-order-actions .mud-icon-button { min-width: var(--ui-field-height); min-height: var(--ui-field-height); } }
@media (max-width: 380px) { .ui-order-row { gap: var(--ui-space-1); padding-inline: var(--ui-space-1); } .ui-order-actions { flex-direction: column; } }

/* SK: Zdieľané čitateľné karty a sekcie s gridom majú jednotné rozostupy, hodnoty a jazyky.
   EN: Shared read-only cards and grid sections use consistent spacing, values and languages. */
.ui-page .ui-panel.ui-detail-card { padding:var(--space-6) !important; min-width:0; }
.ui-page .ui-spaced-form .ui-panel.ui-detail-card h2.ui-detail-card-title { margin:0 0 var(--space-5); color:var(--ui-muted); font-size:var(--ui-font-help) !important; font-weight:var(--ui-weight-strong); text-transform:uppercase; letter-spacing:.06em; }
.ui-detail-card .ui-detail-values > div { min-width:0; display:flex; flex-direction:column; gap:var(--space-1); }
.ui-detail-card .ui-detail-values dt { font-size:var(--ui-font-help); color:var(--ui-muted); font-weight:var(--ui-weight-medium); }
.ui-detail-card .ui-detail-values dd { margin:0; font-size:var(--ui-font-body); color:var(--ui-text); font-weight:var(--ui-weight-medium); overflow-wrap:anywhere; }
.ui-detail-values dd.ui-detail-muted,.ui-detail-muted { color:var(--ui-muted); font-weight:var(--ui-weight-regular); }
.ui-detail-code,.ui-detail-language-code { padding:var(--space-1) var(--space-2); border-radius:var(--ui-radius-small); background:var(--ui-soft); font-size:var(--ui-font-help); font-weight:var(--ui-weight-strong); }
.ui-detail-separated { margin-top:var(--space-6); padding-top:var(--space-5); border-top:var(--ui-border-width) solid var(--ui-divider); }
.ui-detail-languages { list-style:none; padding:0; margin:0; }
.ui-detail-languages li { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-3); padding-block:var(--space-3); border-top:var(--ui-border-width) solid var(--ui-divider); }
.ui-detail-languages li:first-child { border:0; padding-top:0; }
.ui-detail-languages li:last-child { padding-bottom:0; }
.ui-detail-language-copy { flex:1; min-width:0; display:flex; flex-direction:column; gap:var(--space-1); overflow-wrap:anywhere; }
.ui-detail-language-copy strong { font-weight:var(--ui-weight-medium); }
.ui-detail-language-copy small,.ui-detail-language-copy p { color:var(--ui-muted); font-size:var(--ui-font-help); }
.ui-detail-language-copy p { margin:0; white-space:pre-wrap; }
.ui-detail-language-flags { display:flex; flex-wrap:wrap; gap:var(--space-1); }
.ui-detail-language-flags .mud-chip { margin:0; }
.ui-page .ui-detail-tabs > .mud-tabs-tabbar { background:transparent; border-bottom:var(--ui-border-width) solid var(--ui-divider); }
/* SK: Posun riadi MudTabs transformáciou; fokus nesmie pridať druhý natívny posun.
   EN: MudTabs controls translation; focus must not add a second native scroll offset. */
.ui-page .ui-detail-tabs > .mud-tabs-tabbar .mud-tabs-tabbar-content { min-width:0; overflow:clip; }
/* SK: Text záložiek používa bežnú navigačnú veľkosť, nie veľkosť nadpisov kariet.
   EN: Tab labels use the regular navigation text size rather than card-heading size. */
.ui-page .ui-detail-tabs .mud-tab { min-height:calc(var(--space-8) + var(--space-6)); padding-inline:var(--space-5); text-transform:none; font-size:var(--ui-font-body); color:var(--ui-text); }
.ui-page .ui-detail-tabs .mud-tab-active { font-weight:var(--ui-weight-strong); }
/* SK: Voliteľná spoločná veľkosť záložiek zodpovedá detailu používateľa.
   Priame potomstvo obmedzuje pravidlo na navigáciu, nie vnorený obsah panelov.
   EN: Opt-in shared tab sizing matches user details. Direct descendants keep
   the rule on navigation rather than nested panel content. */
.ui-page .ui-standard-tabs > .mud-tabs-tabbar .mud-tab {
 min-width:0; min-height:var(--ui-tab-height); padding:var(--space-2) var(--space-4);
 gap:var(--space-2); font-size:var(--ui-admin-tab-size); line-height:1.43;
 font-weight:500; text-transform:none;
}
.ui-page .ui-standard-tabs > .mud-tabs-tabbar .mud-tab-active { font-weight:var(--ui-weight-strong); }
.ui-detail-tabs > .mud-tabs-panels { padding-top:var(--space-5); }
.ui-detail-count { display:inline-flex; align-items:center; justify-content:center; padding:var(--space-1) var(--space-2); border-radius:var(--ui-radius-pill); background:var(--ui-soft); font-size:var(--ui-font-help); font-weight:var(--ui-weight-medium); }
.ui-page .ui-panel.ui-section-grid-card { padding:0 !important; min-width:0; overflow:hidden; }
.ui-section-grid-card > .ui-section-header { margin:0; padding:var(--space-5); border-bottom:var(--ui-border-width) solid var(--ui-divider); }
.ui-section-grid-card .ui-section-heading { flex:1; display:flex; align-items:center; gap:var(--space-2); flex-wrap:wrap; }
.ui-section-grid-card > .ui-data-grid { margin:0; border:0; border-radius:0; }
.ui-detail-grid-empty { display:flex; flex-direction:column; align-items:center; gap:var(--space-2); padding:var(--space-8) var(--space-4); }
.ui-page:not(:has(.login-page)) .ui-detail-grid-empty.ui-empty-state > .mud-icon-root { box-sizing:content-box; padding:var(--space-3); border-radius:var(--ui-radius); background:var(--ui-soft); color:var(--ui-muted); }
.ui-detail-grid-empty .mud-typography-subtitle1 { font-weight:var(--ui-weight-strong); color:var(--ui-text); }
@media(max-width:599px) {
 .ui-page .ui-detail-tabs .mud-tab { padding-inline:var(--space-3); font-size:var(--ui-font-body); }
 .ui-page .ui-panel.ui-detail-card { padding:var(--space-5) !important; }
}
.ui-section-grid-card .ui-section-icon { box-sizing:content-box; width:var(--space-5); height:var(--space-5); padding:var(--space-3); flex:none; border-radius:var(--ui-radius-small); background:var(--ui-primary-soft); color:var(--ui-primary); }

.ui-detail-badge { display:inline-flex; align-items:center; padding:var(--space-1) var(--space-3); border-radius:var(--ui-radius-pill); font-size:var(--ui-font-help); line-height:1.2; font-weight:var(--ui-weight-strong); }
.ui-detail-badge-active { background:var(--ui-admin-status-active-soft); color:var(--ui-admin-status-active); }
.ui-detail-badge-primary { background:var(--ui-primary-soft); color:var(--ui-primary); }
.ui-detail-badge-neutral,.ui-detail-code,.ui-detail-language-code,.ui-detail-count { background:var(--ui-grid-status-inactive-bg); color:var(--ui-text); }

/* SK: Čítací detail kusu a potvrdenia operácií používajú spoločnú typografiu,
   rozostupy a sémantické farby. Variant je opt-in a nemení ostatné dialógy.
   EN: Read-only item details and operation confirmations share typography,
   spacing and semantic colors. This opt-in variant leaves other dialogs unchanged. */
.ui-detail-card-heading { display:flex; align-items:center; gap:var(--space-2); flex-wrap:wrap; margin-bottom:var(--space-4); }
.ui-page .ui-spaced-form.ui-detail-typography .ui-panel.ui-detail-card .ui-detail-card-heading h2 { flex:1; margin:0; }
.ui-detail-card-heading > .ui-detail-muted { font-size:var(--ui-font-help); }
.ui-detail-secondary-code { display:block; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:var(--ui-font-xs); font-weight:500; color:var(--ui-muted); }
.ui-detail-monospace { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.ui-detail-copy-value { display:flex; align-items:center; gap:var(--space-2); min-width:0; }
.ui-detail-copy-value code { overflow-wrap:anywhere; }
.ui-detail-note { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; }
/* SK: Importované a spravované údaje, odkazy na typ a číselné pravidlá majú
   spoločný vzhľad bez zmien ich dátového vlastníctva. EN: Imported/managed
   data, type references and numeric rules share presentation without changing ownership. */
.ui-detail-ownership { display:inline-flex; align-items:center; gap:var(--space-2); }
.ui-detail-ownership .mud-icon-root { width:var(--space-4); height:var(--space-4); }
.ui-detail-reference { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3); padding:var(--space-4); border:var(--ui-border-width) solid var(--ui-border); border-radius:var(--ui-radius-input); }
.ui-detail-reference > dl { flex:1; min-width:0; }
.ui-detail-metric { display:flex; flex-direction:column; gap:var(--space-1); min-width:0; padding:var(--space-3) var(--space-4); border-radius:var(--ui-radius-input); background:var(--ui-soft); }
.ui-detail-metric-label { font-size:var(--ui-font-label); color:var(--ui-muted); font-weight:600; overflow-wrap:anywhere; }
.ui-detail-metric-value { display:flex; align-items:baseline; flex-wrap:wrap; gap:var(--space-1); color:var(--ui-text); }
.ui-detail-metric-value strong { font-size:var(--ui-dashboard-symbol-size); font-weight:700; line-height:1.2; font-variant-numeric:tabular-nums; }
.ui-detail-metric-value > span { font-size:var(--ui-font-body); color:var(--ui-muted); }
.ui-detail-metric small { font-size:var(--ui-font-help); color:var(--ui-muted); }
.ui-detail-metric small.ui-detail-metric-source { color:var(--ui-primary); }
.ui-detail-deadline { display:flex; align-items:center; gap:var(--space-3); padding-block:var(--space-3); border-top:var(--ui-border-width) solid var(--ui-divider); }
.ui-detail-deadline:last-child { padding-bottom:0; }
.ui-detail-deadline > span:first-child { flex:1; min-width:0; display:flex; flex-direction:column; gap:var(--space-1); }
.ui-detail-deadline-label { font-size:var(--ui-font-label); color:var(--ui-muted); font-weight:600; }
.ui-detail-deadline strong { font-size:var(--ui-font-body); font-weight:700; font-variant-numeric:tabular-nums; }
.ui-detail-deadline > .ui-detail-badge { flex:none; white-space:nowrap; }
.ui-detail-badge-info { color:var(--mud-palette-info); background:var(--mud-palette-info-hover); }
.ui-detail-badge-warning,.ui-pending-badge { color:var(--ui-warning); background:var(--ui-warning-soft); }
.ui-detail-badge-danger { color:var(--ui-error); background:var(--ui-dashboard-error-soft); }
.ui-pending-badge { display:inline-flex; padding:var(--space-1) var(--space-2); font-size:var(--ui-font-xs); font-weight:700; line-height:1; border:var(--ui-border-width) solid var(--ui-warning); border-radius:var(--ui-radius-small); }
.ui-action-group { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2); padding-inline-start:var(--space-3); border-inline-start:var(--ui-border-width) solid var(--ui-divider); }
.ui-page .ui-sticky-action-bar.ui-action-bar-surface { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2); padding:var(--space-3) var(--space-4); border:var(--ui-border-width) solid var(--ui-divider); border-radius:var(--ui-radius); background:var(--ui-surface); box-shadow:var(--ui-shadow); }
.ui-action-bar-surface .ui-sticky-action-bar-help { flex:none; margin-inline-end:auto; }
.ui-action-bar-surface .ui-sticky-action-bar-actions { display:contents; }
.ui-action-bar-surface > .ui-back-button { margin-inline-start:0; }
.ui-operation-dialog.ui-modal { width:min(100%,var(--ui-operation-dialog-width)); max-height:calc(100dvh - var(--space-8)); padding:0; overflow:auto; border-radius:var(--ui-radius); }
.ui-operation-heading { display:flex; align-items:center; gap:var(--space-4); padding:var(--space-5); }
.ui-operation-heading h2 { flex:1; margin:0; font-size:var(--ui-font-subtitle) !important; font-weight:700; }
.ui-operation-icon-danger,.ui-operation-icon-warning { box-sizing:content-box; padding:var(--space-3); border-radius:var(--ui-radius-input); }
.ui-operation-icon-danger { color:var(--ui-error); background:var(--ui-dashboard-error-soft); }
.ui-operation-icon-warning { color:var(--ui-warning); background:var(--ui-warning-soft); }
.ui-operation-body { display:flex; flex-direction:column; gap:var(--space-4); padding:0 var(--space-5) var(--space-5); }
.ui-operation-summary { margin:0; display:grid; grid-template-columns:auto minmax(0,1fr); gap:var(--space-1) var(--space-4); padding:var(--space-4); border:var(--ui-border-width) solid var(--ui-divider); border-radius:var(--ui-radius-input); background:var(--ui-soft); }
.ui-operation-summary dt { color:var(--ui-muted); }
.ui-operation-summary dd { margin:0; font-weight:600; overflow-wrap:anywhere; }
.ui-operation-summary .ui-detail-monospace { font-size:var(--ui-font-help); }
.ui-operation-fields { display:flex; flex-direction:column; gap:var(--space-4); }
.ui-operation-notice { margin:0; padding:var(--space-3) var(--space-4); border:var(--ui-border-width) solid; border-radius:var(--ui-radius-input); }
.ui-operation-notice-danger { color:var(--ui-error); border-color:var(--ui-dashboard-error-border); background:var(--ui-dashboard-error-soft); }
.ui-operation-notice-warning { color:var(--ui-warning); border-color:var(--ui-dashboard-warning-border); background:var(--ui-warning-soft); }
.ui-operation-date { width:50%; }
.ui-operation-actions { display:flex; justify-content:flex-end; gap:var(--space-2); padding:var(--space-4) var(--space-5); background:var(--ui-soft); border-top:var(--ui-border-width) solid var(--ui-divider); }
.ui-modal .ui-operation-actions .ui-operation-confirm-danger { background:var(--ui-error) !important; color:var(--ui-on-primary) !important; }
@media(max-width:599px) {
 .ui-operation-date { width:100%; }
 .ui-operation-summary { grid-template-columns:minmax(0,1fr); }
 .ui-operation-summary dd + dt { margin-top:var(--space-2); }
 .ui-action-group { padding-inline-start:0; border:0; }
}

/* SK: Nadpis a ikona zostávajú spolu; pri úzkej karte sa akcia zalomí na nový riadok.
   EN: Keep the heading and icon together; the action wraps onto a new row on narrow cards. */
.ui-section-grid-title { display:flex; align-items:center; gap:var(--space-3); flex:1 1 15rem; min-width:0; }

/* SK: Čítací detail preberá typografickú škálu aplikácie bez lokálneho zväčšovania.
   Aktivácia nemení rozloženie, akcie ani ostatné stránky. Výslovné odsadenie
   kariet a kódu zodpovedá zadaniu (polovičný krok škály predstavuje 2 px).
   EN: Read-only details inherit the application type scale without local enlargement.
   Opting in does not change layout, actions or other pages. Explicit
   card and code padding follows the brief (half a spacing step equals 2 px). */
.ui-detail-typography {
 --ui-detail-label-color:#5C5C66;
 --ui-detail-value-color:#1A1A1F;
 --ui-detail-empty-color:#75757F;
 --ui-detail-code-background:#F1F1F4;
 font-size:var(--ui-font-body);
}
.ui-page .ui-detail-typography .ui-detail-tabs .mud-tab { font-weight:500; }
.ui-page .ui-detail-typography .ui-detail-tabs .mud-tab-active { font-weight:700; }
.ui-page .ui-spaced-form.ui-detail-typography .ui-panel.ui-detail-card { padding:var(--space-5) calc(var(--space-5) + var(--space-1) / 2) calc(var(--space-5) + var(--space-1) / 2) !important; }
.ui-page .ui-spaced-form.ui-detail-typography .ui-panel.ui-detail-card h2 {
 margin:0 0 var(--space-4);
 font-size:var(--ui-font-subtitle) !important;
 font-weight:700;
 text-transform:none;
 letter-spacing:0;
 color:var(--ui-detail-value-color);
}
.ui-detail-typography .ui-detail-card .ui-detail-values dt { font-size:var(--ui-font-label); font-weight:600; color:var(--ui-detail-label-color); }
.ui-detail-typography .ui-detail-card .ui-detail-values dd { font-size:var(--ui-font-body); font-weight:600; color:var(--ui-detail-value-color); }
.ui-detail-typography .ui-detail-card .ui-detail-values dd.ui-detail-muted,
.ui-detail-typography .ui-detail-card .ui-detail-values dd .ui-detail-muted { font-size:var(--ui-font-body); font-weight:500; color:var(--ui-detail-empty-color); }
.ui-detail-typography .ui-detail-code {
 font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
 font-size:var(--ui-font-body);
 font-weight:600;
 text-transform:none;
 background:var(--ui-detail-code-background);
 padding:calc(var(--space-1) / 2) var(--space-2);
 border-radius:calc(var(--space-3) / 2);
}
.ui-detail-typography .ui-detail-language-copy strong { font-size:var(--ui-font-body); font-weight:600; color:var(--ui-detail-value-color); }
.ui-detail-typography .ui-detail-language-copy small,.ui-detail-typography .ui-detail-language-copy p { font-size:var(--ui-font-help); color:var(--ui-detail-label-color); }
.ui-detail-typography .ui-detail-language-code { font-size:var(--ui-font-help); font-weight:700; }
.ui-detail-typography .ui-detail-badge { font-size:var(--ui-font-help); font-weight:700; }

/* SK: Spoločné sekcie, kartové rádiá a množstvo zachovávajú škálu rozostupov aj pri zalomení.
   EN: Shared sections, radio cards and quantity controls preserve spacing when wrapping. */
.ui-form-section-separated { margin-top:var(--space-6); padding-top:var(--space-6); border-top:var(--ui-border-width) solid var(--ui-divider); }
.ui-choice-card-group { min-width:0; margin:0; padding:0; border:0; }
.ui-choice-card-group > legend { margin-bottom:var(--space-2); padding:0; font-size:var(--ui-font-label); font-weight:var(--ui-weight-medium); }
.ui-choice-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-3); }
.ui-choice-card { display:flex; align-items:center; gap:var(--space-3); min-width:0; padding:var(--space-3); border:var(--ui-border-width) solid var(--ui-border); border-radius:var(--ui-radius-input); background:var(--ui-surface); cursor:pointer; }
.ui-choice-card:has(input:checked) { border-color:var(--ui-primary); box-shadow:inset 0 0 0 var(--ui-border-width) var(--ui-primary); background:var(--ui-primary-soft); }
.ui-choice-card:has(input:focus-visible) { outline:var(--ui-focus-width) solid var(--ui-primary); outline-offset:var(--ui-focus-width); }
.ui-choice-card:has(input:disabled) { cursor:default; }
.ui-choice-card input[type=radio] { flex:none; margin:0; width:var(--space-5); height:var(--space-5); accent-color:var(--ui-primary); }
.ui-choice-card > span { display:flex; flex-direction:column; min-width:0; gap:var(--space-1); overflow-wrap:anywhere; }
.ui-choice-card strong { font-size:var(--ui-font-body); font-weight:var(--ui-weight-medium); }
.ui-choice-card small { font-size:var(--ui-font-help); font-weight:var(--ui-weight-normal); color:var(--ui-muted); line-height:1.4; }
.ui-required-marker { color:var(--ui-error); }
.ui-quantity-field { display:flex; flex-direction:column; min-width:0; gap:calc(var(--space-3) / 2); }
.ui-quantity-stepper { display:grid; grid-template-columns:var(--ui-field-height) minmax(0,1fr) var(--ui-field-height); align-items:start; gap:var(--space-2); }
.ui-page .ui-quantity-stepper .ui-input { margin:0 !important; min-width:0; }
.ui-quantity-stepper input { text-align:center; font-variant-numeric:tabular-nums; font-weight:var(--ui-weight-medium); }
/* SK: Číslo a jednotka tvoria jeden vycentrovaný údaj; šírka poľa rastie s počtom číslic.
   EN: Center the number and unit together; the editable input grows with its digit count. */
.ui-page .ui-quantity-stepper .mud-input-adorned-end { justify-content:center; gap:var(--space-2); padding-inline:var(--space-2) !important; }
.ui-page .ui-quantity-stepper .mud-input-slot { flex:0 1 calc(var(--ui-quantity-digits,6) * 1ch + var(--space-2)); width:calc(var(--ui-quantity-digits,6) * 1ch + var(--space-2)); padding-inline:0 !important; }
.ui-quantity-stepper .mud-input-adornment { margin:0; }
.ui-page .ui-quantity-stepper .ui-quantity-action { width:var(--ui-field-height); min-width:0; height:calc(var(--ui-field-height) + 2 * var(--ui-border-width)) !important; padding:0 !important; }
.ui-quantity-help { font-size:var(--ui-font-help); color:var(--ui-muted); }
.ui-page .ui-input.ui-context-field .mud-input-outlined { background:var(--ui-soft) !important; }
.ui-summary-highlight { margin:0 0 var(--space-4); padding:var(--space-4); border-radius:var(--ui-radius-input); background:var(--ui-primary-soft); color:var(--ui-text); font-size:var(--ui-font-body); line-height:1.5; overflow-wrap:anywhere; }
@media(max-width:599px) { .ui-choice-cards { grid-template-columns:minmax(0,1fr); } }

/* SK: Segmentová navigácia a kontextová lišta gridu zdieľajú rovnaké stavy a rozostupy.
   EN: Segmented navigation and the grid context bar share states and spacing. */
.ui-segmented-choice { min-width:0; max-width:100%; margin:0; padding:0; border:0; }
.ui-segmented-options { display:flex; flex-wrap:wrap; gap:var(--space-1); padding:var(--space-1); border-radius:var(--ui-radius-input); background:var(--ui-grid-status-inactive-bg); }
.ui-segmented-option { position:relative; min-width:0; display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2); min-height:var(--ui-button-height); padding:var(--space-2) var(--space-4); border-radius:var(--ui-radius-input); color:var(--ui-text); font-size:var(--ui-font-button); font-weight:var(--ui-weight-medium); cursor:pointer; overflow-wrap:anywhere; }
.ui-segmented-option input { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:inherit; }
.ui-segmented-option:has(input:checked) { background:var(--ui-surface); box-shadow:var(--ui-shadow); font-weight:var(--ui-weight-strong); }
.ui-segmented-option:hover:not(:has(input:disabled)) { color:var(--ui-primary); }
.ui-segmented-option:has(input:focus-visible) { outline:var(--ui-focus-width) solid var(--ui-primary); outline-offset:var(--ui-focus-width); }
.ui-segmented-option:has(input:disabled) { cursor:default; }
.ui-segmented-count { display:inline-flex; align-items:center; justify-content:center; min-width:var(--space-5); min-height:var(--space-5); padding:0 var(--space-2); border-radius:var(--ui-radius-pill); background:var(--ui-grid-status-inactive-bg); font-size:var(--ui-font-help); font-weight:var(--ui-weight-strong); }
.ui-segmented-option:has(input:checked) .ui-segmented-count { background:var(--ui-primary-soft); color:var(--ui-primary); }
.ui-grid-context-header { padding:var(--space-4) var(--space-5); border-bottom:var(--ui-border-width) solid var(--ui-divider); }
.ui-grid-context-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-4); }
.ui-grid-context-company { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-3); margin-inline-start:auto; }
.ui-grid-context-company > span { font-size:var(--ui-font-label); font-weight:var(--ui-weight-medium); }
.ui-grid-context-company .ui-segmented-option:has(input:checked) { color:var(--ui-primary); }
.ui-grid-context-caption { margin:var(--space-4) 0 0; font-size:var(--ui-font-body); color:var(--ui-muted); line-height:1.5; }
.ui-page .ui-data-grid .ui-grid-number { text-align:right; font-variant-numeric:tabular-nums; }
.ui-page .ui-data-grid th.ui-grid-number .column-header { justify-content:flex-end; }
.ui-page .ui-data-grid .ui-grid-code { font-family:var(--ui-font-monospace); }
@media(max-width:599px) {
 .ui-grid-context-header { padding:var(--space-4); }
 .ui-grid-context-toolbar > .ui-segmented-choice { flex-basis:100%; }
 .ui-grid-context-toolbar > .ui-segmented-choice .ui-segmented-option { flex:1 1 auto; }
 .ui-grid-context-company { margin-inline-start:0; }
}

/* SK: Uložený záznam zostáva zreteľne označený aj pri pruhovaní a hover; text ostáva čitateľný.
   EN: A saved row remains distinct with striping and hover while retaining readable text. */
.ui-page .ui-data-grid tr.ui-grid-saved-row > td { background:var(--ui-primary-soft); box-shadow:inset 0 1px var(--ui-primary),inset 0 -1px var(--ui-primary); }
.ui-page .ui-data-grid tr.ui-grid-saved-row > td:first-child { border-inline-start:var(--space-1) solid var(--ui-primary); }

.ui-page .ui-saved-record-notice { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-3); border-color:var(--ui-primary); background:var(--ui-primary-soft); padding:var(--space-4) var(--space-5); }
.ui-saved-record-notice > div { flex:1; min-width:0; }
.ui-saved-record-notice strong { font-size:var(--ui-font-body); }
.ui-saved-record-notice p { margin:var(--space-1) 0 0; font-size:var(--ui-font-help); }

.ui-page .ui-saved-item { padding:var(--space-3) var(--space-4); border-inline-start:var(--space-1) solid var(--ui-primary); background:var(--ui-primary-soft); border-radius:var(--ui-radius-input); }