/* Global search — Hairline. Pairs with static/globalsearch.js. Every token has a fallback so
   the box looks right on any page, whatever that page's own stylesheet defines. */

/* Layout defaults only (zero specificity): the page's own .gsearch rules win. */
:where(.gsx){position:relative;flex:0 1 460px;margin-left:16px;min-width:0}
.gsx-field{position:relative;display:block;width:100%;min-width:0}
.gsx .gsx-input{width:100%;height:36px;padding:0 56px 0 36px;border:0;border-radius:var(--r-field,6px);
  background:var(--sunken,#F3F1F3) no-repeat 12px center/16px
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23292829' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='8.5' cy='8.5' r='5.5'/%3E%3Cpath d='M13 13l4 4'/%3E%3C/svg%3E");
  font:400 var(--t-label,15px)/1 var(--font,-apple-system,'Helvetica Neue',Helvetica,sans-serif);color:var(--ink,#000);
  -webkit-appearance:none;appearance:none}
.gsx .gsx-input::placeholder{color:var(--placeholder,#77717B)}
.gsx .gsx-input:focus{outline:2px solid var(--blue,#4759FC);outline-offset:1px;background-color:#fff}
.gsx .gsx-input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;width:14px;height:14px;cursor:pointer;
  background:no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23292829' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 5l10 10M15 5L5 15'/%3E%3C/svg%3E")}
.gsx-field > .gsx-kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:inline-block;margin:0;
  height:20px;line-height:20px;padding:0 6px;border:0;border-radius:4px;
  background:#fff;color:var(--muted,#292829);font:500 var(--t-meta,12px)/20px var(--font,sans-serif);pointer-events:auto;cursor:text;
  box-shadow:inset 0 0 0 1px var(--line-strong,#E6E2E7)}
.gsx.has-text .gsx-field > .gsx-kbd,.gsx.is-open .gsx-field > .gsx-kbd{display:none}
.gsx.has-text .gsx-input{padding-right:12px}

.gsx-pop{position:absolute;top:calc(100% + 6px);left:0;right:0;min-width:500px;max-height:min(72vh,600px);overflow-y:auto;
  overscroll-behavior:contain;background:#fff;border-radius:10px;box-shadow:var(--shadow-menu,0 8px 24px rgba(0,0,0,.10));
  padding:6px;z-index:var(--z-picker-top,60);font-family:var(--font,sans-serif);color:var(--ink,#000)}
.gsx-pop.is-loading{opacity:.97}

.gsx-group{display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:var(--t-meta,12px);font-weight:700;padding:12px 10px 4px;color:var(--ink,#000)}
.gsx-group:first-child{padding-top:6px}
.gsx-group + .gsx-opt{margin-top:0}
.gsx-opt + .gsx-group{margin-top:4px;border-top:1px solid var(--line,#F3F1F3)}
.gsx-count{font-weight:400;color:var(--muted,#292829)}
.gsx-clear{border:0;background:none;padding:0;font:400 var(--t-meta,12px)/1 var(--font,sans-serif);color:var(--blue,#4759FC);cursor:pointer}

.gsx-opt{display:flex;align-items:center;gap:10px;min-height:48px;padding:6px 10px;border-radius:var(--r-field,6px);cursor:pointer}
.gsx-opt[aria-selected="true"]{background:var(--sunken,#F3F1F3)}
.gsx-opt.is-archived .gsx-name{color:var(--muted,#292829)}
.gsx-opt.is-recent,.gsx-opt.is-more{min-height:40px}
.gsx-opt.is-more .gsx-name{font-weight:400;color:var(--blue,#4759FC)}
.gsx-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.gsx-name{font-size:var(--t-label,15px);font-weight:500;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsx-sub{font-size:var(--t-meta,12px);color:var(--muted,#292829);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsx-meta{flex:0 0 auto;font-size:var(--t-meta,12px);color:var(--muted,#292829);white-space:nowrap;font-variant-numeric:tabular-nums}
.gsx-date{flex:0 0 auto;font-size:var(--t-meta,12px);color:var(--muted,#292829);white-space:nowrap;text-decoration:none;
  padding:4px 6px;margin:-4px -6px -4px 0;border-radius:4px;font-variant-numeric:tabular-nums}
.gsx-date:hover{background:#fff;color:var(--blue,#4759FC);text-decoration:underline}
.gsx-date.is-overdue{color:var(--overdue,#D63D52)}
.gsx-hl{background:none;color:inherit;font-weight:700;text-decoration:underline;text-decoration-color:var(--coral-soft,#F3A8B1);
  text-decoration-thickness:2px;text-underline-offset:2px}
.gsx-sub .gsx-hl{color:var(--ink,#000)}

/* 32px tiles, radius 6, white glyph */
.gsx-tile{flex:0 0 32px;width:32px;height:32px;border-radius:var(--r-field,6px);color:#fff;position:relative;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;font-size:var(--t-chip,14px);font-weight:700;letter-spacing:.02em}
.gsx-tile svg{width:18px;height:18px}
/* contact tiles: coloured inline from the live type (var(--k-<key>) from /kinds.css, else the colour search sent) */
.gsx-k{font-size:var(--t-chip,14px);font-weight:700}
.gsx-kind{font-weight:500}
.gsx-t-card{background:#5C6094}
.gsx-t-overdue{background:var(--coral,#E76C7A)}
.gsx-t-archived{background:#B4AEB7}
.gsx-a-sales_visit{background:#5C6094}
.gsx-a-survey{background:#476988}
.gsx-a-site_visit{background:#8162A4}
.gsx-a-fitting{background:#3E9C7B}
.gsx-a-other{background:#8E8891}
.gsx-t-note{background:#EB9174}
.gsx-t-text{background:#476988}
.gsx-t-file{background:#8E8891}
.gsx-t-action{background:var(--ink,#000)}
.gsx-t-map{background:var(--sunken,#F3F1F3);color:var(--ink,#000)}
.gsx-opt.is-map{min-height:40px}
.gsx-opt.is-map .gsx-name{color:var(--blue,#4759FC);font-weight:500}
.gsx-note{padding:6px 10px 8px;font-size:var(--t-meta,12px);color:var(--muted,#292829)}
.gsx-t-recent,.gsx-tile-more{background:var(--sunken,#F3F1F3);color:var(--muted,#292829)}
.gsx-ext{position:absolute;bottom:2px;left:0;right:0;text-align:center;font-size:7px;font-weight:700;letter-spacing:.04em;line-height:1}
.gsx-t-file:has(.gsx-ext) svg{transform:translateY(-3px)}
.gsx-thumb{background:var(--sunken,#F3F1F3)}
.gsx-thumb img{width:100%;height:100%;object-fit:cover;display:block}

.gsx-none{display:flex;flex-direction:column;gap:4px;padding:14px 10px;font-size:var(--t-label,15px);color:var(--muted,#292829)}
.gsx-none b{color:var(--ink,#000);font-weight:500}
.gsx-none span{font-size:var(--t-meta,12px)}
.gsx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Phones: the box takes the whole row and the results a full-width sheet under it */
@media (max-width:640px){
  :where(.gsx){order:5;flex:1 1 100%;margin:4px 0 0}
  .gsx-field > .gsx-kbd{display:none}
  .gsx .gsx-input{height:40px;font-size:var(--t-ui);padding-right:12px}     /* 16px: iOS doesn't zoom */
  .gsx-pop{position:fixed;left:0;right:0;top:var(--gsx-top,120px);bottom:0;min-width:0;max-height:none;
    border-radius:0;box-shadow:0 -1px 0 var(--line,#F3F1F3),0 8px 24px rgba(0,0,0,.10);padding:4px 8px calc(12px + env(safe-area-inset-bottom))}
  .gsx-opt{min-height:52px}
  .gsx-date,.gsx-meta{max-width:34vw;overflow:hidden;text-overflow:ellipsis}
}
.gsx.is-open{z-index:61}      /* above a drawer's backdrop when ⌘K is pressed over it */
