/* ========================================================================
   NaviERP shared ERP theme

   This is the final application theme layer. Page components should consume
   these tokens instead of introducing new page-specific colours and spacing.
   The palette follows the blue-and-white visual language used by Login.razor.
   ======================================================================== */

:root {
    color-scheme: light;

    --erp-navy-950: #062f5b;
    --erp-navy-900: #073d73;
    --erp-blue-800: #0759ad;
    --erp-blue-700: #086ad8;
    --erp-blue-600: #1477df;
    --erp-blue-500: #2b89e6;
    --erp-blue-100: #d9ebff;
    --erp-blue-75: #eaf4ff;
    --erp-blue-50: #f5f9ff;

    --erp-nav-background: linear-gradient(180deg, #fbfdff 0%, #f2f7fc 100%);
    --erp-nav-surface: #ffffff;
    --erp-nav-text: #183b5b;
    --erp-nav-text-strong: #0b2f52;
    --erp-nav-text-muted: #647d96;
    --erp-nav-icon: #47779c;
    --erp-nav-active: #086ad8;
    --erp-nav-active-background: #e7f2ff;
    --erp-nav-expanded-background: #f0f6fc;
    --erp-nav-favorite: #d99a0b;
    --erp-nav-hover: #edf5fd;
    --erp-nav-border: #d7e4f0;
    --erp-nav-disabled: #9aacbd;
    --erp-nav-shadow: 5px 0 18px rgba(36, 74, 110, .12);
    --erp-nav-accent-1: #1677c8;
    --erp-nav-accent-2: #0f8b8d;
    --erp-nav-accent-3: #6f62c7;
    --erp-nav-accent-4: #b87518;
    --erp-nav-accent-5: #277da1;
    --erp-nav-accent-6: #218c6a;
    --erp-nav-pinned-width: 232px;
    --erp-nav-rail-width: 56px;

    --erp-header-background: #fbfdff;
    --erp-header-text: #183b5b;
    --erp-header-text-strong: #0b2f52;
    --erp-header-muted: #647d96;
    --erp-header-hover: #edf5fd;
    --erp-header-border: #d7e4f0;

    --erp-page: #f6faff;
    --erp-surface: #ffffff;
    --erp-surface-subtle: #f6faff;
    --erp-surface-muted: #eef5fc;
    --erp-row-alt: #fbfdff;
    --erp-row-hover: #eef6ff;
    --erp-row-selected: #e6f2ff;

    --erp-text: #092f5d;
    --erp-text-secondary: #28496f;
    --erp-text-muted: #6b809b;
    --erp-text-disabled: #9aabc0;

    --erp-border: #dbe7f4;
    --erp-border-soft: #e7eef7;
    --erp-border-strong: #c8d8e9;
    --erp-focus: #086ad8;

    --erp-success: #027a48;
    --erp-success-soft: #ecfdf3;
    --erp-success-border: #abefc6;
    --erp-warning: #b54708;
    --erp-warning-soft: #fffaeb;
    --erp-warning-border: #fedf89;
    --erp-danger: #b42318;
    --erp-danger-soft: #fef3f2;
    --erp-danger-border: #fecdca;
    --erp-info: #175cd3;
    --erp-info-soft: #eef6ff;
    --erp-info-border: #b8dbff;

    --erp-radius-xs: 3px;
    --erp-radius-sm: 4px;
    --erp-radius-md: 7px;
    --erp-radius-lg: 9px;
    --erp-radius-pill: 999px;

    --erp-space-1: 4px;
    --erp-space-2: 8px;
    --erp-space-3: 12px;
    --erp-space-4: 16px;
    --erp-space-5: 20px;
    --erp-space-6: 24px;

    --erp-control-height: 34px;
    --erp-grid-row-height: 30px;
    --erp-header-height: 42px;
    --erp-footer-height: 24px;
    --erp-font: "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
    --erp-font-size: 12px;
    --erp-shadow-sm: 0 2px 8px rgba(7, 61, 115, .05);
    --erp-shadow-md: 0 10px 28px rgba(6, 47, 91, .14);

    /* Fluent UI design-token alignment. */
    --accent-fill-rest: var(--erp-blue-700);
    --accent-fill-hover: var(--erp-blue-800);
    --accent-fill-active: var(--erp-navy-950);
    --accent-foreground-rest: var(--erp-blue-700);
    --accent-foreground-hover: var(--erp-blue-800);
    --focus-stroke-outer: var(--erp-focus);
    --neutral-foreground-rest: var(--erp-text);
    --neutral-foreground-hint: var(--erp-text-muted);
    --neutral-stroke-rest: var(--erp-border);
    --neutral-layer-1: var(--erp-surface);
    --neutral-layer-2: var(--erp-surface-subtle);
    --neutral-layer-3: var(--erp-surface-muted);
}

/* Shared module icon palette. Root menu groups are assigned these classes by
   display order, and all descendants inherit the same restrained accent. */
.erp-menu-accent-0 {
    --erp-menu-accent: var(--erp-nav-favorite);
}

.erp-menu-accent-1 {
    --erp-menu-accent: var(--erp-nav-accent-1);
}

.erp-menu-accent-2 {
    --erp-menu-accent: var(--erp-nav-accent-2);
}

.erp-menu-accent-3 {
    --erp-menu-accent: var(--erp-nav-accent-3);
}

.erp-menu-accent-4 {
    --erp-menu-accent: var(--erp-nav-accent-4);
}

.erp-menu-accent-5 {
    --erp-menu-accent: var(--erp-nav-accent-5);
}

.erp-menu-accent-6 {
    --erp-menu-accent: var(--erp-nav-accent-6);
}

html,
body {
    background: var(--erp-page);
    color: var(--erp-text);
    font-family: var(--erp-font);
}

body {
    font-size: var(--erp-font-size);
}

/* ========================================================================
   Application shell and bounded work area
   ======================================================================== */

body .d365-shell,
.d365-shell .d365-workarea,
.d365-shell .d365-main {
    background: var(--erp-page);
}

.d365-shell {
    color: var(--erp-text);
    font-family: var(--erp-font);
}

.d365-shell .d365-topbar,
.d365-shell:not(.dark-header) .d365-topbar {
    color: var(--erp-header-text);
    background: var(--erp-header-background);
    border-bottom: 1px solid var(--erp-header-border);
    box-shadow: 0 1px 4px rgba(7, 61, 115, .05);
}

.d365-shell.dark-header .d365-topbar {
    color: #ffffff;
    background: var(--erp-navy-950);
    border-color: rgba(255, 255, 255, .10);
}

.d365-shell:not(.dark-header) .d365-app-launcher {
    width: var(--erp-nav-rail-width);
    min-width: var(--erp-nav-rail-width);
    color: var(--erp-blue-700);
    background: transparent;
    border-right: 1px solid var(--erp-header-border);
}

.d365-shell:not(.dark-header) .d365-app-launcher:hover {
    color: var(--erp-blue-800);
    background: var(--erp-header-hover);
}

.d365-shell:not(.dark-header) .d365-product-title,
.d365-shell:not(.dark-header) .d365-header-icon {
    color: var(--erp-header-text);
}

.d365-shell:not(.dark-header) .d365-header-icon:hover,
.d365-shell:not(.dark-header) .d365-profile-box:hover {
    color: var(--erp-blue-700);
    background: var(--erp-header-hover);
}

.d365-shell:not(.dark-header) .d365-search {
    background: var(--erp-surface);
    border: 1px solid var(--erp-header-border);
    border-radius: var(--erp-radius-md);
}

.d365-shell:not(.dark-header) .d365-company-selector {
    color: var(--erp-header-text-strong);
    background: var(--erp-surface);
    border: 1px solid var(--erp-header-border);
    border-radius: var(--erp-radius-md);
}

.d365-shell .d365-sidebar {
    background: var(--erp-nav-background);
    border-color: var(--erp-nav-border);
    box-shadow: 3px 0 12px rgba(36, 74, 110, .08);
}

.d365-shell .d365-sidebar.pinned {
    width: var(--erp-nav-pinned-width);
    min-width: var(--erp-nav-pinned-width);
}

.d365-shell .d365-sidebar.rail {
    width: var(--erp-nav-rail-width);
    min-width: var(--erp-nav-rail-width);
}

.d365-shell .erp-dynamic-nav.rail {
    width: var(--erp-nav-rail-width);
}

.d365-shell .d365-body {
    min-height: 0;
    background: var(--erp-page);
}

.d365-article,
#article,
#body-content {
    min-width: 0;
    min-height: 0;
}

.d365-article {
    height: 100%;
}

.d365-shell .d365-footer {
    background: var(--erp-surface-muted);
    border-color: var(--erp-border);
}

.d365-shell .d365-panel {
    background: var(--erp-surface);
    color: var(--erp-text);
    border-color: var(--erp-border);
    border-radius: 0 0 var(--erp-radius-md) var(--erp-radius-md);
    box-shadow: var(--erp-shadow-md);
}

.panel-header,
.notification-toolbar,
.panel-footer-actions,
.setting-row,
.erp-profile-header,
.erp-profile-section,
.erp-profile-actions {
    border-color: var(--erp-border-soft);
}

.module-grid button,
.quick-link-list button,
.search-results button,
.notification-list button,
.help-list button,
.company-list button,
.company-current-card,
.erp-profile-context div {
    background: var(--erp-surface);
    border-color: var(--erp-border-soft);
    border-radius: var(--erp-radius-sm);
}

.module-grid button:hover,
.quick-link-list button:hover,
.search-results button:hover,
.help-list button:hover,
.company-list button:hover {
    background: var(--erp-row-hover);
    border-color: var(--erp-info-border);
}

/* ========================================================================
   Reusable page, panel, form and status primitives
   ======================================================================== */

.erp-page-shell {
    width: 100%;
    min-width: 0;
    min-height: 0;
    padding: var(--erp-space-2);
    background: var(--erp-page);
    color: var(--erp-text);
}

.erp-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--erp-space-3);
    padding: 10px 12px;
    background: var(--erp-surface);
    border: 1px solid var(--erp-border);
    border-radius: var(--erp-radius-lg);
    box-shadow: var(--erp-shadow-sm);
}

.erp-page-header h1,
.erp-page-title {
    margin: 0;
    color: var(--erp-text);
    font-size: 18px;
    font-weight: 750;
    letter-spacing: -.02em;
}

.erp-page-header p,
.erp-page-subtitle,
.erp-breadcrumb {
    margin: 3px 0 0;
    color: var(--erp-text-muted);
    font-size: 11px;
}

.erp-card,
.erp-panel,
.erp-form-section {
    min-width: 0;
    background: var(--erp-surface);
    border: 1px solid var(--erp-border);
    border-radius: var(--erp-radius-lg);
    box-shadow: var(--erp-shadow-sm);
}

.erp-section-header {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--erp-space-2);
    padding: 7px 10px;
    background: linear-gradient(180deg, var(--erp-surface), var(--erp-surface-subtle));
    border-bottom: 1px solid var(--erp-border-soft);
    color: var(--erp-text);
    font-size: 13px;
    font-weight: 700;
}

.erp-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(160px, 1fr));
    gap: var(--erp-space-3) var(--erp-space-4);
}

.erp-field {
    min-width: 0;
    color: var(--erp-text-secondary);
    font-size: 11px;
    font-weight: 650;
}

.erp-field-required,
.erp-required {
    color: var(--erp-danger);
}

.erp-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--erp-space-2);
    padding-top: var(--erp-space-3);
    border-top: 1px solid var(--erp-border-soft);
}

.erp-internal-scroll {
    min-width: 0;
    min-height: 0;
    overflow: auto;
    scrollbar-color: var(--erp-border-strong) var(--erp-surface-muted);
}

.erp-empty-state {
    padding: var(--erp-space-6);
    color: var(--erp-text-muted);
    text-align: center;
    background: var(--erp-surface);
    border: 1px dashed var(--erp-border-strong);
    border-radius: var(--erp-radius-md);
}

.erp-badge,
.erp-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    min-height: 20px;
    padding: 1px 8px;
    border: 1px solid transparent;
    border-radius: var(--erp-radius-pill);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

.erp-badge.success,
.erp-status-badge.success,
.erp-message.success {
    color: var(--erp-success);
    background: var(--erp-success-soft);
    border-color: var(--erp-success-border);
}

.erp-badge.info,
.erp-status-badge.info,
.erp-message.info {
    color: var(--erp-info);
    background: var(--erp-info-soft);
    border-color: var(--erp-info-border);
}

.erp-badge.warning,
.erp-status-badge.warning,
.erp-message.warning {
    color: var(--erp-warning);
    background: var(--erp-warning-soft);
    border-color: var(--erp-warning-border);
}

.erp-badge.danger,
.erp-status-badge.danger,
.erp-message.error {
    color: var(--erp-danger);
    background: var(--erp-danger-soft);
    border-color: var(--erp-danger-border);
}

.erp-badge.neutral,
.erp-status-badge.neutral {
    color: var(--erp-text-secondary);
    background: var(--erp-surface-muted);
    border-color: var(--erp-border);
}

.erp-message {
    padding: 8px 10px;
    border: 1px solid;
    border-radius: var(--erp-radius-sm);
    font-size: 12px;
}

/* ========================================================================
   Fluent and native controls
   ======================================================================== */

.d365-shell fluent-button::part(control) {
    min-height: var(--erp-control-height);
    border-radius: var(--erp-radius-md);
    font-family: var(--erp-font);
    font-size: 12px;
}

/* Fluent UI V5: a vertical fluent-divider has a built-in min-height of 84px, which made
   every toolbar containing one 84px tall. NaviERP sets each divider's height itself
   (toolbar 18px, info bars 30px), so drop that minimum and clip the line to the set height. */
.d365-shell fluent-divider[orientation="vertical"] {
    min-height: 0;
    overflow: hidden;
}

/* Fluent UI V5: fluent-text-input always renders an internal label with 4px bottom padding
   (it only hides when the input is completely empty, so a search icon keeps it visible).
   Blazor's FluentTextInput puts labels in the outer fluent-field, so this one is never used. */
.d365-shell fluent-text-input::part(label) {
    display: none;
}

.d365-shell fluent-text-input::part(root) {
    display: flex;
}

/* Fluent UI V5: fluent-menu is inline-block, so its button sat on a text line that added
   descender space under it (made the toolbar taller). Lay it out as flex instead. */
.d365-shell fluent-menu {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

.d365-shell fluent-text-field,
.d365-shell fluent-number-field,
.d365-shell fluent-text-area,
.d365-shell fluent-select,
.d365-shell fluent-dropdown,
.d365-shell fluent-search,
.d365-shell fluent-date-picker,
.d365-shell input,
.d365-shell select,
.d365-shell textarea,
.d365-shell button {
    font-family: var(--erp-font);
}

.d365-shell fluent-text-field::part(control),
.d365-shell fluent-number-field::part(control),
.d365-shell fluent-text-area::part(control),
.d365-shell fluent-select::part(control),
.d365-shell fluent-search::part(control),
.d365-shell fluent-date-picker::part(control) {
    border-color: var(--erp-border-strong);
    border-radius: var(--erp-radius-sm);
    background: var(--erp-surface);
}

.d365-shell fluent-text-field:focus-within::part(control),
.d365-shell fluent-number-field:focus-within::part(control),
.d365-shell fluent-text-area:focus-within::part(control),
.d365-shell fluent-select:focus-within::part(control),
.d365-shell fluent-search:focus-within::part(control),
.d365-shell fluent-date-picker:focus-within::part(control) {
    border-color: var(--erp-focus);
    box-shadow: 0 0 0 1px rgba(0, 120, 212, .16);
}

.d365-shell input:disabled,
.d365-shell select:disabled,
.d365-shell textarea:disabled,
.d365-shell fluent-text-field[disabled]::part(control),
.d365-shell fluent-number-field[disabled]::part(control),
.d365-shell fluent-select[disabled]::part(control) {
    color: var(--erp-text-disabled);
    background: var(--erp-surface-muted);
}

.d365-shell fluent-dialog::part(dialog) {
    border: 1px solid var(--erp-border);
    border-radius: var(--erp-radius-lg);
    box-shadow: 0 18px 48px rgba(0, 31, 63, .20);
}

.d365-shell fluent-dialog-header {
    min-height: 44px;
    padding: 8px 14px;
    color: var(--erp-text);
    background: var(--erp-surface);
    border-bottom: 1px solid var(--erp-border);
}

.d365-shell fluent-dialog-body {
    color: var(--erp-text);
    background: var(--erp-surface);
}

.d365-shell fluent-dialog-footer {
    min-height: 48px;
    padding: 8px 14px;
    background: var(--erp-surface-subtle);
    border-top: 1px solid var(--erp-border);
}

.d365-shell .form-control,
.d365-shell .form-select {
    min-height: var(--erp-control-height);
    color: var(--erp-text);
    background-color: var(--erp-surface);
    border-color: var(--erp-border-strong);
    border-radius: var(--erp-radius-sm);
    font-size: 12px;
}

.d365-shell label,
.d365-shell .form-label {
    color: var(--erp-text-secondary);
    font-size: 11px;
    font-weight: 650;
}

.d365-shell button.primary,
.d365-shell .erp-button-primary {
    color: #ffffff;
    background: var(--erp-blue-700);
    border-color: var(--erp-blue-700);
}

.d365-shell button.primary:hover:not(:disabled),
.d365-shell .erp-button-primary:hover:not(:disabled) {
    background: var(--erp-blue-800);
    border-color: var(--erp-blue-800);
}

.d365-shell button.danger,
.d365-shell .erp-button-danger {
    color: var(--erp-danger);
    background: var(--erp-danger-soft);
    border-color: var(--erp-danger-border);
}

.d365-shell .form-control:focus,
.d365-shell .form-select:focus {
    border-color: var(--erp-focus);
    box-shadow: 0 0 0 2px rgba(0, 120, 212, .12);
}

/* Standalone Bootstrap-based forms inherit the same ERP hierarchy. */
.d365-article > h3 {
    margin: 8px 8px 0;
    padding: 10px 12px;
    color: var(--erp-text);
    background: var(--erp-surface);
    border: 1px solid var(--erp-border);
    border-left: 3px solid var(--erp-blue-700);
    border-radius: var(--erp-radius-md);
    font-size: 18px;
}

.d365-article > .card,
.d365-article > .alert {
    margin-inline: 8px;
}

.d365-shell .card {
    color: var(--erp-text);
    background: var(--erp-surface);
    border-color: var(--erp-border);
    border-radius: var(--erp-radius-md);
    box-shadow: var(--erp-shadow-sm);
}

.d365-shell .card-header {
    color: var(--erp-text);
    background: var(--erp-surface-subtle);
    border-color: var(--erp-border-soft);
    font-weight: 700;
}

/* ========================================================================
   Shared listing foundation
   ======================================================================== */

.erp-master-page {
    height: 100%;
    padding: var(--erp-space-1) var(--erp-space-2);
    background: var(--erp-page);
}

.d365-shell .erp-master-panel,
.d365-shell .erp-master-grid-card {
    background: var(--erp-surface);
    border-color: var(--erp-border);
    box-shadow: var(--erp-shadow-sm);
}

.d365-shell .erp-master-panel {
    border: 0;
    border-bottom: 1px solid var(--erp-border);
    box-shadow: none;
}

.d365-shell .erp-master-grid-card {
    border-radius: var(--erp-radius-lg);
}

.d365-shell .erp-master-title-row {
    min-height: 48px;
    padding-inline: 12px;
    background: var(--erp-surface);
    border-color: var(--erp-border-soft);
}

.d365-shell .erp-master-title-line h1 {
    color: var(--erp-text);
    font-size: 19px;
}

.erp-master-title-line span,
.erp-filter-count {
    color: var(--erp-info);
    background: var(--erp-info-soft);
    border-color: var(--erp-info-border);
}

.erp-master-breadcrumb,
.erp-filter-title-block p,
.erp-master-grid-footer,
.erp-master-loading,
.erp-master-empty-state {
    color: var(--erp-text-muted);
}

.d365-shell .erp-toolbar-wrap,
.d365-shell .erp-filter-header {
    background: var(--erp-surface);
    border-color: var(--erp-border-soft);
}

.d365-shell .erp-filter-panel,
.d365-shell .erp-filter-body,
.d365-shell .erp-master-grid-footer {
    background: var(--erp-surface);
    border-color: var(--erp-border-soft);
}

.d365-shell .erp-filter-header {
    min-height: 42px;
}

.d365-shell .erp-filter-body {
    padding-block: 9px;
}

.erp-master-filter-field,
.erp-master-filter-grid.advanced .erp-master-filter-field {
    color: var(--erp-text-secondary);
}

.erp-filter-select,
.erp-rows-select {
    min-height: var(--erp-control-height);
    color: var(--erp-text);
    background: var(--erp-surface);
    border-color: var(--erp-border-strong);
    border-radius: var(--erp-radius-sm);
}

.erp-filter-select:focus,
.erp-rows-select:focus {
    border-color: var(--erp-focus);
    box-shadow: 0 0 0 2px rgba(0, 120, 212, .12);
}

.erp-master-grid-scroll,
.erp-master-empty-state {
    background: var(--erp-surface);
}

.d365-shell .erp-master-grid-scroll fluent-data-grid-row[row-type="header"],
.d365-shell .erp-master-grid-scroll fluent-data-grid-cell[cell-type="columnheader"],
.d365-shell .erp-master-grid-scroll fluent-data-grid-row[row-type="header"] fluent-data-grid-cell {
    color: var(--erp-blue-800) !important;
    background: var(--erp-surface-muted) !important;
    border-color: var(--erp-border) !important;
    font-weight: 700;
}

.d365-shell .erp-master-grid fluent-data-grid-row:not([row-type="header"]):nth-of-type(even) {
    background: var(--erp-row-alt);
}

.d365-shell .erp-master-grid fluent-data-grid-row:not([row-type="header"]):hover {
    background: var(--erp-row-hover);
}

.d365-shell .erp-master-grid fluent-data-grid-row:not([row-type="header"]) {
    min-height: var(--erp-grid-row-height);
    color: var(--erp-text-secondary);
    border-color: var(--erp-border-soft);
}

.d365-shell .erp-row-actions fluent-button::part(control) {
    min-width: 25px;
    height: 25px;
    color: var(--erp-blue-700);
    background: var(--erp-surface);
    border: 1px solid var(--erp-blue-100);
    border-radius: var(--erp-radius-sm);
}

.d365-shell .erp-row-actions fluent-button:hover::part(control) {
    color: var(--erp-blue-800);
    background: var(--erp-blue-50);
    border-color: var(--erp-blue-500);
}

.d365-shell .erp-master-pager-box fluent-button::part(control) {
    min-width: 28px;
    height: 28px;
}

.erp-master-grid-scroll::-webkit-scrollbar-thumb,
.erp-internal-scroll::-webkit-scrollbar-thumb {
    background: var(--erp-border-strong);
    border-radius: var(--erp-radius-pill);
}

.erp-master-grid-scroll::-webkit-scrollbar-track,
.erp-internal-scroll::-webkit-scrollbar-track {
    background: var(--erp-surface-muted);
}

/* ========================================================================
   Shared forms, tabs and lookup controls
   ======================================================================== */

.lm-form,
.ledger-grid {
    color: var(--erp-text);
    font-family: var(--erp-font);
}

.lm-fieldset,
.lm-tab-panel,
.ledger-grid {
    background: var(--erp-surface);
    border-color: var(--erp-border);
    border-radius: var(--erp-radius-md);
}

.lm-fieldset legend {
    color: var(--erp-text-secondary);
    font-weight: 700;
}

.erp-tab-bar {
    padding: 5px;
    background: var(--erp-surface-subtle);
    border: 1px solid var(--erp-border);
    border-radius: var(--erp-radius-md);
}

.gmp-search,
.gmp-popup {
    border-color: var(--erp-border-strong);
}

.gmp-popup {
    background: var(--erp-surface);
    box-shadow: var(--erp-shadow-md);
}

.gmp-toolbar,
.gmp-grid th,
.gmp-footer {
    background: var(--erp-surface-subtle);
    border-color: var(--erp-border-soft);
}

.gmp-grid tr:hover {
    background: var(--erp-row-hover);
}

.gmp-ok {
    background: var(--erp-blue-700);
}

/* ========================================================================
   Active custom screen families
   ======================================================================== */

/* Item-ledger mapping */
.ilm-page-shell,
.ilm-manage-shell {
    background: var(--erp-page);
    color: var(--erp-text);
    font-family: var(--erp-font);
}

.ilm-command-bar,
.ilm-filter-panel,
.ilm-grid-card,
.ilm-summary-card,
.ilm-mode-card,
.ilm-primary-panel,
.ilm-assignment-panel {
    background: var(--erp-surface);
    border-color: var(--erp-border);
    box-shadow: var(--erp-shadow-sm);
}

.ilm-btn.primary,
.ilm-m-btn.primary {
    color: #ffffff;
    background: var(--erp-blue-700);
    border-color: var(--erp-blue-700);
}

.ilm-btn.primary:hover:not(:disabled),
.ilm-m-btn.primary:hover:not(:disabled) {
    background: var(--erp-blue-800);
    border-color: var(--erp-blue-800);
}

.ilm-mode-switch button.active {
    color: var(--erp-blue-800);
    background: var(--erp-info-soft);
    border-color: var(--erp-blue-700);
}

/* Production formula entry */
.rf-page,
.pf-page {
    min-height: 100%;
    color: var(--erp-text);
    background: var(--erp-page);
}

.rf-header,
.pf-header {
    padding: 10px 12px;
    background: linear-gradient(135deg, var(--erp-surface), var(--erp-blue-50));
    border: 1px solid var(--erp-border);
    border-left: 3px solid var(--erp-blue-700);
    border-radius: var(--erp-radius-md);
}

.rf-card,
.pf-card,
.rf-identity,
.pf-identity,
.rf-ordertype,
.pf-ordertype {
    background: var(--erp-surface);
    border-color: var(--erp-border);
    border-radius: var(--erp-radius-md);
}

/* Legacy Purchase Order and Quotation pages */
.poe-page,
.pod-page,
.pot-page,
.quotation-page,
.qrl-page,
.qvd-page,
.vru-page,
.ivl-page,
.qed-page {
    width: 100%;
    min-width: 0;
    min-height: 100%;
    box-sizing: border-box;
    padding: var(--erp-space-2);
    color: var(--erp-text);
    background: var(--erp-page);
    font-family: var(--erp-font);
    font-size: 12px;
}

.poe-title,
.pod-title,
.pot-title,
.quotation-title,
.qrl-title,
.qvd-title,
.vru-title,
.qed-title {
    min-height: 38px;
    display: flex;
    align-items: center;
    margin: 0 0 var(--erp-space-2);
    padding: 7px 10px;
    color: var(--erp-text);
    background: linear-gradient(135deg, var(--erp-surface), var(--erp-blue-50));
    border: 1px solid var(--erp-border);
    border-left: 3px solid var(--erp-blue-700);
    border-radius: var(--erp-radius-md);
    font-size: 16px;
    font-weight: 750;
}

.poe-filter,
.pod-filter,
.pot-form,
.quotation-filter,
.qrl-filter,
.qvd-toolbar,
.vru-toolbar,
.ivl-bar,
.qed-summary,
.qed-form {
    background: var(--erp-surface);
    border-color: var(--erp-border);
}

.poe-go,
.poe-save,
.pot-ok,
.pot-close,
.pod-go,
.quotation-page .go-button,
.quotation-page .save-button,
.qrl-button,
.qvd-button,
.vru-button,
.ivl-close,
.qed-button:not(.qed-secondary) {
    min-height: var(--erp-control-height);
    padding: 5px 12px;
    color: #ffffff;
    background: var(--erp-blue-700);
    border: 1px solid var(--erp-blue-700);
    border-radius: var(--erp-radius-sm);
    font-weight: 650;
}

.poe-go:hover:not(:disabled),
.poe-save:hover:not(:disabled),
.pot-ok:hover:not(:disabled),
.pot-close:hover:not(:disabled),
.pod-go:hover:not(:disabled),
.quotation-page .go-button:hover:not(:disabled),
.quotation-page .save-button:hover:not(:disabled),
.qrl-button:hover:not(:disabled),
.qvd-button:hover:not(:disabled),
.vru-button:hover:not(:disabled),
.ivl-close:hover:not(:disabled),
.qed-button:hover:not(:disabled) {
    background: var(--erp-blue-800);
    border-color: var(--erp-blue-800);
}

.qvd-secondary,
.vru-secondary,
.qed-secondary {
    color: var(--erp-text-secondary);
    background: var(--erp-surface);
    border-color: var(--erp-border-strong);
}

.poe-page input,
.poe-page select,
.pod-page input,
.pod-page select,
.pot-page input,
.pot-page select,
.quotation-page input,
.quotation-page select,
.qrl-page input,
.qrl-page select,
.qed-page input,
.qed-page select,
.qed-page textarea,
.vru-page input,
.ivl-page input,
.ivl-page select {
    min-height: 30px;
    color: var(--erp-text);
    background: var(--erp-surface);
    border: 1px solid var(--erp-border-strong);
    border-radius: var(--erp-radius-sm);
    outline: none;
}

.poe-page input:focus,
.poe-page select:focus,
.pod-page input:focus,
.pod-page select:focus,
.pot-page input:focus,
.pot-page select:focus,
.quotation-page input:focus,
.quotation-page select:focus,
.qrl-page input:focus,
.qrl-page select:focus,
.qed-page input:focus,
.qed-page select:focus,
.qed-page textarea:focus,
.vru-page input:focus,
.ivl-page input:focus,
.ivl-page select:focus {
    border-color: var(--erp-focus);
    box-shadow: 0 0 0 2px rgba(0, 120, 212, .12);
}

.poe-grid-wrap,
.pod-grid-wrap,
.quotation-grid-wrap,
.qrl-grid-wrap,
.qvd-grid-wrap,
.vru-grid-wrap,
.ivl-grid-wrap {
    max-width: 100%;
    overflow: auto;
    background: var(--erp-surface);
    border-color: var(--erp-border);
    border-radius: var(--erp-radius-sm);
}

.poe-grid,
.pod-grid,
.quotation-grid,
.qrl-grid,
.qvd-grid,
.vru-grid,
.ivl-grid {
    color: var(--erp-text);
    background: var(--erp-surface);
}

.poe-grid th,
.pod-grid th,
.quotation-grid th,
.qrl-grid th,
.qvd-grid th,
.vru-grid th,
.ivl-grid th {
    position: sticky;
    top: 0;
    z-index: 2;
    color: var(--erp-text);
    background: var(--erp-surface-muted);
    border-color: var(--erp-border);
    font-weight: 700;
}

.poe-grid td,
.pod-grid td,
.quotation-grid td,
.qrl-grid td,
.qvd-grid td,
.vru-grid td,
.ivl-grid td {
    border-color: var(--erp-border-soft);
}

.poe-grid tbody tr:nth-child(even),
.pod-grid tbody tr:nth-child(even),
.quotation-grid tbody tr:nth-child(even),
.qrl-grid tbody tr:nth-child(even),
.qvd-grid tbody tr:nth-child(even),
.vru-grid tbody tr:nth-child(even),
.ivl-grid tbody tr:nth-child(even) {
    background: var(--erp-row-alt);
}

.poe-grid tbody tr:hover,
.pod-grid tbody tr:hover,
.quotation-grid tbody tr:hover,
.qrl-grid tbody tr:hover,
.qvd-grid tbody tr:hover,
.vru-grid tbody tr:hover,
.ivl-grid tbody tr:hover {
    background: var(--erp-row-hover);
}

.poe-message.success,
.pod-message.success,
.pot-message.success,
.quotation-message.success,
.qrl-message.success,
.qvd-message.success,
.vru-message.success,
.ivl-message.success,
.qed-message.success {
    color: var(--erp-success);
    background: var(--erp-success-soft);
    border: 1px solid var(--erp-success-border);
}

.poe-message.error,
.pod-message.error,
.pot-message.error,
.quotation-message.error,
.qrl-message.error,
.qvd-message.error,
.vru-message.error,
.ivl-message.error,
.qed-message.error {
    color: var(--erp-danger);
    background: var(--erp-danger-soft);
    border: 1px solid var(--erp-danger-border);
}

.poe-link,
.poe-addlink,
.pod-link,
.pod-addlink,
.qrl-link,
.qvd-link,
.qvd-itemlink,
.qvd-vendorlink,
.ivl-vendorlink,
.vru-hotlink {
    color: var(--erp-blue-700);
}

/* ========================================================================
   Responsive ERP density
   ======================================================================== */

@media (max-width: 1100px) {
    .erp-form-grid {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }

    .pot-grid {
        grid-template-columns: repeat(2, minmax(240px, 1fr));
    }

    .poe-grid-wrap,
    .pod-grid-wrap,
    .quotation-grid-wrap,
    .qrl-grid-wrap,
    .qvd-grid-wrap,
    .vru-grid-wrap,
    .ivl-grid-wrap {
        width: 100%;
    }
}

@media (max-width: 720px) {
    .d365-article {
        height: auto;
        min-height: 100%;
    }

    .erp-page-header {
        flex-direction: column;
    }

    .erp-form-grid,
    .pot-grid {
        grid-template-columns: 1fr;
    }

    .poe-page,
    .pod-page,
    .pot-page,
    .quotation-page,
    .qrl-page,
    .qvd-page,
    .vru-page,
    .ivl-page,
    .qed-page {
        min-height: auto;
        overflow: visible;
    }

    .pot-field {
        align-items: stretch;
        flex-direction: column;
    }

    .pot-field > label {
        min-width: 0;
    }
}

@media print {
    .d365-topbar,
    .d365-sidebar,
    .d365-footer,
    .erp-toolbar-wrap {
        display: none !important;
    }

    html,
    body,
    #app,
    .d365-shell,
    .d365-workarea,
    .d365-main,
    .d365-body,
    .d365-article {
        height: auto !important;
        overflow: visible !important;
        background: #ffffff !important;
    }
}


/* Ledger Group -> hierarchy links (list row + hierarchy breadcrumb) */
.erp-group-link,
.erp-tree-pathlink {
    color: var(--erp-blue-700, #086ad8);
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

.erp-group-link:hover,
.erp-tree-pathlink:hover {
    text-decoration: underline;
}

.erp-tree-path {
    padding: 4px 10px;
    font-size: 12px;
    color: var(--erp-text-secondary, #28496f);
    border-bottom: 1px solid var(--erp-border-soft, #e5eaf3);
}

.erp-tree-pathsep {
    margin: 0 4px;
    color: var(--erp-border, #dce6f2);
}