/* ---------- GENERAL PAGE ---------- */
   body {
   background-color: #f3f4f6 !important;
   }
   h3.text-primary {
   color: #0d6efd !important;
   }
   ul {
   list-style-type: "✔ ";
   margin-left: 1rem;
   color: #333;
   }
   button[type="submit"] {
   transition: all 0.3s ease;
   }
   /* ---------- REGISTRATION FORM ---------- */
   #RegisterApplicationForm {
   background: white;
   padding: 15px 10px;
   border-radius: 14px;
   }
   /* ---------- BANNER SECTION ---------- */
   header, .site-header {
   margin-bottom: 0 !important;
   }
   .fullwidth-banner {
   position: relative;
   width: 100vw;                 /* full viewport width */
   left: 50%;
   right: 50%;
   margin-left: -50vw;           /* breakout from container */
   margin-right: -50vw;
   overflow: hidden;
   z-index: 0;
   }
   .fullwidth-banner img {
   display: block;
   width: 100%;
   height: auto;                 /* natural height */
   object-fit: contain;          /* keep entire image visible */
   margin: 0;
   padding: 0;
   border: none;
   }
   /* Ensure content starts right after banner */
   .fullwidth-banner + .container {
   position: relative;
   z-index: 2;
   margin-top: 0;
   padding-top: 40px;
   background-color: #f3f4f6;
   }
   .is-valid {
   border-color: #198754 !important; /* green */
   }
   .is-invalid {
   border-color: #dc3545 !important; /* red */
   }
/* Ensure phone input matches height perfectly */
.input-group .form-control:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    height: 38px; /* Explicit height to match */
}

/* Remove any gaps between country code and phone input */
.input-group > .form-select + .form-control {
    margin-left: -1px !important; /* Remove the tiny gap */
}
/* Autocomplete Suggestions Styling */
.autocomplete-suggestions {
    position: absolute;
    background: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1000;
    width: 100%;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    display: none;
}

.autocomplete-suggestion {
    padding: 8px 12px;
    cursor: pointer;
    border-bottom: 1px solid #eee;
}

.autocomplete-suggestion:hover {
    background-color: #f5f5f5;
}

.autocomplete-suggestion:last-child {
    border-bottom: none;
}
/* Address input styling based on country selection */
#autocomplete:disabled {
    background-color: #f8f9fa;
    cursor: not-allowed;
    opacity: 0.7;
}

#autocomplete:not(:disabled) {
    background-color: #fff;
}

/* Loading state for suggestions */
.autocomplete-suggestion[style*="color: #666"] {
    color: #666 !important;
    font-style: italic;
}
 /* Make Select2 height match Bootstrap form controls */
.select2-container .select2-selection--single {
    height: 38px !important;
    padding: 6px 12px !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.5 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px !important;
}

/* Ensure all form controls have consistent height */
.form-control, .form-select, .select2-container .select2-selection--single {
    height: 38px !important;
}

/* Phone input group specific styling */
.input-group .form-control:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    height: 38px !important;
}

.input-group .form-select {
    height: 38px !important;
}