/* Custom IBM Carbon Design System Extensions for Warroom App */

/* Root tokens */
:root {
  --carbon-bg-01: #ffffff;
  --carbon-bg-02: #f4f4f4;
  --carbon-bg-dark: #161616;
  --carbon-bg-dark-hover: #393939;
  --carbon-text-primary: #161616;
  --carbon-text-secondary: #525252;
  --carbon-text-inverse: #ffffff;
  --carbon-border-subtle: #e0e0e0;
  --carbon-border-dark: #393939;
  --carbon-interactive-primary: #007d79;
  --carbon-interactive-primary-hover: #005d5d;
  --carbon-interactive-primary-active: #004144;
  --carbon-interactive-focus: #009d9a;
  --carbon-interactive-danger: #da1e28;
  --cds-interactive-primary: #007d79;
  --cds-focus: #009d9a;
}

/* Base Body typography */
body {
  font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif !important;
  background-color: var(--carbon-bg-02) !important;
  color: var(--carbon-text-primary);
  margin: 0;
  padding: 0;
  position: relative;
  min-height: 100vh;
}

/* Global Hero Background for Page Intro Banner */
body::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: var(--nest-hero-height, 240px);
  background-image: url('/warroom/static/nest_landing_hero.svg') !important;
  background-size: cover !important;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  pointer-events: none !important;
  z-index: 0 !important;
  border-bottom: 1px solid var(--carbon-border-subtle, #e0e0e0) !important;
}

body:has(.carbon-login-wrapper)::before {
  display: none !important;
}

.bx--grid,
.carbon-page-container,
.nicegui-content {
  position: relative;
  z-index: 1;
}

/* Page Layout Containers */
.carbon-page-container {
  padding: 2rem;
  max-width: 1200px;
  margin: 4rem auto 0 auto;
  width: 100%;
  box-sizing: border-box;
}

.carbon-page-container--sm {
  max-width: 400px;
}

.carbon-page-container--md {
  max-width: 600px;
}

.carbon-page-container--lg {
  max-width: 800px;
}

.carbon-login-wrapper {
  min-height: 100vh;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--carbon-bg-02);
  padding: 1rem;
  box-sizing: border-box;
}

.carbon-login-card {
  width: 100%;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  align-items: stretch !important;
  box-sizing: border-box;
}

.carbon-login-tile {
  margin-bottom: 0 !important;
  border-bottom: none !important;
  box-sizing: border-box;
  padding: 2rem !important;
}

.carbon-login-card .carbon-title {
  margin-bottom: 0.5rem !important;
}

.carbon-login-card .carbon-text-muted {
  margin-bottom: 2rem !important;
}

.carbon-login-card .carbon-section-title {
  margin-bottom: 1.5rem !important;
}

.carbon-login-card .q-field {
  margin-bottom: 1.5rem !important;
}

.carbon-login-card .q-field:last-of-type {
  margin-bottom: 0.5rem !important;
}

.carbon-login-btn,
.bx--btn.carbon-login-btn,
.q-btn.carbon-login-btn {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  line-height: 48px !important;
  margin-top: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  box-sizing: border-box !important;
  border: 1px solid transparent !important;
}

/* Carbon Tile container (replacing Quasar cards) */
.cds--tile,
.bx--tile,
.carbon-tile {
  background-color: var(--carbon-bg-01, #ffffff);
  border: 1px solid var(--carbon-border-subtle, #e0e0e0);
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: var(--cds-spacing-05, 1rem) !important;
  width: 100%;
  box-sizing: border-box;
  margin-bottom: var(--cds-spacing-05, 1rem);
}

.cds--tile--dense,
.carbon-tile--dense {
  padding: var(--cds-spacing-04, 0.75rem) !important;
}

.cds--tile--lead,
.carbon-tile--lead {
  padding: var(--cds-spacing-06, 1.5rem) !important;
}

.carbon-tile:last-child {
  margin-bottom: 0;
}

/* Page Header and Titles */
.carbon-page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
  width: 100%;
}

.carbon-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--carbon-text-primary);
  margin: 0;
  line-height: 1.25;
}

.carbon-title--danger {
  color: var(--carbon-interactive-danger);
}

.carbon-section-title {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--carbon-text-primary);
  margin-top: 0;
  margin-bottom: 1rem;
}

.carbon-text-muted {
  color: var(--carbon-text-secondary);
  font-size: 0.875rem;
}

.carbon-text-monospace {
  font-family: monospace;
  color: #393939;
  font-size: 0.875rem;
}

.carbon-text-danger {
  color: var(--carbon-interactive-danger);
  font-weight: 600;
}

/* Navigation Links */
.carbon-link {
  color: var(--carbon-interactive-primary);
  text-decoration: none;
  font-weight: 500;
  cursor: pointer;
}

.carbon-link:hover {
  text-decoration: underline;
}

.carbon-link--danger {
  color: var(--carbon-interactive-danger);
  text-decoration: none;
  font-weight: 500;
  cursor: pointer;
}

.carbon-link--danger:hover {
  text-decoration: underline;
}

/* Data Table Styling */
.carbon-table-container {
  width: 100%;
  overflow-x: auto;
  margin-top: 1rem;
}

.carbon-table-container--no-scroll {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
}


.bx--data-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  background-color: var(--carbon-bg-01);
}

.bx--data-table th {
  background-color: var(--carbon-bg-02);
  border-bottom: 2px solid var(--carbon-border-subtle);
  height: 48px;
  padding: 0 16px;
  font-weight: 600;
  color: var(--carbon-text-primary);
  font-size: 0.875rem;
  vertical-align: middle;
}

.bx--data-table td {
  border-bottom: 1px solid var(--carbon-border-subtle);
  height: 48px;
  padding: 0 16px;
  font-size: 0.875rem;
  color: var(--carbon-text-primary);
  vertical-align: middle;
}

.bx--data-table tr:hover td {
  background-color: #e5e5e5;
}

/* Map Containers */
.carbon-map-container {
  height: 300px;
  width: 100%;
  border: 1px solid var(--carbon-border-subtle);
  margin-bottom: 1rem;
}

.carbon-map-lg {
  height: 450px;
  width: 100%;
  border: 1px solid var(--carbon-border-subtle);
  margin-bottom: 1rem;
}


/* Global Header Components */
.carbon-header {
  width: 100%;
  background-color: var(--carbon-bg-dark) !important;
  padding: 0 !important;
  height: 48px !important;
  min-height: 48px !important;
  border-bottom: 1px solid var(--carbon-border-dark) !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.carbon-header-row {
  width: 100%;
  height: 48px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
}

.carbon-header-left {
  display: flex;
  align-items: center;
  height: 48px;
  padding: 0 16px 0 0;
  margin: 0;
}

.carbon-header-title {
  font-size: 1rem;
  font-weight: 400;
  color: var(--carbon-text-inverse);
  letter-spacing: 0.1px;
  margin: 0;
}

.carbon-header-right {
  display: flex;
  align-items: center;
  height: 48px;
  margin: 0;
  gap: 0;
}

.carbon-header-user {
  display: flex;
  align-items: center;
  height: 48px;
  padding: 0 16px;
  border-left: 1px solid var(--carbon-border-dark);
  border-right: 1px solid var(--carbon-border-dark);
  margin: 0;
  color: var(--carbon-text-inverse);
  font-size: 0.875rem;
}

.carbon-header-btn {
  background-color: transparent !important;
  width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.carbon-header-btn--border-right {
  border-right: 1px solid var(--carbon-border-dark);
}

.carbon-switcher {
  background-color: #262626 !important;
  border-left: 1px solid #393939 !important;
  border-bottom: 1px solid #393939 !important;
  border-top: none !important;
  border-right: none !important;
  width: 256px !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.carbon-switcher-divider {
  font-size: 0.75rem !important;
  color: #c6c6c6 !important;
  padding: 16px 16px 8px 16px !important;
  border-top: 1px solid #393939 !important;
  margin: 0 !important;
  display: block !important;
  line-height: 1.33333 !important;
  letter-spacing: 0.16px !important;
}

.carbon-switcher-divider:first-child {
  border-top: none !important;
}

.q-menu.carbon-switcher .carbon-switcher-link,
.q-menu.carbon-lang-menu .carbon-lang-link {
  display: flex !important;
  align-items: center !important;
  height: 48px !important;
  padding: 0 16px !important;
  color: #f4f4f4 !important;
  font-size: 0.875rem !important;
  text-decoration: none !important;
  cursor: pointer !important;
  margin: 0 !important;
  transition: background-color 110ms !important;
}

.q-menu.carbon-switcher .carbon-switcher-link:hover,
.q-menu.carbon-lang-menu .carbon-lang-link:hover {
  background-color: #393939 !important;
}

.carbon-switcher-link .q-focus-helper,
.carbon-lang-link .q-focus-helper {
  display: none !important;
}

.carbon-lang-menu {
  background-color: #262626 !important;
  border-left: 1px solid #393939 !important;
  border-bottom: 1px solid #393939 !important;
  border-top: none !important;
  border-right: none !important;
  min-width: 150px !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.carbon-lang-link--active {
  background-color: #393939 !important;
  font-weight: 600 !important;
}

.carbon-lang-link--inactive {
  background-color: transparent !important;
  font-weight: 400 !important;
}

/* Status dots */
.carbon-status-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 8px;
}

.carbon-status-dot--active {
  background-color: #24a148;
}

.carbon-status-dot--inactive {
  background-color: #da1e28;
}

.carbon-status-dot--unknown {
  background-color: #8d8d8d;
}

/* Dashboard Metric Cards */
.carbon-metric-value {
  font-size: 3rem;
  font-weight: 300;
  color: var(--carbon-text-primary);
  line-height: 1;
}

.carbon-metric-sub--active {
  font-size: 1rem;
  color: #24a148;
  font-weight: 600;
}

.carbon-action-tile {
  background-color: var(--carbon-interactive-primary) !important;
  color: #ffffff !important;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}

.carbon-table-btn {
  text-decoration: none !important;
  margin: 0 2px !important;
  background-color: transparent !important;
  color: var(--carbon-interactive-primary, #007d79) !important;
  padding: 0 8px !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  min-width: unset !important;
  line-height: 1.25 !important;
  transition: background-color 0.15s ease, color 0.15s ease !important;
}

.carbon-table-btn:hover {
  background-color: #e5e5e5 !important;
  color: var(--carbon-interactive-primary-hover, #005d5d) !important;
}

.carbon-table-btn--danger {
  background-color: transparent !important;
  color: var(--carbon-interactive-danger, #da1e28) !important;
}

.carbon-table-btn--danger:hover {
  background-color: #ffd7d9 !important;
  color: #ba1b23 !important;
}

/* IBM Carbon Ghost Buttons - Override any default .bx--btn.bx--btn--primary classes */
.bx--btn--ghost,
.bx--btn.bx--btn--ghost,
.bx--btn.bx--btn--primary.bx--btn--ghost,
.bx--btn.bx--btn--ghost.bx--btn--sm,
.bx--btn.bx--btn--primary.bx--btn--ghost.bx--btn--sm,
button.bx--btn.bx--btn--ghost {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--carbon-interactive-primary, #007d79) !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  padding: 0 8px !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  min-width: unset !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
  transition: background-color 0.15s ease, color 0.15s ease !important;
}

.bx--btn--ghost:hover,
.bx--btn.bx--btn--ghost:hover,
.bx--btn.bx--btn--primary.bx--btn--ghost:hover,
button.bx--btn.bx--btn--ghost:hover {
  background-color: #e5e5e5 !important;
  color: var(--carbon-interactive-primary-hover, #005d5d) !important;
}

.bx--btn--ghost *,
.bx--btn.bx--btn--ghost *,
button.bx--btn.bx--btn--ghost * {
  color: var(--carbon-interactive-primary, #007d79) !important;
}

.bx--btn--ghost:hover *,
.bx--btn.bx--btn--ghost:hover *,
button.bx--btn.bx--btn--ghost:hover * {
  color: var(--carbon-interactive-primary-hover, #005d5d) !important;
}

.bx--btn--ghost--danger,
.bx--btn.bx--btn--ghost--danger,
.bx--btn.bx--btn--primary.bx--btn--ghost--danger,
.bx--btn.bx--btn--ghost.bx--btn--ghost--danger,
.bx--btn.bx--btn--ghost.text-red-600,
.bx--btn.bx--btn--ghost[class*="support-error"],
button.bx--btn.bx--btn--ghost--danger {
  background: transparent !important;
  background-color: transparent !important;
  color: #da1e28 !important;
  border: none !important;
  box-shadow: none !important;
}

.bx--btn--ghost--danger *,
.bx--btn.bx--btn--ghost--danger *,
button.bx--btn.bx--btn--ghost--danger * {
  color: #da1e28 !important;
}

.bx--btn--ghost--danger:hover,
.bx--btn.bx--btn--ghost--danger:hover,
.bx--btn.bx--btn--primary.bx--btn--ghost--danger:hover,
.bx--btn.bx--btn--ghost.bx--btn--ghost--danger:hover,
.bx--btn.bx--btn--ghost.text-red-600:hover,
.bx--btn.bx--btn--ghost[class*="support-error"]:hover,
button.bx--btn.bx--btn--ghost--danger:hover {
  background-color: #ffd7d9 !important;
  color: #ba1b23 !important;
}

.bx--btn--ghost--danger:hover *,
.bx--btn.bx--btn--ghost--danger:hover *,
button.bx--btn.bx--btn--ghost--danger:hover * {
  color: #ba1b23 !important;
}

/* In-table actions: strictly inline horizontal row, never wrap or stack */
.bx--data-table td .flex,
.bx--data-table td.carbon-table-actions,
.bx--data-table td.carbon-table-actions .flex,
.bx--data-table .carbon-table-actions-container {
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
}

/* IBM Carbon Primary & Secondary Buttons */
.bx--btn--primary,
.bx--btn.bx--btn--primary {
  background-color: var(--carbon-interactive-primary, #007d79) !important;
  color: #ffffff !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  transition: background-color 0.15s ease !important;
}

.bx--btn--primary:hover,
.bx--btn.bx--btn--primary:hover {
  background-color: var(--carbon-interactive-primary-hover, #005d5d) !important;
  color: #ffffff !important;
}

.bx--btn--primary:active,
.bx--btn.bx--btn--primary:active {
  background-color: var(--carbon-interactive-primary-active, #004144) !important;
}

.bx--btn--primary:focus,
.bx--btn.bx--btn--primary:focus {
  outline: 2px solid var(--carbon-interactive-focus, #009d9a) !important;
  outline-offset: 2px !important;
}

.bx--btn--secondary,
.bx--btn.bx--btn--secondary {
  background-color: #393939 !important;
  color: #ffffff !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-weight: 500 !important;
  text-transform: none !important;
}

.bx--btn--secondary:hover,
.bx--btn.bx--btn--secondary:hover {
  background-color: #4c4c4c !important;
  color: #ffffff !important;
}


.carbon-ml-3 {
  margin-left: 0.75rem;
}

/* Quasar Select Dropdown Dark Theme Overrides */
.q-menu,
.q-select__dialog,
.q-position-engine {
  background-color: #262626 !important;
  color: #f4f4f4 !important;
  border: 1px solid #393939 !important;
  border-radius: 0 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
}

.q-menu .q-item,
.q-select__dialog .q-item {
  background-color: #262626 !important;
  color: #f4f4f4 !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  min-height: 40px !important;
  padding: 0 16px !important;
}

.q-menu .q-item:hover,
.q-menu .q-item.q-manual-focusable--focused,
.q-menu .q-item--active,
.q-select__dialog .q-item:hover,
.q-select__dialog .q-item--active {
  background-color: #393939 !important;
  color: #ffffff !important;
}

.q-menu .q-item__label,
.q-select__dialog .q-item__label {
  color: #f4f4f4 !important;
}

/* Carbon UI styling for Quasar File Uploader (ui.upload) */
.q-uploader {
  border-radius: 0 !important;
  box-shadow: none !important;
  border: 1px dashed var(--carbon-border-dark) !important;
  background-color: var(--carbon-bg-02) !important;
  width: 100% !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
}

.q-uploader__header {
  background-color: #e5e5e5 !important;
  color: var(--carbon-text-primary) !important;
  border-bottom: 1px solid var(--carbon-border-subtle) !important;
  border-radius: 0 !important;
  padding: 8px 16px !important;
}

.q-uploader__subtitle,
.q-uploader__title {
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  color: var(--carbon-text-primary) !important;
}

.q-uploader__header .q-btn {
  border-radius: 0 !important;
  box-shadow: none !important;
  background-color: var(--carbon-interactive-primary) !important;
  color: #ffffff !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-weight: 500 !important;
}

.q-uploader__list {
  background-color: var(--carbon-bg-01) !important;
  min-height: 60px !important;
  padding: 8px !important;
}

.q-uploader__file {
  border-radius: 0 !important;
  border: 1px solid var(--carbon-border-subtle) !important;
  background-color: var(--carbon-bg-02) !important;
}

.q-uploader__file-header {
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  color: var(--carbon-text-primary) !important;
}

.carbon-breadcrumb-bar {
  width: 100% !important;
  background: transparent !important;
  background-color: transparent !important;
  border-bottom: none !important;
  padding: var(--cds-spacing-04, 0.75rem) var(--cds-spacing-05, 1rem) !important;
  margin-bottom: 0 !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 1 !important;
}


/* Carbon Breadcrumb Component Specs */
/* https://carbondesignsystem.com/components/breadcrumb/usage/ */
.bx--breadcrumb {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 0.75rem !important;
  /* 12px Carbon type scale */
  font-weight: 400 !important;
  line-height: 1.33333 !important;
  letter-spacing: 0.32px !important;
}


.bx--breadcrumb-item {
  display: inline-flex !important;
  align-items: center !important;
  color: #525252 !important;
}

.bx--breadcrumb-item+.bx--breadcrumb-item::before {
  content: "/" !important;
  padding: 0 0.5rem !important;
  color: #a8a8a8 !important;
}

.bx--breadcrumb-link {
  color: #525252 !important;
  text-decoration: none !important;
  transition: color 0.11s ease-in-out !important;
}

.bx--breadcrumb-link:hover {
  color: #0f62fe !important;
  text-decoration: underline !important;
}

.bx--breadcrumb-item--current .bx--breadcrumb-link,
.bx--breadcrumb-item--current span.bx--breadcrumb-link {
  color: #161616 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  cursor: default !important;
}

/* Carbon Content Switcher Container */
.bx--content-switcher {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  background-color: #e0e0e0 !important;
  border: 1px solid #8d8d8d !important;
  border-radius: 0 !important;
  margin-top: 1rem !important;
  margin-bottom: 1.5rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  width: auto !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* Disable Quasar Focus Helper overlay inside Content Switcher */
.bx--content-switcher .q-focus-helper,
.bx--content-switcher .q-focus-helper::before,
.bx--content-switcher .q-focus-helper::after {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* Individual Content Switcher Button Base */
.bx--content-switcher .q-btn,
.bx--content-switcher .q-btn--rectangle,
.bx--content-switcher-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding: 0 24px !important;
  margin: 0 !important;
  background-color: #e0e0e0 !important;
  background: #e0e0e0 !important;
  border: none !important;
  outline: none !important;
  color: #161616 !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  position: relative !important;
  transition: background-color 110ms ease-in-out, color 110ms ease-in-out !important;
}

/* Vertical divider between adjacent tabs */
.bx--content-switcher .q-btn:not(:last-child)::after,
.bx--content-switcher-btn:not(:last-child)::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  top: 8px !important;
  bottom: 8px !important;
  width: 1px !important;
  background-color: #8d8d8d !important;
  z-index: 10 !important;
}

/* ========================================================= */
/* 1. INACTIVE TAB (DEFAULT STATE)                           */
/* ========================================================= */
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected),
.bx--content-switcher-btn:not(.bx--content-switcher--selected) {
  background-color: #e0e0e0 !important;
  background: #e0e0e0 !important;
  color: #161616 !important;
}

.bx--content-switcher .q-btn:not(.bx--content-switcher--selected) *,
.bx--content-switcher-btn:not(.bx--content-switcher--selected) * {
  color: #161616 !important;
  font-weight: 500 !important;
}

/* ========================================================= */
/* 2. INACTIVE TAB (HOVER & FOCUS STATES)                    */
/* ========================================================= */
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected):hover,
.bx--content-switcher-btn:not(.bx--content-switcher--selected):hover,
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected):focus,
.bx--content-switcher-btn:not(.bx--content-switcher--selected):focus,
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected):focus-visible,
.bx--content-switcher-btn:not(.bx--content-switcher--selected):focus-visible,
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected):focus-within,
.bx--content-switcher-btn:not(.bx--content-switcher--selected):focus-within,
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected).q-manual-focusable--focused,
.bx--content-switcher-btn:not(.bx--content-switcher--selected).q-manual-focusable--focused {
  background-color: #c6c6c6 !important;
  background: #c6c6c6 !important;
  color: #161616 !important;
}

.bx--content-switcher .q-btn:not(.bx--content-switcher--selected):hover *,
.bx--content-switcher-btn:not(.bx--content-switcher--selected):hover *,
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected):focus *,
.bx--content-switcher-btn:not(.bx--content-switcher--selected):focus *,
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected):focus-visible *,
.bx--content-switcher-btn:not(.bx--content-switcher--selected):focus-visible *,
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected):focus-within *,
.bx--content-switcher-btn:not(.bx--content-switcher--selected):focus-within *,
.bx--content-switcher .q-btn:not(.bx--content-switcher--selected).q-manual-focusable--focused *,
.bx--content-switcher-btn:not(.bx--content-switcher--selected).q-manual-focusable--focused * {
  color: #161616 !important;
  font-weight: 600 !important;
}

/* ========================================================= */
/* 3. ACTIVE / SELECTED TAB (DEFAULT STATE)                  */
/* ========================================================= */
.bx--content-switcher .bx--content-switcher--selected,
.bx--content-switcher-btn.bx--content-switcher--selected,
.bx--content-switcher-btn--selected {
  background-color: #393939 !important;
  background: #393939 !important;
  color: #ffffff !important;
}

.bx--content-switcher .bx--content-switcher--selected *,
.bx--content-switcher-btn.bx--content-switcher--selected *,
.bx--content-switcher-btn--selected * {
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* ========================================================= */
/* 4. ACTIVE / SELECTED TAB (HOVER & FOCUS STATES)           */
/* ========================================================= */
.bx--content-switcher .bx--content-switcher--selected:hover,
.bx--content-switcher-btn.bx--content-switcher--selected:hover,
.bx--content-switcher .bx--content-switcher--selected:focus,
.bx--content-switcher-btn.bx--content-switcher--selected:focus,
.bx--content-switcher .bx--content-switcher--selected:focus-visible,
.bx--content-switcher-btn.bx--content-switcher--selected:focus-visible,
.bx--content-switcher .bx--content-switcher--selected:focus-within,
.bx--content-switcher-btn.bx--content-switcher--selected:focus-within,
.bx--content-switcher .bx--content-switcher--selected.q-manual-focusable--focused,
.bx--content-switcher-btn.bx--content-switcher--selected.q-manual-focusable--focused {
  background-color: #262626 !important;
  background: #262626 !important;
  color: #ffffff !important;
}

.bx--content-switcher .bx--content-switcher--selected:hover *,
.bx--content-switcher-btn.bx--content-switcher--selected:hover *,
.bx--content-switcher .bx--content-switcher--selected:focus *,
.bx--content-switcher-btn.bx--content-switcher--selected:focus *,
.bx--content-switcher .bx--content-switcher--selected:focus-visible *,
.bx--content-switcher-btn.bx--content-switcher--selected:focus-visible *,
.bx--content-switcher .bx--content-switcher--selected:focus-within *,
.bx--content-switcher-btn.bx--content-switcher--selected:focus-within *,
.bx--content-switcher .bx--content-switcher--selected.q-manual-focusable--focused *,
.bx--content-switcher-btn.bx--content-switcher--selected.q-manual-focusable--focused * {
  color: #ffffff !important;
  font-weight: 600 !important;
}

.bx--content-switcher-btn .q-btn__content {
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  text-transform: none !important;
  padding: 0 !important;
  letter-spacing: normal !important;
}



/* Carbon Tertiary Button Fix */
.bx--btn--tertiary {
  background-color: transparent !important;
  border: 1px solid var(--carbon-interactive-primary, #007d79) !important;
  color: var(--carbon-interactive-primary, #007d79) !important;
}

.bx--btn--tertiary .q-btn__content,
.bx--btn--tertiary span {
  color: var(--carbon-interactive-primary, #007d79) !important;
  font-weight: 500 !important;
}

.bx--btn--tertiary:hover {
  background-color: var(--carbon-interactive-primary, #007d79) !important;
  color: #ffffff !important;
}

.bx--btn--tertiary:hover .q-btn__content,
.bx--btn--tertiary:hover span {
  color: #ffffff !important;
}



/* Carbon Checkbox Improvements */
.carbon-checkbox {
  min-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  margin-right: 1.5rem !important;
  margin-top: 0.25rem !important;
  margin-bottom: 0.25rem !important;
}

.carbon-checkbox .q-checkbox__inner {
  font-size: 20px !important;
  width: 20px !important;
  min-width: 20px !important;
  height: 20px !important;
}

.carbon-checkbox .q-checkbox__bg {
  border-radius: 0 !important;
  border: 1px solid #161616 !important;
  box-shadow: none !important;
  width: 18px !important;
  height: 18px !important;
  top: 1px !important;
  left: 1px !important;
}

.carbon-checkbox.q-checkbox--truthy .q-checkbox__bg,
.carbon-checkbox[aria-checked="true"] .q-checkbox__bg {
  background-color: var(--cds-interactive-primary, #007d79) !important;
  border-color: var(--cds-interactive-primary, #007d79) !important;
}

.carbon-checkbox .q-checkbox__label {
  color: #161616 !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  padding-left: 8px !important;
  line-height: 1.5 !important;
}

/* Carbon Contained Tabs with Icon & Secondary Label */
.carbon-contained-tabs {
  display: flex !important;
  width: 100% !important;
  background-color: #8d8d8d !important;
  gap: 1px !important;
  border-bottom: 1px solid #8d8d8d !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
  position: relative !important;
}

/* Tab Panel White Background Surface */
.carbon-tab-panel,
.carbon-contained-tab-content,
.bx--tab-content,
.cds--tab-content {
  background-color: #ffffff !important;
  border: 1px solid var(--carbon-border-subtle, #e0e0e0) !important;
  border-top: none !important;
  padding: var(--cds-spacing-05, 1rem) !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.carbon-tab-panel > .carbon-table-card,
.carbon-tab-panel > .carbon-table-container,
.carbon-tab-panel > .bx--data-table {
  border: none !important;
}

.carbon-contained-tab {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.75rem !important;
  padding: 0.875rem 1.25rem !important;
  background-color: #f4f4f4 !important;
  border: none !important;
  border-top: 4px solid transparent !important;
  color: #525252 !important;
  cursor: pointer !important;
  transition: all 0.15s cubic-bezier(0.2, 0, 0.38, 0.9) !important;
  text-align: left !important;
  box-sizing: border-box !important;
  outline: none !important;
  margin: 0 !important;
  text-transform: none !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  border-radius: 0 !important;
  height: auto !important;
  min-height: 56px !important;
}

.carbon-contained-tab:hover {
  background-color: #e5e5e5 !important;
  color: #161616 !important;
}

.carbon-contained-tab--selected,
.carbon-contained-card--selected {
  background-color: #ffffff !important;
  border-top-color: var(--cds-interactive-primary, #007d79) !important;
  color: #161616 !important;
  margin-bottom: -1px !important;
  z-index: 1 !important;
}

.carbon-contained-tab--selected .carbon-tab-title,
.carbon-contained-card--selected .carbon-tab-title {
  color: var(--cds-interactive-primary, #007d79) !important;
  font-weight: 600 !important;
}

.carbon-contained-tab--selected .carbon-tab-subtitle,
.carbon-contained-card--selected .carbon-tab-subtitle {
  color: #161616 !important;
}

.carbon-tab-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  width: 24px !important;
  height: 24px !important;
}

.carbon-tab-icon svg {
  width: 20px !important;
  height: 20px !important;
  fill: currentColor !important;
  color: inherit !important;
}

.carbon-contained-tab--selected .carbon-tab-icon svg,
.carbon-contained-card--selected .carbon-tab-icon svg {
  fill: var(--cds-interactive-primary, #007d79) !important;
  color: var(--cds-interactive-primary, #007d79) !important;
}

.carbon-tab-content {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

.carbon-tab-title {
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: #161616 !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.carbon-tab-subtitle {
  font-size: 0.75rem !important;
  font-weight: 400 !important;
  color: #6f6f6f !important;
  margin-top: 0.2rem !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Official IBM Carbon v11 Number Input Styling */
.cds--number {
  position: relative !important;
  display: inline-flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 140px !important;
  min-width: 90px !important;
}

.cds--number--fluid {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

.cds--number__input-wrapper {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 40px !important;
  background-color: #f4f4f4 !important;
  border-bottom: 1px solid #8d8d8d !important;
  box-sizing: border-box !important;
}

.cds--number__input-wrapper:focus-within {
  outline: 2px solid #0f62fe !important;
  outline-offset: -2px !important;
}

.cds--number__input {
  width: 100% !important;
  height: 100% !important;
  padding: 0 64px 0 14px !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  color: #161616 !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  appearance: textfield !important;
  -webkit-appearance: textfield !important;
  -moz-appearance: textfield !important;
  box-sizing: border-box !important;
}

.cds--number__input::-webkit-outer-spin-button,
.cds--number__input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

.cds--number__controls {
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  background-color: transparent !important;
}

.cds--number__control-btn {
  width: 32px !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  color: #161616 !important;
  cursor: pointer !important;
  transition: background-color 0.15s ease, color 0.15s ease !important;
  box-sizing: border-box !important;
}



.cds--number__control-btn:hover {
  background-color: #e5e5e5 !important;
  color: #0f62fe !important;
}

.cds--number__control-btn:active {
  background-color: #c6c6c6 !important;
}

.cds--number__control-btn svg {
  fill: currentColor !important;
  pointer-events: none !important;
}

.cds--number__rule-divider {
  width: 1px !important;
  height: 100% !important;
  background-color: #e0e0e0 !important;
}



/* Carbon Switch Toggle Styling */
.carbon-toggle-switch .q-toggle__inner {
  font-size: 28px !important;
}

.carbon-toggle-switch.q-toggle--truthy .q-toggle__track {
  background-color: #24a148 !important;
}

/* Authentic Carbon Design System Toggle Switch */
.carbon-toggle-switch-wrapper {
  position: relative;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  user-select: none !important;
}

.carbon-toggle-track {
  width: 48px !important;
  height: 24px !important;
  background-color: #8d8d8d;
  border-radius: 12px !important;
  position: relative !important;
  transition: background-color 0.2s cubic-bezier(0.2, 0, 0.38, 0.9) !important;
}

.carbon-toggle-thumb {
  width: 18px !important;
  height: 18px !important;
  background-color: #ffffff !important;
  border-radius: 50% !important;
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  transition: transform 0.2s cubic-bezier(0.2, 0, 0.38, 0.9) !important;
}

.carbon-toggle-track--active {
  background-color: #24a148 !important;
}

.carbon-toggle-track--active .carbon-toggle-thumb {
  transform: translateX(24px) !important;
}

.carbon-toggle-text {
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: #525252 !important;
}

.carbon-toggle-text--active {
  color: #161616 !important;
}

/* Carbon Contained Tab header icon */
.carbon-tab-icon {
  margin-right: 0.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Carbon Tag Color Palette Extensions */
.carbon-tag-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  border-radius: 0.875rem;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  transition: all 0.15s ease-in-out;
}

.carbon-tag-pill:hover {
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.carbon-tag-pill:active {
  transform: scale(0.96);
}

.carbon-tag--blue {
  background-color: #d0e2ff !important;
  color: #0043ce !important;
  border: 1px solid #78a9ff !important;
}

.carbon-tag--cyan {
  background-color: #bae6ff !important;
  color: #00539a !important;
  border: 1px solid #82cfff !important;
}

.carbon-tag--teal {
  background-color: #9ef0f0 !important;
  color: #005d5d !important;
  border: 1px solid #3ddbd9 !important;
}

.carbon-tag--green {
  background-color: #a7f0ba !important;
  color: #0e6027 !important;
  border: 1px solid #6fdc8c !important;
}

.carbon-tag--magenta {
  background-color: #ffd6e8 !important;
  color: #9f1853 !important;
  border: 1px solid #ff7eb6 !important;
}

.carbon-tag--purple {
  background-color: #e8daff !important;
  color: #6929c4 !important;
  border: 1px solid #be95ff !important;
}

.carbon-tag--red {
  background-color: #ffd7d9 !important;
  color: #a2191f !important;
  border: 1px solid #ff8389 !important;
}

.carbon-tag--orange {
  background-color: #ffd8b4 !important;
  color: #8a3800 !important;
  border: 1px solid #ff832b !important;
}

.carbon-tag--warm-gray {
  background-color: #e7e6e5 !important;
  color: #565151 !important;
  border: 1px solid #cac8c8 !important;
}

.carbon-tag--cool-gray {
  background-color: #e0e0e0 !important;
  color: #4d5358 !important;
  border: 1px solid #c1c7cd !important;
}

/* Carbon Structured List Component Styles */
.carbon-structured-list {
  width: 100%;
  background-color: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 0;
  box-sizing: border-box;
}

.carbon-structured-list-header {
  background-color: #f4f4f4;
  border-bottom: 2px solid #e0e0e0;
  color: #525252;
  font-family: 'IBM Plex Sans', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.carbon-structured-list-row {
  border-bottom: 1px solid #e0e0e0;
  transition: background-color 0.15s cubic-bezier(0.2, 0, 0.38, 0.9);
}

.carbon-structured-list-row:hover {
  background-color: #f4f4f4;
}

.carbon-structured-list-row:last-child {
  border-bottom: none;
}

/* ========================================================= */
/* IBM Carbon Design System UI Shell SideNav Rail            */
/* https://carbondesignsystem.com/components/UI-shell-left-panel/usage/ */
/* ========================================================= */
.bx--side-nav {
  position: fixed !important;
  top: 48px !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 48px !important;
  background-color: #161616 !important;
  border-right: 1px solid #393939 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  z-index: 6000 !important;
  transition: width 150ms cubic-bezier(0.2, 0, 0.38, 0.9) !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: none !important;
}

.bx--side-nav:hover,
.bx--side-nav.bx--side-nav--expanded {
  width: 256px !important;
  box-shadow: 4px 0 16px rgba(0, 0, 0, 0.4) !important;
}

.bx--side-nav__items {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

.bx--side-nav__item {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.bx--side-nav__link {
  display: flex !important;
  align-items: center !important;
  height: 48px !important;
  width: 100% !important;
  padding: 0 14px !important;
  color: #f4f4f4 !important;
  text-decoration: none !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  border-left: 3px solid transparent !important;
  box-sizing: border-box !important;
  transition: background-color 110ms ease-in-out, color 110ms ease-in-out !important;
}

.bx--side-nav__link:hover {
  background-color: #353535 !important;
  color: #ffffff !important;
}

.bx--side-nav__item--active .bx--side-nav__link {
  background-color: #262626 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  border-left: 3px solid var(--cds-interactive-primary, #007d79) !important;
}

.bx--side-nav__icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  margin-right: 14px !important;
  fill: currentColor !important;
  color: inherit !important;
}

.bx--side-nav__link-text {
  color: #ffffff !important;
  opacity: 0 !important;
  transform: translateX(-8px) !important;
  transition: opacity 150ms ease, transform 150ms ease !important;
  letter-spacing: 0.16px !important;
}

.bx--side-nav:hover .bx--side-nav__link-text,
.bx--side-nav.bx--side-nav--expanded .bx--side-nav__link-text {
  opacity: 1 !important;
  color: #ffffff !important;
  transform: translateX(0) !important;
}

.bx--side-nav__divider {
  height: 1px !important;
  background-color: #393939 !important;
  margin: 8px 0 !important;
  width: 100% !important;
}

/* Offset page content for SideNav rail */
.carbon-page-container,
.carbon-breadcrumb-bar,
.bx--grid {
  margin-left: 48px !important;
  max-width: calc(100% - 48px) !important;
  box-sizing: border-box !important;
}

/* ========================================================= */
/* IBM Carbon Data Table Toolbar, Search, and Action Buttons */
/* ========================================================= */
.bx--table-toolbar {
  display: flex !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  background-color: #ffffff !important;
  border: 1px solid var(--carbon-border-subtle, #e0e0e0) !important;
  border-bottom: none !important;
  padding: 0 0 0 16px !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

.bx--table-toolbar__title {
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #161616 !important;
  align-self: center !important;
  margin: 0 !important;
  line-height: 1 !important;
}

.bx--table-toolbar__actions {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
}

/* Toolbar Action Buttons */
.carbon-table-toolbar-btn,
.bx--table-toolbar__actions > .bx--btn,
.bx--table-toolbar__actions .q-btn.carbon-table-toolbar-btn {
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  line-height: 48px !important;
  border-radius: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  padding: 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: stretch !important;
  font-size: 14px !important;
  background-color: var(--carbon-interactive-primary, #007d79) !important;
  color: #ffffff !important;
  border: 1px solid transparent !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  transition: background-color 0.15s !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}

.carbon-table-toolbar-btn:hover,
.bx--table-toolbar__actions > .bx--btn:hover,
.bx--table-toolbar__actions .q-btn.carbon-table-toolbar-btn:hover {
  background-color: var(--carbon-interactive-primary-hover, #005d5d) !important;
  color: #ffffff !important;
}

.carbon-table-toolbar-btn:active,
.bx--table-toolbar__actions > .bx--btn:active,
.bx--table-toolbar__actions .q-btn.carbon-table-toolbar-btn:active {
  background-color: var(--carbon-interactive-primary-active, #004144) !important;
}

.carbon-table-toolbar-btn:focus,
.bx--table-toolbar__actions > .bx--btn:focus,
.bx--table-toolbar__actions .q-btn.carbon-table-toolbar-btn:focus {
  outline: 2px solid var(--carbon-interactive-focus, #009d9a) !important;
  outline-offset: -2px !important;
}

.carbon-table-toolbar-btn .q-btn__content {
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  line-height: 48px !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Toolbar Search */
.carbon-table-toolbar-search {
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  line-height: 48px !important;
  display: inline-flex !important;
  align-items: center !important;
  align-self: stretch !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  background-color: var(--carbon-field-01, #f4f4f4) !important;
  border-left: 1px solid var(--carbon-border-subtle, #e0e0e0) !important;
  width: 220px !important;
  transition: width 0.15s cubic-bezier(0.2, 0, 0.38, 0.9) !important;
}

.carbon-table-toolbar-search:focus-within {
  width: 280px !important;
  background-color: #ffffff !important;
  outline: 2px solid var(--carbon-interactive-primary, #007d79) !important;
  outline-offset: -2px !important;
  border-bottom: none !important;
}

.carbon-table-toolbar-search .q-field__control:before,
.carbon-table-toolbar-search .q-field__control:after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  border: none !important;
}

.bx--table-toolbar .bx--table-search,
.carbon-table-toolbar-search .bx--table-search,
.carbon-table-toolbar-search .carbon-input,
.carbon-table-toolbar-search .q-field,
.carbon-table-toolbar-search .q-field__inner,
.carbon-table-toolbar-search .q-field__control-container,
.carbon-table-toolbar-search .q-field__control,
.carbon-table-toolbar-search .q-field--focused .q-field__control,
.carbon-table-toolbar-search .q-field--highlighted .q-field__control,
.carbon-table-toolbar-search .q-field--filled .q-field__control,
.carbon-table-toolbar-search .q-field--filled.q-field--focused .q-field__control,
.carbon-table-toolbar-search .q-field--filled.q-field--highlighted .q-field__control,
.carbon-table-toolbar-search.q-field--focused .q-field__control,
.carbon-table-toolbar-search.q-field--highlighted .q-field__control,
.carbon-table-toolbar-search.q-field--filled .q-field__control,
.carbon-table-toolbar-search.q-field--filled.q-field--focused .q-field__control {
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  line-height: 48px !important;
  border-radius: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  box-sizing: border-box !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-bottom: none !important;
  border-bottom-width: 0 !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
}

.carbon-table-toolbar-search .q-field__control {
  padding: 0 12px 0 36px !important;
}

.carbon-table-toolbar-search .bx--table-search__icon {
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 16px !important;
  height: 16px !important;
  pointer-events: none !important;
  fill: #525252 !important;
  z-index: 2 !important;
}

.carbon-table-toolbar-search .q-field__native {
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  line-height: 48px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  color: #161616 !important;
}

.carbon-table-toolbar-search .q-field__native::placeholder {
  color: #8d8d8d !important;
}

.carbon-table-container,
.carbon-table-container--no-scroll {
  border-top: none !important;
  margin-top: 0 !important;
}



.bx--pagination {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  height: 40px !important;
  background-color: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-top: none !important;
  padding: 0 16px !important;
  font-size: 0.75rem !important;
  color: #525252 !important;
  box-sizing: border-box !important;
  gap: 16px !important;
}

/* ========================================================= */
/* IBM Carbon In-Place Modal                                 */
/* ========================================================= */
.bx--modal-container {
  background-color: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 0 !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15) !important;
  padding: 0 !important;
  width: 480px !important;
  max-width: 90vw !important;
}

.bx--modal-header {
  padding: 16px 24px 8px 24px !important;
}

.bx--modal-header__label {
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: #525252 !important;
}

.bx--modal-header__heading {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: #161616 !important;
  margin-top: 4px !important;
}

.bx--modal-content {
  padding: 8px 24px 24px 24px !important;
  font-size: 0.875rem !important;
  color: #525252 !important;
  line-height: 1.4 !important;
}

.bx--modal-footer {
  display: flex !important;
  height: 64px !important;
  border-top: 1px solid #e0e0e0 !important;
}

.bx--modal-footer .bx--btn {
  flex: 1 !important;
  height: 100% !important;
  border-radius: 0 !important;
  justify-content: flex-start !important;
  padding: 0 24px !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
}

/* ========================================================= */
/* IBM Carbon Design System 2x Flex Grid Specification      */
/* Reference: https://carbon-elements.netlify.app/grid/examples/preview/ */
/* ========================================================= */

/* Grid Containers */
.cds--grid,
.bx--grid {
  width: calc(100% - 48px) !important;
  max-width: calc(100% - 48px) !important;
  margin-left: 48px !important;
  margin-right: 0 !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  box-sizing: border-box !important;
  display: block !important;
}

.cds--grid--full-width,
.bx--grid--full-width {
  width: calc(100% - 48px) !important;
  max-width: calc(100% - 48px) !important;
}

.cds--grid--narrow,
.bx--grid--narrow {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

.cds--grid--condensed,
.bx--grid--condensed {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Grid Rows */
.cds--row,
.bx--row {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-left: -1rem !important;
  margin-right: -1rem !important;
  box-sizing: border-box !important;
}

.cds--grid--narrow .cds--row,
.bx--grid--narrow .bx--row {
  margin-left: -0.5rem !important;
  margin-right: -0.5rem !important;
}

.cds--grid--condensed .cds--row,
.bx--grid--condensed .bx--row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.cds--row-padding,
.bx--row-padding {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

/* Columns Base */
.cds--col,
.bx--col,
[class*="cds--col-"],
[class*="bx--col-"] {
  position: relative !important;
  width: 100% !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  box-sizing: border-box !important;
  min-height: 1px !important;
}

.cds--grid--narrow .cds--col,
.bx--grid--narrow .bx--col,
.cds--grid--narrow [class*="cds--col-"],
.bx--grid--narrow [class*="bx--col-"] {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

.cds--grid--condensed .cds--col,
.bx--grid--condensed .bx--col,
.cds--grid--condensed [class*="cds--col-"],
.bx--grid--condensed [class*="bx--col-"] {
  padding-left: 0.5px !important;
  padding-right: 0.5px !important;
}

.cds--col-padding,
.bx--col-padding {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.cds--col,
.bx--col {
  flex-basis: 0 !important;
  flex-grow: 1 !important;
  max-width: 100% !important;
}

/* Breakpoint sm (0 to 671px) - 4 Columns */
.cds--col-sm-0, .bx--col-sm-0 { display: none !important; }
.cds--col-sm-1, .bx--col-sm-1 { flex: 0 0 25% !important; max-width: 25% !important; }
.cds--col-sm-2, .bx--col-sm-2 { flex: 0 0 50% !important; max-width: 50% !important; }
.cds--col-sm-3, .bx--col-sm-3 { flex: 0 0 75% !important; max-width: 75% !important; }
.cds--col-sm-4, .bx--col-sm-4 { flex: 0 0 100% !important; max-width: 100% !important; }

.cds--offset-sm-0, .bx--offset-sm-0 { margin-left: 0 !important; }
.cds--offset-sm-1, .bx--offset-sm-1 { margin-left: 25% !important; }
.cds--offset-sm-2, .bx--offset-sm-2 { margin-left: 50% !important; }
.cds--offset-sm-3, .bx--offset-sm-3 { margin-left: 75% !important; }

/* Breakpoint md (672px to 1055px) - 8 Columns */
@media (min-width: 42rem) {
  .cds--col-md-0, .bx--col-md-0 { display: none !important; }
  .cds--col-md-1, .bx--col-md-1 { flex: 0 0 12.5% !important; max-width: 12.5% !important; }
  .cds--col-md-2, .bx--col-md-2 { flex: 0 0 25% !important; max-width: 25% !important; }
  .cds--col-md-3, .bx--col-md-3 { flex: 0 0 37.5% !important; max-width: 37.5% !important; }
  .cds--col-md-4, .bx--col-md-4 { flex: 0 0 50% !important; max-width: 50% !important; }
  .cds--col-md-5, .bx--col-md-5 { flex: 0 0 62.5% !important; max-width: 62.5% !important; }
  .cds--col-md-6, .bx--col-md-6 { flex: 0 0 75% !important; max-width: 75% !important; }
  .cds--col-md-7, .bx--col-md-7 { flex: 0 0 87.5% !important; max-width: 87.5% !important; }
  .cds--col-md-8, .bx--col-md-8 { flex: 0 0 100% !important; max-width: 100% !important; }

  .cds--offset-md-0, .bx--offset-md-0 { margin-left: 0 !important; }
  .cds--offset-md-1, .bx--offset-md-1 { margin-left: 12.5% !important; }
  .cds--offset-md-2, .bx--offset-md-2 { margin-left: 25% !important; }
  .cds--offset-md-3, .bx--offset-md-3 { margin-left: 37.5% !important; }
  .cds--offset-md-4, .bx--offset-md-4 { margin-left: 50% !important; }
  .cds--offset-md-5, .bx--offset-md-5 { margin-left: 62.5% !important; }
  .cds--offset-md-6, .bx--offset-md-6 { margin-left: 75% !important; }
  .cds--offset-md-7, .bx--offset-md-7 { margin-left: 87.5% !important; }
}

/* Breakpoint lg (1056px+) - 16 Columns */
@media (min-width: 66rem) {
  .cds--col-lg-0, .bx--col-lg-0 { display: none !important; }
  .cds--col-lg-1, .bx--col-lg-1 { flex: 0 0 6.25% !important; max-width: 6.25% !important; }
  .cds--col-lg-2, .bx--col-lg-2 { flex: 0 0 12.5% !important; max-width: 12.5% !important; }
  .cds--col-lg-3, .bx--col-lg-3 { flex: 0 0 18.75% !important; max-width: 18.75% !important; }
  .cds--col-lg-4, .bx--col-lg-4 { flex: 0 0 25% !important; max-width: 25% !important; }
  .cds--col-lg-5, .bx--col-lg-5 { flex: 0 0 31.25% !important; max-width: 31.25% !important; }
  .cds--col-lg-6, .bx--col-lg-6 { flex: 0 0 37.5% !important; max-width: 37.5% !important; }
  .cds--col-lg-7, .bx--col-lg-7 { flex: 0 0 43.75% !important; max-width: 43.75% !important; }
  .cds--col-lg-8, .bx--col-lg-8 { flex: 0 0 50% !important; max-width: 50% !important; }
  .cds--col-lg-9, .bx--col-lg-9 { flex: 0 0 56.25% !important; max-width: 56.25% !important; }
  .cds--col-lg-10, .bx--col-lg-10 { flex: 0 0 62.5% !important; max-width: 62.5% !important; }
  .cds--col-lg-11, .bx--col-lg-11 { flex: 0 0 68.75% !important; max-width: 68.75% !important; }
  .cds--col-lg-12, .bx--col-lg-12 { flex: 0 0 75% !important; max-width: 75% !important; }
  .cds--col-lg-13, .bx--col-lg-13 { flex: 0 0 81.25% !important; max-width: 81.25% !important; }
  .cds--col-lg-14, .bx--col-lg-14 { flex: 0 0 87.5% !important; max-width: 87.5% !important; }
  .cds--col-lg-15, .bx--col-lg-15 { flex: 0 0 93.75% !important; max-width: 93.75% !important; }
  .cds--col-lg-16, .bx--col-lg-16 { flex: 0 0 100% !important; max-width: 100% !important; }

  .cds--offset-lg-0, .bx--offset-lg-0 { margin-left: 0 !important; }
  .cds--offset-lg-1, .bx--offset-lg-1 { margin-left: 6.25% !important; }
  .cds--offset-lg-2, .bx--offset-lg-2 { margin-left: 12.5% !important; }
  .cds--offset-lg-3, .bx--offset-lg-3 { margin-left: 18.75% !important; }
  .cds--offset-lg-4, .bx--offset-lg-4 { margin-left: 25% !important; }
  .cds--offset-lg-5, .bx--offset-lg-5 { margin-left: 31.25% !important; }
  .cds--offset-lg-6, .bx--offset-lg-6 { margin-left: 37.5% !important; }
  .cds--offset-lg-7, .bx--offset-lg-7 { margin-left: 43.75% !important; }
  .cds--offset-lg-8, .bx--offset-lg-8 { margin-left: 50% !important; }
  .cds--offset-lg-9, .bx--offset-lg-9 { margin-left: 56.25% !important; }
  .cds--offset-lg-10, .bx--offset-lg-10 { margin-left: 62.5% !important; }
  .cds--offset-lg-11, .bx--offset-lg-11 { margin-left: 68.75% !important; }
  .cds--offset-lg-12, .bx--offset-lg-12 { margin-left: 75% !important; }
  .cds--offset-lg-13, .bx--offset-lg-13 { margin-left: 81.25% !important; }
  .cds--offset-lg-14, .bx--offset-lg-14 { margin-left: 87.5% !important; }
  .cds--offset-lg-15, .bx--offset-lg-15 { margin-left: 93.75% !important; }
}

/* Also preserve CSS Grid compatibility if invoked directly */
.cds--css-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-column-gap: 1rem !important;
  grid-row-gap: 1.5rem !important;
}
@media (min-width: 42rem) {
  .cds--css-grid { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; }
}
@media (min-width: 66rem) {
  .cds--css-grid { grid-template-columns: repeat(16, minmax(0, 1fr)) !important; }
}

/* Breadcrumb Bar Offset */
.carbon-breadcrumb-bar {
  margin-left: 48px !important;
  max-width: calc(100% - 48px) !important;
  width: calc(100% - 48px) !important;
  box-sizing: border-box !important;
}

/* =====================================================================
   IBM Carbon 2x Spacing System Tokens & Utilities
   ===================================================================== */
:root {
  --cds-spacing-01: 2px;
  --cds-spacing-02: 4px;
  --cds-spacing-03: 8px;
  --cds-spacing-04: 12px;
  --cds-spacing-05: 16px;
  --cds-spacing-06: 24px;
  --cds-spacing-07: 32px;
  --cds-spacing-08: 40px;
  --cds-spacing-09: 48px;
  --cds-spacing-10: 64px;
  --cds-spacing-11: 80px;
  --cds-spacing-12: 96px;
  --cds-spacing-13: 160px;
}

/* Layout Stacks (Vertical rhythm between child blocks) */
.cds--layout-stack-03 { display: flex !important; flex-direction: column !important; gap: var(--cds-spacing-03) !important; }
.cds--layout-stack-04 { display: flex !important; flex-direction: column !important; gap: var(--cds-spacing-04) !important; }
.cds--layout-stack-05 { display: flex !important; flex-direction: column !important; gap: var(--cds-spacing-05) !important; }
.cds--layout-stack-06 { display: flex !important; flex-direction: column !important; gap: var(--cds-spacing-06) !important; }
.cds--layout-stack-07 { display: flex !important; flex-direction: column !important; gap: var(--cds-spacing-07) !important; }

/* Inline Layout Helpers */
.cds--layout-inline-03 { display: flex !important; align-items: center !important; gap: var(--cds-spacing-03) !important; }
.cds--layout-inline-04 { display: flex !important; align-items: center !important; gap: var(--cds-spacing-04) !important; }
.cds--layout-inline-05 { display: flex !important; align-items: center !important; gap: var(--cds-spacing-05) !important; }

/* Margin bottom helpers */
.cds--mb-02 { margin-bottom: var(--cds-spacing-02) !important; }
.cds--mb-03 { margin-bottom: var(--cds-spacing-03) !important; }
.cds--mb-04 { margin-bottom: var(--cds-spacing-04) !important; }
.cds--mb-05 { margin-bottom: var(--cds-spacing-05) !important; }
.cds--mb-06 { margin-bottom: var(--cds-spacing-06) !important; }
.cds--mb-07 { margin-bottom: var(--cds-spacing-07) !important; }
.cds--mb-09 { margin-bottom: var(--cds-spacing-09) !important; }

/* =====================================================================
   IBM Carbon Tag Component Styles (.cds--tag)
   Specification: https://carbondesignsystem.com/components/tag/usage/
   Height: 24px, 0px border-radius, font: 12px, padding: 0 8px
   ===================================================================== */
.cds--tag {
  display: inline-flex !important;
  align-items: center !important;
  height: 24px !important;
  max-height: 24px !important;
  padding: 0 var(--cds-spacing-03, 8px) !important;
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  line-height: 1rem !important;
  border-radius: 0 !important;
  border: 1px solid transparent !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
  letter-spacing: 0.32px !important;
}

.cds--tag--cool-gray { background-color: var(--cds-cool-gray-20, #dde1e6) !important; color: var(--cds-cool-gray-90, #21272a) !important; }
.cds--tag--teal { background-color: var(--cds-teal-20, #9ef0f0) !important; color: var(--cds-teal-90, #022b30) !important; }
.cds--tag--green { background-color: var(--cds-green-20, #a7f0ba) !important; color: var(--cds-green-90, #022d0d) !important; }
.cds--tag--cyan { background-color: var(--cds-cyan-20, #bae6ff) !important; color: var(--cds-cyan-90, #012749) !important; }
.cds--tag--purple { background-color: var(--cds-purple-20, #e8daff) !important; color: var(--cds-purple-90, #31135e) !important; }
.cds--tag--blue { background-color: var(--cds-blue-20, #d0e2ff) !important; color: var(--cds-blue-90, #001d6c) !important; }
.cds--tag--red { background-color: var(--cds-red-20, #ffd7d9) !important; color: var(--cds-red-90, #520408) !important; }
.cds--tag--yellow { background-color: var(--cds-yellow-20, #fddc69) !important; color: var(--cds-yellow-50, #b28600) !important; }

/* =====================================================================
   IBM Carbon Inline Notification (.cds--inline-notification)
   Specification: https://carbondesignsystem.com/components/notification/usage/
   3px left accent border, 16px internal padding, 0 border-radius
   ===================================================================== */
.cds--inline-notification {
  display: flex !important;
  align-items: flex-start !important;
  width: 100% !important;
  min-height: 48px !important;
  padding: var(--cds-spacing-05, 16px) !important;
  margin-bottom: var(--cds-spacing-05, 16px) !important;
  border-radius: 0 !important;
  border: 1px solid var(--cds-border-subtle, #e0e0e0) !important;
  border-left-width: 3px !important;
  box-sizing: border-box !important;
  background-color: #ffffff !important;
}

.cds--inline-notification--info {
  border-left-color: var(--cds-blue-60, #0f62fe) !important;
  background-color: var(--cds-blue-10, #edf5ff) !important;
}

.cds--inline-notification--success {
  border-left-color: var(--cds-green-60, #198038) !important;
  background-color: var(--cds-green-10, #defbe6) !important;
}

.cds--inline-notification--warning {
  border-left-color: var(--cds-yellow-40, #d2a106) !important;
  background-color: var(--cds-yellow-10, #fcf4d6) !important;
}

.cds--inline-notification--error {
  border-left-color: var(--cds-red-60, #da1e28) !important;
  background-color: var(--cds-red-10, #fff1f1) !important;
}

.cds--inline-notification__content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}

.cds--inline-notification__title {
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  line-height: 1.25rem !important;
  color: #121619 !important;
}

.cds--inline-notification__subtitle {
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  line-height: 1.25rem !important;
  color: #525252 !important;
  margin-top: 2px !important;
}

/* =====================================================================
   Carbon Button Sets (Combinations of 2 and 3 Buttons)
   ===================================================================== */
.cds--button-set,
.bx--button-set {
  display: flex !important;
  align-items: center !important;
  gap: var(--cds-spacing-05) !important;
  flex-wrap: wrap !important;
}

.cds--button-set--right {
  justify-content: flex-end !important;
}

.cds--button-set--left {
  justify-content: flex-start !important;
}

.cds--button-set--between {
  justify-content: space-between !important;
}

.cds--button-set--fluid {
  gap: 1px !important;
  background-color: var(--cds-border-subtle, #e0e0e0) !important;
}

.cds--button-set--fluid > .bx--btn,
.cds--button-set--fluid > .cds--btn {
  flex: 1 1 0 !important;
  margin: 0 !important;
}

/* Standard Form Actions (Left aligned under forms) */
.cds--form-actions {
  display: flex !important;
  align-items: center !important;
  gap: var(--cds-spacing-05) !important;
  margin-top: var(--cds-spacing-06) !important;
  padding-top: var(--cds-spacing-05) !important;
  border-top: 1px solid #e0e0e0 !important;
}

/* =====================================================================
   Carbon KPI Metric Card Styles
   ===================================================================== */
.cds--metric-card {
  display: flex !important;
  flex-direction: column !important;
  padding: var(--cds-spacing-05) !important;
  background-color: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 0 !important;
  min-height: 110px !important;
  position: relative !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.cds--metric-card--clickable {
  cursor: pointer !important;
}

.cds--metric-card--clickable:hover {
  border-color: var(--cds-interactive-primary, #007d79) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
}

.cds--metric-card__label {
  font-size: 0.75rem !important;
  line-height: 1rem !important;
  font-weight: 500 !important;
  color: #697077 !important;
  letter-spacing: 0.32px !important;
  text-transform: uppercase !important;
  margin-bottom: var(--cds-spacing-02) !important;
}

.cds--metric-card__value-container {
  display: flex !important;
  align-items: baseline !important;
  gap: var(--cds-spacing-03) !important;
}

.cds--metric-card__value {
  font-size: 2.25rem !important;
  line-height: 2.5rem !important;
  font-weight: 300 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  color: #121619 !important;
}

.cds--metric-card__subtext {
  font-size: 0.75rem !important;
  color: #697077 !important;
}

.cds--metric-card__badge {
  font-size: 0.6875rem !important;
  font-weight: 600 !important;
  padding: 2px 6px !important;
  border-radius: 2px !important;
  display: inline-flex !important;
  align-items: center !important;
}

.cds--metric-card__badge--ok {
  background-color: #defbe6 !important;
  color: #0e6027 !important;
}

.cds--metric-card__badge--warning {
  background-color: #fcf4d6 !important;
  color: #b28600 !important;
}

.cds--metric-card__badge--critical {
  background-color: #fff1f1 !important;
  color: #a2191f !important;
}

/* =====================================================================
   Carbon Charts Holder Styles (@carbon/charts spec)
   ===================================================================== */
.cds--chart-holder {
  background-color: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  padding: var(--cds-spacing-05) !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.cds--chart-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  margin-bottom: var(--cds-spacing-04) !important;
}

.cds--chart-title {
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #121619 !important;
  line-height: 1.375rem !important;
}

.cds--chart-subtitle {
  font-size: 0.75rem !important;
  color: #697077 !important;
  line-height: 1rem !important;
  margin-top: 2px !important;
}

/* =====================================================================
   New Modular Components & Modifiers (Zero Base Class Mutation)
   ===================================================================== */
.carbon-header .q-btn.carbon-header-btn,
.q-btn.carbon-header-btn {
  background-color: transparent !important;
  background: transparent !important;
}

.carbon-header .q-btn.carbon-header-btn--menu,
.q-btn.carbon-header-btn--menu,
.carbon-header .carbon-header-btn--menu,
.carbon-header-btn--menu {
  background-color: #161616 !important;
  background: #161616 !important;
  color: #ffffff !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  border-right: 1px solid #393939 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.carbon-header .q-btn.carbon-header-btn--menu:hover,
.q-btn.carbon-header-btn--menu:hover,
.carbon-header .carbon-header-btn--menu:hover,
.carbon-header-btn--menu:hover {
  background-color: #353535 !important;
  background: #353535 !important;
}

.carbon-table-cell-content,
.bx--data-table td .carbon-table-cell-content,
.bx--data-table td > .carbon-table-cell-content,
.bx--data-table td:not(.carbon-table-actions) .carbon-table-cell-content * {
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  line-height: 1.35 !important;
  max-width: 100% !important;
}

.bx--data-table td.carbon-text-monospace,
.bx--data-table td .carbon-text-monospace {
  word-break: break-all !important;
  overflow-wrap: anywhere !important;
}

.bx--data-table th:last-child,
.bx--data-table td.carbon-table-actions {
  min-width: 170px !important;
  white-space: nowrap !important;
}

.bx--data-table td.carbon-table-actions .carbon-table-cell-content {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: normal !important;
  flex-wrap: wrap !important;
}

.bx--data-table td.carbon-table-actions *,
.bx--data-table td.carbon-table-actions .bx--btn,
.bx--data-table td.carbon-table-actions .bx--btn * {
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

@media (max-width: 1366px) {
  .bx--data-table td.carbon-table-actions .carbon-table-cell-content,
  .bx--data-table td.carbon-table-actions .flex,
  .bx--data-table .carbon-table-actions-container {
    flex-direction: column !important;
    align-items: stretch !important;
    white-space: normal !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    width: 100% !important;
  }
  .bx--data-table td.carbon-table-actions .bx--btn {
    width: 100% !important;
    justify-content: flex-start !important;
    height: 32px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    white-space: nowrap !important;
  }
  .bx--data-table td.carbon-table-actions .bx--btn * {
    white-space: nowrap !important;
  }
}

.cds--tile.mb-0,
.bx--tile.mb-0,
.carbon-tile.mb-0,
.cds--metric-card.mb-0 {
  margin-bottom: 0 !important;
}

.cds--tile.border-b-0,
.bx--tile.border-b-0,
.carbon-tile.border-b-0,
.cds--metric-card.border-b-0 {
  border-bottom: none !important;
}

/* ========================================================= */
/* IBM Carbon Data Table Monolithic Card Surface              */
/* ========================================================= */
.carbon-table-card {
  background-color: #ffffff !important;
  border: 1px solid var(--carbon-border-subtle, #e0e0e0) !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

.carbon-table-card .bx--table-toolbar {
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: 1px solid var(--carbon-border-subtle, #e0e0e0) !important;
  background-color: #ffffff !important;
}

.carbon-table-card .bx--pagination {
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  border-top: 1px solid var(--carbon-border-subtle, #e0e0e0) !important;
  background-color: #ffffff !important;
}

.carbon-table-card .bx--data-table {
  background-color: #ffffff !important;
}

.carbon-table-card .bx--data-table thead th {
  background-color: #ffffff !important;
  border-bottom: 2px solid var(--carbon-border-subtle, #e0e0e0) !important;
  color: var(--carbon-text-primary, #161616) !important;
}

.carbon-table-card .bx--data-table tbody tr,
.carbon-table-card .bx--data-table tbody td {
  background-color: #ffffff !important;
  border-bottom: 1px solid var(--carbon-border-subtle, #e0e0e0) !important;
}

.carbon-table-card .bx--data-table tbody tr:hover td {
  background-color: #e5e5e5 !important;
}

.carbon-table--wrap .bx--data-table {
  table-layout: fixed !important;
  width: 100% !important;
}

.carbon-inline-input-btn {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  line-height: 40px !important;
  padding: 0 16px !important;
  margin-bottom: 0 !important;
}

.carbon-inline-input-btn--square {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding: 0 !important;
}

.carbon-button-pair {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
}

.carbon-button-pair .bx--btn {
  border-radius: 0 !important;
  margin: 0 !important;
}

.carbon-button-pair .bx--btn--secondary {
  border-right: none !important;
}

/* ========================================================= */
/* IBM Carbon Design System PageHeader Component             */
/* Reference: https://carbondesignsystem.com/patterns/page-header/ */
/* ========================================================= */
.cds--page-header {
  display: block !important;
  width: 100% !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-bottom: none !important;
  padding: 2.25rem 1.5rem !important;
  margin-bottom: 0.75rem !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 1 !important;
}

.cds--page-header__content {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
}

.cds--page-header__title {
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 1.75rem !important; /* productive-heading-05 */
  line-height: 1.25 !important;
  font-weight: 600 !important;
  color: var(--carbon-text-primary, #161616) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.cds--page-header__description {
  font-family: 'IBM Plex Sans', sans-serif !important;
  font-size: 0.875rem !important; /* body-long-01 */
  line-height: 1.43 !important;
  color: var(--carbon-text-secondary, #525252) !important;
  max-width: 800px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ========================================================= */
/* Attached Actions & Docked Buttons (Zero Margin Under Tiles)*/
/* ========================================================= */
.carbon-attached-actions,
.cds--tile.mb-0 + .carbon-attached-actions,
.bx--tile.mb-0 + .carbon-attached-actions,
.cds--tile.mb-0 + div.flex,
.bx--tile.mb-0 + div.flex {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: none !important;
}

.carbon-attached-actions .bx--btn,
.carbon-button-pair.carbon-attached-actions .bx--btn {
  margin-top: 0 !important;
  border-top: none !important;
}

.cds--btn-attached-bottom {
  margin-top: 0 !important;
  width: 100% !important;
  border-radius: 0 !important;
  height: 40px !important;
  min-height: 40px !important;
  border-top: none !important;
  box-shadow: none !important;
}