/* Large (LG) - Small Laptops */
@media (max-width: 1200px) {
	.container{
		width: 90%;
	}
	.searchBoxInput{
		width: 110px;
		font-size: 12px;
	}
	.navListItem{
		padding: 0 12px;
	}
	.navListItem p{
		font-size: 12px;
	}
	.logoBox{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.logoBox img{
		width: 130px;
	}
	.filesWrapTopTitle{
		font-size: 20px;
	}
	.filesWrapTopBtn{
		padding: 8px 12px;
	}
	.filesWrapTopBtn p{
		font-size: 12px;
	}
	.filesWrapTopBtn img{
		transform: scale(0.8);
	}
	.fileWrap{
		flex: 1 1 calc(33.33% - 16px);
		max-width: calc(33.33% - 11px);
	}
	.notesWrapper{
		flex: 1 1 calc(50% - 16px);
	}
	.notesWrapperBookmark{
		flex: 1 1 calc(33.33% - 16px);
		max-width: calc(33.33% - 11px);
	}
	.innerFileDeleteBtn{
		padding: 8px 12px;
		width: 100%;
		justify-content: center;
	}
	.innerFileDeleteBtn p{
		font-size: 12px;
	}
	.innerFileDeleteBtn img{
		transform: scale(0.8);
	}
	.innerFileTopLeft p{
		font-size: 22px;
	}
}


/* Medium (MD) - Tablets */
@media	(max-width: 992px) {
	.container{
		width: 90%;
	}
	.navList {
		position: fixed;
		width: 60%;
		height: 100vh;
		background-color: var(--grey-color);
		top: 0;
		left: -100%;
		z-index: 1000;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		transition: left 0.3s ease-in-out;
		padding: 30px 40px;
	}

	.navList.open {
		left: 0;
	}

	.overlay {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background: rgba(0, 0, 0, 0.111); 
		backdrop-filter: blur(5px);
		z-index: 900; 
		display: none;
	}

	body.no-scroll {
		overflow: hidden;
	}
	.menuBtnWrap{
		border: none;
		width: 44px;
		height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: var(--grey-color);
		border-radius: 10px;
	}
	.searchBoxInput{
		display: none;
	}
	.searchBoxInputIcon{
		display: none;
	}
	.innerFileTop{
		flex-direction: column;
		align-items: start;
	}
	.innerFileTopRight{
		flex-direction: column;
		align-items: start;
		row-gap: 10px;
		margin-top: 12px;
		width: 100%;
	}
	.searchBox{
		padding: 0 7px;
	}
	.notesWrapper{
		flex: 1 1 calc(50% - 16px);
	}
	.createFileMain{
		width: 80%;
	}
	.createFileTop p{
		font-size: 18px;
	}
	.innerFileWrapBody{
		height: unset; /* Reset the height */
		width: 100%;
		top: 20px;
		left: 0;
		transform: translate(0,0);
	}
	.fileWrap{
		flex: 1 1 calc(50% - 16px);
		max-width: calc(50% - 8px);
	}
	.notesWrapperBookmark{
		flex: 1 1 calc(50% - 16px);
		max-width: calc(50% - 8px);
	}
	.innerFileWrapBodyInner{
		height: unset; /* Reset the height */
		position: relative;
		width: 100%;
		top: 10px;
		left: 0;
		transform: translate(0,0);
		margin-bottom: 28px;
	}
}

/* Extra Small (XS) - Mobile Devices */

@media	(max-width: 768px) {
	.innerFileWrapBodyInner img{
		transform: scale(0.8);
	}
	.mainWrapSubTitle{
		font-size: 14px;
	}
	.bookmarkTitle{
		margin-top: 16px;
	}
	.mainWrapText{
		font-size: 10px;
		text-align: center;
	}
	.container{
		width: 90%;
	}
	.filesWrapTopTitle{
		font-size: 20px;
	}
	.filesWrapTopBtn{
		padding: 8px 12px;
	}
	.filesWrapTopBtn p{
		font-size: 10px;
	}
	.filesWrapTopBtn img{
		transform: scale(0.8);
	}
	.navList{
		padding: 30px 20px;
	}
	.container{
		padding: 0 10px;
	}
	.fileSubTitle{
		font-size: 16px;
	}
	.fileSubPar{
		font-size: 14px;
	}
	.fileSubText{
		font-size: 10px;
	}
	.innerFileTopLeft p{
		font-size: 20px;
	}
	.innerFileDeleteBtn{
		padding: 6px 10px;
	}
	.innerFileDeleteBtn p{
		font-size: 10px;
	}
	.innerFileWrap{
		flex-direction: column;
		row-gap: 12px;
	}
	.innerFileWrapAdmins{
		width: 100%;
	}
	.innerFileWrapBody{
		width: 100%;
	}
	.innerFileTop{
		margin-top: 24px;
	}
	.innerFileTopLeft p{
		font-size: 18px;
	}
	.notesWrapper img{
		transform: scale(0.8);
	}
	.notesWrapperTitle{
		font-size: 16px;
	}
	.innerFileWrapAdminsWrapBtn{
		padding: 6px 12px;
		width: 100%;
	}
	.innerFileWrapAdminsWrapBtn p{
		font-size: 12px;
	}
	.innerFileWrapAdminsWrapBtn img{
		transform: scale(0.8);
	}
	.innerFileWrapAdminsWrap{
		padding: 8px;
		margin-bottom: 12px;
	}
	.tagFileInner{
		font-size: 10px;
		padding: 2px 6px;
	}
	.innerFileWrap{
		column-gap: 12px;
	}
	.innerFileWrapAdminsWrapTitle{
		font-size: 16px;
		margin-bottom: 10px;
	}
	.innerFileWrapAdminsWrapListItem{
		font-size: 10px;
	}
	.innerFileWrapAdminsTags{
		padding: 8px;
	}
	.configBtn{
		padding: 6px 12px;
		height: 26px;
		column-gap: 4px;
	}
	.configBtn p{
		font-size: 12px;
	}
	.configBtn img{
		transform: scale(0.8);
	}
	.innerFileWrapAdminsWrapList{
		margin-bottom: 8px;
	}
	.innerFileWrapAdminsWrapBtn{
		border-width: 0.5px;
		width: 100%;
		justify-content: center;
	}
	.tagsContainerAdmins{
		margin-bottom: 10px;
	}
	.fileNotesWrapBodyBtn{
		margin-top: 18px;
		padding: 6px 8px;
		width: 100%;
		justify-content: center;
		margin-bottom: 12px;
	}
	.fileNotesWrapBodyBtn p{
		font-size: 12px;
	}
	.fileNotesWrapBodyBtn img{
		transform: scale(0.8);
	}
	.createFileTop p{
		font-size: 16px;
	}
	.createFileSelect, .createFileInput{
		font-size: 12px
	}

	.createFileBtn{
		height: 38px;
	}
	.createFileTop p{
		font-size: 18px;
	}
	.createFileTop{
		margin: 24px 0;
		column-gap: 2px;
	}
	.createFileTitle{
		font-size: 15px;
		margin-bottom: 16px;
	}
	.adminTag{
		font-size: 10px;
		padding: 4px 8px;
		display: flex;
		align-items: center;
		column-gap: 2px;
	}
	.adminTag button{
		display: flex;
		align-items: center;
		justify-content: center;
		transform: scale(0.6);
	}
	.createFileLabel{
		font-size: 12px;
	}
	.innerFileWrapAdminsBtnBox{
		display: flex;
		flex-direction: column;
		row-gap: 12px;
		margin-bottom: 12px;
	}
	.innerFileDeleteBtnMobile{
		padding: 12px 16px;
		display: flex;
		flex-direction: row;
		align-items: center;
		column-gap: 8px;
		background-color: transparent;
		cursor: pointer;
		border-radius: 8px;
	}
	.innerFileDeleteBtn{
		column-gap: 4px;
		padding: 6px 12px;
		width: 100%;
	}

	.innerFileDeleteBtnMobile{
		width: 100%;
		padding: 12px 16px;
	}
	.innerFileDeleteBtnMobile p{
		font-size: 12px;
	}
	.innerFileDeleteBtnMobile img{
		transform: scale(0.8);
	}
	.innerFileDeleteBtnMobile:nth-child(1){
		background-color: var(--primary-color);
	}
	.innerFileDeleteBtnMobile:nth-child(1) p{
		color: white;
	}
	.innerFileDeleteBtnMobile:nth-child(2){
		border: 1px solid #FF5151;
		color: #FF5151;
		padding: 11px 16px;
	}
	.innerFileDeleteBtnMobile:nth-child(3){
		border: 1px solid #FF7A00;
		color: #FF7A00;
		padding: 11px 16px;
	}
	.notesWrapper{
		max-width: calc(50% - 8px);
	}
}

@media (max-width: 576px) {
	.createFileTop p{
		font-size: 14px;
	}
	.createNoteInput{
		font-size: 12px;
	}
	.createNoteLabel{
		font-size: 12px;
	}
	.createFileTop{
		margin: 24px 0;
		column-gap: 2px;
	}
	.container{
		width: 95% !important;
	}
	.fileWrap{
		flex: 1 100%;
		max-width: 306px;
	}
	.filesWrapInner{
		justify-content: center;
	}
	.notesWrapperBookmark{
		flex: 1 100%;
		max-width: 306px;
	}
	.bookmarkFileWrap{
		justify-content: center;
	}
	.bookmarkNotesWrap{
		justify-content: center;
	}
	.innerFileDeleteBtn p{
		font-size: 12px;
	}
	.innerFileDeleteBtn img{
		transform: scale(0.8);
	}
	.createFileMain{
		width: 100%;
		padding: 16px;
	}
}





/* Extra Large (XL) - Desktops */
@media (min-width: 1201px) {
	.container{
		width: 1400px;
	}
}