/* TravelVisa Main Styles */

:root {
  --primary: #1a5f7a;
  --primary-dark: #124558;
  --secondary: #159895;
  --light-bg: #f8f9fa;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

main {
  flex: 1;
}

.navbar-brand {
  font-weight: 700;
}

.visa-card {
  transition: transform 0.2s, box-shadow 0.2s;
}

.visa-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.form-step {
  display: none;
}

.form-step.active {
  display: block;
}

.lang-flags .flag-icon {
  font-size: 1.25em;
}

/* Custom form validation: red border only (no Bootstrap exclamation icon, no focus glow) */
.form-control.is-invalid,
.form-select.is-invalid {
  border-color: #dc3545;
  box-shadow: none;
}

.form-control.is-invalid:not(.form-select),
textarea.form-control.is-invalid {
  background-image: none !important;
  padding-right: 0.75rem !important;
}

/* Keep normal dropdown chevron, not the invalid-state icon */
.form-select.is-invalid {
  background-image: var(
    --bs-form-select-bg-img,
    url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e")
  ) !important;
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
  border-color: #dc3545;
  box-shadow: none;
}

.was-validated .form-control:invalid:not(.form-select),
.was-validated textarea.form-control:invalid {
  background-image: none !important;
}

.was-validated .form-select:invalid {
  background-image: var(
    --bs-form-select-bg-img,
    url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e")
  ) !important;
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
}

.form-check-input.is-invalid {
  background-image: none !important;
}

.phone-country option {
  font-size: 0.95rem;
}
