﻿/* Alias compartidos: valores fuente en Theming/SuitePalette.cs, emitidos
   por el documento y AmedidaMainPageTemplate. Acceso y shell comparten identidad. */
:root,
.amedida-layout {
    --suite-shell-bg: var(--suite-color-background);
    --suite-shell-surface: var(--suite-color-surface);
    --suite-shell-text: var(--suite-color-text);
    --suite-shell-muted: var(--suite-color-muted);
    --suite-shell-border: var(--suite-color-border);
    --suite-shell-hover: var(--suite-color-neutral-hover);
    --suite-shell-accent: var(--suite-color-primary);
    --suite-shell-interaction: var(--suite-color-interaction);
    --suite-shell-link: var(--suite-color-link);
    --suite-shell-link-hover: var(--suite-color-link-hover);
    /* An open Blazor circuit can still emit the previous SuitePalette while
       receiving this stylesheet. Keep native editor borders valid until that
       circuit receives the new tokens; never use the decorative card border. */
    --suite-shell-control-border: var(--suite-color-control-border, var(--suite-color-muted));
    --suite-shell-accent-soft: var(--suite-color-primary-soft);
    --suite-shell-focus: var(--suite-color-focus);
    --suite-shell-primary: var(--suite-color-primary);
    --suite-shell-primary-hover: var(--suite-color-primary-hover);
    --suite-shell-primary-active: var(--suite-color-primary-active);
    --suite-shell-primary-border: var(--suite-color-interaction);
    --suite-shell-primary-text: var(--suite-color-on-primary);
    --suite-shell-primary-hover-text: var(--suite-color-on-primary-hover);
    --suite-shell-primary-active-text: var(--suite-color-on-primary-active);
    --suite-control-font-size: 14px;
    --suite-action-font-size: 13px;
    /* Authentication has reading-sized text, independent of business-grid density. */
    --suite-auth-font-size: max(16px, 1rem);
    --suite-auth-small-font-size: max(14px, .875rem);
    --suite-auth-title-font-size: max(24px, 1.5rem);
    --suite-control-height: 28px;
    --suite-control-padding-y: 2px;
    --suite-data-grid-row-height: 35px;
    --suite-data-grid-header-height: 45px;
    --suite-detail-tab-height: 36px;
    --suite-detail-tab-padding-x: 12px;
    --suite-detail-tab-padding-y: 6px;
    --suite-detail-tab-line-height: 20px;
    --suite-action-height: 32px;
    --suite-control-radius: 6px;
    --suite-form-gap-x: 24px;
    --suite-form-gap-y: 12px;
    --suite-page-size-selector-width: 8em;
    --suite-pager-control-size: 32px;
    --suite-screen-info-bg: color-mix(in srgb, var(--suite-shell-accent) 10%, var(--suite-shell-accent-soft));
    --suite-button-disabled-bg: var(--suite-shell-hover);
    --suite-button-disabled-text: var(--suite-shell-muted);
    --suite-button-disabled-border: var(--suite-shell-border);

    /* Compatibilidad con las acciones y estilos compartidos existentes. */
    --suite-btn-brand: var(--suite-shell-primary);
    --suite-btn-brand-hover: var(--suite-shell-primary-hover);
    --suite-btn-brand-rgb: var(--suite-color-primary-rgb);
    --suite-btn-text: var(--suite-shell-primary-text);
    --suite-rust: var(--suite-shell-focus);
    --suite-rust-hover: var(--suite-shell-link-hover);
    --suite-rust-rgb: var(--suite-color-primary-rgb);
    --suite-grid-link-hover-solid: var(--suite-shell-accent-soft);
    --suite-grid-link-text: var(--suite-shell-text);
    --suite-grid-link-hover-shadow: transparent;
    --suite-grid-row-hover-rgb: var(--suite-color-primary-rgb);
}

/* La identidad corporativa conserva superficies claras incluso con una
   preferencia nativa guardada. No se borra ni cambia esa preferencia. */
:root {
    --suite-grid-link-hover-solid-dark: var(--suite-shell-accent-soft);
    --suite-grid-link-text-dark: var(--suite-shell-text);
    --suite-grid-link-hover-shadow-dark: transparent;
}

/* Escala de marca de Fluent 25.2.5 en el documento, también para los popups
   y desplegables que DevExpress monta fuera del shell. Solo primary: se
   conservan las escalas danger, warning, success, info y neutral del proveedor. */
:root {
    --dxbl-accent-color-10: color-mix(in srgb, var(--suite-color-primary) 8%, white);
    --dxbl-accent-color-20: color-mix(in srgb, var(--suite-color-primary) 15%, white);
    --dxbl-accent-color-30: color-mix(in srgb, var(--suite-color-primary) 25%, white);
    --dxbl-accent-color-40: color-mix(in srgb, var(--suite-color-primary) 38%, white);
    --dxbl-accent-color-50: color-mix(in srgb, var(--suite-color-primary) 50%, white);
    --dxbl-accent-color-60: color-mix(in srgb, var(--suite-color-primary) 64%, white);
    --dxbl-accent-color-70: color-mix(in srgb, var(--suite-color-primary) 76%, white);
    --dxbl-accent-color-80: color-mix(in srgb, var(--suite-color-primary) 88%, white);
    --dxbl-accent-color-90: var(--suite-color-primary);
    --dxbl-accent-color-100: var(--suite-color-primary-hover);
    --dxbl-accent-color-110: var(--suite-color-primary-active);
    --dxbl-accent-color-120: var(--suite-color-dark);
    --dxbl-accent-color-130: var(--suite-color-text);
    --dxbl-accent-color-140: var(--suite-color-text);
    --dxbl-accent-color-150: var(--suite-color-text);
    --dxbl-accent-color-160: var(--suite-color-text);
    --dxbl-accent-color-170: var(--suite-color-text);
    --dxds-primary-10: var(--dxbl-accent-color-10);
    --dxds-primary-20: var(--dxbl-accent-color-20);
    --dxds-primary-30: var(--dxbl-accent-color-30);
    --dxds-primary-40: var(--dxbl-accent-color-40);
    --dxds-primary-50: var(--dxbl-accent-color-50);
    --dxds-primary-60: var(--dxbl-accent-color-60);
    --dxds-primary-70: var(--dxbl-accent-color-70);
    --dxds-primary-80: var(--dxbl-accent-color-80);
    --dxds-primary-90: var(--dxbl-accent-color-90);
    --dxds-primary-100: var(--dxbl-accent-color-100);
    --dxds-primary-110: var(--dxbl-accent-color-110);
    --dxds-primary-120: var(--dxbl-accent-color-120);
    --dxds-primary-130: var(--dxbl-accent-color-130);
    --dxds-primary-140: var(--dxbl-accent-color-140);
    --dxds-primary-150: var(--dxbl-accent-color-150);
    --dxds-primary-160: var(--dxbl-accent-color-160);
    --dxds-primary-170: var(--dxbl-accent-color-170);
}

/* Colores de interacción del documento. :root y body cubren las dos generaciones
   de tokens presentes en el tema instalado, sin depender del padre de un popup. */
:root,
body,
.amedida-layout,
.suite-auth-page {
    --bs-body-color: var(--suite-shell-text);
    --bs-body-bg: var(--suite-shell-bg);
    --bs-heading-color: var(--suite-shell-text);
    --bs-secondary-color: var(--suite-shell-muted);
    --bs-primary: var(--suite-shell-primary);
    --bs-primary-rgb: var(--suite-color-primary-rgb);
    --bs-link-color: var(--suite-shell-link);
    --bs-link-color-rgb: var(--suite-color-action-primary-rgb);
    --bs-link-hover-color: var(--suite-shell-link-hover);
    --bs-link-hover-color-rgb: var(--suite-color-dark-rgb);
    --dxds-color-content-neutral-default-rest: var(--suite-shell-text);
    --dxds-color-content-neutral-default-hovered: var(--suite-shell-text);
    --dxds-color-content-neutral-default-active: var(--suite-shell-text);
    --dxds-color-content-neutral-default-selected: var(--suite-shell-text);
    --dxds-color-content-neutral-default-selected-hovered: var(--suite-shell-text);
    --dxds-color-content-neutral-default-disabled: var(--suite-shell-muted);
    --dxds-color-content-neutral-subdued-rest: var(--suite-shell-muted);
    --dxds-color-content-neutral-subdued-hovered: var(--suite-shell-text);
    --dxds-color-content-neutral-subdued-active: var(--suite-shell-text);
    --dxds-color-content-neutral-deep-rest: var(--suite-shell-muted);
    --dxds-color-surface-neutral-default-rest: var(--suite-shell-surface);
    --dxds-color-surface-neutral-default-hovered: var(--suite-shell-hover);
    --dxds-color-surface-neutral-default-active: var(--suite-shell-accent-soft);
    --dxds-color-surface-neutral-default-selected: var(--suite-shell-accent-soft);
    --dxds-color-surface-neutral-default-selected-hovered: var(--suite-shell-accent-soft);
    --dxds-color-surface-neutral-default-disabled: var(--suite-button-disabled-bg);
    --dxds-color-surface-neutral-subdued-rest: var(--suite-shell-bg);
    --dxds-color-surface-neutral-subdued-hovered: var(--suite-shell-hover);
    --dxds-color-border-neutral-default-rest: var(--suite-shell-border);
    --dxds-color-content-primary-default-rest: var(--suite-shell-focus);
    --dxds-color-content-primary-default-hovered: var(--suite-shell-focus);
    --dxds-color-content-primary-default-active: var(--suite-shell-focus);
    --dxds-color-content-primary-compound-rest: var(--suite-shell-focus);
    --dxds-color-content-primary-compound-hovered: var(--suite-shell-focus);
    --dxds-color-border-primary-default-rest: var(--suite-shell-primary-border);
    --dxds-color-border-primary-compound-rest: var(--suite-shell-primary-border);
    --dxds-color-surface-primary-default-rest: var(--suite-shell-primary);
    --dxds-color-surface-primary-default-hovered: var(--suite-shell-primary-hover);
    --dxds-color-surface-primary-default-active: var(--suite-shell-primary-active);
    --dxds-color-surface-primary-default-selected: var(--suite-shell-accent-soft);
    --dxds-color-surface-primary-subdued-rest: var(--suite-shell-accent-soft);
    --dxds-color-surface-primary-compound-rest: var(--suite-shell-primary);
    --dxds-color-surface-primary-compound-hovered: var(--suite-shell-primary-hover);
    --dxds-color-surface-primary-compound-active: var(--suite-shell-primary-active);
    --DS-color-content-primary-default-rest: var(--suite-shell-focus);
    --DS-color-content-primary-default-hovered: var(--suite-shell-focus);
    --DS-color-content-primary-default-pressed: var(--suite-shell-focus);
    --DS-color-surface-primary-default-rest: var(--suite-shell-primary);
    --DS-color-surface-primary-default-hovered: var(--suite-shell-primary-hover);
    --DS-color-surface-primary-default-pressed: var(--suite-shell-primary-active);
}

/* Shared native primary actions, including popup portals. Each state has
   its own readable foreground; disabled actions retain neutral colors. */
.suite-ui .dxbl-btn-primary:not(:disabled):not(.disabled):not(.dxbl-disabled):not([aria-disabled="true"]),
.amedida-layout .amedida-view-surface :is(.dxbl-btn-primary, .btn-amedida):not(:disabled):not(.disabled):not(.dxbl-disabled):not([aria-disabled="true"]),
.amedida-layout .amedida-view-surface [data-action-name="New"] .dxbl-btn:not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]),
.amedida-layout .suite-actionbar__primary .dxbl-btn:not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]) {
    background-color: var(--suite-shell-primary) !important;
    border-color: var(--suite-shell-primary-border) !important;
    color: var(--suite-shell-primary-text) !important;
    font-weight: 600;
}
.suite-ui .dxbl-btn-primary:not(:disabled):not(.disabled):not(.dxbl-disabled):not([aria-disabled="true"]):hover,
.amedida-layout .amedida-view-surface :is(.dxbl-btn-primary, .btn-amedida):not(:disabled):not(.disabled):not(.dxbl-disabled):not([aria-disabled="true"]):hover,
.amedida-layout .amedida-view-surface [data-action-name="New"] .dxbl-btn:not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]):hover,
.amedida-layout .suite-actionbar__primary .dxbl-btn:not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]):hover {
    background-color: var(--suite-shell-primary-hover) !important;
    border-color: var(--suite-shell-primary-hover) !important;
    color: var(--suite-shell-primary-hover-text) !important;
}
.suite-ui .dxbl-btn-primary:not(:disabled):not(.disabled):not(.dxbl-disabled):not([aria-disabled="true"]):active,
.amedida-layout .amedida-view-surface :is(.dxbl-btn-primary, .btn-amedida):not(:disabled):not(.disabled):not(.dxbl-disabled):not([aria-disabled="true"]):active,
.amedida-layout .amedida-view-surface [data-action-name="New"] .dxbl-btn:not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]):active,
.amedida-layout .suite-actionbar__primary .dxbl-btn:not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]):active {
    background-color: var(--suite-shell-primary-active) !important;
    border-color: var(--suite-shell-primary-active) !important;
    color: var(--suite-shell-primary-active-text) !important;
}
/* Disabled primary actions remain disabled, with a readable neutral treatment.
   XAF still owns Enabled/Active and all event handlers. */
.amedida-layout .amedida-view-surface :is(.dxbl-btn-primary, .btn-amedida):is(:disabled, .disabled, .dxbl-disabled, [aria-disabled="true"]),
.amedida-layout .amedida-view-surface [data-action-name="New"] .dxbl-btn:is(:disabled, .disabled, .dxbl-disabled, [aria-disabled="true"]),
.amedida-layout .suite-actionbar__primary .dxbl-btn:is(:disabled, .disabled, .dxbl-disabled, [aria-disabled="true"]) {
    --dxbl-btn-disabled-bg: var(--suite-button-disabled-bg);
    --dxbl-btn-disabled-color: var(--suite-button-disabled-text);
    --dxbl-btn-disabled-border-color: var(--suite-button-disabled-border);
    --dxbl-btn-disabled-opacity: 1;
    background: var(--suite-button-disabled-bg) !important;
    color: var(--suite-button-disabled-text) !important;
    border-color: var(--suite-button-disabled-border) !important;
    opacity: 1 !important;
    box-shadow: none;
    cursor: not-allowed;
}
.amedida-layout .amedida-view-surface :is(.dxbl-btn-primary, .btn-amedida):is(:disabled, .disabled, .dxbl-disabled, [aria-disabled="true"]) :is(.dxbl-image, .xaf-image),
.amedida-layout .amedida-view-surface [data-action-name="New"] .dxbl-btn:is(:disabled, .disabled, .dxbl-disabled, [aria-disabled="true"]) :is(.dxbl-image, .xaf-image),
.amedida-layout .suite-actionbar__primary .dxbl-btn:is(:disabled, .disabled, .dxbl-disabled, [aria-disabled="true"]) :is(.dxbl-image, .xaf-image) {
    color: var(--suite-button-disabled-text) !important;
}

/* Native controls keep validation/state palettes. A decorative card border is
   intentionally softer than the boundary needed to identify an input. */
.suite-ui .dxbl-text-edit:not(.dxbl-invalid):not([aria-invalid="true"]) {
    --dxbl-text-edit-border-color: var(--suite-shell-control-border);
}
.suite-ui :is(.btn-primary, .btn-amedida) {
    --bs-btn-bg: var(--suite-shell-primary);
    --bs-btn-border-color: var(--suite-shell-primary-border);
    --bs-btn-color: var(--suite-shell-primary-text);
    --bs-btn-hover-bg: var(--suite-shell-primary-hover);
    --bs-btn-hover-border-color: var(--suite-shell-primary-hover);
    --bs-btn-hover-color: var(--suite-shell-primary-hover-text);
    --bs-btn-active-bg: var(--suite-shell-primary-active);
    --bs-btn-active-color: var(--suite-shell-primary-active-text);
    --bs-btn-active-border-color: var(--suite-shell-primary-active);
    --bs-btn-disabled-bg: var(--suite-button-disabled-bg);
    --bs-btn-disabled-color: var(--suite-button-disabled-text);
    --bs-btn-disabled-border-color: var(--suite-button-disabled-border);
    --bs-btn-disabled-opacity: 1;
}
/* currentColor solo en iconos que lo admiten. Sin filtros sobre imágenes. */
.suite-ui .dxbl-btn-primary:not(:disabled):not(.disabled):not(.dxbl-disabled):not([aria-disabled="true"]) :is(.dxbl-image, .xaf-image),
.amedida-layout .amedida-view-surface :is(.dxbl-btn-primary, .btn-amedida):not(:disabled):not(.disabled):not(.dxbl-disabled):not([aria-disabled="true"]) :is(.dxbl-image, .xaf-image),
.amedida-layout .amedida-view-surface [data-action-name="New"] .dxbl-btn:not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]) :is(.dxbl-image, .xaf-image),
.amedida-layout .suite-actionbar__primary .dxbl-btn:not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]) :is(.dxbl-image, .xaf-image) {
    color: inherit !important;
}
.amedida-layout .amedida-view-surface :is(button, a, [role="tab"]):focus-visible {
    outline: 2px solid var(--suite-shell-focus) !important;
    outline-offset: 2px;
}
.amedida-layout .amedida-view-surface .dxbl-pager {
    --dxbl-pager-active-page-btn-color: var(--suite-shell-primary-text);
    --dxbl-pager-font-size: 13px;
    /* Unitless: DevExpress also multiplies this value to size page buttons. */
    --dxbl-pager-line-height: 1.4;
    --dxbl-pager-btn-padding-x: 6px;
    --dxbl-pager-btn-padding-y: 4px;
    margin: 0;
    border: 0;
    background: transparent;
}
/* Same native page/previous/next controls in every XAF grid, including details.
   Minimum width allows multi-digit page numbers without clipping. */
.amedida-layout .amedida-view-surface .dxbl-pager > .dxbl-btn {
    box-sizing: border-box;
    min-width: var(--suite-pager-control-size);
    min-height: var(--suite-pager-control-size);
    height: var(--suite-pager-control-size);
    padding: var(--dxbl-pager-btn-padding-y) var(--dxbl-pager-btn-padding-x);
    font-size: var(--dxbl-pager-font-size);
    line-height: var(--dxbl-pager-line-height);
    border-radius: 6px;
}
@media (hover: none) and (pointer: coarse) {
    .amedida-layout { --suite-pager-control-size: 44px; }
}
.amedida-layout .amedida-view-surface .dxbl-pager :is([aria-current="page"], [aria-current="true"], .dxbl-pager-active-page-btn, .dxbl-pager-page.dxbl-active, .dxbl-pager-page-number.dxbl-active, .dxbl-pager-page.active) {
    background-color: var(--suite-shell-primary) !important;
    border-color: var(--suite-shell-primary) !important;
    color: var(--suite-shell-primary-text) !important;
    font-weight: 600;
}
.amedida-layout .amedida-view-surface .dxbl-pager :is([aria-current="page"], [aria-current="true"], .dxbl-pager-active-page-btn):not(:disabled):not(.dxbl-disabled):not([aria-disabled="true"]):hover {
    background-color: var(--suite-shell-primary-hover) !important;
    border-color: var(--suite-shell-primary-hover) !important;
    color: var(--suite-shell-primary-hover-text) !important;
}
/* El selector nativo mide 5em; se reserva espacio para valor, padding y flecha.
   Solo tamaño de página, sin alterar el editor del índice ni otros comboboxes. */
.amedida-layout .amedida-view-surface .dxbl-pager-container > .dxbl-pager-page-size-selector {
    flex: 0 0 auto;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 8px;
    min-width: 0;
}
.amedida-layout .amedida-view-surface .dxbl-pager-page-size-selector > .dxbl-text-edit {
    flex: 0 0 auto;
    width: var(--suite-page-size-selector-width);
    min-width: var(--suite-page-size-selector-width);
    font-variant-numeric: tabular-nums;
}
.amedida-layout .amedida-view-surface .dxbl-pager-page-size-selector > .dxbl-text-edit > input {
    text-align: start;
    text-overflow: clip;
}
