/* ============================================================
   SEMANTIC ALIASES — La Clinique Des Femmes
   Role-based tokens that components reference. Change a brand
   value once in colors.css and the whole system follows.
   ============================================================ */
:root {
  /* ---- Brand ---- */
  --brand-primary: var(--marine-800);   /* deep navy — primary actions, logo ink */
  --brand-accent:  var(--azur-300);     /* powder blue — highlights, picto */
  --brand-accent-deep: var(--azur-500);

  /* ---- Text ---- */
  --text-strong:   var(--ink-900);
  --text-body:     var(--ink-700);
  --text-muted:    var(--ink-500);
  --text-subtle:   var(--ink-400);
  --text-on-brand: var(--white);
  --text-on-accent:var(--marine-800);
  --text-link:     var(--marine-700);

  /* ---- Surfaces ---- */
  --surface-page:    var(--ink-50);
  --surface-card:    var(--white);
  --surface-raised:  var(--white);
  --surface-sunken:  var(--ink-100);
  --surface-brand:   var(--marine-800);
  --surface-brand-soft: var(--marine-100);
  --surface-accent-soft: var(--azur-100);
  --surface-tint:    var(--azur-50);

  /* ---- Borders ---- */
  --border-default: var(--ink-200);
  --border-muted:   var(--ink-100);
  --border-strong-c:var(--ink-300);
  --border-brand:   var(--azur-300);

  /* ---- Interactive ---- */
  --action-primary-bg:   var(--marine-800);
  --action-primary-hover:var(--marine-900);
  --action-primary-text: var(--white);
  --action-accent-bg:    var(--azur-300);
  --action-accent-hover: var(--azur-400);
  --action-accent-text:  var(--marine-800);
  --focus-ring: var(--shadow-focus);

  /* ---- Feedback ---- */
  --success-fg: var(--green-600);
  --success-bg: var(--green-100);
  --warning-fg: var(--amber-600);
  --warning-bg: var(--amber-100);
  --danger-fg:  var(--red-600);
  --danger-bg:  var(--red-100);
  --info-fg:    var(--marine-700);
  --info-bg:    var(--marine-100);
}