/* digotech/clock: open/closed status line, or the business clock beside the visitor's clock. */
.dg-clock--status{display:inline-flex;align-items:flex-start;gap:var(--s-2);margin:0;font-size:var(--t-s);font-weight:500;color:var(--ink-2)}
.dg-clock__dot{flex:none;margin-top:calc((1lh - var(--s-2)) / 2);width:var(--s-2);height:var(--s-2);border-radius:50%;background:var(--ink-3);box-shadow:0 0 0 3px color-mix(in srgb, var(--ink-3) 22%, transparent)}
.dg-clock.is-open .dg-clock__dot{background:var(--good);box-shadow:0 0 0 3px color-mix(in srgb, var(--good) 22%, transparent)}
.dg-clock--clocks{display:grid;grid-template-columns:repeat(auto-fit,minmax(calc(var(--s-9) + var(--s-6)),1fr));gap:var(--s-3)} /* one box when the visitor is already on business time */
.dg-clock__box{display:grid;gap:var(--s-1);min-width:0;padding:var(--s-3);border:1px solid var(--rule);border-radius:var(--r-pill);background:var(--paper-2)}
.dg-clock__box > small{color:var(--ink-2);font:500 var(--t-2xs)/1.3 var(--font-mono);text-transform:uppercase;letter-spacing:.12em}
.dg-clock__time{font:700 var(--t-xl)/1 var(--font-display);font-variant-numeric:tabular-nums;color:var(--ink)}
.dg-clock__box > i{font-style:normal;font-size:var(--t-xs);color:var(--ink-2)}
.dg-clock__box[hidden]{display:none}