/**
 * @file
 * Event Companion presentation overrides migrated from CSS Editor.
 *
 * These are intentionally loaded after the generic MyEvent UI layer so the
 * event owner's field-driven design choices remain authoritative inside the
 * public Event Companion.
 */

/* Site layout --------------------------------------------------------- */
.active-top-1 > .solo-inner > div,
.active-main-1 > .solo-inner > div,
.active-bottom-1 > .solo-inner > div,
.active-footer-1 > .solo-inner > div {
  width: 100%;
  margin: 0;
}

div#sidebar-box-main .region-inner {
  padding: 0;
}

.page-wrapper,
.solo-outer,
.region-inner {
  background-color: #fff;
}

.active-top-1 > .solo-inner,
.active-main-1 > .solo-inner,
.active-bottom-1 > .solo-inner,
.active-footer-1 > .solo-inner {
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
}

nav.solo-clear.tabs {
  margin-bottom: 0 !important;
}

/* Event title --------------------------------------------------------- */
.group.group--full.group--event-group
.block-field-blockgroupevent-grouplabel
.field--name-label {
  color: var(--event-primary-colour);
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.15;
}

/* Secondary headings and tagline ------------------------------------ */
.group.group--full.group--event-group h2,
.group.group--full.group--event-group h3,
.group.group--full.group--event-group
.field--name-field-event-tagline {
  color: var(--event-secondary-colour);
}

/* General text -------------------------------------------------------- */
.group.group--full.group--event-group {
  color: var(--event-paragraph-colour);
}

/* Content panels ------------------------------------------------------ */
.group.group--full.group--event-group
.field--name-field-event-description {
  padding: 1rem;
  border-radius: var(--event-corner-radius);
  background: var(--event-content-box-colour);
}

/* Dates and location -------------------------------------------------- */
.group.group--full.group--event-group
.field--name-field-event-start,
.group.group--full.group--event-group
.field--name-field-event-end,
.group.group--full.group--event-group
.field--name-field-event-location-name,
.group.group--full.group--event-group
.field--name-field-event-address {
  color: var(--event-paragraph-colour);
}

/* Ordinary links ------------------------------------------------------ */
.group.group--full.group--event-group a:not(.button) {
  color: var(--event-primary-colour);
}

/* Buttons and prominent actions ------------------------------------- */
.group.group--full.group--event-group .button,
.group.group--full.group--event-group input[type="submit"] {
  border-color: var(--event-primary-colour);
  border-radius: var(--event-corner-radius);
  background: var(--event-primary-colour);
  color: var(--event-menu-text-colour);
}

/* Configurable borders ----------------------------------------------- */
.group.group--full.group--event-group img,
.group.group--full.group--event-group .myevent-bordered {
  border-color: var(--event-border-colour);
  border-radius: var(--event-corner-radius);
}

.group.group--full.group--event-group.image-borders img {
  border-style: solid;
  border-width: var(--event-border-width);
}

/* Optional shadows ---------------------------------------------------- */
.group.group--full.group--event-group.box-shadows
.myevent-content-box {
  box-shadow:
    0 .75rem var(--event-shadow-blur)
    rgb(0 0 0 / var(--event-shadow-opacity));
}

.group.group--full.group--event-group.text-shadows h1,
.group.group--full.group--event-group.text-shadows h2,
.group.group--full.group--event-group.text-shadows h3 {
  text-shadow:
    0 .12em var(--event-shadow-blur)
    rgb(0 0 0 / var(--event-shadow-opacity));
}

/* QuickTabs wrapper --------------------------------------------------- */
.group.group--full.group--event-group .quicktabs-wrapper {
  width: 100%;
  color: var(--event-paragraph-colour);
}

/*
 * Generic QuickTabs styling below is intentionally limited to instances that
 * are not the dedicated Event Overview rail/sub-navigation. Those two
 * instances already have more specific layout rules in main.css.
 */
.group.group--full.group--event-group
.quicktabs-wrapper:not(#quicktabs-event_overview_tabs):not(#quicktabs-event_tabs)
.quicktabs-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--event-menu-colour);
}

.group.group--full.group--event-group
.quicktabs-wrapper:not(#quicktabs-event_overview_tabs):not(#quicktabs-event_tabs)
.quicktabs-tabs > li > a {
  display: block;
  padding: .75rem 1rem;
  color: var(--event-menu-text-colour);
  text-decoration: none;
}

.group.group--full.group--event-group
.quicktabs-wrapper:not(#quicktabs-event_overview_tabs):not(#quicktabs-event_tabs)
.quicktabs-tabs > li.active > a,
.group.group--full.group--event-group
.quicktabs-wrapper:not(#quicktabs-event_overview_tabs):not(#quicktabs-event_tabs)
.quicktabs-tabs > li > a:focus,
.group.group--full.group--event-group
.quicktabs-wrapper:not(#quicktabs-event_overview_tabs):not(#quicktabs-event_tabs)
.quicktabs-tabs > li > a:hover {
  background: var(--event-primary-colour);
  color: var(--event-menu-text-colour);
}

/* Main tab-content container. */
.group.group--full.group--event-group .quicktabs-main {
  width: 100%;
  padding: 1rem;
  border: var(--event-border-width) solid var(--event-border-colour);
  border-radius: var(--event-corner-radius);
  background: var(--event-content-box-colour);
}

.group.group--full.group--event-group
#quicktabs-event_overview_tabs > .quicktabs-main {
  padding: 0;
  border: 0;
  background: transparent;
}

.group.group--full.group--event-group .quicktabs-tabpage {
  color: var(--event-paragraph-colour);
}

.group.group--full.group--event-group .quicktabs-tabpage h2,
.group.group--full.group--event-group .quicktabs-tabpage h3 {
  color: var(--event-secondary-colour);
}

.group.group--full.group--event-group.box-shadows .quicktabs-main {
  box-shadow:
    0 .75rem var(--event-shadow-blur)
    rgb(0 0 0 / var(--event-shadow-opacity));
}

/* Event overview ------------------------------------------------------ */
.group.group--full.group--event-group
.view-event-overview .views-row {
  display: grid;
  grid-template-columns: 9rem minmax(0, 1fr);
  grid-template-areas:
    "cover cover"
    "logo title"
    "logo tagline"
    "logo summary"
    "description description";
  align-items: center;
  gap: .5rem 1.25rem;
}

.group.group--full.group--event-group
.event-overview-cover {
  grid-area: cover;
  height: 16rem;
  overflow: hidden;
}

.group.group--full.group--event-group
.event-overview-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.group.group--full.group--event-group
.event-overview-logo {
  grid-area: logo;
  position: relative;
  margin-top: -4rem;
}

.group.group--full.group--event-group
.event-overview-logo img {
  width: 9rem;
  height: 9rem;
  border: .35rem solid #fff;
  border-radius: 50%;
  object-fit: cover;
}

.group.group--full.group--event-group
.event-overview-title {
  grid-area: title;
  color: var(--event-primary-colour);
  font-size: 2rem;
  font-weight: 700;
}

.group.group--full.group--event-group
.event-overview-tagline {
  grid-area: tagline;
  color: var(--event-secondary-colour);
}

.group.group--full.group--event-group
.event-overview-description {
  grid-area: description;
  padding: 1rem;
  border-radius: var(--event-corner-radius);
  background: var(--event-content-box-colour);
}

/* Corrected typo from CSS Editor: "non" -> "none". */
.group.group--full.group--event-group
.event-hero .event-hero__logo img,
.group.group--full.group--event-group
.event-hero .event-hero__logo .solo-image {
  box-shadow: none !important;
}