/* ========================= */
/* Navbar Wrap */
/* ========================= */

.navbar-wrap{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  z-index:30;
	height:95px;
}



/* ========================= */
/* Navbar */
/* ========================= */


.navbar{
  position: fixed;
	touch-action:none;
  top: 0;
  left: 0;
  right: 0;
  height: calc(55px + env(safe-area-inset-top));
  padding: env(safe-area-inset-top) 16px 12px;

  display: flex;
  align-items: center;
  justify-content: space-between; /* ← 重要 */

	background: #f0f0f0;
	z-index: 10;
}


/* ========================= */
/* Left */
/* ========================= */

.navbar-left{
  display: flex;
  align-items: center;
	z-index: 30;
}

.nav-back{
  width: 40px;
  height: 40px;
	padding: 0 2px 0 0;

  display: flex;
  align-items: center;
  justify-content: center;

  border: none;
  border-radius: 50%;

  background: #f9f9f9;
	color: #000;
	
	border:1.5px solid #FFFFFF;
  box-shadow:0px 2px 6px rgba(0,0,0,0.10);
}



/* ========================= */
/* Center（スペーサー） */
/* ========================= */

.navbar-center{
  flex: 1;
}



/* ========================= */
/* Right（丸いグループ） */
/* ========================= */

.navbar-right{
  display: flex;
  align-items: center;
  gap: 0px 8px;

  padding: 0px 8px;

  border-radius: 24px;
  background: #f9f9f9;
	
	border:1.5px solid #FFFFFF;
  box-shadow:0px 2px 6px rgba(0,0,0,0.10);
	z-index: 30;
}



/* ========================= */
/* Icon */
/* ========================= */

.nav-icon{
  width: 40px;
  height: 40px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: none;
  background: transparent;
	color: #000;
  border-radius: 50%;
}

.upload svg{
  padding: 0 0 1.5px;
}