/**
 * @file solas-ui-overrides.css
 * Used for:
 * Overriding SUI components due to bugs found or creating missing components
 * that might be ported to SUI if we think that is a component that SUI should have.
 *
 * This file should not get too big as it should be reviewed fairly often and things moved
 * out of it either into SUI as part of a version bump or it should belong in the
 * solas-ui-integration.css
 */

/**
 * Icons
 */

/* Remote chance of popup icon being present on the RHS nav top level menu
 * item which also has an up arrow, also .bc-icon-link-list.bc-icon-link-list-md>li>a .bc-svg
 * @TODO: TEMP solution, Check these in SUI also refactor these when we get rid of
 * links with arrows.
*/

.bc-svg-popup {
  position: static !important;
}

/**
 * Buttons
 */

/**
 * Panels
 */

.panel-default .panel-body ul {
  margin-top: 0;
}

/**
 * Listings
 */

.bc-list-item-visual.bc-list-item--width2 {
  margin-top: 0;
}

.bc-list-item-standard {
  margin-top: 25px;
}

.bc-list-item-standard ~ .bc-list-item-standard {
  margin-top: inherit;
}

.bc-masonry-item.bc-list-item--width2 {
  width: 100%;
}

/**
 * Components to review for potential SUI inclusion.
 */

/* Listing page new instance - case study */
.bc-text-dl {
  margin-top: 0;
}

.bc-text-dl > dt {
  float: left;
  padding-right: 5px;
}

[dir="rtl"] .bc-text-dl > dt {
  float: right;
  padding-right: 0;
  padding-left: 10px;
}

/**
 * Promos section on landing page
 * @TODO: When we switch to SUI v0.10 check if this section displays the way it should
 * since promos design is changing.
 * field_promotion_images / field--field-promo-multi-column.tpl.php
 * Are these styles even needed?
 */
.node-type-landing-page a .bc-list-item-header h2.bc-list-item-title {
  margin-top: 0;
}

.node-type-landing-page a:hover .bc-list-item-header .bc-list-item-body {
  text-decoration: none;
}

.node-type-landing-page a .bc-list-item-body {
  font-weight: normal;
}

.node-type-landing-page a .bc-list-item-media img {
  margin-bottom: 0;
}

/**
 * Subheader - used on person CT.
 */
.bc-sub-header {
  margin: -5px 0 15px;
}

.bc-sub-header-tier-1,
.bc-sub-header-tier-2 {
  border: none;
  padding: 0;
  text-transform: none;
  margin: 0 0 5px;
}

.bc-sub-header-tier-1 {
  font-size: 1.1em;
  font-weight: 600;
}

.bc-sub-header-tier-2 {
  font-size: 1em;
  font-weight: 300;
  color: #333;
}

.bc-sub-header .bc-sub-header-tier-1 small,
.bc-sub-header .bc-sub-header-tier-2 small {
  float: none;
  display: inline-block;
}

/**
 * Carousel - Adding support for video item.
 */

.bc-carousel-single-item .bc-video-item.bc-item .bc-item-caption {
  margin: -19px 0 20px;
  width: 100%;
}

@media (min-width: 851px) {
  .bc-carousel-single-item .bc-video-item.bc-item .bc-item-caption {
    margin-top: -29px;
  }
}

.bc-carousel .bc-video-item.bc-item .bc-item-caption {
  margin: 0;
}

.bc-hero-carousel .bc-video-item.bc-item .bc-item-caption {
  display: block;
  padding: 6px 12px;
  font-size: 1.143em;
  background-color: #4c275b;
  color: #fff;
}

.bc-hero-carousel .bc-video-item.bc-item .oembed-video {
  margin-bottom: 0;
}

/**
 * Courses AL - Due to being hardcoded in ff module.
 * @TODO: Sort out the field formatter module after SUI rollout.
 */
ul.bc-course-details {
  margin: 0 0 30px;
  list-style: none;
  overflow: hidden;
}

ul.bc-course-details > li {
  margin: 0;
  padding: 0;
}

.node-type-course-al section > div > .bc-body-text ~ h3 {
  font-size: 1.444em;
}

/**
 * SHORTHAND V2
 */

.node-type-shorthand-story .main-container.container {
  width: 100%;
  padding: 0;
  position: relative;
}

/* Font Overrides */
.node-type-shorthand-story .main-container.container,
.node-type-shorthand-story .main-container.container p {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.node-type-shorthand-story .main-container.container h1,
.node-type-shorthand-story .main-container.container h2,
.node-type-shorthand-story .main-container.container h3,
.node-type-shorthand-story .main-container.container h4,
.node-type-shorthand-story .main-container.container h5,
.node-type-shorthand-story .main-container.container h6 {
  font-family: BCSans, Arial, "Helvetica Neue", Helvetica, sans-serif;
}

/* Shorthand Logo */
.node-type-shorthand-story .main-container.container .Theme-Logos,
.node-type-shorthand-story .main-container.container .Theme-Default-Logos,
.node-type-shorthand-story .main-container.container .Theme-Logo,
.node-type-shorthand-story .main-container.container #footer_shorthand_link {
  display: none;
}

.node-type-shorthand-story .main-container.container .section-navigation {
  top: 0;
}

.node-type-shorthand-story .content {
  margin-top: 0;
}

.node-type-shorthand-story a:hover {
  text-decoration: none;
}

.node-type-shorthand-story blockquote {
  padding: 0;
  margin: 0;
  border: 0 none transparent;
}

/* SHORTHAND V1 CAN BE DELETED AFTER V1 IS DROPPED*/

.node-type-shorthand-story .main-container #bc-header-wrapper,
.node-type-shorthand-story .main-container #bc-footer-wrapper {
  display: none;
}

/* SHORTHAND EMBED */

.node-type-shorthand-embed .navbar {
  margin-bottom: 0;
}

.node-type-shorthand-embed .main-container.container  {
  padding-bottom: 0;
}

.node-type-shorthand-embed .shorthand-container .Theme-Logos {
  display: none;
}

.node-type-shorthand-embed .shorthand-container .Theme-HeaderContainer {
  height: 0;
}

.node-type-shorthand-embed .shorthand-container .Theme-HeaderContainer .Navigation__hamburger {
  margin-top: unset;
}

.node-type-shorthand-embed .shorthand-container .Videoplayer--responsive iframe {
  max-height: unset;
}

.node-type-shorthand-embed .shorthand-container .Theme-Footer .Layout__snap--xright {
  display: none;
}

/* END SHORTHAND */

.salesforce.agent {
  background: #fff;
  padding: 20px 10px;
}

.salesforce.agent .available {
  cursor: pointer;
}

.salesforce.agent .unavailable {
  color: #fff;
  cursor: not-allowed;
  background: #333;
}

.salesforce.agent .unavailable:hover {
  background: #333;
}

.view-product-finder-ielts-test-dates
  .views-exposed-form
  .views-exposed-widget {
  float: none;
  padding: 0.5em 0;
}

@media (max-width: 568px) {
  .view-product-finder-ielts-test-dates.view-display-id-block_pf_ielts_test_dates
    .view-filters
    h3 {
    padding: 0 15px;
  }
}

/**
 * SOLAS-6877: Country listing in the content area
 */

.bc-form-panel.bc-panel-country-listing span.bc-svg-circle {
  margin-right: 1em;
  display: block;
  float: left;
}

.bc-form-panel.bc-panel-country-listing h2 {
  margin: 14px 0 0;
  font-size: 1.111em;
  display: block;
  float: left;
}

@media (min-width: 0px) and (max-width: 480px) {
  .bc-form-panel.bc-panel-country-listing h2,
  .bc-form-panel.bc-panel-country-listing span.bc-svg-circle {
    float: none;
  }

  .bc-form-panel.bc-panel-country-listing span.bc-svg-circle {
    display: inline-block;
  }
}

.bc-show-hide .bc-show-hide-body div:not(:first-child) h3 {
  margin: 17px 0;
}

@media (min-width: 569px) {
  #views-exposed-form-product-finder-ielts-test-dates-block-pf-ielts-test-dates.bg-theme {
    padding: 0;
  }
}

#views-exposed-form-product-finder-ielts-test-dates-block-pf-ielts-test-dates
  .views-exposed-widget {
  background: #ebeff0;
  margin: 0 15px 15px 15px;
}

@media (min-width: 569px) {
  #views-exposed-form-product-finder-ielts-test-dates-block-pf-ielts-test-dates
    .views-exposed-widget {
    margin: 0 0 15px 0;
  }
}

#views-exposed-form-product-finder-ielts-test-dates-block-pf-ielts-test-dates
  .views-exposed-widget
  label {
  font-size: 16px;
  margin-bottom: 0;
  margin-top: 7px;
}

.view-product-finder-ielts-test-dates > .bc-show-hides > .view-filters > h3 {
  font-size: 1.4rem;
}

#views-exposed-form-product-finder-ielts-test-dates-block-pf-ielts-test-dates
  .views-exposed-widget.views-submit-button {
  padding: 0;
}

#views-exposed-form-product-finder-ielts-test-dates-block-pf-ielts-test-dates
  .views-exposed-widget.views-submit-button
  .form-submit {
  font-size: 1.1em;
  margin-top: 0;
}

.view-product-finder-ielts-test-dates .view-filters {
  margin-bottom: 30px;
  padding: 40px 30px 15px 30px;
  background-color: #ebeff0;
  border: 1px solid #346e9e;
}

/**
 * RRSSB social media widget - SOLAS-6884
 */

.rrssb {
  margin-bottom: 30px;
  padding-right: 0 !important;
}

.rrssb-prefix {
  position: static !important;
  margin-bottom: 10px;
  font-size: 24px;
  font-weight: 300;
  font-family: BCSans;
  line-height: 2.5em !important;
}

ul.rrssb-buttons {
  padding-left: 0 !important;
}

/* Overridding RRSSB social media black icons - SOLAS-6837 */
.rrssb-buttons a {
  background-color: transparent !important;
  color: transparent;
  display: block;
  position: relative;
  padding: 5px 0 5px 40px;
  height: auto;
}

span.rrssb-icon {
  display: none !important;
}

span.rrssb-text {
  visibility: hidden;
  margin: 0;
}

.rrssb-buttons li {
  width: 60px;
}

.rrssb-buttons li a:before {
  background: url(../css/footer/social-sprite-black-mobile.svg) no-repeat;
  width: 32px;
  height: 32px;
  content: " ";
  display: block;
  position: absolute;
  margin-top: -2px;
  margin-left: -40px;
}

.lt-ie9 .rrssb-buttons li a:before {
  background-image: url(../footer/social-sprite-black-mobile.png);
}

.rrssb-buttons li a:focus:before,
.rrssb-buttons li a:hover:before {
  opacity: 0.7;
  filter: alpha(opacity=70);
}
/** All social media icons currently in use as per Solas-SUI **/
.rrssb-buttons a[href*="audioboo."]:before {
  background-position: 20% 0;
}
.rrssb-buttons a[href*="bilibili."]:before {
  background-position: 40% 75%;
}
.rrssb-buttons a[href*="mailto"]:before {
  background-position: 0 25%;
}
.rrssb-buttons a[href*="cyworld."]:before {
  background-position: 20% 25%;
}
.rrssb-buttons a[href*="douban."]:before {
  background-position: 40% 0;
}
.rrssb-buttons a[href*="facebook."]:before {
  background-position: 40% 25%;
}
.rrssb-buttons a[href*="flickr."]:before {
  background-position: 0 50%;
}
.rrssb-buttons a[href*="google."]:before {
  background-position: 20% 50%;
}
.rrssb-buttons a[href*="instagram."]:before {
  background-position: 40% 50%;
}
.rrssb-buttons a[href*="issuu."]:before {
  background-position: 60% 0;
}
.rrssb-buttons a[href*="linkedin."]:before {
  background-position: 60% 25%;
}
.rrssb-buttons a[href*="myspace."]:before {
  background-position: 60% 50%;
}
.rrssb-buttons a[href*="pinterest."]:before {
  background-position: 0 75%;
}
.rrssb-buttons a[href*="podcast."]:before {
  background-position: 20% 75%;
}
.rrssb-buttons a[href*="renren."]:before {
  background-position: 0 0;
}
.rrssb-buttons .rrssb-rss a:before {
  background-position: 60% 75%;
}
.rrssb-buttons a[href*="slideshare."]:before {
  background-position: 80% 0;
}
.rrssb-buttons a[href*="snapchat."]:before {
  background-position: 80% 25%;
}
.rrssb-buttons a[href*="soundcloud."]:before {
  background-position: 80% 50%;
}
.rrssb-buttons a[href*="twitter."]:before {
  background-position: 80% 75%;
}
.rrssb-buttons a[href*="ustream."]:before {
  background-position: 0 100%;
}
.rrssb-buttons a[href*="vimeo."]:before {
  background-position: 20% 100%;
}
.rrssb-buttons a[href*="vk.com"]:before {
  background-position: 40% 100%;
}
.rrssb-buttons a[href*="wechat."]:before,
.rrssb-buttons a[href*="weixin."]:before {
  background-position: 60% 100%;
}
.rrssb-buttons a[href*="sina."]:before,
.rrssb-buttons a[href*="weibo."]:before {
  background-position: 80% 100%;
}
.rrssb-buttons a[href*="yammer."]:before {
  background-position: 100% 0;
}
.rrssb-buttons a[href*="youku."]:before {
  background-position: 100% 25%;
}
.rrssb-buttons a[href*="youtube."]:before {
  background-position: 100% 50%;
}

a.bc-multicolor-rows.country-specific-scholarships:before,
a.bc-multicolor-rows.global-scholarships:before,
a.bc-multicolor-rows.science-and-research-funding:before {
  background-color: #50185f;
}

/* Alert styling for the WYSIWYG editor style dropdown, please update the solas-ui-wysiwyg.css */
.bc-alert-wrapper {
  display: block;
  background-color: #230859;
  color: #fff;
  padding: 30px 20px;
  line-height: 1.444em;
}

/* Grey panel. Default panel is made of multiple elements so it can not be used with wysiwyg. */
.bc-wysiwyg-panel {
  display: block;
  background-color: #ebeff0;
  text-align: center;
  padding: 30px 20px;
  line-height: 1.444em;
  margin: 0 0 30px;
}

/* Links */
.bc-alert-wrapper a {
  text-decoration: underline;
  color: #fff;
}

.bc-alert-wrapper a:hover,
.bc-alert-wrapper a:focus {
  color: rgba(255, 255, 255, 0.7);
}

/* Headers */
h2.bc-alert-wrapper,
h3.bc-alert-wrapper,
h4.bc-alert-wrapper,
h5.bc-alert-wrapper {
  margin: 0;
}

/* Paragraphs. Note: alert can be applied to multiple paragraphs. */
p.bc-alert-wrapper {
  margin: 0;
}

/* Lists Note: After the UL there maybe a p or other element. */
dl.bc-alert-wrapper,
ul.bc-alert-wrapper,
ol.bc-alert-wrapper {
  margin: 0;
  padding-left: 40px;
  padding-right: 40px;
}

/**
 * SOLAS-7291 - Recolouring course delivery types on 'Landing page - English courses' CT.
 */

.node-type-landing-page-al a.bc-multicolor-rows.classroom:before {
  background-color: #00DCFF
}

.node-type-landing-page-al a.bc-multicolor-rows.classroom-and-online:before {
  background-color: #00EDC3
}

.node-type-landing-page-al a.bc-multicolor-rows.online:before {
  background-color: #FF00C8
}

.node-type-landing-page-al a.bc-multicolor-rows.mobile-app:before {
  background-color: #035C67
}

.node-type-landing-page-al a.bc-multicolor-rows.website:before {
  background-color: #EA0034
}

.node-type-landing-page-al a.bc-multicolor-rows.tv:before {
  background-color: #898A8D
}

.node-type-landing-page-al a.bc-multicolor-rows.radio:before {
  background-color: #E4B800
}

.node-type-landing-page-al a.bc-multicolor-rows.live-online-classes:before {
  background-color: #23085A
}

.node-type-landing-page-al a.bc-multicolor-rows.adults:before {
  background-color: #23085A
}

.node-type-landing-page-al a.bc-multicolor-rows.children:before {
  background-color: #FF8200
}

.node-type-landing-page-al a.bc-multicolor-rows.kids-and-teens:before {
  background-color: #FF8200
}

.node-type-landing-page-al a.bc-multicolor-rows.online-classes:before {
  background-color: #FF00C8
}

.node-type-landing-page-al a.bc-multicolor-rows.online-self-study:before {
  background-color: #B25EFF
}

.node-type-landing-page-al a.bc-multicolor-rows.classroom-and-self-study:before {
  background-color: #5DEB4B
}
  
/**
 * SOLAS-7390 - This change is in SUI but added here for white label sites
 * which will not be adopting SUI updates.
 */
.h3, h3 {
  font-weight: 600;
}

.h4, h4 {
  font-weight: normal;
}
