/* KisanShop header v2 - desktop polish only (overrides header.css, no height/position changes) */
@media (min-width:769px){
  .ks-header{
    box-shadow:inset 0 3px 0 #0f8b45, 0 8px 24px rgba(8,34,22,.07);
  }

  /* search: soft field, green focus ring, solid green search button */
  .ks-header .ks-search-container{
    background:#f3f6f4;
    border:1.5px solid #dbe5df;
    border-radius:12px;
    transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
  }
  .ks-header .ks-search-container:focus-within{
    background:#fff;
    border-color:#0f8b45;
    box-shadow:0 0 0 4px rgba(15,139,69,.12);
  }
  .ks-header .ks-search-input{background:transparent;color:#16251c}
  .ks-header .ks-search-input::placeholder{color:#6b7c72}
  .ks-header .ks-search-btn{
    background:#0f8b45;color:#fff;border-radius:0 10px 10px 0;
    transition:background .18s ease;
  }
  .ks-header .ks-search-btn i{color:#fff}
  .ks-header .ks-search-btn:hover{background:#0b6e37}

  /* right links: clean pills with a clear hover */
  .ks-header .ks-right-links{gap:6px}
  .ks-header .ks-right-links > a,
  .ks-header .ks-account-area{
    color:#16251c;font-weight:600;
    padding:7px 11px;border-radius:10px;
    transition:background .16s ease, color .16s ease;
  }
  .ks-header .ks-right-links > a:hover,
  .ks-header .ks-account-area:hover{background:#eef6f0;color:#0b6e37}
  .ks-header .ks-right-links i{color:#0f8b45}
  .ks-header .ks-seller-btn{border:1.5px solid #cfe3d6}
  .ks-header .ks-seller-btn:hover{border-color:#0f8b45}
  .ks-header .ks-divider{background:#e1e9e4}

  /* category bar */
  .ks-header .ks-nav-bar{border-top:1px solid #edf2ee;background:#fff}
  .ks-header .ks-nav-items > li > a{
    color:#16251c;font-weight:600;
    transition:color .16s ease, box-shadow .16s ease;
  }
  .ks-header .ks-nav-items > li:hover > a{
    color:#0b6e37;
    box-shadow:inset 0 -3px 0 #0f8b45;
  }
}

/* mega menus (Seeds, Crop Protection, ...): cleaner panel, tidy headings, comfortable link rows */
@media (min-width:769px){
  .ks-header .ks-mega-menu{
    border:0;
    border-top:3px solid #0f8b45;
    border-radius:0 0 14px 14px;
    padding:22px 26px 20px;
    box-shadow:0 24px 50px rgba(8,34,22,.18);
  }
  .ks-header .ks-mega-menu .mega-columns{gap:28px}
  .ks-header .ks-mega-menu h4{
    margin:0 0 10px;
    padding-bottom:10px;
    font-size:.8rem;
    font-weight:800;
    letter-spacing:.1em;
    color:#0b3d24;
    border-bottom:2px solid #e6efe8;
  }
  .ks-header .ks-mega-menu h4 a{color:inherit;font-weight:inherit;text-decoration:none}
  .ks-header .ks-mega-menu h4 a:hover{color:#0f8b45}
  .ks-header .ks-mega-menu .mega-column ul li,
  .ks-header .ks-mega-menu .veg-cols li{margin:0;line-height:1.3}
  .ks-header .ks-mega-menu .mega-column ul li a,
  .ks-header .ks-mega-menu .veg-cols a{
    display:block;
    padding:7px 10px;
    margin:0 -10px;
    border-radius:8px;
    font-size:.92rem;
    font-weight:500;
    color:#2c3e33;
    transition:background .15s ease, color .15s ease;
  }
  .ks-header .ks-mega-menu .mega-column ul li a:hover,
  .ks-header .ks-mega-menu .veg-cols a:hover{background:#eef6f0;color:#0b6e37}
  .ks-header .ks-mega-menu .veg-cols ul:last-child li:last-child a{color:#0f8b45;font-weight:700}
  .ks-header .ks-mega-menu .veg-cols{gap:28px}
}

/* medium desktop widths: keep right-hand links on one line so the search bar keeps its width */
@media (min-width:769px){
  .ks-header .ks-right-links > a,
  .ks-header .ks-account-area,
  .ks-header .cart-link{white-space:nowrap}
}
@media (min-width:769px) and (max-width:1199px){
  .ks-header .ks-right-links{gap:2px}
  .ks-header .ks-right-links > a,
  .ks-header .ks-account-area{padding:6px 7px;font-size:.84rem}
  .ks-header .ks-seller-btn{border-color:transparent}
  .ks-header .ks-divider{display:none}
}

/* mobile header: same look as desktop (no height / position changes) */
@media (max-width:768px){
  .ks-header{box-shadow:0 6px 16px rgba(8,34,22,.08)}
  .ks-header .ks-search-container{
    background:#f3f6f4;
    border-radius:12px;
    box-shadow:inset 0 0 0 1.5px #dbe5df;
    transition:box-shadow .18s ease, background .18s ease;
  }
  .ks-header .ks-search-container:focus-within{
    background:#fff;
    box-shadow:inset 0 0 0 1.5px #0f8b45, 0 0 0 3px rgba(15,139,69,.14);
  }
  .ks-header .ks-search-input{background:transparent;color:#16251c}
  .ks-header .ks-search-btn{background:#0f8b45;color:#fff;border-radius:0 12px 12px 0}
  .ks-header .ks-search-btn i{color:#fff}
  .ks-header .ks-mobile-icons i{color:#0b3d24;font-size:1.15rem}
  .ks-header .ks-back-btn,
  .ks-header .ks-hamburger{color:#0b3d24}
}

/* search focus state: header.css strips every focus style with !important, which left a plain white box.
   Give it a clear green border + soft ring instead (same specificity, loaded later, so it wins). */
@media (min-width:769px){
  .ks-header .ks-search-container:focus-within{
    background:#fff !important;
    border-color:#0f8b45 !important;
    box-shadow:0 0 0 4px rgba(15,139,69,.14) !important;
  }
}
@media (max-width:768px){
  .ks-header .ks-search-container:focus-within{
    background:#fff !important;
    box-shadow:inset 0 0 0 1.5px #0f8b45, 0 0 0 3px rgba(15,139,69,.14) !important;
  }
}

/* ---- search dropdown + mic: self-contained copy of the base styles ----
   The mobile app (WebView) can keep an old cached header.css, which left the Recent / Trending list and the mic
   button unstyled. This file has a versioned URL, so these rules always reach the app. */
.ks-search-mic{
  -webkit-appearance:none;appearance:none;
  width:44px;height:48px;padding:0;margin:0;
  border:0;border-radius:0;background:none;
  font-size:1rem;color:#666;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.ks-search-mic i{font-size:1rem;line-height:1}
.ks-search-mic.is-listening{color:#d93025}
.ks-search-btn{-webkit-appearance:none;appearance:none}
.ks-search-input{-webkit-appearance:none;appearance:none}
.ks-suggest-box{
  width:100%;
  border:1px solid #e0e0e0;
  border-radius:16px;
  background:#fff;
  box-shadow:0 18px 42px rgba(15,23,42,.14);
  overflow:hidden;
  position:absolute;
  top:100%;
  left:0;
  z-index:3000;
}
.ks-search-discovery{padding:14px 16px 18px;background:#fff}
.ks-search-discovery-section + .ks-search-discovery-section{margin-top:18px}
.ks-search-discovery-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:9px;color:#64748b;font-size:.76rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
}
.ks-search-clear-recent{
  border:0;background:transparent;color:#64748b;font-size:.78rem;cursor:pointer;padding:2px 4px;
  -webkit-appearance:none;appearance:none;
}
.ks-search-chip-row{display:flex;flex-wrap:wrap;gap:10px}
.ks-search-chip{
  -webkit-appearance:none;appearance:none;
  display:inline-flex;align-items:center;gap:7px;
  min-height:34px;padding:7px 13px;
  border:1px solid #bbf7d0;border-radius:999px;
  background:#eafbf0;color:#166534;
  font-family:inherit;font-size:.88rem;font-weight:700;
  cursor:pointer;white-space:nowrap;
}
.ks-search-chip i{font-size:.78rem;color:#15803d}
@media (max-width:480px){
  .ks-suggest-box{border:0;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.12)}
  .ks-search-discovery{padding:12px 12px 14px}
  .ks-search-discovery-section + .ks-search-discovery-section{margin-top:14px}
  .ks-search-chip-row{gap:8px}
  .ks-search-chip{min-height:32px;padding:6px 11px;font-size:.82rem}
}

/* Category / brand / search pages (mobile): the sticky Filter + Sort bar must be fully opaque and flush with the header,
   so product cards never show through above or around it while scrolling (self-contained: the app can hold an old category.css). */
@media (max-width:768px){
  .ks-controls-row{
    background:#fff !important;
    box-shadow:0 -12px 0 #fff, 0 3px 10px rgba(8,34,22,.10) !important;
  }
  .ks-controls-row.is-fixed{
    background:#fff !important;
    box-shadow:0 -12px 0 #fff, 0 3px 10px rgba(8,34,22,.10) !important;
  }
}
