/* form-handler shared styles. Tailwind handles most of it via CDN; this file
   carries the brand tokens and a few helpers Tailwind can't express inline.

   Brand: Mediasparx-blå #3399cc + emerald-600 (#059669) accent.
*/

:root {
  --ms-blue: #3399cc;
  --ms-blue-dark: #287aa3;
  --ms-emerald: #059669;
  --ms-emerald-dark: #047857;
}

html, body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

.bg-ms-blue { background-color: var(--ms-blue); }
.text-ms-blue { color: var(--ms-blue); }
.bg-ms-blue-dark { background-color: var(--ms-blue-dark); }
.hover-bg-ms-blue-dark:hover { background-color: var(--ms-blue-dark); }
.border-ms-blue { border-color: var(--ms-blue); }
.ring-ms-blue { --tw-ring-color: var(--ms-blue); }

/* Honeypot — visually hidden but still focusable for screen readers if needed */
.hp-trap {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.section-card label {
  transition: background-color 120ms ease;
}

.btn-primary {
  background-color: var(--ms-emerald);
  color: white;
  font-weight: 700;
  border-radius: 0.375rem;
  padding: 0.75rem 1.5rem;
  transition: background-color 120ms ease, transform 80ms ease;
}
.btn-primary:hover { background-color: var(--ms-emerald-dark); }
.btn-primary:active { transform: translateY(1px); }
.btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.alert-ok {
  background: #ecfdf5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}
.alert-err {
  background: #fef2f2;
  color: #991b1b;
  border: 1px solid #fecaca;
}