/* Matrícula española (templates/_matricula.html.twig): el elemento que identifica cada coche en todas las pantallas. */
.matricula {
    --alto: 2.6rem;
    display: inline-flex;
    align-items: stretch;
    height: var(--alto);
    border: 2px solid var(--placa-tinta);
    border-radius: 6px;
    background: var(--placa-fondo);
    color: var(--placa-tinta);
    overflow: hidden;
    box-shadow: inset 0 0 0 1px oklch(100% 0 0 / 60%), 0 1px 0 oklch(25% 0.02 35 / 18%);
    flex: none;
    vertical-align: middle;
}
.matricula .banda {
    width: calc(var(--alto) * .42);
    background: var(--placa-banda);
    color: var(--placa-estrella);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    padding: .15em 0;
}
.matricula .banda svg { width: 72%; height: auto; }
.matricula .banda span { color: oklch(99% 0 0); font: 700 calc(var(--alto) * .3)/1 var(--rotulo); }
.matricula .caracteres {
    display: flex;
    align-items: center;
    padding: 0 .45em 0 .35em;
    font: 600 calc(var(--alto) * .78)/1 var(--rotulo);
    letter-spacing: .04em;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.matricula.grande { --alto: 3.6rem; border-width: 3px; }
.matricula.pequena { --alto: 2rem; border-width: 1.5px; border-radius: 4px; }
.matricula.vacia {
    align-items: center;
    padding: 0 .8rem;
    border-style: dashed;
    border-color: var(--borde);
    color: var(--tenue);
    font: 600 1.1rem/1 var(--rotulo);
    box-shadow: none;
}