/* Site-native AI itinerary modal. The old expanding floating form was intentionally removed. */
:where(.ai-itinerary, .ai-itinerary *) { box-sizing: border-box; }

body.ai-itinerary-modal-open { overflow: hidden; }

.ai-itinerary {
  position: fixed;
  inset: 0;
  z-index: 150;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 4vw, 3rem);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 180ms ease, visibility 0s linear 180ms;
}

.ai-itinerary.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

.ai-itinerary__scrim {
  position: absolute;
  inset: 0;
  background: rgba(12, 26, 20, 0.76);
  backdrop-filter: blur(7px);
}

.ai-itinerary__form {
  position: relative;
  width: min(100%, 720px);
  display: grid;
  grid-template-columns: 1.08fr 1fr 1fr auto;
  gap: 0.7rem;
  align-items: end;
  border: 1px solid rgba(229, 192, 39, 0.58);
  border-radius: 0;
  background: #fdfaf6;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.38);
  padding: clamp(1.15rem, 3vw, 1.85rem);
  transform: translateY(1rem) scale(0.98);
  transition: transform 220ms cubic-bezier(.2, .8, .2, 1);
}

.ai-itinerary.is-open .ai-itinerary__form { transform: translateY(0) scale(1); }

.ai-itinerary__powered {
  grid-column: 1 / -1;
  display: block;
  margin-bottom: 0;
  color: var(--logo-green, #006b3f);
  font: 700 0.74rem/1.2 "Google Sans", Arial, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ai-itinerary__title {
  grid-column: 1 / -1;
  margin: -0.25rem 2.5rem 0.2rem 0;
  color: var(--charcoal, #2b2926);
  font: 400 clamp(2rem, 5vw, 3.25rem)/0.95 "Special Gothic Condensed One", Impact, sans-serif;
  letter-spacing: 0.015em;
  text-transform: uppercase;
}

.ai-itinerary__field { display: grid; gap: 0.38rem; min-width: 0; }

.ai-itinerary__field span {
  color: var(--charcoal, #2b2926);
  font: 700 0.68rem/1 "Google Sans", Arial, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ai-itinerary__field input {
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(43, 41, 38, 0.25);
  border-radius: 0;
  background: #fff;
  color: var(--charcoal, #2b2926);
  padding: 0.75rem 0.8rem;
  outline: none;
  font: 500 0.92rem/1.2 "Google Sans", Arial, sans-serif;
}

.ai-itinerary__field input:focus { border-color: var(--green, #458962); box-shadow: 0 0 0 3px rgba(69, 137, 98, 0.16); }

.ai-itinerary__submit {
  min-height: 48px;
  border: 1px solid var(--logo-green, #006b3f);
  border-radius: 0;
  background: var(--logo-green, #006b3f);
  color: #fff;
  cursor: pointer;
  padding: 0.75rem 1rem;
  font: 700 0.75rem/1 "Google Sans", Arial, sans-serif;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  transition: background 160ms ease, transform 160ms ease;
}

.ai-itinerary__submit:hover, .ai-itinerary__submit:focus-visible { background: var(--green, #458962); transform: translateY(-2px); outline: 0; }
.ai-itinerary__submit-compact { display: none; }
.ai-itinerary__submit-expanded { display: inline; }

.ai-itinerary__close {
  position: absolute;
  top: 0.72rem;
  right: 0.72rem;
  width: 2.25rem;
  height: 2.25rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(43, 41, 38, 0.24);
  border-radius: 50%;
  background: transparent;
  color: var(--charcoal, #2b2926);
  cursor: pointer;
  font: 400 1.5rem/1 Arial, sans-serif;
}

.ai-itinerary__close:hover, .ai-itinerary__close:focus-visible { border-color: var(--logo-green, #006b3f); color: var(--logo-green, #006b3f); outline: 0; }

.ai-itinerary__status {
  grid-column: 1 / -1;
  min-height: 1.1em;
  margin: 0.2rem 0 0;
  color: var(--logo-green, #006b3f);
  font: 600 0.82rem/1.3 "Google Sans", Arial, sans-serif;
}

.ai-itinerary.is-loading .ai-itinerary__form { cursor: wait; }
.ai-itinerary.is-loading .ai-itinerary__form > * { opacity: 0.64; pointer-events: none; }
.ai-itinerary.is-loading .ai-itinerary__status { opacity: 1; }

.floating-itinerary-trigger {
  position: fixed;
  top: auto;
  right: clamp(1.5rem, 4vw, 2.5rem);
  bottom: clamp(1.5rem, 4vw, 2.5rem);
  left: auto;
  z-index: 100;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: clamp(185px, 15vw, 228px);
  height: 48px;
  overflow: hidden;
  border: 2px solid color-mix(in srgb, var(--logo-green, #006bb8) 64%, transparent);
  border-radius: 10px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--logo-green, #006bb8) 98%, transparent) 0%, color-mix(in srgb, var(--logo-green, #006bb8) 98%, transparent) 58%, color-mix(in srgb, var(--logo-green, #006bb8) 96%, transparent) 100%) padding-box,
    linear-gradient(135deg, color-mix(in srgb, var(--logo-green, #006bb8) 92%, transparent), color-mix(in srgb, var(--logo-green, #006bb8) 84%, transparent)) border-box;
  box-shadow:
    inset 0 1px 0 rgba(255, 250, 242, 0.22),
    inset 0 -1px 0 rgba(0, 0, 0, 0.22),
    0 18px 42px rgba(0, 0, 0, 0.34),
    0 0 0 1px rgba(255, 250, 242, 0.08);
  color: #fffaf2;
  cursor: pointer;
  padding: 0;
  font: 800 0.78rem/1 var(--mini-font, "Plus Jakarta Sans", Arial, sans-serif);
  letter-spacing: 0;
  text-transform: uppercase;
  transition: transform 200ms ease, border-color 200ms ease, background 200ms ease, box-shadow 200ms ease;
}

.floating-itinerary-trigger::before {
  position: absolute;
  inset: -35% auto -35% -45%;
  z-index: 0;
  width: 28%;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.12) 18%, rgba(255, 255, 255, 0.72) 50%, rgba(255, 255, 255, 0.12) 82%, transparent 100%);
  transform: translateX(-120%) skewX(-20deg);
  animation: itinerary-trigger-shine 3.8s ease-in-out infinite;
}

@keyframes itinerary-trigger-shine {
  0%, 54% { transform: translateX(-120%) skewX(-20deg); }
  82%, 100% { transform: translateX(560%) skewX(-20deg); }
}

.floating-itinerary-trigger:hover,
.floating-itinerary-trigger:focus-visible {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--logo-green, #006bb8) 94%, transparent);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--logo-green, #006bb8) 92%, #ffffff) 0%, var(--logo-green, #006bb8) 58%, var(--logo-green, #006bb8) 100%) padding-box,
    linear-gradient(135deg, color-mix(in srgb, var(--logo-green, #006bb8) 98%, transparent), color-mix(in srgb, var(--logo-green, #006bb8) 90%, transparent)) border-box;
  box-shadow:
    inset 0 1px 0 rgba(255, 250, 242, 0.26),
    inset 0 -1px 0 rgba(0, 0, 0, 0.22),
    0 22px 56px rgba(0, 0, 0, 0.4),
    0 0 30px color-mix(in srgb, var(--logo-green, #006bb8) 32%, transparent);
  outline: 0;
}

@media (prefers-reduced-motion: reduce) {
  .floating-itinerary-trigger::before {
    animation: none;
  }
}

.floating-itinerary-trigger__icon {
  position: relative;
  z-index: 1;
  flex: 0 0 40px;
  width: 40px;
  display: grid;
  place-items: center;
}

.floating-itinerary-trigger__icon.material-symbols-outlined {
  font-size: 20px;
  font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24;
}

.floating-itinerary-trigger__icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.floating-itinerary-trigger__label {
  position: relative;
  z-index: 1;
  min-width: max-content;
  padding: 0 0.75rem 0 0.1rem;
  opacity: 1;
  transform: translateX(0);
}

@media (max-width: 760px) {
  .ai-itinerary__form { grid-template-columns: 1fr; gap: 0.85rem; padding-top: 3.6rem; }
  .ai-itinerary__powered, .ai-itinerary__title, .ai-itinerary__status { grid-column: auto; }
  .ai-itinerary__submit { width: 100%; }
  .floating-itinerary-trigger {
    /* Keep the trigger pinned to the mobile viewport while the page scrolls. */
    position: fixed;
    inset:
      auto
      max(0.85rem, env(safe-area-inset-right, 0px))
      calc(0.85rem + env(safe-area-inset-bottom, 0px))
      auto;
    width: min(185px, calc(100vw - 1.3rem));
    height: 44px;
  }
  .floating-itinerary-trigger:hover,
  .floating-itinerary-trigger:focus-visible { transform: translateY(-2px); }
  .floating-itinerary-trigger__icon { flex-basis: 34px; width: 34px; }
  .floating-itinerary-trigger__icon.material-symbols-outlined { font-size: 20px; }
  .floating-itinerary-trigger__icon svg { width: 20px; height: 20px; }
}

/* AIMCT Namibia 2026 visual language. */
.ai-itinerary__scrim { background: rgba(3, 29, 38, 0.82); }

.ai-itinerary__form {
  border-color: rgba(7, 143, 240, 0.58);
  background: #f5fbfb;
}

.ai-itinerary__field input {
  border-color: rgba(6, 46, 56, 0.24);
  color: #062e38;
}

.ai-itinerary__field input:focus {
  border-color: #078ff0;
  box-shadow: 0 0 0 3px rgba(7, 143, 240, 0.18);
}

.ai-itinerary__submit:hover,
.ai-itinerary__submit:focus-visible { background: #006bb8; }

/* Match the site's shared subtly rounded surfaces. */
:where(.ai-itinerary, .floating-itinerary-trigger) {
  --itinerary-radius: var(--container-corner-radius, 0.25rem);
}

.ai-itinerary__form {
  border-radius: var(--itinerary-radius);
  border-color: color-mix(in srgb, #078ff0 48%, rgba(6, 46, 56, 0.2));
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(244, 250, 250, 0.98)) padding-box,
    linear-gradient(135deg, rgba(7, 143, 240, 0.65), rgba(69, 137, 98, 0.38)) border-box;
  box-shadow: 0 30px 90px rgba(3, 29, 38, 0.42), 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.ai-itinerary__field input,
.ai-itinerary__submit,
.floating-itinerary-trigger { border-radius: var(--itinerary-radius); }

.ai-itinerary__field input {
  background: rgba(255, 255, 255, 0.9);
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.ai-itinerary__field input:hover { background: #fff; }

.ai-itinerary__submit {
  background: linear-gradient(135deg, #006bb8, #078ff0);
  box-shadow: 0 8px 18px rgba(0, 107, 184, 0.24);
}

@media (max-width: 760px) {
  .ai-itinerary { padding: 0.85rem; }
  .ai-itinerary__form { width: min(100%, 34rem); }
}