/**
 * @file
 * CSS file which applies platform-specific styles that are not part of the
 * standard EdGEL package.
 *
 * This file must NOT be used to override or extend any existing EdGEL styles.
 *
**/

.media-container {
  margin: 0 auto;
  max-width: 660px;
}

.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden
}

.embed-responsive .embed-responsive-item,
.embed-responsive embed,
.embed-responsive iframe,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0
}

.embed-responsive-16by9 {
  padding-bottom: 56.25%
}

.embed-responsive-4by3 {
  padding-bottom: 75%
}

.uoe-table-horizontal-scrolling {
  overflow: auto;
  white-space: nowrap;
}

.cite {
  font-style: italic;
}

.beta-container {
  border-top: solid 1px #e8e8e9;
}

.beta-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 2rem;
}

/* styling for image paragraph */

.single-image {
  width: 100%;
}

/* In EdGel image has a margin bottom which renders as white space under the */
/* image if there is no caption. Moved to margin top on caption to fix. */

.figure-caption {
  margin-top: 0.5rem;
}

.figure-img {
  margin-bottom: 0;
  width: 100%;
}

/*  end styling for image paragraph */

/* Tag button styles */
button.btn-brand a {
  color: #fff;
}
.tag-list {
  margin-top: 1rem;
}
.tag-list button {
  margin-right: 1rem;
  border: 1px solid transparent;
}
/* End tag button styles */

/* Footer styles */

.footer-subsite-menu a {
  color: var(--edgel-dark);
}

.footer-subsite-menu a:hover {
  color: #2a5799;
}

.footer-subsite .address-title {
  margin-bottom: .5rem;
  font-size: 20px;
}

.footer-subsite .container-footer {
  padding-bottom: 1rem;
}

a.footer-affiliation-link:hover {
  text-decoration: none;
}
/* End footer styles */

/* Masthead fixes */
@media screen and (max-width: 575px) {
  .container-branding img {
    max-width: 4rem;
  }
}

/* fix to grid layout when theres more than one row */
.grid .col {
  margin-top: 0;
}
.paragraph--type--layout .layout .col {
  margin-top: 1.5rem;
}

/* node layout overrides */
#block-wpp-theme-content {
  margin-top: 1.5rem;
}
#block-wpp-theme-local-tasks ul {
  list-style: none;
  padding-left: 0;
}

#block-wpp-theme-local-tasks ul li {
  display: inline-block;
}
.lead {
  margin-bottom: 2rem;
}

/* design and layout fixes */
.paragraph--type--feature-box.card-featurebox .card-header {
  background-color: #e8e8e8;
}
.paragraph--type--feature-box {
  margin-bottom: 1.25rem;
}
.paragraph--type--feature-box p {
  margin-bottom: 0;
}
 /* webform styling */
.webform-submission-form .form-item-email .form-email {
  display: block;
  width: 100%;
  font-weight: 400;
  line-height: 1.428571429;
  color: #495057;
  background-color: #e9ecef;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.075);
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  min-height: calc(1.428571429em + 1rem + 2px);
  padding: 0.5rem 1rem;
  font-size: calc(12.2px + .675vw);
  border-radius: 0.3rem;
}

.form-label {
  margin-bottom: 0.5rem;
  font-weight: 700;
  display: inline-block;
  width: 100%;
}

/* group sub-site-elements */
#edit-field-site-wide-colour-theme-edgel-red > label::before {
  content:'';
  width: 14px;
  height: 14px;
  display: block;
  float: left;
  margin: 1px 3px 0px 0px;
}

/* (wpp-869) footer images styling */
.footer-affiliation-image {
  float: left;
}
.footer-affiliation-image img {
  max-height: 75px;
}
div.footer-affiliations > div.container-footer {
  overflow: auto;
}

/* [WPP-930] News listing item styling */
.card-news {
  margin-bottom: 1.5rem;
}

.news-list-card,
.event-list-card {
  display: flex;
  flex-basis: auto;
  align-items: center;
  justify-content: flex-start;
  padding: .75rem 1.25rem;
  margin-bottom: 1em;
  height: 100%;
  flex-direction: unset;
}
.news-list-card {
  border-top: solid 4px var(--edgel-brand);
}

.news-tag {
  position: relative;
  z-index: 2;
}

.news-tag>span {
  padding: 0.35em 0.65em;
  font-size: 0.75em;
  font-weight: 700;
  line-height: 1;
}

.news-date-container {
  color: var(--edgel-gray-600);
  display: inline-block;
  font-size: 15px;
  margin-bottom: 8px;
}

.news-date-container>i {
  font-size: 16px;
}

.news-date {
  margin-left: 8px;
  margin-right: 10px;
}

@media (min-width:1600px) {
  .news-listing-title {
    font-size: 20px;
  }
  .news-listing {
    padding-left: 12px;
  }
}

.news-listing {
  flex-grow: 2;
  padding-left: calc(11.1px + .05625vw);
  margin: 0 0 0 -2px;
}

.news-listing-title {
  font-size: calc(11.9px + .50625vw);
  margin-top: 0;
}

.news-listing-img-col {
  display: block;
  flex-shrink: 0;
  width: 30%;
  margin:-.75rem -1.25rem -.75rem 1.25rem;
}

.news-listing-img {
  height: 146px;
  overflow: hidden;
  background-color: #e9ecef;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-newspaper' viewBox='0 0 16 16'%3E%3Cpath d='M0 2.5A1.5 1.5 0 0 1 1.5 1h11A1.5 1.5 0 0 1 14 2.5v10.528c0 .3-.05.654-.238.972h.738a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 1 1 0v9a1.5 1.5 0 0 1-1.5 1.5H1.497A1.497 1.497 0 0 1 0 13.5v-11zM12 14c.37 0 .654-.211.853-.441.092-.106.147-.279.147-.531V2.5a.5.5 0 0 0-.5-.5h-11a.5.5 0 0 0-.5.5v11c0 .278.223.5.497.5H12z'/%3E%3Cpath d='M2 3h10v2H2V3zm0 3h4v3H2V6zm0 4h4v1H2v-1zm0 2h4v1H2v-1zm5-6h2v1H7V6zm3 0h2v1h-2V6zM7 8h2v1H7V8zm3 0h2v1h-2V8zm-3 2h2v1H7v-1zm3 0h2v1h-2v-1zm-3 2h2v1H7v-1zm3 0h2v1h-2v-1z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 30%;
}

.news-listing-img>* {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
#edit-field-event-date-wrapper legend,
#edit-field-news-publication-date-wrapper legend {
  display: none;
}
#edit-field-event-date-wrapper--2 .fieldset-wrapper,
#edit-field-news-publication-date-wrapper--2 .fieldset-wrapper {
  display: flex;
  gap: 20px;
  margin-bottom: 0.7em;
}
#edit-field-event-date-wrapper--2 .fieldset-wrapper input,
#edit-field-news-publication-date-wrapper--2 .fieldset-wrapper input {
  display: block;
  width: 100%;
  padding: .275rem .75rem;
  font-size: calc(1.0625rem + .375vw);
  font-weight: 400;
  line-height: 1.5;
  color: #3a3a3a;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #ececec;
  background-clip: padding-box;
  border: var(--edgel-border-width) solid #d4d4d4;
  border-radius: var(--edgel-border-radius);
  box-shadow: var(--edgel-box-shadow-inset);
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
/* END [WPP-930] News listing item styling */


/**
 * [WPP-837] Fix call-to-action-button padlock icon
 * having the same color with card high style;
 * Fix card-title padlock icon having the same color
 * with card high, medium style;
 */
div.card-high div.paragraph--type--call-to-action i.text-brand,
div.card-high h3.card-title i.text-brand, div.card-medium h3.card-title i.text-brand,
div.card-high ul.card-text.list-unstyled i.text-brand {
  all: unset!important;
}

a.uoe-nav-link-active > i.text-brand {
  color: unset!important;
}
/* END [WPP-837] styling */

/* Two column paragraph overrides */
.two-column > div > div {
  width: 100%;
}
div.paragraph-two-column-single-image {
  text-align: center;
}
div.two-column img.figure-img {
  display: block;
  height: auto;
}

em.placeholder {
  background-color: unset;
  opacity: 1;
  border: 1px solid #999;
  padding: 0 .5rem;
  cursor: unset;
  vertical-align: unset;
  font-style: normal;
}
#views-exposed-form-event-listing-block-1 #edit-actions,
#views-exposed-form-news-listing-block-1 #edit-actions {
  padding-bottom: 1em;
}
@media only screen and (max-width: 766px) {
  #views-exposed-form-event-listing-block-1 .js-form-type-select {
    padding-bottom: 1em;
  }
  .news-listing-img-col {
    display: none;
  }
}

@media only screen and (min-width: 767px) {
  .two-column > div {
    display: flex;
    gap: 5rem;
  }

  .two-column > div > div {
    width: 50%;
  }

  .two-column > div > div *:first-child {
    margin-top: 0;
  }
  #views-exposed-form-event-listing-block-1 .form-item-search-api-fulltext,
  #views-exposed-form-news-listing-block-1 .form-item-search-api-fulltext {
    display: inline-block;
    margin-bottom: 1.5em;
    margin-top: 0em;
    margin-right: 0.9em;
  }
  #views-exposed-form-event-listing-block-1 .js-form-type-select,
  #views-exposed-form-news-listing-block-1 .js-form-type-select {
    display: inline-block;
    margin-bottom: 1.5em;
    margin-top: 0em;
    margin-right: 0em;
  }
}

.form-required::after, .form-required::after {
  display: inline-block;
  content: "*";
  color: var(--edgel-danger);
  line-height: 1;
  margin-right: .15em;
  margin-left: .15em;
  vertical-align: text-top;
  background: none;
  font-size: 0.875rem;
}
