﻿/* CSS VARIABLES FOR UAB THEME -- Bootstrap 3 to 5.0.1 version*/

:root {
    /* ------------------ UAB Brand Standard Digital Colors ------------------ */
    /* Primary Colors */
    --uab-green: #1A5632;
    --uab-gold: #FDB913;
    /* Accent Colors */
    --dragons-lair-green: #033319;
    --campus-green: #90D408;
    --ever-loyal-evergreen: #17B045;
    --bham-sky-blue: #42CAF0;
    /* Highlight Campus Green */
    --highlight-campus-green-20: #D7EFA6;
    --highlight-campus-green-10: #EAF7D0;
    --highlight-campus-green-5: #F4FBE7;
    /* Highlight UAB Gold */
    --highlight-uab-gold-20: #FFE6AA;
    --highlight-uab-gold-10: #FFF2D2;
    --highlight-uab-gold-5: #FFF8E8;
    /* Highlight Ever Loyal Evergreen */
    --highlight-evergreen-20: #ACE2BC;
    --highlight-evergreen-10: #D3F0DB;
    --highlight-evergreen-5: #E8F7ED;
    /* Highlight Bham Sky Blue */
    --highlight-bham-blue-20: #BBECFA;
    --highlight-bham-blue-10: #DBF5FC;
    --highlight-bham-blue-5: #EDF9FD;
    /* ------------------ UAB Medicine Colors ------------------ */
    /* Primary Color */
    --uab-medicine-green: #1A5632;
    /* Accent Colors */
    --healing-teal: #007580;
    --trust-teal: #68C6B8;
    /* Highlight Trust Teal */
    --highlight-trust-teal-30: #C0E4DA;
    --highlight-trust-teal-20: #CFEAE2;
    --highlight-trust-teal-10: #E2F2EC;
    /* ------------------ Neutral Colors ------------------ */
    --neutral-black-100: #000000;
    --neutral-black-20: #D1D3D4;
    --neutral-black-10: #E6E7E8;
    --neutral-white: #FFFFFF;
    --neutral-ivory: #FBEE43;
    /* ------------------ Unofficial Blaze Flame Colors ------------------ */
    --flame-red: #D81E3F;
    --highlight-flame-red: #b91936;
    --highlight-flame-red-10: #d81e3f2b;
    /* ------------------ Typography (Adobe Fonts) ------------------ */
    /* Aktiv Grotesk, Kulturista, Kepler Std */
    /* Note: These fonts must be loaded via Adobe Fonts integration */
}

/* END OF UAB THEME VARIABLES */


/* All Bootstrap 3 overrides using variables will be placed below */

/* ------------------ BUTTONS ------------------ */
.btn-primary {
    background-color: var(--uab-green);
    border-color: var(--dragons-lair-green);
    color: var(--neutral-white);
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:active {
        background-color: var(--dragons-lair-green);
        border-color: var(--uab-green);
    }

.btn-success {
    background-color: var(--ever-loyal-evergreen);
    border-color: var(--neutral-black-10);
    color: var(--neutral-white);
}

    .btn-success:hover,
    .btn-success:focus,
    .btn-success:active {
        background-color: var(--highlight-evergreen-20);
        border-color: var(--neutral-black-20);
    }

.btn-warning {
    background-color: var(--uab-gold);
    color: var(--neutral-black-100);
    border-color: var(--highlight-uab-gold-20);
}

    .btn-warning:hover,
    .btn-warning:focus,
    .btn-warning:active {
        background-color: var(--highlight-uab-gold-10);
        border-color: var(--highlight-uab-gold-5);
        color: var(--neutral-black-100)
    }

.btn-danger {
    background-color: var(--flame-red);
    border-color: var(--highlight-evergreen-10);
    color: var(--neutral-white);
}

    .btn-danger:hover,
    .btn-danger:focus,
    .btn-danger:active {
        background-color: var(--highlight-flame-red);
        border-color: var(--highlight-flame-red);
    }

.btn-info {
    background-color: var(--bham-sky-blue);
    border-color: var(--neutral-black-10);
    color: var(--neutral-white);
}

    .btn-info:hover,
    .btn-info:focus,
    .btn-info:active {
        background-color: var(--highlight-bham-blue-20);
        border-color: var(--neutral-black-20);
    }

.btn-default {
    background-color: var(--neutral-white);
    border-color: var(--neutral-black-10);
    color: var(--neutral-black-100);
}

    .btn-default:hover,
    .btn-default:focus,
    .btn-default:active {
        background-color: var(--neutral-black-10);
        border-color: var(--neutral-black-20);
    }

/* ------------------ NAVBAR ------------------ */
.navbar-default {
    background-color: var(--neutral-white);
    border-color: var(--neutral-black-10);
}

    .navbar-default .navbar-brand,
    .navbar-default .navbar-nav > li > a {
        color: var(--neutral-black-100);
    }

        .navbar-default .navbar-nav > li > a:hover {
            background-color: var(--uab-green);
            color: var(--uab-gold);
        }

.navbar-inverse {
    background-color: var(--uab-green);
    border-color: var(--neutral-black-10);
}

    .navbar-inverse .navbar-brand,
    .navbar-inverse .navbar-nav > li > a {
        color: var(--neutral-black-100);
    }

    .navbar-inverse .navbar-nav > li > a {
        background-color: var(--highlight-evergreen-5)
    }

        .navbar-inverse .navbar-nav > li > a:hover {
            background-color: var(--highlight-evergreen-20);
            color: var(--uab-gold);
        }

/* ------------------ Pills ------------------ */
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    background-color: var(--uab-green);
    border-radius: 0;
    border-bottom: 3px solid var(--campus-green);
}

/* ------------------ ALERTS ------------------ */
.alert-success {
    background-color: var(--highlight-campus-green-10);
    border-color: var(--highlight-campus-green-20);
    color: var(--uab-green);
}

.alert-info {
    background-color: var(--highlight-bham-blue-10);
    border-color: var(--highlight-bham-blue-20);
}

.alert-warning {
    background-color: var(--highlight-uab-gold-10);
    border-color: var(--highlight-uab-gold-10);
}

.alert-danger {
    background-color: var(--highlight-flame-red-10);
}

/* ------------------ PANELS ------------------ */
.panel-primary {
    border-color: var(--uab-green);
}

    .panel-primary > .panel-heading {
        background-color: var(--uab-green);
        border-color: var(--dragons-lair-green);
        color: var(--neutral-white);
    }

/* ------------------ LABELS & BADGES ------------------ */
.label-primary {
    background-color: var(--uab-green);
}

.label-success {
    background-color: var(--campus-green);
    color: var(--neutral-white);
}

.label-warning {
    background-color: var(--uab-gold);
    color: var(--neutral-white);
}

.label-danger {
    background-color: var(--flame-red);
}

.label-info {
    background-color: var(--bham-sky-blue);
}

.badge {
    background-color: var(--uab-gold);
    color: var(--neutral-black-100);
}

/* ------------------ TYPOGRAPHY ------------------ */
body {
    /*font-family: "Segoe UI", sans-serif;*/
    /*color: var(--dragons-lair-green);*/
}

.text-danger {
    color: var(--flame-red);
}

.text-success {
    color: var(--campus-green);
}

.text-warning {
    color: var(--uab-gold)
}
.text-info {
    color: var(--bham-sky-blue);
}

/* ------------------ CUSTOM UTILITIES ------------------ */
.text-uabgreen {
    color: var(--uab-green) !important;
}

.text-ddlgreen {
    color: var(--dragons-lair-green) !important;
}

.text-campusgreen {
    color: var(--campus-green) !important;
}

.text-loyalyellow {
    color: var(--uab-gold) !important;
}

.text-blazegold {
    color: var(--uab-gold) !important;
}

.text-smokegray {
    color: var(--neutral-black-20) !important;
}

.text-flamered {
    color: var(--flame-red) !important;
}

.text-flamegold {
    color: var(--uab-gold) !important;
}

.text-evergreen {
    color: var(--ever-loyal-evergreen) !important;
}

.text-bhamskyblue {
    color: var(--bham-sky-blue) !important;
}

.bg-uabgreen {
    background-color: var(--uab-green) !important;
    color: var(--neutral-white) !important;
}

.bg-ddlgreen {
    background-color: var(--dragons-lair-green) !important;
    color: var(--neutral-white) !important;
}

.bg-campusgreen {
    background-color: var(--campus-green) !important;
    color: var(--neutral-black-100) !important;
}

.bg-loyalyellow {
    background-color: var(--uab-gold) !important;
    color: var(--neutral-black-100) !important;
}

.bg-blazegold {
    background-color: var(--uab-gold) !important;
    color: var(--neutral-black-100) !important;
}

.bg-smokegray {
    background-color: var(--neutral-black-20) !important;
    color: var(--neutral-black-100) !important;
}

.bg-flamered {
    background-color: var(--flame-red) !important;
    color: var(--neutral-white) !important;
}

.bg-flamegold {
    background-color: var(--uab-gold) !important;
    color: var(--neutral-black-100) !important;
}

.bg-evergreen {
    background-color: var(--ever-loyal-evergreen) !important;
    color: var(--neutral-white) !important;
}

.bg-bhamskyblue {
    background-color: var(--bham-sky-blue) !important;
    color: var(--neutral-black-100) !important;
}
