:root{--fks-accent:#e4572e}

/* ============ BAR (theme CSS ko override karne ke liye !important) ============ */
.fks-bar{position:relative!important;width:100%!important;max-width:100%!important;font-size:14px;line-height:1.4;box-sizing:border-box;display:block!important}
.fks-bar *,.fks-bar *::before,.fks-bar *::after{box-sizing:border-box}

.fks-bar .fks-form{
  display:flex!important;align-items:center!important;flex-wrap:nowrap!important;
  width:100%!important;max-width:100%!important;min-height:46px;
  background:#fff!important;border:2px solid var(--fks-accent)!important;border-radius:40px!important;
  padding:2px 4px 2px 8px!important;margin:0!important;overflow:hidden!important;
  box-shadow:none!important;
}
.fks-bar .fks-form.fks-over{background:rgba(228,87,46,.06)!important;border-style:dashed!important}

.fks-bar select.fks-cat{
  flex:0 0 auto!important;width:auto!important;max-width:150px!important;min-width:0!important;
  border:0!important;border-right:1px solid #e6e6e6!important;border-radius:0!important;
  background-color:transparent!important;box-shadow:none!important;outline:none!important;
  height:auto!important;min-height:0!important;margin:0!important;
  padding:6px 20px 6px 4px!important;font-size:13px!important;color:#555!important;cursor:pointer;
  -webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23888' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 6px center!important;
  text-overflow:ellipsis;
}

.fks-bar input.fks-input{
  flex:1 1 auto!important;width:auto!important;min-width:40px!important;max-width:none!important;
  border:0!important;background:transparent!important;box-shadow:none!important;outline:none!important;
  height:auto!important;min-height:0!important;margin:0!important;
  padding:10px 12px!important;font-size:14px!important;color:#222!important;border-radius:0!important;
}
.fks-bar input.fks-input::placeholder{color:#999;opacity:1}
.fks-bar input.fks-file{display:none!important}

.fks-bar button.fks-btn{
  flex:0 0 auto!important;width:auto!important;min-width:0!important;
  background:none!important;border:0!important;box-shadow:none!important;outline:none!important;
  margin:0!important;padding:7px!important;line-height:0!important;cursor:pointer;
  color:#666!important;font-size:0!important;height:auto!important;min-height:0!important;
  border-radius:50%!important;text-transform:none!important;letter-spacing:normal!important;
  transition:color .2s,transform .2s;
}
.fks-bar button.fks-btn:active{transform:scale(.92)}
.fks-bar button.fks-btn:hover{color:var(--fks-accent)!important;background:none!important}
.fks-bar .fks-sep{flex:0 0 auto!important;width:1px!important;height:22px!important;background:#e6e6e6!important;margin:0 2px!important;display:block!important}
.fks-bar button.fks-go{
  background:var(--fks-accent)!important;color:#fff!important;
  width:36px!important;height:36px!important;padding:0!important;margin-left:4px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
}
.fks-bar button.fks-go:hover{background:var(--fks-accent)!important;color:#fff!important;opacity:.88}
.fks-bar button.fks-btn svg{display:block}

/* ============ DROPDOWN (body me mounted) ============ */
.fks-panel{
  display:none;position:fixed;top:0;left:0;width:340px;
  background:#fff;border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.2);
  overflow:auto;padding:8px;z-index:2147483000;font-size:14px;line-height:1.4;color:#222;
  -webkit-overflow-scrolling:touch;
}
.fks-panel.fks-show{display:block}
.fks-panel *{box-sizing:border-box}
.fks-panel a{text-decoration:none!important;color:inherit}
.fks-sec{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#999;padding:10px 10px 6px}
.fks-note{padding:20px 12px;text-align:center;color:#888}
.fks-cats{display:flex;flex-wrap:wrap;gap:6px;padding:0 8px 4px}
.fks-chip{display:inline-block;background:#f4f4f4;border-radius:20px;padding:5px 12px;font-size:12.5px;color:#333}
.fks-chip em{font-style:normal;color:#999}
.fks-chip:hover,.fks-chip.fks-hi{background:var(--fks-accent);color:#fff}
.fks-chip:hover em,.fks-chip.fks-hi em{color:#ffdccf}
.fks-row{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:8px;color:inherit}
.fks-row:hover,.fks-row.fks-hi{background:#f6f6f6}
.fks-row img{width:52px;height:52px;object-fit:cover;border-radius:6px;flex:0 0 auto;background:#f2f2f2}
.fks-row-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.fks-row-t b{font-weight:500;font-size:14px;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fks-row-t small{color:#aaa;font-size:11px}
.fks-row-p{font-size:13px;color:#222}
.fks-row-p del{color:#aaa;font-weight:400}
.fks-row-p ins{text-decoration:none}
.fks-oos{margin-left:auto;font-size:11px;color:#b00;flex:0 0 auto}
.fks-all{display:block;text-align:center;padding:11px;margin-top:6px;border-top:1px solid #eee;font-size:13px;font-weight:500;color:var(--fks-accent)}
.fks-all:hover,.fks-all.fks-hi{background:#faf4f2}

/* ---- image mode ---- */
.fks-imghead{display:flex;align-items:center;gap:14px;padding:10px 32px 10px 10px;border-bottom:1px solid #eee;position:relative}
.fks-imghead>img{width:76px;height:76px;object-fit:cover;border-radius:8px;flex:0 0 auto;background:#f2f2f2}
.fks-imgstat{font-size:13.5px;color:#666;line-height:1.45}
.fks-close{position:absolute!important;top:6px;right:6px;background:none!important;border:0!important;box-shadow:none!important;cursor:pointer;color:#999!important;line-height:0!important;padding:4px!important;min-height:0!important}
.fks-ok{color:#1a8a3c;font-weight:600}
.fks-warn{color:#b26a00;font-weight:500}
.fks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;padding:10px}
.fks-card{display:block;border:1px solid #eee;border-radius:10px;padding:8px;color:inherit;background:#fff}
.fks-card:hover{border-color:var(--fks-accent)}
.fks-card img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:6px;background:#f5f5f5}
.fks-card-t{display:-webkit-box;font-size:12.5px;margin:6px 0 3px;line-height:1.3;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fks-card-p{display:block;font-size:12.5px;font-weight:600}

/* ============ MOBILE ============ */
@media (max-width:768px){
  .fks-bar .fks-form{min-height:50px;padding:3px 3px 3px 6px}
  .fks-bar select.fks-cat{display:none!important}
  .fks-bar button.fks-btn{padding:8px!important}
  .fks-bar button.fks-cam{width:44px!important;height:44px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important}
  .fks-bar button.fks-go{width:44px!important;height:44px!important;margin-left:6px!important}
  .fks-bar input.fks-input{padding:8px 10px!important;font-size:16px!important}
  .fks-panel{width:calc(100vw - 20px)!important;left:10px!important;right:auto!important;max-width:none!important}
  .fks-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}
}


/* Camera button uploading state */
.fks-bar.fks-uploading .fks-cam{animation:fks-pulse .8s infinite}
@keyframes fks-pulse{0%,100%{opacity:1}50%{opacity:.6}}

/* purane search form ko chhupao */
.fks-replaced + form{display:none!important}

/* ============ admin ============ */
.fks-stats{font-size:15px;margin:10px 0}
.fks-progress{background:#e5e5e5;height:12px;border-radius:6px;overflow:hidden;max-width:620px}
#fks-bar{background:var(--fks-accent);height:100%;width:0;transition:width .3s}
.fks-log{background:#14171a;color:#8fe08f;padding:12px;max-width:620px;height:200px;overflow:auto;font-size:12px;border-radius:6px;white-space:pre-wrap}
.fks-test-out{max-width:620px;margin-top:10px}
.fks-test-out .fks-grid{padding:0;background:transparent}