/**
 * Base layer Rubis — règles globales partagées (body styles, focus rings,
 * sélection, utilities transverses comme `eyebrow`).
 *
 * À importer APRÈS `tokens.css` et `tailwindcss`. L'app consommatrice est
 * libre de surcharger.
 *
 * NOTE : les @fontsource imports JS sont gérés côté app consommatrice
 * (apps/web → import direct depuis main.tsx, apps/landing → idem). Ce
 * fichier suppose que les polices sont déjà chargées.
 */
@layer base {
  html {
    -webkit-text-size-adjust: 100%;
    text-rendering: optimizeLegibility;
  }

  body {
    background: var(--color-cream);
    color: var(--color-ink);
    font-family: var(--font-sans);
    font-feature-settings: "ss01", "cv11";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.55;
  }

  ::selection {
    background: var(--color-rubis);
    color: white;
  }

  fieldset {
    border: 0;
    padding: 0;
    margin: 0;
  }

  button:not(:disabled),
  [role="button"]:not([aria-disabled="true"]),
  summary,
  label[for],
  a[href],
  select:not(:disabled),
  [type="checkbox"]:not(:disabled),
  [type="radio"]:not(:disabled),
  [type="submit"]:not(:disabled),
  [type="button"]:not(:disabled),
  [type="reset"]:not(:disabled) {
    cursor: pointer;
  }

  button:disabled,
  [role="button"][aria-disabled="true"] {
    cursor: not-allowed;
  }

  .tabular-nums {
    font-variant-numeric: tabular-nums;
  }

  em {
    font-style: italic;
    color: var(--color-rubis);
  }
}

@utility eyebrow {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--color-rubis);
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  line-height: 1.4;
}

@utility eyebrow-mark {
  width: 7px;
  height: 7px;
  background: currentColor;
  display: inline-block;
  transform: rotate(45deg);
}

@utility shadow-rubis {
  box-shadow: var(--shadow-rubis);
}

@utility shadow-rubis-hover {
  box-shadow: var(--shadow-rubis-hover);
}

@utility shadow-card {
  box-shadow: var(--shadow-card);
}

@utility shadow-soft {
  box-shadow: var(--shadow-soft);
}
