﻿@import url("https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&family=Barlow+Condensed:wght@400;500;600;700&display=swap");

:root {
    --ct-font-body: "Barlow", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --ct-font-heading: "Barlow Condensed", system-ui, sans-serif;
    --ct-primary: #12A45E;
    --ct-primary-hover: #0E8B50;
    --ct-primary-dark: #0B7141;
    --ct-primary-darker: #08562F;
    --ct-primary-deep: #063C21;
    --ct-green-100: #E6F7EE;
    --ct-green-200: #C2EBD6;
    --ct-green-300: #8FD9B5;
    --ct-green-400: #4FC18C;
    --ct-green-500: #12A45E;
    --ct-green-600: #0E8B50;
    --ct-green-700: #0B7141;
    --ct-green-800: #08562F;
    --ct-green-900: #063C21;
    --ct-text: #12201A;
    --ct-text-secondary: #4A5751;
    --ct-text-muted: #6B7A72;
    --ct-text-on-primary: #FFFFFF;
    --ct-background: #F7F8F7;
    --ct-surface: #FFFFFF;
    --ct-surface-secondary: #EDF0EE;
    --ct-surface-sunken: #E4E7E5;
    --ct-border: #D3D8D5;
    --ct-border-strong: #AEB8B2;
    --ct-success: #12A45E;
    --ct-success-soft: #E6F7EE;
    --ct-success-line: #8FD9B5;
    --ct-success-text: #08562F;
    --ct-info: #3E7794;
    --ct-info-soft: #E9EFF3;
    --ct-info-line: #A9C2D1;
    --ct-info-text: #1F3A4A;
    --ct-warning: #C9901C;
    --ct-warning-soft: #FBF2DD;
    --ct-warning-line: #E6C67F;
    --ct-warning-text: #6B4A0B;
    --ct-danger: #B4541F;
    --ct-danger-soft: #FAE8E1;
    --ct-danger-line: #E6B49E;
    --ct-danger-text: #7A2E10;
    --ct-neutral: #6B7A72;
    --ct-neutral-soft: #EDF0EE;
    --ct-neutral-line: #D3D8D5;
    --ct-neutral-text: #333D38;
    --ct-primary-soft: var(--ct-success-soft);
    --ct-primary-soft-2: var(--ct-success-soft);
    --ct-primary-border: var(--ct-success-line);
    --ct-shadow-sm: 0 1px 2px rgba(18, 32, 26, 0.10);
    --ct-shadow-md: 0 3px 10px rgba(18, 32, 26, 0.12);
    --bs-primary: #12A45E;
    --bs-primary-rgb: 18, 164, 94;
    --bs-success: #12A45E;
    --bs-success-rgb: 18, 164, 94;
    --bs-info: #3E7794;
    --bs-info-rgb: 62, 119, 148;
    --bs-warning: #C9901C;
    --bs-warning-rgb: 201, 144, 28;
    --bs-danger: #B4541F;
    --bs-danger-rgb: 180, 84, 31;
    --bs-body-color: #12201A;
    --bs-body-color-rgb: 18, 32, 26;
    --bs-body-bg: #F7F8F7;
    --bs-body-bg-rgb: 247, 248, 247;
    --bs-secondary-color: #4A5751;
    --bs-border-color: #D3D8D5;
    --bs-link-color: #0B7141;
    --bs-link-hover-color: #12A45E;
    --bs-body-font-family: var(--ct-font-body);
}

html,
body {
    font-family: var(--ct-font-body) !important;
    color: var(--ct-text);
    background-color: var(--ct-background);
}

    html body * {
        font-family: var(--ct-font-body) !important;
    }

    html body h1,
    html body h2,
    html body h3,
    html body h4,
    html body h5,
    html body h6,
    html body .h1,
    html body .h2,
    html body .h3,
    html body .h4,
    html body .h5,
    html body .h6,
    html body .page-title,
    html body .section-title,
    html body .content-title,
    html body .card-title,
    html body .modal-title,
    html body .home-title,
    html body .ga-page-title,
    html body .report-title,
    html body [class$="-page-title"] h1,
    html body [class$="-page-heading"] h1,
    html body [class$="-title"] > h1 {
        font-family: var(--ct-font-heading) !important;
        font-weight: 600 !important;
        color: var(--ct-text);
    }

    html body .ti,
    html body [class^="ti-"],
    html body [class*=" ti-"],
    html body .fa,
    html body .fas,
    html body .far,
    html body .fal,
    html body .fab,
    html body [class^="fa-"],
    html body [class*=" fa-"],
    html body .flag-icon,
    html body [class^="flag-icon-"],
    html body [class*=" flag-icon-"] {
        font-family: inherit;
    }

    html body .ti,
    html body [class^="ti-"],
    html body [class*=" ti-"] {
        font-family: "tabler-icons" !important;
    }

    html body .fa,
    html body .fas,
    html body .far,
    html body .fal,
    html body .fab,
    html body [class^="fa-"],
    html body [class*=" fa-"] {
        font-family: "Font Awesome 6 Free" !important;
    }

a {
    color: var(--ct-primary-dark);
}

    a:hover, a:focus {
        color: var(--ct-primary);
    }

.text-primary {
    color: var(--ct-primary) !important;
}

.text-success {
    color: var(--ct-success-text) !important;
}

.text-info {
    color: var(--ct-info) !important;
}

.text-warning {
    color: var(--ct-warning-text) !important;
}

.text-danger {
    color: var(--ct-danger) !important;
}

.text-secondary {
    color: var(--ct-text-secondary) !important;
}

.text-muted {
    color: var(--ct-text-muted) !important;
}

.bg-primary, .bg-success {
    background-color: var(--ct-primary) !important;
}

.bg-info {
    background-color: var(--ct-info) !important;
}

.bg-warning {
    background-color: var(--ct-warning) !important;
}

.bg-danger {
    background-color: var(--ct-danger) !important;
}

.bg-light, .bg-body-tertiary {
    background-color: var(--ct-surface-secondary) !important;
}

.border, .border-secondary {
    border-color: var(--ct-border) !important;
}

.border-primary, .border-success {
    border-color: var(--ct-primary) !important;
}

.border-info {
    border-color: var(--ct-info-line) !important;
}

.border-warning {
    border-color: var(--ct-warning-line) !important;
}

.border-danger {
    border-color: var(--ct-danger-line) !important;
}

.btn-primary,
.btn-success,
.swal2-confirm {
    color: #FFFFFF !important;
    background-color: var(--ct-primary) !important;
    border-color: var(--ct-primary) !important;
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:active,
    .btn-success:hover,
    .btn-success:focus,
    .btn-success:active,
    .swal2-confirm:hover {
        color: #FFFFFF !important;
        background-color: var(--ct-primary-hover) !important;
        border-color: var(--ct-primary-hover) !important;
    }

.btn-outline-primary,
.btn-outline-success {
    color: var(--ct-primary-dark) !important;
    border-color: var(--ct-primary) !important;
    background: transparent !important;
}

    .btn-outline-primary:hover,
    .btn-outline-success:hover {
        color: #FFFFFF !important;
        background-color: var(--ct-primary) !important;
        border-color: var(--ct-primary) !important;
    }

.btn-info {
    color: #FFFFFF !important;
    background: var(--ct-info) !important;
    border-color: var(--ct-info) !important;
}

.btn-warning {
    color: var(--ct-warning-text) !important;
    background: var(--ct-warning-soft) !important;
    border-color: var(--ct-warning-line) !important;
}

.btn-danger {
    color: #FFFFFF !important;
    background: var(--ct-danger) !important;
    border-color: var(--ct-danger) !important;
}

.form-control,
.form-select,
.input-group-text,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    color: var(--ct-text);
    border-color: var(--ct-border-strong) !important;
}

    .form-control::placeholder {
        color: var(--ct-text-muted);
    }

    .form-control:focus,
    .form-select:focus,
    .select2-container--default.select2-container--focus .select2-selection--single,
    .select2-container--default.select2-container--focus .select2-selection--multiple,
    .select2-container--default.select2-container--open .select2-selection--single {
        border-color: var(--ct-primary) !important;
        box-shadow: 0 0 0 2px rgba(18,164,94,.18) !important;
    }

.form-check-input:checked,
.form-switch .form-check-input:checked {
    background-color: var(--ct-primary) !important;
    border-color: var(--ct-primary) !important;
}

.table {
    --bs-table-color: var(--ct-text);
    --bs-table-border-color: var(--ct-border);
}

    .table > :not(caption) > * > * {
        border-bottom-color: var(--ct-border);
    }

    .table thead th {
        color: var(--ct-text);
        font-weight: 600;
    }

.table-hover > tbody > tr:hover > * {
    background-color: var(--ct-success-soft);
}

.pagination {
    --bs-pagination-color: var(--ct-primary-dark);
    --bs-pagination-hover-color: var(--ct-primary);
    --bs-pagination-active-bg: var(--ct-primary);
    --bs-pagination-active-border-color: var(--ct-primary);
    --bs-pagination-border-color: var(--ct-border);
}

.page-item.active .page-link,
.dataTables_wrapper .page-item.active .page-link {
    color: #FFFFFF !important;
    background-color: var(--ct-primary) !important;
    border-color: var(--ct-primary) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    color: #FFFFFF !important;
    background-color: var(--ct-primary) !important;
}

.alert-success {
    color: var(--ct-success-text);
    background: var(--ct-success-soft);
    border-color: var(--ct-success-line);
}

.alert-info {
    color: var(--ct-info-text);
    background: var(--ct-info-soft);
    border-color: var(--ct-info-line);
}

.alert-warning {
    color: var(--ct-warning-text);
    background: var(--ct-warning-soft);
    border-color: var(--ct-warning-line);
}

.alert-danger {
    color: var(--ct-danger-text);
    background: var(--ct-danger-soft);
    border-color: var(--ct-danger-line);
}

::selection {
    color: var(--ct-text);
    background: var(--ct-green-200);
}

:focus-visible {
    outline-color: var(--ct-primary);
}
