@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&display=swap");
@import url("../shared/fcs-engage-parity.css");

html,
body {
  margin: 0;
  max-width: 100%;
  min-height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.wrap,
.card,
#step-0,
#step-0 .grid,
#step-0 .section,
#bulkWrapper,
.bulk-controls {
  min-width: 0;
  max-width: 100%;
}

#step-0 .route-button,
#step-0 .btn,
#assignAccountPill,
#bulkWrapper #bulkBtn,
.bulk-controls input[type="file"] {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

#accountSearch {
  min-height: 42px;
  text-align: center;
}

#step-0 .home-account-context {
  display: none !important;
}

.modal-backdrop {
  align-items: center;
  justify-content: center;
  z-index: 2147483000;
  background: #fff;
}

.modal-card {
  margin: auto;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.modal-title-row {
  position: relative;
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-title-row h2 {
  margin: 0;
  text-align: center;
  width: 100%;
}

.modal-placeholder {
  min-height: 24px;
  margin-top: 12px;
  color: #5f6b7a;
  font-weight: 800;
  text-align: center;
}

#solutionsModal .modal-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#solutionsModal .solution-option {
  width: 100%;
  min-height: 52px;
  border-width: 2px !important;
  color: #072e5a !important;
}

#solutionsModal .solution-option-prep {
  background: #FED7AA !important;
  border-color: #EA580C !important;
  color: #9A3412 !important;
}

#solutionsModal .solution-option-install {
  background: #dff3df !important;
  border-color: #2f8a45 !important;
}

#solutionsModal .solution-option-reorder {
  background: #dce8ff !important;
  border-color: #0b5cab !important;
}

.modal-back-pill {
  width: 100%;
  min-height: 52px;
  margin-top: 4px;
  border-color: #072e5a !important;
  background: #072e5a !important;
  color: #fff !important;
}

.modal-close-x {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  border: 2px solid #072e5a;
  border-radius: 999px;
  background: #fff;
  color: #072e5a;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

#step-0 .grid.g-two {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
  max-width: none;
  margin: 0 auto;
}

#step-0 .grid.g-two > div:first-child {
  width: 100%;
}

#step-0 .section.routes {
  margin-top: clamp(20px, 3vw, 32px);
  padding-top: 0;
}

#step-0 .route-button[hidden] {
  display: none !important;
}

#step-0 .route-button.selected {
  border-color: #0b5cab;
  background: #dce8ff !important;
  box-shadow: 0 2px 5px rgba(7, 46, 90, 0.1), inset 0 0 0 1px #0b5cab;
}

#bulkWrapper #bulkBtn {
  min-height: 46px;
}

#assignAccountPill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 20px;
  border-radius: 999px;
  border: 1px solid var(--fcs-border);
  background: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

#assignAccountPill.assign-on {
  background: #dce8ff;
  border-color: var(--fcs-accent);
}

#assignAccountPill.assign-off {
  background: #fff;
}

.bulk-controls input[type="file"] {
  flex: 1 1 180px;
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 767px) {
  .wrap {
    padding: 10px 10px calc(112px + env(safe-area-inset-bottom));
  }

  .card {
    padding: 14px 14px calc(112px + env(safe-area-inset-bottom));
  }

  #solutionsModal .modal-card {
    top: auto;
  }

  .bulk-controls input[type="file"] {
    min-width: 0;
    flex: 1 1 auto;
  }

}

/* FCS brand typography */
html, body, button, input, select, textarea, option {
  font-family: "Montserrat", Arial, sans-serif !important;
}

/* Intelligence-centered staff home. The parent ClearSquare header remains authoritative. */
.intelligence-home.wrap { width:100%; max-width:none; margin:0; padding:0; }
.intelligence-home > .card { width:100%; max-width:none; min-height:100svh; margin:0; padding:0; border:0; border-radius:0; box-shadow:none; background:transparent; }
.intelligence-home #err:empty { display:none; }
.intelligence-home { isolation:isolate; position:relative; overflow:hidden; background:#eaf2fa; }
.intelligence-home::before { content:""; position:absolute; inset:0; z-index:-1; background:url("./approved-alpine-sunrise.png") center bottom / cover no-repeat; }
#step-0 .home-heading { position:relative; display:grid; grid-template-columns:68px max-content max-content; justify-content:center; gap:24px; align-items:center; min-height:108px; margin:0; padding:16px 24px; background:#fff; border-bottom:1px solid #dbe5f0; text-align:left; }
#step-0 .home-brand-mark { display:block; width:68px; height:68px; margin:0; object-fit:contain; }
#step-0 .home-heading h1 { color:#082957; font-size:clamp(28px,2.75vw,46px); font-weight:900; letter-spacing:-.055em; line-height:1.1; }
#step-0 .home-heading h1 span { color:#f58216; }
#step-0 .home-heading p { justify-self:start; max-width:none; white-space:nowrap; margin:0; padding-left:24px; border-left:4px solid #fa891b; color:#082957; font-size:clamp(18px,1.8vw,30px); line-height:1.25; font-weight:800; letter-spacing:-.035em; }
#step-0 .section.routes.module-dashboard {
  --orbit-x:50%; --orbit-y:48%; --orbit-radius:clamp(240px,21vw,350px);
  --module-width:clamp(300px,25.3vw,424px); --module-height:clamp(98px,7.65vw,128px);
  display:block; position:relative; width:min(1672px,100%); height:max(680px,calc(100svh - 108px)); margin:0 auto; padding:0;
}
.intelligence-orbit { position:absolute; width:calc(2 * var(--orbit-radius)); height:calc(2 * var(--orbit-radius)); left:var(--orbit-x); top:var(--orbit-y); transform:translate(-50%,-50%); border-radius:50%; pointer-events:none; }
.intelligence-orbit::before,.intelligence-orbit::after,.orbit-track,.orbit-inner,.orbit-flow { content:""; position:absolute; border-radius:50%; }
.intelligence-orbit::before { inset:0; background:conic-gradient(#ff9400,#ff7900 95deg,#ffa72c 175deg,#08baff 185deg,#0075ec 265deg,#00b6ff 355deg,#ff9400); box-shadow:0 0 38px #43b8ff88,inset 0 0 42px white; }
.intelligence-orbit::after { inset:11%; border:2px solid #ffffffeb; box-shadow:0 0 18px white,inset 0 0 20px #fff; }
.orbit-track { inset:2.7%; border:1px solid #ffffffbd; box-shadow:0 0 0 18px #ffffff30,0 0 0 36px #ffffff20; }
.orbit-inner { inset:21%; border:3px solid white; box-shadow:0 0 16px #fff,0 0 30px #0f9fea; }
.orbit-flow { inset:6.4%; width:87.2%; height:87.2%; overflow:visible; animation:orbit-momentum 60s linear infinite; }
@keyframes orbit-momentum { to { transform:rotate(360deg); } }
/* Reference anchors are offsets from the same circle center/radius. */
#step-0 .module-dashboard > .module-card {
  position:absolute; left:calc(var(--orbit-x) + var(--module-x) * var(--orbit-radius)); top:calc(var(--orbit-y) + var(--module-y) * var(--orbit-radius)); transform:translate(-50%,-50%);
  z-index:2; display:grid; grid-template-columns:clamp(44px,3.6vw,60px) minmax(0,1fr); grid-template-rows:auto auto; align-content:center; column-gap:14px;
  width:var(--module-width); height:var(--module-height); min-height:0; padding:16px 26px; border:1px solid #ffffffb3; border-radius:65px; background:linear-gradient(135deg,#fff,#f7faff); color:#082957;
  box-shadow:0 12px 28px #123b662b; text-align:center; transition:box-shadow .2s,background .2s;
}
#step-0 .module-dashboard > .module-card:hover { background:#fff; box-shadow:0 14px 32px #0d416a45,0 0 0 2px #f9902955; }
#step-0 .module-dashboard > .module-card:focus-visible { outline:3px solid #082957; outline-offset:6px; }
#step-0 .module-card-title { justify-self:center; max-width:clamp(180px,14.5vw,242px); font-size:clamp(21px,1.9vw,32px); font-weight:800; line-height:1.05; letter-spacing:-.04em; }
#step-0 .module-card-description { display:block; min-height:0; margin:6px 0 0; font-size:clamp(11px,1.03vw,17px); font-weight:500; line-height:1.3; white-space:nowrap; }
#step-0 .module-icon { grid-row:1/3; display:grid; place-items:center; width:clamp(44px,3.6vw,60px); height:clamp(44px,3.6vw,60px); margin:0; color:#082957; background:none; border-radius:0; }
#step-0 .module-icon svg { display:block; width:100%; height:100%; }
#step-0 .module-icon .icon-accent { stroke:#f58216; stroke-width:2.1; }
#step-0 [data-route="sales"] { --module-x:0; --module-y:calc(-.82 + 16px / var(--orbit-radius)); }
#step-0 [data-route="service-sales"] { --module-x:1.17; --module-y:-.21; }
#step-0 [data-route="service-execution"] { --module-x:-.78; --module-y:.69; }
#step-0 [data-route="design-execution"] { --module-x:.78; --module-y:.69; }
#step-0 [data-route="program-assurance"] { --module-x:-1.17; --module-y:-.21; }
#step-0 .module-dashboard > #assetUploadButton { left:var(--orbit-x); top:var(--orbit-y); width:var(--orbit-radius); height:var(--orbit-radius); min-height:0; border:3px solid white; border-radius:50%; display:flex; flex-direction:column; gap:12px; justify-content:center; align-items:center; padding:20px; text-align:center; background:radial-gradient(circle at 45% 40%,#062757,#031841 74%) !important; color:white; box-shadow:0 0 0 7px #f98b18,0 0 0 10px #fff,0 14px 40px #08295766,inset 0 0 25px #005ca766; }
#step-0 [data-route="fcs-tools"] .module-card-title { color:#fff; max-width:85%; font-size:clamp(25px,2.2vw,37px); line-height:1.15; }
/* Preserve the original monogram geometry. The second copy restores its original
   orange dot over the white silhouette; no synthetic dot or lettering is drawn. */
#step-0 .module-icon.ei-symbol { --ei-scale:.72; position:relative; width:calc(210px * var(--ei-scale)); height:calc(146px * var(--ei-scale)); flex:none; overflow:hidden; margin:0; }
#step-0 .ei-symbol img { position:absolute; max-width:none; width:calc(300px * var(--ei-scale)); height:auto; left:calc(-45px * var(--ei-scale)); top:calc(-67px * var(--ei-scale)); filter:brightness(0) invert(1); }
#step-0 .ei-symbol img.ei-original-dot { filter:none; clip-path:inset(0 0 58% 68%); }
@media (max-width:1099px) {
  #step-0 .home-heading { grid-template-columns:50px max-content minmax(160px,330px); gap:12px; min-height:0; padding:20px 28px; }
  #step-0 .home-brand-mark { width:50px; height:50px; }
  #step-0 .home-heading h1 { font-size:32px; }
  #step-0 .home-heading p { font-size:18px; padding-left:16px; white-space:normal; }
  #step-0 .section.routes.module-dashboard { --orbit-radius:155px; --orbit-y:174px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; height:auto; padding:16px 28px 32px; }
  .intelligence-orbit::after { inset:26px; }.orbit-track { inset:10px; }.orbit-inner { inset:48px; }.orbit-flow { inset:20px; width:calc(100% - 40px); height:calc(100% - 40px); }
  #step-0 .module-dashboard > .module-card { position:relative; inset:auto; transform:none; width:100%; height:100%; min-height:92px; padding:16px 20px; }
  #step-0 .module-dashboard > #assetUploadButton { position:relative; inset:auto; transform:none; order:-1; grid-column:1/-1; justify-self:center; width:250px; height:250px; margin:32px 0 42px; gap:8px; }
  #step-0 [data-route="fcs-tools"] .module-card-title { font-size:23px; }
  #step-0 .module-icon.ei-symbol { --ei-scale:.7; }
  #step-0 .module-card-title { max-width:none; font-size:22px; }
  #step-0 [data-route="sales"] { grid-column:1/-1; width:min(100%,380px); justify-self:center; }
}
@media (max-width:600px) {
  #step-0 .home-heading { grid-template-columns:38px max-content; gap:8px; padding:16px 18px; }
  #step-0 .home-brand-mark { width:38px; height:38px; }
  #step-0 .home-heading h1 { font-size:28px; }
  #step-0 .home-heading p { grid-column:1/-1; border:0; padding:0; text-align:center; font-size:13px; font-weight:600; margin:4px 0 0; justify-self:center; }
  #step-0 .section.routes.module-dashboard { --orbit-radius:121px; --orbit-y:132px; grid-template-columns:minmax(0,1fr); padding:0 18px 22px; gap:10px; }
  #step-0 .module-dashboard > .module-card { grid-column:1; width:100%; min-height:72px; padding:12px 20px; grid-template-columns:38px minmax(0,1fr); gap:0 12px; }
  #step-0 .module-card-title { font-size:20px; }
  #step-0 .module-card-description { font-size:12px; margin-top:4px; white-space:normal; }
  #step-0 .module-icon,#step-0 .module-icon svg { width:36px; height:36px; }
  #step-0 .module-dashboard > #assetUploadButton { width:200px; height:200px; margin:32px 0; padding:14px; gap:8px; }
  #step-0 [data-route="fcs-tools"] .module-card-title { font-size:21px; }
  #step-0 .module-icon.ei-symbol { --ei-scale:.65; }
}
/* Satellite text is centered on the oval, independently of its icon. */
#step-0 .module-dashboard > .module-card:not(#assetUploadButton) {
  width:min(100%,var(--module-width)); height:var(--module-height); min-height:0; justify-self:center;
  grid-template-columns:minmax(0,1fr); grid-template-rows:26px 19px; gap:3px 0; padding:12px 44px;
}
#step-0 .module-card:not(#assetUploadButton) .module-icon {
  position:absolute; grid-row:auto; grid-column:auto; left:22px; top:50%; transform:translateY(-50%); width:42px; height:42px;
}
#step-0 .module-card:not(#assetUploadButton) .module-icon svg { width:100%; height:100%; }
#step-0 .module-card:not(#assetUploadButton) .module-card-title {
  justify-self:stretch; max-width:none; margin:0; color:#082957; font-size:21px; font-weight:800; line-height:26px; letter-spacing:-.025em; white-space:nowrap; text-align:center;
}
#step-0 .module-card:not(#assetUploadButton) .module-card-description {
  justify-self:stretch; margin:0; font-size:13px; font-weight:500; line-height:19px; white-space:nowrap; text-align:center;
}
@media (max-width:1099px) {
  #step-0 .section.routes.module-dashboard { --module-height:92px; }
  #step-0 .module-card:not(#assetUploadButton) .module-card-title { font-size:20px; }
  #step-0 .module-card:not(#assetUploadButton) .module-card-description { font-size:12px; }
}

@media (max-width:600px) {
  /* ClearSquare already supplies the mobile brand header. */
  #step-0 .home-heading { display:none; }
  #step-0 .module-card:not(#assetUploadButton) .module-icon { left:16px; width:36px; height:36px; }
  .intelligence-home { overflow-x:hidden; overflow-y:visible; }
  .intelligence-home > .card { min-height:0; }
  #step-0 .section.routes.module-dashboard { --module-width:100%; --module-height:72px; padding-bottom:calc(36px + env(safe-area-inset-bottom)); }
  #step-0 .module-card:not(#assetUploadButton) .module-card-title { font-size:20px; line-height:26px; }
  #step-0 .module-card:not(#assetUploadButton) .module-card-description { font-size:12px; line-height:19px; }
}

@media (prefers-reduced-motion:reduce) { .orbit-flow { animation:none; } #step-0 .module-dashboard > .module-card { transition:none; } }
