/* Sinergeek 2026-10-21 - tendina di ricerca, aspetto nuovo (solo con SG_SEARCH_UI o cookie di collaudo).
   Classi proprie (.sgac...): le vecchie regole del tema per .tvcmssearch-dropdown non si applicano. */

body.sg-search-ui .tvsearch-result { z-index: 1000; }
body.sg-search-ui .tvcmsdesktop-top-header-wrapper .tvsearch-result {
  width: 760px;
  max-width: calc(100vw - 32px);
  left: 0;
  margin-top: 8px;
}

.sgac {
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 12px;
  box-shadow: 0 14px 40px rgba(17, 17, 17, .14);
  overflow: hidden;
  color: #222;
  text-align: left;
}
.sgac a { text-decoration: none; }
.sgac-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 12px 10px 16px;
  border-bottom: 1px solid #f2f2f2;
}
.sgac-title { font-size: 13px; color: #666; line-height: 1.35; }
.sgac-title strong { color: #222; }
.sgac-close {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  font-size: 22px;
  line-height: 1;
  color: #999;
  cursor: pointer;
  padding: 2px 8px 4px;
  border-radius: 6px;
}
.sgac-close:hover, .sgac-close:focus { color: #222; background: #f4f4f4; outline: none; }

.sgac-block { padding: 12px 16px 4px; }
.sgac-block-help { border-bottom: 1px solid #f2f2f2; }
.sgac-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #999;
  margin: 0 0 8px;
}
.sgac-chips { display: flex; flex-wrap: wrap; gap: 8px; padding-bottom: 8px; }
.sgac-chip {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid #ff6233;
  border-radius: 999px;
  font-size: 13px;
  line-height: 1.2;
  color: #ff6233;
  background: #fff;
}
.sgac-chip:hover, .sgac-chip:focus { background: #ff6233; color: #fff; outline: none; }
.sgac-chip-soft { border-color: #e4e4e4; color: #333; }
.sgac-chip-soft:hover, .sgac-chip-soft:focus { border-color: #ff6233; background: #fff4f0; color: #ff6233; }

.sgac-body { display: grid; grid-template-columns: 210px minmax(0, 1fr); }
.sgac-body-full { grid-template-columns: minmax(0, 1fr); }
.sgac-side { border-right: 1px solid #f2f2f2; padding: 12px 10px 12px 16px; background: #fcfcfc; }
.sgac-side-sec + .sgac-side-sec { margin-top: 14px; }
.sgac-facet {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  padding: 6px 8px;
  margin: 0 0 2px -8px;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.3;
  color: #333;
}
.sgac-facet em { font-style: normal; color: #aaa; font-size: 12px; }
.sgac-facet:hover, .sgac-facet:focus { background: #fff4f0; color: #ff6233; outline: none; }

.sgac-list { list-style: none; margin: 0; padding: 6px 0; max-height: min(60vh, 520px); overflow-y: auto; }
.sgac-item a { display: flex; align-items: center; gap: 12px; padding: 8px 16px; color: #222; }
.sgac-item a:hover, .sgac-item a:focus { background: #fff7f4; outline: none; }
.sgac-img {
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  border: 1px solid #f0f0f0;
  border-radius: 8px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.sgac-img img { max-width: 100%; max-height: 100%; width: auto; height: auto; }
.sgac-info { display: flex; flex-direction: column; min-width: 0; }
.sgac-name {
  font-size: 14px;
  line-height: 1.3;
  color: #222;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sgac-name mark { background: none; color: inherit; font-weight: 700; padding: 0; }
.sgac-price { margin-top: 3px; font-size: 14px; font-weight: 700; color: #ff6233; }
.sgac-price s { color: #aaa; font-weight: 500; font-size: 12px; margin-left: 4px; }

.sgac-all {
  display: block;
  padding: 13px 16px;
  text-align: center;
  background: #ff6233;
  color: #fff;
  font-weight: 700;
  font-size: 14px;
}
.sgac-all:hover, .sgac-all:focus { background: #e9532a; color: #fff; outline: none; }

.sgac-wa {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 16px 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #e9f9ef;
  border: 1px solid #b9ebcb;
  color: #1f5135;
  font-size: 13px;
  line-height: 1.35;
}
.sgac-wa svg { flex: 0 0 auto; color: #25d366; }
.sgac-wa:hover, .sgac-wa:focus { background: #dcf5e5; color: #1f5135; outline: none; }
.sgac-wa-small { margin: 4px 16px 12px; }

@media (max-width: 767px) {
  .sgac { border-radius: 10px; max-height: calc(100vh - 170px); overflow-y: auto; }
  /* su telefono prima i prodotti, poi marche e categorie */
  .sgac-body { display: flex; flex-direction: column; }
  .sgac-list { order: 1; }
  .sgac-side {
    order: 2;
    border-right: 0;
    border-top: 1px solid #f2f2f2;
    padding: 10px 16px 4px;
    background: #fcfcfc;
  }
  .sgac-side-sec { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 8px; }
  .sgac-side-sec + .sgac-side-sec { margin-top: 0; }
  .sgac-side-sec .sgac-label { width: 100%; margin-bottom: 0; }
  .sgac-facet { margin: 0; border: 1px solid #ececec; border-radius: 999px; padding: 4px 10px; }
  .sgac-list { max-height: none; }
  .sgac-item a { padding: 8px 14px; }
}
