/* AI Advisor Card – visual style matches Get Started */
#ai-advisor{ padding: 56px 0; }
#ai-advisor .aa-container{ max-width:1120px; margin:0 auto; padding:0 20px; }
#ai-advisor .aa-header{ text-align:center; margin-bottom:14px; }
#ai-advisor .aa-eyebrow{ letter-spacing:.18em; text-transform:uppercase; color:#ff8a00; font-weight:800; font-size:13px; }
#ai-advisor .aa-title{ margin:.2em 0; font-size: clamp(26px, 4.6vw, 42px); color:#0b1f35; }

#ai-advisor .aa-card{ background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:18px; box-shadow:0 18px 46px rgba(2,132,199,.08); padding:24px; }
#ai-advisor .aa-form{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:18px; }
#ai-advisor .aa-row.aa-span-2{ grid-column: 1 / -1; }
#ai-advisor .aa-label{ display:block; font-weight:700; margin:4px 0 6px; color:#0b1f35; }
#ai-advisor .aa-input, #ai-advisor .aa-select, #ai-advisor .aa-textarea{
  width:100%; height:44px; padding:10px 12px; border-radius:12px; border:1px solid #d1d5db; background:#f8fafc; color:#0b1f35;
}
#ai-advisor .aa-textarea{ height:auto; min-height:110px; resize:vertical; }
#ai-advisor .aa-actions{ display:flex; gap:14px; align-items:center; justify-content:center; margin-top:14px; }
#ai-advisor .aa-actions.aa-span-2{ grid-column: 1 / -1; }
#ai-advisor .aa-btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:12px 18px; border-radius:9999px; border:1px solid transparent;
  background:linear-gradient(90deg, var(--accent-1,#ffb703), var(--accent-2,#ff8a00)); color:#fff; font-weight:800; cursor:pointer;
  box-shadow:0 14px 28px rgba(255,138,0,.28); transition: transform .15s ease, box-shadow .2s ease;
}
#ai-advisor .aa-btn:hover{ transform:translateY(-1px); box-shadow:0 18px 36px rgba(255,138,0,.34); }
#ai-advisor .aa-btn[disabled]{ opacity:.6; cursor:not-allowed; transform:none; box-shadow:none; }
#ai-advisor .aa-hint{ color:#64748b; font-size:13px; }
#ai-advisor #aa-usage{ margin-left:4px; }
#ai-advisor .aa-usage-num{ color:#16a34a; font-weight:900; font-size:18px; margin-left:6px; }

#ai-advisor .aa-results{ margin-top:18px; display:none; grid-template-columns: repeat(3, minmax(0,1fr)); gap:14px; }
#ai-advisor .aa-cardlet{ background:#f8fafc; border:1px solid #e2e8f0; border-radius:14px; padding:14px; color:#334155; line-height:1.7; }
#ai-advisor .aa-cardlet h4{ margin:0 0 6px; font-size:15px; color:#0b1f35; }
#ai-advisor .aa-cardlet p{ margin:0; white-space:pre-wrap; }
#ai-advisor .aa-cardlet pre{ margin:0; white-space:pre-wrap; font-family: inherit; font-size: 14px; line-height: 1.7; color:#334155; }
#ai-advisor .aa-loading{ color:#64748b; font-style:italic; }
#ai-advisor .aa-error{ color:#ef4444; font-weight:700; grid-column:1 / -1; }

/* toast card when result returns */
/* optional toast (currently unused) */
.aa-toast{ position:fixed; right:24px; bottom:24px; background:#0b1319; color:#e5eef7; border:1px solid rgba(255,255,255,.14); border-radius:14px; padding:12px 14px; box-shadow:0 10px 26px rgba(0,0,0,.28); z-index:1100; max-width:min(420px, 90vw); opacity:0; transform:translateY(8px); animation: aa-toast-in .22s ease-out forwards; }
.aa-toast .aa-toast-close{ background:none; border:none; color:#fff; opacity:.8; cursor:pointer; float:right; font-size:18px; line-height:1; }
.aa-toast p{ margin:0; font-size:14px; }
@keyframes aa-toast-in{ to { opacity:1; transform:translateY(0); } }

/* ===== Modal overlay for result ===== */
.aa-modal{ position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1200; display:flex; align-items:center; justify-content:center; padding:20px; }
.aa-modal-card{ width:min(1040px, 96vw); max-height:86vh; overflow:auto; background:#fff; border-radius:18px; border:1px solid rgba(0,0,0,.08); box-shadow:0 22px 60px rgba(0,0,0,.35); padding:18px; }
.aa-modal-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 6px 10px 6px; border-bottom:1px solid #e2e8f0; }
.aa-modal-title{ font-weight:900; color:#0b1f35; margin:0; }
.aa-modal-close{ background:none; border:1px solid #e2e8f0; border-radius:10px; width:34px; height:34px; cursor:pointer; }
.aa-modal-body{ padding-top:12px; }
.aa-modal-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:14px; }
@media (max-width: 900px){ .aa-modal-grid{ grid-template-columns:1fr; } }

@media (max-width: 760px){
  #ai-advisor .aa-form{ grid-template-columns: 1fr; }
  #ai-advisor .aa-results{ grid-template-columns: 1fr; }
}