/* module-finance-classic.css — the CWG Finance classic ERP skin.
 *
 * Ben, 2026-10-13: "change the finance app in the CWG portal to a classic
 * design, all in the style of SAP etc. no kanban boards." This sheet is the
 * classic treatment: dense document registers, a dark screen-title bar,
 * micro uppercase field labels, tabular figures and the SAP-style status
 * bar, all inside the CWG Groundwork palette. Every rule is scoped under
 * .fin-surface (the Finance section's own scope class), so no other module
 * changes. Additive only: it tightens primitives the central design system
 * already defines and introduces no new colour literals — everything
 * resolves from the cwg-groundwork / portal-core tokens. Loaded after
 * components.css (whose airy .fin-surface rules it tightens) and before
 * red-plate.css, the same placement rule as every other module skin.
 *
 * Selector note: every scope selector repeats the class
 * (`.fin-surface.fin-surface`). The versioned CWG Groundwork language sheet
 * (cwg-groundwork/1.2.1/dist/portal.css) loads AFTER this module and binds
 * the same primitives at `html[data-ds-language="cwg-groundwork"] .x`
 * specificity; the repeated class puts these rules one class ahead of those
 * bindings so the classic treatment holds on the Finance surface without
 * touching the published language package.
 */

.fin-surface.fin-surface {
  font-family: var(--font-ui);
  font-size: 12px;
}

/* Screen title bar: the classic dark ERP title strip. */
.fin-surface.fin-surface .property-heading,
.fin-surface.fin-surface .module-workbench-header,
.fin-surface.fin-surface .ds-table-header {
  background: var(--cwg-earth);
  color: var(--cwg-sand);
  border-bottom: 1px solid var(--cwg-earth);
  min-height: 28px;
  padding: 3px 10px;
  gap: 10px;
}
.fin-surface.fin-surface .property-heading .property-title,
.fin-surface.fin-surface .module-title-block .module-title,
.fin-surface.fin-surface .ds-table-header .ds-table-title,
.fin-surface.fin-surface .module-workbench .module-title {
  font-family: var(--font-ui);
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--cwg-sand);
  margin: 0;
}
.fin-surface.fin-surface .module-workbench-header .eyebrow,
.fin-surface.fin-surface .property-heading .eyebrow {
  font-size: 9px;
  letter-spacing: 0.12em;
  color: var(--cwg-ochre);
}
.fin-surface.fin-surface .module-title-block { max-width: none; }
.fin-surface.fin-surface .ds-table-header .ds-tag {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  color: var(--cwg-sand);
  border-color: var(--cwg-terracotta);
  background: var(--cwg-terracotta);
}

/* Dense document register: SAP-style ruled grid, micro caps heads. */
.fin-surface.fin-surface .property-register-table,
.fin-surface.fin-surface .ds-table {
  font-family: var(--font-ui);
  font-size: 12px;
  border: 1px solid var(--cwg-line);
  border-collapse: collapse;
}
.fin-surface.fin-surface .property-register-table th,
.fin-surface.fin-surface .ds-table th {
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--cwg-earth);
  background: var(--cwg-sand);
  border: 1px solid var(--cwg-line);
  padding: 3px 8px;
  white-space: nowrap;
}
.fin-surface.fin-surface .property-register-table td,
.fin-surface.fin-surface .ds-table td {
  padding: 2px 8px;
  border: 1px solid var(--cwg-line);
  vertical-align: middle;
}
.fin-surface.fin-surface .property-register-table tbody tr,
.fin-surface.fin-surface .ds-table tbody tr { background: var(--cwg-surface); }
.fin-surface.fin-surface .property-register-table tbody tr:nth-child(even),
.fin-surface.fin-surface .ds-table-banded tbody tr:nth-child(even) {
  background: color-mix(in srgb, var(--cwg-sand) 55%, var(--cwg-surface));
}
.fin-surface.fin-surface .property-register-table tbody tr:hover,
.fin-surface.fin-surface .ds-table tbody tr:hover {
  background: color-mix(in srgb, var(--cwg-ochre) 30%, var(--cwg-surface));
}
.fin-surface.fin-surface .ds-mono-num,
.fin-surface.fin-surface .ds-mono {
  font-size: 11.5px;
  font-variant-numeric: tabular-nums;
}

/* Compact controls and micro labels. */
.fin-surface.fin-surface .gsp-input,
.fin-surface.fin-surface .gsp-select,
.fin-surface.fin-surface .ds-input,
.fin-surface.fin-surface .ds-select,
.fin-surface.fin-surface input,
.fin-surface.fin-surface select {
  height: 26px;
  font-family: var(--font-ui);
  font-size: 12px;
  padding: 2px 6px;
  border-radius: var(--cwg-control-radius);
}
.fin-surface.fin-surface .gsp-btn,
.fin-surface.fin-surface .ds-button {
  height: 26px;
  font-family: var(--font-ui);
  font-size: 11.5px;
  font-weight: 600;
  padding: 0 10px;
  border-radius: var(--cwg-control-radius);
}
.fin-surface.fin-surface .gsp-record-field-l,
.fin-surface.fin-surface .gsp-toolbar-label,
.fin-surface.fin-surface .ds-label,
.fin-surface.fin-surface .ds-review-label {
  font-family: var(--font-ui);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-mute);
}

/* Toolbars and filter rows stay on the classic SAP gold band. */
.fin-surface.fin-surface .gsp-toolbar { padding: 2px 4px; gap: 3px; }
.fin-surface.fin-surface .ds-filterbar {
  margin: 6px 0 8px;
  padding-bottom: 6px;
  gap: 8px;
}

/* Record editor: dense two-column field grid. */
.fin-surface.fin-surface .property-editor-fields { gap: 6px 12px; }
.fin-surface.fin-surface .property-editor-field { gap: 2px; }
.fin-surface.fin-surface .property-editor { font-size: 12px; }

/* Status bar: the classic footer count strip. */
.fin-surface.fin-surface .gsp-statusbar {
  padding: 2px 6px;
  font-family: var(--font-mono);
  font-size: 10.5px;
}

/* Tighter page rhythm inside the Finance section. */
.fin-surface.fin-surface.page-inner,
.fin-surface.fin-surface .page-inner,
.fin-surface.fin-surface.module-workbench,
.fin-surface.fin-surface .module-workbench { padding: 8px 12px 14px; }
.fin-surface.fin-surface .ds-table-section {
  margin: 0;
  padding: 2px 8px 10px;
}
.fin-surface.fin-surface .ds-table-scroll { border: 1px solid var(--cwg-line); }

@media (max-width: 720px) {
  .fin-surface.fin-surface .property-register-table td,
.fin-surface.fin-surface .ds-table td { padding: 3px 6px; }
}
