/* ===============================
   NAVIGATION BAR CSS START
================================= */

/* HEADER */
.otpnav_header{
  font-family:Arial, sans-serif;
  width:100%;
  background:#fff;
  display:flex;
  align-items:center;
  padding:10px 20px;
  position:fixed;
  top:0;
  left:0;
  z-index:999;
  box-shadow:0 2px 10px rgba(0,0,0,0.15);
}

/* LOGO */
.otpnav_Logo img{
  height:45px;
}

/* HAMBURGER (hidden in desktop) */
.otpnav_openmenubaar{
  margin-left:auto;
  font-size:30px;
  cursor:pointer;
  display:none;
}

.otpnav_openmenubaar i{
  color:#222;
}

/* NAV MENU (desktop default) */
.otpnav_custom-navbar{
  margin-left:auto;
}

.otpnav_custom-navbar ul{
  list-style:none;
  display:flex;
  gap:20px;
}

.otpnav_custom-navbar ul li{
  position:relative;
}

.otpnav_custom-navbar ul li a{
  text-decoration:none;
  padding:10px 8px;
  color:#111;
  display:block;
  font-size:16px;
}

/* ===============================
   DESKTOP HOVER DROPDOWN WORKING
================================= */

/* First level dropdown */
.otpnav_custom-navbar ul li:hover > ul {
  display: block;
}

/* Second level / right side submenu */
.otpnav_custom-navbar ul li ul li:hover ul {
  display: block;
}

/* Dropdown container (hidden by default) */
.otpnav_custom-navbar ul li ul{
  display:none;
  position:absolute;
  top:100%;
  left:0;
  background:#fff;
  min-width:230px;
  border:1px solid #ddd;
  z-index:200;
}

/* Right side submenu list */
.otpnav_custom-navbar ul li ul li ul{
  display:none;
  position:absolute;
  left:100%;
  top:0px;
  background:#fff;
  min-width:220px;
  border:1px solid #ddd;
}

/* Submenu link style */
.otpnav_custom-navbar ul li ul li a{
  padding:10px;
  border-bottom:1px solid #eee;
}

.otpnav_custom-navbar ul li ul li a:hover{
  background:#f4f4f4;
}


/* ===================================
      MOBILE RESPONSIVE (<=991px)
==================================== */

@media(max-width:991px){

  /* Show menu icon */
  .otpnav_openmenubaar{
    display:block;
  }

  /* Hide desktop nav initially */
  .otpnav_custom-navbar{
    width: 100%;
    position:fixed;
    top:-100%;
    left:0;
    max-height:80vh;
    overflow-y:auto;
    background:#fff;
    padding:20px;
    transition:top 0.4s ease;
    border-bottom:2px solid #ddd;
    width:100%;
  }

  /* Show nav when .show class added */
  #otpnavbar.show{
    top:65px;
  }

  /* Mobile column layout */
  .otpnav_custom-navbar ul{
    flex-direction:column;
    gap:10px;
  }

  /* REMOVE desktop hover in mobile */
  .otpnav_custom-navbar ul li:hover > ul{
    display:none;
  }

  /* Mobile dropdown base positions */
  .otpnav_custom-navbar ul li ul,
  .otpnav_custom-navbar ul li ul li ul{
    position:relative;
    border:none;
    background:#fff;
    left:0;
    top:0;
    display:none;
  }

  /* JS: open dropdown by adding class .open */
  .otpnav_custom-navbar ul li.open > ul{
    display:block;
  }

  .otpnav_custom-navbar ul li ul li.open ul{
    display:block;
  }

  /* Full width clickable */
  .otpnav_custom-navbar ul li > a{
    width:100%;
  }
}

/* ===============================
   NAVIGATION BAR CSS END
================================= */