:root {
    --primary: #0e7c8f;
    --accent: #1fc2a0;
    --bg: #101820;
    --card-bg: #18232f;
    --text: #e6f1ff;
    --muted: #7a8fa6;
    }

    body {
        background: var(--bg);
        color: var(--text);
        font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
    }
/* body { background-color: #f8f9fa; font-family: 'Inter', 'Segoe UI', Arial, sans-serif !important; } */
.hero { background: linear-gradient(120deg, #0e7c8f 0%, #101820 100%); color: white; padding: 6rem 0; }
.hero h1 { font-size: 3.5rem; font-weight: 300; }
.code-block { background-color: #212529; color: #f8f9fa; padding: 1rem; border-radius: 0.3rem; margin-bottom: 1rem; font-family: monospace; }
.endpoint { font-weight: 500; color: #0e7c8f; }

pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    max-height: 500px;
    overflow-y: auto;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    padding: 1rem;
  }

.btn-county {
    background-color: #0e7c8f !important;
}

.btn-constituency {
    background-color: #1fc2a0 !important;
}

.btn-ward {
    background-color: #101820 !important;
    color: #fff !important;
}