body{
	direction:rtl;
	text-align:right;
	font-family:"Tahoma","IranSans",sans-serif;
	
}
html body{
	height:100%;

margin:0;}


/* شروع قسمت آیکن های هیدر */
header{
padding:5px 0;
background:gray;
text-align: center;
position: fixed;
top:40px;
left:0;
width:100%;	
height:50px;	
}
.header-menu{
    display: flex;
	
    justify-content: space-around;
    align-items: bottom;
}
/* بخش نمایش علامات موتر و جایداد*/
.header-menu a{
    color: white ;	height:20px;
    text-decoration: none;    font-size: 15px;    display: flex;
    flex-direction: column;  align-items: bottom;   gap: 1px;} 
.header-menu a:hover{
	background-color:#0056b3;
	transform:scale(1.2);
	
}
.header-menu i{
    font-size:14px;
}
.header-menu span {
    font-size: 18px;
	color:white;
}

/* 📱 تغییرات فقط در موبایل */
@media (max-width: 768px) {
    .header-menu a{
        font-size: 12px;    }
    .header-menu i{
        font-size: 14px; /* آیکن کوچک‌تر در موبایل */    }
    .header-menu span{
        font-size: 12px; /* نوشته‌های زیر آیکن کوچک‌تر در موبایل */    }
    .car{
    font-size:14px;
}
}


/* بخش افکت بتن وقتی بالای هر کدام مثل موتر فروشی خانه کرایی کلیک کنیم یک افکت ایجادشود 88*/
.footer-item.active {
    background-color: #007BFF;
    color: white !important;
    font-weight: bold;
    border-radius: 6px;
    padding: 6px 12px;
    transition: background 0.3s ease;
}

.footer-item.active i,
.footer-item.active span {
    color: white !important;
	font-weight: bold;
}




	/*  پایان قسمت */
	
	/* شروع قسمت نوبار*/
	nav{
		height:40px;
		text-align: top;
		background-color:gray;
		width:100%;	
        position:fixed;
        top:0;
        left:0;	
		z-index:1000;
		
		
    	}


	
		
	
		 #logoright{
		position:fixed;
         top:18px;
		 height:10px;
		 width:10px;
		 right:40px;
	  }
	  #lo{
		  height:20px;
		  width:20px;
	  }
	  .name{ position:fixed; top:11px; font-size:12px; right:43%; font-weight: bold !important ; color:pink;}
	 
@media (max-width: 768px) {
	 .name{ position:fixed; top:11px; font-size:10px; right:18%; font-weight: bold !important ; color:pink;}
}
		
		#logoleft{
			
           width:50px;
		   height:40px;
			position:fixed;
			top:1px;
			left:18px;	
        }
		
		@media (max-width: 768px) {
    nav{
        width:100%;
		text-decoration:rtl;
		
    }
	
.navbar-brand img{
           
			position:fixed;
			top:8px;
			left:18px;	
        }
      #logoright{
		position:fixed;
         top:10px;
			right:20px;
	  }

		}
		
		.search-cont {
		
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 90px;
  gap: 7px;
  height:30px;
  background-color:gray;
}



.form, .form1 {
  display: flex;
  align-items: center;
  gap: 8px;
}


#boxsearch  {
  font-size: 14px !important;
  width:250px;
  height:25px;
}
#selecttype{
font-size:12px;
width:100px;
height:25px;	
}


h6{
	font-size:10px;
}

	@media (max-width: 768px) {
.search-cont {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin-top: 90px;
  gap: 2px;
  height:30px;
  background-color:purple;
}

.form, .form1 {
  display: flex;
  align-items: center;
  gap: 2px;
}



#boxsearch  {
  font-size: 10px !important;
  width:120px;
  height:25px;
}



	}


/* پایان قسمت نوبار*/





/*  شروع قسمت فوتر پایین صفحه*/


.footer-footer{background-color:gray !important;padding: 10px 0;text-align: top;
position: fixed;bottom:0;left:0;width: 100%;	height:30px;}

.footer-footer{    display: flex;    justify-content: space-around;   align-items: center;}     

    .footer-footer a {    color: white;    text-decoration: none;
    font-size: 16px!important;
    display: flex;   flex-direction: column;    align-items: bottom;   gap: 5px;}

@media (max-width: 768px) {
   .footer-footer a {    color:white !important;    text-decoration: none;
    font-size: 16px!important;
    display: flex;   flex-direction: column;    align-items: bottom;   gap: 5px;}  
    
    
}

/* پایان قسمت فوتر */

.form-container {
    display: flex;   justify-content: center;    align-items: center;    min-height: 100vh;    padding: 20px;}

	/* تنظیمات برای قرار دادن پنل در وسط 
  پنل ورودی موتر است
 */
        .custom-panel {
            width: 60%;
			height:40%;
            margin-top:5px;
            padding: 1px;
            border: 2px solid #007bff;
            border-radius: 10px;
            background-color: #f8f9fa;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
			
        }
		.wrapper{
			min-height:100vh;
			display:flex;
			flex-direction:column;
			align-items:center;
			justify-content:flex-start;
			padding-bottom:60px;
			margin-top:5px;
		}

        /* تنظیمات عنوان پنل */
        .panel-title {
            font-size: 16px !important;
            font-weight: bold;
            text-align: center;
            margin-bottom: 20px;
            color: #007bff;
        }

.form-label{ font-size:14px !important; }

.panel_1{	width:300px;	height: 400px;	border:5px solid blue;	margin-right:2%;	margin-top:20px;	}


input[type="text"]{		width:100%; 	height:30px; font-size:12px !important; margin:0px}
input[type="password"]{		width:100%; 	height:30px; font-size:12px !important; 	}
input[type="number"]{		width:100%; 	height:30px; font-size:12px !important; padding:0!important;	}
#btnok{	margin-right:40%;}
/*    پایان قسمت ورودی اطلاعات موتر */

input[type="file"]{
	
	transform:scale(0.8);
	transform-origin:left;
	
}
#inputimag{
	margin-top:100px;	
}
   .form-container-ad {
            background: #fff;
			margin-top:300px;
            padding: 30px;
            border-radius: 20px;
            box-shadow: 0 0 10px rgba(0,0,0,0.2);
            width: 100%;
			max-width:100%;
			box-sizing:border-box;
            
        }
		
		@media (max-width: 570px) {
		.form-container-ad select{
			
			width:100%;
			max-width:100%;
			box-sizing:border-box;
			
		}		}

.custom-select {
  position: relative;
  width: 100%;
}
.selected {
  padding: 10px;
  background: #f1f1f1;
  cursor: pointer;
}
.options {
  display: none;
  position: absolute;
  width: 100%;
  background: #fff;
  border: 1px solid #ddd;
  z-index: 999;
}
.options div {
  padding: 10px;
  cursor: pointer;
}
.options div:hover {
  background: #eee;
}



.nav-item.active {
    background-color: #007BFF; 
    color: white;
    font-weight: bold;
}

.main-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }

  .container {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }

  #posts-container {
    flex-grow: 1;
  }

  #load-more-wrapper {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
  }

  #load-more-btn {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 12px 24px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 8px;
    transition: background-color 0.3s ease;
  }

  #load-more-btn:hover {
    background-color: #0056b3;
  }