/* SolarQuery v4.3 integration styles — ours, not part of the client package (see resources/sq-v4/PATCHES.md).
 * sqx-* classes only; loads after services.css / login.css / vendor-registration.css and the sq-v2 integration sheet. */

/* ── Service page enquiry form (2 steps) ───────────────────────────────────────────────────────────── */
.sqx-svc-steps { display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; list-style:none; margin:0 0 1.25rem; padding:0; font-size:.9375rem; color:var(--sq-muted); }
.sqx-svc-steps li { display:flex; align-items:center; gap:.5rem; }
.sqx-svc-steps span { display:inline-grid; place-items:center; width:1.75rem; height:1.75rem; border-radius:50%; border:1px solid var(--sq-control-border, #718078); font-weight:700; }
.sqx-svc-steps [aria-current="step"] { color:var(--sq-ink); font-weight:700; }
.sqx-svc-steps [aria-current="step"] span { background:var(--sq-action-dark); border-color:var(--sq-action-dark); color:#fff; }
.sqx-svc-phone { display:flex; align-items:stretch; }
.sqx-svc-phone-prefix { display:flex; align-items:center; padding:0 .875rem; border:1px solid var(--sq-control-border, #718078); border-right:0; border-radius:.625rem 0 0 .625rem; background:#edf5f0; font-size:1rem; color:var(--sq-ink); }
.sqx-svc-phone input { min-width:0; flex:1; border-top-left-radius:0 !important; border-bottom-left-radius:0 !important; }
.sqx-svc-location { display:block; margin-top:.375rem; font-size:.9375rem; line-height:1.5; color:var(--sq-action-dark); }
.sqx-svc-fallback { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 1rem; }
.sqx-svc-fallback[hidden] { display:none; }
.sqx-svc-form select:disabled { opacity:.7; }
.sqx-svc-step-title { font-size:1.25rem; line-height:1.4; margin:0 0 .5rem; }
.sqx-svc-note { font-size:1rem; line-height:1.7; margin:0 0 1rem; }
.sqx-svc-form #svc-otp { font-size:1.375rem; letter-spacing:.35em; text-align:center; font-weight:700; }
.sqx-svc-tools { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 1rem; margin-top:.75rem; }
.sqx-svc-link { min-height:2.75rem; padding:0; border:0; background:none; color:var(--sqx-link, #068164); font:inherit; font-size:1rem; font-weight:600; cursor:pointer; text-decoration:underline; text-underline-offset:.2em; }
.sqx-svc-link:disabled { color:var(--sq-muted); text-decoration:none; cursor:default; }
.sqx-svc-link[hidden] { display:none; }
@media (max-width:34em) {
  .sqx-svc-fallback { grid-template-columns:minmax(0,1fr); }
}

/* ── Login (v4.3 design) ──────────────────────────────────────────────────────────────────────────── */
/* Apple is not offered: one column per configured provider (Google, Facebook). */
.sq-auth-socials { grid-template-columns:repeat(auto-fit,minmax(0,1fr)); }
.sqx-auth-alert { background:#fff6f2; color:#843126; border-color:#843126; }
/* Phone OTP panel: the shared script (auth.partials.phone-login-script) shows errors with the class "on". */
.sq-auth-otp .pl-error { display:none; }
.sq-auth-otp .pl-error.on { display:block; }
.sq-auth-otp .pl-alert { margin-block:.75rem; padding:.75rem; border:1px solid #843126; border-radius:.625rem; background:#fff6f2; color:#843126; font-size:1rem; line-height:1.5; }
.sq-auth-otp .pl-alert.info { border-color:#718078; background:#edf5f0; color:#324e40; }
.sq-auth-otp .pl-alert[hidden] { display:none; }
.sq-auth-otp .pl-hp { position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.sq-auth-otp .sq-button:disabled { opacity:.7; cursor:default; }
.sq-auth-otp .sq-button.is-busy::after { content:""; display:inline-block; width:.875rem; height:.875rem; margin-left:.625rem; vertical-align:-.125rem; border:2px solid rgba(255,255,255,.5); border-top-color:#fff; border-radius:50%; animation:sqx-spin .7s linear infinite; }
@keyframes sqx-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .sq-auth-otp .sq-button.is-busy::after { animation:none; } }

/* Service pages: the editable brand disclaimer (config service_pages.brand_disclaimer). */
.svc-brand-disclaimer { margin:.75rem 0 1.25rem; font-size:.9375rem; line-height:1.6; color:var(--sq-muted); }
