/* GEO onboarding wizard — programbay-aeo-geo-wizard-flow look
   Scoped under #geoWizard so shell/app link & article styles cannot break the card. */

#geoWizard{
  display:block;
  position:relative;
  z-index:2;
  width:100%;
  max-width:1260px;
  margin:0 auto;
  padding:8px 0 28px;
  font-family:var(--g-font);
  color:var(--g-ink);
}
#geoWizard[hidden]{
  display:none !important;
}
/* 위저드가 열려 있으면 대시보드 요소는 모두 숨긴다 (온보딩·신규 사이트 공통) */
body.geo-wizard-active .geo-onboard-intro,
body.geo-wizard-active .geo-onboard-steps,
body.geo-wizard-active .geo-grid,
body.geo-wizard-active #autopilotPanel,
body.geo-wizard-active .geo-diag-stack,
body.geo-wizard-active #diagSolutionBar,
body.geo-wizard-active #multiSiteOverview,
body.geo-wizard-active #multiSiteOverviewPage,
body.geo-needs-onboarding .geo-onboard-intro,
body.geo-needs-onboarding .geo-onboard-steps,
body.geo-needs-onboarding .geo-grid,
body.geo-needs-onboarding #autopilotPanel,
body.geo-needs-onboarding .geo-diag-stack,
body.geo-needs-onboarding #multiSiteOverview,
body.geo-needs-onboarding #multiSiteOverviewPage{
  display:none !important;
}
body.geo-wizard-active #view-home,
body.geo-needs-onboarding #view-home{
  max-width:none;
  margin:0;
  padding:8px 4px 24px;
  position:relative;
  overflow:auto;
}
body.geo-wizard-active #view-home::before,
body.geo-wizard-active #view-home::after,
body.geo-needs-onboarding #view-home::before,
body.geo-needs-onboarding #view-home::after{
  display:none !important;
  content:none !important;
}
/* 멀티 브랜드 모드에서도 위저드는 보여야 한다 */
body.geo-multi-overview-mode.geo-wizard-active #geoWizard[data-single-site-only]{
  display:block !important;
}

#geoWizard .gw-stepbar{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  width:100%;
  margin:0 auto;
  padding:8px;
  border:1px solid rgba(0,0,0,.055);
  border-radius:24px;
  background:rgba(255,255,255,.86);
  box-shadow:var(--g-shadow);
}
html[data-theme="dark"] #geoWizard .gw-stepbar,
html[data-theme="black"] #geoWizard .gw-stepbar{
  background:rgba(44,44,46,.92);
  border-color:rgba(255,255,255,.08);
}
#geoWizard .gw-step{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:58px;
  padding:0 12px;
  border:0;
  border-radius:17px;
  background:transparent;
  color:var(--g-muted);
  font-size:14px;
  font-weight:900;
  line-height:1.28;
  text-align:center;
  cursor:default;
  font-family:inherit;
}
#geoWizard .gw-step span{
  display:grid;
  flex:none;
  width:23px;height:23px;
  place-items:center;
  border-radius:50%;
  background:var(--g-soft,#f5f5f7);
  color:var(--g-muted,#6e6e73);
  font-size:11px;
  font-weight:900;
}
html[data-theme="dark"] #geoWizard .gw-step span,
html[data-theme="black"] #geoWizard .gw-step span{background:var(--g-panel);color:var(--g-muted)}
#geoWizard .gw-step.is-active{
  background:var(--g-accent);
  color:var(--g-on-accent,#fff);
  box-shadow:0 1px 2px color-mix(in srgb, var(--g-accent) 22%, transparent);
}
#geoWizard .gw-step.is-active span{background:var(--g-on-accent,#fff);color:var(--g-accent)}
#geoWizard .gw-step.is-done{opacity:.72}
#geoWizard .gw-step.is-clickable{cursor:pointer}
#geoWizard .gw-step.is-clickable:hover{background:color-mix(in srgb, var(--g-ink) 4%, transparent)}
#geoWizard .gw-step.is-active.is-clickable:hover{background:var(--g-accent-2)}
#geoWizard .gw-step:focus-visible{
  outline:2px solid color-mix(in srgb, var(--g-accent) 55%, transparent);
  outline-offset:2px;
}

#geoWizard .gw-guide{
  width:min(100%,1240px);
  margin:20px auto 0;
  min-height:72px;
}
#geoWizard .gw-guide-block{display:none}
#geoWizard .gw-guide-block.is-active{display:block}
#geoWizard .gw-guide-block p{
  margin:0 0 6px;
  color:var(--g-ink);
  font-size:16px;
  line-height:1.55;
}
#geoWizard .gw-guide-block strong{color:var(--g-ink);font-weight:900}
#geoWizard .gw-guide-block .gw-eg{color:var(--g-accent);font-weight:700}
#geoWizard .gw-guide-block a{color:var(--g-link)}

#geoWizard .gw-stage{
  position:relative;
  display:grid;
  place-items:start center;
  min-height:520px;
  padding:28px 0 8px;
}
#geoWizard .gw-panel{
  display:none;
  box-sizing:border-box;
  width:min(100%,480px);
  min-height:500px;
  padding:34px;
  border:1px solid rgba(0,0,0,.07);
  border-radius:34px;
  background:#fff;
  box-shadow:var(--g-shadow-strong);
}
html[data-theme="dark"] #geoWizard .gw-panel,
html[data-theme="black"] #geoWizard .gw-panel{
  background:rgba(44,44,46,.96);
  border-color:rgba(255,255,255,.08);
}
#geoWizard .gw-panel.is-active{display:flex;flex-direction:column}
#geoWizard .gw-panel[hidden]{display:none !important}
#geoWizard .gw-panel.gw-wide{width:min(100%,760px);min-height:620px}

#geoWizard .gw-mark{
  position:relative;
  flex:none;
  width:34px;height:34px;
  max-width:34px;max-height:34px;
  margin:0 auto 14px;
  border-radius:9px;
  background:linear-gradient(145deg,#101012,#65656a);
  overflow:hidden;
}
#geoWizard .gw-mark::after{
  position:absolute;inset:7px;
  border:2px solid rgba(255,255,255,.94);
  border-radius:4px;
  content:"";
  transform:rotate(45deg);
}
#geoWizard .gw-panel h1{
  margin:0;
  color:#050505;
  font-size:26px;
  font-weight:900;
  line-height:1.16;
  text-align:center;
}
html[data-theme="dark"] #geoWizard .gw-panel h1,
html[data-theme="black"] #geoWizard .gw-panel h1{color:#f5f5f7}
#geoWizard .gw-sub{
  margin:10px auto 26px;
  color:var(--g-muted-2,#86868b);
  font-size:14px;
  line-height:1.55;
  text-align:center;
}
#geoWizard .gw-field{margin-top:16px}
#geoWizard .gw-field label{
  display:block;
  margin-bottom:8px;
  color:var(--g-ink);
  font-size:13px;
  font-weight:800;
  line-height:1.35;
}
#geoWizard .gw-input-wrap{
  position:relative;
  display:block;
}
#geoWizard .gw-input-wrap svg{
  position:absolute;top:50%;left:12px;
  width:17px !important;height:17px !important;
  max-width:17px;max-height:17px;
  color:#9a9aa0;fill:none !important;stroke:currentColor;
  stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7;
  transform:translateY(-50%);
  pointer-events:none;
  overflow:visible;
}
#geoWizard .gw-panel input,
#geoWizard .gw-panel textarea{
  box-sizing:border-box;
  width:100%;
  border:1px solid var(--g-line,#d2d2d7);
  border-radius:11px;
  background:var(--g-input-bg,#fff);
  color:var(--g-ink);
  font-size:14px;
  line-height:1.45;
  outline:none;
  font-family:inherit;
  transition:border-color .18s ease, box-shadow .18s ease;
}
#geoWizard .gw-panel input{height:42px;padding:0 13px}
#geoWizard .gw-input-wrap input{padding-left:38px}
#geoWizard .gw-panel textarea{min-height:104px;padding:12px 13px;resize:vertical}
#geoWizard .gw-panel input:focus,
#geoWizard .gw-panel textarea:focus{
  border-color:var(--g-accent);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--g-accent) 16%, transparent);
  outline:none;
}
#geoWizard .gw-notes{
  display:grid;gap:8px;
  margin:18px 0 0;padding:0;list-style:none;
}
#geoWizard .gw-notes li,
#geoWizard .gw-micro,
#geoWizard .gw-hint{
  color:var(--g-muted);
  font-size:12px;
  line-height:1.55;
}
#geoWizard .gw-notes li::before,
#geoWizard .gw-micro::before{content:"※ "}
#geoWizard .gw-micro{margin:14px 0 0;text-align:center}
#geoWizard .gw-hint{margin:8px 0 0}
#geoWizard .gw-divider{
  height:1px;margin:22px 0 16px;background:var(--g-line);
}
#geoWizard .gw-row{display:grid;grid-template-columns:1fr;gap:12px}
#geoWizard .gw-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:18px;
}
#geoWizard .gw-panel > .gw-actions:last-child{margin-top:auto;padding-top:18px}
#geoWizard .gw-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  min-height:42px;
  height:auto;
  width:auto;
  aspect-ratio:auto;
  border:0;
  border-radius:10px;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
  font-family:inherit;
  line-height:1.2;
}
#geoWizard .gw-btn.primary{background:var(--g-accent);color:var(--g-on-accent,#fff)}
#geoWizard .gw-btn.primary:hover{background:var(--g-accent-2)}
#geoWizard .gw-btn.secondary{background:var(--g-soft);color:var(--g-ink);border:1px solid var(--g-line)}
#geoWizard .gw-btn.secondary:hover{background:color-mix(in srgb, var(--g-ink) 5%, var(--g-soft))}
#geoWizard .gw-btn.wide{width:100%;margin-top:auto}
#geoWizard .gw-notes{margin-bottom:24px}
#geoWizard .gw-btn:disabled{opacity:.55;cursor:not-allowed}
#geoWizard .gw-btn:focus-visible{
  outline:2px solid color-mix(in srgb, var(--g-accent) 55%, transparent);
  outline-offset:2px;
}
#geoWizard .gw-nosite{
  display:inline-flex;
  margin-top:10px;
  border:0;
  background:transparent;
  color:var(--g-link);
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  padding:0;
  font-family:inherit;
}
#geoWizard .gw-loader-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  min-height:224px;
}
#geoWizard .gw-loader-row p{margin:0;color:var(--g-ink);font-size:14px;line-height:1.5}
#geoWizard .gw-loader{
  flex:none;
  width:52px;height:52px;border-radius:50%;
  background:conic-gradient(#5f6a73,#cad2db 36%,#edf1f5 60%,#5f6a73);
  animation:gw-spin .9s linear infinite;
  mask:radial-gradient(farthest-side,transparent calc(100% - 10px),#000 calc(100% - 9px));
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 10px),#000 calc(100% - 9px));
}
@keyframes gw-spin{to{transform:rotate(1turn)}}

#geoWizard .gw-empty{
  display:grid;
  min-height:280px;
  place-items:center;
}
#geoWizard .gw-generate{min-width:250px;margin-top:0!important}
#geoWizard .gw-q-add{
  display:grid;
  grid-template-columns:minmax(0,1fr) 110px;
  gap:8px;
  align-items:center;
  margin-top:16px;
  padding:7px;
  border:1px solid var(--g-line);
  border-radius:12px;
  background:var(--g-panel,#fff);
}
#geoWizard .gw-q-add.is-invalid{
  border-color:#d92d20;
  box-shadow:0 0 0 3px rgba(217,45,32,.1);
}
#geoWizard .gw-q-add input{border:0;box-shadow:none;height:38px}
#geoWizard .gw-q-add button{
  min-height:38px;border:0;border-radius:9px;
  background:var(--g-accent);color:var(--g-on-accent,#fff);font-size:14px;font-weight:800;cursor:pointer;
  font-family:inherit;
}
#geoWizard .gw-q-add button:hover{background:var(--g-accent-2)}
#geoWizard .gw-q-add button:focus-visible{
  outline:2px solid color-mix(in srgb, var(--g-accent) 55%, transparent);
  outline-offset:2px;
}
#geoWizard .gw-q-list{
  height:320px;max-height:320px;overflow:auto;
  padding:0 12px 0 0;
  scrollbar-gutter:stable;
}
#geoWizard .gw-q-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) 28px;
  gap:12px;
  align-items:start;
  min-height:58px;
  padding:14px 0;
  border-bottom:1px solid var(--g-line);
}
#geoWizard .gw-q-item span{
  min-width:0;color:var(--g-ink);font-size:15px;line-height:1.5;
  overflow-wrap:anywhere;word-break:keep-all;
}
#geoWizard .gw-q-item button{
  width:26px;height:26px;margin-top:-1px;border:0;border-radius:50%;
  background:transparent;color:#86868b;font-size:18px;cursor:pointer;
}

@media (max-width:1100px){
  #geoWizard .gw-stepbar{display:flex;overflow-x:auto;scrollbar-width:none}
  #geoWizard .gw-stepbar::-webkit-scrollbar{display:none}
  #geoWizard .gw-step{flex:0 0 auto;min-width:150px}
}
@media (max-width:760px){
  #geoWizard .gw-step{min-height:46px;min-width:140px;font-size:13px}
  #geoWizard .gw-panel,
  #geoWizard .gw-panel.gw-wide{width:100%;min-height:0;padding:24px;border-radius:26px}
  #geoWizard .gw-panel h1{font-size:24px}
  #geoWizard .gw-actions,
  #geoWizard .gw-q-add{grid-template-columns:1fr}
  #geoWizard .gw-btn.wide{margin-top:28px}
  #geoWizard .gw-loader-row{min-height:180px;flex-direction:column;text-align:center}
}