/* ==== COSMOD Product Search — pink premium style ==== */

/* Wrapper sizing if used in header */
.cps-wrap{ position:relative; max-width:1080px; margin:8px auto; font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; }
.cps-form{ position:relative; }
.cps-btn{ display:none; }

/* Capsule around the input */
.cps-wrap.skin-pink{
  background: linear-gradient(180deg,#ffdbe5 0%,#f7c9d3 100%);
  padding: 8px;
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 10px 28px rgba(255,105,145,.16);
}

/* Input */
.cps-input{
  width:100%; height:56px;
  padding:0 48px 0 56px;
  border:0; outline:none; border-radius:999px;
  background:#fff;
  font-size:17px; line-height:56px;
  box-shadow:0 1px 0 rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.07);
}
.cps-input::placeholder{ color:#a88792; opacity:1; }

/* Icon */
.cps-wrap.skin-pink .cps-form::before{
  content:""; position:absolute; left:20px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; opacity:.85;
  background:no-repeat center/contain;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23985b6b" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="7"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>');
}

/* Focus */
.cps-input:focus{
  box-shadow:0 0 0 3px rgba(255,128,170,.35), 0 10px 28px rgba(0,0,0,.10);
}

/* Dropdown */
.cps-panel{
  position:absolute;
  left:0;
  right:0;
  display: none;
  top:100%;
  margin-top:12px;
  background:#fff;
  border:1px solid #f2d6dd;
  border-radius:18px;
  padding:14px;
  box-shadow:0 22px 50px rgba(0,0,0,.14);
  z-index:50;
}
.cps-sec-title{ font-size:12px; font-weight:800; letter-spacing:.06em; margin:0 0 8px; color:#8b6f79; text-transform:uppercase; }
.cps-list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.cps-link{ display:flex; gap:12px; align-items:center; text-decoration:none; padding:10px; border-radius:12px; transition:transform .08s ease, background .12s ease; }
.cps-link:hover{ background:#fff1f5; transform: translateY(-1px); }
.cps-thumb{ width:56px; height:56px; object-fit:cover; border-radius:10px; background:#fff3f6; }
.cps-title{ font-size:15px; font-weight:600; color:#222; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cps-price{ font-size:14px; font-weight:700; color:#1788C8; }
.cps-see-all{ display:block; text-align:center; padding:12px 10px; font-weight:700; text-decoration:none; color:#1788C8; border-top:1px solid #f0e1e5; margin-top:8px; }

@media (max-width:560px){
  .cps-list{ grid-template-columns:1fr; }
  .cps-input{ height:50px; line-height:50px; }
  .cps-wrap.skin-pink .cps-form::before{ left:18px; width:20px; height:20px; }
  .cps-thumb{ width:50px; height:50px; }
}

/* ==== Results page grid (like category look) ==== */
.cps-results{
  --w: 1200px;
  --gap-x: 120px;
  --gap-y: 80px;
  --img-h: 220px;
  --title-size: clamp(18px, 2.1vw, 22px);
  --price-size: clamp(16px, 1.6vw, 19px);
  max-width: var(--w);
  margin: 0 auto;
  padding: 10px 15px 60px;
}
.cps-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:var(--gap-x); row-gap:var(--gap-y); align-items:start; }
.cps-card{ border:0; background:transparent; box-shadow:none; text-align:center; display:flex; flex-direction:column; align-items:center; padding:0; }
.cps-card .img{ width:100%; height:var(--img-h); display:flex; align-items:flex-end; justify-content:center; background:transparent; }
.cps-card img{ max-height:calc(var(--img-h) - 20px); width:auto; height:auto; object-fit:contain; }
.cps-card .body{ padding:0; display:flex; flex-direction:column; align-items:center; }
.cps-card .title{ font-weight:800; font-size:var(--title-size); line-height:1.25; text-align:center; margin:14px 0 10px; }
.cps-card .price{ font-size:var(--price-size); font-weight:700; margin-top:6px; }
.cps-card .price del{ color:#222; opacity:.55; margin-right:10px; text-decoration:line-through; font-weight:700; }
.cps-card .price ins{ color:#e6002e; text-decoration:none; font-weight:800; }

@media (max-width:1200px){ .cps-results{ --gap-x:80px; --gap-y:60px; --img-h:200px; } }
@media (max-width:1024px){ .cps-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:768px){ .cps-grid{ grid-template-columns:repeat(2,1fr); } .cps-results{ --gap-x:40px; --img-h:180px; } }
@media (max-width:480px){ .cps-grid{ grid-template-columns:1fr; } .cps-results{ --img-h:170px; } }