.gender-option { cursor: pointer; }
  
  .gender-option .card {
    transition: all 0.25s ease;
    background-color: #f8fafc;
  }

  .gender-option:hover .card {
    border-color: #6366f1 !important;
    background-color: #eef2ff;
    transform: translateY(-2px);
  }

  .gender-option input:checked + .card {
    background: linear-gradient(135deg, #6366f1, #818cf8);
    border-color: #6366f1 !important;
    box-shadow: 0 6px 18px rgba(99, 102, 241, 0.35);
  }

  .gender-option input:checked + .card i,
  .gender-option input:checked + .card span {
    color: #ffffff !important;
  }

  .gender-option--male input:checked + .card {
    background: linear-gradient(135deg, #3b82f6, #60a5fa);
    border-color: #3b82f6 !important;
    box-shadow: 0 6px 18px rgba(59, 130, 246, 0.35);
  }

  .gender-option--female input:checked + .card {
    background: linear-gradient(135deg, #ec4899, #f472b6);
    border-color: #ec4899 !important;
    box-shadow: 0 6px 18px rgba(236, 72, 153, 0.35);
  }

  .gender-option--any input:checked + .card {
    background: linear-gradient(135deg, #8b5cf6, #a78bfa);
    border-color: #8b5cf6 !important;
    box-shadow: 0 6px 18px rgba(139, 92, 246, 0.35);
  }