/* Googlefont Poppins CDN Link */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');
@font-face {
  font-family: 'MyCustomFont';
  src: url('css/fonts/saintecolombe-light-TRIAL-BF63feb9e0d3ea4.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

/* ===== RESET ===== */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family: 'MyCustomFont', sans-serif;
}
.top-text{
			 text-align: center; 
		  }
body{ padding-top:100px; }

/* ===== NAV ===== */
nav{
  position:fixed;
  top:0;
  width:100%;
  background:#fff;
  z-index:999;
  box-shadow:0 2px 10px rgba(0,0,0,0.1);
}

/* ===== HEADER ===== */
.top-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:5px 15px;
  border-bottom:1px solid #eee;
}

.top-header .left,
.top-header .right{
  display: flex;
  align-items: center;
  gap: 15px;
}

.top-header .logo{
  text-align: center;
}

.top-header .logo img{
  height: 50px;
}

/*.logo img{ height:40px; }*/

.mobile-only{
  display: none !important;
  font-size:26px;
  cursor:pointer;
}
.navbar .nav-links .sidebar-logo{
  display: none;
}
/* ===== MENU ===== */
.navbar{
  display:flex;
  justify-content:center;
}

.nav-links{
  width:100%;
}

.links{
  display:flex;
  justify-content:center;
  list-style:none;
}

.links li{
  position:relative;
  padding:5px 15px;
}

.links li a{
  text-decoration:none;
  color:#000;
  font-size:14px;
}

/* ===== DESKTOP MEGA ===== */
.links li.mega{ position:static; }

.mega-box{
  position:absolute;
  left:0;
  top:100%;
  width:100%;
  background:#fff;
  padding:20px;
  display:none;
  box-shadow:0 5px 10px rgba(0,0,0,0.1);
}

.links li.mega.active .mega-box{
  display:block;
  padding:0;
}

.mega-box .content{
  /*display:flex;*/
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  max-width: 90%;
  padding:2%;
}

.mega-box .row{
  width:100%;
  /*width:25%;*/
}

.mega-box .row header{
  font-weight:bold;
  margin-bottom:10px;
}

.mega-links{
  list-style:none;
   padding:0;
}

.mega-links li{ padding:5px 0; }

/*===== Search ====== */
.navbar .search-box{
  position: relative;
   height: 40px;
  width: 40px;
}
.navbar .search-box i{
  position: absolute;
  height: 100%;
  width: 100%;
  line-height: 40px;
  text-align: center;
  font-size: 22px;
  color: #000000;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
}
.navbar .search-box .input-box{
  position: absolute;
  right: calc(100% - 40px);
  top: 80px;
  height: 60px;
  width: 300px;
  background: #ffffff;
  border-radius: 6px;
  opacity: 0;
  pointer-events: none;
  transition: all 0.4s ease;
}
.navbar.showInput .search-box .input-box{
  top: 65px;
  opacity: 1;
  pointer-events: auto;
  background: #ffffff;
}
.search-box .input-box::before{
  content: '';
  position: absolute;
  height: 20px;
  width: 20px;
  background: #eb9c01;
  right: 10px;
  top: -6px;
  transform: rotate(45deg);
}
.search-box .input-box input{
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 4px;
  transform: translate(-50%, -50%);
  height: 35px;
  width: 280px;
  outline: none;
  padding: 0 15px;
  font-size: 16px;
  border: none;
}

.search-bar{
  display: none;   /* ✅ completely hidden */
  width: 100%;
  background: #fff;
  border-top: 1px solid #eee;
  padding: 12px 20px;

  align-items: center;
  justify-content: space-between;
}

/* when active */
.search-bar.active{
  display: flex;   /* ✅ only show when clicked */
}
		  
.search-bar form{
  border: none;
/*	outline: none;*/
	width:90%;
	text-align: left;
}
.search-bar input{
  border: none;
	outline: none;
	width:100%;
	text-align: left;
}
.close-search{
	font-size: 1.5em;		  
}
.search-trigger{
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}

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

.mobile-only{ display:block !important; }

/* sidebar */
.nav-links{
  position:fixed;
  top:0;
  left:-100%;
  width:90%;
  height:100%;
  background:#fff;
  padding:20px;
  transition:0.3s;
  overflow-y:auto;
}

.nav-links.active{ left:0; }

/* vertical menu */
.links{
  flex-direction:column;
}

.links li{
  border-bottom:1px solid #eee;
  padding:10px 0;
}

/* ===== MEGA FIX ===== */
.links li.mega{
  position:relative;
}

/* smooth animation */
.mega-box{
  position:relative;
  width:100%;
  padding:0;
  box-shadow:none;
  max-height:0;
  overflow:hidden;
  transition:max-height 0.4s ease;
}

/* open */
.links li.mega.active .mega-box{
  max-height:1000px;
}

/* stack */
.mega-box .content{
  display:block;
}

.mega-box .row{
  width:100%;
  padding:10px;
  border-bottom:1px solid #eee;
}

/* submenu animation */
.mega-links{
  max-height:0;
  overflow:hidden;
  transition:max-height 0.3s ease;
}

.row.active .mega-links{
  max-height:500px;
}

/* arrow rotate */
.mega > a i{
  transition:0.3s;
}

.mega.active > a i{
  transform:rotate(180deg);
}

.navbar .nav-links .sidebar-logo{
    display: flex;
    align-items: left;
    justify-content:space-between;
  }
  .sidebar-logo .logo-name{
    font-size: 25px;
    color: #000000;
  }
    .sidebar-logo  i,
    .navbar .bx-menu{
      font-size: 25px;
      color: #000000;
    }

}

.hover-underline-animation {
     display: inline-block;
     position: relative;
     text-decoration: none; /* Remove default underline */
     color: black; /* Set default text color */
   }

   .hover-underline-animation::after {
     content: "";
     position: absolute;
     bottom: -10px; /* Adjust as needed */
     left: 0;
     width: 100%;
     height: 2px; /* Adjust underline thickness */
     background-color: #000000; /* Set underline color */
     transform: scaleX(0);
     transform-origin: bottom right;
     transition: transform 0.3s ease-out; /* Add transition for animation */
   }

   .hover-underline-animation:hover::after {
     transform: scaleX(1);
     transform-origin: bottom left; /* Change origin for sliding effect */
   }