/* Minimal site-wide styles to support utility classes used across pages */

:root {
  --headingText: #111827; /* Gray 900 */
  --nssBlue: #0D47A1;     /* NSS Primary Blue */
}

html, body { margin: 0; padding: 0; }
body { font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: var(--headingText); }

/* Utility shims */
.text-headingText { color: var(--headingText); }
.text-nssBlue { color: var(--nssBlue); }
.bg-nssBlue { background-color: var(--nssBlue); }
.border { border-width: 1px; border-style: solid; }
.border-gray-200 { border-color: #e5e7eb; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-xl { border-radius: 0.75rem; }
.shadow { box-shadow: 0 1px 2px rgba(0,0,0,0.08), 0 1px 1px rgba(0,0,0,0.06); }
.bg-white { background-color: #fff; }
.bg-gray-50 { background-color: #f9fafb; }
.bg-gray-100 { background-color: #f3f4f6; }
.hover\:underline:hover { text-decoration: underline; }
.hover\:bg-\[\#0277BD\]:hover { background-color: #0277BD; }
.hover\:bg-gray-100:hover { background-color: #f3f4f6; }
.hover\:bg-gray-200:hover { background-color: #e5e7eb; }

/* Canvas responsiveness */
canvas { max-width: 100%; height: auto; display: block; }

/* Mobile scaling: make certificate canvas full-bleed for better readability */
@media (max-width: 640px) {
  #cert-canvas {
    width: 100vw !important;
    margin-left: calc(50% - 50vw);
  }
}