/* --------------- EVENT LOCATION FIELD --------------- */
body:not(.front-page) .view-events .views-row .event-location {
  height: 100%;
  min-height: 3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  padding: .75rem 0;
  font-size: 16px;
  border-top: 1px solid var(--border_gray);

  background-position: 1rem center;
  background-repeat: no-repeat;
  background-size: 1rem 1rem;
}

body:not(.front-page) .view-events .views-row .event-location>div:first-child {
  padding: 0 1rem 0 3rem;
  /* background-position: 1rem center;
  background-repeat: no-repeat;
  background-size: 1rem 1rem; */
  text-transform: uppercase;
}

.event-location .field--name-field-event-room {
  padding-left: 3rem;
  padding-right: .8999rem;
  font-size: 14px;
  color: var(--medium_gray);
}

body:not(.front-page) .view-events .views-row.online .event-location/* >div:first-child */ {
  background-image: url(../../assets/icons/icon_online.svg);
  /* background-size: 17px 14px;
  background-position: 17px center; */
  background-size: 22px;
  background-position: 14px center;
}

body:not(.front-page) .view-events .views-row.physical .event-location/* >div:first-child */ {
  background-image: url(../../assets/icons/icon_pin.svg);
  /* background-size: 20px 22px;
  background-position: 16px center; */
  background-size: 28px;
  background-position: 12px center;
}

body:not(.front-page) .view-events .views-row.hybrid .event-location/* >div:first-child */ {
  background-image: url(../../assets/icons/icon_hybrid.svg);
  /* background-size: 18px 20px;
  background-position: 18px center; */
  background-size: 24px;
  background-position: 14px center;
}

@media (min-width: 1024px) {
  body:not(.front-page) .view-events .views-row .event-location {
    min-height: 4.5rem;
    padding: 0;
    border-top: none;
  }

  /* body:not(.front-page) .view-events .views-row .event-location > div:first-child { background-size: 1.2rem 1.2rem; } */
}


/* --------------- EVENT TOPIC FIELD --------------- */
body:not(.front-page) .view-events .views-row .event-topic {
  padding: .5rem 1rem 0 1rem;
  color: var(--medium_gray);
  font-size: 14px;
  text-transform: uppercase;
  display: flex;
  flex-direction: row;
}

@media (min-width: 1024px) {
  body:not(.front-page) .view-events .views-row .event-topic {
    padding: 1rem 1rem 0 1rem;
  }
}


/* --------------- EVENT TITLE FIELD --------------- */
body:not(.front-page) .view-events .views-row h3.event-title {
  margin: 0;
  padding: .1rem 1rem 1rem 1rem;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.5rem;

  /* max-height: 7rem;
    overflow: hidden; */
}
body:not(.front-page) .view-events .views-row.colloquia h3.event-title {
  margin-top: 0;
}

@media (min-width: 1024px) {
  body:not(.front-page) .view-events .views-row h3.event-title {
    font-size: 20px;
    line-height: 1.7rem;
  }
}


/* --------------- sections and targets basic layout --------------- */
body:not(.front-page) .view-events .views-row .sections,
body:not(.front-page) .view-events .views-row .targets {
  height: 100%;
  min-height: 3rem;
  flex-direction: row;
  align-items: center;
  padding: .5rem .5rem .5rem .75rem;
}

@media (min-width: 1024px) {

  body:not(.front-page) .view-events .views-row .sections,
  body:not(.front-page) .view-events .views-row .targets {
    min-height: 4.5rem;
    padding: 0 .5rem;
  }
}

@media (min-width: 1400px) {

  body:not(.front-page) .view-events .views-row .sections,
  body:not(.front-page) .view-events .views-row .targets {
    padding: 0 .75rem;
  }
}


/* --------------- SECTIONS FIELD --------------- */
body:not(.front-page) .view-events .views-row .sections {
  display: flex;
}

body:not(.front-page) .view-events .views-row .sections .section {
  height: 2.25rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 2.75rem;
  color: var(--medium_gray);
  font-size: 12px;
  text-transform: uppercase;
  background-position: left center;
  background-repeat: no-repeat;
  background-size: contain;
}

/* SECTION LOGOS */
body:not(.front-page) .view-events .views-row .sections .section.hecap {
  background-image: url(../../assets/loghi/logo-hecap-col-typo.svg);
}

body:not(.front-page) .view-events .views-row .sections .section.cmsp {
  background-image: url(../../assets/loghi/logo-cmsp-col-typo.svg);
}

body:not(.front-page) .view-events .views-row .sections .section.math {
  background-image: url(../../assets/loghi/logo-math-col-typo.svg);
}

body:not(.front-page) .view-events .views-row .sections .section.qls {
  background-image: url(../../assets/loghi/logo-qls-col-typo.svg);
}

body:not(.front-page) .view-events .views-row .sections .section.sti {
  background-image: url(../../assets/loghi/logo-sti-col-typo.svg);
}

body:not(.front-page) .view-events .views-row .sections .section.esp {
  background-image: url(../../assets/loghi/logo-esp-col-typo.svg);
}

/* hide labels if multiple */
body:not(.front-page) .view-events .views-row .sections.multiple-sections .section {
  font-size: 0;
}

body:not(.front-page) .view-events .views-row .sections.multiple-sections .section:last-child {
  padding-left: 2.25rem;
}

@media (min-width: 1400px) {
  body:not(.front-page) .view-events .views-row .sections .section {
    padding-left: 3rem;
    height: 2.5rem;
  }

  body:not(.front-page) .view-events .views-row .sections.multiple-sections .section:last-child {
    padding-left: 2.5rem;
  }
}


/* --------------- TARGETS FIELD --------------- */
/* hidden in mobile */
body:not(.front-page) .view-events .views-row .targets {
  display: none;
}

body:not(.front-page) .view-events .views-row .targets .target {
  height: 2rem;
  width: 2rem;
  font-size: 0;
  margin-right: .5rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}

/* !!! TEMP TARGETS ICONS !!! */
body:not(.front-page) .view-events .views-row .targets .target:nth-child(2n) {
  background-image: url(../../assets/icons/icon-events-hat.svg);
}

body:not(.front-page) .view-events .views-row .targets .target:nth-child(2n + 1) {
  background-image: url(../../assets/icons/icon-events-books.svg);
}

@media (min-width: 1024px) {
  body:not(.front-page) .view-events .views-row .targets {
    display: flex;
  }
}

@media (min-width: 1400px) {
  body:not(.front-page) .view-events .views-row .targets .target {
    height: 2.5rem;
    width: 2.5rem;
  }
}


/* --------------- SEMINAR SPEAKERS FIELD --------------- */
body:not(.front-page) .view-events .views-row .targets .field--name-field-event-speakers,
body:not(.front-page) .view-events .views-row .targets .field--name-field-event-speakers p {
  margin: 0;
  font-size: 14px;
  line-height: 1.25em;
}

body:not(.front-page) .view-events .views-row .targets .field--name-field-event-speakers {
  padding-left: 2.25rem;
  background-image: url(/themes/custom/ictp/assets/icons/icon_speakers.svg);
  background-size: 25px 25px;
  background-repeat: no-repeat;
  background-position: left center;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* --------------- SINGLE ROW WITH SECTIONS AND LOGOS (colloquia and ceremonies) --------------- */
body:not(.front-page) .view-events .views-row .logos-row {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1024px) {
  body:not(.front-page) .view-events .views-row .logos-row {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
  }

  body:not(.front-page) .view-events .views-row .logos-row .sections {
    width: 66.66%;
    padding: .5rem;
    border-right: 1px solid var(--border_gray);
  }

  body:not(.front-page) .view-events .views-row .logos-row .targets {
    width: 33.33%;
    padding: .5rem;
  }
}


/* --------------- EVENT SINGLE DATE : START TIME or DEADLINE --------------- */
/* hidden in mobile */
body:not(.front-page) .view-events .views-row .dead-date {
  display: none;
}

/* always show start date */
body:not(.front-page) .view-events .views-row div:not(.row-dates)>.start-date {
  display: flex;
}

/* dates typography */
body:not(.front-page) .view-events .views-row div:not(.row-dates)>.start-date,
body:not(.front-page) .view-events .views-row .dead-date {
  flex-direction: row;
  align-items: flex-end;
  padding: 1rem 1rem 1rem 3rem;
  font-size: 18px;
  font-weight: 500;
}

/* DEFAULT GREY CALENDAR ICON  */
body:not(.front-page) .view-events .views-row div:not(.row-dates)>.start-date {
  background-position: 1rem center;
  background-repeat: no-repeat;
  background-size: 1rem 1rem;
  background-image: url(../../assets/icons/icon_calendar.svg);
}

/* space after day and month */
body:not(.front-page) .view-events .views-row .dead-date *,
body:not(.front-page) .view-events .views-row.scientific-activity div:not(.row-dates)>.start-date *,
body:not(.front-page) .view-events .views-row.seminars div:not(.row-dates)>.start-date *,
body:not(.front-page) .view-events .views-row.colloquia div:not(.row-dates)>.start-date *,
body:not(.front-page) .view-events .views-row.ceremonies div:not(.row-dates)>.start-date *,
body:not(.front-page) .view-events .views-row.prizes div:not(.row-dates)>.start-date *,
body:not(.front-page) .view-events .views-row.hosted div:not(.row-dates)>.start-date * {
  margin-right: .25em;
}

/* year label smaller */
body:not(.front-page) .view-events .views-row .dead-date .year,
body:not(.front-page) .view-events .views-row div:not(.row-dates)>.start-date .year {
  font-size: 16px;
  font-weight: 300;
}

/* colored CALENDAR icons - MOBILE */
body:not(.front-page) .view-events .views-row.hecap div:not(.row-dates)>.start-date {
  background-image: url(../../assets/icons/icon_calendar_hecap.svg);
}

body:not(.front-page) .view-events .views-row.cmsp div:not(.row-dates)>.start-date {
  background-image: url(../../assets/icons/icon_calendar_cmsp.svg);
}

body:not(.front-page) .view-events .views-row.math div:not(.row-dates)>.start-date {
  background-image: url(../../assets/icons/icon_calendar_math.svg);
}

body:not(.front-page) .view-events .views-row.sti div:not(.row-dates)>.start-date {
  background-image: url(../../assets/icons/icon_calendar_sti.svg);
}

body:not(.front-page) .view-events .views-row.qls div:not(.row-dates)>.start-date {
  background-image: url(../../assets/icons/icon_calendar_qls.svg);
}

body:not(.front-page) .view-events .views-row.esp div:not(.row-dates)>.start-date {
  background-image: url(../../assets/icons/icon_calendar_esp.svg);
}

@media (min-width: 1024px) {

  /* show deadline in mobile */
  body:not(.front-page) .view-events .views-row .dead-date {
    display: flex;
  }

  /* if ONE or NONE section assigned, white calendar on colored background */
  body:not(.front-page) .view-events .views-row.single-color:not(.seminars) div:not(.row-dates)>.start-date,
  body:not(.front-page) .view-events .views-row.home-color:not(.seminars) div:not(.row-dates)>.start-date {
    background-image: url(../../assets/icons/icon_calendar_w.svg);
  }

  /* general typography */
  body:not(.front-page) .view-events .views-row div:not(.row-dates)>.start-date,
  body:not(.front-page) .view-events .views-row .dead-date {
    padding: 1.2rem 1rem 1.2rem 3rem;
    font-size: 14px;
    border-bottom: none;
    border-top: 1px solid var(--border_gray);
  }

  body:not(.front-page) .view-events .views-row.single-color:not(.seminars) div:not(.row-dates)>.start-date,
  body:not(.front-page) .view-events .views-row.single-color:not(.seminars) .dead-date,
  body:not(.front-page) .view-events .views-row.home-color:not(.seminars) div:not(.row-dates)>.start-date,
  body:not(.front-page) .view-events .views-row.home-color:not(.seminars) .dead-date {
    border-top: 1px solid #FFFFFF55;
  }

  body:not(.front-page) .view-events .views-row .dead-date .year,
  body:not(.front-page) .view-events .views-row div:not(.row-dates)>.start-date .year {
    height: 1em;
    font-size: 12px;
  }

  /* ?? align date labels - to fix ?? */
  body:not(.front-page) .view-events .views-row .dead-date *,
  body:not(.front-page) .view-events .views-row.scientific-activity div:not(.row-dates)>.start-date *,
  body:not(.front-page) .view-events .views-row.seminars div:not(.row-dates)>.start-date *,
  body:not(.front-page) .view-events .views-row.colloquia div:not(.row-dates)>.start-date *,
  body:not(.front-page) .view-events .views-row.ceremonies div:not(.row-dates)>.start-date *,
  body:not(.front-page) .view-events .views-row.prizes div:not(.row-dates)>.start-date *,
  body:not(.front-page) .view-events .views-row.hosted div:not(.row-dates)>.start-date * {
    height: 1em;
  }
}


/* --------------- COLUMN DATES : START TIME - END TIME --------------- */
/* DEFAULT GREY TIME ICON */
body:not(.front-page) .view-events .views-row .column-times {
  display: flex;
  flex-direction: column;
  justify-self: flex-end;
  padding: 1rem 1rem 1rem 3rem;
  background-repeat: no-repeat;
  background-position: 1rem center;
  background-size: 1rem 1rem;
  background-image: url(../../assets/icons/icon_time.svg);
}

/* colored TIME icons - MOBILE */
body:not(.front-page) .view-events .views-row.hecap .column-times {
  background-size: 18px 18px;
  background-image: url(../../assets/icons/icon_time_hecap.svg);
}

body:not(.front-page) .view-events .views-row.cmsp .column-times {
  background-size: 18px 18px;
  background-image: url(../../assets/icons/icon_time_cmsp.svg);
}

body:not(.front-page) .view-events .views-row.math .column-times {
  background-size: 18px 18px;
  background-image: url(../../assets/icons/icon_time_math.svg);
}

body:not(.front-page) .view-events .views-row.qls .column-times {
  background-size: 18px 18px;
  background-image: url(../../assets/icons/icon_time_qls.svg);
}

body:not(.front-page) .view-events .views-row.esp .column-times {
  background-size: 18px 18px;
  background-image: url(../../assets/icons/icon_time_esp.svg);
}

body:not(.front-page) .view-events .views-row.sti .column-times {
  background-size: 18px 18px;
  background-image: url(../../assets/icons/icon_time_sti.svg);
}

/* time label */
body:not(.front-page) .view-events .views-row .column-times .start-time {
  height: 1em;
  font-size: 18px;
  font-weight: 500;
}

@media (min-width: 1024px) {
  body:not(.front-page) .view-events .views-row .column-times {
    position: relative;
    justify-content: unset;
    padding: 3.5rem 1rem 1rem 3rem;
    background-image: none !important;
  }

  /* time labels */
  body:not(.front-page) .view-events .views-row .column-times .start-time {
    font-size: 34px;
    height: unset;
  }

  body:not(.front-page) .view-events .views-row .column-times .end-time {
    font-size: 22px;
    padding-left: 1rem;
    font-weight: 500;
    position: relative;
  }

  /* times separator */
  body:not(.front-page) .view-events .views-row .column-times .end-time::before {
    content: '-';
    position: relative;
  }

  /* desktop time icon */
  body:not(.front-page) .view-events .views-row .column-times::before {
    content: 'Starting time';
    position: absolute;
    top: 1.75rem;
    left: 0;
    padding-left: 3rem;
    color: var(--medium_gray);
    font-size: 14px;
    font-weight: 400;
    background-repeat: no-repeat;
    background-position: 1rem center;
    background-size: 1rem 1rem;
    background-image: url(../../assets/icons/icon_time.svg);
  }

  /* if ONE or NONE section assigned, white time on colored background */
  body:not(.front-page) .view-events .views-row.single-color:not(.seminars) .column-times::before,
  body:not(.front-page) .view-events .views-row.home-color:not(.seminars) .column-times::before {
    color: #FFF;
    background-image: url(../../assets/icons/icon_time_w.svg);
  }

  /* desktop colored icons for seminars */
  body:not(.front-page) .view-events .views-row.seminars.hecap .column-times::before {
    background-image: url(../../assets/icons/icon_time_hecap.svg);
  }

  body:not(.front-page) .view-events .views-row.seminars.cmsp .column-times::before {
    background-image: url(../../assets/icons/icon_time_cmsp.svg);
  }

  body:not(.front-page) .view-events .views-row.seminars.math .column-times::before {
    background-image: url(../../assets/icons/icon_time_math.svg);
  }

  body:not(.front-page) .view-events .views-row.seminars.qls .column-times::before {
    background-image: url(../../assets/icons/icon_time_qls.svg);
  }

  body:not(.front-page) .view-events .views-row.seminars.esp .column-times::before {
    background-image: url(../../assets/icons/icon_time_esp.svg);
  }

  body:not(.front-page) .view-events .views-row.seminars.sti .column-times::before {
    background-image: url(../../assets/icons/icon_time_sti.svg);
  }
}


/* --------------- ROW DATES : EVENT START - END DATE --------------- */
/* DEFAULT GREY DATES ICON */
body:not(.front-page) .view-events .views-row .row-dates {
  display: flex;
  flex-direction: row;
  position: relative;
  justify-content: space-between;
  padding: 1rem 1rem 1rem 3rem;
  background-repeat: no-repeat;
  background-position: 1rem center;
  background-size: 1rem 1rem;
  background-image: url(../../assets/icons/icon_calendar.svg);
}

/* show dates on row in mobile */
body:not(.front-page) .view-events .views-row .row-dates .start-date,
body:not(.front-page) .view-events .views-row .row-dates .end-date {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  position: relative;
}

/* section colored row dates icons */
body:not(.front-page) .view-events .views-row.hecap .row-dates {
  background-image: url(../../assets/icons/icon_calendar_hecap.svg);
}

body:not(.front-page) .view-events .views-row.cmsp .row-dates {
  background-image: url(../../assets/icons/icon_calendar_cmsp.svg);
}

body:not(.front-page) .view-events .views-row.math .row-dates {
  background-image: url(../../assets/icons/icon_calendar_math.svg);
}

body:not(.front-page) .view-events .views-row.qls .row-dates {
  background-image: url(../../assets/icons/icon_calendar_qls.svg);
}

body:not(.front-page) .view-events .views-row.sti .row-dates {
  background-image: url(../../assets/icons/icon_calendar_sti.svg);
}

body:not(.front-page) .view-events .views-row.esp .row-dates {
  background-image: url(../../assets/icons/icon_calendar_esp.svg);
}

/* dates separator */
body:not(.front-page) .view-events .views-row .row-dates .end-date {
  padding-left: 1.25rem;
}

body:not(.front-page) .view-events .views-row .row-dates .end-date::before {
  content: '-';
  display: block;
  position: absolute;
  left: .25rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  font-weight: 500;
}

/* ?? hide or not double year label ?? */
body:not(.front-page) .view-events .views-row .row-dates .start-date .year {
  display: none;
}

body:not(.front-page) .view-events .views-row .row-dates .end-date .year {
  font-size: 16px;
  font-weight: 300;
}

body:not(.front-page) .view-events .views-row .row-dates .month,
body:not(.front-page) .view-events .views-row .row-dates .day {
  font-size: 18px;
  font-weight: 500;
  margin-right: .25rem;
}


@media (min-width: 1024px) {
  body:not(.front-page) .view-events .views-row .row-dates {
    width: 100%;
    padding: 3.5rem 1rem 2rem 3rem;
    background-image: none;
  }

  /* change icon position in desktop */
  body:not(.front-page) .view-events .views-row.views-row.single-color .row-dates {
    background-image: none;
  }

  /* dates new separator */
  body:not(.front-page) .view-events .views-row .row-dates::after {
    content: '-';
    position: absolute;
    top: 4.75rem;
    left: 55%;
    transform: translateY(-50%);
    font-size: 34px;
    font-weight: 500;
  }

  /* unset flexboxes and hide previous separator */
  body:not(.front-page) .view-events .views-row .row-dates .start-date,
  body:not(.front-page) .view-events .views-row .row-dates .end-date {
    display: block;
  }

  body:not(.front-page) .view-events .views-row .row-dates .end-date::before {
    display: none;
  }

  /* always hide years */
  body:not(.front-page) .view-events .views-row .row-dates .year {
    display: none;
  }

  body:not(.front-page) .view-events .views-row .row-dates .day {
    font-size: 34px;
    font-weight: 500;
  }

  body:not(.front-page) .view-events .views-row .row-dates .month {
    font-size: 18px;
    font-weight: 300;
    position: relative;
  }

  /* dates label */
  body:not(.front-page) .view-events .views-row .row-dates::before {
    content: 'Duration';
    position: absolute;
    top: 1.75rem;
    left: 0;
    padding-left: 3rem;
    color: var(--medium_gray);
    font-size: 14px;
    font-weight: 400;
    background-repeat: no-repeat;
    background-position: 1rem center;
    background-size: 1rem 1rem;
    background-image: url(../../assets/icons/icon_calendar.svg);
  }

  /* if ONE or NONE section assigned, white calendar on colored background */
  body:not(.front-page) .view-events .views-row.single-color .row-dates::before,
  body:not(.front-page) .view-events .views-row.home-color .row-dates::before {
    color: #FFF;
    background-image: url(../../assets/icons/icon_calendar_w.svg);
  }
}


/* --------------- DEADLINE LABEL "Apply before" --------------- */
body:not(.front-page) .view-events .views-row .dead-date {
  position: relative;
  padding-top: 2.5rem;
}

/* label and deafult grey horuglass icon */
body:not(.front-page) .view-events .views-row .dead-date::before {
  content: 'Apply before';
  position: absolute;
  top: .75rem;
  left: 0;
  padding-left: 3rem;
  color: var(--medium_gray);
  font-size: 14px;
  font-weight: 400;
  background-repeat: no-repeat;
  background-position: 1rem center;
  background-size: 1rem 1rem;
  background-image: url(../../assets/icons/icon_deadline.svg);
}

/* if ONE or NONE section assigned, white horuglass on colored background */
body:not(.front-page) .view-events .views-row.home-color .dead-date::before,
body:not(.front-page) .view-events .views-row.single-color .dead-date::before {
  color: #FFF;
  background-image: url(../../assets/icons/icon_deadline_w.svg);
  background-size: 12px 14px;
  background-position: 19px center;
}

/* hide label and icon if date EXPIRED */
body:not(.front-page) .view-events .views-row .dead-date.expired {
  font-size: 0;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* signal deadline expired */
body:not(.front-page) .view-events .views-row .dead-date.expired::before {
  content: 'Application Closed';
  position: relative;
  font-size: 14px;
  background-image: none;
  top: 50%;
  transform: translateY(-50%);
  padding-left: 0;
}


/* --------------- SMR FIELD for scientific activities --------------- */
body:not(.front-page) .view-events .views-row .field--name-field-event-smr {
  font-size: 14px;
  text-transform: uppercase;
}

body:not(.front-page) .view-events.layout-events-calendar .views-row .grid-two { position: relative; }

body:not(.front-page) .view-events .views-row .grid-two .field--name-field-event-smr {
  position: absolute;
  bottom: 1rem;
  left: 1.75rem;
  font-weight: 300;
  color: #fff;
  display: none;
}

