@import url(
    'https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap'
);

:root {
    --gab-blue: #0d6efd;
    --gab-blue-hover: #0a58ca;
    --gab-blue-soft: #eaf3ff;

    --gab-ivory: #f5f3ed;
    --gab-watch: #e9efea;
    --gab-orange: #c9902f;

    --gab-charcoal: #202a35;
    --gab-text: #34414e;
    --gab-muted: #697684;
    --gab-border: #e0e5e9;
    --gab-surface: #ffffff;

    --gab-radius-sm: 10px;
    --gab-radius-md: 14px;
    --gab-radius-lg: 20px;
}

html,
body,
button,
input,
select,
textarea,
option {
    font-family:
        "Poppins",
        Arial,
        sans-serif !important;
}

body {
    color: var(--gab-text);
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
.fw-bold,
.fw-semibold {
    font-family:
        "Poppins",
        Arial,
        sans-serif !important;

    font-weight: 700 !important;
}

small,
.small,
.text-muted,
.form-text {
    font-weight: 500;
}

.text-primary,
.navbar-brand.text-primary,
a.text-primary {
    color: var(--gab-blue) !important;
}

.btn {
    border-radius: var(--gab-radius-sm);
    font-weight: 600;
}

.btn-primary {
    border-color: var(--gab-blue) !important;
    background: var(--gab-blue) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus {
    border-color: var(--gab-blue-hover) !important;
    background: var(--gab-blue-hover) !important;
}

.btn-outline-primary {
    border-color: var(--gab-blue) !important;
    background: transparent !important;
    color: var(--gab-blue) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background: var(--gab-blue) !important;
    color: #ffffff !important;
}

.form-control,
.form-select,
.input-group-text {
    border-color: var(--gab-border);
    border-radius: var(--gab-radius-sm);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--gab-blue);
    box-shadow:
        0 0 0 0.2rem
        rgba(13, 110, 253, 0.14);
}

.card,
.tool-card,
.budget-health-card {
    border-color: rgba(32, 42, 53, 0.08);
    border-radius: var(--gab-radius-md);
    box-shadow:
        0 8px 24px
        rgba(32, 42, 53, 0.06);
}
