/* Public theme roles. Another brand can override these without assuming black
   text on every accent: commercial blue can use a separate white foreground. */
:root{
  --surface-page:#F7F7F5;
  --surface-card:#FFFFFF;
  --surface-subtle:#F7F7F5;
  --surface-dark:#0A0A0A;
  --surface-dark-raised:#1B1B1B;
  --text-primary:#0A0A0A;
  --text-secondary:#515151;
  --text-on-dark:#F7F7F5;
  --text-muted-on-dark:#C9C9C6;
  --border-default:#D2D2CC;
  --border-strong:#171717;
  --border-on-dark:#70706B;
  /* Brand gold family, defined once. Gold is the main accent and darkens to
     the hover shade on hover and press. Cream is the soft tint; heading markers use the same gold as actions,
     and dark gold draws readable icons on cream. */
  --brand-accent:#DDB24C;
  --brand-accent-rgb:221,178,76;
  --brand-accent-hover:#C99E3C;
  --brand-cream:#FBF3DC;
  --brand-highlight:var(--brand-accent);
  --brand-accent-dark:#9A7420;
  /* Cream and gold accents are shared across services and their comparison. */
  --service-deep-bg:#FBF3DC;
  --service-deep-ink:#7A591B;
  --service-deep-accent:#DDB24C;
  --text-on-accent:#0A0A0A;
  --icon-tile-bg:var(--brand-accent);
  --icon-tile-ink:var(--text-on-accent);
  /* Unselected service cards: a cream tile with a dark gold icon. */
  --icon-tile-soft-bg:var(--brand-cream);
  --icon-tile-soft-ink:var(--brand-accent-dark);
  --link-color:#171717;
  --link-on-dark:var(--brand-accent);
  --action-bg:var(--brand-accent);
  --action-text:var(--text-on-accent);
  --action-hover:var(--brand-accent-hover);
  --focus-ring:#171717;
  --focus-on-dark:var(--brand-accent);
  /* Selected booking cards: a cream fill with a 2px gold edge (the 1px
     border plus a 1px inset ring, so the box never changes size) and a
     near-black check circle with a gold tick. */
  --card-selected-bg:var(--brand-cream);
  --card-selected-border:var(--brand-accent);
  --card-check-bg:var(--text-primary);
  --card-check-ink:var(--brand-accent);
  --selected-bg:var(--card-selected-bg);
  --selected-border:var(--card-selected-border);
  --selected-indicator:#171717;
  --selected-indicator-text:#FFFFFF;
  --hover-bg:#F0F0ED;
  --disabled-bg:#E4E4E0;
  --disabled-text:#666660;
  --error-text:#9E3028;
  --error-border:#B34338;
  --success-text:#28613A;
  --contact-bg:var(--brand-cream);
  --contact-text:var(--text-primary);
  --contact-border:var(--brand-accent);
  --contact-hover:#F3E0A6;
  /* Compatibility aliases: keep existing templates bound to semantic roles. */
  --paper:var(--surface-page);
  --cream:var(--surface-subtle);
  --surface:var(--surface-card);
  --ink:var(--text-primary);
  --slate:var(--text-secondary);
  --line:var(--border-default);
  --sel:var(--selected-bg);
  --gold:var(--brand-accent);
  --gold-on-light:var(--link-color);
  --gold-deep:var(--link-color);
  --gold-rgb:var(--brand-accent-rgb);
  --gold-tint:var(--surface-subtle);
  --gold-soft:var(--surface-subtle);
  --choice-bg:var(--selected-bg);
  --choice-border:var(--selected-border);
  --choice-chip-bg:var(--selected-bg);
  --choice-check:var(--selected-indicator);
}
