/*
Theme Name: ApnaChoice
Author: Your Name
Description: Ecommerce WordPress Theme with Bootstrap 5
Version: 1.0
Text Domain: apnachoice
*/

:root{
  --ac-primary:#1E90FF; /* blue */
  --ac-accent:#FF6F00;  /* orange */
  --ac-text:#212529;    /* dark */
}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}
.topbar{background:#f6f7fb; font-size:.9rem}
.badge-pill{border-radius:50rem}
.topbar a{font-weight: bold;}

/* search */
.search-wrap{max-width:760px}
.search-select {min-width: 150px;	border: 2px solid #f6f7fb;border-radius: 0;}
.search-select.dropdown-toggle:hover {
	border: transparent;
	color: #1e90ff;
}
.shadow-soft {box-shadow: 0 8px 30px rgba(2,18,46,.06);gap: 12px;}

/* icon buttons */
.icon-btn{position:relative; width:44px; height:44px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; border:1px solid #e9ecef; background:#fff; transition:.2s}
.icon-btn:hover{border-color:#ced4da; transform:translateY(-1px)}
.icon-badge{position:absolute; top:-6px; right:-6px;}

/* navbar */
.nav-sticky{position:sticky; top:0; z-index:9; box-shadow:0 1px 0 rgba(0,0,0,.05)}
.navbar .nav-link{font-weight:600}
.btn-deals{background:linear-gradient(90deg, var(--ac-accent), #ff914d); color:#fff}

/* mega menu */
.dropdown-mega{position:static}
.dropdown-menu-mega{left:0; right:0; padding:1.25rem 1.5rem; border-top:3px solid var(--ac-primary)}
@media (min-width: 992px){
  .dropdown-mega:hover > .dropdown-menu{display:block}
}

/* brand mark */
.logo-mark{display:inline-flex; gap:.5rem; align-items:center; font-weight:800; text-decoration:none; color:var(--ac-text)}
.logo-bag{width:34px; height:34px; border-radius:10px; background:var(--ac-primary); position:relative}
.logo-bag:after{content:""; position:absolute; inset:8px; border-bottom:4px solid #ff4d3d; border-right:4px solid #ff4d3d; transform:rotate(45deg)}
.logo-text{font-size:1.4rem}
.logo-text .choice{color:var(--ac-accent)}

/* utilities */
.shadow-soft{box-shadow:0 8px 30px rgba(2,18,46,.06)}

.navbar {
	flex: 1;
	background: transparent !important;
	padding: 0;
	min-height: 76px;
}
.menu {
	list-style: none;
	display: flex;
	gap: 3px;
	margin: 0;
	padding: 0;
}
.menu li {
  position: relative;
}
.menu a {
	text-decoration: none;
	color: #fff;
	padding: 10px;
	display: block;
	font-weight: 700;
	text-transform: uppercase;
}
.menu a:hover {
  background: #333;
  border-radius: 5px;
}

.nav-sticky{background: #1E90FF;}

/* Mega Menu */
.has-mega:hover .mega-menu {
  display: flex;
}
.mega-menu {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  width: 600px;
  background: #fff;
  color: #000;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  justify-content: start;
}
.mega-column {
  flex: 1;
  padding: 10px;
}
.mega-column h4 {
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: bold;
}
.mega-column a {
  display: block;
  margin-bottom: 6px;
  color: #333;
  text-decoration: none;
  text-transform: capitalize;
}
.mega-column a:hover {
  color: #0073e6;
}

/* Responsive */
.menu-toggle {
  display: none;
  font-size: 24px;
  cursor: pointer;
}
@media (max-width: 768px) {
  .menu {
    display: none;
    flex-direction: column;
    background: #111;
    position: absolute;
    top: 60px;
    right: 0;
    width: 250px;
    padding: 20px;
  }
  .menu li {
    margin-bottom: 10px;
  }
  .menu.show {
    display: flex;
  }
  .mega-menu {
    position: static;
    flex-direction: column;
    width: 100%;
    box-shadow: none;
    padding: 10px;
  }
  .menu-toggle {
    display: block;
  }
}

/* -----------------------------------------------------
Footer css
===================================================== */
footer h5, footer h4 {
  color: #fff;
}
footer a:hover {
  color: var(--ac-primary);
}
footer .bi {
  transition: 0.2s;
}
footer .bi:hover {
  color: var(--ac-accent);
}


/* Responsive bootstrup 4.6
============================================*/

/*Extra large devices (large desktops, 1200px and up)
=================================================================*/
@media (max-width: 1920px) {
	
}

@media (max-width: 1600px) {
	
}


@media (max-width: 1300px) {
	.stellarnav > ul > li > a {font-size: 16px;}
}
@media (max-width: 1230px) {
	.vp-header {padding: 0 6px;}
	#main-nav.stellarnav {	display: none;}
	.rightbar {min-width: 79%;}
	.head-sidenav .sidenav {width: 50% !important;}
}

@media (max-width: 1024px){
}
@media (max-width: 768px){
	.head-sidenav .sidenav {width: 100% !important;} 
}

@media (max-width: 675px){
	.rightbar {min-width: 12%;}
	.contactbar {display: none;}
	
}
/*Extra small devices (portrait phones, less than 576px)
=================================================================*/
@media (max-width: 575.98px) {
	 
}
@media (max-width: 400px) {
}