/*Event Module*/
.event-list-module{padding: 60px 0;}
.event-list-module > div{padding: 0 15px; display: flex; flex-direction: column; gap: 30px;}
.event-list-module .el-header{display: flex; flex-direction: column; gap:10px; align-items: center;}
.event-list-module .el-header span{color: var(--tertiaryColour); text-align: center; font-size: 2.375rem; font-weight: 600; }
.event-list-module .el-header p{padding: 0; text-align: center;}

.event-slider-container{display: flex; flex-direction: column; align-items: center; gap:20px;}
.event-slider{width: 100%;}

/*List*/
.event-slider.list > div{flex-wrap: wrap; gap:15px;}

/*Carousel*/
.event-pagination { display: flex; align-items: center; justify-content: center; gap: 10px; height: 20px; }
.event-pagination .event-bullet{ height: 20px; width: 20px; border-radius: 100%; position: relative; display: flex; align-items: center; 
    justify-content: center; cursor: pointer; transition: ease-in-out all .3s; background: #fff; border: 1px solid #ABABAB;}
.event-pagination .event-bullet.active { background-color: var(--secondaryColour); border-color: var(--secondaryColour);}
.event-pagination.swiper-pagination-lock { display: none; }

/*Event Quick Book*/
.quick-book-module{background: var(--secondaryColour); padding: 40px 0;}
.quick-book-module > div{padding: 0 15px;}
.quick-book-module .quick-book-form{display: flex; align-items: center; gap:10px;}
.quick-book-module .quick-book-form select{height: 60px; width: 100%; border-radius: 5px;}
.quick-book-module .quick-book-form button{border: 0; flex-shrink: 0;}
.qb-events{flex-grow: 1;}
.qb-pickup, .qb-passengers, .qb-pickup-point{width: 250px; flex-shrink: 0;}

/* Event Block */
.event-block { width: calc((100% - 45px) / 4); background: #fff; height: auto !important; display: flex !important; position: relative; flex-direction: column;
     height:100%; border: 1px solid #D9D9D9; padding: 20px;overflow: hidden; border-radius: 10px; color: var(--textColour); text-decoration: none;}
.event-block .ev-image { width: 100%; aspect-ratio: 1/1; display: flex; align-items: flex-start; position: relative; overflow: hidden; background-position: center; background-color: #ededed; background-size: cover; background-repeat: no-repeat; }
.event-block .ev-info { padding-top: 15px; display: flex; flex-direction: column; justify-content: flex-start; gap: 15px; position: relative; flex-grow:1;}
.event-block .ev-title { justify-content: flex-start; width: 100%; text-decoration: none; font-size: 1.125rem; font-weight: bold; color: var(--headingsColour); }
.event-block .ev-details{display: flex; gap:10px; flex-wrap: wrap;}
.event-block .ev-details > div{display: flex; flex-direction: column; width: calc(50% - 5px); text-transform: capitalize;}
.ev-book{display: flex; flex-direction: column; gap:15px; padding-top: 10px; margin-top: 10px; border-top: 1px solid #E3DAC9;}
.ev-book > span{font-weight: 600; color: var(--textColour)}
.ev-book > div{display: flex; gap:15px; align-items: flex-start;}
.ev-book .button-primary{ height: 60px;}
.quantity {display: flex; align-items: center; height: 60px; box-sizing: border-box; background: #fff; border: 1px solid #E4E4E4; border-radius: 5px;}
.quantity a {display: flex; align-items: center; justify-content: center; width: 60px; height: 100%; background-color: #E4E4E4; 
    background-position: center; background-repeat: no-repeat; flex-shrink: 0;}
.quantity a.plus{background-image: url(../images/plus.svg); }
.quantity a.minus{background-image: url(../images/minus.svg);}
.quantity input {width: 60px; text-align: center; height: 100%; background: none; border: 0; font-size: 1rem; color: var(--textColour); font-weight:bold; }

/* Event Details */
.event-details-page{display: flex; align-items: flex-start; gap:20px; padding: 40px 0;}
.event-details-page .event-left{display: flex; flex-direction: column; gap:15px; background: var(--background); border: 1px solid #DEDEDE; 
    border-radius: 10px; padding: 15px; flex-grow: 1;}
.event-details-page .event-right{width: 500px; flex-shrink: 0; padding: 40px 15px; border-radius: 15px; background:var(--background);  border: 1px solid #DEDEDE;}
.event-title{font-size: 2.375rem; padding: 0;}
.event-info{display: flex; flex-direction: column; gap:15px;}
.event-meta{display: flex; align-items: center; padding: 20px; border: 1px solid #EAEAEA; background: #FCFCFC; border-radius:5px; }
.event-meta > div{flex-grow: 1; color: var(--textColour);}
.event-journey{text-transform: capitalize;}

/*Sidebar*/
.event-right-info{padding-top: 10px;}
.event-right-info > span{color: var(--tertiaryColour); font-size: 1.75rem; font-weight: 600;}
.event-location-select, .event-pickup-point-select{padding: 10px 0 0 0; margin: 10px 0 0 0; border-top: 1px solid #E4E4E4; display: flex; flex-direction: column; gap:10px;}
.event-location-select label, .event-pickup-point-select label{color: var(--tertiaryColour); font-size: 1.25rem; font-weight: bold;}

.event-pick-up-time:not(.hidden){display: flex; align-items: center; gap:10px; font-size: 1.25rem; margin-top: 15px; color: var(--tertiaryColour);}
.event-pick-up-time::before{content: ""; height: 24px; width: 24px; background: url(../images/clock.svg) center no-repeat;}
.event-pick-up-time span{font-weight: bold;}

.event-pricebox{display: flex; flex-direction: column;}
.event-pricebox p{padding: 15px 0 0 0; margin-top: 15px; border-top: 1px solid #E4E4E4; font-size: 1.25rem;}
.event-price-per p{color: var(--tertiaryColour); font-size: 1.25rem; font-weight: bold;}
.event-pricebox .event-price{font-size: 1.25rem; font-weight: 400; color: var(--tertiaryColour);}

.event-pricebox small{font-size: 1.125rem; color: var(--tertiaryColour); font-weight: 600; padding-top: 15px; margin: 15px 0 5px 0; border-top: 1px solid #E4E4E4;}
.event-right-quantity{padding-bottom: 15px; margin-bottom:15px; border:solid #E4E4E4; border-width:0 0 1px 0; display: flex; gap:20px;}
.event-right-quantity .button-primary{ flex-grow: 1;}
.event-total{display: flex; align-items: center; justify-content: space-between; font-size: 1.625rem; color: var(--textColour);}
.event-total span{font-weight: bold; color: var(--tertiaryColour);}
.event-total strong{font-weight: 600; color: var(--tertiaryColour);}

.add-booking.disabled{background: #B0AFB4;}

.event-image:not(:empty) { text-align: center; position: relative;}
.event-image img{max-width: 100%; height: auto; width: auto; }
.AB-editing .event-image[data-editable=true] { width: 100%; min-height: 400px; }

/*Checkout*/
.event-checkout-page{padding: 40px 0; display: flex; align-items: flex-start; gap:20px;}

/*Left Side*/
.event-checkout-left{display: flex; flex-direction: column; gap:15px; background: var(--background); border: 1px solid #DEDEDE; 
    border-radius: 10px; padding: 15px; flex-grow: 1;}
.ec-heading{display: flex; align-items: center; justify-content: space-between; padding-bottom: 15px; border-bottom: 1px solid #E4E4E4;}
.ec-heading span{color: var(--tertiaryColour); font-size: 2.375rem; font-weight: 600;}

.ec-location-pick-up{ overflow: hidden; display: flex; flex-direction: column; width: 100%; padding-bottom: 15px; border-bottom: 1px solid #E4E4E4;}
.ec-location-pick-up-heading{background: #261763; padding: 20px; display: flex; flex-direction: column; align-items: flex-start; border-radius: 10px 10px 0 0;}
.ec-location-pick-up-heading span{color: #fff; font-weight: 600; font-size: 1.125rem; display: flex; align-items: center; gap:10px; width: 100%; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #362A73; }
.ec-location-pick-up-heading span::before{content: ""; height: 24px; width: 24px; background: url(../images/clock-white.svg) center no-repeat;}
.ec-location-pick-up-heading p{margin: 0; padding: 0; color: #fff; }
.ec-location-pick-up-times{background:#D5D3EA; border:solid  #E4E4E4; border-width: 0 1px 1px 1px; padding: 10px; gap:10px; display: flex; flex-wrap: wrap; align-items: flex-start; border-radius: 0 0 10px 10px;}
.ec-location-pick-up-time{background: #fff; padding: 15px; width: calc(25% - 8px); border: 1px solid #D5D3EA; border-radius: 5px; display: flex; flex-direction: column; text-transform: capitalize;}
.ec-location-pick-up-time.active{border-color: #1DA9DF; box-shadow: 0 0 5px 0 #1DA9DF;}

.ec-note{display: flex; flex-direction: column; gap: 15px;}
.ec-note span{color: var(--tertiaryColour); font-weight: 600; font-size: 1.75rem;}
.ec-note p{padding: 0;}

.booking-form{display: flex; flex-direction: column; align-items: flex-start; gap:15px;}
.booking-form > span{color: var(--tertiaryColour); font-weight: 600; text-transform: uppercase; font-size: 1.25rem;}
.booking-form .ec-groups{display: flex; align-items: flex-start; gap:10px; width: 100%;}
.booking-form .ec-group{flex: 1 0 0; display: flex; flex-direction: column; gap:5px;}
.booking-form .ec-group label{color: var(--tertiaryColour); font-weight: 600; }
.booking-form .ec-group input{border-radius: 5px;}
.booking-form .ec-group select{border-radius: 5px;}
.booking-form .ec-group textarea{border-radius: 5px; padding: 10px; resize: none; height: 148px;}
.booking-form .ec-additional{background: #FBFBFB; border-radius: 5px; padding: 15px; border: 1px solid #E4E4E4; width: 100%; 
    display: flex; flex-direction: column; gap:10px;}
.booking-form .ec-additional > span{font-size: 1.25rem; font-weight: 600; color: var(--tertiaryColour);}
.booking-form button{border: 0;}

/*Right Side*/
.event-checkout-right{width: 500px; flex-shrink: 0; padding: 40px 15px; border-radius: 10px; background:var(--background); border: 1px solid #DEDEDE;
    display: flex; flex-direction: column; gap:10px;}
.event-checkout-right > span{font-size: 1.75rem; font-weight: 600; color: var(--tertiaryColour);}
.event-checkout-right > div{width: 100%; display: flex; justify-content: space-between; align-items: center; padding-bottom: 15px; margin-bottom: 5px;
    border-bottom: 1px solid #E4E4E4; text-transform:capitalize; }
.event-checkout-right > div > span{color: #6D6690;}
.event-checkout-right > div > strong{font-weight: 600; color: var(--tertiaryColour); display: flex; align-items: center;}
.event-checkout-right > div.ec-total{margin: 0; padding: 0; border: 0;}
.event-checkout-right > div.ec-total > strong{font-size: 1.125rem; font-weight: bold;}

/*Payment Page*/
.payment-page{padding: 40px 0; display: flex; align-items: flex-start; gap:20px;}
.event-payment-right{align-items: flex-start;}
.payment-event-details{display: flex; flex-direction: column; padding: 10px 0; margin: 10px 0; border: solid #E4E4E4; border-width:1px 0; }
.payment-event-heading{display: flex; align-items: center; justify-content: space-between;}
.payment-event-heading span{color: var(--tertiaryColour); font-size: 1.125rem; font-weight: 600;}
.payment-event-more{display: flex; align-items: center;}
.payment-event-more p{padding: 0; flex: 1 0 0;}
.payment-form button{border: 0; margin-top: 15px;}


/************Responsive states**************/

/* Desktop */

@media (min-width:992px) and (max-width:1400px) {

    .event-list-module .el-header span{font-size: 2.125rem;}

    /*Event Block*/
    .event-block{padding: 10px; }
    .event-block .ev-info{gap:10px;}
    .event-block .ev-details > div{font-size: 0.875rem;}
    .ev-book > div{flex-direction: column; gap:10px; }
    .ev-book .quantity{width: 100%;}
    .ev-book .quantity input{flex: 1; }
    .ev-book .button-primary{flex: initial; width: 100%;}

    /*Event Details*/
    .event-details-page{gap:10px;}
    .event-details-page .event-right{width: 400px;}

    /*Checkout*/
    .ec-heading span{font-size: 1.675rem;}
    .ec-note span{font-size: 1.5rem;}
    .event-checkout-right {width: 400px; }

}

@media (min-width:992px) and (max-width:1199px) {

    /*Event Details*/
    .event-details-page .event-right{width: 300px;}
    .event-right-info > span{font-size: 1.5rem;}
    .event-right-quantity{flex-direction: column;}
    .event-right-quantity .quantity input{ flex-grow: 1;}
    .event-total{font-size: 1.5rem;}

    /*Event Checkout*/
    .event-checkout-right{width: 350px;}

    /*Event Payment*/
    .payment-page{ gap:10px; }

}

/*Mobile & Tablet*/
@media (max-width:991px) {
    
    /*Details Page*/
    .event-details-page{display: flex; flex-direction: column;}
    .event-details-page .event-left{order:2; width: 100%;}
    .event-details-page .event-right{order:1; width: 100%;}
    .event-meta{flex-direction: column; gap:20px; align-items: flex-start;}

    /*Sidebar*/
    .event-details{display: flex; align-items: center; gap:20px;}
    .event-details .event-image{width: 50%;}
    .event-details .event-right-info{width: 50%;}
    .event-right-quantity{gap:15px;}
    .event-total{font-size: 1.25rem;}

    /*Quick book*/
    .quick-book-module{padding: 20px 0;}
    .quick-book-module .quick-book-form{flex-wrap: wrap;}
    .qb-events{width: 100%; flex:initial; }
    .qb-pickup, .qb-passengers{flex-grow: 1; width: initial;}
    .quick-book-module .quick-book-form button{width: 100%;}

     /*Event Checkout*/
     .event-checkout-page{flex-direction: column; padding: 20px 0;}
     .event-checkout-right{width: 100%; padding: 20px 15px;}

     /*Payment*/
     .payment-page{flex-direction: column;}
     .payment-event-heading{flex-direction: column; align-items: flex-start; margin-bottom: 5px;}

}

/*Tablet*/
@media (min-width:768px) and (max-width:991px) {

    .event-slider.list > div{gap: 5px;}
    .event-list-module .el-header span{line-height: 1;}

    /*Event Block*/
    .event-block{width: calc((100% - 5px) / 2);}
    .quantity a, .quantity input{width: 50px;}
    .ev-book .button-primary{flex: 1;}

    /*Event Checkout*/
    .ec-heading > span{font-size: 2.125rem;}

}

/*Mobile*/
@media (max-width:767px) {

    /*Event Module*/
    .event-list-module{padding: 30px 0;}
    .event-list-module .el-header span{font-size: 1.625rem; line-height: 1.2;}
    .event-list-module > div{gap:15px;}
    .event-slider.list > div{justify-content: center;}

    /*Event Block*/
    .event-block { width: 300px; }
    .ev-book > div{flex-direction: column;}
    .ev-book .button-primary{width: 100%; height: 60px; flex: initial;}
    .ev-book .quantity{width: 100%;}
    .ev-book .quantity input{flex: 1; }
    
    /*Event Details*/
    .event-details-page{gap:10px; padding: 20px 0;}
    .event-details-page .event-right, .event-details-page .event-left{padding: 30px 10px;}
    .event-details{flex-direction: column;}
    .event-details .event-image, .event-details .event-right-info{width: 100%;}
    .event-right-info > span{font-size: 1.5rem;}
    .event-pricebox p, .event-pricebox .event-price{font-size: 1.125rem;}
    .event-right-quantity{flex-direction: column;}
    .quantity input{flex-grow: 1;}
    .event-title{font-size: 1.5rem;}
    .event-meta{padding: 10px; gap:10px; font-size: 0.875rem;}

    /*Quick Book*/
    .qb-pickup, .qb-passengers{flex: initial; width: 100%;}

    /*Event Checkout*/
    .ec-heading{flex-direction: column; align-items: flex-start; gap:10px;}
    .ec-heading span{order: 2; font-size: 1.5rem;}
    .ec-heading a{order: 1;}
    .ec-note span{font-size: 1.375rem;}
    .booking-form > span, .booking-form .ec-additional > span{font-size: 1.125rem;}
    .booking-form .ec-groups{flex-direction: column;}
    .booking-form .ec-group{flex: initial; width: 100%;}
    .booking-form .ec-group label{font-size: 0.875rem;}
    .booking-form .ec-additional{padding: 10px;}
    .booking-form button{width: 100%;}
    .event-checkout-right > span{font-size: 1.5rem;}
    .event-checkout-right > div:not(.ec-total){flex-direction: column; align-items: flex-start; gap: 5px; margin-bottom: 0; padding-bottom: 10px;}
    .event-checkout-right > div.ec-total{font-size: 1rem;}

    /*Payment*/
    .payment-event-more{flex-direction: column; align-items: flex-start;}
}