:root {
   --ln-events-font: 'Avenir-Heavy-800', Helvetica, Arial, Lucida, sans-serif;
}

.ln-pagination {
   text-align: center;
   margin-top: 20px;
   margin-bottom: 20px;
}

.pagination-wrapper {
   display: inline-flex;
   align-items: center;
   gap: 8px;
}

.ln-pagination a,
.ln-pagination span {
   padding: 5px 10px;
   text-decoration: none;
   /* border: 1px solid #ddd; */
   color: #333;
}

.ln-pagination .current-page {
   /* background-color: #f0f0f0; */
   font-weight: bold;
}

.ln-pagination .disabled {
   opacity: 0.5;
   pointer-events: none;
}

.ln-pagination .prev-page {
   display: flex;
}

.ln-pagination .next-page {
   display: flex;
}

.ln-pagination .prev-page,
.ln-pagination .next-page {
   border: none;
}

.ln-pagination .ellipsis {
   border: none;
   padding: 5px;
}

/* filter styling */
.ln-events-filter-form {
   display: flex;
   align-items: flex-end;
   width: 100%;
   margin: auto;
   justify-content: center;
   gap: 24px;
}

.ln-events-filter-form .filter-field {
   display: flex;
   flex-direction: column;
   max-width: max-content;
}

.ln-events-filter-form .filter-field label {
   font-family: var(--ln-events-font) !important;
   color: #4399b5 !important;
   margin-bottom: 8px !important;
   font-size: 18px;
}

.ln-events-filter-form .filter-field #start_date {
   display: flex;
   padding: 16px;
   border-radius: 20px;
   min-width: 238px;
   border: 1px solid #919eab;
   justify-content: space-between;
   font-size: 14px;
   font-style: normal;
   font-weight: 800;
   line-height: 24px;
   letter-spacing: 1.12px;
   text-transform: uppercase;
   color: #919eab !important;
   cursor: pointer;

   /* icon */
   background: url(/wp-content/uploads/2024/04/gg_calendar.svg);
   background-repeat: no-repeat;
   display: block;
   width: 100%;
   height: 100%;
   background-position: right 10px bottom 15px;
}

.ln-events-clear-filter-btn button {
   color: #e2523b;
   text-align: right;
   font-family: 'Avenir-Heavy-800', Helvetica, Arial, Lucida, sans-serif;
   font-size: 14px;
   font-style: normal;
   line-height: 24px;
   letter-spacing: 2.24px;
   text-transform: uppercase;
   padding: 16px 26px;
   border-radius: 100px;
   background: transparent;
   box-shadow: none;
   outline: none;
   border: 1px solid #e2523b;
   cursor: pointer;
}

.ln-events-filter-form .filter-field #start_date::placeholder {
   color: #919eab !important;
}

.ln-events-list .ln-key-event-tag {
   position: absolute;
   top: 0;
   right: 0;
   background: #ff3f21;
   color: #fff;
   min-width: 150px;
   text-align: center;
   font-family: 'Avenir Roman', Helvetica, Arial, Lucida, sans-serif;
   font-size: 16px !important;
   border-radius: 40px;
}

.ln-event-title a {
   font-family: 'Avenir Roman', Helvetica, Arial, Lucida, sans-serif;
   color: #015675 !important;
   font-size: 50px;
   font-style: normal;
   line-height: 130%;
}

.ln-event-date > div,
.ln-event-time > div,
.ln-event-location > div {
   display: flex;
   align-items: center;
   flex-direction: row-reverse;
   justify-content: flex-end;
   gap: 10px;
}

.ln-event-date,
.ln-event-time,
.ln-event-location {
   color: #015675;
   font-family: 'Avenir Roman', Helvetica, Arial, Lucida, sans-serif;
   font-size: 18px;
   font-style: normal;
   line-height: 26px;
}

.ln-event-date > div p,
.ln-event-time > div p,
.ln-event-location > div p {
   text-transform: uppercase;
   font-size: 14px !important;
   font-family: 'Avenir-Heavy-800' !important;
   color: #015675 !important;
}

.ln-event-details-container {
   display: flex;
   gap: 40px;
   margin: 24px 0;
}

/* select2 category */
.filter-field .select2-container {
   width: 238px !important;
}

.filter-field .select2-container .select2-selection {
   min-width: 238px;
   min-height: 58px;
   border-radius: 20px;
   border: 1px solid #919eab;
   padding: 16px;
}

.filter-field .select2-container .select2-selection__rendered {
   color: #4e4e4e;
   font-family: 'Avenir Roman', Helvetica, Arial, Lucida, sans-serif;
   text-transform: uppercase;
   font-size: 14px;
   font-style: normal;
   font-weight: 800;
   line-height: 24px;
   letter-spacing: 1.12px;
   text-transform: uppercase;
   padding: 0 !important;
   line-height: 23px !important;
}

.filter-field .select2-container .select2-selection__rendered::after {
   top: -2px !important;
}

.ln-event-back-to-list-btn {
   margin: auto;
   display: flex;
}

.ln-event-url-btn {
   font-family: 'Avenir Roman', Helvetica, Arial, Lucida, sans-serif;
   margin-top: 40px;
   font-size: 14px;
   font-style: normal;
   font-weight: 800;
   line-height: 24px;
   letter-spacing: 2.24px;
   text-transform: uppercase;
   color: #e2523b;
   cursor: pointer;
}

span.current-page {
   min-width: 28px;
   min-height: 28px;
   background-color: #e2523b;
   color: #fff;
   border-radius: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   max-width: 28px;
   max-height: 28px;
}

/* ********************* */
/* Events Calendar Section */
/* .ln-event-label-flex {
  display: inline-flex;
  flex-direction: column;
} */

.ln-event-label-flex label {
   font-family: var(--ln-events-font) !important;
   color: #4399b5 !important;
   margin-bottom: 8px !important;
   font-size: 18px;
}

/* Month view */
.tribe-events-calendar-month__day-date-daynum .day-name {
   color: #015675 !important;
   font-weight: 600;
}

@media screen and (max-width: 1100px) {
   .ln-event-details-container {
      display: grid;
      gap: 25px;
      grid-template-columns: 1fr 1fr;
   }
}

@media screen and (max-width: 1024px) {
   .ln-event-details-flex {
      display: flex;
      align-items: center;
      justify-content: space-between;
   }

   .ln-events-list .ln-key-event-tag {
      position: unset;
      max-height: 25px;
      display: flex;
      align-items: center;
      justify-content: center;
   }

   .pagination-wrapper img {
      min-width: 25px !important;
   }
}

@media screen and (max-width: 980px) {
   .ln-events-filter-form {
      display: grid;
      grid-template-columns: 1fr 1fr;
   }

   .ln-events-filter-form .filter-field {
      max-width: initial;
   }

   .filter-field .select2-container {
      width: 100% !important;
   }

   .ln-events-filter-form .filter-field #search_button,
   .ln-events-filter-form .filter-field #view-month,
   .ln-events-clear-filter-btn button {
      text-align: center;
   }
}

@media screen and (max-width: 650px) {
   .ln-events-filter-form {
      flex-direction: column;
      align-items: center;
   }
}

@media screen and (max-width: 550px) {
   .ln-events-filter-form {
      grid-template-columns: 1fr;
   }
}

@media screen and (max-width: 450px) {
   .ln-event-details-container {
      gap: 16px;
   }

   .ln-event-title a {
      font-size: 34px;
      line-height: 44px;
   }
}

@media screen and (max-width: 300px) {
   .ln-event-details-container {
      grid-template-columns: 1fr;
   }
}

/* calendar view custom day name */
.ln-events-view-row .mobile-event-month .tribe-events-header {
   padding-bottom: 60px !important;
}

.tribe-events-calendar-weekdays-header {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
   font-family: 'Avenir Roman', Helvetica, Arial, Lucida, sans-serif;
   color: #015675;
   padding-bottom: 20px !important;
}

.tribe-events-calendar-weekdays-header .day-box {
   font-size: 15px;
   font-weight: 600;
   /* padding-left: 4px !important; */
   display: flex;
   justify-content: center;
}

@media screen and (max-width: 650px) {
   .tribe-events-calendar-weekdays-header .day-box {
      display: flex;
      justify-content: center;
   }
}

.tribe-common.tribe-events.tribe-events-view.tribe-events-view--month.alignwide.tribe-events-view--shortcode.tribe-events-view--shortcode-tribe-widget-events-month--1.tribe-events-widget.tribe-events-widget-events-month > div > div.tribe-events-calendar-month > div > div:nth-child(2) > div:nth-child(1) {
   border-radius: 20px 0 0 0 !important;
}

.tribe-common.tribe-events.tribe-events-view.tribe-events-view--month.alignwide.tribe-events-view--shortcode.tribe-events-view--shortcode-tribe-widget-events-month--1.tribe-events-widget.tribe-events-widget-events-month > div > div.tribe-events-calendar-month > div > div:nth-child(2) > div:nth-child(7) {
   border-radius: 0 20px 0 0 !important;
}
