
/*
  V48 — Ajustes aplicados igualmente às telas 5-vinhos e Refinar:
  - garrafas 6% menores;
  - preço no mesmo padrão tipográfico do nome do vinho;
  - percentual 5% menor que o novo tamanho do preço;
  - colunas coloridas dos quatro primeiros cards preenchendo toda a altura.
*/

/* 60 px × 94% = 56,4 px. */
#fiveWinesScreen .qual-five-bottle img,
#refineWinesScreen .qual-five-bottle img{
  height:56.4px !important;
  max-height:56.4px !important;
}

/* O preço passa a usar o mesmo modelo tipográfico do nome do vinho. */
#fiveWinesScreen .qual-five-price,
#refineWinesScreen .qual-five-price{
  font:700 14px/1.08 Georgia,"Times New Roman",serif !important;
}

/* 14 px × 95% = 13,3 px. */
#fiveWinesScreen .qual-five-percent,
#refineWinesScreen .qual-five-percent{
  font:normal 13.3px/.95 Georgia,"Times New Roman",serif !important;
}

/*
  O grid volta a esticar as quatro colunas até as bordas do card.
  O conteúdo continua centralizado dentro de cada coluna.
*/
#fiveWinesScreen .qual-five-card,
#refineWinesScreen .qual-five-card{
  align-items:stretch !important;
}

#fiveWinesScreen .qual-five-card > .qual-five-rank,
#refineWinesScreen .qual-five-card > .qual-five-rank,
#fiveWinesScreen .qual-five-card > .qual-five-bottle,
#refineWinesScreen .qual-five-card > .qual-five-bottle,
#fiveWinesScreen .qual-five-card > .qual-five-info,
#refineWinesScreen .qual-five-card > .qual-five-info,
#fiveWinesScreen .qual-five-card > .qual-five-score,
#refineWinesScreen .qual-five-card > .qual-five-score{
  align-self:stretch !important;
  height:100% !important;
}

#fiveWinesScreen .qual-five-card > .qual-five-rank,
#refineWinesScreen .qual-five-card > .qual-five-rank,
#fiveWinesScreen .qual-five-card > .qual-five-bottle,
#refineWinesScreen .qual-five-card > .qual-five-bottle,
#fiveWinesScreen .qual-five-card > .qual-five-score,
#refineWinesScreen .qual-five-card > .qual-five-score{
  justify-content:center !important;
  align-items:center !important;
}

#fiveWinesScreen .qual-five-card > .qual-five-info,
#refineWinesScreen .qual-five-card > .qual-five-info{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
