* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }
body { font-family: 'Mulish', system-ui, sans-serif; background: linear-gradient(180deg, #F6F4FB 0%, #F1F6F6 100%); }

/* Flex column + rm-footer's own margin-top:auto (app-chrome.css) pins the
   footer to the bottom of the viewport on short pages, matching every other
   app — without this the footer just sits after the content instead. */
.app-shell { min-height: 100vh; display: flex; flex-direction: column; }

/* app-chrome.css caps the shared header/footer at 1440px by default; every
   org-scoped app (vendor/physical/hardware) overrides that to the suite's
   real layout idiom — 90% width, no fixed cap — so the header/footer line up
   with this app's own 90%-wide content instead of running narrower/wider. */
.app-shell .rm-header-inner, .app-shell .rm-footer-inner { max-width: 90%; }

.loc-hero { background: linear-gradient(180deg, rgba(255,255,255,0.55), rgba(255,255,255,0)); }
.loc-hero-inner {
  max-width: 90%; width: 100%; margin: 0 auto; padding: 32px;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; flex-wrap: wrap;
}
.loc-title { font-family: 'Lexend', sans-serif; font-weight: 800; font-size: 38px; line-height: 1.08; letter-spacing: -0.5px; color: #16273F; margin: 0 0 6px; }
.loc-subtitle { font-size: 15px; color: #5F6A79; margin: 0; }
/* Matches Domains' .dl-add-btn exactly. */
.loc-add {
  display: inline-flex; align-items: center; gap: 9px; background: #E8402A; color: #fff; border: none;
  cursor: pointer; font-family: 'Lexend', sans-serif; font-weight: 600; font-size: 15px; padding: 12px 22px;
  border-radius: 999px; box-shadow: 0 6px 16px rgba(232,64,42,0.28); white-space: nowrap;
}
.loc-add:hover { background: #D6371F; }

.loc-main { flex: 1; max-width: 90%; width: 100%; margin: 0 auto; padding: 8px 32px 56px; }

.loc-prompt, .loc-empty { padding: 40px 20px; text-align: center; color: #5F6A79; font-size: 14.5px; background: #fff; border: 1px solid #EAEDF3; border-radius: 16px; }

/* ---- location detail page (list <-> single-item, like Domains' Overview) ---- */
.loc-back {
  display: inline-flex; align-items: center; gap: 7px; background: none; border: none; cursor: pointer;
  font-family: 'Lexend', sans-serif; font-weight: 600; font-size: 13.5px; color: #8791A0; margin: 24px 0 16px; padding: 0;
}
.loc-back:hover { color: #16273F; }
.loc-detail-head { margin-bottom: 24px; }
.loc-detail-name { font-family: 'Lexend', sans-serif; font-weight: 800; font-size: 38px; line-height: 1.1; letter-spacing: -0.4px; color: #16273F; margin: 0 0 6px; }
.loc-detail-address { font-size: 14px; color: #5F6A79; }
.loc-detail-body { max-width: 760px; }

.loc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
  gap: 20px;
}

/* White box, 24px padding all round — matches Domains' .dl-card exactly. */
.loc-card {
  display: flex; flex-direction: column; background: #fff; border: 1px solid #EAEDF3; border-radius: 20px;
  box-shadow: 0 4px 16px rgba(18,38,63,0.05); padding: 24px;
}
.loc-card.loc-skel { min-height: 320px; background: linear-gradient(90deg, #F3F5FA 25%, #EAEDF3 37%, #F3F5FA 63%); background-size: 400% 100%; animation: loc-shimmer 1.4s ease infinite; }
@keyframes loc-shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

/* Inset preview, like Domains' .dl-preview — rounded corners within the
   card's own padding, rather than bleeding to the card's edges. */
.loc-map { position: relative; height: 240px; border-radius: 14px; overflow: hidden; background: #E6ECF3; border: 1px solid #EEF1F6; margin-bottom: 20px; }
.loc-map svg { display: block; }
.loc-map-badge {
  position: absolute; bottom: 10px; left: 12px; background: rgba(255,255,255,0.94); border: 1px solid #D6DDE8;
  color: #16273F; font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 700; font-size: 10.5px;
  padding: 3px 8px; border-radius: 6px;
}

.loc-card-body { flex: 1; display: flex; flex-direction: column; }
.loc-card-headrow { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 5px; }
.loc-card-name { flex: 1; min-width: 0; font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 17px; color: #16273F; line-height: 1.25; }
.loc-card-address { font-size: 13px; color: #5F6A79; line-height: 1.5; margin-bottom: 13px; }
.loc-card-tags { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 15px; }
.loc-card-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding-top: 14px; border-top: 1px solid #EFF2F7; margin-top: auto; }
.loc-stat-value { font-family: 'Lexend', sans-serif; font-weight: 800; font-size: 18px; color: #16273F; line-height: 1.2; }
.loc-stat-label { font-size: 11.5px; color: #5F6A79; font-weight: 600; }
.loc-card-footrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; }

/* Matches Domains' .dl-view exactly. */
.loc-view {
  display: inline-flex; align-items: center; gap: 8px; background: #16273F; color: #fff; border: none;
  cursor: pointer; font-family: 'Lexend', sans-serif; font-weight: 600; font-size: 14px; padding: 11px 20px;
  border-radius: 12px; white-space: nowrap;
}
.loc-view:hover { background: #0F1C30; }
.loc-cadence { font-family: 'Lexend', sans-serif; font-weight: 600; font-size: 12px; color: #5F6A79; }
.loc-cadence.amber { color: #95530D; }

.loc-pill { display: inline-flex; align-items: center; gap: 5px; font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 10.5px; padding: 3px 9px; border-radius: 999px; border: 1px solid transparent; white-space: nowrap; }
.loc-pill-neutral { color: #5B6675; background: #F1F4FA; border-color: #E4E9F1; }
.loc-pill-blue { color: #1E56C0; background: #EAF1FC; border-color: #D6E4FB; }
.loc-pill-amber { color: #95530D; background: #FCF3E8; border-color: #F1E2C8; }

/* ---- wizard ---- */
.loc-wizard-overlay {
  position: fixed; inset: 0; z-index: 70; background: rgba(16,26,40,0.5); backdrop-filter: blur(5px);
}
.loc-wizard {
  position: fixed; inset: 0; z-index: 71; display: flex; align-items: center; justify-content: center; padding: 24px;
  pointer-events: none;
}
.loc-wizard.open { pointer-events: auto; }
.loc-wz-panel {
  width: 900px; max-width: 100%; max-height: 92vh; display: flex; flex-direction: column; background: #fff;
  border-radius: 22px; box-shadow: 0 34px 90px rgba(16,26,40,0.34);
}
.loc-wz-head { flex: 0 0 auto; padding: 26px 30px 0; }
.loc-wz-head-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 6px; }
.loc-wz-kicker { font-family: 'Lexend', sans-serif; font-weight: 800; font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: #5F6A79; margin-bottom: 5px; }
.loc-wz-title { font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 23px; color: #16273F; margin: 0; }
.loc-wz-close { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 11px; background: #F4F6FA; border: 1px solid #E4E8EF; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.loc-wz-blurb { font-size: 14.5px; color: #5F6A79; margin: 0 0 18px; line-height: 1.55; }
.loc-wz-steps { display: flex; gap: 7px; flex-wrap: wrap; padding-bottom: 18px; border-bottom: 1px solid #EFF2F7; }
.loc-step-pill {
  display: inline-flex; align-items: center; gap: 7px; background: #FBFCFE; border: 1.5px solid #EFF2F7;
  color: #5F6A79; border-radius: 999px; padding: 7px 13px; cursor: default; font-family: 'Lexend', sans-serif;
  font-weight: 600; font-size: 12.5px; white-space: nowrap;
}
.loc-step-pill.done { background: #fff; border-color: #E4E9F1; color: #3B4757; cursor: pointer; }
.loc-step-pill.on { background: #16273F; border-color: #16273F; color: #fff; font-weight: 700; cursor: pointer; }
.loc-step-pill:disabled { cursor: default; }
.loc-step-num { font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 10px; color: #5F6A79; }
.loc-step-pill.on .loc-step-num { color: rgba(255,255,255,0.75); }

.loc-wz-body { flex: 1; min-height: 0; overflow-y: auto; padding: 22px 30px; }
.loc-wz-error { background: #FCECEC; border: 1px solid #F5D5D5; color: #C0392B; border-radius: 12px; padding: 12px 14px; font-size: 13.5px; margin-bottom: 16px; }

.loc-q-list { display: flex; flex-direction: column; gap: 24px; }
.loc-q-sub { padding-left: 18px; border-left: 2px solid #EAF1FC; }
.loc-q-headrow { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; margin-bottom: 4px; }
.loc-q-code { font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 700; font-size: 11px; color: #5F6A79; background: #F1F4FA; border: 1px solid #E4E9F1; border-radius: 6px; padding: 2px 7px; }
.loc-q-code-sub { color: #1E56C0; background: #EAF1FC; border-color: #D6E4FB; }
.loc-q-label { font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 16px; color: #16273F; }
.loc-q-label-sub { font-size: 14.5px; }
.loc-q-multi-hint { font-size: 11.5px; color: #5F6A79; }
.loc-q-hint { font-size: 12.5px; color: #5F6A79; margin: 0 0 10px; line-height: 1.5; }

.loc-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.loc-chip {
  display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1.5px solid #E4E9F1; color: #5B6675;
  border-radius: 999px; padding: 8px 14px; cursor: pointer; font-family: 'Lexend', sans-serif; font-weight: 600;
  font-size: 13px; text-align: left;
}
.loc-chip.on { background: #16273F; border-color: #16273F; color: #fff; }
.loc-chip.on.unsure { background: #FCF3E8; border-color: #E0A21E; color: #95530D; }
.loc-unsure-icon { flex: 0 0 auto; }

.loc-region-select {
  margin-top: 10px; min-width: 260px; max-width: 100%; background: #fff; border: 1.5px solid #E4E9F1;
  border-radius: 11px; padding: 11px 13px; font-family: 'Lexend', sans-serif; font-weight: 600; font-size: 14px;
  color: #16273F; cursor: pointer;
}

.loc-fields-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin-top: 8px; }
.loc-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.loc-field-label { font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: #5F6A79; }
.loc-field-input { width: 100%; padding: 11px 13px; border: 1.6px solid #E4E9F1; border-radius: 11px; font-family: 'Mulish', sans-serif; font-size: 14.5px; color: #16273F; outline: none; }

.loc-devices { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.loc-device-row { display: flex; align-items: center; gap: 11px; flex-wrap: wrap; background: #FBFCFE; border: 1px solid #EFF2F7; border-radius: 12px; padding: 10px 13px; }
.loc-device-row.on { background: #F5F8FE; border-color: #B9CEF0; }
.loc-device-pick { display: flex; align-items: center; gap: 10px; flex: 1 1 auto; min-width: 0; background: none; border: none; padding: 0; cursor: pointer; text-align: left; font-family: 'Lexend', sans-serif; font-weight: 600; font-size: 13.5px; color: #16273F; }
.loc-device-box { flex: 0 0 auto; width: 20px; height: 20px; border-radius: 6px; display: flex; align-items: center; justify-content: center; background: #fff; border: 1.5px solid #CBD4E0; }
.loc-device-row.on .loc-device-box { background: #2F6FE0; border-color: #2F6FE0; }
.loc-device-stepper { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.loc-device-stepper-label { font-size: 11.5px; color: #5F6A79; }
.loc-step-btn { width: 26px; height: 26px; border-radius: 8px; background: #fff; border: 1px solid #DCE1E9; cursor: pointer; font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 14px; color: #3B4757; line-height: 1; }
.loc-device-count { min-width: 22px; text-align: center; font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 13px; color: #16273F; }

/* ---- review ---- */
.loc-review { display: flex; flex-direction: column; gap: 16px; }
.loc-review-skel { min-height: 220px; border-radius: 16px; background: linear-gradient(90deg, #F3F5FA 25%, #EAEDF3 37%, #F3F5FA 63%); background-size: 400% 100%; animation: loc-shimmer 1.4s ease infinite; }
.loc-review-pack { background: #F5F8FE; border: 1px solid #B9CEF0; border-radius: 16px; padding: 18px 20px; }
.loc-review-pack-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 9px; }
.loc-review-pack-kicker { font-family: 'Lexend', sans-serif; font-weight: 800; font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: #1E56C0; }
.loc-review-pack-id { font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 11px; color: #1E56C0; background: #fff; border: 1px solid #B9CEF0; border-radius: 6px; padding: 2px 8px; }
.loc-review-pack-name { font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 17px; color: #16273F; margin-bottom: 8px; }
.loc-review-doctrine { font-size: 13.5px; color: #33404F; line-height: 1.6; }
.loc-review-functional { display: flex; align-items: flex-start; gap: 10px; background: #FCF3E8; border: 1px solid #F1E2C8; border-radius: 12px; padding: 12px 14px; margin-top: 12px; font-size: 12.5px; color: #33404F; line-height: 1.5; }
.loc-review-overlays { display: flex; gap: 8px; flex-wrap: wrap; }
.loc-review-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 11px; }
.loc-review-stat { background: #fff; border: 1px solid #EAEDF3; border-radius: 14px; padding: 14px 16px; }
.loc-review-stat-value { font-family: 'Lexend', sans-serif; font-weight: 800; font-size: 24px; line-height: 1.2; color: #16273F; }
.loc-review-stat-label { font-size: 12px; color: #5F6A79; font-weight: 600; margin-top: 4px; }

.loc-review-panel { background: #fff; border: 1px solid #EAEDF3; border-radius: 16px; padding: 17px 19px; }
.loc-review-panel-head { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; margin-bottom: 11px; }
.loc-review-panel-title { font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 15px; color: #16273F; }
.loc-review-panel-note { font-size: 12.5px; color: #5F6A79; }
.loc-review-panel-rows { display: flex; flex-direction: column; gap: 9px; }
.loc-review-panel-empty { font-size: 13px; color: #5F6A79; font-style: italic; }
.loc-review-row { display: flex; align-items: flex-start; gap: 10px; }
.loc-review-row-dot { flex: 0 0 auto; width: 6px; height: 6px; border-radius: 50%; background: #B9CEF0; margin-top: 6px; }
.loc-review-row-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.loc-review-row-label { font-family: 'Lexend', sans-serif; font-weight: 600; font-size: 13.5px; color: #16273F; }
.loc-review-row-why { font-size: 12.5px; color: #5F6A79; line-height: 1.5; }
.loc-review-note { display: flex; align-items: flex-start; gap: 11px; background: #F7F9FC; border: 1px solid #EFF2F7; border-radius: 13px; padding: 14px 16px; font-size: 12.5px; color: #5F6A79; line-height: 1.55; }
.loc-review-note strong { color: #16273F; }

.loc-wz-foot { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 18px 30px 24px; border-top: 1px solid #EFF2F7; }
.loc-wz-back { background: #fff; border: 1px solid #DCE1E9; border-radius: 12px; padding: 12px 20px; cursor: pointer; font-family: 'Lexend', sans-serif; font-weight: 600; font-size: 14px; color: #5B6675; }
.loc-wz-next {
  background: #C9331D; color: #fff; border: none; border-radius: 12px; padding: 13px 22px; cursor: pointer;
  font-family: 'Lexend', sans-serif; font-weight: 700; font-size: 15px; box-shadow: 0 6px 18px rgba(201,51,29,0.26);
}
.loc-wz-next:disabled { background: #EDF0F5; color: #5B6675; border: 1px solid #DCE1E9; box-shadow: none; cursor: default; }
.loc-wz-hint { font-size: 12.5px; color: #5F6A79; }