/* base.css — element-level defaults extracted from the former inline <style>.
   M62: rules kept in their original relative source order.
   M79: re-tokenised onto the Airtable cluster (body→system-ui sans, labels
   sentence-case, inputs hairline-bordered, tables hairline grammar). The
   1rem input floor (M65) is preserved via var(--fs-100). */

@layer base {

  body {
    background:var(--canvas); color:var(--body);
    font-family:var(--font-airtable-text);
    font-size:var(--fs-875);
    min-height:100svh;
  }

  label {
    font-size:var(--fs-875); color:var(--ink);
    font-weight:500;
  }

  input {
    background:var(--field-surface); border:1px solid var(--field-border);
    border-radius:var(--at-radius-sm); color:var(--ink);
    /* M65: 1rem floor prevents iOS zoom-on-focus; padding-block → ≥44px touch height */
    padding-block:.75rem; padding-inline:.85rem;
    font-size:var(--fs-100); font-family:inherit;
    transition:border-color .2s;
  }

  textarea {
    background:var(--field-surface); border:1px solid var(--field-border);
    border-radius:var(--at-radius-sm); color:var(--ink);
    padding-block:.75rem; padding-inline:.85rem;
    font-size:var(--fs-100); font-family:inherit;
    transition:border-color .2s;
  }

  select {
    background:var(--field-surface); border:1px solid var(--field-border);
    border-radius:var(--at-radius-sm); color:var(--ink);
    padding-block:.75rem; padding-inline:.85rem;
    font-size:var(--fs-100); font-family:inherit;
    cursor:pointer; transition:border-color .2s;
    appearance:none; -webkit-appearance:none;
    /* %23333840 is var(--body) URL-encoded — var() can't be used inside url() */
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23333840' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 10px center;
    padding-inline-end:2rem;
  }
  select:disabled { opacity:.4; cursor:not-allowed; }

  input:disabled, textarea:disabled { background:var(--surface-soft); color:var(--muted); cursor:not-allowed; }

  ::placeholder { color:var(--placeholder); opacity:1; }

  fieldset { border:0; padding:0; margin:0; min-inline-size:0; }
  legend {
    padding:0; float:none; display:block;
    font-size:var(--fs-875); font-weight:500; color:var(--ink);
    margin-block-end:var(--space-2xs);
  }

  .form-hint { font-size:var(--fs-875); color:var(--muted); }
  .form-error { font-size:var(--fs-875); color:var(--color-delete); }
  input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color:var(--color-delete-border); }

  table { width:100%; border-collapse:collapse; font-size:var(--fs-875); }
  th {
    background:var(--canvas); color:var(--body);
    padding:8px 10px; text-align:left;
    font-weight:500; font-size:var(--fs-875);
    border-bottom:1px solid var(--hairline);
  }
  td { padding:var(--space-sm) var(--space-md); border-bottom:1px solid var(--hairline); vertical-align:middle; }
  tr:hover td { background:var(--surface-soft); }

}