/* Control IO — Instant Search UI (Phase A) */
.cio-search{position:relative;max-width:720px;width:100%}
.cio-search__box{display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:12px;padding:.5rem .75rem;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.cio-search__input{flex:1;border:0;outline:0;font-size:16px;background:transparent;padding:.35rem}
.cio-search__clear{border:0;background:transparent;font-size:20px;line-height:1;cursor:pointer;padding:.25rem .35rem;opacity:.6}
.cio-search__clear:hover{opacity:1}

.cio-search__panel{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:12px;margin-top:.35rem;box-shadow:0 8px 24px rgba(0,0,0,.12);display:none;z-index:50;overflow:hidden}
.cio-search__panel.is-open,.cio-search__panel.is-open + .cio-search__panel{display:block}
.cio-search__list{list-style:none;margin:0;padding:0;max-height:420px;overflow:auto}
.cio-search__item{border-top:1px solid rgba(0,0,0,.05)}
.cio-search__item:first-child{border-top:0}
.cio-search__item.is-active,.cio-search__item:hover{background:rgba(0,0,0,.03)}

.cio-search__link{display:grid;grid-template-columns:56px 1fr auto auto;gap:.75rem;align-items:center;padding:.6rem .75rem;color:inherit;text-decoration:none}
.cio-search__thumb{width:56px;height:56px;border-radius:8px;overflow:hidden;background:#fafafa;border:1px solid rgba(0,0,0,.06);display:flex;align-items:center;justify-content:center}
.cio-search__thumb img{max-width:100%;max-height:100%;display:block}
.cio-search__meta{display:flex;flex-direction:column;gap:.25rem}
.cio-search__title{font-weight:600;line-height:1.2}
.cio-search__chip{display:inline-block;border:1px solid rgba(0,0,0,.1);border-radius:999px;padding:.15rem .5rem;font-size:12px;opacity:.85}
.cio-search__sku{}

.cio-search__price{font-weight:700}
.cio-search__stock{font-size:12px;border-radius:6px;padding:.25rem .5rem;border:1px solid rgba(0,0,0,.08);}
.cio-search__stock.in{background:#f0fff5}
.cio-search__stock.out{background:#fff5f5}

.cio-search__viewall{border-top:1px solid rgba(0,0,0,.08);padding:.5rem .75rem;text-align:center;background:#fff}
.cio-search__viewall-link{text-decoration:none;font-weight:600}

@media (max-width: 768px){
  .cio-search__link{grid-template-columns:48px 1fr auto;grid-template-areas:"thumb title price" "thumb sku stock"}
  .cio-search__thumb{grid-area:thumb}
  .cio-search__meta{grid-area:title}
  .cio-search__price{grid-area:price}
  .cio-search__stock{grid-area:stock;justify-self:end}
}