*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
--primary:#00B87A;--primary-dark:#009963;--primary-light:#E8F8F0;
--navy:#0C2340;--white:#FFFFFF;--bg:#FAFBFC;
--gray-50:#F8F9FA;--gray-100:#F1F3F5;--gray-200:#E9ECEF;--gray-300:#DEE2E6;
--gray-400:#CED4DA;--gray-500:#ADB5BD;--gray-600:#868E96;--gray-700:#495057;--gray-800:#343A40;--gray-900:#212529;
--gold:#D4A853;--shadow:0 4px 16px rgba(0,0,0,0.08);--shadow-lg:0 12px 40px rgba(0,0,0,0.12);
--radius:8px;--radius-lg:16px;
}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--gray-900);line-height:1.5;background:var(--white);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

/* === NAV === */



/* === PHOTO GALLERY === */
.photo-gallery{padding:80px 0 0;max-width:1240px;margin:0 auto;padding-left:20px;padding-right:20px}
.gallery-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:8px;height:400px;border-radius:var(--radius-lg);overflow:hidden}
.main-photo{position:relative;background:var(--gray-100);cursor:pointer;border-radius:var(--radius) 0 0 var(--radius)}
.main-photo img{width:100%;height:100%;object-fit:cover}
.thumbnail-grid{display:grid;grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(2,1fr);gap:8px}
.thumbnail{position:relative;background:var(--gray-100);cursor:pointer;overflow:hidden}
.thumbnail:nth-child(1){border-radius:0 var(--radius) 0 0}
.thumbnail:nth-child(2){border-radius:0 0 0 0}
.thumbnail:nth-child(3){border-radius:0 0 0 0}
.thumbnail:nth-child(4){border-radius:0 0 var(--radius) 0}
.thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform .2s}
.thumbnail:hover img{transform:scale(1.05)}
.show-all-btn{position:absolute;bottom:16px;right:16px;background:var(--white);color:var(--gray-900);padding:8px 16px;border-radius:var(--radius);font-size:14px;font-weight:600;box-shadow:var(--shadow);cursor:pointer;transition:all .2s}
.show-all-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-lg)}

/* === LIGHTBOX === */
.lightbox{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.95);z-index:200;justify-content:center;align-items:center}
.lightbox.active{display:flex}
.lightbox-content{position:relative;max-width:90vw;max-height:90vh}
.lightbox-content img{max-width:100%;max-height:100%;object-fit:contain}
.lightbox-close{position:absolute;top:20px;right:20px;background:rgba(255,255,255,0.1);color:white;border:none;width:40px;height:40px;border-radius:50%;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center}
.lightbox-
.lightbox-prev{left:20px}
.lightbox-next{right:20px}

/* === MAIN CONTENT === */
.main-content{max-width:1240px;margin:0 auto;padding:32px 20px}
.content-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:48px}

/* === LEFT COLUMN === */
.left-content{flex:1}
.rv-title{font-size:32px;font-weight:900;color:var(--navy);margin-bottom:8px;letter-spacing:-0.5px}
.rv-specs-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-size:14px;color:var(--gray-600);flex-wrap:wrap}
.type-badge{background:var(--primary);color:var(--white);padding:4px 12px;border-radius:20px;font-size:13px;font-weight:600}
.spec-item{display:flex;align-items:center;gap:4px}
.spec-divider{width:4px;height:4px;background:var(--gray-400);border-radius:50%}
.rv-rating{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.stars{color:var(--gold);font-size:16px}
.rating-text{font-size:14px;font-weight:600;color:var(--gray-900)}
.review-count{font-size:14px;color:var(--gray-600)}
.hosted-by{font-size:14px;color:var(--gray-700);margin-bottom:24px}
.hosted-by strong{color:var(--gray-900);font-weight:600}
.superhost{color:var(--primary);font-weight:600}

.content-section{padding:24px 0;border-bottom:1px solid var(--gray-200)}
.content-section:last-child{border-bottom:none}
.section-title{font-size:20px;font-weight:700;color:var(--navy);margin-bottom:16px}

/* Features Grid */
.features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.feature-item{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--gray-700)}
.feature-icon{font-size:20px;width:24px}

/* Specifications Section */
.specs-table { margin-bottom: 24px; }
.specs-category { font-size: 14px; font-weight: 700; color: var(--navy); margin-bottom: 8px; padding-bottom: 4px; border-bottom: 2px solid var(--primary); }
.specs-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; }
.spec-row { display: flex; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid var(--gray-100); }
.spec-row:nth-child(odd) { background: var(--gray-50); }
.spec-label { font-size: 13px; color: var(--gray-600); }
.spec-value { font-size: 13px; font-weight: 600; color: var(--gray-900); }
.show-all-specs-btn{width:100%;background:var(--white);border:2px solid var(--gray-300);color:var(--gray-700);padding:12px 16px;border-radius:var(--radius);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:16px;display:flex;align-items:center;justify-content:center;gap:8px}
.show-all-specs-btn:hover{border-color:var(--primary);color:var(--primary)}
.show-all-specs-btn.expanded #specsToggleIcon{transform:rotate(180deg)}
#specsToggleIcon{transition:transform .2s}

/* Responsive specs */
@media(max-width:768px) {
  .specs-grid { grid-template-columns: 1fr; }
  /* Initially hide some specs categories on mobile */
  .specs-category:nth-child(n+4){display:none}
  .specs-table .specs-category:nth-child(n+4){display:none}
}

/* Amenities Grid */
.amenities-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}

/* Video Tour Section */
.video-tour-placeholder{background:linear-gradient(135deg,#E8F8F0,#F0FDFA);border-radius:var(--radius-lg);overflow:hidden;position:relative;aspect-ratio:16/9;max-width:100%;margin:0 auto}
.video-preview{position:relative;width:100%;height:100%;background:linear-gradient(45deg,var(--navy) 0%,#1A3B5C 100%);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease}
.video-preview:hover{transform:scale(1.02)}
.play-button{position:absolute;width:80px;height:80px;background:rgba(255,255,255,0.95);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;color:var(--navy);box-shadow:var(--shadow-lg);transition:all .3s ease;z-index:2}
.play-button:hover{transform:scale(1.1);box-shadow:0 16px 50px rgba(0,0,0,0.2)}
.video-overlay{position:absolute;inset:0;background:rgba(12,35,64,0.7);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--white);text-align:center;padding:24px;z-index:1}
.video-overlay h3{font-size:24px;font-weight:800;margin-bottom:8px;text-shadow:0 2px 4px rgba(0,0,0,0.3)}
.video-overlay p{font-size:16px;opacity:0.9;text-shadow:0 1px 2px rgba(0,0,0,0.3)}
@media(max-width:768px){.play-button{width:60px;height:60px;font-size:20px}.video-overlay h3{font-size:18px}.video-overlay p{font-size:14px}.video-overlay{padding:16px}}
.amenity-item{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--gray-700);padding:8px 0}
.amenity-check{color:var(--primary);font-weight:bold}

/* Rules List */
.rules-list{list-style:none}
.rules-list li{padding:12px 0;font-size:14px;color:var(--gray-700);border-bottom:1px solid var(--gray-100);display:flex;align-items:center;gap:10px}
.rules-list li:last-child{border-bottom:none}
.rule-emoji{font-size:16px;min-width:20px}

/* Reviews */
.reviews-placeholder{background:var(--gray-50);border-radius:var(--radius);padding:32px;text-align:center;color:var(--gray-500)}

/* Location */
.location-map{width:100%;height:300px;background:var(--gray-100);border-radius:var(--radius);margin-top:16px}

/* === RIGHT COLUMN (BOOKING CARD) === */
.deposit-tip.show{display:block!important}
.booking-card{position:sticky;top:80px;background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--gray-200);padding:24px}
.mobile-booking-bar{display:none}
.mobile-bottom-bar{display:none!important}
.booking-price{font-size:28px;font-weight:900;color:var(--navy);margin-bottom:4px}
.booking-price small{font-size:14px;font-weight:400;color:var(--gray-500)}
.booking-rating{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--gray-600);margin-bottom:20px}
.booking-rating .stars{color:var(--gold)}

.booking-form{display:flex;flex-direction:column;gap:16px}
.date-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-group{display:flex;flex-direction:column;gap:6px}
.form-label{font-size:12px;font-weight:600;color:var(--gray-700);text-transform:uppercase;letter-spacing:0.5px}
.form-input,.form-select{padding:12px;border:1px solid var(--gray-300);border-radius:var(--radius);font-size:14px;font-family:inherit;background:var(--white);color:var(--gray-900)}
.form-input:focus,.form-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,184,122,0.1)}

.time-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.delivery-toggle{display:flex;background:var(--gray-100);border-radius:var(--radius);padding:4px}
.delivery-option{flex:1;padding:8px;border-radius:4px;text-align:center;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}
.delivery-option.active{background:var(--white);color:var(--primary);box-shadow:0 1px 3px rgba(0,0,0,0.1)}

.price-breakdown{background:var(--gray-50);border-radius:var(--radius);padding:16px;margin-top:16px;display:none}
.price-breakdown.visible{display:block}
.price-row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px}
.price-row.total{border-top:1px solid var(--gray-300);padding-top:12px;margin-top:8px;font-size:16px;font-weight:700;color:var(--navy)}

.book-btn{width:100%;background:var(--primary);color:var(--white);border:none;padding:16px;border-radius:var(--radius);font-size:16px;font-weight:700;cursor:pointer;transition:all .2s;margin-top:16px}
.book-btn:hover{background:var(--primary-dark);transform:translateY(-1px)}
.booking-note{text-align:center;font-size:12px;color:var(--gray-500);margin-top:12px}
.contact-info{text-align:center;margin-top:16px;font-size:14px;color:var(--gray-600)}

/* === WISHLIST === */
.wishlist-btn-detail{position:absolute;top:16px;right:16px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.9);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:22px;z-index:10;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 8px rgba(0,0,0,0.15)}
.wishlist-btn-detail:hover{transform:scale(1.15);box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.wishlist-btn-detail.active{animation:heartPop .3s ease}
@keyframes heartPop{0%{transform:scale(1)}50%{transform:scale(1.3)}100%{transform:scale(1)}}

/* === AVAILABILITY CALENDAR === */
.availability-section .flatpickr-calendar {
  position: relative !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  width: 100% !important;
}

.availability-section .flatpickr-months {
  padding: 16px;
  background: var(--gray-50);
  border-radius: var(--radius) var(--radius) 0 0;
}

.availability-section .flatpickr-month {
  color: var(--navy);
  font-weight: 700;
}

.availability-section .flatpickr-prev-month,
.availability-section .flatpickr-next-month {
  color: var(--gray-600);
  padding: 8px;
}

.availability-section .flatpickr-prev-month:hover,
.availability-section .flatpickr-next-month:hover {
  color: var(--primary);
}

.availability-section .flatpickr-weekdays {
  background: var(--white);
  padding: 8px 16px 8px 16px;
  border-bottom: 1px solid var(--gray-200);
}

.availability-section .flatpickr-weekday {
  color: var(--gray-600);
  font-weight: 600;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.availability-section .flatpickr-days {
  padding: 0 8px 16px 8px;
  background: var(--white);
  border-radius: 0 0 var(--radius) var(--radius);
}
.availability-section .dayContainer {
  min-width: 100%;
  max-width: 100%;
}

.availability-section .flatpickr-day {
  border-radius: 6px !important;
  color: var(--gray-800);
  font-weight: 500;
  width: 44px;
  height: 52px;
  line-height: 1;
  margin: 2px;
  transition: all .2s;
  border: none !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  position: relative;
}
.availability-section .flatpickr-day .day-price {
  font-size: 9px;
  font-weight: 600;
  color: var(--primary-dark);
  line-height: 1;
  pointer-events: none;
}
.availability-section .flatpickr-day.flatpickr-disabled .day-price {
  display: none;
}
.availability-section .flatpickr-day.selected .day-price,
.availability-section .flatpickr-day.startRange .day-price,
.availability-section .flatpickr-day.endRange .day-price,
.availability-section .flatpickr-day.inRange .day-price {
  color: rgba(255,255,255,0.85);
}
.availability-section .flatpickr-day.prevMonthDay .day-price,
.availability-section .flatpickr-day.nextMonthDay .day-price {
  display: none;
}

/* Available dates - default green */
.availability-section .flatpickr-day:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay) {
  background: var(--white);
  color: var(--gray-800);
}

.availability-section .flatpickr-day:not(.flatpickr-disabled):hover:not(.prevMonthDay):not(.nextMonthDay) {
  background: var(--primary-light);
  color: var(--primary-dark);
}

/* Blocked/disabled dates - red */
.availability-section .flatpickr-day.flatpickr-disabled {
  background: #FEE2E2 !important;
  color: #DC2626 !important;
  text-decoration: line-through;
  cursor: not-allowed !important;
}

/* Selected range - gold highlight */
.availability-section .flatpickr-day.selected,
.availability-section .flatpickr-day.startRange,
.availability-section .flatpickr-day.endRange,
.availability-section .flatpickr-day.inRange {
  background: var(--gold) !important;
  color: var(--white) !important;
  font-weight: 700;
}

.availability-section .flatpickr-day.startRange {
  border-radius: 6px 0 0 6px !important;
}

.availability-section .flatpickr-day.endRange {
  border-radius: 0 6px 6px 0 !important;
}

.availability-section .flatpickr-day.startRange.endRange {
  border-radius: 6px !important;
}

.availability-section .flatpickr-day.inRange {
  border-radius: 0 !important;
}

/* Today indicator */
.availability-section .flatpickr-day.today:not(.selected):not(.flatpickr-disabled) {
  border: 2px solid var(--primary);
  font-weight: 700;
  color: var(--primary);
}

/* Previous/next month days */
.availability-section .flatpickr-day.prevMonthDay,
.availability-section .flatpickr-day.nextMonthDay {
  color: var(--gray-400);
}

/* Selected dates info styling */
#selectedDatesInfo {
  animation: slideDown 0.3s ease;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#bookSelectedDates:hover {
  background: var(--primary-dark) !important;
}

/* Mobile responsiveness for calendar */
@media (max-width: 768px) {
  .availability-section .flatpickr-calendar {
    font-size: 14px;
  }

  .availability-section .flatpickr-day {
    width: 28px;
    height: 28px;
    line-height: 28px;
    font-size: 12px;
  }

  .availability-section .flatpickr-months {
    padding: 12px;
  }

  .availability-section .flatpickr-weekdays {
    padding: 6px 12px;
  }

  .availability-section .flatpickr-days {
    padding: 0 12px 12px 12px;
  }
}

/* === MOBILE === */
@media(max-width:768px){


.gallery-grid{grid-template-columns:1fr;grid-template-rows:250px auto;height:auto}
.thumbnail-grid{grid-template-rows:1fr;grid-template-columns:repeat(4,1fr);height:80px}
.content-layout{grid-template-columns:1fr;gap:32px}
.booking-card{position:fixed;bottom:0;left:0;right:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;z-index:50;box-shadow:0 -4px 20px rgba(0,0,0,0.15);padding:0;overflow:hidden}
.mobile-booking-bar{display:flex}
.mobile-booking-bar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--white);border-bottom:1px solid var(--gray-200)}
.mobile-price{font-size:20px;font-weight:800;color:var(--navy)}
.mobile-book-btn{background:var(--primary);color:var(--white);padding:12px 24px;border-radius:var(--radius);font-weight:700;border:none;cursor:pointer}
.booking-card{display:none!important}
.mobile-bottom-bar{display:flex!important}
.features-grid,.amenities-grid{grid-template-columns:1fr}
.date-row,.time-row{grid-template-columns:1fr;gap:12px}
.main-content{padding-bottom:100px}
.photo-gallery{padding-top:70px}

/* Mobile specs adjustments */
.specs-container{gap:16px}
.specs-category{padding:16px}
.specs-grid{grid-template-columns:1fr!important}
.spec-row{flex-direction:column;align-items:flex-start;gap:4px;padding:12px 0}
.spec-label{font-size:13px}
.spec-value{font-size:14px;text-align:left}
.show-all-specs-btn{padding:10px 14px;font-size:13px}

/* Initially hide some specs categories on mobile */
.specs-category:nth-child(n+3){display:none}
}

/* === FOOTER === */
footer{background:var(--navy);color:rgba(255,255,255,0.5);padding:32px 0}
.footer-bottom{max-width:1240px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;font-size:12px}
@media(max-width:768px){.footer-bottom{flex-direction:column;gap:6px}}
/* Compact inline calendar */
.availability-section .flatpickr-calendar{font-size:13px;max-width:100%;box-shadow:none}
.availability-section .flatpickr-day{height:32px;line-height:32px;width:32px;max-width:32px}
.availability-section .dayContainer{max-width:260px;min-width:260px}
.availability-section .flatpickr-days{max-width:260px}
.availability-section .flatpickr-months{padding:4px 0}
.availability-section .flatpickr-month{height:28px}
.availability-section .flatpickr-current-month{font-size:13px}
.availability-section span.flatpickr-weekday{font-size:11px}
