/* ═══════════════════════════════════════════════════════════════════════════
   SNIPPETS PREMIUM — piloto Ovários (classe-escopo .snp-premium)
   Para propagar aos demais órgãos: remover o prefixo .snp-premium
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Chip row — coluna com respiro calibrado ─────────────────────────── */
.usg-chip-row--premium {
  display: flex;
  flex-direction: column;
  gap: var(--snp-item-gap);
  padding: 4px var(--space-2) var(--snp-group-sep);
}

/* ── 2. Divider premium com linha divisória (exceto o primeiro) ─────────── */
.snp-divider--premium {
  position: relative;
  padding: var(--snp-group-sep) var(--space-2) 4px;
  margin-top: 0;
  color: rgba(0, 229, 255, 0.45);
  font-size: var(--fs-10);
  font-weight: var(--fw-bold);
  letter-spacing: var(--tracking-caps-wide);
  text-transform: uppercase;
  border-top: none;
}
.snp-divider--premium::before {
  content: '';
  position: absolute;
  top: 0;
  left: var(--space-2);
  right: var(--space-2);
  height: 1px;
  background: var(--border-subtle);
}
.snp-cat-body > .snp-divider--premium:first-child { padding-top: 6px; }
.snp-cat-body > .snp-divider--premium:first-child::before { display: none; }

/* ── 3. Botão base premium ──────────────────────────────────────────────── */
.snp-premium .snp-item {
  height: auto;
  padding: var(--snp-item-pad-y) var(--snp-item-pad-x);
  border-radius: var(--snp-item-radius);
  font-family: var(--font-ui);
  font-size: var(--fs-11);
  line-height: 1.45;
  overflow: visible;
  margin-bottom: 0;
  width: 100%;
  transition: background var(--t-fast), border-color var(--t-fast),
              color var(--t-fast), transform var(--t-fast), box-shadow var(--t-fast);
}
.snp-premium .snp-item:hover {
  background: rgba(0, 212, 255, 0.09);
  border-color: rgba(0, 212, 255, 0.38);
  color: #cffafe;
  transform: translateY(-0.5px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28);
}
.snp-premium .snp-item:active { transform: translateY(0.5px); }
.snp-premium .snp-item:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
}

/* ── 4. Gravidade — 3 níveis ────────────────────────────────────────────── */
/* NÍVEL 1 — Normal (discreto) */
.snp-premium .snp-grav-normal {
  color: var(--text-secondary);
  border-color: var(--border-subtle);
  opacity: 0.82;
}
.snp-premium .snp-grav-normal:hover { opacity: 1; }

/* NÍVEL 2 — Comum (neutro padrão) — usa estilos base */
.snp-premium .snp-grav-comum { /* inherits */ }

/* NÍVEL 3 — Patológico (micro-indicador lateral) */
.snp-premium .snp-grav-patologico {
  border-color: var(--border-strong);
  position: relative;
  padding-left: calc(var(--snp-item-pad-x) + var(--snp-grav-bar-w) + 6px);
}
.snp-premium .snp-grav-patologico::before {
  content: '';
  position: absolute;
  left: var(--snp-item-pad-x);
  top: 5px;
  bottom: 5px;
  width: var(--snp-grav-bar-w);
  border-radius: 1px;
  background: var(--accent);
  opacity: 0.75;
}

/* ── 5. Lateral group — botão unificado D/E ─────────────────────────────── */
.snp-item-lateral {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  background: #161b27;
  border: 1px solid var(--border-default);
  border-radius: var(--snp-item-radius);
  padding: var(--snp-item-pad-y) var(--snp-item-pad-x);
  transition: background var(--t-fast), border-color var(--t-fast);
  width: 100%;
  box-sizing: border-box;
}
.snp-item-lateral:hover {
  background: rgba(0, 212, 255, 0.06);
  border-color: rgba(0, 212, 255, 0.28);
}
/* Herda gravidade no container lateral */
.snp-item-lateral.snp-grav-patologico {
  border-color: var(--border-strong);
  padding-left: calc(var(--snp-item-pad-x) + var(--snp-grav-bar-w) + 6px);
}
.snp-item-lateral.snp-grav-patologico::before {
  content: '';
  position: absolute;
  left: var(--snp-item-pad-x);
  top: 5px;
  bottom: 5px;
  width: var(--snp-grav-bar-w);
  border-radius: 1px;
  background: var(--accent);
  opacity: 0.75;
}
.snp-item-lateral.snp-grav-normal {
  border-color: var(--border-subtle);
  opacity: 0.82;
}
.snp-item-lateral.snp-grav-normal:hover { opacity: 1; }

.snp-lat-label {
  flex: 1;
  font-family: var(--font-ui);
  font-size: var(--fs-11);
  font-weight: var(--fw-medium);
  color: var(--text-primary);
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}
.snp-lat-toggle {
  display: flex;
  gap: 3px;
  flex-shrink: 0;
}
.snp-lat-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--snp-lat-btn-h);
  padding: var(--snp-lat-btn-pad);
  font-family: var(--font-ui);
  font-size: var(--fs-9);
  font-weight: var(--fw-bold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--t-fast), border-color var(--t-fast),
              color var(--t-fast), transform var(--t-fast);
}
.snp-lat-btn:hover {
  background: rgba(0, 212, 255, 0.14);
  border-color: rgba(0, 212, 255, 0.5);
  color: #00efff;
  transform: translateY(-0.5px);
}
.snp-lat-btn:active { transform: translateY(0.5px); }
.snp-lat-btn:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
.snp-lat-btn.is-active {
  background: rgba(0, 239, 255, 0.18);
  border-color: var(--accent);
  color: var(--accent);
  font-weight: var(--fw-bold);
}

/* ── 6. Quarentena — A REALOCAR ─────────────────────────────────────────── */
.snp-divider--intrusos {
  color: rgba(251, 191, 36, 0.55) !important;
}
.usg-chip-row--intrusos {
  opacity: var(--snp-intrusos-opacity);
}
.snp-premium .usg-chip-row--intrusos .snp-item,
.snp-premium .usg-chip-row--intrusos .snp-item-lateral {
  background: var(--snp-intrusos-bg);
  border-color: rgba(251, 191, 36, 0.15);
}
.snp-premium .usg-chip-row--intrusos .snp-item:hover,
.snp-premium .usg-chip-row--intrusos .snp-item-lateral:hover {
  opacity: 1;
  background: rgba(251, 191, 36, 0.08);
  border-color: rgba(251, 191, 36, 0.35);
  color: var(--warning);
}

/* ── 6b. Input inline de medida (revelado após clicar D ou E) ──────────── */
.snp-lat-loc {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 var(--space-2) 6px;
  animation: snpLocIn 0.12s ease;
}
@keyframes snpLocIn {
  from { opacity: 0; transform: translateY(-3px); }
  to   { opacity: 1; transform: translateY(0); }
}
.snp-lat-loc-input {
  flex: 1;
  height: 24px;
  padding: 0 var(--space-2);
  background: var(--bg-input);
  border: 1px solid var(--accent);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: var(--fs-11);
  color: var(--text-primary);
  outline: none;
  box-shadow: 0 0 0 2px var(--accent-glow);
  transition: box-shadow var(--t-fast);
}
.snp-lat-loc-input:focus {
  box-shadow: 0 0 0 3px var(--accent-glow-strong);
}
.snp-lat-loc-input::placeholder { color: var(--text-muted); font-style: italic; }

/* ── 7. Estado ativo dos laterais (botão D ou E) ────────────────────────── */
.snp-item-lateral:has(.snp-lat-btn.is-active) {
  border-color: rgba(0, 229, 255, 0.35);
  background: rgba(0, 212, 255, 0.05);
}

/* ═══════════════════════════════════════════════════════════════════════════
   MEDIDAS TRANSVAGINAL — grade uniforme 2×2
   [Útero | Filhos] / [Ov. D | Ov. E] — inputs idênticos em todas as células
   ═══════════════════════════════════════════════════════════════════════════ */
.tv-med-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-panel-elevated);
}

/* Linha 1: útero — full width, bloco plano */
.tv-group-utero {
  grid-column: 1 / -1;
  padding-bottom: 7px;
  margin-bottom: 7px;
  border-bottom: 1px solid var(--border-subtle);
  min-width: 0;
}

/* Botões de paridade — mesma anatomia dos inputs de medida */
.tv-par-btn {
  width: 0;
  flex: 1;
  min-width: 22px;
  height: var(--h-input-sm);
  padding: 0;
  background: var(--bg-input);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  color: var(--text-muted);
  font: var(--fw-medium) var(--fs-11)/1 var(--font-ui);
  cursor: pointer;
  transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast);
}
.tv-par-btn.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--bg-app);
  font-weight: var(--fw-semibold);
}
.tv-par-btn:hover:not(.is-active) {
  border-color: var(--accent);
  color: var(--text-primary);
}
/* leve gap entre dims e botões de paridade */
.tv-utr-dim + .tv-par-btn { margin-left: 4px; }

/* Linha 2: ovários */
.tv-med-group:nth-child(2) { padding: 0 8px 0 0; border-right: 1px solid var(--border-subtle); min-width: 0; }
.tv-med-group:last-child   { padding: 0 0 0 8px; border-right: none; min-width: 0; }

.tv-med-title {
  font: var(--fw-semibold) var(--fs-10)/1 var(--font-ui);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--accent);
  margin-bottom: 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Posição uterina — seleção acima das medidas */
.tv-pos-row {
  display: flex;
  gap: 3px;
  margin-bottom: 6px;
}
.tv-pos-btn {
  flex: 1;
  height: var(--h-input-sm);
  padding: 0;
  background: var(--bg-input);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  color: var(--text-muted);
  font: var(--fw-medium) var(--fs-10)/1 var(--font-ui);
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast);
}
.tv-pos-btn.is-active {
  background: color-mix(in srgb, var(--accent) 15%, transparent);
  border-color: var(--accent);
  color: var(--accent);
  font-weight: var(--fw-semibold);
}
.tv-pos-btn:hover:not(.is-active) {
  border-color: var(--accent);
  color: var(--text-primary);
}

/* Dados Gerais: body sem padding extra (tv-med-section já tem o seu) */
.tv-dados-body { padding: 0 !important; background: transparent !important; }

/* Header útero: título à esquerda, volume+badge à direita */
.tv-utr-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 5px;
}
.tv-utr-head .tv-med-title { margin-bottom: 0; }
.tv-utr-head .tv-vol-line  { gap: 4px; overflow: visible; }

/* Separador textual "Filhos" entre os inputs de medida e os de paridade */
.tv-filhos-sep {
  flex-shrink: 0;
  font: var(--fw-semibold) var(--fs-9)/1 var(--font-ui);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  margin: 0 3px;
}

/* Inputs — mesma anatomia em útero e ovários */
.tv-dims { display: flex; align-items: center; gap: 3px; margin-bottom: 4px; }
.tv-utr-dim,
.tv-ov-dim {
  width: 0;
  flex: 1;
  min-width: 22px;
  height: var(--h-input-sm);
  padding: 0 3px;
  background: var(--bg-input);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  font-size: var(--fs-11);
  text-align: center;
  outline: none;
  -moz-appearance: textfield;
}
.tv-utr-dim::-webkit-outer-spin-button,
.tv-utr-dim::-webkit-inner-spin-button,
.tv-ov-dim::-webkit-outer-spin-button,
.tv-ov-dim::-webkit-inner-spin-button { -webkit-appearance: none; }
.tv-utr-dim:focus,
.tv-ov-dim:focus { border-color: var(--accent); box-shadow: var(--shadow-focus); }

/* Vol + badge — nunca quebra linha */
.tv-vol-line {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: nowrap;
  overflow: hidden;
  min-width: 0;
}
.tv-utr-vol,
.tv-ov-vol-disp {
  font-size: var(--fs-11);
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Input volume ovário (legacy — mantido por compat) */
.tv-ov-vol {
  flex: 1;
  min-width: 0;
  height: var(--h-input-sm);
  padding: 0 5px;
  background: var(--bg-input);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  font-size: var(--fs-11);
  outline: none;
  -moz-appearance: textfield;
}
.tv-ov-vol::-webkit-outer-spin-button,
.tv-ov-vol::-webkit-inner-spin-button { -webkit-appearance: none; }
.tv-ov-vol:focus { border-color: var(--accent); box-shadow: var(--shadow-focus); }

/* Badges de status */
.tv-badge {
  display: inline-block;
  padding: 1px 4px;
  border-radius: 10px;
  font: var(--fw-semibold) var(--fs-9)/16px var(--font-ui);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background var(--t-fast), color var(--t-fast);
}
.tv-badge:empty { display: none; }
.tv-badge--ok     { background: rgba(52,211,153,.15); color: var(--success); }
.tv-badge--warn   { background: rgba(251,191,36,.12); color: var(--warning); }
.tv-badge--danger { background: rgba(248,113,113,.15); color: var(--danger); }