@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
/* ============================================================
   GLAZZEN — SHARED THEME TOKENS (single source of truth)
   Linked by every customer quote page. Change colors, radius,
   shadows, etc. HERE ONCE and all pages update together.
   A page may add its own <style> AFTER this file to override
   these tokens or add product-specific rules.
   ============================================================ */
/* Always reserve the vertical scrollbar so the page width never changes when content
   grows tall enough to overflow — prevents the horizontal "jump" as steps open. */
html { overflow-y: scroll; }

:root {
  --sidebar:    #ffffff;
  --primary:    #2563eb;
  --primary-dk: #1d4ed8;
  --accent:     rgba(37,99,235,.06);
  --border:     rgba(15,26,42,.10);
  --border-dim: rgba(15,26,42,.06);
  --text:       #0f172a;
  --muted:      #64748b;
  --white:      #0F1A2A;
  --bg:         #f1f5f9;
  --panel:      #ffffff;
  --panel-dk:   #f8fafc;
  --radius:     8px;
  --shadow:     0 8px 24px rgba(15,26,42,.08);
  --lock-bg:    #eef2f7;
  --green:      #16a34a;
  --amber:      #d97706;
}

/* Company logo asset injected into the header brand (falls back to text) */
.app-brand { display: inline-flex; align-items: center; }
.app-brand svg, .app-brand img { height: 32px; width: auto; display: block; }

/* Edge-polish PHOTO mode — taller frame so much more of the photo (and its detail) is visible */
.edge-illustration.edge-photo { max-height: none; height: 96px; }
.edge-illustration.edge-photo img { display: block; width: 100%; height: 96px; object-fit: cover; }

/* Number inputs: KEEP the up/down arrows and make them ALWAYS visible. Chrome hides the
   spinner until hover/focus, which is what made the field look different empty vs filled —
   forcing opacity:1 keeps the arrows on screen and clickable, and the field stays steady. */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { opacity: 1; }

body, input, select, textarea { font-family: 'Inter','Manrope',system-ui,sans-serif; }
h1,h2,h3,.app-brand,.wordmark { font-family: 'Manrope','Inter',sans-serif; }