/* custom.css - Responsee-compatible custom styles for components */

/* --- Utility / Card --- */
.card-shadow {
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(0,0,0,0.08);
  border:1px solid rgba(0,0,0,0.03);
}
.full-img { width:100%; display:block; object-fit:cover; }

/* --- Blog Card --- */
.blog-card { display:block; }
.blog-card .blog-card-title { font-size:1.15rem; margin:8px 0 6px; line-height:1.2; }
.blog-card .blog-card-desc { color:#555; font-size:0.95rem; }

/* --- Badges --- */
.badge {
  display:inline-block;
  background:linear-gradient(90deg,#ff7e5f,#feb47b);
  color:#fff;
  padding:4px 8px;
  border-radius:12px;
  font-size:0.82rem;
  font-weight:600;
}

/* --- Hero --- */
.hero-overlay {
  position:relative;
  background-size:cover;
  background-position:center;
  color:#fff;
}
.hero-overlay::after {
  content:"";
  position:absolute;left:0;right:0;top:0;bottom:0;
  background:linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0.55));
  pointer-events:none;
}
.hero-overlay .hero-inner { position:relative; z-index:2; padding:80px 20px; }

/* hero split */
.hero-split { display:flex; flex-wrap:wrap; align-items:center; }
.hero-split .hero-img { flex:1 1 50%; min-height:320px; }
.hero-split .hero-content { flex:1 1 50%; padding:40px; }

/* --- TOC sticky --- */
.toc-box { border:1px solid rgba(0,0,0,0.06); padding:16px; border-radius:8px; background:#fff; }
.toc-sticky { position:sticky; top:90px; }

/* --- Itinerary timeline --- */
.itinerary { display:flex; flex-direction:column; gap:12px; }
.itinerary .day {
  display:flex; gap:12px; align-items:flex-start;
}
.itinerary .day .num {
  width:46px; height:46px; border-radius:50%; background:#ff7e5f; color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700;
  font-size:1.05rem;
}

/* --- Reviews --- */
.review-card { padding:16px; border-radius:8px; background:#fff; border:1px solid rgba(0,0,0,0.04); }
.stars { color:#f5b301; font-weight:700; }

/* --- CTA Newsletter --- */
.news-cta { display:flex; gap:12px; align-items:center; background:linear-gradient(90deg,#67b26f,#4ca2cd); color:#fff; padding:18px; border-radius:8px; }
.news-cta input[type="email"] { padding:10px 12px; border-radius:6px; border:0; }

/* --- Responsive tweaks (if Responsee breakpoints differ) */
@media (max-width:600px) {
  .hero-inner { padding:40px 12px; }
  .hero-split { flex-direction:column; }
}


/* ------------ Pack 2 Additions ------------ */

/* Feature card */
.feature-card { position:relative; }
.feature-link { color:white; text-decoration:none; display:block; position:relative; }
.feature-img {
  height:320px; background-size:cover; background-position:center;
  border-radius:12px;
}
.feature-content {
  position:absolute; bottom:20px; left:20px; right:20px;
  color:white;
  text-shadow:0 2px 6px rgba(0,0,0,0.6);
}

/* Destination left */
.dest-left img { border-radius:8px 0 0 8px; }

/* Masonry */
.masonry { column-count:3; column-gap:12px; }
.masonry-img { width:100%; margin-bottom:12px; border-radius:8px; }
@media (max-width:768px){ .masonry { column-count:2; } }
@media (max-width:480px){ .masonry { column-count:1; } }

/* Itinerary day card */
.day-number {
  width:42px; height:42px; border-radius:50%; background:#ff7e5f; color:white;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; margin-bottom:12px;
}

/* Travel Tips */
.travel-tips ul li { padding:4px 0; }

/* Fact Box */
.fact-box { text-align:center; }

/* CTA Book */
.cta-book {
  background:linear-gradient(120deg,#e53935,#e35d5b);
  color:white;
  border-radius:12px;
}

/* Rating Summary */
.big-stars { font-size:1.6rem; }

/* ------------ PACK 3 ADDITIONS ------------- */

/* Nearby places */
.nearby-card h5 { margin-bottom:4px; }
.distance-badge {
  display:inline-block;
  background:#4ca2cd;
  color:#fff;
  padding:3px 8px;
  border-radius:12px;
  font-size:0.8rem;
  margin-top:4px;
}

/* Travel facts */
.fact-icon-box { text-align:center; }
.fact-icon { font-size:1.6rem; margin-bottom:6px; }

/* FAQ accordion */
.faq-box { border-radius:8px; }
.faq-item { margin-bottom:12px; }
.faq-question {
  display:block;
  background:#f1f1f1;
  padding:10px;
  border-radius:6px;
  cursor:pointer;
}
.faq-item input { display:none; }
.faq-answer {
  display:none;
  padding:10px;
  border:1px solid #eee;
  border-radius:6px;
}
.faq-item input:checked ~ .faq-answer { display:block; }

/* Features */
.feature-item .feature-icon { font-size:2rem; margin-bottom:10px; }

/* Price box */
.price-box .price-amount {
  font-size:1.8rem;
  color:#e53935;
  margin:10px 0;
}

/* Tag chips */
.badge-chips .chip {
  display:inline-block;
  padding:5px 10px;
  border-radius:20px;
  background:#eee;
  margin:4px;
  font-size:0.85rem;
}

/* Map card */
.map-card .map-img {
  height:160px;
  background-size:cover;
  background-position:center;
}

/* Author box */
.author-img {
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:cover;
}

/* Tag Cloud */
.tag-cloud .tag-item {
  display:inline-block;
  margin:4px;
  padding:6px 12px;
  background:#f2f2f2;
  border-radius:20px;
  font-size:0.85rem;
}

/* Pagination */
.pagination-bar { display:flex; list-style:none; gap:6px; padding:0; }
.pagination-bar a {
  display:block;
  padding:6px 12px;
  border-radius:6px;
  background:#f2f2f2;
}
.pagination-bar .active-page {
  background:#4ca2cd;
  color:white;
}

/* ------------ PACK 4 ADDITIONS ------------- */

/* Search Box */
.search-box { display:flex; gap:10px; align-items:center; padding:10px; }
.search-box input { flex:1; padding:8px 10px; border-radius:6px; }

/* Search Result Item */
.search-result-item h4 { margin-bottom:6px; }

/* Blog List Row */
.blog-row img { border-radius:6px; }

/* Promo Strip */
.promo-strip {
  background:linear-gradient(120deg,#00c6ff,#0072ff);
  color:white;
  border-radius:10px;
  text-align:center;
}
.promo-strip .promo-btn { margin-left:12px; }

/* Announcement Bar */
.announcement-bar {
  background:#ffe082;
  text-align:center;
  padding:6px 0;
}

/* Footer Minimal */
.footer-minimal { border-top:1px solid #ddd; }
.footer-minimal .footer-links a { margin:0 6px; color:#666; }

/* Image Banner */
.image-banner {
  height:260px;
  background-size:cover;
  background-position:center;
  border-radius:10px;
  position:relative;
}
.image-banner .banner-content {
  position:absolute; bottom:20px; left:20px;
  color:white;
  text-shadow:0 2px 4px rgba(0,0,0,0.5);
}

/* Breadcrumb */
.breadcrumb-bar a { color:#4ca2cd; }

/* Widget List */
.widget-list a { color:#444; }

/* ------------ PACK 5 ADDITIONS ------------- */

/* CTA Inline */
.cta-inline {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 16px;
}

/* Cookie Consent */
.cookie-consent {
  position:fixed;
  bottom:0; left:0; right:0;
  background:#333;
  color:white;
  padding:12px;
  text-align:center;
  z-index:999;
}
.cookie-consent a { color:white; }

/* Review Carousel */
.review-carousel {
  display:flex;
  overflow-x:auto;
  gap:12px;
  padding-bottom:8px;
}
.review-carousel::-webkit-scrollbar { display:none; }
.review-item {
  flex:0 0 240px;
  border-radius:8px;
}

/* Contact Card */
.contact-card a { color:#4ca2cd; }

/* Partner Logos */
.logo-img {
  width:80px;
  height:auto;
  opacity:0.9;
  transition:0.2s;
}
.logo-img:hover { opacity:1; }

/* Hollow Card */
.hollow-card {
  border:1px solid #ddd;
  border-radius:8px;
  padding:16px;
}

/* Overlay Figure */
.overlay-figure {
  height:260px;
  background-size:cover;
  background-position:center;
  position:relative;
  border-radius:10px;
}
.overlay-figure .overlay-text {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%, -50%);
  color:white;
  font-size:1.4rem;
  text-shadow:0 2px 4px rgba(0,0,0,0.5);
}

/* Badge CTA */
.badge-cta { display:flex; gap:12px; align-items:center; padding:12px; }
.cta-badge {
  background:#ff7e5f;
  color:#fff;
  padding:6px 10px;
  border-radius:8px;
  font-weight:600;
}
.cta-body p { margin:0; }

/* Info Alert */
.info-alert { padding:12px; border-radius:8px; }
.info-alert.info { background:#e3f2fd; color:#1565c0; }
.info-alert.success { background:#e8f5e9; color:#2e7d32; }
.info-alert.warning { background:#fff8e1; color:#f9a825; }

/* Timeline Horizontal */
.timeline-scroll {
  display:flex;
  overflow-x:auto;
  gap:12px;
  padding-bottom:10px;
}
.timeline-event {
  flex:0 0 200px;
  border-radius:8px;
}