:root {
    /*  Talk to team about 70-20-10  */
    /*--primary: #fff;*/
    /*--secondary: #06548A;*/
    --accent: #4581B9;

    --primary-color: #004667;
    --secondary-teal: #0f69a0;
    --secondary-green: #5C7F71;
    --secondary-aqua: #007987;
    --secondary-purple: #7566A0;
    --danger: #f82d2d;

    /* Default Font Colors */
    --main-text-dk: rgb(65, 65, 65);
    --alt-text-dk: #707070;
    --alt-text-footer: rgb(77, 77, 77);
    --main-text-lt: #ffffff;
    --alt-text-lt: #ececec;

    /* Default background color */
    --background-gray: #F5F5F5;
    --background-blue: #EDF9FD;
    --background-drk: rgb(49, 49, 49);
    --background-footer-gray: rgb(245, 245, 245);

    /* Other Default */
    --footer-boarder-color: rgb(166, 166, 166);
    --box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --border-radius: 5px;
}


/************************/
/*      Over-rides      */
/************************/

:focus {
    outline-color: unset !important;
    outline-style: unset !important;
    outline-width: unset !important;
}

:focus-visible,
div[password]:focus-within {
    outline-color: var(--alt-text-dk) !important;
    outline-style: solid !important;
    outline-width: 2px !important;
    outline-offset: 2px !important;
}

/* Font Family Override */
body { font-family: 'Nunito Sans', sans-serif }
.poppins { font-family: 'Poppins', sans-serif }

h1, h2, h3, h4, h5 {
    font-family: "calluna", serif;
    color: var(--primary-color);
    margin: 0;
}

p {
    color: var(--main-text-dk);
    margin: 0;
}

a { color: var(--primary-color) }

/* Primary button */
/*Note: #field_selection is a class on the admin panel*/
.btn-primary:not(#field_selection .btn-primary) {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    border-radius: var(--border-radius);
    /*color: ;*/
}

.btn-primary:hover:not(#field_selection .btn-primary) {
    background-color: var(--secondary-teal);
    border-color: var(--secondary-teal);
}

.btn-primary:active:focus:not(#field_selection .btn-primary) {

}

.btn-primary:focus:not(#field_selection .btn-primary)  {

}

/* Client Custom Button */
.btn-custom {
    padding: 0.75rem 2rem;
    letter-spacing: 0.5px;
    font-weight: 800;
    color: var(--primary-color);
    background: transparent;
    border: 2px solid var(--primary-color);
    line-height: 1.3;
    transition: all 200ms ease-in-out;
}

.btn-custom:hover {
    border-color: var(--secondary-teal);
    background-color: var(--secondary-teal);
    color: #fff;
}


/* Button Link */
.btn-link:not(#field_selection .btn-link) {
    color: var(--primary-color);
}

.btn-link:hover:not(#field_selection .btn-link) {

}

.btn-link:active:focus:not(#field_selection .btn-link) {

}

.btn-link:focus:not(#field_selection .btn-link)  {

}

.promo-container {
    display: flex;
    background-color: var(--background-gray);
    margin-left: 2rem;
    margin-right: 2rem;
}
.promo-container img {
    width: 30%;
    aspect-ratio: 1/1;
    object-fit: cover;
}

.promo-container > div {
    padding: 2rem;
}



.dashboard-element {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 1.5rem;
    width: 100%;
    background: #fff;
    border-radius: var(--border-radius);
    border: 1px solid #ccc;
}

.dashboard-element h1 {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 1.5rem;
}


.grid-col-1-4 {
    grid-column: 1/4;
}

/************************/
/*    Utility Classes   */
/************************/

.text-main { color: var(--main-text-dk)}
.text-alt { color: var(--alt-text-dk)}
.text-primary { color: var(--primary-color)}

.text-xs { font-size: 0.75rem; line-height: 1rem}
.text-sm { font-size: 0.875rem; line-height: 1.25rem}
.text-base { font-size: 1rem; line-height: 1.5rem}
.text-lg { font-size: 1.125rem; line-height: 1.75rem}
.text-xl { font-size: 1.25rem; line-height: 1.75rem}
.text-2xl { font-size: 1.5rem; line-height: 2rem}
.text-3xl { font-size: 1.875rem; line-height: 2.25rem}
.text-4xl { font-size: 2.25rem; line-height: 2.5rem}
.text-5xl { font-size: 3rem; line-height: 1rem}
.text-6xl { font-size: 3.75rem; line-height: 1rem}
.text-7xl { font-size: 4.5rem; line-height: 1rem}
.text-8xl { font-size: 6rem; line-height: 1rem}
.text-9xl { font-size: 8rem; line-height: 1rem}