/* Reprospace dark neon theme */
:root{
  --accent: #3cd49d; /* overridden dynamically by PHP */
  --bg-0: #08110f;
  --bg-1: #0b1614;
  --card: rgba(17, 27, 25, 0.78);
  --card-solid: #121f1c;
  --text: #e7f3ee;
  --muted: #9fb7b1;
  --ring: rgba(60,212,157,.32);
}

*{box-sizing:border-box}
html,body{height:100%}
body.theme-body{
  margin:0;color:var(--text);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  background:
    radial-gradient(1200px 600px at 15% -10%, color-mix(in oklab, var(--accent) 25%, transparent), transparent 70%),
    radial-gradient(900px 500px at 90% 10%, color-mix(in oklab, var(--accent) 18%, transparent), transparent 70%),
    linear-gradient(180deg, var(--bg-1) 0%, var(--bg-0) 100%);
}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}

.site-header{
  width:100%; padding:18px 20px; display:flex; align-items:center; gap:14px; justify-content:center;
  color:var(--muted); position:relative;
}
.site-header .backlink{ position:absolute; left:16px; top:50%; transform:translateY(-50%); font-size:.92rem; color:var(--muted) }
.site-title{ font-size:1.6rem; font-weight:800; letter-spacing:.2px; color:var(--text) }
.accent{ color:var(--accent); text-shadow:0 0 18px color-mix(in oklab, var(--accent) 40%, transparent) }

.wrap{ width:min(1060px,96vw); margin:18px auto 28px; display:grid; gap:18px }

.card{
  background:var(--card);
  border:1px solid rgba(255,255,255,0.05);
  border-radius:18px;
  padding:22px 22px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 10px 40px rgba(0,0,0,.45);
  backdrop-filter: blur(6px);
}
.card.glow{ border-color: var(--ring); box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 10px 40px rgba(0,0,0,.45), 0 0 0 1px var(--ring) }

.meta{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:4px }
.company-name{ font-weight:700; letter-spacing:.2px }
.page-title{ margin:6px 0 14px }

.logo{ display:flex; justify-content:flex-end; margin:4px 0 2px }
.logo img{ height:44px; filter: drop-shadow(0 0 10px rgba(60,212,157,.25)) }

.form-grid{ display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:16px }
.full{ grid-column:1/-1 }
.triple{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px }
@media (max-width:860px){ .form-grid{ grid-template-columns:1fr } .triple{ grid-template-columns:1fr } }

.form-label{ display:block; font-size:.9rem; color:var(--muted); margin:4px 0 6px }
.required-indicator{ color:#ff8080; margin-left:4px }
.optional{ font-style:italic; font-size:.82rem; opacity:.8; margin-left:6px }

.input{
  width:100%; padding:12px 14px; border-radius:12px; outline:none;
  border:1px solid rgba(255,255,255,0.08); background:#0f1b18; color:var(--text); font-size:1rem;
}
.textarea{ min-height:120px; resize:vertical }
.select{}
.input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(60,212,157,0.18) }

.checkbox-group{ display:flex; flex-wrap:wrap; gap:10px }
.chip{
  display:flex; align-items:center; gap:8px; padding:8px 12px;
  border-radius:999px; cursor:pointer; background:#0d1917; color:var(--text);
  border:1px solid rgba(255,255,255,.06); transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.chip input{ accent-color: var(--accent) }
.chip:hover{ border-color:var(--accent); box-shadow:0 0 0 2px rgba(60,212,157,.18) }

.fieldset{ border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:14px 14px 10px }
.fieldset > legend{ padding:0 8px; color:var(--muted); font-size:.92rem }
.dropdown-group{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px }
@media (max-width:860px){ .dropdown-group{ grid-template-columns:1fr } }

.btn-primary{
  background:linear-gradient(180deg, var(--accent), color-mix(in oklab, var(--accent) 80%, #0a1412));
  color:#04110e; font-weight:800; border:0; border-radius:999px; padding:14px 18px; width:100%; cursor:pointer; letter-spacing:.3px;
  box-shadow:0 0 0 1px rgba(60,212,157,.35), 0 14px 36px rgba(60,212,157,.22);
  transition: transform .06s ease, filter .2s ease, box-shadow .2s ease;
}
.btn-primary:hover{ filter:brightness(1.06); box-shadow:0 0 0 1px var(--accent), 0 18px 44px rgba(60,212,157,.28) }
.btn-primary:active{ transform:translateY(1px) }

.message{ text-align:center; color:var(--accent); font-weight:700; margin:8px 0 0 }
.estimate{ text-align:center; margin:14px 0 0 }

.spinner{ display:none; position:fixed; inset:0; z-index:1000; background:rgba(6,14,12,.68); backdrop-filter: blur(3px) }
.loader{
  position:absolute; inset:0; margin:auto; width:70px; height:70px; border-radius:50%;
  border:7px solid rgba(255,255,255,.08); border-top:7px solid var(--accent); animation:spin 1.2s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg) } }

.response{ margin-top:16px }
.response-card{ padding:18px; border-radius:16px; border:1px solid rgba(255,255,255,.08); background:#0e1a18 }
.response h3, .response h4{ margin:.6em 0 }
.response a{ color:var(--accent) }

.hp{ position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden }

footer .footer-content{ background:transparent; color:var(--muted) }
.footer-note{ font-size:.82rem; color:#7a918c }

/* Login screen shared styles */
.login-card{
  width:100%; max-width:380px; background:var(--card);
  border:1px solid rgba(60,212,157,0.25);
  box-shadow:0 10px 40px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.04);
  border-radius:18px; padding:28px; backdrop-filter: blur(6px);
  margin: 24px auto;
}
.brand{ display:flex; align-items:center; gap:12px; margin-bottom:10px; opacity:.9 }
.brand img{ height:40px; filter: drop-shadow(0 0 10px rgba(60,212,157,.3)) }
.brand-title{ font-weight:700; letter-spacing:.3px }
.hint{ font-size:.82rem; color:var(--muted); margin-top:2px }
.login-title{ margin:6px 0 18px; font-weight:700; letter-spacing:.2px }
.input[type="password"]{ /* already styled via .input */ }
.error{ color:#ff8080; margin:6px 0 8px; font-size:.9rem }
.internal-mode-warning{ color:#ff8080; font-weight:700 }