/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

:root {
  --crm-page-bg-color:#fff!important;
  --crm-link-color:#1f4388!important;
  --crm-link-hover-color: var(--crm-link-color)!important;
  --crm-link-decoration:none!important;
  --crm-link-decoration-hover:none!important;
  --crm-flex-gap: 2.45rem!important;
  --crm-text-color: var(--e-global-color-primary)!important;
  --crm-input-font-size: 18px!important;
}

/** Fonts **/
#bootstrap-theme h1 {
  color: var(--e-global-color-primary)!important;
}
/*
  font-family: var(--e-global-typography-primary-font-family), Sans-serif!important;
  font-size: var(--e-global-typography-primary-font-size)!important;
  font-weight: var(--e-global-typography-primary-font-weight)!important;
  line-height: var(--e-global-typography-primary-line-height)!important;
  letter-spacing: var(--e-global-typography-primary-letter-spacing)!important;
}
*/
#bootstrap-theme h4 {
  color: var(--e-global-color-primary)!important;
  font-family: var(--e-global-typography-28da7a1-font-family), Sans-serif!important;
  font-size: var(--e-global-typography-28da7a1-font-size)!important;
  font-weight: var(--e-global-typography-28da7a1-font-weight)!important;
  line-height: var(--e-global-typography-28da7a1-line-height)!important;
}

/** Buttons / Links **/
.elementor-button-link {
  & .elementor-button-text:not(:first-child) {
    width:calc(100% - 41px);
  }
  & .elementor-button-icon {
    margin-left:auto;
  }
  & .elementor-button-icon > i {
    border-radius: 50%;
    background: #fff;
    padding: 0.56rem 0.75rem;
    font-size: 1.15rem;
    border-color: #1f4388;
    border-width: 3px;
    border-style: solid;
  }
  & .elementor-button-content-wrapper {
    align-items:center;
  }
}
.button-gap > .elementor-column-gap-no {
  grid-gap:6.33%;
}

/** Flex **/
.flex-column {
  display:flex;
  flex-flow:column;
}
.flex-row {
  display:flex;
  flex-flow:row nowrap;
}

/** Events **/
#event-featured {
  & ul {
    padding:0;
    display:flex;
    grid-gap:var(--crm-flex-gap);
  }
  & li {
    width:33%;
  }
}
#event-listing,
#event-featured {
  & ul,
  & .crm-search-display-grid-container {
    align-items:stretch;
  }
  & .crm-inline-block {
    width:100%;
    height:100%;
  }
}
.event-card {
  height:100%;
  background: #F5F0E6 0% 0% no-repeat padding-box;
  transition: background-color 500ms linear;
  box-shadow: 0px 15px 0px #FAB757;
  color: var(--crm-link-color);
  text-decoration: var(--crm-link-decoration);
  border-radius: 20px;
  opacity: 1;
  display:grid;
  grid-template-rows: 1fr 17.09% 1fr 1rem 2.375rem;

  &:hover, &:active, &:focus {
    background: #A9E2FF 0% 0% no-repeat padding-box;
    box-shadow: 0px 15px 0px #258DC1;
  }
}
.event-image {
  display:block;
  position:relative;
  width:100%!important;
/*  aspect-ratio:521/242;*/
  overflow:hidden;
  
  &::before {
    content: '';
    z-index: 10;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    background: linear-gradient(90deg, rgba(37, 141, 193, 0.65) 0%, rgba(250, 183, 87, 0.35) 50%);
    clip-path:inset(0 0px -20px 0 round 20px);
  }
  & img {
    width:100%!important;
    min-height:100%!important;
    object-fit:cover;
    clip-path:inset(0 0px -20px 0 round 20px);
  }
}
.event-footer,
.event-header {
  padding:1rem 1.1875rem 1.125rem 0.875rem;
}
.event-header {
  border-bottom:1px solid #1F4388;

  & .address-content {
    width:50%;
    font-size:1.125rem;
    line-height:1.25;
  } 
  & .date-content {
    margin-right:auto;
    width:max-content;

    & .days {
      font-size:1.875rem;
      font-weight:600;
      line-height:1;
    }
    & .month {
     font-size:1.25rem;
     font-weight:700;
     line-height:1;
    }
  }
}
#bootstrap-theme .event-footer {
/*  padding-bottom:2.375rem;*/
  & .event-category {
    font-size:1rem;
    line-height:1;
    padding-bottom:2px;
  }
  & .event-title {
    padding:0!important;
    margin:0!important;
    font-size:1.25rem!important;
    font-weight:600!important;
    line-height:1.75rem!important;
  }
  & .event-view {
    margin-top:auto;
    margin-left:auto;
    & i {
      margin-left:1rem;
    }
  }
}
.event-view {
  align-self:center;
  justify-self:right;
  margin-right:1.875rem;
}
.lang-fr .date-content .month {
  order:1;
}
#event-filters {
  align-items:center;
  & > * {
    max-width:max-content;
  }
  & h1 {
    padding-right:1rem;
  }
  & .form-group {
    margin-bottom:0!important;
  }
}

/** Inputs **/
body:not(.wp-admin) .crm-container {
  & .select2-container,
  & .select2-container-multi {
    & .select2-choices,
    & .select2-choice {
      height:unset!important;
      padding: 0.625rem 0.5rem!important;
      background-color:#f5f0e6!important;
      border:1px solid #1F4388!important;
    }
  }
}
body:not(.wp-admin) .select2-drop.select2-drop-active.crm-container .select2-results .select2-highlighted {
  background-color:#1f4388!important;
  color:#fff!important;
}


/** Header **/
header #desktop {
  transform: scale(1); /* you need a scale here to allow it to transition in both directions */
  transition: 0.5s all ease;
  &.elementor-sticky--effects {
    padding-top:0.91rem;
    padding-bottom:0.91rem;
  }
}

/** Media **/
@media (max-width: 1500px) {
  .event-header {
    & .address-content {
      font-size:0.875rem;
    }
  }
}