// Custom.scss
// Option A: Include all of Bootstrap

// Include any default variable overrides here (though functions won't be available)

@import "../lib/bootstrap/dist/css/bootstrap.css";
@import "../lib/bootstrap/dist/css/bootstrap-utilities.css";
@import "../lib/bootstrap/dist/css/bootstrap-grid.css";
@import "../lib/bootstrap/dist/css/bootstrap-reboot.css";

// Then add additional custom code here

// extending variables for PSU Branding
:root {
    --bs-beaverblue-rgb: 30,64,124;
    --bs-creek-rgb: 62,163,158;
    --bs-creeklight-rgb: 207,236,235;
    --bs-slate-rgb: 49,77,100;
    --bs-limestone-rgb: 162,170,173;
    --bs-limestonelight-rgb: 228,229,231;
    --bs-pasky-rgb: 0,156,222;
    --bs-nittanynavy-rgb: 4,30,66;
    --bs-landgrant-rgb: 106,48,40;
    --bs-lionshrine-rgb: 184,137,101;
    --bs-lionshrinelight-rgb: 247,242,238;
    --bs-lionsroar-rgb: 191,130,38;
    --bs-pennsforest-rgb: 74,119,41;
    --bs-pughblue-rgb: 150,190,230;
    --bs-statelyatherton-rgb: 172,141,206;
    --bs-oldcoaly-rgb: 68,68,68;
    --bs-original1887-rgb: 188,32,75;
    --bs-dawnofdiscovery-rgb: 242,102,94;
    --bs-futurescalling-rgb: 153,204,0;
    --bs-perpetualwonder-rgb: 73,29,112;
    --bs-inventorange-rgb: 233,131,0;
    --bs-brightkeystone-rgb: 255,209,0;
    --bs-greenopportunity-rgb: 0,135,85;
    --bs-endlesspotential-rgb: 0,3,33;
    --bs-palink-rgb: 0,95,169;
}


//defining PSU Brand background-colors

.bg-beaverblue {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-beaverblue-rgb), var(--bs-bg-opacity)) !important;
}

.bg-creek {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-creek-rgb), var(--bs-bg-opacity)) !important;
}

.bg-slate {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-slate-rgb), var(--bs-bg-opacity)) !important;
}

.bg-limestone {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-limestone-rgb), var(--bs-bg-opacity)) !important;
}

.bg-limestonelight {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-limestonelight-rgb), var(--bs-bg-opacity)) !important;
}

.bg-pasky {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-pasky-rgb), var(--bs-bg-opacity)) !important;
}

.bg-nittanynavy {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-nittanynavy-rgb), var(--bs-bg-opacity)) !important;
}

.bg-landgrant {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-landgrant-rgb), var(--bs-bg-opacity)) !important;
}

.bg-lionshrine {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-lionshrine-rgb), var(--bs-bg-opacity)) !important;
}

.bg-lionsroar {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-lionsroar-rgb), var(--bs-bg-opacity)) !important;
}

.bg-pennsforest {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-pennsforest-rgb), var(--bs-bg-opacity)) !important;
}

.bg-pughblue {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-pughblue-rgb), var(--bs-bg-opacity)) !important;
}

.bg-statelyatherton {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-statelyatherton-rgb), var(--bs-bg-opacity)) !important;
}

.bg-oldcoaly {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-oldcoaly-rgb), var(--bs-bg-opacity)) !important;
}

.bg-original1887 {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-original1887-rgb), var(--bs-bg-opacity)) !important;
}

.bg-dawnofdiscovery {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-dawnofdiscovery-rgb), var(--bs-bg-opacity)) !important;
}

.bg-futurescalling {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-futurescalling-rgb), var(--bs-bg-opacity)) !important;
}

.bg-perpetualwonder {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-perpetualwonder-rgb), var(--bs-bg-opacity)) !important;
}

.bg-inventorange {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-inventorange-rgb), var(--bs-bg-opacity)) !important;
}

.bg-brightkeystone {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-brightkeystone-rgb), var(--bs-bg-opacity)) !important;
}

.bg-greenopportunity {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-greenopportunity-rgb), var(--bs-bg-opacity)) !important;
}

.bg-endlesspotential {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-endlesspotential-rgb), var(--bs-bg-opacity)) !important;
}

.bg-palink {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-palink-rgb), var(--bs-bg-opacity)) !important;
}


// Custom and modified classes

body {
    font-family: proxima-nova,sans-serif;
    font-weight: 400;
    font-style: normal;
    padding-bottom: .75em;
}

p, h1, h2, h3, h4, h5, h6 {
    color: #666666;
}

a {
    color: rgba(var(--bs-palink-rgb));
}

.app-title {
    text-decoration: none;
}

.psu-mark {
    max-width: 300px;
}

.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.navbar-light .navbar-toggler {
    color: rgba(var(--bs-brightkeystone-rgb));
    border-color: white;
}

.form-control {
    background-color: #f2f3f4;
    border: 2px solid rgba(var(--bs-limestonelight-rgb));
}

.form-control:focus {
    border-color: rgba(var(--bs-brightkeystone-rgb));
    outline: 0;
    box-shadow: 0 0 0 0.1rem rgba(var(--bs-brightkeystone-rgb));
}

.drop-style {
    background-color: rgba(var(--bs-limestonelight-rgb));
    border: none;
    font-family: proxima-nova-condensed,sans-serif;
    font-weight: 700;
    font-style: normal;
    vertical-align: middle;
}

.drop-style-caret {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='white' d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3e%3c/svg%3e");
    display: inline-block;
   // width: 1.5em;
   // height: 2.5em;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 55%;
    background-color: rgba(var(--bs-palink-rgb));
    cursor: pointer;
    margin-left: -.25em;
}

code pre {
    white-space: pre-line;
    font-size: 1em;
    color: rgb(var(--bs-dawnofdiscovery-rgb));
    background-color: #f2f3f4;
    padding: 1em;
}

thead.la-dark-thead {
    color: white;
    background-color: rgb(var(--bs-nittanynavy-rgb));
    font-family: proxima-nova-condensed,sans-serif;
    font-weight: 700;
    font-style: normal;
    vertical-align: middle;
}

.table-striped-la > tbody > tr:nth-of-type(odd) {
    --bs-table-accent-bg: #f2f3f4;
    color: #666666;
}

.table-striped-la > tbody > tr:nth-of-type(even) {
    --bs-table-accent-bg: rgb(var(--bs-limestonelight-rgb));
    color: #666666;
}

.table-striped-la > tbody > tr:hover {
    --bs-table-accent-bg: white;
    border-color: rgb(var(--bs-brightkeystone-rgb));
    border-bottom-width: 2px;
}

select > option:focus-visible {
    background: rgb(var(--bs-palink-rgb));
}