/* ============================================
   Company Settings — Holt-Winters (M4b) section
   --------------------------------------------
   Styles for the consolidated HW fieldset on the Forecast Settings tab:
   the nested "Seasonal Architecture (A4′)" subsection, its super-admin
   badge, and the read-only rendering non-super-admins see instead of
   editable inputs. Loaded globally by `stylesheet_link_tag :app` (Propshaft
   globs this directory) — never add a per-view link tag.

   REUSED beyond HW: the .hw-subsection__header / __title, .hw-badge-super, and
   .hw-readonly-* classes are the shared "super-admin forecast lever" vocabulary
   and are also used by the Days-on-Hand forecast-walk fieldset
   (spec/PLAN_days_on_hand_forecast_walk.md sec 10.2). Do not rename/remove them
   without updating company_settings/edit.html.erb's Days on Hand block too.
   ============================================ */

/* Nested sub-block inside a .form-fieldset. The left rule visually subordinates
   it to the parent fieldset without opening a second bordered box. */
.hw-subsection {
  margin: 20px 0 4px;
  padding: 12px 0 4px 16px;
  border-left: 2px solid var(--border);
}

.hw-subsection__header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 6px;
}

.hw-subsection__title {
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}

/* "Super admin" ownership pill — signals the field is not tenant-editable. */
.hw-badge-super {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 10px;
  color: var(--purple);
  background: var(--purple-tint);
  white-space: nowrap;
}

/* Intro / rationale copy for the subsection. */
.hw-subsection__note {
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted);
  margin: 0 0 12px;
  max-width: 68ch;
}

/* Read-only rendering (non-super-admin): same information, no input. */
.hw-readonly-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hw-readonly-row {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid var(--border-light);
}

.hw-readonly-row:last-child {
  border-bottom: 0;
}

.hw-readonly-row__label {
  font-size: 13px;
  color: var(--ink);
  min-width: 260px;
  flex: 1 1 260px;
}

.hw-readonly-row__value {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink);
  background: var(--surface-alt);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 2px 8px;
  white-space: nowrap;
}

/* Muted variant for a value that is off/inactive/default. */
.hw-readonly-row__value--muted {
  color: var(--muted);
}

.hw-readonly-row__hint {
  flex: 1 1 100%;
  font-size: 11px;
  line-height: 1.5;
  color: var(--light);
  margin: 0;
}

/* Indent for a checkbox that only applies when its parent toggle is on
   (replaces an inline margin-left — see CLAUDE.md "NO INLINE STYLES"). */
.hw-dependent-field {
  margin-left: 1.5rem;
}

/* Effective-state summary strip shown when the architecture is engaged. */
.hw-effective {
  margin-top: 12px;
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  background: var(--surface-alt);
  border: 1px solid var(--border);
  font-size: 12px;
  color: var(--muted);
  max-width: 68ch;
}

.hw-effective strong {
  color: var(--ink);
}

.hw-effective--inactive {
  color: var(--light);
}

/* ============================================
   Company Settings — Weighted Window per-source smoothing table
   (spec/PLAN_ww_per_source_smoothing_config.md). Three rows (sku_self /
   product_aggregate / category_aggregate) × K + Blend inputs + a notes column.
   ============================================ */
.ww-smoothing-table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 4px;
  font-size: 12px;
}

.ww-smoothing-table th,
.ww-smoothing-table td {
  text-align: left;
  padding: 6px 12px 6px 0;
  vertical-align: middle;
  border-bottom: 1px solid var(--border-light);
}

.ww-smoothing-table thead th {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
}

.ww-smoothing-table tbody th {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.ww-smoothing-table__hint {
  font-size: 11px;
  line-height: 1.4;
  color: var(--light);
  max-width: 34ch;
}

/* K + Blend inputs: the shared .form-control--narrow only CAPS width (max-width
   120px) — inside a squeezed table cell the 100%-width .form-control shrinks
   below its content and "1.00" truncates. Fix scoped HERE (never widen the
   shared class): a fixed input width + a column min-width so the value renders
   fully with normal padding. */
.ww-smoothing-table td input.form-control {
  width: 96px;
  min-width: 96px;
}

.ww-smoothing-table th:nth-child(2),
.ww-smoothing-table td:nth-child(2),
.ww-smoothing-table th:nth-child(3),
.ww-smoothing-table td:nth-child(3) {
  min-width: 112px;
}

/* Column-header tooltip affordance (the title attribute carries the copy — the
   footer note keeps the full formula; the tooltip adds column-level
   discoverability). Dotted underline + help cursor signal hoverability. */
.ww-smoothing-table__th-help {
  cursor: help;
  text-decoration: underline dotted;
  text-underline-offset: 3px;
}

/* Company Settings layout: +240px breathing room for the settings content/menu
   (shared .container is 1500px; fc265749 gave the super-admin App Settings page
   the same treatment). Scoped to the body class the company-settings edit view
   sets — the global .container width is untouched everywhere else. */
body.company-settings-wide > main.container {
  max-width: 1740px;
}

/* The VISIBLE width cap on the company-settings page is application.css's
   global `.form { max-width: 640px; }` — the container rule above alone only
   adds empty gutter (2026-09-04 founder screenshot). Widen the settings form
   itself by the same +240px, scoped to this page only. */
body.company-settings-wide .form {
  max-width: 880px;
}
