/* ==========================================
   ATX AI Referral Popup (Clean Reset)
   ========================================== */

:root {
  --atx-ai-panel-bg: var(--panel, #16181d);
  --atx-ai-panel-bg2: var(--panel2, #0f0f12);
  --atx-ai-text: var(--text, #f7f9fc);
  --atx-ai-muted: var(--muted, #c9ced6);
  --atx-ai-brand: var(--brand, #D4AF37);
  --atx-ai-link: var(--link, #9ecbff);
}

/* ===== FLOATING OPEN BUTTON (BOTTOM RIGHT) ===== */
#atx-ai-open {
  position: fixed;
  right: 14px;          /* hugs the right edge a bit more */
  bottom: 90px;
  z-index: 9998;

  padding: 8px 14px;    /* smaller footprint */
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,0.6);
  cursor: pointer;

  font-size: 14px;      /* reduced text size */
  line-height: 1.2;
  text-align: right;
  max-width: 220px;     /* forces wrap */
  white-space: normal;  /* allows two lines */

  box-shadow: 0 8px 18px rgba(0,0,0,0.45);
  background: radial-gradient(circle at top left, rgba(255,255,255,0.12), transparent 55%),
              linear-gradient(135deg, var(--atx-ai-brand), #f4d777);
  color: #111;
  font-weight: 600;

  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}


#atx-ai-open:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 32px rgba(0,0,0,0.6);
  filter: brightness(1.05);
}

#atx-ai-open:active {
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(0,0,0,0.6);
}


@media (max-width: 600px) {
  #atx-ai-open {
    display: block;
    position: fixed;
    right: 16px;
    left: auto;
    bottom: 80px;

    margin: 0;                 /* no auto-centering */
    text-align: right !important;
	  font-size: 16px;   /* ← THIS controls the button text size on iPhone */
  }
}


/* ===== MODAL SHELL ===== */
#atx-ai-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#atx-ai-modal.atx-ai-open {
  display: block;
}

.atx-ai-backdrop {
  position: fixed;
  inset: 0;
  background: radial-gradient(circle at top, rgba(212,175,55,0.18), transparent 60%),
              rgba(0,0,0,0.8);
}

/* ===== PANEL (DESKTOP) ===== */
.atx-ai-panel {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 520px;
  width: calc(100% - 40px);
  max-height: 90vh;
  background: radial-gradient(circle at top left, rgba(255,255,255,0.04), transparent 60%),
              linear-gradient(145deg, var(--atx-ai-panel-bg2), var(--atx-ai-panel-bg));
  color: var(--atx-ai-text);
  border-radius: 16px;
  padding: 20px 22px 16px;
  box-shadow: 0 25px 70px rgba(0,0,0,0.85);
  border: 1px solid rgba(212,175,55,0.6);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* ===== PANEL (MOBILE / iPHONE) ===== */
@media (max-width: 600px) {
  #atx-ai-modal {
    align-items: flex-start;
  }

  .atx-ai-panel {
    top: 0;
    left: 0;
    transform: none;
    width: 100% !important;
    max-width: 100% !important;
    height: 100vh !important;
    max-height: 100vh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    padding: 16px 14px 18px !important;
  }
}

/* ===== CLOSE BUTTON (GOLD CIRCLE) ===== */
.atx-ai-close {
  position: absolute;
  top: 8px;
  right: 12px;
  font-size: 32px;
  width: 44px;
  height: 44px;
  line-height: 44px;
  text-align: center;
  border-radius: 50%;
  background: #D4AF37;
  color: #000;
  border: none;
  cursor: pointer;
  z-index: 9999;
}

.atx-ai-close:hover {
  filter: brightness(1.05);
}

/* safe-area tweak for notched phones */
@supports(padding: env(safe-area-inset-top)) {
  .atx-ai-close {
    top: calc(8px + env(safe-area-inset-top));
  }
}

/* ===== HEADER ===== */
.atx-ai-header {
  position: relative;
  margin: 10px 0 6px;
  padding-top: 12px;
}

/* “ATX Luxury Connectors – Smart Match” pill */
.atx-ai-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .14em;
  border: 1px solid rgba(212,175,55,0.7);
  background: rgba(0,0,0,0.35);
  color: var(--atx-ai-muted);
  margin-bottom: 6px;
}

.atx-ai-header h2 {
  margin: 0;
  font-size: 20px;
  letter-spacing: .04em;
  line-height: 1.25;
}

.atx-ai-sub {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--atx-ai-muted);
  line-height: 1.4;
}

/* ===== SMART MATCH / Q&A TOGGLE ===== */
#atx-ai-modal .atx-ai-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 10px 0 8px;
  padding: 3px;
  border-radius: 999px;
  background: #0e1016;
  border: 1px solid rgba(212, 175, 55, 0.55);
  max-width: 280px;
  width: 100%;
  pointer-events: auto;
}

/* no decorative line anymore */
#atx-ai-modal .atx-ai-toggle::after {
  content: none;
}

/* buttons inside toggle */
#atx-ai-modal .atx-ai-mode-btn {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  outline: none;
  box-shadow: none;

  flex: 1 1 0;
  border-radius: 999px;
  font-size: 11px;
  padding: 6px 18px;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  font-weight: 500;
  color: #c3c7d8;
  line-height: 1.3;
  cursor: pointer;
  white-space: nowrap;
  touch-action: manipulation;
}

#atx-ai-modal .atx-ai-mode-btn:hover {
  color: #ffffff;
}

/* active selection */
#atx-ai-modal .atx-ai-mode-btn.atx-ai-mode-active {
  background: #d4af37;
  color: #11141d;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.6);
}

/* ===== FORM LAYOUT ===== */
#atx-ai-form {
  margin-top: 8px;
}

.atx-ai-row {
  margin-bottom: 9px;
}

.atx-ai-row.atx-ai-half {
  width: 49%;
  display: inline-block;
}

.atx-ai-row.atx-ai-half:first-of-type {
  margin-right: 2%;
}

.atx-ai-row label {
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .11em;
  color: var(--atx-ai-muted);
  margin-bottom: 3px;
  line-height: 1.3;
}

.atx-ai-row input,
.atx-ai-row textarea {
  width: 100%;
  box-sizing: border-box;
  border-radius: 7px;
  border: 1px solid #343948;
  padding: 7px 9px;
  font-size: 13px;
  background: rgba(10,11,16,0.85);
  color: var(--atx-ai-text);
  outline: none;
  line-height: 1.3;
}

.atx-ai-row input:focus,
.atx-ai-row textarea:focus {
  border-color: var(--atx-ai-brand);
  box-shadow: 0 0 0 1px rgba(212,175,55,0.7);
}

#atx-ai-desc {
  min-height: 110px;
}


/* Toggle inside form: give it row-like spacing */
#atx-ai-form .atx-ai-toggle {
  margin-top: 4px;
  margin-bottom: 12px;
}


/* ===== MAIN ACTION BUTTON ===== */
#atx-ai-submit {
  width: 100%;
  margin-top: 10px;
  border-radius: 999px;
  border: none;
  padding: 14px 24px;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: #f1c75b;
  color: #111217;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.55);
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

#atx-ai-submit:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

#atx-ai-submit:active {
  filter: brightness(0.96);
  transform: translateY(0);
}

/* ===== STATUS ===== */
.atx-ai-status {
  min-height: 18px;
  margin-top: 8px;
  font-size: 12px;
  color: var(--atx-ai-muted);
  line-height: 1.4;
}

.atx-ai-status span.atx-ai-dots::after {
  content: "•••";
  display: inline-block;
  animation: atx-ai-dots 1s infinite steps(3, end);
  margin-left: 4px;
}

@keyframes atx-ai-dots {
  0%   { clip-path: inset(0 0 0 66%); }
  50%  { clip-path: inset(0 0 0 33%); }
  100% { clip-path: inset(0 0 0 0); }
}

/* ===== RESULTS ===== */
.atx-ai-results {
  margin-top: 6px;
  font-size: 13px;
}

.atx-ai-results h3 {
  margin: 4px 0 6px;
  font-size: 14px;
}

.atx-ai-card {
  border-radius: 10px;
  border: 1px solid #343a4d;
  padding: 7px 9px;
  margin-bottom: 6px;
  background: radial-gradient(circle at top left, rgba(212,175,55,0.18), transparent 60%);
}

.atx-ai-card-title {
  font-weight: 600;
  font-size: 13px;
  margin-bottom: 1px;
}

.atx-ai-card-seat {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--atx-ai-muted);
}

.atx-ai-card-strength {
  margin-top: 3px;
  font-size: 11px;
}

.atx-ai-card-tags {
  margin-top: 4px;
  font-size: 11px;
  color: var(--atx-ai-muted);
}

.atx-ai-card-tags span {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 999px;
  border: 1px solid #3f4558;
  margin-right: 4px;
  margin-bottom: 3px;
}

.atx-ai-card a {
  color: var(--atx-ai-link);
  text-decoration: underline;
  font-size: 11px;
}

/* ===== FOOTER ===== */
.atx-ai-footer {
  margin-top: 12px;
  border-top: 1px dashed #34384a;
  padding-top: 6px;
  font-size: 11px;
  color: var(--atx-ai-muted);
  line-height: 1.4;
}

/* Force calendar link color consistently */
.atx-ai-footer a {
  color: #1e88e5 !important;   /* clean professional blue */
  text-decoration: underline;
}

.atx-ai-footer a:hover {
  color: #1565c0 !important;
}

/* ===== THEME SAFETY OVERRIDES (stop hero CSS from leaking) ===== */

.atx-ai-panel * {
  box-sizing: border-box;
}

.atx-ai-panel p {
  position: static !important;
  margin: 0 0 4px !important;
  line-height: 1.4 !important;
}

.atx-ai-panel h1,
.atx-ai-panel h2,
.atx-ai-panel h3,
.atx-ai-panel span {
  position: static !important;
  float: none !important;
  margin: 0 0 4px !important;
  line-height: 1.4 !important;
  white-space: normal !important;
}

.atx-ai-row {
  position: relative !important;
}

.atx-ai-panel label {
  position: static !important;
  float: none !important;
  display: block !important;
  margin: 0 0 3px !important;
  line-height: 1.3 !important;
}

/* ===== FORCE PILL TO MATCH DESKTOP POSITION ON MOBILE ===== */
@media (max-width: 820px) {

  /* Lock header layout structure */
  #atx-ai-modal .atx-ai-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  /* Keep pill visually separated from the form */
  #atx-ai-modal .atx-ai-toggle {
    order: 1;
    margin-top: 0 !important;
    margin-bottom: 14px !important;
    position: relative !important;
  }

  /* Push form content BELOW the pill cleanly */
  #atx-ai-modal #atx-ai-form {
    order: 2;
    margin-top: 8px !important;
  }

  /* Ensure description text does not wrap over pill */
  #atx-ai-modal .atx-ai-sub {
    margin-bottom: 6px !important;
  }
}

/* ===== ENSURE ATX AI HEADER IS ALWAYS VISIBLE (OVERRIDE THEME) ===== */
.atx-ai-header {
  display: block !important;
  position: relative !important;
  margin: 6px 0 4px !important;
}

.atx-ai-header .atx-ai-pill,
.atx-ai-header #atx-ai-title,
.atx-ai-header #atx-ai-sub {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* ===== DISTINCT AI Q&A RESPONSE PANEL ===== */
#atx-ai-modal .atx-ai-section {
  background: linear-gradient(180deg, #11141d, #0c0f16);
  border-left: 4px solid #d4af37;
  padding: 16px 18px;
  margin-top: 16px;
  border-radius: 10px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.45);
}

/* Title inside Q&A */
#atx-ai-modal .atx-ai-section h3 {
  margin-top: 0;
  color: #d4af37;
  font-size: 15px;
  letter-spacing: 0.03em;
}

/* Main AI answer text */
#atx-ai-modal .atx-ai-section p {
  color: #f1f1f1;
  font-size: 14px;
  line-height: 1.55;
}

/* Optional visual cue */
#atx-ai-modal .atx-ai-section::before {
  content: "AI ANSWER";
  font-size: 10px;
  letter-spacing: 0.2em;
  color: rgba(212, 175, 55, 0.75);
  display: block;
  margin-bottom: 6px;
}

/* ===== CONCIERGE QA CALLOUT ===== */
#atx-ai-modal .atx-ai-section-qa {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 12px;
  background: radial-gradient(circle at top left, rgba(255,255,255,0.06), rgba(0,0,0,0.75));
  border: 1px solid rgba(212, 175, 55, 0.7);
}

#atx-ai-modal .atx-ai-qa-badge {
  display: inline-block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(212, 175, 55, 0.16);
  color: #f7f9fc;
  border: 1px solid rgba(212, 175, 55, 0.7);
}

#atx-ai-modal .atx-ai-qa-main {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.55;
  color: #f7f9fc;
}

#atx-ai-modal .atx-ai-qa-links {
  margin-top: 10px;
  border-top: 1px dashed rgba(201, 206, 214, 0.35);
  padding-top: 8px;
}

#atx-ai-modal .atx-ai-qa-links h4,
#atx-ai-modal .atx-ai-qa-related h4 {
  margin: 8px 0 4px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #c9ced6;
}

#atx-ai-modal .atx-ai-qa-links a {
  text-decoration: underline;
}

#atx-ai-modal .atx-ai-qa-related {
  margin-top: 8px;
  border-top: 1px dashed rgba(201, 206, 214, 0.35);
  padding-top: 8px;
  font-size: 13px;
  line-height: 1.5;
}

/* Hide AI floating button on the Calendar page only */
body.calendar-page #atx-ai-open {
  display: none !important;
}

.atx-ai-section-summary {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid rgba(212, 175, 55, 0.5);
  background: rgba(0, 0, 0, 0.35);
}

.atx-ai-summary-text {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.6;
  color: #e5e5e5;
}