/* HPCARD AGRO INDIA - Public Pages Common Header Repair
   Safe overlay: loaded AFTER ../style.css.
   Does not modify index.html or the master style.css.
*/

.main-header{
  width:100%;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
  display:block;
  padding:0;
}

.main-header .top-bar{
  background:#08712e !important;
  color:#fff !important;
  padding:8px 4% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:15px !important;
  font-size:14px !important;
}

.main-header .header-main{
  max-width:1400px;
  margin:0 auto;
  padding:10px 20px;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  min-height:110px;
}

.main-header .header-main .logo{
  flex:0 0 260px;
  min-width:220px;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}

.main-header .header-main .logo-mark{font-size:40px !important;line-height:1;}
.main-header .header-main .logo-name{font-size:34px !important;font-weight:800 !important;color:#0757a5 !important;line-height:1 !important;}
.main-header .header-main .logo-name span{color:#e3222b !important;}
.main-header .header-main .company-name{font-size:14px !important;font-weight:700 !important;color:#087a32 !important;margin-top:4px;}
.main-header .header-main .tagline{font-size:11px !important;color:#666 !important;margin-top:2px;}

.main-header .header-offer-slider{
  position:relative !important;
  flex:1 1 680px !important;
  width:auto !important;
  max-width:760px !important;
  height:92px !important;
  overflow:hidden !important;
  border-radius:6px !important;
  background:#f7faf7 !important;
}

.main-header .header-offer-slide{
  display:none !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
}

.main-header .header-offer-slide.active{display:block !important;}
.main-header .header-offer-slide img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

.main-header .header-offer-dots{
  position:absolute !important;
  left:50% !important;
  bottom:5px !important;
  transform:translateX(-50%) !important;
  display:flex !important;
  gap:5px !important;
  z-index:3 !important;
}
.main-header .header-offer-dot{
  width:7px !important;
  height:7px !important;
  border-radius:50% !important;
  background:#fff !important;
  border:1px solid #08712e !important;
  display:block !important;
}
.main-header .header-offer-dot.active{background:#08712e !important;}

.main-header .unified-login-panel{
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
}
.main-header .unified-login-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  white-space:nowrap !important;
  text-decoration:none !important;
  border:none !important;
  border-radius:5px !important;
  padding:10px 15px !important;
  background:#08712e !important;
  color:#fff !important;
  font-size:13px !important;
  font-weight:600 !important;
}

.main-header + .navigation,
.main-header nav,
header.main-header + nav{
  background:#005a2b !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  flex-wrap:wrap !important;
}
.main-header + .navigation a,
.main-header nav a,
header.main-header + nav a{
  color:#fff !important;
  text-decoration:none !important;
  padding:13px 12px !important;
  font-size:14px !important;
  font-weight:600 !important;
}
.main-header + .navigation a:hover,
.main-header + .navigation .active,
.main-header nav a:hover,
header.main-header + nav a:hover{
  background:#08712e !important;
  color:#fff !important;
}

@media (max-width:900px){
  .main-header .header-main{flex-wrap:wrap !important;justify-content:center !important;text-align:center !important;padding:12px 15px !important;}
  .main-header .header-main .logo{flex:1 1 100% !important;justify-content:center !important;}
  .main-header .header-offer-slider{flex:1 1 100% !important;max-width:100% !important;}
  .main-header .unified-login-panel{flex:1 1 100% !important;justify-content:center !important;}
}

@media (max-width:600px){
  .main-header .top-bar{flex-direction:column !important;text-align:center !important;gap:4px !important;}
  .main-header .header-offer-slider{height:72px !important;}
  .main-header + .navigation a,
  .main-header nav a,
  header.main-header + nav a{width:50% !important;text-align:center !important;padding:10px 8px !important;font-size:13px !important;box-sizing:border-box !important;}
}
