:root {
    /* GoFly Logo Color Scheme */
    --gf-primary: #0564F9;
    --gf-primary-glow: rgba(5, 100, 249, 0.2);
    --gf-accent: #FF7C08;
    --gf-bg: #F4F7FE; /* Soft modern background */
    --gf-surface: #FFFFFF;
    --gf-text-main: #1E293B;
    --gf-text-muted: #64748B;
    --gf-border: #E2E8F0;
    --gf-input-bg: #F8FAFC;
    
    --radius-lg: 24px;
    --radius-md: 14px;
    --radius-sm: 10px;
    --transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); /* Bouncy modern transition */
}
a{
   text-decoration :auto !important;
}

/* Form Card Container */
.modern-form-card {
    background: var(--gf-surface);
    border-radius: var(--radius-lg);
    padding: 3rem;
    box-shadow: 0 20px 40px -15px rgba(0,0,0,0.05);
    border: 1px solid rgba(255,255,255,0.5);
}

.section-title {
    font-weight: 800;
    letter-spacing: -0.5px;
    margin-bottom: 2rem;
    color: var(--gf-text-main);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    justify-content: center;
}

.form-label {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--gf-text-muted);
    margin-bottom: 0.5rem;
}

/* --- Modern Slide-Up Input Wrapper --- */
.modern-input-wrapper {
    display: flex;
    align-items: center;
    background: var(--gf-input-bg);
    border: 1px solid var(--gf-border);
    border-radius: var(--radius-md);
    padding: 0.5rem 1.25rem;
    transition: var(--transition);
    position: relative;
}

/* The Slide Up Animation */
.modern-input-wrapper:focus-within {
    transform: translateY(-6px);
    background: var(--gf-surface);
    border-color: var(--gf-primary);
    box-shadow: 0 12px 24px var(--gf-primary-glow);
}

.modern-input-wrapper i {
    color: var(--gf-text-muted);
    font-size: 1.1rem;
    margin-right: 1rem;
    transition: var(--transition);
}

.modern-input-wrapper:focus-within i {
    color: var(--gf-primary);
}

/* Resetting Default Bootstrap Inputs inside wrapper */
.modern-input-wrapper input, 
.modern-input-wrapper select, 
.modern-input-wrapper textarea {
    border: none;
    background: transparent;
    box-shadow: none !important;
    padding: 0.5rem 0;
    font-weight: 600;
    color: var(--gf-text-main);
    width: 100%;
    outline: none;
}

.modern-input-wrapper input::placeholder,
.modern-input-wrapper textarea::placeholder {
    color: #A0AEC0;
    font-weight: 500;
}

/* --- Modern Number Spinner --- */
.spinner-controls {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto; /* Push to right */
}

.spinner-btn {
    background: var(--gf-surface);
    border: 1px solid var(--gf-border);
    color: var(--gf-text-main);
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.spinner-btn:hover {
    background: var(--gf-primary);
    color: white;
    border-color: var(--gf-primary);
}
.spinner-btn:hover i{
    color: white;
}

.spinner-input-display {
    width: 30px !important;
    text-align: center;
    padding: 0 !important;
    pointer-events: none; /* User clicks buttons, not input directly */
}

/* Disable native arrows */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none; margin: 0; 
}

/* --- Modern Switches & Checks --- */
.form-check-input {
    width: 1.25em;
    height: 1.25em;
    margin-top: 0.15em;
    border-color: var(--gf-border);
    cursor: pointer;
}

.form-check-input:checked {
    background-color: var(--gf-primary);
    border-color: var(--gf-primary);
}

.form-switch .form-check-input {
    width: 2.5em;
    height: 1.3em;
    border-radius: 2em;
}

.form-check-label {
    font-weight: 500;
    color: var(--gf-text-main);
    cursor: pointer;
    padding-top: 2px;
}

/* --- Buttons --- */
.btn-modern {
    background: var(--gf-primary);
    color: white;
    border-radius: var(--radius-sm);
    padding: 1rem 2rem;
    font-weight: 700;
    border: none;
    transition: var(--transition);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.btn-modern:hover {
    background: var(--gf-accent); /* Switches to orange on hover for pop */
    color: white;
    transform: translateY(-4px);
    box-shadow: 0 10px 20px rgba(255, 124, 8, 0.3);
}

/* --- DateRangePicker Customization --- */
.daterangepicker {
    border: none;
    border-radius: var(--radius-md);
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
    font-family: inherit;
}
.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: var(--gf-primary);
}



/* 1. UPDATE YOUR EXISTING ANIMATION RULES 
  (Replace your current :focus-within rules with these to support the Select2 JS class) 
*/

/* The Slide Up Animation */
.modern-input-wrapper:focus-within,
.modern-input-wrapper.wrapper-active {
    transform: translateY(-6px);
    background: var(--gf-surface);
    border-color: var(--gf-primary);
    box-shadow: 0 12px 24px var(--gf-primary-glow);
}

.modern-input-wrapper i {
    color: var(--gf-text-muted);
    font-size: 1.1rem;
    margin-right: 1rem;
    transition: var(--transition);
}



/* 2. ADD THIS ENTIRE BLOCK TO THE BOTTOM OF YOUR CSS
  (Select2 Custom Overrides)
*/

/* Container inside the modern wrapper */
.modern-input-wrapper .select2-container {
    width: 100% !important;
}

/* Remove default borders and backgrounds */
.modern-input-wrapper .select2-container .select2-selection--single,
.modern-input-wrapper .select2-container .select2-selection--multiple {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    height: auto;
    padding: 0.5rem 0;
    outline: none !important;
}

/* Typography matching */
.modern-input-wrapper .select2-container .select2-selection__rendered {
    padding-left: 0;
    padding-right: 0;
    color: var(--gf-text-main);
    font-weight: 600;
    line-height: normal;
}

.modern-input-wrapper .select2-container .select2-selection__placeholder {
    color: #A0AEC0;
    font-weight: 500;
}

/* Hide native Select2 arrow for a cleaner look (we have FontAwesome icons) */
.modern-input-wrapper .select2-selection__arrow {
    display: none !important;
}

/* Select2 Multiple Tags Styling (e.g., for Countries) */
.modern-input-wrapper .select2-container .select2-selection--multiple .select2-selection__choice {
    background-color: var(--gf-primary-glow);
    border: none;
    border-radius: var(--radius-sm);
    color: var(--gf-primary);
    padding: 4px 12px;
    margin-top: 2px;
    margin-bottom: 2px;
    font-weight: 600;
    display: flex;
    flex-direction: row-reverse; /* Puts the 'x' remove button on the right */
    align-items: center;
    gap: 8px;
}

.modern-input-wrapper .select2-container .select2-selection--multiple .select2-selection__choice__remove {
    color: var(--gf-primary);
    border: none;
    background: transparent;
    font-weight: bold;
    position: relative;
    padding: 0;
}

.modern-input-wrapper .select2-container .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: var(--gf-primary);
    background: transparent;
    opacity: 0.7;
}

/* Select2 Dropdown Popup Styling (Appended to body) */
.select2-dropdown {
    border: 1px solid var(--gf-border) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08) !important;
    padding: 8px;
    z-index: 9999;
    overflow: hidden;
    background-color: var(--gf-surface);
}

/* The search bar inside the dropdown */
.select2-search--dropdown .select2-search__field {
    border-radius: var(--radius-sm);
    border: 1px solid var(--gf-border);
    padding: 8px 12px;
    outline: none;
    font-family: inherit;
}

.select2-search--dropdown .select2-search__field:focus {
    border-color: var(--gf-primary);
}

/* Dropdown list items */
.select2-results__option {
    padding: 10px 15px !important;
    border-radius: 8px;
    margin-bottom: 4px;
    transition: all 0.2s ease;
    color: var(--gf-text-main);
    font-weight: 500;
}

/* Hover/Active states for list items */
.select2-results__option--highlighted[aria-selected] {
    background-color: var(--gf-primary) !important;
    color: white !important;
}

/* Already selected items in the list */
.select2-results__option[aria-selected="true"] {
    background-color: var(--gf-primary-glow);
    color: var(--gf-primary);
}

/* Container inside the modern wrapper */
.modern-input-wrapper .select2-container {
    width: 100% !important;
}

/* Remove default borders, backgrounds, AND reset padding on the main wrapper */
.modern-input-wrapper .select2-container .select2-selection--single,
.modern-input-wrapper .select2-container .select2-selection--multiple {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    height: auto !important;
    min-height: auto !important;
    padding: 0 !important; /* Force 0 padding here */
    outline: none !important;
    display: flex;
    align-items: center;
}

/* Move the exact native padding (0.5rem 0) to the rendered text to match normal inputs */
.modern-input-wrapper .select2-container .select2-selection--single .select2-selection__rendered {
    padding: 0.5rem 0 !important; 
    color: var(--gf-text-main);
    font-weight: 600;
    line-height: 1.5 !important;
}

/* Fix Multi-Select Height Expansion */
.modern-input-wrapper .select2-container .select2-selection--multiple .select2-selection__rendered {
    padding: 0 !important;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 0;
}

/* Remove the sneaky margin Select2 adds to the multi-select search input */
.modern-input-wrapper .select2-container .select2-search--inline .select2-search__field {
    margin: 0 !important;
    padding: 0.5rem 0 !important;
    line-height: 1.5 !important;
    font-weight: 600;
}

.modern-input-wrapper .select2-container .select2-selection__placeholder {
    color: #A0AEC0;
    font-weight: 500;
}

/* Hide native Select2 arrow for a cleaner look */
.modern-input-wrapper .select2-selection__arrow {
    display: none !important;
}

/* Select2 Multiple Tags Styling */
.modern-input-wrapper .select2-container .select2-selection--multiple .select2-selection__choice {
    background-color: var(--gf-primary-glow);
    border: none;
    border-radius: var(--radius-sm);
    color: var(--gf-primary);
    padding: 2px 10px; /* Reduced padding so tags don't stretch the height */
    margin: 0 !important; /* Overriding default margin */
    font-weight: 600;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 8px;
}



@media (max-width: 767px) {
    .home2-package-slider-section {
        margin-top: -326px;
        padding: 30px;
    }
}

@media (max-width: 576px) {
    .home2-package-slider-section {
        margin-top: 0;
    }
}

.footer-section{
    background-image: url(../img/home1/footer-bg.png), linear-gradient(180deg, #1c4356 0%, #194e68 100%);
}

.destination-card2.four {
    margin-top: 20px;
}


@media (max-width: 991px) {
    .filter-wrapper {
        margin-top: -25px;
    }
}

.package-details-page .package-details-warpper .package-info-wrap .package-info-list {
    grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 576px) {
    .about-page-journey-section .jouney-content-wrapper .nav-area .nav-pills .nav-item .nav-link img {
        width: 210px;
        height: 220px;
    }
}


.home2-package-slider-section {
    margin-top: 0px;
    padding :30px !important;
}


.package-card .package-content h3 {
    margin-bottom: 11px;
    min-height: 57px;
    font-size: 40px;
    line-height: 23px;
}

.package-card .package-content h3 a {
color: var(--title-color);
    font-family: var(--font-poppins);
    font-weight: 600;
    font-size: 20px;
    line-height: 1;
    transition: 0.5s;
    
}