/*
  -------------------------------------------
  -----      CSS for the font used      -----
  -------------------------------------------
*/

@import url('./font/inter.css');

body {
    font-family: 'Inter var', sans-serif;
    font-feature-settings: "cv02","cv03","cv04","cv11";
}



/*
  -------------------------------------------
  -----      CSS for the preloader      -----
  -------------------------------------------
*/

.loader-wrapper {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    background-color: rgba(var(--bs-body-bg-rgb), 1) !important;
    display:flex;
    justify-content: center !important;
    align-items: center !important;
    z-index: 2000 !important;
}



/*
  --------------------------------------------------------------------------------
  -----      CSS for the default styles for both directions RTL and LTR      -----
  --------------------------------------------------------------------------------
*/

.left-to-right {
    display: none !important;
}
.right-to-left {
    display: none !important;
}
[dir="ltr"] .left-to-right {
    display: inline !important;
}
[dir="rtl"] .right-to-left {
    display: inline !important;
}

[dir="rtl"] .rtl-flip {
    transform: scaleX(-1) !important;
}

[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    transform: scaleX(-1);
}



/*
  -------------------------------------------
  -----      CSS for the AOS's RTL      -----
  -------------------------------------------
*/

[dir="rtl"] [data-aos=fade-left] {
    transform: translate3d(-100px, 0, 0);
}
[dir="rtl"] [data-aos=fade-right] {
    transform: translate3d(100px, 0, 0);
}

[dir="rtl"] [data-aos=fade-up-left] {
    transform: translate3d(-100px, 100px, 0);
}
[dir="rtl"] [data-aos=fade-up-right] {
    transform: translate3d(100px, 100px, 0);
}

[dir="rtl"] [data-aos=fade-down-left] {
    transform: translate3d(-100px,-100px,0);
}
[dir="rtl"] [data-aos=fade-down-right] {
    transform: translate3d(100px, -100px, 0);
}

[dir="rtl"] [data-aos=flip-right] {
    transform: perspective(2500px) rotateY(-100deg);
}
[dir="rtl"] [data-aos=flip-left] {
    transform: perspective(2500px) rotateY(100deg);
}
[dir="rtl"] [data-aos=flip-right].aos-animate {
    transform: perspective(2500px) rotateY(0);
}
[dir="rtl"] [data-aos=flip-left].aos-animate {
    transform: perspective(2500px) rotateY(0);
}

[dir="rtl"] [data-aos=slide-left] {
    transform: translate3d(-100%,0,0);
}
[dir="rtl"] [data-aos=slide-right] {
    transform: translate3d(100%,0,0);
}

[dir="rtl"] [data-aos=zoom-in-right] {
    transform: translate3d(100px,0,0) scale(.6);
}
[dir="rtl"] [data-aos=zoom-in-left] {
    transform: translate3d(-100px,0,0) scale(.6);
}

[dir="rtl"] [data-aos=zoom-out-right] {
    transform: translate3d(100px,0,0) scale(1.2);
}
[dir="rtl"] [data-aos=zoom-out-left] {
    transform: translate3d(-100px,0,0) scale(1.2);
}




/*
  ----------------------------------------------------
  -----      CSS for the button back to top      -----
  ----------------------------------------------------
*/

.btn-back-to-top {
    position: fixed;
    bottom: 20px;
    display: none;
    z-index: 10;
}

[dir="ltr"] .btn-back-to-top {
    right: 20px;
}

[dir="rtl"] .btn-back-to-top {
    left: 20px;
}






@media (min-width: 1200px) {
    .overflow-xl-hidden {
        overflow: hidden !important;
    }
}

/* Pricing Card Enhancements */
.pricing-card {
    transition: transform 0.2s, box-shadow 0.2s;
}
.pricing-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
}
.pricing-card .badge {
    font-size: 1rem;
    padding: 0.5em 1em;
}
.btn-primary {
    transition: background 0.2s, box-shadow 0.2s;
}
.btn-primary:hover, .btn-primary:focus {
    background: #0056b3;
    box-shadow: 0 4px 16px rgba(0,86,179,0.15);
}
/* Make offcanvas menu background orange on mobile */
@media (max-width: 1199.98px) {
    .offcanvas.offcanvas-end {
      background-color: black !important; /* Use your brand orange */
      color: #fff;
    }
    .offcanvas.offcanvas-end .nav-link,
    .offcanvas.offcanvas-end .dropdown-toggle {
      color: #fff !important;
    }
    .offcanvas.offcanvas-end .nav-link.bg-primary-hover,
    .offcanvas.offcanvas-end .dropdown-toggle.bg-primary-hover {
      background: rgba(255,255,255,0.1) !important;
    }
    .offcanvas.offcanvas-end .btn-close {
        filter: invert(1) grayscale(100%) brightness(200%);
        /* Optional: add a background for better visibility */
        background-color: transparent;
        opacity: 1;
      }
  }