/* Badge VISEC (Figma "VISEC"). Markup: VisecHelper::badge (PHP) y componente visec_badge (js/visec_badge.js). */
.visec_badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    font-family: Lato, sans-serif;
    font-size: 12px;
    font-style: italic;
    font-weight: 700;
    line-height: 16px;
    white-space: nowrap;
    vertical-align: middle;
}

.visec_badge__punto {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 6px;
    border-radius: 50%;
    background-color: currentColor;
    vertical-align: middle;
}

.visec_badge--apto {
    background-color: #CAE2BD;
    border-color: #CAE2BD;
    color: #234412;
}

.visec_badge--parcial {
    background-color: #E7E0B4;
    border-color: #E7E0B4;
    color: #4B4106;
}

.visec_badge--no_apto {
    background-color: #F8CECE;
    border-color: #F8CECE;
    color: #A44546;
}

/* Vista del Lote (invernada y faena): debajo de peso y raza, en la fila del #id. Badge más grande
   que el del listado (Figma: alto 32, borde 1px del color del relleno, gap 8; el ancho es el del contenido).
   El color del borde lo da el modificador de estado (--apto, --parcial, --no_apto). */
.visec_titulo {
    margin-top: 6px;
}

.visec_titulo .visec_badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-sizing: border-box;
    height: 32px;
    padding: 4px 8px;
    border-width: 1px;
    border-style: solid;
    border-radius: 6px;
    font-size: 16px;
    line-height: 24px;
}

.visec_titulo .visec_badge__punto {
    margin: 0;
}

/* Tarjetas de lotes relacionados de la Vista del Lote. */
.visec_relacionado {
    margin-top: 4px;
}