/* ── Indicadores del hato («¿Cómo va mi finca?») ── */
.herd-card { display: flex; flex-direction: column; cursor: pointer; height: 100%; transition: box-shadow .15s ease, transform .15s ease; }
.herd-card:hover { box-shadow: var(--mud-elevation-6); }
.herd-card:focus-visible { outline: 3px solid var(--mud-palette-primary); outline-offset: 2px; }
.herd-card-hidden { opacity: .55; }
.herd-card-title { line-height: 1.25; min-height: 2.5em; }

.herd-card-value { display: flex; align-items: baseline; gap: .4rem; margin-top: .25rem; font-variant-numeric: tabular-nums; }
.herd-card-number { font-size: 2.6rem; font-weight: 700; line-height: 1.1; letter-spacing: -.02em; }
.herd-card-unit { font-size: 1.05rem; color: var(--mud-palette-text-secondary); }

.herd-gauge { position: relative; height: 14px; margin-top: .75rem; }
.herd-gauge-track { position: absolute; left: 0; right: 0; top: 6px; height: 2px; border-radius: 1px; background: var(--mud-palette-lines-inputs); }
.herd-gauge-goal { position: absolute; top: 0; width: 2px; height: 14px; margin-left: -1px; background: var(--mud-palette-text-primary); }
.herd-gauge-dot { position: absolute; top: 2px; width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; border: 2px solid var(--mud-palette-surface); box-shadow: 0 0 0 1px var(--mud-palette-text-primary); }

@media (prefers-reduced-motion: reduce) { .herd-card { transition: none; } }

/* Tendencia de 12 meses en el detalle de un indicador */
.herd-trend { position: relative; display: flex; align-items: flex-end; gap: 6px; height: 120px; border-bottom: 1px solid var(--mud-palette-lines-default); }
.herd-trend-col { flex: 1; min-width: 0; height: 100%; display: flex; align-items: flex-end; justify-content: center; }
.herd-trend-bar { width: 100%; max-width: 28px; border-radius: 3px 3px 0 0; background: var(--mud-palette-primary); opacity: .55; }
.herd-trend-bar-closed { opacity: 1; }
.herd-trend-empty { width: 100%; max-width: 28px; height: 0; border-bottom: 2px dashed var(--mud-palette-lines-inputs); }
.herd-trend-goal { position: absolute; left: 0; right: 0; height: 0; border-top: 2px dashed var(--mud-palette-text-primary); pointer-events: none; }
.herd-trend-labels { display: flex; gap: 6px; margin-top: 4px; margin-bottom: 4px; }
.herd-trend-label { flex: 1; min-width: 0; text-align: center; font-size: .7rem; color: var(--mud-palette-text-secondary); white-space: nowrap; }
@media (max-width: 600px) { .herd-trend-label { font-size: .6rem; } .herd-trend-label:nth-child(even) { visibility: hidden; } }

/* Botón «Analizar» de la tarjeta: discreto, abajo a la derecha; no compite con el número. */
.herd-card-ai-row { margin-top: auto; padding-top: .75rem; display: flex; justify-content: flex-end; }
.herd-card-ai { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .75rem; border-radius: 999px; cursor: pointer; font: inherit; font-size: .8125rem; font-weight: 600;
    color: var(--mud-palette-primary); background: color-mix(in srgb, var(--mud-palette-primary) 10%, transparent); border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 35%, transparent);
    transition: background-color .15s ease; }
.herd-card-ai:hover:not(:disabled) { background: color-mix(in srgb, var(--mud-palette-primary) 20%, transparent); }
.herd-card-ai:focus-visible { outline: 3px solid var(--mud-palette-primary); outline-offset: 2px; }
.herd-card-ai:disabled { cursor: not-allowed; color: var(--mud-palette-text-disabled); background: transparent; border-color: var(--mud-palette-lines-inputs); }
@media (prefers-reduced-motion: reduce) { .herd-card-ai { transition: none; } }

/* Cajón de análisis (se abre desde la derecha y no saca al usuario del panel) */
.herd-analysis-headline { font-size: 1.15rem; font-weight: 600; line-height: 1.35; }
.herd-analysis-section { margin-top: 1.25rem; }
.herd-analysis-section-title { font-size: .8125rem; font-weight: 600; color: var(--mud-palette-text-secondary); margin-bottom: .4rem; }
.herd-analysis-action { display: flex; align-items: center; gap: .75rem; padding: .75rem; border: 1px solid var(--mud-palette-lines-default); border-radius: 8px; margin-bottom: .5rem; }
.herd-analysis-action-text { flex: 1; min-width: 0; }
.herd-analysis-stale { border-left: 4px solid var(--mud-palette-warning); }

/* Asistente de configuración con IA */
.setup-ai-type { border-radius: 8px; }
.setup-ai-type-on { border-color: var(--mud-palette-primary); }
.setup-ai-item { padding: .1rem 0; }
.setup-ai-item-off { opacity: .6; }
