/* Syncfusion (tema Tailwind 3) recolorido com os tokens GNR de gnr.css.
   Os valores são var() dos tokens da app, por isso seguem html[data-theme] sem CSS escuro próprio. */

:root,
.e-dark-mode {
    --e-font-name: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    --color-sf-content-bg-color: var(--color-surface);
    --color-sf-content-bg-color-alt1: var(--color-surface-variant);
    --color-sf-content-bg-color-alt2: var(--color-surface-hover);
    --color-sf-content-bg-color-alt3: var(--color-border);
    --color-sf-content-bg-color-alt4: var(--color-text-muted);
    --color-sf-content-bg-color-alt5: var(--color-text-secondary);
    --color-sf-content-bg-color-hover: var(--color-surface-hover);
    --color-sf-content-bg-color-pressed: var(--color-surface-hover);
    --color-sf-content-bg-color-focus: var(--color-surface-hover);
    --color-sf-content-bg-color-selected: var(--color-primary-alpha);
    --color-sf-content-bg-color-dragged: var(--color-surface-hover);
    --color-sf-content-bg-color-disabled: var(--color-surface);
    --color-sf-flyout-bg-color: var(--color-surface-light);
    --color-sf-flyout-bg-color-hover: var(--color-surface-hover);
    --color-sf-flyout-bg-color-pressed: var(--color-surface-hover);
    --color-sf-flyout-bg-color-focus: var(--color-surface-hover);
    --color-sf-flyout-bg-color-selected: var(--color-primary-alpha);
    --color-sf-flyout-bg-color-disabled: var(--color-surface-light);
    --color-sf-overlay-bg-color: var(--color-overlay);
    --color-sf-table-bg-color-hover: var(--color-surface-hover);
    --color-sf-table-bg-color-pressed: var(--color-surface-hover);
    --color-sf-table-bg-color-selected: var(--color-primary-alpha);
    --color-sf-text-input-bg-color: var(--color-surface);
    --color-sf-treeview-item-active-hover-bg: var(--color-surface-hover);

    --color-sf-content-text-color: var(--color-text);
    --color-sf-content-text-color-alt1: var(--color-text-secondary);
    --color-sf-content-text-color-alt2: var(--color-text-secondary);
    --color-sf-content-text-color-alt3: var(--color-text-muted);
    --color-sf-content-text-color-alt4: var(--color-text-muted);
    --color-sf-content-text-color-hover: var(--color-text);
    --color-sf-content-text-color-pressed: var(--color-text);
    --color-sf-content-text-color-focus: var(--color-text);
    --color-sf-content-text-color-selected: var(--color-text);
    --color-sf-content-text-color-dragged: var(--color-text);
    --color-sf-content-text-color-disabled: var(--color-text-muted);
    --color-sf-placeholder-text-color: var(--color-text-muted);
    --color-sf-flyout-text-color: var(--color-text);
    --color-sf-flyout-text-color-hover: var(--color-text);
    --color-sf-flyout-text-color-pressed: var(--color-text);
    --color-sf-flyout-text-color-focus: var(--color-text);
    --color-sf-flyout-text-color-selected: var(--color-text);
    --color-sf-flyout-text-color-disabled: var(--color-text-muted);
    --color-sf-table-text-color-hover: var(--color-text);
    --color-sf-table-text-color-pressed: var(--color-text);
    --color-sf-table-text-color-selected: var(--color-text);
    --color-sf-icon-color: var(--color-text-muted);
    --color-sf-icon-color-hover: var(--color-text);
    --color-sf-icon-color-pressed: var(--color-text);
    --color-sf-icon-color-disabled: var(--color-border);
    --color-sf-close-icon-color: var(--color-text-muted);
    --color-sf-close-icon-color-hover: var(--color-text);
    --color-sf-close-icon-color-pressed: var(--color-text);

    --color-sf-border-light: var(--color-border-light);
    --color-sf-border: var(--color-border);
    --color-sf-border-dark: var(--color-border);
    --color-sf-border-hover: var(--color-primary-subtle);
    --color-sf-border-pressed: var(--color-primary);
    --color-sf-border-focus: var(--color-primary);
    --color-sf-border-selected: var(--color-primary);
    --color-sf-border-dragged: var(--color-border);
    --color-sf-border-disabled: var(--color-border-light);
    --color-sf-border-warning: var(--color-warning);
    --color-sf-border-error: var(--color-error);
    --color-sf-border-success: var(--color-success);
    --color-sf-flyout-border: var(--color-border);
    --color-sf-dialog-border: var(--color-border);

    --color-sf-primary: var(--color-primary);
    --color-sf-primary-text-color: #fff;
    --color-sf-primary-light: var(--color-primary-bright);
    --color-sf-primary-lighter: var(--color-primary-alpha);
    --color-sf-primary-dark: var(--color-primary-dark);
    --color-sf-primary-darker: var(--color-primary-dark);
    --color-sf-secondary: var(--color-surface);
    --color-sf-success: var(--color-success);
    --color-sf-info: var(--color-info);
    --color-sf-warning: var(--color-warning);
    --color-sf-danger: var(--color-error);

    --color-sf-primary-bg-color: var(--color-primary);
    --color-sf-primary-border-color: var(--color-primary);
    --color-sf-primary-text: #fff;
    --color-sf-primary-bg-color-hover: var(--color-primary-bright);
    --color-sf-primary-border-color-hover: var(--color-primary-bright);
    --color-sf-primary-bg-color-pressed: var(--color-primary-dark);
    --color-sf-primary-border-color-pressed: var(--color-primary-dark);
    --color-sf-primary-bg-color-focus: var(--color-primary-bright);
    --color-sf-primary-border-color-focus: var(--color-primary-bright);
    --color-sf-primary-bg-color-disabled: var(--color-primary-alpha);
    --color-sf-primary-border-color-disabled: var(--color-primary-alpha);
    --color-sf-primary-outline: var(--color-primary);

    --color-sf-secondary-bg-color: var(--color-surface);
    --color-sf-secondary-border-color: var(--color-border);
    --color-sf-secondary-text-color: var(--color-text);
    --color-sf-secondary-bg-color-hover: var(--color-surface-hover);
    --color-sf-secondary-border-color-hover: var(--color-border);
    --color-sf-secondary-text-color-hover: var(--color-text);
    --color-sf-secondary-bg-color-pressed: var(--color-surface-hover);
    --color-sf-secondary-border-color-pressed: var(--color-primary);
    --color-sf-secondary-text-color-pressed: var(--color-text);
    --color-sf-secondary-bg-color-focus: var(--color-surface-hover);
    --color-sf-secondary-border-color-focus: var(--color-primary);
    --color-sf-secondary-text-color-focus: var(--color-text);
    --color-sf-secondary-bg-color-disabled: var(--color-surface);
    --color-sf-secondary-border-color-disabled: var(--color-border-light);
    --color-sf-secondary-text-color-disabled: var(--color-text-muted);
    --color-sf-secondary-outline: var(--color-border);

    --color-sf-chip-primary-bg-color: var(--color-primary-alpha);
    --color-sf-chip-primary-border-color: transparent;
    --color-sf-chip-primary-text: var(--color-primary-subtle);
}

/* ===== Grelha ===== */
.gnr-grid { width: 100%; }
.gnr-grid .e-grid {
    font-family: var(--font-sans);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}
.gnr-grid .e-grid .e-gridheader,
.gnr-grid .e-grid .e-headercontent,
.gnr-grid .e-grid .e-headercell,
.gnr-grid .e-grid .e-detailheadercell {
    background: var(--color-surface-variant);
    border-color: var(--color-border);
}
.gnr-grid .e-grid .e-gridheader { border-bottom: 1px solid var(--color-border); }
.gnr-grid .e-grid .e-headercell { height: 40px; padding: 0 0.75rem; }
.gnr-grid .e-grid .e-headercell .e-headertext,
.gnr-grid .e-grid .e-headercelldiv {
    color: var(--color-text-muted);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.gnr-grid .e-grid .e-headercell:hover { background: var(--color-surface-hover); }
.gnr-grid .e-grid .e-sortnumber {
    background: var(--color-primary);
    color: #fff;
    border: 0;
}
.gnr-grid .e-grid .e-icon-ascending,
.gnr-grid .e-grid .e-icon-descending { color: var(--color-primary-subtle); }
.gnr-grid .e-grid .e-columnheader .e-rhandler:hover,
.gnr-grid .e-grid .e-rhelper { border-color: var(--color-primary); }

.gnr-grid .e-grid .e-content,
.gnr-grid .e-grid .e-table,
.gnr-grid .e-grid .e-row { background: var(--color-surface); }
.gnr-grid .e-grid .e-rowcell {
    color: var(--color-text-secondary);
    font-size: 0.813rem;
    padding: 0 0.75rem;
    border-color: var(--color-border-light);
}
.gnr-grid .e-grid .e-row:last-child .e-rowcell { border-bottom-color: transparent; }
.gnr-grid .e-grid.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-editedrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
    background: var(--color-surface-hover);
    color: var(--color-text);
}
.gnr-grid-clickable .e-grid .e-row { cursor: pointer; }
.gnr-grid .e-grid .e-emptyrow td { border: 0; }

.gnr-grid .e-grid .e-gridpager,
.gnr-grid .e-pager {
    background: var(--color-surface);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: 0.8rem;
    padding: 0.4rem 0.6rem;
}
.gnr-grid .e-pager .e-numericitem,
.gnr-grid .e-pager .e-pagercontainer .e-icons {
    background: transparent;
    border-radius: 6px;
    color: var(--color-text-secondary);
    min-width: 30px;
}
.gnr-grid .e-pager .e-numericitem:hover,
.gnr-grid .e-pager .e-pagercontainer .e-icons:not(.e-disable):hover {
    background: var(--color-surface-hover);
    color: var(--color-text);
}
.gnr-grid .e-pager .e-currentitem,
.gnr-grid .e-pager .e-currentitem:hover {
    background: var(--color-primary);
    color: #fff;
    font-weight: 700;
}
.gnr-grid .e-pager .e-pagerdropdown { margin-top: 0; }
.gnr-grid .e-pager .e-parentmsgbar { color: var(--color-text-muted); padding-top: 6px; }

.gnr-grid-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.25rem 0;
    color: var(--color-text-muted);
    font-size: 0.95rem;
}
.gnr-grid-empty svg { width: 34px; height: 34px; opacity: 0.6; }

.grid-empty-value { color: var(--color-text-muted); opacity: 0.7; }
.grid-mono { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; letter-spacing: 0.01em; }

.grid-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.4;
    white-space: nowrap;
}
.grid-chip.tone-success { background: color-mix(in srgb, var(--color-success) 15%, transparent); color: var(--color-success); }
.grid-chip.tone-danger { background: color-mix(in srgb, var(--color-error) 14%, transparent); color: var(--color-error); }
.grid-chip.tone-warning { background: color-mix(in srgb, var(--color-warning) 18%, transparent); color: var(--color-warning); }
.grid-chip.tone-info { background: color-mix(in srgb, var(--color-info) 16%, transparent); color: var(--color-info); }
.grid-chip.tone-primary { background: var(--color-primary-alpha); color: var(--color-primary-subtle); }
.grid-chip.tone-neutral { background: var(--color-surface-hover); color: var(--color-text-muted); }

.bool-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
}
.bool-badge svg { width: 12px; height: 12px; }
.bool-badge.is-yes { background: color-mix(in srgb, var(--color-success) 16%, transparent); color: var(--color-success); }
.bool-badge.is-no { background: color-mix(in srgb, var(--color-error) 14%, transparent); color: var(--color-error); }

.list-title { display: flex; align-items: baseline; gap: 0.75rem; }
.list-count {
    padding: 0.15rem 0.6rem;
    border-radius: 999px;
    background: var(--color-primary-alpha);
    color: var(--color-primary-subtle);
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}
.app-button.icon-only { padding: 0.4375rem 0.55rem; }
.grid-tools { display: inline-flex; align-items: center; gap: 0.5rem; }
.grid-tools .app-button { min-height: 38px; background: var(--color-surface); }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 0.75rem; }
.section-head .section-title,
.guias-tab .section-head .section-title { margin: 0; }
.guias-tab .gnr-grid .e-grid .e-rowcell { padding-top: 0.35rem; padding-bottom: 0.35rem; }

/* Escolha de colunas */
.e-ccdlg.e-dialog,
.e-dialog {
    background: var(--color-surface-light);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    box-shadow: var(--shadowLg);
}
.e-dialog .e-dlg-header-content,
.e-dialog .e-dlg-content,
.e-dialog .e-footer-content { background: transparent; color: var(--color-text); }
.e-ccdlg .e-cc-searchdiv { border-color: var(--color-border); }
.e-checkbox-wrapper .e-frame.e-check,
.e-css.e-checkbox-wrapper .e-frame.e-check {
    background: var(--color-primary);
    border-color: var(--color-primary);
}
.e-btn.e-primary,
.e-css.e-btn.e-primary { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.e-btn.e-flat.e-primary { background: transparent; color: var(--color-primary-subtle); }

/* ===== Dropdowns e datas ===== */
.e-input-group:not(.e-float-icon-left):not(.e-float-input)::before,
.e-input-group:not(.e-float-icon-left):not(.e-float-input)::after,
.e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before,
.e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::after { background: var(--color-primary); }
.e-input-group.e-control-wrapper,
.e-input-group {
    background: var(--color-surface);
    border-color: var(--color-border);
    border-radius: 0.375rem;
    color: var(--color-text);
}
.e-input-group.e-control-wrapper.e-input-focus,
.e-input-group.e-input-focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 2px rgba(var(--color-primary-rgb), 0.2) !important;
}
.e-input-group input.e-input,
.e-input-group.e-control-wrapper input.e-input { color: var(--color-text); font-family: var(--font-sans); }
.e-dropdownbase .e-list-item.e-active,
.e-dropdownbase .e-list-item.e-active.e-hover { background: var(--color-primary-alpha); color: var(--color-primary-subtle); font-weight: 600; }
.e-popup.e-ddl,
.e-popup.e-popup-open.e-ddl {
    border: 1px solid var(--color-border);
    border-radius: 8px;
    box-shadow: var(--shadow-md);
    overflow: hidden;
}
.e-calendar .e-content td.e-selected span.e-day,
.e-calendar .e-content td.e-selected:hover span.e-day { background: var(--color-primary); color: #fff; }
.e-calendar .e-content td.e-today span.e-day { border-color: var(--color-primary); color: var(--color-primary-subtle); }
.e-calendar .e-btn.e-today { color: var(--color-primary-subtle); }

.gnr-filter-ddl { min-width: 190px; }

/* ===== Toasts ===== */
.e-toast-container .e-toast {
    background: var(--color-surface-light);
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-primary);
    border-radius: 10px;
    box-shadow: var(--shadowLg);
    color: var(--color-text);
    font-family: var(--font-sans);
}
.e-toast-container .e-toast .e-toast-title { color: var(--color-text); font-weight: 700; font-size: 0.875rem; }
.e-toast-container .e-toast .e-toast-content { color: var(--color-text-secondary); font-size: 0.8125rem; }
.e-toast-container .e-toast.gnr-toast-success { border-left-color: var(--color-success); }
.e-toast-container .e-toast.gnr-toast-error { border-left-color: var(--color-error); }
.e-toast-container .e-toast.gnr-toast-warning { border-left-color: var(--color-warning); }
.e-toast-container .e-toast.gnr-toast-info { border-left-color: var(--color-info); }
.e-toast-container .e-toast .e-toast-progress { background: var(--color-primary); opacity: 0.5; }

/* ===== Gráficos ===== */
h1:focus, h1:focus-visible { outline: none; }

.dash-chart { width: 100%; }
.dashboard-tab .donut-chart { flex: 0 0 150px; width: 150px; height: 150px; }
.dashboard-tab .trend-wrap.dash-chart { min-height: 220px; }
.dash-chart .e-chart,
.dash-chart .e-accumulationchart { font-family: var(--font-sans); }
