/* ================== TOP BAR ================== */
.top-bar{
  background:#083a6b;
  font-size:14px;
}

.top-bar-flex{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.top-bar img{
  height:85px;
}

.top-bar a,
.top-bar span{
  color:#fff;
  text-decoration:none;
}

.top-bar .btn{
  font-size:13px;
  padding:4px 14px;
}

/* ================== NAVBAR ================== */
.navbar{
  background:#e1375f;
  padding:10px 0;
}

.navbar-nav{
  gap:4px;
}

.navbar-nav .nav-link{
  color:#fff !important;
  font-weight:600;
  padding:10px 14px;
  transition:0.3s;
}

.navbar-nav .nav-link:hover{
  background:rgba(255,255,255,0.15);
  border-radius:4px;
}

/* Dropdown */
.dropdown-menu{
  border-radius:0;
  border:none;
}

.dropdown-item{
  font-weight:500;
}

/* ================== MOBILE ICONS ================== */
.mobile-icons{
  display:flex;
  gap:8px;
}

.mobile-icons .icon-btn{
  width:38px;
  height:38px;
  border-radius:50%;
  background:rgba(255,255,255,0.15);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:17px;
  transition:.3s;
}

.mobile-icons .icon-btn:hover{
  background:rgba(255,255,255,0.3);
  transform:scale(1.1);
}

/* ================== RESPONSIVE ================== */

/* Tablet */
@media(max-width:992px){
  .top-bar-flex{
    flex-wrap:wrap;
    gap:10px;
  }
}

/* Mobile */
@media(max-width:768px){

  /* Top Bar */
  .top-bar{
    padding:6px 10px;
  }

  .top-bar img{
    height:36px;
  }

  .top-bar .d-flex.gap-2{
    display:none !important;
  }

  .top-bar span{
    font-size:12px;
  }

  /* Navbar */
  .navbar{
    padding:6px 10px;
  }

  .navbar-collapse{
    background:#e1375f;
  }

  .navbar-nav .nav-link{
    padding:12px 15px;
    border-bottom:1px solid rgba(255,255,255,0.3);
    font-size:14px;
  }

  /* Mobile Icons */
  .mobile-icons .icon-btn{
    width:34px;
    height:34px;
    font-size:15px;
  }
}