/* Form field styles for non-wizard pages (loaded after Radzen so these rules win). */
/* Matches Wizard.razor / RFQ / Note Payable look. */
.form-group { margin-bottom: 20px; }
.form-label { display: block; margin-bottom: 8px; font-weight: 500; color: #212121; font-size: 14px; }
.form-input { width: 100%; padding: 10px 12px; border: 1px solid #e0e0e0; border-radius: 8px; font-size: 14px; box-sizing: border-box; }
.form-input:focus { border-color: #1976d2; outline: none; box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.15); }
.form-group textarea.form-input { resize: vertical; min-height: 90px; }
.required { color: #f44336; }

/* Radzen DropDown — vertical centering + ellipsis without clipping placeholders.
   NEVER set label line-height to the full control height on all .rz-dropdown (breaks
   wizards / template bars that are shorter than --rz-input-height). */
.rz-dropdown.form-input,
.searchable-dropdown.form-input,
.item-selector-dropdown.form-input {
    padding: 0 !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    height: var(--rz-input-height, 2.5rem) !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* Value takes the leftover width. Clear and arrow stay in a fixed trailing strip
   so a narrow field (unit of measure, and any other short dropdown) cannot paint
   the clear mark over the text. Logical inline edges keep the strip on the trailing
   side in both directions. */
.rz-dropdown {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    min-width: 0 !important;
}

.rz-dropdown > .rz-helper-hidden-accessible {
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
}

.rz-dropdown .rz-dropdown-trigger {
    position: static !important;
    inset: auto !important;
    order: 3;
    flex: 0 0 var(--rz-dropdown-trigger-icon-width, 1.75rem) !important;
    width: var(--rz-dropdown-trigger-icon-width, 1.75rem) !important;
    min-width: var(--rz-dropdown-trigger-icon-width, 1.75rem) !important;
    max-width: var(--rz-dropdown-trigger-icon-width, 1.75rem) !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.rz-dropdown .rz-dropdown-trigger .rzi {
    margin: 0 !important;
}

.rz-dropdown .rz-dropdown-clear-icon {
    position: static !important;
    inset: auto !important;
    order: 2;
    flex: 0 0 var(--rz-dropdown-trigger-icon-width, 1.75rem) !important;
    width: var(--rz-dropdown-trigger-icon-width, 1.75rem) !important;
    min-width: var(--rz-dropdown-trigger-icon-width, 1.75rem) !important;
    max-width: var(--rz-dropdown-trigger-icon-width, 1.75rem) !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: stretch !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.rz-dropdown.rz-state-disabled > .rz-dropdown-clear-icon {
    display: none !important;
}

/* Label: flex-centered text + ellipsis. End padding is only a gap before the icon strip. */
.rz-dropdown .rz-dropdown-label {
    order: 1;
    flex: 1 1 0% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    width: auto !important;
    height: 100% !important;
    align-self: stretch !important;
    margin: 0 !important;
    padding-block: 0 !important;
    padding-inline: 12px 4px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    line-height: 1.25 !important;
    font-size: 14px !important;
}

.rz-dropdown .rz-dropdown-label > * {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* Reference/Enum editors: keep trigger within cell; long text ellipsizes (full value via title tooltip). */
.entity-reference-dropdown-scroll,
.enum-editor-dropdown-scroll {
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    overflow: hidden;
    flex: 1 1 0%;
}
.enum-editor-dropdown-scroll {
    display: block;
}
.enum-editor-dropdown-scroll .rz-dropdown,
.entity-reference-dropdown-scroll .rz-dropdown,
.entity-reference-editor,
.searchable-dropdown-host {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* Grid / wizard line cells: force flex min-content shrink so long Account names
   cannot widen the cell into Debit. */
.lw-datagrid-td {
    overflow: hidden !important;
    max-width: 0;
}

.lw-datagrid-td .entity-reference-editor,
.lw-datagrid-td .searchable-dropdown-host,
.lw-datagrid-td .item-selector-with-find,
.lw-datagrid-td .rl-shell-inline-editor,
.lw-datagrid-td .dynamic-field-editor,
.lw-grid-cell .entity-reference-editor,
.lw-grid-cell .searchable-dropdown-host,
.lw-grid-cell .item-selector-with-find,
.rz-data-grid .entity-reference-editor,
.rz-data-grid .searchable-dropdown-host,
.rz-cell .entity-reference-editor,
.rz-cell .searchable-dropdown-host,
.rz-grid-table td .entity-reference-editor,
.rz-grid-table td .searchable-dropdown-host {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* Do not apply padding/min-height to every td editor — Bulk New / compact cells clip when forced taller. */
.lw-datagrid-td .rl-shell-inline-editor,
.lw-datagrid-td .dynamic-field-editor {
    display: flex !important;
    align-items: center !important;
}

.lw-datagrid-td .entity-reference-dropdown-wrap,
.rz-data-grid td .entity-reference-dropdown-wrap,
.rz-grid-table td .entity-reference-dropdown-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.lw-datagrid-td .rz-dropdown,
.lw-datagrid-td .rz-numeric,
.lw-datagrid-td .rz-spinner,
.rz-data-grid td .rz-dropdown.form-input,
.rz-data-grid td .rz-numeric.form-input,
.rz-grid-table td .rz-dropdown.form-input,
.rz-grid-table td .rz-numeric.form-input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* Focus ring must not paint into the next column. */
.lw-datagrid-td .form-input:focus,
.lw-datagrid-td .rz-dropdown:focus,
.rz-data-grid td .form-input:focus,
.rz-grid-table td .form-input:focus {
    box-shadow: inset 0 0 0 2px rgba(25, 118, 210, 0.45) !important;
}

/* Radzen DatePicker (RadzenDatePicker): fix broken CSS and "fixed location" in scroll (Radzen 9 / Material theme). */
/* See https://blazor.radzen.com/datepicker - input lives in .rz-calendar; popup is .rz-datepicker. */
/*
 * WHY ONLY THE DATE PICKER BREAKS:
 * TextBox, Numeric, Switch, etc. are plain inputs with no popup. DropDown/EnumEditor open lists that Radzen
 * may render in a shared overlay. The DatePicker opens a calendar PANEL that is rendered in the same DOM
 * tree as the trigger. Any ancestor with overflow:hidden or overflow:auto (e.g. wizard step content,
 * report container) CLIPS this popup, so the calendar never appears or is cut off. So only the DatePicker
 * is affected. Fix: wizard uses Inline=true (calendar below input, no popup). Reports: container overflow
 * set to visible so the popup can extend outside.
 */

/* Form-field wrapper (Material theme wraps in .rz-form-field): force full width and in-flow so it doesn't overlap. */
.rz-form-field:has(.rz-calendar),
.form-group .rz-form-field .rz-calendar {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}
.rz-form-field:has(.rz-calendar) {
    display: block !important;
    position: relative !important;
}
.rz-form-field:has(.rz-calendar) .rz-form-field-content {
    position: relative !important;
    width: 100% !important;
    display: flex !important;
    box-sizing: border-box !important;
}

/* Calendar input wrapper: in flow, full width. */
.rz-calendar {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    position: relative !important;
}
.rz-calendar .rz-inputtext {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 0 !important;
}

/* Popup: z-index only; never position:fixed so it doesn't stay viewport-fixed when dialog scrolls. */
.rz-datepicker-panel,
.rz-datepicker.rz-popup,
.rz-datepicker:not(.rz-datepicker-inline) {
    /* Above custom full-viewport overlays (e.g. RFQ vendor response at z-index 100000) and Radzen DialogService modals. */
    z-index: 100500 !important;
}

/* Radzen DropDown/Select popups: above criteria builder (100511) and other high z-index modals. */
.rz-dropdown-panel,
.rz-multiselect-panel,
.rz-autocomplete-panel,
.rz-select-popup,
.rz-popup.rz-dropdown-panel,
.rz-popup.rz-multiselect-panel,
.rz-popup.rz-autocomplete-panel {
    z-index: 100530 !important;
}

/* GL report pages: allow Radzen DatePicker popup to extend outside container (avoids clipping). */
.gl-report-container {
    overflow: visible !important;
}

/* Collection/payment schedule settle: keep cheque/bank/cash dropdown panels inside this dialog
   (not the installment preview behind it) and unclipped by dialog overflow. */
.rz-dialog-wrapper.sched-settle-rz-dialog-wrap,
.rz-dialog.sched-settle-rz-dialog {
    z-index: 10040 !important;
}
.rz-dialog.sched-settle-rz-dialog .rz-dialog-content,
.sched-settle {
    overflow: visible !important;
}
.sched-settle .rz-popup,
.sched-settle .rz-dropdown-panel {
    z-index: 20 !important;
}