/* Tech Guru One: search panel for drop-downs in the client area and cart (tg-select-search.js, 11 October 2026).
   The page's own <select> keeps its look; this styles only the panel that opens from it.
   Hostim pages: the theme's field style (Open Sans, #d7dee8 border, 10px corners, #29abe2 focus ring).
   tg_onepage checkout: its own style (#dedede border, 10px corners, #0b5cd5 focus). */
.tgss-panel{--tgss-accent:#29abe2;--tgss-ring:rgba(41,171,226,.18);--tgss-line:#d7dee8;--tgss-r:10px;--tgss-font:"Open Sans",sans-serif;
  --tgss-bg:#fff;--tgss-ink:#1f2937;--tgss-muted:#6b7280;--tgss-soft:#eef1f5;--tgss-hover:#f1f6fd;--tgss-mark:#fff1a8;
  position:fixed;z-index:100001;display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden;
  background:var(--tgss-bg);border:1px solid var(--tgss-line);border-radius:var(--tgss-r);
  box-shadow:0 14px 36px rgba(17,24,39,.16),0 2px 6px rgba(17,24,39,.06);
  font-family:var(--tgss-font);font-size:14px;line-height:1.4;color:var(--tgss-ink);text-align:left}
/* dark mode (the script adds is-dark when the field itself is dark and passes its background in --tgss-bg) */
.tgss-panel.is-dark{--tgss-ink:#e2e8f0;--tgss-muted:#94a3b8;--tgss-soft:rgba(148,163,184,.18);--tgss-hover:rgba(148,163,184,.16);
  --tgss-mark:rgba(250,204,21,.32);--tgss-line:#334155;box-shadow:0 14px 36px rgba(0,0,0,.5)}
.tgss-panel.is-dark .tgss-opt[aria-selected="true"]{color:#7dd3fc}
.tgss-panel.is-onepage{--tgss-accent:#0b5cd5;--tgss-ring:rgba(11,92,213,.16);--tgss-line:#dedede}
.tgss-panel *,.tgss-panel *::before,.tgss-panel *::after{box-sizing:border-box}
.tgss-head{display:none}
.tgss-search{flex:none;padding:8px;border-bottom:1px solid var(--tgss-soft);background:var(--tgss-bg)}
.tgss-panel .tgss-input{display:block;width:100%;height:40px;margin:0;padding:0 12px 0 36px;
  border:1px solid var(--tgss-line);border-radius:calc(var(--tgss-r) - 2px);background-color:var(--tgss-bg);color:var(--tgss-ink);
  font:inherit;font-size:14px;line-height:normal;box-shadow:none;outline:0;-webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a93a6' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:12px center}
.tgss-panel .tgss-input:focus{border-color:var(--tgss-accent);box-shadow:0 0 0 3px var(--tgss-ring)}
.tgss-panel .tgss-input::placeholder{color:#8a93a6;opacity:1}
.tgss-list{flex:1 1 auto;min-height:0;max-height:360px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;padding:4px;outline:0}
.tgss-opt{display:flex;align-items:center;gap:8px;min-height:36px;padding:8px 12px;border-radius:calc(var(--tgss-r) - 4px);
  cursor:pointer;color:var(--tgss-ink);overflow-wrap:anywhere;-webkit-tap-highlight-color:transparent;user-select:none}
.tgss-opt .tgss-txt{flex:1 1 auto;min-width:0}
.tgss-opt.is-active{background:var(--tgss-hover)}
.tgss-opt[aria-selected="true"]{font-weight:600;color:var(--tgss-accent)}
.tgss-opt[aria-selected="true"]::after{content:"";flex:none;width:14px;height:14px;
  background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}
.tgss-opt.is-empty{color:var(--tgss-muted)}
.tgss-opt.is-disabled{color:#a0a7b4;cursor:default}
.tgss-opt.is-disabled.is-active{background:transparent}
.tgss-opt mark{background:var(--tgss-mark);color:inherit;padding:0;border-radius:2px}
.tgss-grp{padding:10px 12px 4px;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--tgss-muted);cursor:default}
.tgss-none{padding:12px;color:var(--tgss-muted)}
.tgss-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.tgss-backdrop{position:fixed;inset:0;z-index:100000;background:rgba(17,24,39,.45)}
@media (prefers-reduced-motion:no-preference){
  .tgss-panel{animation:tgss-in .12s ease-out}
  @keyframes tgss-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
  .tgss-panel.is-up{animation-name:tgss-up}
  @keyframes tgss-up{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
}
/* phones: a panel across the top of the screen, big touch targets, 16px text so iOS does not zoom */
.tgss-panel.is-sheet{left:8px;right:8px;top:8px;width:auto;max-width:none}
.tgss-panel.is-sheet .tgss-head{display:flex;flex:none;align-items:center;justify-content:space-between;gap:8px;
  padding:4px 4px 4px 16px;border-bottom:1px solid var(--tgss-soft)}
.tgss-panel.is-sheet .tgss-title{font-weight:600;font-size:16px;color:var(--tgss-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgss-panel .tgss-close{flex:none;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:8px;background:transparent;
  color:var(--tgss-muted);font-size:28px;line-height:44px;text-align:center;cursor:pointer}
.tgss-panel .tgss-close:focus-visible{outline:2px solid var(--tgss-accent);outline-offset:-2px}
.tgss-panel.is-sheet .tgss-input{height:46px;font-size:16px}
.tgss-panel.is-sheet .tgss-list{max-height:none}
.tgss-panel.is-sheet .tgss-opt{min-height:48px;padding:12px 14px;font-size:16px}