:root {
  /* Primary — brand navy (tonal ramp shared with --shape-brand-*) */
  --primary: #011e41 !important;
  --primary-dark: #0b3765 !important;

  --primary-50: #e4e8ed !important;
  --primary-100: #bac4d4 !important;
  --primary-200: #8e9fb7 !important;
  --primary-300: #647a9b !important;
  --primary-400: #435f88 !important;
  --primary-500: var(--primary) !important;
  --primary-600: #153f70 !important;
  --primary-700: #0b3765 !important;
  --primary-800: #042d58 !important;
  --primary-900: #011421 !important;
  --primary-A100: #a8c0e0 !important;
  --primary-A200: #7ba3d6 !important;
  --primary-A400: #4d86cc !important;
  --primary-A700: #366fb8 !important;
  --primary-contrast-50: #000000 !important;
  --primary-contrast-100: #000000 !important;
  --primary-contrast-200: #000000 !important;
  --primary-contrast-300: #ffffff !important;
  --primary-contrast-400: #ffffff !important;
  --primary-contrast-500: #ffffff !important;
  --primary-contrast-600: #ffffff !important;
  --primary-contrast-700: #ffffff !important;
  --primary-contrast-800: #ffffff !important;
  --primary-contrast-900: #ffffff !important;
  --primary-contrast-A100: #000000 !important;
  --primary-contrast-A200: #000000 !important;
  --primary-contrast-A400: #ffffff !important;
  --primary-contrast-A700: #ffffff !important;

  /* Accent — brand green */
  --accent: #00df6d !important;
  --accent-dark: #00b356 !important;

  --accent-50: #e0fbec !important;
  --accent-100: #b3f4d0 !important;
  --accent-200: #80edb1 !important;
  --accent-300: #4de692 !important;
  --accent-400: #26e07b !important;
  --accent-500: #00df6d !important;
  --accent-600: #00c962 !important;
  --accent-700: #00b356 !important;
  --accent-800: #009d4b !important;
  --accent-900: #007736 !important;
  --accent-A100: #d6ffe4 !important;
  --accent-A200: #a3ffc4 !important;
  --accent-A400: #70ffa4 !important;
  --accent-A700: #57ff94 !important;
  --accent-contrast-50: #000000 !important;
  --accent-contrast-100: #000000 !important;
  --accent-contrast-200: #000000 !important;
  --accent-contrast-300: #000000 !important;
  --accent-contrast-400: #000000 !important;
  --accent-contrast-500: #000000 !important;
  --accent-contrast-600: #000000 !important;
  --accent-contrast-700: #ffffff !important;
  --accent-contrast-800: #ffffff !important;
  --accent-contrast-900: #ffffff !important;
  --accent-contrast-A100: #000000 !important;
  --accent-contrast-A200: #000000 !important;
  --accent-contrast-A400: #000000 !important;
  --accent-contrast-A700: #000000 !important;

  /* Warn */
  --warn: #d13737 !important;
  --warn-dark: #ad2828 !important;

  --warn-50: #f9e7e7 !important;
  --warn-100: #f1c3c3 !important;
  --warn-200: #e89b9b !important;
  --warn-300: #df7373 !important;
  --warn-400: #d85555 !important;
  --warn-500: #d13737 !important;
  --warn-600: #cc3131 !important;
  --warn-700: #c62a2a !important;
  --warn-800: #c02323 !important;
  --warn-900: #b51616 !important;
  --warn-A100: #ffe7e7 !important;
  --warn-A200: #ffb4b4 !important;
  --warn-A400: #ff8181 !important;
  --warn-A700: #ff6868 !important;
  --warn-contrast-50: #000000 !important;
  --warn-contrast-100: #000000 !important;
  --warn-contrast-200: #000000 !important;
  --warn-contrast-300: #000000 !important;
  --warn-contrast-400: #ffffff !important;
  --warn-contrast-500: #ffffff !important;
  --warn-contrast-600: #ffffff !important;
  --warn-contrast-700: #ffffff !important;
  --warn-contrast-800: #ffffff !important;
  --warn-contrast-900: #ffffff !important;
  --warn-contrast-A100: #000000 !important;
  --warn-contrast-A200: #000000 !important;
  --warn-contrast-A400: #000000 !important;
  --warn-contrast-A700: #000000 !important;

  --success: #00b356 !important;
  --success-dark: #007736 !important;
  --green: #00b356 !important;

  /* Brand shape ramp (navy) */
  --shape-brand-0: #f4f6f9 !important;
  --shape-brand-50: #e4e8ed !important;
  --shape-brand-100: #bac4d4 !important;
  --shape-brand-200: #8e9fb7 !important;
  --shape-brand-300: #647a9b !important;
  --shape-brand-400: #435f88 !important;
  --shape-brand-500: #284c7b !important;
  --shape-brand-600: #153f70 !important;
  --shape-brand-700: #0b3765 !important;
  --shape-brand-800: #042d58 !important;
  --shape-brand-900: #011e41 !important;
  --shape-brand-1000: #011421 !important;
}

html {
  --mat-app-background-color: #f4f6f9 !important;
  --mat-app-text-color: #011e41 !important;
  --mat-option-selected-state-label-text-color: var(--primary) !important;
  --mat-pseudo-checkbox-full-selected-icon-color: var(--accent) !important;
  --mat-pseudo-checkbox-minimal-selected-checkmark-color: var(--accent) !important;
  --mat-progress-bar-active-indicator-color: var(--primary) !important;
  --mat-progress-bar-track-color: color-mix(in srgb, var(--primary) 25%, transparent) !important;
  --mat-form-field-focus-select-arrow-color: color-mix(in srgb, var(--primary) 87%, transparent) !important;
  --mat-form-field-filled-caret-color: var(--primary) !important;
  --mat-form-field-filled-focus-active-indicator-color: var(--primary) !important;
  --mat-form-field-filled-focus-label-text-color: color-mix(
    in srgb,
    var(--primary) 87%,
    transparent
  ) !important;
  --mat-form-field-outlined-caret-color: var(--primary) !important;
  --mat-form-field-outlined-focus-outline-color: var(--primary) !important;
  --mat-form-field-outlined-focus-label-text-color: color-mix(
    in srgb,
    var(--primary) 87%,
    transparent
  ) !important;
  --mat-select-focused-arrow-color: var(--primary) !important;
  --mat-slide-toggle-selected-handle-color: var(--primary) !important;
  --mat-slide-toggle-selected-focus-state-layer-color: var(--primary) !important;
  --mat-slide-toggle-selected-hover-state-layer-color: var(--primary) !important;
  --mat-slide-toggle-selected-pressed-state-layer-color: var(--primary) !important;
  --mat-slide-toggle-selected-focus-handle-color: var(--primary) !important;
  --mat-slide-toggle-selected-hover-handle-color: var(--primary) !important;
  --mat-slide-toggle-selected-pressed-handle-color: var(--primary) !important;
  --mat-slide-toggle-selected-track-color: var(--primary-dark) !important;
  --mat-slide-toggle-selected-focus-track-color: var(--primary-dark) !important;
  --mat-slide-toggle-selected-hover-track-color: var(--primary-dark) !important;
  --mat-slide-toggle-selected-pressed-track-color: var(--primary-dark) !important;
  --mat-progress-spinner-active-indicator-color: var(--primary) !important;
  --mat-badge-background-color: var(--primary) !important;
  --mat-badge-text-color: #ffffff !important;
  --mat-stepper-header-selected-state-icon-background-color: var(--primary) !important;
  --mat-stepper-header-done-state-icon-background-color: var(--primary) !important;
  --mat-stepper-header-edit-state-icon-background-color: var(--primary) !important;
  --mat-snack-bar-button-color: var(--primary-dark) !important;
  --mat-datepicker-calendar-date-selected-state-background-color: var(--primary) !important;
  --mat-datepicker-toggle-active-state-icon-color: var(--primary) !important;
  --mat-datepicker-calendar-date-focus-state-background-color: color-mix(
    in srgb,
    var(--primary) 12%,
    transparent
  ) !important;
  --mat-datepicker-calendar-date-hover-state-background-color: color-mix(
    in srgb,
    var(--primary) 4%,
    transparent
  ) !important;
  --mat-datepicker-calendar-date-in-range-state-background-color: color-mix(
    in srgb,
    var(--primary) 20%,
    transparent
  ) !important;
  --mtx-colorpicker-toggle-active-state-icon-color: var(--primary) !important;
  --mtx-datetimepicker-calendar-header-background-color: var(--primary) !important;
  --mtx-datetimepicker-calendar-date-selected-state-background-color: var(--primary) !important;
  --mtx-datetimepicker-clock-cell-selected-state-background-color: var(--primary) !important;
  --mtx-datetimepicker-clock-hand-background-color: var(--primary) !important;
  --mtx-datetimepicker-toggle-active-state-icon-color: var(--primary) !important;
  --mtx-select-option-selected-state-text-color: var(--primary) !important;
  --mtx-grid-resizable-handle-active-background-color: var(--primary) !important;
  --mtx-grid-resizable-handle-hover-background-color: var(--primary) !important;
  --mtx-split-gutter-hover-state-background-color: var(--primary) !important;
}

.mat-mdc-progress-bar {
  --mat-progress-bar-active-indicator-color: var(--primary) !important;
  --mat-progress-bar-track-color: color-mix(in srgb, var(--primary) 25%, transparent) !important;
}

.mat-mdc-radio-button.mat-primary {
  --mat-radio-checked-ripple-color: var(--primary) !important;
  --mat-radio-selected-focus-icon-color: var(--primary) !important;
  --mat-radio-selected-hover-icon-color: var(--primary) !important;
  --mat-radio-selected-icon-color: var(--primary) !important;
  --mat-radio-selected-pressed-icon-color: var(--primary) !important;
}

.mat-mdc-button.mat-primary,
.mat-mdc-unelevated-button.mat-primary,
.mat-mdc-raised-button.mat-primary,
.mat-mdc-outlined-button.mat-primary,
.mat-tonal-button.mat-primary {
  --mat-button-filled-container-color: var(--primary) !important;
  --mat-button-filled-label-text-color: #ffffff !important;
  --mat-button-outlined-label-text-color: var(--primary) !important;
  --mat-button-outlined-state-layer-color: var(--primary) !important;
  --mat-button-protected-container-color: var(--primary) !important;
  --mat-button-protected-label-text-color: #ffffff !important;
  --mat-button-text-label-text-color: var(--primary) !important;
  --mat-button-text-state-layer-color: var(--primary) !important;
  --mat-button-tonal-container-color: var(--primary) !important;
  --mat-button-tonal-label-text-color: #ffffff !important;
}

.mat-mdc-icon-button.mat-primary {
  --mat-icon-button-icon-color: var(--primary) !important;
  --mat-icon-button-state-layer-color: var(--primary) !important;
}

.mat-mdc-fab.mat-primary,
.mat-mdc-mini-fab.mat-primary {
  --mat-fab-container-color: var(--primary) !important;
  --mat-fab-foreground-color: #ffffff !important;
  --mat-fab-small-container-color: var(--primary) !important;
  --mat-fab-small-foreground-color: #ffffff !important;
}

.mat-mdc-checkbox.mat-primary {
  --mat-checkbox-selected-icon-color: var(--primary) !important;
  --mat-checkbox-selected-focus-icon-color: var(--primary) !important;
  --mat-checkbox-selected-hover-icon-color: var(--primary) !important;
  --mat-checkbox-selected-pressed-icon-color: var(--primary) !important;
  --mat-checkbox-selected-focus-state-layer-color: var(--primary) !important;
  --mat-checkbox-selected-hover-state-layer-color: var(--primary) !important;
  --mat-checkbox-selected-pressed-state-layer-color: var(--primary) !important;
}

.mat-mdc-tab-group,
.mat-mdc-tab-nav-bar {
  --mat-tab-active-label-text-color: var(--shape-brand-900) !important;
  --mat-tab-active-ripple-color: var(--primary) !important;
  --mat-tab-inactive-ripple-color: var(--primary) !important;
  --mat-tab-active-focus-label-text-color: var(--shape-brand-900) !important;
  --mat-tab-active-hover-label-text-color: var(--shape-brand-900) !important;
  --mat-tab-active-focus-indicator-color: var(--accent-dark) !important;
  --mat-tab-active-hover-indicator-color: var(--accent-dark) !important;
  --mat-tab-active-indicator-color: var(--accent-dark) !important;
}

.mat-mdc-tab-group.mat-background-primary,
.mat-mdc-tab-nav-bar.mat-background-primary {
  --mat-tab-background-color: var(--primary) !important;
  --mat-tab-foreground-color: #ffffff !important;
}

.mat-toolbar.mat-primary {
  --mat-toolbar-container-background-color: var(--primary) !important;
  --mat-toolbar-container-text-color: #ffffff !important;
}

.mat-primary {
  --mat-pseudo-checkbox-full-selected-icon-color: var(--primary) !important;
  --mat-pseudo-checkbox-minimal-selected-checkmark-color: var(--primary) !important;
}

.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__primary-text,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__start,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__primary-text,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__start {
  color: var(--primary) !important;
}

.mat-sidenav,
#content .mat-toolbar-row > .mat-icon,
#content .mat-toolbar .mdc-button:not(.mat-mdc-button-disabled) {
  --mat-icon-color: var(--shape-brand-300) !important;
}
.mat-icon:has(+ [class*="mat-headline"]) {
  color: var(--shape-brand-300) !important;
}
.mat-toolbar h2 {
  color: var(--shape-brand-900) !important;
}

.mat-toolbar.mat-primary
  button.mat-mdc-icon-button:has(+ .logo-toolbar)
  .mat-icon:has(+ .mat-focus-indicator) {
  color: var(--shape-brand-200) !important;
}

/* BORDO SIDEBAR */
.mat-drawer-side {
  border-right-color: var(--mat-sidenav-container-divider-color, transparent) !important;
  border-right-width: 1px !important;
  border-right-style: solid !important;
}

#content .mat-toolbar {
  --mat-toolbar-container-background-color: var(--shape-brand-0) !important;
  background: var(--mat-toolbar-container-background-color, var(--mat-sys-surface)) !important;
}

#content .mat-toolbar,
#content nav.mat-mdc-tab-nav-bar {
  border-bottom-color: var(--mat-sidenav-container-divider-color, transparent) !important;
  border-bottom-width: 1px !important;
  border-bottom-style: solid !important;
}

.logo-toolbar {
  height: 60% !important;
}