/* /assets/css/chronomoon_zone_visuals.css
   Shared visual badges for Chronomoon zone codes in live tables, history and reports. */

.cm-zone-badge,
.cm-zone-code,
.cmg-zone-code,
.cmr-zone-code{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:46px;
  border-radius:999px;
  padding:3px 8px;
  font-size:.72rem;
  line-height:1;
  font-weight:950;
  letter-spacing:.03em;
  text-transform:uppercase;
  background:var(--zone-color,#334155);
  color:var(--zone-text,#fff);
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 0 0 1px rgba(0,0,0,.15) inset;
  font-variant-numeric:normal;
  white-space:nowrap;
}

.cm-lap-row .cm-zone-code{
  justify-self:start;
  align-self:center;
}

.cmg-laps-table .cm-zone-badge,
.cmr-table .cm-zone-badge{
  min-width:58px;
}

@media(max-width:560px){
  body.chrono-multi-page .cm-zone-badge,
  body.chrono-multi-page .cm-zone-code{
    min-width:38px;
    padding:2px 5px;
    font-size:.72rem;
    border-radius:5px;
  }
}

@media print{
  .cm-zone-badge,
  .cm-zone-code,
  .cmg-zone-code,
  .cmr-zone-code{
    color:#111!important;
    background:#fff!important;
    border:1px solid #777!important;
    box-shadow:none!important;
  }
}