/* "Sand" theme chrome for non-CMS patient pages (the standalone prescription
   form, the booking flow): a white bar with the practice logo over a warm cream
   page, closed by a sand band. Accent runs through --c-accent so the
   per-practice override applies here too. */

:root {
  --c-accent: #8c7355;
  /* Same deep shade as theme.css, and clamped the same way: a pale accent set
     by the practice would otherwise put the practice name on the white bar at
     3.3 : 1. The threshold is the shipped accent's own lightness, so #8c7355
     passes through untouched. */
  --_accent-mix-deep: color-mix(in srgb, var(--c-accent) 68%, #1a1209);
  --c-accent-deep: var(--_accent-mix-deep);
}

@supports (color: oklch(from white l c h)) {
  :root {
    --c-accent-deep: oklch(from var(--_accent-mix-deep) min(l, 0.46) c h);
  }
}

body {
  background: #f9f5f0;
}

.theme-chrome--sand {
  background: #fff;
  border-bottom: 1px solid #e2dacb;
}

.theme-chrome--sand .theme-chrome__bar {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  max-width: 68rem;
  margin-inline: auto;
  padding: 0.5rem 1.25rem;
}

.theme-chrome__logo {
  height: 3rem;
  width: auto;
}

/* The practice name is the only link in the bar and the way back to the site,
   so it gets a finger-sized target rather than a bare 26 px line of text. */
.theme-chrome--sand .theme-chrome__name {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  color: var(--c-accent-deep);
  font-family: "Lora", Georgia, serif;
  font-weight: 700;
  font-size: 1.15rem;
  text-decoration: none;
}

.theme-chrome__footer {
  background: #e5decc;
  border-top: 1px solid #d9d0b9;
  margin-top: 3rem;
  padding: 1.25rem;
  text-align: center;
  font-size: 0.85rem;
  color: #5a5349;
}