/* Custom Theme Colors for L3M Green Cottage */
:root {
  /* Primary Colors */
  --primary-green: #003B26;
  --secondary-green: #003B26;
  --accent-green: #003B26;
  
  /* Additional Theme Colors */
  --light-green: #f8f9f5;
  --dark-green: #003B26;
  --border-green: #003B26;
}

/* Override theme colors for all buttons */
.vs-btn {
  background-color: var(--primary-green) !important;
  border-color: var(--primary-green) !important;
  color: #ffffff !important;
}

.vs-btn:hover {
  background-color: #5C8C46 !important;
  border-color: #5C8C46 !important;
  color: #ffffff !important;
}

.vs-btn.style4 {
  background-color: var(--primary-green) !important;
  border-color: var(--primary-green) !important;
  color: #ffffff !important;
}

.vs-btn.style4:hover {
  background-color: #5C8C46 !important;
  border-color: #5C8C46 !important;
  color: #ffffff !important;
}

.vs-btn.style2 {
  background-color: var(--primary-green) !important;
  border-color: var(--primary-green) !important;
  color: #ffffff !important;
}

.vs-btn.style2:hover {
  background-color: #5C8C46 !important;
  border-color: #5C8C46 !important;
  color: #ffffff !important;
}

.vs-btn.style3 {
  background-color: var(--primary-green) !important;
  border-color: var(--primary-green) !important;
  color: #ffffff !important;
}

.vs-btn.style3:hover {
  background-color: #5C8C46 !important;
  border-color: #5C8C46 !important;
  color: #ffffff !important;
}

/* Hero section customizations */
.hero-layout {
  background-color: var(--light-green);
}

/* Package cards customizations */
.package-style1 {
  border: 1px solid var(--border-green);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.package-style1:hover {
  border-color: var(--primary-green);
  box-shadow: 0 5px 15px rgba(152, 168, 105, 0.2);
}

/* Assurer la même taille visuelle pour les cartes gîtes */
.package-style1 .package-img {
  overflow: hidden;
}

.package-style1 .package-img img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
}

.package-style1 .package-content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.package-style1 .package-meta {
  margin-top: auto;
}

/* Destination cards customizations */
.destination-style1 {
  border: 1px solid var(--border-green);
}

.destination-style1:hover {
  border-color: var(--primary-green);
  box-shadow: 0 5px 15px rgba(152, 168, 105, 0.2);
}

/* Form elements */
.form-group input:focus,
.form-group select:focus {
  border-color: var(--primary-green);
  box-shadow: 0 0 0 0.2rem rgba(152, 168, 105, 0.25);
}

/* Navigation customizations */
.main-menu ul li a:hover {
  color: var(--primary-green);
}

/* Footer customizations */
.footer-wrapper {
  background-color: var(--dark-green);
}

/* Blog section customizations */
.blog-style4 {
  border: 1px solid var(--border-green);
}

.blog-style4:hover {
  border-color: var(--primary-green);
}

/* Cartes gîtes en bas de page (style blog) : même hauteur */
.blog-wrapper .vs-blog.blog-style3 {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.blog-wrapper .vs-blog.blog-style3 .blog-img img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}

.blog-wrapper .vs-blog.blog-style3 .blog-content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.blog-wrapper .vs-blog.blog-style3 .blog-bottom {
  margin-top: auto;
}

/* Additional button styles for all button types */
button, input[type="button"], input[type="submit"] {
  background-color: var(--primary-green) !important;
  border-color: var(--primary-green) !important;
  color: #ffffff !important;
}

button:hover, input[type="button"]:hover, input[type="submit"]:hover {
  background-color: #5C8C46 !important;
  border-color: #5C8C46 !important;
  color: #ffffff !important;
}

/* Icon buttons */
.icon-btn {
  background-color: var(--primary-green) !important;
  border-color: var(--primary-green) !important;
  color: #ffffff !important;
}

.icon-btn:hover {
  background-color: #5C8C46 !important;
  border-color: #5C8C46 !important;
  color: #ffffff !important;
}

/* Tab buttons */
.tab-btn {
  background-color: var(--primary-green) !important;
  border-color: var(--primary-green) !important;
  color: #ffffff !important;
}

.tab-btn:hover, .tab-btn.active {
  background-color: #5C8C46 !important;
  border-color: #5C8C46 !important;
  color: #ffffff !important;
}

/* Subtitle colors */
.hero-subtitle {
  color: var(--primary-green) !important;
}

.sec-subtitle {
  color: var(--primary-green) !important;
}

/* Destination info hover effects */
.destination-style1:hover .destination-info {
  background-color: var(--primary-green) !important;
  color: #ffffff !important;
}

.destination-style1:hover .destination-info h4,
.destination-style1:hover .destination-info p {
  color: #ffffff !important;
}

.destination-style1:hover .destination-info a {
  color: #ffffff !important;
}

/* Circle shape adjustments */
.shape-mockup img[alt="circle"] {
  max-width: 300px !important;
  width: 300px !important;
  height: auto !important;
}

.shape-mockup img[alt="Circle"] {
  max-width: 300px !important;
  width: 300px !important;
  height: auto !important;
}

/* Specific adjustments for circle2.png */
.shape-mockup img[src*="circle2.png"] {
  max-width: 250px !important;
  width: 250px !important;
  height: auto !important;
}

/* General blog-date color override */
.blog-date {
  color: #5C8C46 !important;
}

/* Logo size adjustments */
.vs-logo img {
  max-width: 170px !important;
  height: auto !important;
}

.vs-menu-wrapper .mobile-logo img,
.vs-menu-wrapper .mobile-logo svg {
  max-width: 200px !important;
}

@media (max-width: 767px) {
  .vs-logo img {
    max-width: 150px !important;
  }
}

/* Blog style4 content border */
.blog-style4 .blog-content {
  border: 1px solid var(--primary-green) !important;
}

/* Input border color for all input types */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="search"],
input[type="url"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="color"],
input[type="file"],
input[type="range"],
input[type="checkbox"],
input[type="radio"],
select,
textarea {
  border-color: #5C8C46 !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="color"]:focus,
input[type="file"]:focus,
input[type="range"]:focus,
select:focus,
textarea:focus {
  border-color: #5C8C46 !important;
  box-shadow: 0 0 0 0.2rem rgba(92, 140, 70, 0.25) !important;
}

/* Scroll button border color */
.scroll-btn:before {
  border-color: #5C8C46 !important;
}

/* Gallery video play button pseudo-elements */
.gallery-video .gallery-btn .play-btn::before,
.gallery-video .gallery-btn .play-btn::after {
  background-color: #5C8C46 !important;
}

/* Main menu mega menu links color */
.main-menu ul.mega-menu > li > a {
  color: #5C8C46 !important;
}

/* Footer widget title after element */
.footer-widget .widget_title::after {
  outline: 4px solid #5C8C46 !important;
}

/* Package review icons color */
.package-review i {
  color: #5C8C46 !important;
}

/* Sub menu border color */
.main-menu ul.sub-menu,
.main-menu ul.mega-menu,
.vs-menu-wrapper .vs-menu ul.sub-menu {
  border-color: #5C8C46 !important;
}

/* Features section cards (4 icônes) */
.features-style1 {
  background: #7DB549 !important;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.features-style1 .features-bg {
  background: transparent !important;
}

.features-style1 .features-title,
.features-style1 .features-text {
  color: #ffffff !important;
}

.features-style1 .features-content {
  text-align: center;
  padding: 16px 18px 20px;
}

/* Bande "Get Special Offer" */
.offer-section {
  background-color: #83BD93;
}

.offer-section .title-area,
.offer-section .title-area .sec-subtitle,
.offer-section .title-area .sec-title,
.offer-section .title-area .sec-text {
  color: #ffffff !important;
}

.offer-section .vs-btn.style2 {
  background-color: #ffffff !important;
  border-color: #ffffff !important;
  color: #003B26 !important;
}

.offer-section .vs-btn.style2:hover {
  background-color: #003B26 !important;
  border-color: #003B26 !important;
  color: #ffffff !important;
}

/* Section "Top Destination" / "Breathtaking Cities" */
.destinations-section {
  background-color: #ffffff !important;
}

.destinations-section .title-area {
  text-align: center;
  margin-bottom: 40px;
}

.destinations-section .sec-subtitle {
  color: #7DB549 !important;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.destinations-section .sec-title.h1 {
  color: #1f2933 !important;
  font-weight: 700;
  font-size: 38px;
}

.destinations-section .sec-text {
  color: #6b7280 !important;
  max-width: 580px;
  margin: 0 auto;
}

.destinations-section .destination-style1 {
  border-radius: 18px;
  overflow: hidden;
  background-color: #ffffff;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.08);
}

.destinations-section .destination-style1 img {
  width: 100%;
  height: 260px; /* même hauteur pour toutes les images d'équipements */
  object-fit: cover;
  display: block;
}

.destinations-section .destination-info {
  border-top: none;
}

.destinations-section .destination-name a {
  color: #111827 !important;
  font-weight: 600;
}

.destinations-section .destination-text {
  color: #6b7280 !important;
}

.destinations-section .destination-price {
  background-color: #7DB549 !important;
  color: #ffffff !important;
}

.destinations-section .destination-carousel-wrapper {
  position: relative;
  margin-top: 30px;
}

.destinations-section .destination-carousel-wrapper .row.destinationSlide {
  margin: 0 60px; /* laisse de la place pour les flèches */
}

.destinations-section .destination-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
}

.destinations-section .destination-arrow-prev {
  left: 10px;
}

.destinations-section .destination-arrow-next {
  right: 10px;
}

/* Testimonial section - green block like mockup */
.testimonial-style1 {
  position: relative;
}

.testimonial-style1 .title-area {
  background: #7db54973;
  border-radius: 22px;
  padding: 32px 40px;
  max-width: 420px;
  color: #ffffff;
}

.testimonial-style1 .title-area .sec-subtitle {
  color: #F3E08C !important; /* petit accent jaune comme sur la maquette */
}

.testimonial-style1 .title-area .sec-title.h1,
.testimonial-style1 .title-area .sec-text {
  color: #ffffff !important;
}

.testimonial-style1 .title-area .vs-btn.style3 {
  background-color: #ffffff !important;
  border-color: #ffffff !important;
  color: #003B26 !important;
}

.testimonial-style1 .title-area .vs-btn.style3:hover {
  background-color: #003B26 !important;
  border-color: #003B26 !important;
  color: #ffffff !important;
}

.testimonial-style1 .testi-style1 {
  background: #7DB549;
  border-radius: 50%;
  padding: 40px 48px;
  color: #ffffff;
}

.testimonial-style1 .testi-text,
.testimonial-style1 .testi-name,
.testimonial-style1 .testi-degi {
  color: #ffffff !important;
}

.testimonial-style1 .testi-rating i {
  color: #F9E066 !important;
}

/* CTA bande verte dans le footer (Ready to get started) */
.footer-wrapper .cta-style1 {
  position: relative;
  border-radius: 18px;
  padding: 32px 48px;
  overflow: hidden;
}

.footer-wrapper .cta-style1 .cta-content {
  color: #ffffff;
}

.footer-wrapper .cta-style1 .cta-title {
  color: #ffffff !important;
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 8px;
}

.footer-wrapper .cta-style1 .cta-text {
  color: #f9fafb !important;
  font-size: 14px;
  max-width: 360px;
}

.footer-wrapper .cta-style1 .cta-image {
  position: relative;
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.footer-wrapper .cta-style1 .cta-image img {
  max-width: 100%;
  height: auto;
  transform: translateY(18%);
}


@media (max-width: 991.98px) {
  .footer-wrapper .cta-style1 {
    padding: 24px 24px 16px;
  }

  .footer-wrapper .cta-style1 .cta-image img {
    transform: translateY(8%);
  }
}
