:root {
    --beaver-blue: #071C2C;
}

/* ============================================
Global Styles 
============================================*/
/* Search Form */

.tribe-common-form-control-text__input{
    padding: 12px 20px!important;
    font-size: 22px!important;
}

.tribe-events-c-search__button{
    margin-left: 12px!important;
}


/* Date Picker */
.tribe-events .datepicker .table-condensed thead tr{
    background-color: #FFF;
}

.tribe-events .datepicker .table-condensed thead tr th.dow{
    padding: 5px 0;
    font-weight: 400;
}

.tribe-events .datepicker .table-condensed .month.active,
.tribe-events .datepicker .table-condensed .day.active{
    background-color: var(--beaver-blue);
    background-image: none;
    color: #fff;
}
.tribe-events .datepicker .table-condensed tr:nth-child(2n){
    background-color: #FFF;
}



/* ============================================
Page heading and color key
============================================*/

.tribe-events-before-html p{
		font-size:24px;
}
.tribe-common--breakpoint-medium.tribe-common .tribe-common-b2 p{
    font-size: .95rem !important;
    line-height: 1.5;
    opacity: .95;
	font-family: "Clash Grotesk", sans-serif !important;
}
.color-key {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin: 10px 0 !important;
  padding: 20px !important;
  background: rgba(0, 0, 0, 0.02);
  border-radius: 8px; /* $radius-md */
  border: 1px solid #e2e2e2; /* $color-border */
}

.color-key__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
}

.color-key__swatch {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}

.color-key__label {
  color: #333; /* $color-text */
  white-space: nowrap;
	 font-size: 0.9rem !important;
  font-weight: 500 !important;
}

@media (max-width: 640px) { /* $bp-mobile */
  .color-key {
    gap: 1rem;
    padding: 0.75rem;
  }

  .color-key__item {
    font-size: 0.8rem; /* $font-size-xs */
  }

  .color-key__swatch {
    width: 16px;
    height: 16px;
  }
}

/*============================================
Calendar Month View 
============================================*/

/* The Table */
.tribe-events-calendar-month__body{
    background-color: transparent;
}


/* The Header */
.tribe-events-calendar-month__header{
    background-color: var(--beaver-blue);
}

.tribe-events-calendar-month__header-column{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%!important;
    padding-top: var(--tec-spacer-3)!important;

}
.tribe-events-calendar-month__header-column-title.tribe-common-b3{
    color: #fff;
}

.tribe-events-calendar-month__header-column-title.tribe-common-b3 span{
    font-size: 18px;
}


/* The Week */
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-month__week{
    border-left: 1px solid #000;
}

.tribe-events-calendar-month__calendar-event-title-link,
.tribe-events-calendar-month__calendar-event-datetime{
    font-size: 14px;
}

.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-month__week:nth-child(2n){
    background-color: #FFF;
}

.tribe-events-calendar-month__multiday-event-bar{
    background-color: var(--beaver-blue)!important;
    padding: 8px 3px;
}
.tribe-events-calendar-month__multiday-event-bar-title{
    color: #fff!important;
    font-weight: 300;
    font-style: italic;
    letter-spacing: 0.34px;
}

.tribe-events-calendar-list__event-wrapper{
    width: 100%!important;
    margin-left: 10px;
}

.tribe-events-calendar-list__event-details{
    width: 100%!important;
}

/* Tooltip */
.tooltipster-content{
    padding: 12px!important;
}
.tooltipster-sidetip.tribe-events-tooltip-theme .tooltipster-box{
    background-color: var(--beaver-blue)!important;
    border-radius: 4px;
}

.tribe-events-calendar-month__calendar-event-tooltip{
    background-color: var(--beaver-blue)!important;
    color: #fff!important;
    padding: 10px;
}

.tribe-events-calendar-month__calendar-event-tooltip-datetime{
    color: #fff!important;
}

.tribe-events-calendar-month__calendar-event-tooltip-title{
    color: #fff!important;
}

.tribe-events-calendar-month__calendar-event-tooltip-title-link{
    color: #fff!important;
    font-weight: 300;
    font-style: italic;
    letter-spacing: 0.34px;
    text-decoration: none;
}

.tribe-events-calendar-month__calendar-event-tooltip-description p{
    font-size: 12px;
    color: #fff;
}

.tooltipster-sidetip.tribe-events-tooltip-theme .tooltipster-arrow-border{
    border-top-color: var(--beaver-blue)!important;
}

.tooltipster-sidetip.tribe-events-tooltip-theme .tooltipster-arrow-background{
    border-top-color: var(--beaver-blue)!important;
}

.tooltipster-content .tec-cta{
    flex-direction: column;
    align-items: flex-start;
}

.tooltipster-content .tec-cta a{
    color: #fff;
    font-size: 14px;
}

.tooltipster-content .tec-cta a:second-child{
    margin-top: 10px;
}


/* ============================================
Calendar List View 
============================================*/
.tribe-events-calendar-list__event-row{
    margin: 0!important;
}

.tribe-events-calendar-list__event-header{
    margin-left: 10px!important;
}

div.tec-cta{
    margin: 20px 0 0 10px;
}



/* ============================================
Media Queries 
============================================*/

@media (min-width: 900px) {
    .tribe-events-calendar-list__event-details{
        display: grid;
        grid-template-rows: auto auto;
        grid-template-columns: 1fr 1fr 1fr;
    }
    .tribe-events-calendar-list__event-header{
        grid-column: 1 / 3;
        grid-row: 1 / 2;
        margin-left: 0!important;

    }
    .tribe-events-calendar-list__event-description{
        grid-column: 1 / 3;
        grid-row: 2 / 3;
    }
    div.tec-cta{
        grid-column: 3 / 4;
        grid-row: 1 / 3;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        margin: 0;
    }
}
