/*
Name: Caravan Details Page
Theme URI: https://www.caravans2let.com
Author: Daniel Tuck
Author URI: https://www.danieltuck.co.uk
Description: detailed caravan view page 
Version: 1.0
*/


#calendarWrapper {
  transition: opacity 0.3s ease;
}

/* Only hide on mobile initially */
@media (max-width: 991.98px) {
  #calendarWrapper {
    opacity: 0;
  }
}

#availability-calendar-container {
background:#fff;padding:5%;border-radius:20px;
  box-shadow:0 0 100px #7ea1aa66;
}
#publicCalendar{
}

.marker-thumb {
  width: 90px;
  height: 90px;
  position: relative;
  background: #091626;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: transform 0.3s ease;
  border: 2px solid #091626;
  cursor: pointer;
  top:-10px
}


.marker-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: rotate(45deg); /* undo parent rotation */
}

.thumbnail-scroller-wrapper {
  position: relative;
  overflow: hidden;
}

.thumbnail-scroller {
  overflow-x: auto;
  scroll-behavior: smooth;
  gap: 10px;
  padding: 5px 40px; /* space for arrows */
}

.thumbnail-scroller::-webkit-scrollbar {
  display: none;
}

.thumb-img {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  transition: transform 0.2s;
}

.thumb-img:hover {
  transform: scale(1.05);
}

.scroll-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #fff;
  border: none;
  font-size: 1.8rem;
  padding: 5px 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
  z-index: 2;
  cursor: pointer;
}

.left-arrow {
  left: 0;
}

.right-arrow {
  right: 0;
}
.caravan-stats
{padding:0px;margin-top:-5px;}

.caravan-details {margin-top: 80px!important;}
@media (max-width: 990px) {
.caravan-details {margin-top: 40px!important;}
}
  
.featured-image {
  padding: 20px;
}

.featured-caravan {
  width: 100%;        /* Fills the container's width */
  height: auto;       /* Maintains aspect ratio */
  max-height: 600px;  /* Restricts the height */
  border-radius: 10px;
  padding: 0;         /* Avoid padding on the image itself */
  display: block;
  object-fit: cover; /* Optional: good if image ever needs to fit within dimensions */
}

.caravan-gallery
 {
  width:99%;border-radius:20px; border: 0px solid #fff;box-shadow: 0 4px 4px #00000010;background:#fff;padding-bottom:20px;
}

.thumbnail-scroller-wrapper.position-relative {
  max-width:96%;background:#fff;margin:0px auto;;
}

.scroll-arrow
{background:#091626;color:#fff;}
.scroll-arrow:hover
{background:#f7941d;}

.caravan-sub-heading{font-weight:600;}
.caravan-block-basic
{background:#fff;border-radius:20px;padding:20px;}

#section-1-title-location {
  border-bottom: 2px solid #bbb;
width:95%;
  margin: 0 0 0 25px;
}

.ref-number-badge span {
  background:#f7941d;
  padding:6px 16px; 
  color:#fff;
  border-radius:16px;
  font-weight:600;
  font-size:16px;
  right:0px;
}


#section-2-summary-info{

width:90%;
  margin: 0 0 0 25px;
}


.custom-list {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.custom-list li {
  display: flex;
  align-items: center;
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 0.75rem;
}

.icon-circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #198754; /* Bootstrap green */
  color: white;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin-right: 10px;
  flex-shrink: 0;
}

.icon-circle i {
  font-size: 1rem;
}


.star-rating .bi-star-fill {
  color: #f7941d;
}
.star-rating .bi-star {
  color: #ccc;
}

/*model styles*/
#bookingSubmitBtn:disabled {
  background-color: #e0e0e0 !important;
  color: #888;
  border-color: #ccc;
  cursor: not-allowed;
}

#bookingSubmitBtn:enabled {
  background-color: #28a745 !important; /* Bootstrap 'success' green */
  color: white;
  border-color: #28a745;
}
.required-star {
  font-size: 1.4rem;
  line-height: 1;
  vertical-align: middle;
}
#bookingModal input,
#bookingModal textarea{
  background:#f5f5f5;
}
/*Bio Styles*/
.bio-preview.collapsed {
  max-height: 150px;
  overflow: hidden;
  position: relative;
}

.bio-preview.expanded {
  max-height: none;
}
/* Mobile fix: reposition badge below avatar */
@media (max-width: 575.98px) {
  #section-8-owner .owner-contact-box .owner-verified-badge {
    position: static !important;
    display: block;
    margin-top: 1rem;
    text-align: center;
  }

  #section-8-owner .owner-contact-box .owner-verified-badge img {
    height: 60px;
  }
}

/* Desktop: restore absolute badge */
@media (min-width: 576px) {
  #section-8-owner .owner-contact-box .owner-verified-badge {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0.5rem;
  }

  #section-8-owner .owner-contact-box .owner-verified-badge img {
    height: 90px;
  }
}








.available-period {
  background-color: #b8e6b8 !important; /* solid light green */
}

.selectable-check-day {
  border: 3px solid #003d09 !important;
  background-color: #b8e6b8 !important; /* solid light green */
  cursor: pointer !important;
  pointer-events: auto !important;
  z-index:99;
}
.selectable-check-day:hover {
  background-color: #003d09 !important; /* solid light green */
  cursor: pointer !important;
  pointer-events: auto !important;
  z-index:99;
}
.fc-event.selectable-check-day.fc-bg-event {
  cursor: pointer !important;
  pointer-events: auto !important;
  z-index: 10;
}

.fc-day.adjacent-checkout-option {
  position: relative;
  overflow: hidden;
  background-color: #eaeaea;
    cursor: pointer !important;
}

.fc-day.adjacent-checkout-option::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 3px solid #9db99f !important;
  background-color: #d5ecd5 !important;
  clip-path: polygon(0% 0%, 0% 100%, 100% 0%);
  z-index: 5;
  cursor: pointer !important;
}
.fc-day.adjacent-checkout-option .fc-daygrid-day-number
{ z-index: 6;}
.fc-day.adjacent-checkout-option:hover::before
{  background-color: #738f7c !important;
  border: 3px solid #738f7c !important;}

.fc-event.valid-checkout-end.fc-bg-event {
  border: 3px solid #003d09 !important;
  background-color: #b8e6b8 !important;
}


.booked-day {
  background-color: #e26666 !important; /* solid red */
  cursor: not-allowed;
    pointer-events: none; /* ⬅️ this helps avoid conflict with interactive overlays */
	  z-index:1;
}



.selected-range {
  background-color: orange !important;display:block;opacity: 1!important;
}

.fc-day.adjacent-checkout-option.selected-range::before {
  background-color: transparent !important;
}


.fc-daygrid-day.fc-day-past {
    pointer-events: none;
    background-color: #eee !important;
    color: #aaa !important;
    opacity: 0.2;
}

.blocked-checkout-day {
  background-color: rgba(0, 0, 0, 0.1) !important;
  cursor: not-allowed !important;
} 

.fc-day[data-date].blocked-checkout-day .fc-daygrid-day-number {
  pointer-events: none;
  opacity: 0.4;
}


.blocked-post-checkout {
  background-color: #eaeaea !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
  pointer-events: none;
  z-index:9999!important;
}


.fc-daygrid-day.blocked-post-checkout .fc-daygrid-day-number {
  cursor: not-allowed !important;
  pointer-events: none;
  opacity: 1!important;
  
}

.fc-daygrid-day.blocked-post-checkout .fc-daygrid-day-number,
.fc-daygrid-day.blocked-post-checkout {
  cursor: not-allowed !important;
  pointer-events: none !important;
  opacity: 0.6 !important;
      z-index:9999!important;
}

.blocked-post-checkout .fc-event.selectable-check-day.fc-bg-event {
  cursor: not-allowed !important;
  pointer-events: none !important;
    z-index:9999!important;
}

.fc-daygrid-day.blocked-post-checkout .fc-daygrid-day-number,
.fc-daygrid-day.blocked-post-checkout {
  cursor: not-allowed !important;
  pointer-events: none !important;
  opacity: 0.6 !important;
  border: 3px solid #003d09 !important;
  background-color: #b8e6b8 !important; /* solid light green */
}


.fc-day.fc-day-mon.fc-day-future.fc-daygrid-day.adjacent-checkout-option div.fc-daygrid-day-frame 
.fc-daygrid-day-bg div.fc-daygrid-bg-harness
{display:none!important;}


.fc-event.booked-start::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background: #d5ecd5;
  clip-path: polygon(0 0, 0 100%, 100% 0)!important; /* Top-left triangle */
  z-index: 7;
}

.fc-event.booked-end::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background: #d5ecd5;
  clip-path: polygon(100% 0, 0 100%, 100% 100%); /* Bottom-right triangle */
  z-index: 2;
  border:none;
}

/* Ensure all booked-day base styling is applied */
.fc-event.booked-day {
  background-color: #e26666 !important;
  pointer-events: none;
  opacity: 1;
}

/* Calendar navigation buttons */
#minNightsLabel {
  font-weight: 600;
  color: #444;
}

.legend-box.min-nights {
  width: 16px;
  height: 16px;
  background-color: #e0c84b; /* custom color for visibility */
  border: 1px solid #999;
  display: inline-block;
  margin-right: 6px;
}

/* Adjust FullCalendar styles */
.fc-dayGridMonth-view {
    height: auto !important;
}

.fc-day-header {
    font-size: 12px;
    text-transform: uppercase;
    text-align: center;
    width: 14.28%; /* Each day takes equal space */
}

.fc-day {
    min-height: 40px; /* Ensure day cells are properly sized */
}

/* Adjust FullCalendar Month Grid */
.fc-daygrid-day {
    min-height: 30px !important; /* Reduce day cell height */
    padding: 2px 0 !important; /* Minimize padding */
}

/* Reduce header size (Mon, Tue, etc.) */
.fc-day-header {
    font-size: 10px !important; /* Make headers smaller */
    padding: 2px !important;
    width: 14.28%; /* Ensure equal width */
}

/* Reduce text size inside days */
.fc-daygrid-day-number {
    font-size: 12px !important;
    padding: 2px !important;
	pointer-events: none!important;

}


/* Ensure the entire month grid fits within the popup */
#date-picker-container {
    height: 300px !important; /* Make the calendar fit */
    width: 100% !important;
}


.fc-daygrid-day-frame.fc-scrollgrid-sync-inner {
     font-family: 'Raleway', sans-serif;
  max-height:40px!important;
}
th.fc-col-header-cell.fc-day div.fc-scrollgrid-sync-inner a
{color:#333;text-decoration:none;}

.fc-daygrid-day-frame .fc-daygrid-day-top a.fc-daygrid-day-number
{color:#333;text-decoration:none;font-size:20px!important;margin:0 auto;}

.fc .fc-toolbar-title {
     font-family: 'Raleway', sans-serif;
  font-size: 1.5em!important;
  margin: 0;font-weight:600;
}
.fc .fc-toolbar.fc-header-toolbar {
  margin-bottom: 1em;
}

div#publicCalendar
{background:#f5f5f5;padding:0px;box-shadow: 0 2px 6px #00000020}

#fc-dom-1{padding:10px 0 0 10px;}

div#publicCalendar  .fc-daygrid-day-bg .fc-daygrid-bg-harness .fc-event.fc-event-future.available-period.fc-bg-event
{pointer-events: none;}



div#publicCalendar  .fc-daygrid-day-bg .fc-daygrid-bg-harness .fc-event.fc-event-future.available-period.fc-bg-event
{pointer-events: none;}

#openBookingModal {background-image: linear-gradient(to right, #FF512F 0%, #F09819  51%, #FF512F  100%)}
#openBookingModal {
margin: 10px 0;
padding: 15px 45px;
text-align: center;
text-transform: uppercase;
transition: 0.5s;
background-size: 200% auto;
color: white;            
box-shadow: 0 0 20px #eee;
border-radius: 10px;
display: block;
border: 0px solid transparent;
font-weight:900;
}

#openBookingModal:hover {
background-position: right center; /* change the direction of the change here */
color: #fff;
text-decoration: none;
}
.clear-selection-btn{
  font-weight:600;
  border-radius: 0 0 5px 5px;
background-color: #666;border:none;
padding: 5px 15px;
text-align: center;
text-transform: uppercase;
transition: 0.5s;
color: white;   
}
.clear-selection-btn:hover{background-color:#FF512F;}

.apply-disocunt-btn{  font-weight:600;
  border-radius: 0 6px 6px 0;
background-color: #61a653;border:none;
padding: 5px 15px;
text-align: center;
text-transform: uppercase;
transition: 0.5s;
color: white; }
.total-price-calendar{font-size:22px;}

.calendar-legend 
{margin:5px 0 10px}
.calendar-legend .legend-box {
  width: 20px;
  height: 20px;
  margin-right:6px;
  display: inline-block;
  border-radius: 3px;
  border: 1px solid #ccc;
}

.legend-box.unavailable {
  background-color: #e2c5bc;
  border: none;
}

.legend-box.available {
  background-color: #e2f0e2;
  border: none;
}

.legend-box.checkin-day {
  background-color: #e2f0e2;
  border: 3px solid #9db99f;
}

.fc-event.hovered-range {
  background-color: #cce3ff !important; /* Light blue */
  opacity: 1;
  pointer-events: none;
  z-index: 9;
}

.fc-day.valid-checkout-end {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Prevent accidental taps on cells we've flagged as non-interactive */
.fc-daygrid-day.tap-disabled {
  pointer-events: none !important;
  opacity: 0.6;            /* optional visual hint */
}

.fc-daygrid-day[aria-disabled="true"] .fc-daygrid-day-frame {
  cursor: not-allowed;
}






/* Final picked range = strong orange */
#availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.selected-range {
  background: orange !important;
  opacity: 1 !important;
  z-index: 3 !important;
  pointer-events: none;
}

/* Hover preview = subtle light blue (keeps guidance while selecting) */
#availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.hovered-range {
  background: #cce3ff !important;  /* already defined earlier, keep it subtle */
  opacity: 0.6 !important;
  z-index: 2 !important;           /* under selected range */
  pointer-events: none;
}
/* When end date is locked in, completely suppress hover paint */
#availability-calendar-container.range-locked .fc .fc-daygrid-day-bg .fc-bg-event.hovered-range {
  display: none !important;  opacity: 0 !important;
}

/* Other background overlays sit underneath */
#availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.booked-day,
#availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.available-period,
#availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.blocked-checkout-day,
#availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.blocked-post-checkout,
#availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.blocked-checkout-min-nights,
#availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.blocked-after-period-end {
  z-index: 2;
}

/* Remove Android tap flash on day cells (purely cosmetic) */
#availability-calendar-container .fc-daygrid-day {
  -webkit-tap-highlight-color: transparent;
}

/* iOS-only: nudge paint without creating a new stacking context */
@supports (-webkit-touch-callout: none) {
  #availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.selected-range,
  #availability-calendar-container .fc .fc-daygrid-day-bg .fc-bg-event.hovered-range {
    backface-visibility: hidden;
  }
}
/* Owner card: stack avatar + content on small screens */
@media (max-width: 575.98px) { /* Bootstrap xs breakpoint */
  #section-8-owner .owner-contact-box > .d-flex {
    flex-direction: column;
    align-items: center;      /* center the avatar + text */
    text-align: center;       /* center text */
  }
  #section-8-owner .owner-contact-box > .d-flex .me-4 {
    margin-right: 0 !important;
    margin-bottom: 12px;      /* space under the avatar */
  }
  #section-8-owner .owner-contact-box h5.caravan-sub-heading {
    text-align: center;
  }
  /* long email addresses shouldn’t overflow */
  #section-8-owner .owner-contact-box a {
    word-break: break-word;
  }
   #section-8-owner .owner-contact-box.border.rounded.p-3.mb-4.shadow-sm.position-relative div.d-flex.align-items-start div.me-4
  {text-align: center!important;width:100%; }
}
@media (max-width: 991.98px) {
 footer>div { margin-bottom:120px!important; } /* adjust to your CTA height */
 
}