/* =========================================================
   UFV Legacy Rebrand Overrides
   Loaded after all legacy CSS files.
   Purpose: colour/typography reskin only; avoid layout changes.
   ========================================================= */


/* Rebrand tokens
   Use CSS variables so colours are easy to change later.
--------------------------------------------------------- */
:root {
  --ufv-brand-deep-green: #17382b;
  --ufv-brand-valley-green: #006d56;
  --ufv-brand-leaf-green: #00a055;
  --ufv-brand-lichen-green: #bdefdd;
  --ufv-brand-orange: #ff8a65;
  --ufv-brand-yellow: #ffe164;
  --ufv-brand-purple: #ed9eff;
  

  --ufv-neutral-charcoal: #333;
  --ufv-neutral-grey: #f4f4f2;
  --ufv-neutral-mushroom: #f6f4ea;
  --ufv-neutral-white: #fff;
 
/* Semantic design tokens for legacy CSS classes */

--ufv-text:              var(--ufv-brand-charcoal);

  --ufv-link:              var(--ufv-brand-valley-green);
  --ufv-link-hover:        var(--ufv-brand-deep-green);

  --ufv-heading:           var(--ufv-brand-valley-green);

  --ufv-nav-background:    var(--ufv-brand-deep-green);
  --ufv-nav-text:          var(--ufv-neutral-white);

  --ufv-button-primary:        var(--ufv-brand-valley-green);
  --ufv-button-primary-hover:  var(--ufv-brand-deep-green);

  --ufv-button-secondary:      var(--ufv-brand-orange);

  --ufv-sidebar-active:        var(--ufv-brand-valley-green);

  --ufv-footer-background:     var(--ufv-brand-deep-green);
  --ufv-footer-text:           var(--ufv-neutral-mushroom);

}

/* Typography - global font family overrides
    font is linked in head of each page, so we can use it here 
    
    ------------------------------------------------------------*/

:root {
  --ufv-font-body: 'Utile', sans-serif;
  --ufv-font-heading: 'Utile', sans-serif;
}

body {
  font-family: var(--ufv-font-body);
  font-size: 18px;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ufv-font-heading); color: var(--ufv-heading); font-weight: 600;
}

.ufv-cb p.h2, .ufv-cb h2 {
    font-size: 26px;
    font-family: var(--ufv-font-heading)
}

.ufv-cb ul li, .ufv-cb ol li {
    font-size: 18px;
    font-family: var(--ufv-font-body);
}

section p, p {
    font-family: var(--ufv-font-body);
    font-size: 18px;
    
}

b, strong {
    font-family: var(--ufv-font-body);
}

.ufv-cb a {
    text-decoration: underline;
    font-family: var(--ufv-font-body);
}

.ufv-cb p.h1, .ufv-cb h1 {
        font-family: var(--ufv-font-heading);
}
a {
    color: var(--ufv-link)
}
.ufv-cb a:hover {
    text-decoration: none;
    font-family: var(--ufv-font-body);
    color: var(--ufv-brand-deep-green);
}

p.note {
    background: var(--ufv-neutral-mushroom) none repeat scroll 0 0;
    font-size: 15px;

}

/* GLOBAL HEADER STYLE OVERRIDES - COLOUR ONLY */

.ufv-top-nav { background-color: var(--ufv-brand-valley-green); /*border-bottom: 1px solid var(--ufv-brand-valley-green);*/}
.ufv-top-nav a:hover {color:var(--ufv-brand-deep-green); }
.ufv-users ul li a {color: var(--ufv-neutral-white); font-family: var(--ufv-font-body); font-weight:500 }
.ufv-users ul li:hover { background-color: var(--ufv-brand-deep-green);}
.ufv-users ul a:hover {color: var(--ufv-neutral-white); }
.ufv-tools ul li { background: transparent; display: inline;}
.ufv-tools ul li a {color: var(--ufv-neutral-white); font-family: var(--ufv-font-body); font-weight:500 }
.ufv-tools ul li:hover { background-color: var(--ufv-brand-deep-green);}

.header-full-dark { background: var(--ufv-brand-deep-green); border-bottom: 1px solid var(--ufv-brand-deep-green); }
.navbar-header-full.navbar-inverse { background-color: var(--ufv-brand-deep-green); }
.navbar-default .navbar-nav > li > a { color: var(--ufv-brand-deep-green); font-family: var(--ufv-font-body); }
.navbar-default.navbar-inverse .navbar-nav > li > a:hover, .navbar-default.navbar-inverse .navbar-nav > li > a:focus, .navbar-default.navbar-inverse .navbar-nav > .active > a, .navbar-default.navbar-inverse .navbar-nav > .active > a:hover, .navbar-default.navbar-inverse .navbar-nav > .active > a:focus .navbar-default.navbar-inverse .navbar-nav > .open > a, .navbar-default.navbar-inverse .navbar-nav > .open > a:hover, .navbar-default.navbar-inverse .navbar-nav > .open > a:focus { background-color: var(--ufv-brand-lichen-green); background-image: none; color: var(--ufv-brand-deep-green); }
.navbar-collapse { background-color: var(--ufv-brand-deep-green); border-top: 2px solid var(--ufv-brand-leaf-green); }
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {border-color: transparent;}

/* Site title bar */

html.sb-init body div#sb-site div.boxed header.main-header {
    background-color: var(--ufv-neutral-mushroom);
    border-bottom: 1px solid var(--ufv-neutral-mushroom);
}

html.sb-init body div#sb-site div.boxed header.main-header div.container p.page-title {
    color: var(--ufv-heading);
    font-family: var(--ufv-font-heading);
    font-weight: 600;
    font-size: 2em;
    
}


/* Calendar search box */

.ufv-selectors {
    background: var(--ufv-brand-valley-green);
}

.ufv-cal-search {
        background-color: var(--ufv-brand-deep-green);
}

.btn.btn-success.gosearch {
    background-color: var(--ufv-brand-lichen-green);
    color: var(--ufv-brand-deep-green);
}


.ufv-selectors h3 {
    font-family: var(--ufv-font-heading);
}

.popover-title {
    background-color: var(--ufv-brand-lichen-green);
    border-bottom: 1px solid #ebebeb;
    border-radius: 0px;
    font-size: 15px;
    margin: 0;
    padding: 15px 14px 15px;
    color: var(--ufv-brand-deep-green);
}

.dropdown-menu {
    background-color: var(--ufv-neutral-mushroom);
}

ul.dropdown-menu.inner.selectpicker li a {
    font-family: var(--ufv-font-body);
}

.dropdown-menu .active > a, .dropdown-menu li > a:hover, .dropdown-menu li > a:focus, .dropdown-menu li > a:active {
    background-color: #cccccc;
    background-image: linear-gradient(to top, var(--ufv-brand-valley-green), var(--ufv-brand-valley-green));
    color: #fff;
}

.dropdown-menu .active > a, .dropdown-menu li > a:hover, .dropdown-menu li > a:focus, .dropdown-menu li > a:active {
    border-left: 3px solid var(--ufv-brand-leaf-green);
    }

/* quick links in sidebar */

/* quick links in sidebar 

.pale-green li a {
    color: var(--ufv-brand-deep-green);
    }

    .pale-green li a:hover,
    .pale-green li a:focus {
    color: var(--ufv-neutral-white);
    }

.list-group-item {font-family: var(--ufv-font-body),sans-serif; font-size: 16px; font-weight: normal; margin-bottom: 6px; text-transform: none; }
#quick-links { padding: 0px; margin-bottom: 20px; }
#quick-links ul { padding: 0; margin: 0; }
#quick-links ul.pale-green li { margin: 0; margin-bottom: 10px; background-color: var(--ufv-brand-lichen-green); color: var(--ufv-brand-deep-green); font-family: var(--ufv-font-body),sans-serif;  }
#quick-links ul.pale-green li:hover {background-color: var(--ufv-brand-deep-green); color: var(--ufv-brand-lichen-green)!important;}
*/

.list-group-item {
    font-family: var(--ufv-font-body), sans-serif;
    font-size: 16px;
    font-weight: normal;
    margin-bottom: 6px;
    text-transform: none;
}

#quick-links {
    padding: 0;
    margin-bottom: 20px;
}

#quick-links ul {
    padding: 0;
    margin: 0;
}

#quick-links ul.pale-green li {
    margin: 0 0 10px;
    background-color: var(--ufv-brand-lichen-green);
    font-family: var(--ufv-font-body), sans-serif;
}

#quick-links ul.pale-green li a {
    display: block;
    color: var(--ufv-brand-deep-green);
}

#quick-links ul.pale-green li:hover,
#quick-links ul.pale-green li:focus-within {
    background-color: var(--ufv-brand-deep-green);
}

#quick-links ul.pale-green li:hover a,
#quick-links ul.pale-green li:focus-within a,
#quick-links ul.pale-green li a:hover,
#quick-links ul.pale-green li a:focus {
    color: var(--ufv-neutral-white);
}


#back-top a {
    background-color: var(--ufv-brand-lichen-green);
    color: var(--ufv-brand-deep-green);
}

#back-top a:hover {
    background-color: var(--ufv-brand-valley-green);
    color: var(--ufv-brand-lichen-green);
}

/*Footer */
#footer-links {
    background: var(--ufv-brand-deep-green);
}

html.sb-init body div#sb-site div#footer-links.row div.container div.col-xs-12 div.col-md-12.footer-heading h4 {
    border-bottom: 1px solid var(--ufv-neutral-mushroom);
    line-height: 1.5;
    color: var(--ufv-neutral-white);
    }

    #footer-links h4{
        color: var(--ufv-brand-lichen-green);
    }

#footer-links p, #footer-links h5, #footer-links a:link, #footer-links a:visited {
    color: #d9d9d9;
    font-size: 14px;
    color: var(--ufv-neutral-mushroom);
    text-transform: none;
    line-height: 26px;
}

    #footer {
        background: var(--ufv-brand-deep-green);
    }

    /* Course descriptions page overrides */

.pagination > li > a, .pagination > li > span {
        color: var(--ufv-brand-valley-green);
   }

   .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    color: #000000;
    background-color: var(--ufv-brand-valley-green);
    border-color: var(--ufv-brand-valley-green);
    color: #fff;
}

html.sb-init body div#sb-site div.container div.row div.col-md-8.ufv-cb div.panel.panel-default div.panel-body {
    background-color: var(--ufv-neutral-mushroom);
}

/* TABLE STYLES */

.table-striped th {
    padding: 20px;
    color: var(--ufv-brand-deep-green);
}
.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: var(--ufv-neutral-mushroom);
}

.table-hover > tbody > tr:hover {
    background-color: var(--ufv-brand-lichen-green);
}

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
    background-color: var(--ufv-brand-lichen-green);
}

table.ELEPStyle tbody tr td p.coursedescription, #sb-site div.container div.row div.col-md-8.ufv-cb p.courseDescription {
    font-size: 16px;
}

p.courseRequisites {
    color: var(--ufv-brand-valley-green);
    font-size: 16px;
}

.SubjCode, h2.CourseName {
    color: var(--ufv-neutral-charcoal);
    font-size: 22px;
    
}

.SubjCredits {
    color: #757575;
    font-size: 22px;
}

html.sb-init body div#sb-site div.container div.row div.col-md-8.ufv-cb p.SubjCode a, html.sb-init body div#sb-site div.container div.row div.col-md-8.ufv-cb p.SubjCode a:link, html.sb-init body div#sb-site div.container div.row div.col-md-8.ufv-cb p.SubjCode a:hover{
    text-decoration: none;
    color: var(--ufv-brand-neutral-charcoal);
    font-weight: 500;
}

.ELEPStyle tbody tr td p.coursetitle {
    font-weight: 400;
    font-family: var(--ufv-body-font);
    font-size: 18px;
}

html.sb-init body div#sb-site div.container div.row div.col-md-8.ufv-cb p.disciplineheading {
    text-transform: uppercase;
    font-size: 28px;
    padding: 0;
    margin: 0;
    color: #555;
}

/* MOBILE STYLES */

.navbar-header {
    background: var(--ufv-brand-deep-green);
}

.navbar-inverse .navbar-brand {
        background: rgba(0, 0, 0, 0) url("https://www.ufv.ca/media/web/logos/UFV-Acronym-Horiz_Colour-White_RGB.svg") no-repeat scroll 25px 8px / 95px 30px;
    margin-left: 30px;
    text-indent: -2000px;
    width: 142px;
}