:root {
  --vyntrixa-cyan: #00aef0;
  --vyntrixa-blue: #2563eb;
  --vyntrixa-indigo: #4f46e5;
  --vyntrixa-purple: #7c3aed;
  --vyntrixa-navy: #0b1026;
}

/* Vyntrixa brand colours: cyan -> blue -> purple, matching the company logo. */
.default-btn,
.btn-bg-one,
.btn-bg-two,
.btn-bg-three,
.footer-form .default-btn,
.contact-form .default-btn,
.booking-form .default-btn {
  background: linear-gradient(100deg, var(--vyntrixa-cyan), var(--vyntrixa-blue) 48%, var(--vyntrixa-purple)) !important;
  border-color: transparent !important;
  color: #fff !important;
}

.default-btn:hover,
.default-btn:focus {
  background: linear-gradient(100deg, var(--vyntrixa-purple), var(--vyntrixa-blue), var(--vyntrixa-cyan)) !important;
  box-shadow: 0 10px 24px rgb(79 70 229 / 25%);
}

.main-nav nav .navbar-nav .nav-item a:hover,
.main-nav nav .navbar-nav .nav-item a.active,
.main-nav nav .navbar-nav .nav-item a:focus,
.main-nav nav .navbar-nav .nav-item .dropdown-menu li a:hover,
.section-title span,
.section-title .sp-color,
a:hover,
.footer-widget .footer-list li a:hover,
.footer-list-contact li i,
.social-link li a:hover {
  color: var(--vyntrixa-purple) !important;
}

.top-header-bg,
.footer-bg,
.navbar-area.is-sticky {
  background-color: var(--vyntrixa-navy) !important;
}

.footer-bg {
  background-image: linear-gradient(135deg, #070b1c, #101857 55%, #24104d) !important;
}

.preloader .sk-cube,
.room-card .room-content .room-btn,
.pagination-area .page-numbers.current,
.pagination-area .page-numbers:hover,
.nice-select .option:hover,
.nice-select .option.focus,
.nice-select .option.selected.focus {
  background-color: var(--vyntrixa-blue) !important;
}

.room-card:hover,
.contact-form .form-control:focus,
.booking-form .form-control:focus,
.form-control:focus {
  border-color: var(--vyntrixa-purple) !important;
}

.navbar-brand img,
.mobile-nav .logo img,
.footer-logo img {
  object-fit: contain;
}

/* Compact the lower home-page sections without changing their card layout. */
.services-area-three {
  padding-top: 65px !important;
  padding-bottom: 40px !important;
}

.testimonials-area-three {
  padding-top: 45px !important;
  padding-bottom: 40px !important;
  margin-bottom: 0 !important;
}

.blog-area {
  padding-top: 65px !important;
  padding-bottom: 40px !important;
}

.services-area-three .row.pt-45,
.testimonials-area-three .row.pt-45,
.blog-area .row.pt-45 {
  padding-top: 25px !important;
}

.side-bar-form .form-group i {
  pointer-events: none;
}

.side-bar-form input[type="date"] {
  cursor: pointer;
}

.side-bar-form .room-date-input {
  padding-right: 48px !important;
}

.side-bar-form .room-date-input::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 1;
}

/* Rooms & Rates: replace the template's coral accents with the Vyntrixa palette. */
.room-area {
  background: linear-gradient(180deg, #f8fbff 0%, #f4f1ff 100%) !important;
  padding-top: 60px !important;
  padding-bottom: 45px !important;
}

.room-area .row.pt-45 {
  padding-top: 25px !important;
}

.room-card-two {
  border: 1px solid rgb(37 99 235 / 10%);
  box-shadow: 0 12px 30px rgb(15 23 42 / 9%) !important;
}

.room-card-two::before {
  background: linear-gradient(125deg, rgb(0 174 240 / 10%), rgb(124 58 237 / 10%)) !important;
}

.room-card-two .room-card-content h3 a {
  color: var(--vyntrixa-navy) !important;
}

.room-card-two .room-card-content span,
.room-card-two .room-card-content ul li i {
  color: var(--vyntrixa-blue) !important;
}

.room-card-two .room-card-content .rating {
  color: var(--vyntrixa-purple) !important;
}

.room-card-two .room-card-content .book-more-btn {
  display: inline-block;
  background: linear-gradient(100deg, var(--vyntrixa-cyan), var(--vyntrixa-blue) 50%, var(--vyntrixa-purple)) !important;
  border-radius: 7px;
  box-shadow: 0 8px 18px rgb(37 99 235 / 20%);
}

.room-card-two .room-card-content .book-more-btn:hover {
  background: linear-gradient(100deg, var(--vyntrixa-purple), var(--vyntrixa-blue), var(--vyntrixa-cyan)) !important;
  color: #fff !important;
}

/* Services uses the darker logo background, with the brand gradient reserved for actions. */
.services-area-three {
  background: linear-gradient(120deg, #080d22 0%, #101b51 52%, #251253 100%) !important;
}

.services-area-three .section-title h2 {
  color: #fff !important;
}

.services-area-three .section-title .sp-color {
  color: var(--vyntrixa-cyan) !important;
}

.service-item-two {
  border: 1px solid rgb(110 139 255 / 24%);
  border-radius: 12px;
  box-shadow: 0 12px 28px rgb(0 0 0 / 20%) !important;
}

.service-item-two i {
  color: var(--vyntrixa-blue) !important;
}

.service-item-two .content .read-btn {
  color: var(--vyntrixa-purple) !important;
  border-color: var(--vyntrixa-purple) !important;
  border-radius: 6px;
}

.service-item-two:hover .read-btn,
.service-item-two .content .read-btn:hover {
  color: #fff !important;
  border-color: transparent !important;
  background: linear-gradient(100deg, var(--vyntrixa-cyan), var(--vyntrixa-blue), var(--vyntrixa-purple)) !important;
}

/* Keep every home-page section on the same comfortable vertical rhythm. */
.book-area-two,
.team-area-three,
.faq-area {
  padding-top: 65px !important;
  padding-bottom: 45px !important;
}

.book-area-two {
  background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
}

.book-area-two .section-title .sp-color,
.faq-area .section-title .sp-color {
  color: var(--vyntrixa-purple) !important;
}

.faq-area {
  background: linear-gradient(135deg, #f7fbff 0%, #f5f1ff 100%) !important;
}

.faq-content-bg2 .faq-accordion .accordion .accordion-item {
  border: 1px solid rgb(79 70 229 / 14%) !important;
  border-radius: 8px;
  box-shadow: 0 6px 16px rgb(15 23 42 / 5%);
}

.faq-content .faq-accordion .accordion .accordion-title i,
.faq-content-bg2 .faq-accordion .accordion .accordion-item .accordion-title i {
  color: var(--vyntrixa-purple) !important;
}

.team-area-three {
  margin-bottom: 0 !important;
  background-color: #ffffff;
}

.team-area-three .team-slider-two {
  padding-top: 25px !important;
}

.team-area-three .owl-dots .owl-dot span,
.testimonials-slider-area .owl-dots .owl-dot span {
  background-color: rgb(37 99 235 / 30%) !important;
}

.team-area-three .owl-dots .owl-dot.active span,
.team-area-three .owl-dots .owl-dot:hover span,
.testimonials-slider-area .owl-dots .owl-dot.active span,
.testimonials-slider-area .owl-dots .owl-dot:hover span {
  background-color: var(--vyntrixa-purple) !important;
}

.testimonials-area-three {
  background: linear-gradient(180deg, #fafbff 0%, #f3f0ff 100%);
}

.testimonials-slider-content i,
.testimonials-slider-content ul li span {
  color: var(--vyntrixa-purple) !important;
}

.blog-area {
  background-color: #ffffff;
}

.blog-item {
  border: 1px solid rgb(37 99 235 / 10%);
  box-shadow: 0 10px 24px rgb(15 23 42 / 8%) !important;
}

.blog-item .content .read-btn,
.blog-item .content ul li i {
  color: var(--vyntrixa-purple) !important;
}

.blog-item .content .read-btn:hover,
.blog-item .content .read-btn:focus {
  color: #fff !important;
  border-color: transparent !important;
  background: linear-gradient(100deg, var(--vyntrixa-cyan), var(--vyntrixa-blue) 50%, var(--vyntrixa-purple)) !important;
  box-shadow: 0 8px 18px rgb(37 99 235 / 22%);
}

.blog-item .content .read-btn::before,
.blog-item .content .read-btn::after,
.blog-item .content .read-btn:hover::before,
.blog-item .content .read-btn:hover::after {
  opacity: 0 !important;
}

/* Prevent the template's dark hover overlay from hiding the brand gradient. */
.default-btn::before,
.default-btn::after,
.default-btn:hover::before,
.default-btn:hover::after {
  opacity: 0 !important;
}

@media only screen and (max-width: 767px) {
  .room-area,
  .book-area-two,
  .services-area-three,
  .team-area-three,
  .testimonials-area-three,
  .faq-area,
  .blog-area {
    padding-top: 50px !important;
    padding-bottom: 35px !important;
  }

  .services-area-three .row.pt-45,
  .team-area-three .team-slider-two,
  .testimonials-area-three .row.pt-45,
  .blog-area .row.pt-45 {
    padding-top: 20px !important;
  }

  .faq-img-3 {
    margin-left: 0;
    margin-bottom: 30px;
  }
}
