:root {
  --qrm-blue: #d85f08;
  --qrm-blue-dark: #a94500;
  --qrm-orange: #ff7a1a;
  --qrm-teal: #147f7a;
  --qrm-teal-soft: #e6f5f4;
  --qrm-border: #c9d2d8;
  --qrm-text: #1f2933;
  --qrm-muted: #5d6975;
  --qrm-bg: #f5f8fa;
  --qrm-valid: #2e7d32;
  --qrm-invalid: #c62828;
  --qrm-warn: #996f00;
}

* { box-sizing: border-box; }
input[type="checkbox"] { width:1.15rem !important; height:1.15rem !important; min-height:0 !important; margin:.3rem .6rem .3rem 0; vertical-align:middle; display:inline-block; }

body {
  font-family: Arial, Helvetica, sans-serif;
  color: var(--qrm-text);
  background: radial-gradient(circle at 8% -10%, rgba(255, 122, 26, .12), transparent 24rem), var(--qrm-bg);
  margin: 0;
  padding: 0;
}

.portal-wrap {
  max-width: 980px;
  margin: 0 auto;
  padding: 24px 16px 60px;
}

.portal-card {
  background: #fff;
  border: 1px solid var(--qrm-border);
  border-top: 4px solid var(--qrm-orange);
  border-radius: 10px;
  padding: 24px;
  box-shadow: 0 3px 16px rgba(0, 0, 0, 0.06);
}

h1, h2, h3 { margin-top: 0; }
h1 { color: var(--qrm-blue-dark); }
h2 { color: var(--qrm-teal); }

.step-list {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 16px 0 24px;
  padding: 0;
  list-style: none;
}

.step-list li {
  border: 1px solid var(--qrm-border);
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 0.92rem;
  color: var(--qrm-muted);
  background: #fff;
}

.step-list li.active {
  background: var(--qrm-blue);
  border-color: var(--qrm-blue);
  color: #fff;
}

.form-stage[hidden] { display: none; }

.grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
}

.grid .full { grid-column: 1 / -1; }

.field { position: relative; margin-bottom: 14px; }
label { display: block; font-weight: 700; margin-bottom: 6px; }
.required::after { content: " *"; color: var(--qrm-invalid); }

input, select, textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--qrm-border);
  border-radius: 6px;
  padding: 8px 10px;
  font: inherit;
  background: #fff;
}

textarea { min-height: 94px; resize: vertical; }
input[readonly] { background: #eef3f5; }

input[data-state="valid"] { border: 2px solid var(--qrm-valid); }
input[data-state="invalid"] { border: 2px solid var(--qrm-invalid); }

.help { font-size: 0.9rem; color: var(--qrm-muted); margin-top: 6px; }
.help.invalid { color: var(--qrm-invalid); }
.help.valid { color: var(--qrm-valid); }

.suggestions {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid var(--qrm-border);
  max-height: 280px;
  overflow: auto;
  z-index: 9999;
  border-radius: 6px;
  box-shadow: 0 8px 18px rgba(0,0,0,0.12);
}

.suggestions .item {
  padding: 10px 12px;
  cursor: pointer;
  border-bottom: 1px solid #eef2f4;
}

.suggestions .item:hover,
.suggestions .item.active { background: #eef7fb; }
.suggestions small { display: block; color: var(--qrm-muted); margin-top: 2px; }

.notice {
  border: 1px solid #ead79c;
  background: #fff8df;
  color: #5d4500;
  padding: 12px 14px;
  border-radius: 6px;
  margin: 12px 0 16px;
}

.device-card {
  border: 1px solid #b9d8d6;
  border-left: 4px solid var(--qrm-teal);
  border-radius: 8px;
  padding: 16px;
  margin: 0 0 14px;
  background: linear-gradient(135deg, var(--qrm-teal-soft), #fbfdfe 55%);
}

.device-card h3 {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}

.actions {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 24px;
}

button {
  border: 0;
  background: var(--qrm-blue);
  color: #fff;
  border-radius: 6px;
  padding: 10px 16px;
  font-weight: 700;
  cursor: pointer;
}
button:hover { background: var(--qrm-blue-dark); }
button.secondary { background: #687887; }
button.warning { background: #a35f00; }
button.danger { background: #9e2a2a; }
button:disabled { opacity: 0.6; cursor: not-allowed; }

.review-box {
  white-space: pre-wrap;
  background: linear-gradient(135deg, #e6f5f4, #f1f5f8);
  border: 1px solid var(--qrm-border);
  border-radius: 6px;
  padding: 14px;
  font-family: Consolas, monospace;
  font-size: 0.92rem;
}

.success-box {
  border: 1px solid #b7d7b9;
  background: #edf9ef;
  color: #1f5b23;
  padding: 14px;
  border-radius: 6px;
  margin-top: 18px;
}

.error-box {
  border: 1px solid #e6b8b8;
  background: #fff0f0;
  color: #7a1717;
  padding: 14px;
  border-radius: 6px;
  margin-top: 18px;
}

@media (max-width: 760px) {
  .grid { grid-template-columns: 1fr; }
  .portal-card { padding: 18px; }
}

.summary-order {
  font-family: Arial, Helvetica, sans-serif;
  color: var(--qrm-text);
}

.summary-order table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0 16px;
  background: #fff;
}

.summary-order th,
.summary-order td {
  text-align: left;
  vertical-align: top;
  border: 1px solid var(--qrm-border);
  padding: 8px 10px;
}

.summary-order th {
  width: 190px;
  background: var(--qrm-teal-soft);
  color: #15504d;
}

.summary-device {
  border: 1px solid var(--qrm-border);
  background: #fff;
  border-radius: 6px;
  padding: 10px;
  margin-bottom: 10px;
}

.summary-order details {
  margin-top: 16px;
}

.summary-order pre,
.confirmation-text {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: #f8fafc;
  border: 1px solid var(--qrm-border);
  border-radius: 6px;
  padding: 12px;
}

.contact-panel {
  border: 1px solid #405462;
  border-radius: 9px;
  padding: 16px;
  margin: 20px 0 0;
  background: linear-gradient(120deg, #192f3b, #172832);
}

.contact-panel legend {
  padding: 0 8px;
  color: var(--qrm-text);
  font-weight: 700;
}

.contact-panel .help {
  margin: 0 0 14px;
}

.qboy-intake-panel {
  margin: 0 0 18px;
  padding: 12px 10px 11px;
  border: 1px solid #bfd2e0;
  border-radius: 10px;
  background: #f7fbfe;
}

.qboy-guide .qboy-intake-kicker {
  margin: 0 0 8px;
  color: #1c5f91;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.3;
  text-transform: uppercase;
}

.qboy-intake-illustrations {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
}

.qboy-intake-illustrations figure {
  min-width: 0;
  margin: 0;
  text-align: center;
}

.qboy-intake-illustrations img {
  display: block;
  width: 100%;
  height: 92px;
  object-fit: contain;
  object-position: center bottom;
}

.qboy-intake-illustrations figcaption {
  margin-top: 4px;
  color: #274b64;
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.2;
}

.qboy-intake-illustrations figcaption span {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 2px;
  border-radius: 50%;
  background: #0d65ad;
  color: #fff;
  font-size: .68rem;
  line-height: 18px;
}

@media (max-width: 820px) {
  .qboy-intake-illustrations img {
    height: 110px;
  }
}

@media (max-width: 560px) {
  .qboy-intake-panel {
    padding: 12px 9px 10px;
  }

  .qboy-intake-illustrations img {
    height: 96px;
  }

  .qboy-intake-illustrations figcaption {
    font-size: .69rem;
  }
}

/* ETA workspace surfaces with the original QRM/Qboy brand colors. */
:root{--qrm-blue:#f28a24;--qrm-blue-dark:#ffa64d;--qrm-orange:#f28a24;--qrm-teal:#70ded4;--qrm-teal-soft:#193b41;--qrm-border:#3b5061;--qrm-text:#f1f5f8;--qrm-muted:#b3c4d2;--qrm-bg:#10161d;--qrm-valid:#78dfb4;--qrm-invalid:#ffa9ad;--qrm-warn:#ffd18b}
body{background:radial-gradient(ellipse at 65% 0,#18353d 0,transparent 42rem),var(--qrm-bg);line-height:1.6;font-size:1rem}
.portal-wrap{max-width:1320px;padding:32px 28px 24px}.service-layout{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:24px;align-items:start}.service-layout>.qboy-guide{position:sticky;top:24px}.portal-card{background:#1d2935;border:1px solid var(--qrm-border);border-top:3px solid var(--qrm-orange);border-radius:12px;padding:26px;box-shadow:0 12px 32px #0003;min-width:0}
h1,h2,h3{color:var(--qrm-text)}h2{font-size:1.3rem;line-height:1.3;margin-bottom:20px}.form-stage>h2{padding-bottom:14px;border-bottom:1px solid #405462}.form-stage>p{color:var(--qrm-muted)}
.step-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0 0 28px}.step-list li{border-radius:6px;padding:11px 8px;text-align:center;font-size:.875rem;background:#15212c;color:#bfccd6;border-color:#405462;font-weight:700;white-space:normal}.step-list li.active{background:var(--qrm-orange);border-color:var(--qrm-orange);color:#171b20}.step-list li.complete{background:#1b3b3e;color:#9aeade;border-color:#418078}
label{font-size:.9375rem;color:#e2ebf2}.required::after{color:var(--qrm-orange)}input,select,textarea{background:#111e29;color:#f1f5f8;border-color:#4a6275;border-radius:7px;min-height:46px;padding:10px 12px}input::placeholder,textarea::placeholder{color:#93a9ba}input[readonly]{background:#243745;color:#c6d7e3}.help{font-size:.875rem;line-height:1.5}.field{min-width:0}
.suggestions{top:100%;background:#152a38;border-color:#5e8192;box-shadow:0 14px 30px #0007}.suggestions .item{border-bottom-color:#355165}.suggestions .item:hover,.suggestions .item.active{background:#234b54}.suggestions small{color:#bfced9}
.device-card{border-color:#41666c;border-left-color:var(--qrm-teal);background:linear-gradient(120deg,#203d43,#223240 75%);padding:20px}.device-card h3{font-size:1.1rem}.device-card input,.device-card select,.device-card textarea{background:#112630}.notice{background:#3b3020;color:#ffe1af;border-color:#866235;font-size:.9375rem}.notice button{margin-top:10px}
button{min-height:44px;font-size:.9375rem;background:var(--qrm-orange);color:#161c22;padding:11px 19px}button:hover{background:#ffa64d}button.secondary{background:#294657;border:1px solid #527487;color:#e8f3fa}button.secondary:hover{background:#34586a}button.warning{background:#efb855;color:#201c14}button.danger{background:#512e37;color:#ffd0d3;border:1px solid #98616a}.actions{align-items:center;border-top:1px solid #425562;padding-top:20px}.actions>span{flex:1}button:disabled{opacity:.45}.review-box{background:linear-gradient(120deg,#16383e,#182b37);color:var(--qrm-text);font-family:inherit;border-color:#467078;padding:20px}.success-box{background:#183d31;border-color:#4d9274;color:#b1efd1}.error-box{background:#432931;border-color:#a66571;color:#ffd1d6}
.summary-order table,.summary-device{background:#192f3d;color:var(--qrm-text)}.summary-order th{background:#214b51;color:#d3faf4}.summary-order td{background:#1d3342}.summary-order pre,.confirmation-text{background:#142630;color:#cce0ea}.summary-order table{overflow-wrap:anywhere}.summary-order th{width:160px}.summary-order{white-space:normal}
@media(max-width:1040px){.service-layout{grid-template-columns:minmax(0,1fr) 250px;gap:18px}.portal-card{padding:20px}.portal-wrap{padding:26px 20px 20px}.step-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.service-layout{grid-template-columns:1fr}.service-layout>.qboy-guide{position:static}.qboy-guide ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}.qboy-guide-heading img{width:50px;height:80px}}
@media(max-width:560px){.portal-wrap{padding:24px 16px 16px}.portal-card{padding:18px}.grid,.qboy-guide ul{grid-template-columns:1fr}.step-list{gap:6px}.step-list li{padding:10px 6px}.actions{gap:8px}.actions button{flex:1}.actions>span{display:none}.device-card{padding:14px}.device-card h3{align-items:flex-start}.summary-order th{width:100px}}
@media print{.portal-wrap{max-width:none;padding:0}.portal-card,.device-card,.review-box,.summary-order table,.summary-order td,.summary-order th,.summary-device{background:white!important;color:black!important;box-shadow:none;border-color:#aaa}.actions,.step-list{display:none!important}}
@media print {
  body {background:#fff!important;color:#111!important}
  .qrm-site-header,.qrm-site-footer,.qboy-guide,.step-list,.actions,#customerDocuments,#termsRow,#policyNotice,#printSubmission,.check {display:none!important}
  .portal-wrap,.service-layout,.portal-card {display:block!important;width:100%!important;max-width:none!important;margin:0!important;box-shadow:none!important;border:0!important}
  .form-stage {display:none!important}
  .form-stage[data-stage="3"] {display:block!important}
  .review-box,.confirmation-text,.success-box,.notice {background:#fff!important;color:#111!important;break-inside:avoid}
}
