/**
Theme Name: Imago travel child theme
Author: M Jazouli
Author URI: https://imagotravel.com/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: imago-travel-child-theme
Template: astra
*/

@media (min-width: 1024px) {
body.home .site-primary-header-wrap {
    position: absolute;
    width: 100%!important;
}
}


/* Normal desktop grid */
.mobile-cards-carousel .elementor-container {
  display: flex;
  gap: 20px;
}

/* On mobile let Swiper take over */
@media (max-width: 767px) {
  .mobile-cards-carousel .elementor-container {
    display: block;
  }
}


/**************************************Style : Form Contact *********************************/
.form-contact h3.form-section-title { font-size: 19px; }
.form-contact select{ border: 1px solid var(--vs-border-color); }
.form-contact select:focus { outline: 0; box-shadow: none; border-color: var(--theme-color); background-color: var(--white-color); }

.grecaptcha-badge {display: none!important;}



h3.form-section-title { font-size: 20px; font-weight: 500; text-decoration: underline; }

/* ===== Grid Layout ===== */
.input-label p {
    width: 100%!important;
}

.row {
  display: flex;
  flex-wrap: wrap;

}

.col-md-6,
.col-sm-12 {
  padding-left: 8px;
  padding-right: 8px;
  margin-bottom: 15px;
  flex: 0 0 100%;
  max-width: 100%;
}

/* Two columns on desktop */
@media (min-width: 767px) {
  .col-md-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
}
/*******-------------Contact form------------*************/

h1.entry-title {opacity: 0;}


section#block-24 img {
    height: 50px;
    object-fit: contain;
}

/* Container */
.form-group {position: relative;margin-bottom: 10px;}
.form-group input, .form-group textarea, .form-group select { width: 100%; padding: 14px; border: 1px solid #D0CACA; border-radius: 12px; outline: none; font-size: 14px; background: none; transition: border-color 0.3s; }
.form-group textarea{height:140px!important}


.form-group label { position: absolute; left: 16px; top: 50%; transform: translateY(-190%); background: #fff; color: #999; padding: 0 4px; font-size: 14px; pointer-events: none; transition: all 0.25s ease; }
.form-group:focus-within label { top: 20px; font-size: 12px; color: #4797C9; }

.form-group input:not([value=""]) ~ label, .form-group textarea:not([value=""]) ~ label { top: -10px; font-size: 12px; color: #4797C9; }
.form-group input:not(:placeholder-shown) ~ label,
.form-group textarea:not(:placeholder-shown) ~ label { top: -10px; font-size: 12px; color: #4797C9; }

/* Focus border */
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { border-color: #4797C9; }
.form-group p { margin: 0; padding: 0; position: relative; }

.imago-contact-form-floating {
    padding: 0px ;
    text-align: center;
}


.imago-contact-form-floating  input[type="submit"]{color: white;white!important;}


.iti { width: 100%; display: block; }
#phone-input-raw { padding-left: 55px !important; }
.iti--allow-dropdown .iti__flag-container { height: 100%; padding: 0; border-radius: 6px 0 0 6px; display: flex; align-items: center; }
.iti__selected-flag { padding: 0 8px 0 12px; }
.custom-tel-input-wrapper label { left: 60px; }

.custom-tel-input-wrapper input:not(:placeholder-shown) + label,
.custom-tel-input-wrapper input:focus + label { left: 12px; }


/*******-------------Popup Contact form------------*************/

.tourradar-redirect-message .loading-spinner {
  border: 4px solid rgba(0, 0, 0, .1);
  border-left-color: #007bff; 
  border-radius: 50%;
  width: 30px;
  height: 30px;
  animation: spin 1s linear infinite;
  margin: 15px auto; 
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* Custom Pop-up Overlay */
#custom-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* Dark semi-transparent background */
    display: none; /* Hidden by default */
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    z-index: 9999; /* Ensure it's above everything else */
    overflow-y: auto; /* Enable scrolling if content is too tall */
    padding: 20px; /* Padding around the popup content */
    box-sizing: border-box; /* Include padding in width/height */
}

/* Custom Pop-up Content */
#custom-popup-content {
    background-color: #fff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    position: relative;
    max-width: 600px; /* Adjust max width as needed */
    width: 90%; /* Responsive width */
    text-align: center;
    box-sizing: border-box; /* Include padding in width/height */
    margin:0 auto;
}

/* Pop-up Title */
#custom-popup-content h2 {
    margin-top: 0;
    color: #333;
    font-size: 2em; /* Adjust as needed */
}

/* Pop-up Description */
#custom-popup-content p {
    color: #666;
    margin-bottom: 25px;
}

/* Close button for the pop-up */
.close-popup-btn {
    position: absolute;
    top: 15px;
    right: 15px;
    background: none;
    border: none;
    font-size: 2.5em; /* Make it large and visible */
    line-height: 1;
    cursor: pointer;
    color: #aaa;
    transition: color 0.2s ease-in-out;
}

.close-popup-btn:hover {
    color: #333;
}