/* Custom Checkbox Styling */
.custom-checkbox {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(211, 47, 47, 0.3);
  border-radius: 4px;
  background-color: var(--bg-color);
  margin: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: var(--transition-smooth);
}

.custom-checkbox:hover {
  border-color: var(--secondary-color);
}

.custom-checkbox:checked {
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
}

.custom-checkbox:checked::after {
  content: '';
  position: absolute;
  width: 5px;
  height: 10px;
  border: solid var(--white);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  top: 1px;
  left: 5px;
}

.custom-checkbox:focus-visible {
  box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.25);
  outline: none;
}

/* Custom Select Dropdown Styling */
select.form-control, select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D32F2F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 16px;
  padding-right: 40px !important;
}