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

:root {
    --vc-font-family: "Poppins", sans-serif;
    --vc-blue-deep: #213a8f;
    --vc-blue: #0d7dc5;
    --vc-blue-soft: #eaf4ff;
    --vc-blue-pale: #f4f8ff;
    --vc-sky: #38a9dc;
    --vc-orange: #f07b17;
    --vc-amber: #f3af1d;
    --vc-orange-soft: #fff3e6;
    --vc-surface: rgba(255, 255, 255, 0.88);
    --vc-border: rgba(33, 58, 143, 0.12);
    --vc-border-strong: rgba(33, 58, 143, 0.18);
    --vc-text: #24324d;
    --vc-muted: #60708a;
    --vc-shadow: 0 18px 48px rgba(33, 58, 143, 0.08);
    --vc-shadow-soft: 0 12px 28px rgba(33, 58, 143, 0.06);
    --vc-gradient-soft:
        radial-gradient(circle at top left, rgba(13, 125, 197, 0.12), transparent 28%),
        radial-gradient(circle at top right, rgba(240, 123, 23, 0.10), transparent 24%),
        linear-gradient(180deg, #fbfcff 0%, #f3f7ff 52%, #eef4ff 100%);
    --vc-gradient-primary: linear-gradient(135deg, #213a8f 0%, #0d7dc5 62%, #f3af1d 62.5%, #f07b17 100%);
    --vc-gradient-button: linear-gradient(135deg, #213a8f 0%, #0d7dc5 72%, #38a9dc 100%);
    --vc-gradient-accent: linear-gradient(135deg, #f3af1d 0%, #f07b17 100%);
}

html,
body,
button,
input,
select,
textarea,
.btn,
.form-control,
.form-select,
.nav-link,
.brand-text,
.card-title,
.table,
.badge,
.small-box,
.info-box {
    font-family: var(--vc-font-family) !important;
}

body {
    color: var(--vc-text);
}

a {
    color: var(--vc-blue-deep);
}

a:hover {
    color: var(--vc-blue);
}

.btn-primary,
.btn-info {
    background: var(--vc-gradient-button);
    border-color: transparent;
    color: #fff;
}

.btn-primary:hover,
.btn-info:hover {
    filter: brightness(0.98);
    color: #fff;
}

.btn-warning,
.btn-orange {
    background: var(--vc-gradient-accent);
    border-color: transparent;
    color: #fff;
}

.btn-light,
.btn-secondary {
    background: #f7f9fc;
    border-color: var(--vc-border-strong);
    color: var(--vc-text);
}

.form-control,
.form-select {
    border-color: rgba(33, 58, 143, 0.14);
    color: var(--vc-text);
    box-shadow: none;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(13, 125, 197, 0.36);
    box-shadow: 0 0 0 0.2rem rgba(13, 125, 197, 0.12);
}

.card,
.alert,
.modal-content,
.dropdown-menu {
    border-color: var(--vc-border);
    box-shadow: var(--vc-shadow-soft);
}

.table thead th,
table.dataTable thead th {
    background: linear-gradient(180deg, #f9fbff 0%, #eef4ff 100%);
    color: var(--vc-blue-deep);
    border-bottom-color: var(--vc-border-strong);
}

.page-item.active .page-link,
.pagination .active .page-link {
    background: var(--vc-gradient-button);
    border-color: transparent;
}

.badge-primary,
.bg-primary {
    background: var(--vc-gradient-button) !important;
}

.badge-warning,
.bg-warning {
    background: var(--vc-gradient-accent) !important;
    color: #fff !important;
}

.text-muted {
    color: var(--vc-muted) !important;
}

.vc-public-body {
    min-height: 100vh;
    background: var(--vc-gradient-soft);
    color: var(--vc-text);
}

.vc-glass-card {
    background: var(--vc-surface);
    backdrop-filter: blur(14px);
    border: 1px solid var(--vc-border);
    box-shadow: var(--vc-shadow);
}

.vc-soft-title {
    color: var(--vc-blue-deep);
}

.vc-accent-chip {
    background: var(--vc-orange-soft);
    color: var(--vc-orange);
    border: 1px solid rgba(240, 123, 23, 0.14);
}

::selection {
    background: rgba(240, 123, 23, 0.18);
    color: var(--vc-blue-deep);
}