/*
 * Graphite Note Variation B - borderless operational surfaces pass 30
 *
 * Product-wide visual-only pass. Main content surfaces use white cards with
 * restrained elevation instead of visible 1px outlines. Inputs, buttons,
 * tables, menus, popups and other controls keep their own boundaries.
 */

:root {
  --gn30-page: #f6f8fb;
  --gn30-surface: #ffffff;
  --gn30-shadow: 0 1px 2px rgba(15, 23, 42, .035), 0 8px 24px rgba(15, 23, 42, .045);
  --gn30-shadow-compact: 0 1px 2px rgba(15, 23, 42, .028), 0 5px 16px rgba(15, 23, 42, .038);
  --gn30-shadow-hover: 0 2px 4px rgba(15, 23, 42, .045), 0 12px 30px rgba(15, 23, 42, .065);
  --gn30-radius: 12px;
}

/* Slightly stronger page/surface contrast lets cards separate without outlines. */
.gn-app-shell .gn-app-main,
.gn-app-shell .gn-app-content,
.gn-app-shell .gn-page-content,
.gn-app-shell .gn-app-container {
  background-color: var(--gn30-page) !important;
}

/* Primary operational surfaces across Settings, Scenarios, Results, APIs,
   notebooks, reports and assistant screens. */
.gn-app-shell :where(
  .gn-section-card,
  .gn-card,
  .gn-panel,
  .card,
  .modelScenario.wrapper,
  .accountsPage.wrapper,
  .gn-chart-card,
  .gn-predict-panel,
  .gn-api-panel,
  .custom_dx_tile_summary,
  .q-notebook-wrapper,
  .notebook-wrapper,
  .notebook-container,
  .gn-assistant-page,
  .gn-context-object-card,
  .gn-regression-fit-card,
  .gn-regression-training-card,
  .gn-regression-hyperparams-card,
  .gn-ai-report-card,
  .gn-report-card,
  .gn-result-card,
  .gn-analytics-card,
  .gn-accuracy-panel,
  .gn-accuracy-metrics,
  .gn-decision-summary,
  .gn-model-business-card,
  .gn-kpi-card
) {
  background: var(--gn30-surface) !important;
  border-color: transparent !important;
  border-style: solid !important;
  border-width: 0 !important;
  border-radius: var(--gn30-radius) !important;
  box-shadow: var(--gn30-shadow) !important;
}

/* Compact metric/tile surfaces get gentler elevation so dense result pages
   do not become a wall of floating cards. */
.gn-app-shell :where(
  .gn-kpi-card,
  .custom_dx_tile_summary,
  .gn-model-business-card,
  .gn-context-object-card
) {
  box-shadow: var(--gn30-shadow-compact) !important;
}

/* Nested content should read as hierarchy, not as stacked floating cards. */
.gn-app-shell :where(
  .gn-section-card,
  .gn-card,
  .gn-panel,
  .card,
  .modelScenario.wrapper,
  .accountsPage.wrapper,
  .gn-chart-card,
  .gn-predict-panel,
  .gn-api-panel,
  .gn-report-card,
  .gn-result-card,
  .gn-analytics-card,
  .gn-decision-summary
) :where(
  .gn-card,
  .card,
  .gn-panel,
  .gn-result-card,
  .gn-report-card,
  .gn-analytics-card
) {
  box-shadow: none !important;
  border-width: 0 !important;
}

/* Interactive structural cards may lift slightly, but should not re-grow a
   border from earlier interaction passes. Picker tiles are intentionally not
   included because their outline communicates selection/control affordance. */
.gn-app-shell :where(.card, .gn-card, .gn-section-card)[role="button"]:hover,
.gn-app-shell :where(.card, .gn-card, .gn-section-card).clickable:hover,
.gn-app-shell :where(.card, .gn-card, .gn-section-card)[ng-click]:hover {
  border-color: transparent !important;
  box-shadow: var(--gn30-shadow-hover) !important;
}

/* Preserve meaningful semantic accents. These are status encodings, not
   container outlines. */
.gn-app-shell .gn-accuracy-panel--correct {
  border-top: 3px solid #2ab58a !important;
}

.gn-app-shell .gn-accuracy-panel--incorrect {
  border-top: 3px solid #df6570 !important;
}

/* The dark decision-summary footer is an inset information region and should
   stay flat inside the elevated white parent. */
.gn-app-shell .gn-decision-summary__footer {
  box-shadow: none !important;
}

/* Keep controls and data structures crisp. The pass intentionally does not
   remove borders from form editors, buttons, tables, dropdowns, popovers,
   modals, alerts, tabs or picker/selection cards. */