/* Override default bootstrap styling. 
    Based on bootstrap 5.2 
    https://getbootstrap.com/docs/5.2/
*/
:root {
    /* Root colour specification
        - HEX and RGB values for each colour are provided as that is the way they are specified in bootstrap 5.2
        - Darker and Darkest are used as colour shades in buttons, alerts, etc.
            Darker = Colour-5%
            Darkest = Colour-10%
    */
--color-primary:#00435C;
--color-primary-rgb:rgb(0,67,92);
--color-primary-darker: #00374c;
--color-primary-darker-rgb: rgb(0, 55, 76);
    --color-primary-darkest: #002332;
    --color-primary-darkest-rgb: rgb(0, 35, 50);
    /* secondary colour - dark gray */
    /* darker and darkest are used as colour shades in buttons, alerts, etc. */
    --color-secondary:#67BEC4;
    --color-secondary-rgb:rgb(103, 190, 196);
    --color-secondary-darker:#4e9298;
    --color-secondary-darker-rgb:rgb(78, 146, 152);
    --color-secondary-darkest: #4e9298;
    --color-secondary-darkest-rgb:rgb(78, 146, 152);
    /* tertiary colour - yellow gold */
    /* darker and darkest are used as colour shades in buttons, alerts, etc. */
	--color-tertiary:#707070;
    --color-tertiary-rgb:rgb(112, 112, 122);
    --color-tertiary-darker:#707070;
    --color-tertiary-darker-rgb: rgb(112, 112, 112);
    --color-tertiary-darkest: #474747;
    --color-tertiary-darkest-rgb: rgb(71, 71, 71);
    /* other colours - pale green */
    --color-primary-light: #ffffff;
    --color-primary-light-rgb: rgb(255, 255, 255);
    --color-header-gradient: linear-gradient(#ffffff,#f6f7f8);
    /* attempt to override the bootstrap root variables */
    --bs-primary: var(--color-primary) !important;
    --bs-primary-rgb: var(--color-primary-rgb) !important;
    --bs-secondary: var(--color-secondary) !important;
    --bs-secondary-rgb: var(--color-secondary-rgb) !important;
    --bs-link-color: var(--color-secondary-darkest) !important;
    --bs-link-hover-color: var(--color-secondary-darkest) !important;
    --bs-light: #ffffff !important;
    --color-dark:#000;
}
.bg-dark{
    background-color: rgb(46, 63, 80)!important;
}
.body{
    font-color:var(--color-dark !i);
}
/* text */
.text-primary {
    color: var(--color-primary) !important;
}

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

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

.text-gray {
    color: var(--bs-gray-400) !important;
}

.text-primary-light {
    color: var(--color-primary-light) !important;
}


/* link */
.link-primary {
    color: var(--color-primary) !important;
}

.link-secondary {
    color: var(--color-secondary) !important;
}

.link-tertiary {
    color: var(--color-tertiary) !important;
}

.link-gray {
    color: var(--bs-gray-400) !important;
}

.link-primary-light {
    color: var(--color-primary-light) !important;
}


/* background */
.bg-primary {
    background-color: var(--color-primary-rgb) !important;
}

.bg-secondary {
    background-color: var(--color-secondary-rgb) !important;
}

.bg-tertiary {
    background-color: var(--color-tertiary-rgb) !important;
}

.bg-gray {
    background-color: var(--bs-gray-200) !important;
}

.bg-primary-light {
    background-color: var(--color-primary-light-rgb) !important;
}
.bg-light-gradient {
    background-color: var(--color-header-gradient) !important;
}


/* border */
.border-primary {
    border-color: var(--color-primary-rgb) !important;
}

.border-secondary {
    border-color: var(--color-secondary-rgb) !important;
}

.border-tertiary {
    border-color: var(--color-tertiary-rgb) !important;
}

.border-gray {
    border-color: var(--bs-gray-400) !important;
}

.border.border-primary-light {
    border-color: var(--color-primary-light-rgb) !important;
}



/* table */
.table-primary {
    background-color: var(--color-primary-rgb) !important;
}

.table-secondary {
    background-color: var(--color-secondary-rgb) !important;
}

.table-tertiary {
    background-color: var(--color-tertiary-rgb) !important;
}

.table-gray {
    background-color: var(--bs-gray-200) !important;
}

.table-primary-light {
    background-color: var(--color-primary-light-rgb) !important;
}


/* badge */
.badge.badge-primary {
    background-color: var(--color-primary-rgb) !important;
    color: var(--bs-dark) !important;
}

.badge.badge-secondary {
    background-color: var(--color-secondary-rgb) !important;
    color: var(--bs-dark) !important;
}

.badge.badge-tertiary {
    background-color: var(--color-tertiary-rgb) !important;
    color: var(--bs-dark) !important;
}

.badge.badge-gray {
    background-color: var(--bs-gray-200) !important;
    color: var(--bs-dark) !important;
}

.badge.badge-primary-light {
    background-color: var(--color-primary-light-rgb) !important;
    color: var(--color-primary) !important;
}

/* alert */
.alert.alert-primary {
    background-color: var(--color-primary-rgb) !important;
    background-color: var(--color-primary-darker-rgb) !important;
    color: var(--color-primary-darker) !important;
}

.alert.alert-secondary {
    background-color: var(--color-secondary-rgb) !important;
    background-color: var(--color-secondary-darker-rgb) !important;
    color: var(--bs-light) !important;
}

.alert.alert-tertiary {
    background-color: var(--color-tertiary-rgb) !important;
    border-color: var(--color-tertiary-darker-rgb) !important;
    color: var(--color-tertiary-darker) !important;
}

.alert.alert-gray {
    background-color: var(--bs-gray-200) !important;
    border-color: var(--bs-dark) !important;
    color: var(--bs-dark) !important;
}

.alert.alert-primary-light {
    background-color: var(--color-primary-light-rgb) !important;
    border-color: var(--color-primary-rgb) !important;
    color: var(--color-primary) !important;
}


/* nav tabs*/
.nav-tabs.nav-tabs-custom {
}

    .nav-tabs.nav-tabs-custom .nav-link {
        border-bottom: 0;
        background-color: var(--color-secondary-rgb);
        color: var(--bs-light);
    }

        .nav-tabs.nav-tabs-custom .nav-item.show .nav-link,
        .nav-tabs.nav-tabs-custom .nav-link.active {
            color: var(--bs-light);
            background-color: var(--color-primary-rgb);
            margin-bottom: calc(var(--bs-nav-tabs-border-width) * -1);
            border: var(--bs-nav-tabs-border-width) solid var(--color-primary-rgb);
        }

        .nav-tabs.nav-tabs-custom .nav-link:focus,
        .nav-tabs.nav-tabs-custom .nav-link:hover {
            isolation: isolate;
            border: var(--bs-nav-tabs-border-width) solid transparent;
        }

/* buttons */
.btn {
    font-weight: 400;
    line-height: 1.5 !important;
}

    /* standard appearance */
    .btn.btn-primary {
        background-color: var(--color-primary-rgb) !important;
        border-color: var(--color-primary-darker-rgb) !important;
        color: var(--bs-light)!important;
    }

    .btn.btn-secondary {
        background-color: var(--color-secondary-rgb) !important;
        border-color: var(--color-secondary-darker-rgb) !important;
        color: var(--bs-light);
    }

    .btn.btn-tertiary {
        background-color: var(--color-tertiary) !important;
        border-color: var(--color-tertiary) !important;
        color: var(--bs-light);
    }

    .btn.btn-gray {
        background-color: var(--bs-gray-200) !important;
        border-color: var(--bs-gray-400) !important;
        color: var(--bs-dark);
    }

    .btn.btn-primary-light {
        background-color: var(--color-primary-light-rgb) !important;
        border-color: var(--color-primary-rgb) !important;
        color: var(--color-primary);
    }


    /*standard appearance hover/active */
    .btn.btn-primary:hover,
    .btn-check:active + .btn-primary,
    .btn-check:checked + .btn-primary,
    .btn-primary.active, .btn-primary:active,
    .show > .btn-primary.dropdown-toggle {
        background-color: var(--color-primary-darker-rgb) !important;
        border-color: var(--color-primary-darkest-rgb) !important;
        color: var(--bs-light) !important;
        box-shadow: 0 0 0 0.2rem rgb(38 143 255 / 0%);
    }

    .btn.btn-secondary:hover,
    .btn-check:active + .btn-secondary,
    .btn-check:checked + .btn-secondary,
    .btn-secondary.active, .btn-secondary:active,
    .show > .btn-secondary.dropdown-toggle {
        background-color: var(--color-secondary-darker-rgb) !important;
        border-color: var(--color-secondary-darkest-rgb) !important;
        color: var(--bs-light);
    }

    .btn.btn-tertiary:hover,
    .btn-check:active + .btn-tertiary,
    .btn-check:checked + .btn-tertiary,
    .btn-tertiary.active, .btn-tertiary:active,
    .show > .btn-tertiary.dropdown-toggle {
        background-color: var(--color-tertiary-darker-rgb) !important;
        border-color: var(--color-tertiary-darkest-rgb) !important;
        color: var(--bs-light) !important;
    }

    .btn.btn-gray:hover,
    .btn-check:active + .btn-gray,
    .btn-check:checked + .btn-gray,
    .btn-gray.active, .btn-gray:active,
    .show > .btn-gray.dropdown-toggle {
        background-color: var(--bs-gray-500) !important;
        border-color: var(--bs-gray-600) !important;
        color: var(--bs-light);
    }

    .btn.btn-primary-light:hover,
    .btn-check:active + .btn-primary-light,
    .btn-check:checked + .btn-primary-light,
    .btn-primary-light.active, .btn-primary-light:active,
    .show > .btn-primary-light.dropdown-toggle {
        border-color: var(--color-primary-darker-rgb) !important;
        color: var(--color-primary) !important;
        box-shadow: 0 0 0 0.2rem rgb(38 143 255 / 0%);
    }

    /* outline appearance */
    .btn.btn-outline-primary {
        color: var(--color-primary) !important;
        border-color: var(--color-primary-rgb) !important;
        background-color: transparent !important;
    }

    .btn.btn-outline-secondary {
        color: var(--color-secondary) !important;
        border-color: var(--color-secondary-rgb) !important;
        background-color: transparent !important;
    }

    .btn.btn-outline-tertiary {
        color: var(--color-tertiary) !important;
        border-color: var(--color-tertiary-rgb) !important;
        background-color: transparent !important;
    }

    .btn.btn-outline-gray {
        color: var(--bs-dark) !important;
        border-color: var(--bs-gray-400) !important;
        background-color: transparent !important;
    }

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

    /* outline appearance hover/active */
    .btn.btn-outline-primary:hover,
    .btn-check:active + .btn-outline-primary,
    .btn-check:checked + .btn-outline-primary,
    .btn-outline-primary.active, .btn-outline-primary:active,
    .show > .btn-outline-primary.dropdown-toggle {
        color: var(--bs-light) !important;
        background-color: var(--color-primary-rgb) !important;
        border-color: var(--color-primary-rgb) !important;
    }

    .btn.btn-outline-secondary:hover,
    .btn-check:active + .btn-outline-secondary,
    .btn-check:checked + .btn-outline-secondary,
    .btn-outline-secondary.active, .btn-outline-secondary:active,
    .show > .btn-outline-secondary.dropdown-toggle {
        color: var(--bs-light) !important;
        background-color: var(--color-secondary-rgb) !important;
        border-color: var(--color-secondary-rgb) !important;
    }

    .btn.btn-outline-tertiary:hover,
    .btn-check:active + .btn-outline-tertiary,
    .btn-check:checked + .btn-outline-tertiary,
    .btn-outline-tertiary.active, .btn-outline-tertiary:active,
    .show > .btn-outline-tertiary.dropdown-toggle {
        color: var(--bs-dark) !important;
        background-color: var(--color-tertiary-rgb) !important;
        border-color: var(--color-tertiary-rgb) !important;
    }

    .btn.btn-outline-gray:hover,
    .btn-check:active + .btn-outline-gray,
    .btn-check:checked + .btn-outline-gray,
    .btn-outline-gray.active, .btn-outline-gray:active,
    .show > .btn-outline-gray.dropdown-toggle {
        color: var(--bs-dark) !important;
        background-color: var(--bs-gray-200) !important;
        border-color: var(--bs-gray-200) !important;
    }

    .btn.btn-outline-primary-light:hover,
    .btn-check:active + .btn-outline-primary-light,
    .btn-check:checked + .btn-outline-primary-light,
    .btn-outline-primary-light.active, .btn-outline-primary-light:active,
    .show > .btn-outline-primary.dropdown-toggle {
        color: var(--bs-primary) !important;
        background-color: var(--color-primary-light-rgb) !important;
        border-color: var(--color-primary-light-rgb) !important;
    }

/* Accordions */
.accordion-button:hover {
    background-color: var(--bs-gray-200) !important;
}

.accordion-button:not(.collapsed) {
    background-color: var(--color-primary-light-rgb) !important;
    color: var(--color-primary) !important;
}