/*=============================================================================
  IRIS MIS PLATFORM — APACHE SUPERSET CUSTOM DASHBOARD THEME
  Brand: Iris MIS Platform | Direct PT/DX
  Palette:
    - Iris Navy:    #03244B (Primary brand color, headers, text, cards)
    - Signal Blue:  #205A98 (Primary accent, action buttons, active tabs)
    - Sky:          #468FC6 (Secondary accent, subtle highlights, borders)
    - Direct Green: #5D8039 (Signature highlight, positive rates, savings)
    - Canvas Gray:  #F8FAFC (Modern background workspace canvas)
    - Card White:   #FFFFFF (Container card background)
    - Border Muted: #E2E8F0 (Clean hairline rules)
=============================================================================*/

:root,
.dashboard,
.dashboard-content,
.grid-container {
  --iris-navy: #03244B;
  --iris-signal-blue: #205A98;
  --iris-sky: #468FC6;
  --iris-direct-green: #5D8039;
  --iris-bg-canvas: #F8FAFC;
  --iris-card-bg: #FFFFFF;
  --iris-border: #E2E8F0;
  --iris-text-main: #03244B;
  --iris-text-muted: #64748B;
  --iris-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* 1. Global Dashboard Canvas */
.dashboard,
div[data-test="dashboard-content-wrapper"],
.grid-container {
  background-color: #F8FAFC !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  color: #03244B !important;
}

.dashboard-content {
  background-color: #F8FAFC !important;
  padding: 16px 24px !important;
}

/* 2. Top Header & Title Bar */
.dashboard-header {
  background-color: #FFFFFF !important;
  border-bottom: 1px solid #E2E8F0 !important;
  padding: 12px 24px !important;
  box-shadow: 0 1px 3px rgba(3, 36, 75, 0.05) !important;
}

.dashboard-header .dashboard-title {
  color: #03244B !important;
  font-weight: 700 !important;
  font-size: 22px !important;
  letter-spacing: -0.3px !important;
}

/* 3. Dashboard Navigation Tabs */
.dashboard-component-tabs .ant-tabs-nav {
  background-color: #FFFFFF !important;
  border-radius: 8px 8px 0 0 !important;
  border-bottom: 2px solid #E2E8F0 !important;
  padding: 0 16px !important;
}

.dashboard-component-tabs .ant-tabs-tab {
  color: #64748B !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 12px 16px !important;
  transition: all 0.2s ease !important;
}

.dashboard-component-tabs .ant-tabs-tab:hover {
  color: #205A98 !important;
}

.dashboard-component-tabs .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
  color: #03244B !important;
  font-weight: 700 !important;
}

.dashboard-component-tabs .ant-tabs-ink-bar {
  background: #205A98 !important;
  height: 3px !important;
  border-radius: 3px 3px 0 0 !important;
}

/* 4. Chart & Component Container Cards */
.dashboard-component-chart-holder,
.dragdroppable-column .dashboard-chart-id,
.grid-container .dashboard-component-chart-holder {
  background-color: #FFFFFF !important;
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 6px rgba(3, 36, 75, 0.04) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease !important;
  overflow: hidden !important;
}

.dashboard-component-chart-holder:hover {
  border-color: #468FC6 !important;
  box-shadow: 0 4px 14px rgba(3, 36, 75, 0.08) !important;
}

/* 5. Chart Card Header & Title */
.header-title,
.chart-header .header-title {
  color: #03244B !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: -0.2px !important;
  padding: 12px 16px 8px 16px !important;
}

.header-controls {
  padding-right: 12px !important;
}

/* 6. Big Number / KPI Scorecard Tiles */
.header-line,
.header-line span,
.header-line text,
.superset-legacy-chart-big-number .header-line,
.superset-legacy-chart-big-number-total .header-line,
[data-test-viz-type="big_number"] .header-line,
[data-test-viz-type="big_number_total"] .header-line,
div[class*="big-number"] .header-line,
div[class*="BigNumber"] .header-line,
.superset-legacy-chart-big-number .metric-value,
.superset-legacy-chart-big-number-total .metric-value,
.big-number .metric-value {
  color: #03244B !important;
  fill: #03244B !important;
  font-weight: 800 !important;
  letter-spacing: -1px !important;
}

.subheader-line,
.subheader-line span,
.subheader-line text,
.superset-legacy-chart-big-number .subheader-line,
.superset-legacy-chart-big-number-total .subheader-line,
[data-test-viz-type="big_number"] .subheader-line,
[data-test-viz-type="big_number_total"] .subheader-line,
div[class*="big-number"] .subheader-line,
div[class*="BigNumber"] .subheader-line,
.superset-legacy-chart-big-number .metric-header,
.superset-legacy-chart-big-number-total .metric-header {
  color: #64748B !important;
  fill: #64748B !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* Big Number Trendline / Sparkline */
.superset-legacy-chart-big-number svg path,
[data-test-viz-type="big_number"] svg path {
  stroke: #205A98 !important;
}

/* Highlight accent card borders for key executive metrics */
.kpi-tile-accent-blue {
  border-top: 4px solid #205A98 !important;
}

.kpi-tile-accent-green {
  border-top: 4px solid #5D8039 !important;
}

/* 7. Filter Bar Styling (Left Sidebar) */
.filter-bar-container {
  background-color: #FFFFFF !important;
  border-right: 1px solid #E2E8F0 !important;
  box-shadow: 1px 0 4px rgba(3, 36, 75, 0.03) !important;
}

.filter-bar-container .filter-bar-heading {
  background-color: #03244B !important;
  color: #FFFFFF !important;
  padding: 14px 16px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: 0.3px !important;
}

.filter-bar-container .filter-control-factory {
  padding: 12px 16px !important;
}

.filter-bar-container .ant-select-selector {
  border-radius: 6px !important;
  border: 1px solid #E2E8F0 !important;
}

.filter-bar-container .ant-select-focused .ant-select-selector {
  border-color: #205A98 !important;
  box-shadow: 0 0 0 2px rgba(32, 90, 152, 0.15) !important;
}

.filter-bar-container .filter-apply-button,
.filter-bar-container button.ant-btn-primary {
  background-color: #205A98 !important;
  border-color: #205A98 !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}

.filter-bar-container button.ant-btn-primary:hover {
  background-color: #17487c !important;
  border-color: #17487c !important;
}

/* 8. Table Visualizations */
.table-condensed th {
  background-color: #03244B !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
  padding: 10px 12px !important;
  border: none !important;
}

.table-condensed td {
  padding: 8px 12px !important;
  font-size: 13px !important;
  color: #03244B !important;
  border-top: 1px solid #E2E8F0 !important;
}

.table-condensed tbody tr:hover td {
  background-color: #F1F5F9 !important;
}

.table-condensed .pagination > li > a {
  color: #205A98 !important;
  border-radius: 4px !important;
}

.table-condensed .pagination > .active > a {
  background-color: #205A98 !important;
  border-color: #205A98 !important;
  color: #FFFFFF !important;
}

/* 9. Header Banner Component (for Markdown Tile) */
.iris-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 14px 24px !important;
  background-color: #FFFFFF !important;
  background: #FFFFFF !important;
  border-radius: 8px !important;
  border: 1px solid #E2E8F0 !important;
  box-shadow: 0 2px 8px rgba(3, 36, 75, 0.04) !important;
  margin-bottom: 16px !important;
}

.iris-banner-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.iris-banner-title {
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #03244B !important;
  letter-spacing: -0.5px !important;
  line-height: 1 !important;
}

.iris-banner-rule {
  border-left: 1.5px solid #CBD5E1 !important;
  padding-left: 10px !important;
  line-height: 1.15 !important;
}

.iris-banner-mis {
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #03244B !important;
  letter-spacing: 0.6px !important;
}

.iris-banner-direct {
  display: block !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #5D8039 !important;
}

.iris-banner-right {
  text-align: right !important;
}

.iris-banner-heading {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #03244B !important;
  display: block !important;
}

.iris-banner-subheading {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #64748B !important;
}

/* 10. Print & PDF Export Rules */
*, *::before, *::after {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
  color-adjust: exact !important;
}

/* Prevent SVG/NVD3 bar charts from being clipped to a blank box when
   dom-to-image-more serializes the dashboard into data:image/svg+xml */
svg [clip-path],
.nvd3-svg [clip-path],
.nv-wrap [clip-path],
g[clip-path] {
  clip-path: none !important;
}

@media print {
  /* Force full-color rendering and background canvas */
  body, .dashboard, #app, .dashboard-content {
    background-color: #F8FAFC !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Keep chart cards crisp with white background and hairline borders */
  .dashboard-component-chart-holder {
    background-color: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    margin-bottom: 16px !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Table styling preservation */
  table, tr, td, th {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .table-condensed th {
    background-color: #03244B !important;
    color: #FFFFFF !important;
  }

  /* Ensure banner prints with full colors and logo */
  .iris-banner, table[style*="table-layout: fixed"] {
    background-color: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    page-break-inside: avoid !important;
  }

  /* Hide Superset top navigation bar and control buttons during print */
  header, nav, .filter-dashboard {
    display: none !important;
  }
}