/* Digital colors sampled from the supplied AIKI Terrasa brandbook swatches. */
:root {
  --orange: #e1562a;
  --green: #32481b;
  --blue: #01396d;
  --natural: #ece8e4;
  --ink: #232323;

  --orange-rgb: 225, 86, 42;
  --blue-rgb: 1, 57, 109;
  --natural-rgb: 236, 232, 228;
  --ink-rgb: 35, 35, 35;
  --paper: var(--natural);
  --white: var(--natural);
  --wine: var(--green);
  --wine-dark: #263615;
  --lime: var(--orange);

  /* Functional shades retain the brand hues and readable small text. */
  --orange-dark: #a84728;
  --on-orange: #171717;
  --text-muted: #615e5b;
  --line: rgba(var(--ink-rgb), .25);
  --focus-color: var(--blue);

  /* Shared form and component tokens for the community and privacy pages. */
  --background: var(--natural);
  --foreground: var(--ink);
  --primary: var(--blue);
  --primary-foreground: var(--natural);
  --muted: var(--natural);
  --muted-foreground: var(--text-muted);
  --border: rgba(var(--ink-rgb), .3);
  --ring: var(--blue);
  --destructive: var(--orange-dark);
  --color-black: var(--ink);
  --color-white: var(--natural);
}

body { color: var(--ink); background: var(--paper); }
.hero { background: var(--blue); }
.taste-section { color: var(--ink); background: var(--natural); --focus-color: var(--ink); }

/* Orange surfaces need dark text, with no low-opacity small captions. */
.quick-facts, .booking-modal__intro, .taste-photo span,
.sunsets-section, .occasion-card--orange, .community-upload-section {
  color: var(--on-orange);
  --focus-color: var(--ink);
}
.quick-facts span:not(.link-arrow), .sunset-steps li span,
.dish .dish__group, .dish__composition, .menu-downloads p, .mobile-actions small {
  opacity: 1;
}
.taste-lineage span:first-child, .taste-lineage:hover,
.dish__nutrition, .dish__allergens, .booking-modal__intro > p:last-child {
  color: var(--on-orange);
}
.booking-modal__intro h2, .sunsets-title h2, .community-form__intro h2 { color: var(--natural); }
.quick-facts > *, .sunset-steps, .sunset-steps li, .occasion-tags span {
  border-color: rgba(var(--ink-rgb), .4);
}
.community-preview__item { color: var(--natural); }
.sunset-clock { background: linear-gradient(160deg, var(--green), var(--blue) 58%, var(--ink)); }
.menu-filter { color: var(--on-orange); }
.menu-filter:hover, .menu-filter.is-active { color: var(--natural); background: var(--ink); }

.nav-book, .button--solid, .button--booking, .skip-link, .mobile-actions__book {
  color: var(--on-orange);
  background: var(--orange);
  border-color: var(--orange);
}
.nav-book:hover, .button--solid:hover, .button--booking:hover {
  color: var(--natural);
  background: var(--blue);
  border-color: var(--blue);
}
.button--light:hover, .button--agenda:hover, .button--dark:hover { color: var(--on-orange); }
.booking-field input::placeholder, .booking-form__note { color: var(--text-muted); }
.booking-form__status.is-success { color: var(--green); }
.booking-form__status.is-error { color: var(--orange-dark); }
.contacts-grid > div > span { color: rgba(var(--natural-rgb), .78); }
.site-footer { color: rgba(var(--natural-rgb), .78); }

.hero, .site-header, .art-section, .quote-section, .place-section, .events-section,
.contacts-section, .site-footer, .agenda-ribbon, .agenda-modal,
.event-request-modal__intro, .community-header, .community-hero, .community-empty, .community-footer, .privacy-header {
  --focus-color: var(--natural);
}
.site-header.is-scrolled, body.menu-open .site-header { --focus-color: var(--blue); }
button:focus-visible, a:focus-visible { outline-color: var(--focus-color); }
.dish:focus-visible { outline-color: var(--ink); }

/* These pages also contain archived component CSS with literal color values. */
.community-page, .privacy-page { color: var(--ink); background: var(--paper); }
.community-header, .community-hero, .community-footer, .privacy-header { color: var(--natural); }
.community-hero { background: var(--blue); }
.community-hero__veil {
  background: linear-gradient(90deg, rgba(var(--ink-rgb), .7), rgba(var(--ink-rgb), .12) 70%),
    linear-gradient(rgba(var(--ink-rgb), .28), rgba(var(--ink-rgb), .64));
}
.community-section-head .community-kicker, .privacy-document > .community-kicker { color: var(--green); }
.community-photo { background: var(--paper); }
.community-photo figcaption {
  color: var(--natural);
  background: linear-gradient(transparent, rgba(var(--ink-rgb), .88));
}
.community-empty { color: var(--natural); background: var(--blue); }
.community-upload-section { background: var(--orange); }
.community-input, .community-file-input {
  color: var(--ink);
  background: var(--natural);
  border-color: var(--ink);
}
.community-input::placeholder { color: var(--text-muted); }
.community-input:focus-visible { --tw-ring-color: rgba(var(--blue-rgb), .25); border-color: var(--blue); }
.community-file-input::file-selector-button, .community-submit {
  color: var(--natural);
  background: var(--blue);
  border-color: var(--blue);
}
.community-file-input::file-selector-button:hover, .community-submit:hover { background: var(--green); border-color: var(--green); }
.community-checkbox { border-color: var(--ink); }
.community-checkbox[data-state="checked"] { color: var(--natural); background: var(--green); border-color: var(--green); }
.community-form__status--error { color: var(--orange-dark); background: var(--natural); }
.community-footer, .privacy-header { background: var(--ink); }
.community-footer p a { border-color: rgba(var(--natural-rgb), .65); }
.privacy-document section { border-color: rgba(var(--ink-rgb), .3); }
.privacy-updated { color: var(--text-muted); }

@media (max-width: 1200px) {
  .site-nav > a, .site-nav .nav-book { color: var(--on-orange); }
  .site-nav a:hover, .site-nav .nav-book:hover { color: var(--natural); background: var(--blue); }
  body.menu-open .site-header { color: var(--ink); }
}
@media (max-width: 980px) {
  .booking-modal__close { color: var(--on-orange); }
  .event-request-modal__close { color: var(--natural); }
}
@media (min-width: 721px) {
  .menu-more { color: var(--natural); background: var(--blue); border-color: var(--blue); }
  .menu-more:hover { color: var(--natural); background: var(--green); border-color: var(--ink); }
}
