/* =========================================
   1. PHONE INPUT: STRICT STATIC DIAL CODE (FORCED LTR)
   ========================================= */
#afaaq-widget-wrapper .iti,
#afaaq-widget-wrapper .iti--rtl { width: 100%; display: block; direction: ltr !important; text-align: left !important; position: relative; }
#afaaq-widget-wrapper .iti__flag-container,
#afaaq-widget-wrapper .iti--rtl .iti__flag-container { left: 0 !important; right: auto !important; top: 0 !important; bottom: 0 !important; display: flex !important; align-items: center !important; padding: 0 0 0 10px !important; background: transparent !important; z-index: 10 !important; }
#afaaq-widget-wrapper .iti__selected-flag,
#afaaq-widget-wrapper .iti__selected-country { display: flex !important; align-items: center !important; background: transparent !important; height: 100% !important; outline: none !important; padding-right: 5px !important; position: relative; }
#afaaq-widget-wrapper .iti__flag { box-shadow: none !important; }
#afaaq-widget-wrapper .iti__arrow { margin-left: 5px !important; border-top-color: #555 !important; opacity: 0.8; }
#afaaq-widget-wrapper .iti__selected-dial-code { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-size: 14px !important; font-weight: 700 !important; color: #000000 !important; padding-left: 8px !important; margin-left: 0 !important; background-color: transparent !important; z-index: 20; line-height: normal !important; }
#afaaq-widget-wrapper .iti input,
#afaaq-widget-wrapper .iti--rtl input { padding-left: 100px !important; padding-right: 12px !important; text-align: left !important; direction: ltr !important; height: 50px !important; }
#afaaq-widget-wrapper .iti__country-list { direction: ltr !important; text-align: left !important; z-index: 99999999 !important; background: #fff !important; color: #333 !important; width: 300px !important; white-space: normal !important; margin-top: 5px !important; border-radius: 4px; box-shadow: 0 5px 15px rgba(0,0,0,0.15); }
#afaaq-widget-wrapper .iti__country-name { color: #333 !important; font-size: 13px; margin-right: 5px; }
#afaaq-widget-wrapper .iti__dial-code { color: #777 !important; font-size: 12px; }
#afaaq-widget-wrapper .iti__divider { border-bottom: 1px solid #eee !important; margin: 5px 0 !important; }
#afaaq-widget-wrapper .iti__search-input { width: 90% !important; margin: 8px auto !important; border: 1px solid #ccc !important; padding: 6px !important; color: #000 !important; display: block !important; }

/* =========================================
   2. MAIN WIDGET LAYOUT
   ========================================= */
#afaaq-widget-wrapper { background: #fff; font-family: inherit; max-width: 900px; margin: 0 auto; padding: 30px; border-radius: 12px; box-shadow: 0 5px 25px rgba(0,0,0,0.05); box-sizing: border-box; position: relative; }
#afaaq-widget-wrapper * { box-sizing: border-box; outline: none; }
#afaaq-widget-wrapper .afaaq-nav { display: flex; gap: 20px; border-bottom: 1px solid #eee; margin-bottom: 25px; padding: 0; }
#afaaq-widget-wrapper .nav-btn { background: none; border: none; padding: 10px 15px; font-weight: 600; color: #777; cursor: pointer; border-bottom: 2px solid transparent; font-size: 16px; font-family: inherit; }
#afaaq-widget-wrapper .nav-btn.active { color: #0066cc; border-bottom-color: #0066cc; }

#afaaq-widget-wrapper .form-row { display: flex; gap: 10px; margin-bottom: 15px; flex-wrap: wrap; position: relative; }

/* Desktop Defaults */
#afaaq-widget-wrapper .col-half { flex: 1 1 250px; }
#afaaq-widget-wrapper .col-third { flex: 1 1 180px; }
#afaaq-widget-wrapper .col-full { flex: 1 1 100%; }
#afaaq-widget-wrapper .col-date { flex: 0 0 140px; max-width: 140px; }
#afaaq-widget-wrapper .col-time { flex: 0 0 75px; max-width: 75px; }
#afaaq-widget-wrapper .col-mix { flex: 1; min-width: 200px; }

/* --- MOBILE FIX --- */
@media (max-width: 768px) {
  #afaaq-widget-wrapper .form-row { 
      flex-direction: row; 
      flex-wrap: wrap; 
      gap: 2%; /* Reliable gap percentage */
  }

  /* Full Width Fields (From/To, Name/Phone) */
  #afaaq-widget-wrapper .col-half, 
  #afaaq-widget-wrapper .col-third,
  #afaaq-widget-wrapper .col-full {
    flex: 0 0 100% !important; 
    max-width: 100% !important;
  }

  /* ROW 1: Date & Time (Side-by-Side) */
  #afaaq-widget-wrapper .col-date { 
      flex: 0 0 58% !important; /* Date gets 58% */
      max-width: 58% !important; 
  }
  #afaaq-widget-wrapper .col-time { 
      flex: 0 0 38% !important; /* Time gets 38% */
      max-width: 38% !important; 
      /* 58+38+2(gap) = 98% -> Fits perfectly */
  }

  /* ROW 2: Pax & Vehicle Widget (Full Width on new line) */
  #afaaq-widget-wrapper .col-mix {
      flex: 0 0 100% !important;
      max-width: 100% !important;
      margin-top: 5px; /* Small spacing from date/time */
  }
}

#afaaq-widget-wrapper label { display: block; font-size: 13px; font-weight: 600; color: #555; margin-bottom: 5px; font-family: inherit; }
#afaaq-widget-wrapper input:not([type=radio]):not(.iti__search-input), 
#afaaq-widget-wrapper select,
#afaaq-widget-wrapper textarea { width: 100%; background: #fff; border: 1px solid #ddd; border-radius: 6px; padding: 12px; font-size: 14px; color: #333; transition: 0.2s; font-family: inherit; appearance: none; -webkit-appearance: none; -moz-appearance: none; }
#afaaq-widget-wrapper input:not([type=radio]):not(.iti__search-input), #afaaq-widget-wrapper select { height: 50px !important; min-height: 50px !important; max-height: 50px !important; line-height: 50px !important; padding: 0 12px; }
#afaaq-widget-wrapper textarea { height: auto !important; min-height: 80px; resize: vertical; }
#afaaq-widget-wrapper input[type="date"] { line-height: 50px; padding-right: 12px; }
#afaaq-widget-wrapper input:focus, #afaaq-widget-wrapper select:focus, #afaaq-widget-wrapper textarea:focus { border-color: #0066cc; box-shadow: 0 0 0 3px rgba(0,102,204,0.1); }
#afaaq-widget-wrapper .input-wrap { position: relative; }
#afaaq-widget-wrapper .input-icon { position: absolute; top: 50%; transform: translateY(-50%); opacity: 0.5; pointer-events: none; z-index: 2; display: flex; align-items: center; }
#afaaq-widget-wrapper[dir="ltr"] .input-icon { right: 12px; }
#afaaq-widget-wrapper[dir="rtl"] .input-icon { left: 12px; }

/* =========================================
   3. NEW PAX/VEHICLE POPOVER STYLES
   ========================================= */
.afaaq-pax-widget { position: relative; width: 100%; }
.afaaq-pax-trigger { width: 100%; height: 50px; background: #fff; border: 1px solid #ddd; border-radius: 6px; display: flex; align-items: center; padding: 0 12px; font-size: 14px; color: #333; cursor: pointer; user-select: none; }
.afaaq-pax-trigger:after { content: ''; position: absolute; right: 12px; top: 50%; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #666; transform: translateY(-50%); pointer-events: none; }
[dir="rtl"] .afaaq-pax-trigger:after { right: auto; left: 12px; }
.afaaq-pax-dropdown { display: none; position: absolute; top: 105%; left: 0; width: 100%; min-width: 280px; background: #fff; border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); z-index: 9999; padding: 10px; }
.afaaq-pax-dropdown.show { display: block; }
.counter-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid #f0f0f0; }
.counter-row:last-child { border-bottom: none; }
.counter-label { font-weight: 600; font-size: 14px; color: #333; }
.counter-controls { display: flex; align-items: center; gap: 15px; }
.counter-btn { width: 32px; height: 32px; border-radius: 50%; border: 1px solid #0066cc; background: #fff; color: #0066cc; font-size: 18px; font-weight: bold; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; line-height: 1; transition: 0.2s; }
.counter-btn:hover { background: #0066cc; color: #fff; }
.counter-val { font-size: 16px; font-weight: 700; min-width: 20px; text-align: center; }

/* Existing Dropdown/Modal/Radio Styles */
.afaaq-custom-dropdown { list-style: none !important; margin: 0 !important; padding: 0 !important; position: absolute !important; top: 100%; left: 0; width: 100%; background: #ffffff !important; border: 1px solid #ddd !important; z-index: 999999 !important; max-height: 250px; overflow-y: auto; box-shadow: 0 5px 15px rgba(0,0,0,0.15) !important; border-radius: 0 0 6px 6px; }
.afaaq-custom-dropdown li { padding: 12px 15px !important; cursor: pointer; border-bottom: 1px solid #eee; font-size: 14px; background: #ffffff !important; color: #333 !important; display: flex; align-items: center; gap: 8px; }
.afaaq-custom-dropdown li:hover { background: #f2f2f2 !important; }
#afaaq-widget-wrapper .vehicle-carousel { overflow-x: auto; margin-bottom: 20px; padding-bottom: 5px; }
#afaaq-widget-wrapper .vehicle-track { display: flex; gap: 15px; }
#afaaq-widget-wrapper .vehicle-card { min-width: 220px; background: #fff; border: 2px solid #f0f0f0; border-radius: 12px; padding: 15px; cursor: pointer; text-align: center; transition: 0.2s; }
#afaaq-widget-wrapper .vehicle-card.active { border-color: #0066cc; background: #f0f8ff; }
#afaaq-widget-wrapper .vehicle-card img { width: 100%; height: 130px; object-fit: cover; border-radius: 8px; margin-bottom: 10px; cursor: zoom-in; }
#afaaq-widget-wrapper .vehicle-name { font-size: 15px; font-weight: 700; display: block; font-family: inherit; }
#afaaq-widget-wrapper .vehicle-pass { font-size: 12px; color: #666; }
#afaaq-widget-wrapper .class-tabs-container { display: flex; gap: 10px; overflow-x: auto; margin-bottom: 15px; }
#afaaq-widget-wrapper .class-tab-btn { background: #f8f9fa; border: 1px solid #ddd; padding: 8px 15px; border-radius: 20px; cursor: pointer; font-size: 13px; font-weight: 600; white-space: nowrap; font-family: inherit; }
#afaaq-widget-wrapper .class-tab-btn.active { background: #0066cc; color: #fff; border-color: #0066cc; }
#afaaq-widget-wrapper .billing-box { background: #fcfcfc; border: 1px dashed #ccc; border-radius: 8px; padding: 15px; margin-bottom: 20px; }
#afaaq-widget-wrapper .discount-row { display: flex; gap: 10px; margin-bottom: 10px; }
#afaaq-widget-wrapper #coupon_code { flex: 1; }
#afaaq-widget-wrapper #btn_apply { background: #333; color: #fff; border: none; padding: 0 20px; border-radius: 6px; font-weight: 600; cursor: pointer; height: 50px; font-family: inherit; }
#afaaq-widget-wrapper .bill-line { display: flex; justify-content: space-between; font-size: 14px; margin-bottom: 5px; color: #555; }
#afaaq-widget-wrapper .total-line { font-size: 18px; font-weight: 800; border-top: 1px solid #eee; padding-top: 10px; margin-top: 5px; color: #000; }
#afaaq-widget-wrapper .text-green { color: #28a745; }
#afaaq-widget-wrapper .submit-btn { width: 100%; height: 50px; background: #0066cc; color: #fff; border: none; border-radius: 6px; font-size: 18px; font-weight: 700; cursor: pointer; font-family: inherit; }
#afaaq-widget-wrapper .submit-btn:hover { background: #0055aa; }
#afaaq-widget-wrapper .trip-type-row { display: flex; gap: 20px; margin-bottom: 15px; }
#afaaq-widget-wrapper .radio-label { display: flex; align-items: center; gap: 5px; cursor: pointer; font-weight: 600; font-size: 14px; margin: 0; font-family: inherit; }
#afaaq-widget-wrapper input[type="radio"] { width: 16px; height: 16px; margin: 0; accent-color: #0066cc; }
.afaaq-modal { display: none; position: fixed; z-index: 99999999; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.85); cursor: pointer; }
.afaaq-modal-body { margin: 5% auto; background:#fff; padding:20px; width:90%; max-width:700px; border-radius:8px; position:relative; text-align:center; cursor: default; }
.afaaq-close { position:absolute; top:10px; right:15px; font-size:30px; cursor:pointer; color: #dc3545; font-weight: bold; z-index:10; }
.afaaq-modal-slider-wrapper { position: relative; display: flex; align-items: center; justify-content: center; margin-top:15px; }
#afaaq-slider-container img { width: 100%; border-radius: 6px; box-shadow: 0 5px 15px rgba(0,0,0,0.1); max-height: 60vh; object-fit: contain; }
.afaaq-arrow { background: rgba(0,0,0,0.5); color: #fff; border: none; border-radius: 50%; width: 40px; height: 40px; font-size: 20px; cursor: pointer; position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; display: flex; align-items: center; justify-content: center; }
.afaaq-arrow:hover { background: rgba(0,0,0,0.8); }
[dir="ltr"] .afaaq-prev { left: 10px; }
[dir="ltr"] .afaaq-next { right: 10px; }
[dir="rtl"] .afaaq-prev { right: 10px; } 
[dir="rtl"] .afaaq-next { left: 10px; }
#afaaq-popup-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.85); z-index: 99999; overflow-y: auto; display: flex; align-items: flex-start; justify-content: center; backdrop-filter: blur(5px); padding: 20px 0; }
.afaaq-popup-content { width: 95%; max-width: 900px; background: transparent; padding: 10px; margin: auto 0; }
body.afaaq-popup-active { overflow: hidden; }