/* open_status — «● Open · until 19:00»: the dot in the state's colour, a hairline, the rest. */

/* ---------- Open now (the open_status component) ----------
   One line, the same on the contact page, in the header's bar, the mobile
   menu and the footer. */
.open-status { display: flex; align-items: center; gap: .55rem; margin: 0; font-size: .95rem; color: var(--body-text); }

.open-status strong { color: var(--ink); font-weight: 600; }

.open-status__dot { width: .6rem; height: .6rem; margin-right: 2px; border-radius: 999px; background: var(--muted); flex: none; }

/* the state | the rest: a hairline in the text's colour */
.open-status__sep { display: inline-block; flex: none; width: 1px; height: .85em; margin-inline: .1em; background: currentColor; opacity: .4; vertical-align: -.08em; }

@supports (text-box: trim-both cap alphabetic) {
  .open-status > strong, .open-status__rest { text-box: trim-both cap alphabetic; }
}

.open-status.is-open .open-status__dot { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }

.open-status.is-soon .open-status__dot { background: var(--warning); box-shadow: 0 0 0 4px var(--warning-soft); }

.open-status.is-reply svg { width: 1.1rem; height: 1.1rem; color: var(--muted); flex: none; }
