/* BUSCA AHORA RC8C — small UI refinements */

/* Password show/hide */
.password-field{
  position:relative;
  display:flex;
  align-items:center;
}
.password-field input{
  padding-right:50px !important;
}
.password-toggle{
  position:absolute;
  right:7px;
  top:50%;
  transform:translateY(-50%);
  width:38px;
  height:38px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#667085;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.password-toggle:hover,
.password-toggle:focus-visible{
  background:#f2f4f7;
  color:#101828;
  outline:none;
}
.password-toggle svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.password-toggle.is-visible{
  color:#101828;
  background:#f2f4f7;
}

/* Visible color controls */
.color-selector-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-bottom:6px;
}
.color-selector-card{
  display:block !important;
  border:1px solid #e4e7ec;
  border-radius:16px;
  padding:14px;
  background:#fff;
}
.color-selector-title{
  display:block;
  font-weight:850;
  margin-bottom:10px;
}
.color-selector-control{
  display:grid;
  grid-template-columns:54px 1fr auto;
  gap:10px;
  align-items:center;
}
.color-input{
  width:54px !important;
  height:46px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  cursor:pointer;
}
.color-input::-webkit-color-swatch-wrapper{
  padding:0;
}
.color-input::-webkit-color-swatch{
  border:1px solid #d0d5dd;
  border-radius:10px;
}
.color-input::-moz-color-swatch{
  border:1px solid #d0d5dd;
  border-radius:10px;
}
.color-swatch{
  display:block;
  height:46px;
  border-radius:10px;
  border:1px solid #d0d5dd;
  min-width:80px;
}
.color-hex{
  background:#f9fafb;
  border:1px solid #eaecf0;
  border-radius:9px;
  padding:8px 9px;
  font-size:.76rem;
  white-space:nowrap;
  color:#475467;
}
.color-selector-card small{
  display:block;
  color:#667085;
  font-weight:500;
  margin-top:9px;
  line-height:1.35;
}

@media(max-width:760px){
  .color-selector-grid{
    grid-template-columns:1fr;
  }
  .color-selector-control{
    grid-template-columns:50px 1fr auto;
  }
}

@media(max-width:390px){
  .color-selector-control{
    grid-template-columns:48px 1fr;
  }
  .color-hex{
    grid-column:1/-1;
    width:max-content;
  }
}