/* Primary Input Styler
 * Deixa checkboxes e radios brancos, com borda discreta, e quando selecionados
 * usa a cor definida nas configurações do plugin.
 *
 * A cor vem de: :root { --pis-primary-color: #xxxxxx; } injetado pelo PHP.
 */

/* Fallback caso algo impeça o inline CSS */
:root {
  --pis-primary-color: #ff5d00;
}

/* Reset leve para garantir consistência */
input[type="checkbox"],
input[type="radio"] {
  width: 18px;
  height: 18px;
  margin: 0 6px 0 0;
  cursor: pointer;
  vertical-align: middle;
}

/* Usa accent-color quando disponível (estiliza o estado marcado) */
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--pis-primary-color);
}

/* Aparência "caixinha branca" / "círculo branco" com borda leve */
input[type="checkbox"],
input[type="radio"] {
  background-color: #ffffff;
  border: 1px solid rgba(0,0,0,0.25);
  border-radius: 3px; /* checkbox quadradinho com cantos suaves */
  box-sizing: border-box;
}

/* Radios mais arredondados */
input[type="radio"] {
  border-radius: 50%;
}

/* Foco acessível */
input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
  outline: 2px solid var(--pis-primary-color);
  outline-offset: 2px;
}

/* Hover leve */
input[type="checkbox"]:hover,
input[type="radio"]:hover {
  border-color: var(--pis-primary-color);
}

/* Em temas que aplicam background/borda via CSS, isso ajuda a manter o visual */
.woocommerce form .form-row input[type="checkbox"],
.woocommerce form .form-row input[type="radio"] {
  background-color: #ffffff;
}

/* Ajuste em labels para alinhar melhor com o Flatsome/Woo */
.woocommerce-form__input-checkbox + label,
input[type="checkbox"] + label,
input[type="radio"] + label {
  cursor: pointer;
}