.options.pets{
  margin-top:clamp(1.25rem,4vh,2rem);
  display:grid;
  gap:clamp(1rem,3vh,1.5rem);
}

.pet-card{
  display:flex;
  align-items:center; /* centraliza verticalmente */
  justify-content:space-between;
  padding:clamp(1rem,3vh,1.5rem);
  background:#FFFFFF;
  border-radius:0.75rem;
  box-shadow:0 -0.3125rem 2.2125rem rgba(0,0,0,0.1);
  border:1px solid rgba(0,0,0,0.03);
  cursor:pointer;
  transition: transform .25s ease, box-shadow .25s ease;
  min-height:6rem;
}

.pet-card:hover{
  transform: translateY(-4px);
  box-shadow:0 .5rem 1.5rem rgba(0,0,0,0.15);
}

.pet-left{
  display:flex;
  align-items:center; /* centraliza foto e info verticalmente */
  gap:clamp(1rem,3vw,1.25rem);
}

.pet-photo{
  width:clamp(4rem,10vw,5rem);
  height:clamp(4rem,10vw,5rem);
  border-radius:50%;
  overflow:hidden;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.pet-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.pet-info h4{
  font-family:'Bitter', serif;
  font-size:1.125rem;
  margin:0 0 0.25rem 0;
  color:#141420;
}

.pet-info p{
  font-size:1rem;
  color:#777;
  margin:0.1rem 0;
  display:flex;
  align-items:center;
  gap:0.3rem;
}

.vedi-btn{
  background:transparent;
  border:1.75px solid #FECF6C;
  color:#141420;
  font-weight:600;
  padding:0.5rem 1.25rem;
  border-radius:2.5rem;
  transition: all .2s ease;
  text-decoration: none;

  display:flex;
  align-items:center; /* centraliza verticalmente */
  justify-content:center;
}

.vedi-btn:hover{
  background:#FECF6C;
  color:#fff;
}

.form-buttons{
  display:flex;
  justify-content:center;
}

.add-pet-btn{
  display:inline-block;
  background:#FECF6C;
  color:#fff;
  font-weight:700;
  text-decoration:none;
  padding:clamp(0.85rem,2.5vh,1.2rem) clamp(2.5rem,6vw,3.25rem);
  border-radius:50rem;
  transition:background .2s ease, transform .2s ease;
}

.add-pet-btn:hover{
  background:#e4b94d;
  transform:translateY(-2px);
}
.text-decoration-none{
    text-decoration: none;
}
.text-black-mlmr{
    color: #000000;
    margin-top: 10px;

}
.progress-active-pet {
    width: 47%;
    margin-left: 3%;
    height: 13px;
    background: #FECF6C;
    border-radius: 3px;
}
.progress-inactive-pet {
    width: 47%;
    margin-left: 3%;
    height: 13px;
    background: #C7C7C7;
    border-radius: 3px;
}

 .progress-active-pet-2 {
    width: 48.5%;    
    margin-right: 1.5%;
    height: 13px;
    background: #FECF6C;
    border-radius: 3px;
}
.choice-group {
  margin-top: clamp(1rem, 3vh, 1.5rem);
  display: grid;
  gap: clamp(0.75rem, 2.5vh, 1rem);
}

/* Esconde o input */
.choice-item input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Card base */
.choice-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: clamp(0.75rem, 2.5vh, 1rem);
  background: var(--bg, #fff);
  border-radius: var(--radius, 0.75rem);
  box-shadow: var(--card-shadow, 0 2px 5px rgba(0,0,0,0.05));
  border: 1px solid rgba(0, 0, 0, 0.05);
  min-height: 3.5rem;
  cursor: pointer;
  transition: border-color 0.25s ease;
}

.choice-item:hover {
  border-color: rgba(0,0,0,0.1);
}

/* Conte�do da esquerda */
.choice-content {
  display: flex;
  align-items: center;
  gap: clamp(0.75rem, 2vw, 1rem);
}

.choice-icon {
  width: clamp(2rem, 6vw, 2.75rem);
  height: clamp(2rem, 6vw, 2.75rem);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, #fff 0%, #f7f7f7 100%);
  border: 1px solid rgba(0, 0, 0, 0.04);
}

.choice-item h4 {
  font-family: 'Bitter', serif;
  font-size: 1rem;
  margin: 0;
  color: var(--text, #222);
}

/* Bolinha da direita */
.choice-indicator {
  width: clamp(1.125rem, 3.5vw, 1.375rem);
  height: clamp(1.125rem, 3.5vw, 1.375rem);
  border-radius: 50%;
  background: #d9d9d9;
  border: 1px solid rgba(0,0,0,0.1);
  transition: background 0.25s ease, border-color 0.25s ease;
}

/* Apenas a bolinha muda quando o input est� selecionado */
.choice-item input:checked ~ .choice-indicator {
  background: #FFD600; /* amarelo */
  border-color: #E6C200;
}
.profilo{


/* H2 */
font-family: 'Bitter';
font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 160%;
/* or 38px */
display: flex;
align-items: center;

/* Nero */
color: #141420;

}

/* Quale tipo di pet possiedi? */
.possiedi{
/* Txt */
font-family: 'Mulish';
font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 140%;
/* or 22px */
display: flex;
align-items: center;

/* Nero */
color: #141420;


}


