/* Every selector below is prefixed with `html`.
   template-customizer.js re-injects core.css and theme-default.css into the
   head at runtime, so they land AFTER this file however early it is linked.
   The extra element in the selector wins on specificity instead of on order. */

/* ==========================================================================
   Brand theme override — primary #02AD63
   Loaded after demo.css, so everything here wins over the template files.
   Shades: hover x0.80 · button hover x0.85 · emphasis x0.62
           bg-subtle 8% on white · border-subtle 30% on white
   ========================================================================== */

:root,
[data-bs-theme="light"],
html {
    --bs-primary: #02AD63;
    --bs-primary-rgb: 2, 173, 99;
    --bs-primary-text-emphasis: #016B3D;
    --bs-primary-bg-subtle: #EBF8F3;
    --bs-primary-border-subtle: #B3E6D0;
    --bs-link-color: #02AD63;
    --bs-link-color-rgb: 2, 173, 99;
    --bs-link-hover-color: #028A4F;
}

/* --------------------------------------------------------- text & surfaces */

html .text-primary,
html .text-primary i,
html a.text-primary:hover,
html a.text-primary:focus {
    color: #02AD63 !important;
}

html a {
    color: #02AD63;
}

html a:hover,
html a:focus {
    color: #028A4F;
}

html .bg-primary {
    background-color: #02AD63 !important;
}

html .border-primary {
    border-color: #02AD63 !important;
}

html .bg-label-primary {
    background-color: #EBF8F3 !important;
    color: #02AD63 !important;
}

html .badge.bg-primary,
html .badge.bg-label-primary {
    color: #fff;
}

html .badge.bg-label-primary {
    background-color: #EBF8F3 !important;
    color: #02AD63 !important;
}

/* ---------------------------------------------------------------- buttons */

html .btn-primary {
    background-color: #02AD63 !important;
    border-color: #02AD63 !important;
    color: #fff !important;
}

html .btn-primary:hover,
html .btn-primary:focus,
html .btn-primary:active,
html .btn-primary.active,
html .btn-primary:first-child:active,
html .show > .btn-primary.dropdown-toggle {
    background-color: #029354 !important;
    border-color: #029354 !important;
    color: #fff !important;
}

html .btn-primary:focus,
html .btn-primary:focus-visible,
html .btn-primary.focus {
    box-shadow: 0 0 0 0.15rem rgba(2, 173, 99, 0.4) !important;
}

html .btn-outline-primary {
    color: #02AD63 !important;
    border-color: #02AD63 !important;
    background-color: transparent !important;
}

html .btn-outline-primary:hover,
html .btn-outline-primary:focus,
html .btn-outline-primary:active,
html .btn-outline-primary.active,
html .show > .btn-outline-primary.dropdown-toggle {
    background-color: #02AD63 !important;
    border-color: #02AD63 !important;
    color: #fff !important;
}

html .btn-label-primary {
    background-color: #EBF8F3 !important;
    border-color: transparent !important;
    color: #02AD63 !important;
}

html .btn-label-primary:hover,
html .btn-label-primary:focus,
html .btn-label-primary:active,
html .btn-label-primary.active,
html .show > .btn-label-primary.dropdown-toggle {
    background-color: #02AD63 !important;
    color: #fff !important;
}

html .btn-text-primary,
html .btn-link {
    color: #02AD63 !important;
}

html .btn-text-primary:hover,
html .btn-link:hover {
    color: #028A4F !important;
}

/* ---------------------------------------------------------------- sidebar */

html .bg-menu-theme .menu-inner > .menu-item.active > .menu-link {
    background: linear-gradient(270deg, rgba(2, 173, 99, 0.7) 0%, #02AD63 100%) !important;
    box-shadow: 0 2px 6px 0 rgba(2, 173, 99, 0.48) !important;
    color: #fff !important;
}

html .bg-menu-theme .menu-inner > .menu-item.active > .menu-link i,
html .bg-menu-theme .menu-inner > .menu-item.active > .menu-link div {
    color: #fff !important;
}

html .bg-menu-theme .menu-inner > .menu-item.active:before {
    background: #02AD63 !important;
}

html .bg-menu-theme .menu-inner .menu-sub > .menu-item.active > .menu-link {
    color: #02AD63 !important;
}

html .bg-menu-theme .menu-inner .menu-sub > .menu-item.active > .menu-link:before {
    background-color: #02AD63 !important;
    border-color: #02AD63 !important;
}

html .bg-menu-theme .menu-inner > .menu-item:not(.active) > .menu-link:hover {
    color: #02AD63 !important;
}

html .bg-menu-theme .menu-inner > .menu-item.open > .menu-link {
    color: #02AD63 !important;
}

/* ------------------------------------------------------------------ forms */

html .form-control:focus,
html .form-select:focus,
html .input-group:focus-within .form-control,
html .input-group:focus-within .input-group-text {
    border-color: #02AD63 !important;
    box-shadow: 0 0 0 0.15rem rgba(2, 173, 99, 0.25) !important;
}

html .form-check-input:checked,
html .form-check-input[type="checkbox"]:indeterminate {
    background-color: #02AD63 !important;
    border-color: #02AD63 !important;
}

html .form-check-input:focus {
    border-color: #02AD63 !important;
    box-shadow: 0 0 0 0.15rem rgba(2, 173, 99, 0.25) !important;
}

html .form-switch .form-check-input:checked {
    background-color: #02AD63 !important;
    border-color: #02AD63 !important;
}

html .switch-primary.switch input:checked ~ .switch-toggle-slider,
html .switch-primary.switch input:checked ~ .switch-toggle-slider + .switch-label {
    background-color: #02AD63 !important;
    color: #fff !important;
}

html .form-range::-webkit-slider-thumb {
    background-color: #02AD63 !important;
}

html .form-range::-moz-range-thumb {
    background-color: #02AD63 !important;
}

/* ------------------------------------------------------------- tabs, nav */

html .nav-pills .nav-link.active,
html .nav-pills .show > .nav-link {
    background-color: #02AD63 !important;
    box-shadow: 0 2px 6px 0 rgba(2, 173, 99, 0.3) !important;
    color: #fff !important;
}

html .nav-tabs .nav-link.active,
html .nav-tabs .nav-link.active:hover,
html .nav-tabs .nav-link.active:focus {
    color: #02AD63 !important;
    border-bottom-color: #02AD63 !important;
}

html .nav-tabs .nav-link:hover {
    color: #02AD63 !important;
}

/* ------------------------------------------------------------- pagination */

html .pagination .page-item.active .page-link,
html .pagination .page-item.active .page-link:hover {
    background-color: #02AD63 !important;
    border-color: #02AD63 !important;
    color: #fff !important;
    box-shadow: 0 2px 6px 0 rgba(2, 173, 99, 0.3) !important;
}

html .pagination .page-link:hover,
html .pagination .page-link:focus {
    color: #02AD63;
}

html .pagination .page-link:focus {
    box-shadow: 0 0 0 0.15rem rgba(2, 173, 99, 0.25) !important;
}

/* -------------------------------------------------------- progress, spinner */

html .progress-bar,
html .progress-bar.bg-primary {
    background-color: #02AD63 !important;
}

html .spinner-border.text-primary,
html .spinner-grow.text-primary {
    color: #02AD63 !important;
}

/* ---------------------------------------------------------------- select2 */

html .select2-container--default .select2-results__option--highlighted[aria-selected],
html .select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color: #02AD63 !important;
    color: #fff !important;
}

html .select2-container--default .select2-results__option[aria-selected="true"],
html .select2-container--default .select2-results__option[data-selected="true"] {
    background-color: #EBF8F3 !important;
    color: #02AD63 !important;
}

html .select2-container--default.select2-container--focus .select2-selection,
html .select2-container--default.select2-container--open .select2-selection {
    border-color: #02AD63 !important;
    box-shadow: 0 0 0 0.15rem rgba(2, 173, 99, 0.25) !important;
}

html .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #EBF8F3 !important;
    color: #02AD63 !important;
    border-color: transparent !important;
}

/* ------------------------------------------------------------- breadcrumb */

html .breadcrumb-item a {
    color: var(--bs-body-color);
}

html .breadcrumb-item a:hover,
html .breadcrumb-item a:focus,
html .breadcrumb-item.active a {
    color: #02AD63 !important;
}

/* ------------------------------------------------------------- sweetalert */

html .swal2-styled.swal2-confirm {
    background-color: #02AD63 !important;
    border-color: #02AD63 !important;
    color: #fff !important;
}

html .swal2-styled.swal2-confirm:hover,
html .swal2-styled.swal2-confirm:focus {
    background-color: #029354 !important;
    border-color: #029354 !important;
    box-shadow: 0 0 0 0.15rem rgba(2, 173, 99, 0.4) !important;
}

/* ------------------------------------------------------------ misc accents */

html .dropdown-item.active,
html .dropdown-item:active {
    background-color: #02AD63 !important;
    color: #fff !important;
}

html .list-group-item.active {
    background-color: #02AD63 !important;
    border-color: #02AD63 !important;
}

html .table-primary {
    --bs-table-bg: #EBF8F3;
    --bs-table-border-color: #B3E6D0;
    color: #016B3D;
}

html .alert-primary {
    background-color: #EBF8F3 !important;
    border-color: #B3E6D0 !important;
    color: #016B3D !important;
}

html .accordion-button:not(.collapsed) {
    color: #02AD63 !important;
}

html ::selection {
    background-color: rgba(2, 173, 99, 0.25);
}