/* All In One Nonprofit design tokens.
 * ==========================================================================
 * THE DEFINITION. tools/aio-design-check.mjs enforces these values, and its
 * TOKEN_COLORS / TOKEN_FONT_SIZES / SYSTEM_BTN sets must stay in step with
 * this file. If you change a value here, change it there in the same commit.
 *
 * Created 2026-08-14. It had been referenced by the design standard and listed
 * in the integrity guard's shared assets for weeks while existing nowhere, so
 * the guard reported success on a file that was not there. That is fixed; this
 * is the file.
 *
 * Scope, decided 2026-08-14: the platform is NOT being converted wholesale.
 * The conformance number is frozen at today's level in CI so it can only fall,
 * and an app is converted when someone is already editing it for another
 * reason. No project, no deadline, no half-converted middle state to get stuck
 * in again. See docs/AIO-Design-Standard.docx for the rules.
 */

:root {
  /* Color, by role rather than by hue. Four functional roles, plus surfaces. */
  --aio-brand:          #1b3a5c;  /* headings, sidebars, the navy            */
  --aio-action:         #2563eb;  /* links and primary buttons               */
  --aio-action-deep:    #1e40af;  /* hover and pressed                       */
  --aio-action-tint:    #eff6ff;  /* selected rows, action backgrounds       */
  --aio-positive:       #15803d;  /* success, completion                     */
  --aio-positive-tint:  #d1fae5;
  --aio-attention:      #dc2626;  /* errors, destructive actions             */
  --aio-attention-tint: #fde8e6;
  --aio-gold:           #d4a017;  /* the accent, used sparingly              */
  --aio-gold-tint:      #fff4d6;

  /* Surfaces and text. */
  --aio-surface:        #ffffff;  /* cards                                   */
  --aio-page:           #f1f5f9;  /* page background                         */
  --aio-border:         #e2e8f0;
  --aio-ink:            #1e293b;  /* body text                               */
  --aio-muted:          #64748b;  /* secondary text                          */

  /* ------------------------------------------------------------------------
   * Added 2026-08-15, Steve's call. The original fifteen could not express
   * what the apps actually say. A survey of the three heaviest found 207
   * off-system colors, and most were not drift: they were amber cautions,
   * purple feature marks, and gray steps between --aio-ink and --aio-muted
   * that simply had no token. Forcing those onto the old palette would have
   * flattened four distinct meanings into one.
   *
   * Every value below is one ALREADY in wide use in the product, chosen as
   * the most-used member of its group. That is deliberate: it means adopting
   * these tokens changes no pixel, it only gives an existing color a name.
   * ---------------------------------------------------------------------- */

  /* Caution. Distinct from attention: something to look at, not something
     broken. Deadlines approaching, partial completion, "review this".        */
  --aio-warning:        #b45309;
  --aio-warning-tint:   #fef3c7;

  /* Feature and learning marks. The purple in the courses and glossaries,
     used where something is new or optional rather than required.            */
  --aio-highlight:      #7c3aed;
  --aio-highlight-tint: #ede9fe;

  /* Deep variants, for hover, pressed, and text on a tinted background where
     the base tone does not carry enough contrast.                            */
  --aio-brand-deep:     #152e56;
  --aio-positive-deep:  #166534;
  --aio-attention-deep: #991b1b;

  /* A soft action fill, for selected chips and callouts that must not read as
     a button.                                                                */
  --aio-action-soft:    #bfdbfe;

  /* Three more neutral steps. This was the real gap: --aio-ink to --aio-muted
     was a cliff, so apps invented their own middles. #6b7280 alone appears
     161 times.                                                               */
  --aio-ink-soft:       #475569;  /* secondary body text                     */
  --aio-muted-soft:     #94a3b8;  /* tertiary, placeholders, disabled        */
  --aio-border-strong:  #cbd5e1;  /* input borders, dividers that must show  */
  --aio-page-soft:      #f8fafc;  /* a surface one step off the page         */

  /* Type. Five sizes. The first three are also the heading sizes. */
  --aio-size-h1:        1.5rem;
  --aio-size-h2:        1.15rem;
  --aio-size-h3:        1rem;
  --aio-size-body:      .93rem;
  --aio-size-small:     .82rem;
  --aio-size-fine:      .75rem;
}

/* Buttons. The six classes the checker recognizes as system buttons:
 * btn, btn-primary, btn-outline, btn-ghost, btn-danger, btn-sm.
 * Declared here so an app can adopt them without inventing its own. */
.btn {
  font-size: var(--aio-size-body);
  border-radius: 8px;
  padding: .55rem 1rem;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}
.btn-primary { background: var(--aio-action); color: var(--aio-surface); }
.btn-primary:hover { background: var(--aio-action-deep); }
.btn-outline { background: var(--aio-surface); color: var(--aio-action); border-color: var(--aio-border); }
.btn-ghost   { background: transparent; color: var(--aio-action); }
.btn-danger  { background: var(--aio-attention); color: var(--aio-surface); }
.btn-sm      { font-size: var(--aio-size-small); padding: .35rem .7rem; }