body
		{
    font-family: Arial;
    background-color:whitesmoke;
 		color:black;
 		font-size:12pt;
 		margin:0px;
    padding:0px;
		}

a 
 {
  text-decoration:none;
 }

/* BODY CONTAINER */

	.body-container
	 	{
		border:green 0px solid;
	 	}

		
		
		
/************************** END OF BODY GLOBAL **********************/




/***************************** HEADER ********************************/	 		

/* HEADER */

	.header
		{
		z-index: 9999 !important;
		position:fixed;
 		top:0px;
 		left:0px;
		 right:0px;
		 background:RGB(255,255,255,0.95);
		border:RED 0px solid;
 		border-bottom: 1px #A4C381 solid;
 		border-top:black 0px solid;
 		border-left:0px;
 		border-right:0px;
		 border-bottom-left-radius:5px;
		 border-bottom-right-radius:5px;
 		height:75px;
 		box-shadow: 0px 0px 0px whitesmoke;
 		}

 	
/* LOGO */

	.logo
		{
		position:absolute;
		top:10px;
		left:10px;
		height:auto;
 		width:150px;
    padding-bottom:40px;
		}

/* MENU */

	.menu
		{
		position: absolute;
		right:95px;
		padding-top:20px;
		} 	
		
	a.menu-nav:link
		{
		color:white;
		text-decoration:none;
		font-family: 'Roboto', sans-serif;
		font-size:20px;
		font-stretch:condensed;
    font-weight: 400;
		}
 a.menu-nav:visited{color:white;}
 a.menu-nav:hover{color:white;}


.link-container
	{
	    border:solid white 0px;
	    background-color:RGBA(220,230,255,0.95);
	    border-radius:10px;
	}

	
	/******** Drop Down Menu ********/
/* Dropdown Button */
.dropbtn 
   {
    position:fixed;
    right:10px;
    width:30px;
    height:30px;
   }
   

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: fixed;
  left:0px;
  padding-top:5px;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: fixed;
  top:75px;
  background-color:#8BC34A ;
  border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
  width: 100%;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}


.login_link_menu
  {
    background:green;
    border: solid 1px olive;
    margin:10px;
    border-radius:10px;
  }

.signup_link_menu
 {
   background:#2c3e50;
    border: solid 1px green;
    margin:10px;
    border-radius:10px;
 }

/****End of Dropdown Menu******/
	

/***************************** END OF HEADER **************************/


 
 .apply-finance
 {
   height:50px;
   width:250px;
   background-color:teal;
   border: solid 1px orange;
   border-radius:10px;
   color:white;
 }
 
 .car-info-contact
 {
   border: solid 1px orange;
   height: 60px;
   width:180px;
   margin:0px;
   padding-top:10px;
   background-color:teal;
   border-radius:10px;
   color:white;
   font:18px;
 }
 
 /*********** SlideShow ************/
* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
  max-width: 400px;
  margin: auto;
  background-color: grey;
}

/* Hide the images by default */
.mySlides {
  display:block;
  height:0px;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position:absolute;
  z-index: 9999;
  top: -200%;
  width: auto;
  margin-top: 10px;
  padding: 16px;
  padding-top:10px;
  color: black;
  font-weight: bold;
  font-size: 18px;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot-circle-container
 {
   padding-top:265px;
 }

.dot {
  cursor: pointer;
  height: 10px;
  width: 10px;
  margin: 20px;
  background-color: #bbb;
  padding-top:1px;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}


/*********** Gallery.php **************/
* { box-sizing: border-box; margin: 0; padding: 0; }


/* REMOVED WRAPPER. NOW FULL WIDTH */
.vehicle-list 
   {
  border:1px solid #8BC34A;
  border-radius:18px;
  background-color:white;
  overflow:hidden;
  box-shadow: 2px 4px 8px 0px rgba(0,0,0,0.2);
  width:400px;
  height:auto;
  margin:10px;
  margin-bottom:20px;
  padding:10px;
   }
  

/* FILTER BAR - NOW STANDALONE */
.filter-inside
  {
    padding: 15px;
    padding-top: 25px;
    border-bottom: 1px solid #ddd; 
    background: #B0D081;
    border: solid opx;
    border-bottom:solid 1px #8BC34A;
    border-bottom-left-radius:10px;
		border-bottom-right-radius:10px;
  }

  
.filter-row { display: flex; gap: 10px; margin-bottom: 8px; }
.filter-inside input,.filter-inside select,.filter-inside button { padding: 12px; border: 1px solid #ddd; border-radius: 8px; width: 100%; font-size: 16px; }
.filter-inside button { background: #2c3e50; color: #fff; border: none; font-weight: bold; cursor: pointer; }

.filter-inside
.clear
  { 
  border:solid 1px green;
  border-radius:15px;
  width:100px;
  text-align: center;
  display: block;
  margin-top: 8px;
  color: green;
  text-decoration: none; 
  font-size: 14px; 
  }

.results-info { text-align: center; padding: 12px; color: #666; font-size: 14px; background: #fff; border-bottom: 1px solid #eee; }


.vehicle-item
  { 
    background: #fff;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee; 
  } /* Added margin and bg */

.vehicle-item-img
 {
   width: 100%; 
   height: 200px; 
   object-fit: cover;
   object-position:center;
   border-top-left-radius:18px;
   border-top-right-radius:18px;
   display: block; 
 }

.vehicle-details { padding: 15px; }

.vehicle-model-font { font-size: 20px; font-weight: bold; margin-bottom: 10px; }
.vehicle-details2 { font-size: 15px; color: #444; line-height: 1.8; }
.vehicle-details2 img { width: 18px; height: 18px; vertical-align: middle; margin-right: 6px; }

.vehicle-price 
  {
    background: #2c3e50;
    color: #fff;
    padding: 14px;
    font-size: 22px;
    font-weight: bold;
    text-align: center;
  }


.vehicle-price-seller
  {
    background: #2c3e50;
    color: #fff;
    padding:10px;
    font-size: 22px;
    font-weight: bold;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    text-align: center;
  }


.vehicle-details-price
  {
    background: #2c3e50;
    color: #fff;
    padding:14px;
    font-size: 22px;
    font-weight: bold;
    width:100vw;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    text-align: center;
  }



.ad-banner { text-align: center; padding: 20px; margin: 10px 0; border: 2px dashed #ccc; background: #fff; }

.pagination-block { text-align: center; padding: 15px 10px; display: flex; justify-content: center; flex-wrap: wrap; gap: 5px; background: #fff; }
.pagination-block a,.pagination-block span { padding: 10px 14px; background: #f5f5f5; border-radius: 8px; text-decoration: none; color: #2c3e50; border: 1px solid #ccc; font-weight: bold; }
.pagination-block a.active { background: #2c3e50; color: #fff; border-color: #2c3e50; }
.pagination-block a.disabled { background: #eee; color: #aaa; pointer-events: none; }

@media(max-width:600px){
  .filter-row { flex-direction: column; }
}

.clear_all
 {
  border:solid 1px green;
 }


/********** Featured Listing Slideshow ************/
.slideshow-wrapper {
  position: relative;
  max-width: 1200px;
  margin: auto;
}

.slideshow {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 16px;
}
.slideshow::-webkit-scrollbar { display: none; }

.slide {
  flex: 0 0 100%; /* 1 at a time mobile */
  scroll-snap-align: start;
  background: #0A192F;
  border-radius: 12px;
  overflow: hidden;
  color: white;
}

@media (min-width: 768px) {
  .slide { flex: 0 0 33.33%; } /* 3 on desktop */
}

.slide img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.slide h3 { padding: 12px; margin: 0; }

/* Arrows */
.arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #3068E6; /* your blue */
  color: white;
  border: none;
  padding: 12px;
  cursor: pointer;
  border-radius: 50%;
  font-size: 20px;
  z-index: 10;
  transition: 0.3s;
}
.arrow:hover { background: #0A192F; }

.arrow.prev { left: 10px; }
.arrow.next { right: 10px; }

/********* End Of Gallery.php **********************/




.vehicle_gallery
 {
  border:1px solid #8BC34A;
  border-radius:30px;
  background-color:white;
  box-shadow: 2px 4px 8px 0px rgba(0,0,0,0.2);
  width:400px;
  height:50px;
  margin:10px;
  padding:10px;
 }

 
 .featured_container
   {
   background:#FFF6DD;
   display:flex;
   gap:5px;
   padding-left:20px;
   padding-top:20px;
   height:150px;
   }

.featured-1
 {
  border:1px solid #8BC34A;
  border-radius:5px;
  background-color:white;
  width:120px;
  height:110px;
  margin:2px;
  padding:2px;
 }

.featured-2
 {
  border:1px solid #8BC34A;
  border-radius:5px;
  background-color:white;
  width:120px;
  height:110px;
  margin:2px;
  padding:2px;
 }

.featured-3
 {
  border:1px solid #8BC34A;
  border-radius:5px;
  background-color:white;
  width:120px;
  height:110px;
  margin:2px;
  padding:2px;
 }

.vehicle-price
  {
    border: solid 1px #2c3e50;
    background-color:#2c3e50;
    border-bottom-left-radius:20px;
    border-bottom-right-radius:20px;
    width:380px;
    height:60px;
    color:white;
    font-size: 35px;
  }

.nav_container
 {
   padding-left:10px;
 }


.dashboard_container .tab-btn {
  background: #f5f5f5;
  border: 2px solid #ddd;
  padding: 5px 10px;
  border-radius: 10px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
  transition: all 0.2s ease;
  margin: 5px;
}

.dashboard_container .tab-btn:hover {
  background: #e9e9e9;
  border-color: #8BC34A;
}

/* ACTIVE STATE */
.dashboard_container .tab-btn.active {
  background: #dc3545;
  color: #fff;
  border-color: #dc3545;
  box-shadow: 0 3px 8px rgba(220,53,69,0.3);
}

.dashboard_container .tab-btn.active img {
  filter: brightness(0) invert(1); /* makes icon white */
}



.vehicle-details
   {
     color:black;
   }
   
   .vehicle_details_container
     {
       border:solid 0px silver;
       border-radius:10px;
       background:white;
       width:414px;
       margin:0px;
       padding:0px;
       padding-bottom:50px;
       box-shadow: 0px 0px 0px 0px orange;
     }
   
   
  .vehicle-model-font
    {
      font-size:20px;
    }
    
 .call_whatsapp_container
    {
    background:RGBa(139,195,74,0.60);
    border: solid 0px #2c3e50;
    position:fixed;
    bottom:0px;
    display:flex;
    padding:20px;
    width:100vw!important;
    gap:80px;
    }
    
  .call
   {
     border: solid 1px red;
     background: red;
     border-radius:10px;
     color:white;
     width: 150px;
     height: 50px;
     text-align: center;
   }
   
    .whatsapp
   {
     border: solid 1px green;
     background:green;
     border-radius:10px;
     color:white;
     width: 150px;
     height: 50px;
     text-align: center;
   }
   
   /* Lime inside vehicle specification */
  hr {
  border: none;
  height: 1px;
  background:#EBEBEB;
  margin: 10px 0;
     }
     
  .vehicle_images
   {
     display:block;
   }
   
   .spefication_container
     {
       display:flex;
       flex-wrap: wrap;
       padding-left:30px;
       gap:16px;
     }
 
   .item
     {
       flex: 0 0 50%;
       font-size: 15px;
     }
     
    .item_2
     {
       color:grey;
       font-size:15px;
     }
 .car_price_spec
   {
     padding-left:40px;
     background:#F3FFE3;
     color:black;
     font-size: 18px;
   }





.leads-wrapper{ position:relative; display:inline-block; }
.leads-submenu{
  position:absolute;
  top:100%;
  left:0;
  background:#fff;
  border:1px solid #ddd;
  border-radius:8px;
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
  z-index:100;
  min-width:200px;
  overflow:hidden;
  margin-top:5px;
}
.leads-submenu button{
  display:block;
  width:100%;
  text-align:left;
  padding:12px 15px;
  border:none;
  background:#fff;
  cursor:pointer;
  border-bottom:1px solid #f0f0f0;
}
.leads-submenu button:hover{ background:#f5f5f5; color:#000; }





 
 /********** End Of SlideShow ******/

/* PRIVACY POLICY */

.privacy-policy-container
	{
	padding-left:10px;
	border:solid 10px color #F7FDFF;
	background:#F7FDFF;
	border-radius:2px;
	}

.privacy-policy
	{
	padding-top:60px;
	}


.terms-container
	{
	padding:10px;
	border:solid 10px color #F7FDFF;
	background:#F7FDFF;
	border-radius:2px;
	}

.terms
	{
	padding:5px;
	padding-top:60px;
	}


.cars-preview-container
  {
    background-color: whitesmoke;
    border-radius: 20px;
  }

.car-info-text-1
 {
   padding-left:70px;
 }
 
.car-info-text-2
 {
   padding-left:50px;
 }
  
.car-info-text-3
 {
   padding-left:40px;
 }
 
 
.car-info-text-4
 {
   padding-left:15px;
 }
 
 
.car-info-text-5
 {
   padding-left:80px;
 }


.car-info-text-6
 {
   padding-left:25px;
 }
 
 
/* About */

	.about-text
		{
			text-align:center;
			font-size:14px;
		}


 .profile_tab
   {
    padding:50px;
   }


/*Vehicle Sell */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 20px;
}


.ad-banner {
   grid-column: 1 / -1; /* makes it full width */
    background: #f0f0f0;
  border:solid 1px silver;
    padding: 30px;
    text-align: center;
    border-radius: 8px;
    margin: 20px 0;
}

.ad-banner img {
    max-width: 100%;
    height: auto;
}



.form_input
 {
   width:350px;
   height:50px;
   border: solid silver 1px;
   border-radius:7px;
 }

.image_upload_area
{
  background:#FFF9EF;
  width:350px;
  height:65px;
  border:solid silver 1px;
  border-radius:5px;
}

.image_submit
 {
   border: solid 0px orangered;
   background:orange;
   color:white;
   width:200px;
   border-radius:30px;
   height:50px;
 }


.form_background
 {
   background:#f1f8f1;
   width:100vw;
 }

.form_container
  {
    border: solid 1px silver;
    background:#fff;
    width:100%;
    height:1300px;
    border-radius:10px;
    padding-top:25px;
  }

.upload_text
  {
    color:orangered;
    font-size:11px;
  }

.textarea_input
  {
    border:solid 1px silver;
    border-radius:10px;
    width:350px;
    height:100px;
  }

.finance_application
 {
   background:#D3ECDE;
   color: green;
   border: solid 1px green;
   border-radius:7px;
   text-align:center;
   width:385px;
   height:50px;
   margin:20px;
 }

.login_form
 {
    border: solid 0px silver;
    background:#ddd;
    width:380px;
    height:350px;
    border-radius:15px;
    padding-top:50px;
 }

.login_form_link
 {
   color:grey;
 }

.login_form_container
 {
  padding-top:100px;
  margin:20px;
  padding-bottom:100px;
 }



.login_form_input
 {
   margin:15px;
   width:350px;
   height:40px;
   border: solid silver 1px;
   border-radius:7px;
 }


.login_button
 {
   border:solid 1px orangered;
   background:orange;
   border-radius:60px;
   color:white;
   width:200px;
   height:50px;
   margin:25px;
   align-content:center;
 }


.finance_submit
 {
  border:solid 1px orangered;
   background:orange;
   border-radius:60px;
   color:white;
   width:200px;
   height:50px;
   margin:25px;
   align-content:center;
 }

.finance_container
 {
   border: solid 0px silver;
    background:#EDEDED;
    width:380px;
    height:650px;
    border-radius:15px;
    padding-top:5px;
 }



.signup_form_container
  {
    margin:10px;
    padding-top:50px;
    border-radius:10px;
    background:#ddd;
    width:400px;
    height:600px;
  }


.dashboard_container
 {
   background:#EDEDED;
   padding-top:10px;
   border-top-left-radius:10px;
   margin:0px;
 }

.dashboard_nav_container
 {
   display:flex;
   background:#EDEDED;
   gap:50px;
 }


.dashboard_nav1
 {
   background:orange;
   color:white;
   border:solid 1px white;
   padding:5px;
   width:200px;
   border-radius:5px;
 }


.dashboard_nav2
 {
   background:#FFF0C3;
   color:white;
   border:solid 1px white;
   padding:5px;
   width:250px;
   border-radius:5px;
 }


.content {
  display: none;       /* hidden by default */
  height: calc(100dvh - 160px); /* full screen minus header. Adjust 160px */
  width: 100%;
}

.content.active {
  display: block;      /* show when active */
}

.content iframe {
  width: 100%;
  height: 100%;
  border: none;
  border-radius: 0px;
}




/*********************************** FOOTER ***************************/

	.footer
		{
		position:static;
    bottom:0px;
    z-index:999;
 		padding-top:0px;
 		background: linear-gradient(95deg, lightgreen 10%, #8BC34A 100%);
 		border:orange 0px solid;
 		border-bottom:orange 0px solid;
 		border-top:green 0px solid;
 		border-left:0px;
 		border-right:0px;
 		height:200px;
 		width:100vw;
		}
		
/* FOOTER MENU */
 
	.footer-menu 
		{
    padding-top: 10px;
		border: solid 1px 0;
    background: 0;
    padding-bottom: 10px;
    border-bottom-left-radius:30px;
    border-bottom-right-radius:30px;
		}
		
		
		.admin_center_link
     {
       color:#83C339;
       font-style:bold;
       font-size:20px;
     }

/****** PRIVACY POLICY *-***********/
.privacy
  {
    border: solid 1px silver;
    border-radius: 5px;
    background: white;
    margin: 5px;
    padding: 10px;
  }


.ah-popup-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.6);
  display: none; align-items: center; justify-content: center;
  z-index: 99999; padding: 16px;
}
.ah-popup-overlay.show { display: flex; }
.ah-popup {
  background: #fff; max-width: 480px; width: 100%;
  border-radius: 12px; padding: 24px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.2);
  animation: ahSlide 0.3s ease;
}
.ah-popup h3 { margin: 0 0 10px; font-size: 18px; }
.ah-popup p { font-size: 14px; line-height: 1.6; color: #4b5563; }
.ah-popup a { color: #111827; text-decoration: underline; }
.ah-popup-actions { display: flex; gap: 10px; margin-top: 18px; }
.ah-btn-primary { flex: 1; background: #111827; color: #fff; border: 0; padding: 12px; border-radius: 8px; cursor: pointer; font-weight: 600; }
.ah-btn-secondary { flex: 1; background: #f3f4f6; color: #111827; border: 0; padding: 12px; border-radius: 8px; cursor: pointer; }
@keyframes ahSlide { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

 p{margin-bottom:16px;}

/****** END OF PRIVACY POLICY ******/

.terms
 {
    border: solid 1px silver;
    border-radius: 5px;
    background: white;
    margin: 5px;
    padding: 10px;
 
 }

		
/* FOOTER MENU LINKS COLOR */

a.menu_links 
  {
    color:green;
    font-weight: 500px;
    font-style: bold;
  }

a.menu_links:visited
  {
    color:green;
  }
		
a.menu_links:hover
	{
 	 color:green;
	}


.social_icons
  {
    width: 50px;
    height: 50px;
    border-radius: 30px;
    padding: 5px;
  }


/* COPYRIGHT TEXT */

	.copyright-text
		{
		color:green;
		font-size:10px;
		padding:10px;
		}		

.dashboard_copyright_text
   {
   font-size:11px;
   color:grey;
  text-align:center;
   }


/******************* END of FOOTER ****************************************************/