/* Model finder (TOUGHBOOK 34 / 56 configurators). Data comes from data/finder-*.json via parts/model/finder.php. */
.tbf{/* House style (toughoutlet.com): light band, Poppins headings + Istok Web text, blue gradient for actions, black prices. */
  --tbf-bg:#f4f5f7;--tbf-card:#ffffff;--tbf-pop:#ffffff;--tbf-line:#dee2e6;--tbf-line2:#c3cad3;--tbf-acc:#007bff;--tbf-acc2:#00b7ff;--tbf-acctx:#0062cc;--tbf-fg:#212529;--tbf-mut:#6c757d;--tbf-ink:#0d0e10;--tbf-onacc:#ffffff;--tbf-shadow:0 .5rem 1.25rem rgba(0,0,0,.14);--tbf-head:Poppins,"Istok Web",Helvetica,Arial,sans-serif;--tbf-body:"Istok Web",Helvetica,Arial,sans-serif;
  background:var(--tbf-bg);color:var(--tbf-fg);font-family:var(--tbf-body);padding-block:72px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.tbf *{box-sizing:border-box}
.tbf [hidden]{display:none!important}
.tbf-wrap{max-width:1440px;margin:0 auto;display:grid;gap:28px}
.tbf-head h2{margin:0;font-family:var(--tbf-head);font-size:clamp(26px,3.4vw,34px);font-weight:700;text-wrap:balance;line-height:1.2;color:var(--tbf-fg)}
.tbf-head h2 span{color:var(--tbf-acc)}
.tbf-head p{margin:10px 0 0;color:var(--tbf-mut);font-size:15px;max-width:62ch;line-height:1.6}
.tbf-filters{display:grid;gap:18px;background:var(--tbf-card);border:1px solid var(--tbf-line);border-radius:4.8px;box-shadow:0 .125rem .25rem rgba(0,0,0,.075);padding:22px}
.tbf-grid{display:grid;gap:18px 26px;grid-template-columns:repeat(4,minmax(0,1fr))}
.tbf-grid.tbf-main{grid-template-columns:repeat(3,minmax(0,1fr))}
.tbf-sep{height:1px;background:var(--tbf-line)}
.tbf-g{min-width:0}
.tbf-g h3{display:flex;align-items:center;min-height:16px;margin:0 0 8px;font-family:var(--tbf-head);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1.2px;color:var(--tbf-mut)}
.tbf-main .tbf-g h3{color:var(--tbf-fg);font-size:12px}
.tbf-chips{display:flex;flex-wrap:wrap;gap:6px}
.tbf-chip{font:inherit;font-size:13px;line-height:1.2;color:var(--tbf-fg);background:var(--tbf-card);border:1px solid var(--tbf-line);border-radius:50rem;padding:8px 14px;cursor:pointer;display:inline-flex;gap:7px;align-items:baseline;transition:border-color .15s,background .15s}
.tbf-main .tbf-chip{font-size:14px;padding:10px 16px}
.tbf-chip:hover:not(:disabled){border-color:var(--tbf-acc)}
.tbf-chip:focus-visible{outline:2px solid var(--tbf-acc);outline-offset:2px}
.tbf-chip[aria-pressed="true"]{background:linear-gradient(90deg,var(--tbf-acc) 0%,var(--tbf-acc2) 100%);border-color:transparent;color:var(--tbf-onacc);font-weight:700;text-shadow:0 1px 1px rgba(0,0,0,.25)}
.tbf-chip:disabled{opacity:.38;cursor:not-allowed}
.tbf-n{font-size:11px;color:var(--tbf-mut);font-variant-numeric:tabular-nums}
.tbf-chip[aria-pressed="true"] .tbf-n{color:var(--tbf-onacc);opacity:.7}
.tbf-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;justify-content:space-between}
.tbf-count{font-family:var(--tbf-head);font-size:15px;font-weight:600}
.tbf-count b{color:var(--tbf-acc);font-variant-numeric:tabular-nums}
.tbf-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tbf-btn,.tbf-sort{font-family:var(--tbf-head);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--tbf-acctx);background:var(--tbf-card);border:1px solid var(--tbf-line);border-radius:50rem;padding:9px 16px;cursor:pointer}
.tbf-btn:hover{border-color:transparent;color:#fff;background:linear-gradient(90deg,var(--tbf-acc) 0%,var(--tbf-acc2) 100%)}
.tbf-btn:focus-visible,.tbf-sort:focus-visible{outline:2px solid var(--tbf-acc);outline-offset:2px}
.tbf-sort{background:var(--tbf-card);color:var(--tbf-fg);text-transform:none;letter-spacing:0;font-family:var(--tbf-body);font-size:13px}
.tbf-results{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.tbf-subhead{grid-column:1/-1;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-top:18px;padding-top:18px;border-top:1px solid var(--tbf-line)}
.tbf-subhead h3{margin:0;font-family:var(--tbf-head);font-size:15px;font-weight:700}
.tbf-subhead p{margin:0;font-size:12px;color:var(--tbf-mut)}
.tbf-card{position:relative;background:var(--tbf-card);border:1px solid var(--tbf-line);border-radius:4.8px;box-shadow:0 .125rem .25rem rgba(0,0,0,.075);padding:18px 18px 14px;display:flex;flex-direction:column;gap:12px;min-width:0}
.tbf-card:hover{border-color:var(--tbf-line2)}
.tbf-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.tbf-sku{font-family:var(--tbf-head);font-weight:600;font-size:15px;text-transform:uppercase}
.tbf-price{font-family:var(--tbf-head);font-weight:800;font-size:26px;line-height:1;color:var(--tbf-fg);font-variant-numeric:tabular-nums;white-space:nowrap}
.tbf-badges{display:flex;flex-wrap:wrap;gap:5px}
.tbf-b{font-size:12px;line-height:1;padding:6px 9px;background:var(--tbf-bg);border:1px solid var(--tbf-line);border-radius:50rem;white-space:nowrap}
.tbf-b.tbf-hi{background:#e7f1ff;border-color:#b8d6ff;color:var(--tbf-acctx);font-weight:700}
.tbf-b.tbf-fed{background:var(--tbf-fg);color:var(--tbf-card);border-color:var(--tbf-fg);font-weight:600}
.tbf-extra{font-size:12px;color:var(--tbf-mut);line-height:1.5;margin:0}
.tbf-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;position:relative;margin-top:auto}
a.tbf-sku{color:var(--tbf-fg);text-decoration:none}
a.tbf-sku:hover{color:var(--tbf-acctx);text-decoration:underline}
.tbf-go{font-family:var(--tbf-head);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--tbf-onacc)!important;background:linear-gradient(90deg,var(--tbf-acc),var(--tbf-acc2));border-radius:50rem;padding:8px 16px;text-decoration:none!important;white-space:nowrap}
.tbf-go:hover{filter:brightness(1.08)}
.tbf-go:focus-visible{outline:2px solid var(--tbf-acc);outline-offset:2px}
.tbf-info{font:inherit;font-size:12px;color:var(--tbf-mut);background:none;border:0;padding:2px 0;cursor:help;display:inline-flex;gap:6px;align-items:center;text-decoration:underline dotted;text-underline-offset:3px}
.tbf-info:hover,.tbf-info[aria-expanded="true"]{color:var(--tbf-fg)}
.tbf-info:focus-visible{outline:2px solid var(--tbf-acc);outline-offset:2px}
.tbf-info svg{flex:none}
.tbf-tip{position:absolute;left:-17px;right:-17px;top:100%;margin-top:4px;z-index:30;background:var(--tbf-pop);border:1px solid var(--tbf-line2);border-radius:4.8px;padding:12px 14px;box-shadow:var(--tbf-shadow);max-height:340px;overflow:auto}
.tbf-tip h4{margin:0 0 6px;font-family:var(--tbf-head);font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--tbf-acctx)}
.tbf-tip ul{margin:0;padding:0 0 0 16px;font-size:12px;line-height:1.55;color:var(--tbf-fg)}
.tbf-more{grid-column:1/-1;display:grid;justify-items:center;gap:6px;padding-top:10px}
.tbf-more p{margin:0;font-size:12px;color:var(--tbf-mut)}
.tbf-morebtn{font-family:var(--tbf-head);font-size:14px;font-weight:600;text-transform:uppercase;color:#fff;border:0;border-radius:50rem;padding:13px 30px;cursor:pointer;background:linear-gradient(90deg,var(--tbf-acc) 0%,var(--tbf-acc2) 100%);text-shadow:0 1px 1px rgba(0,0,0,.3);box-shadow:2px 2px var(--tbf-line)}
.tbf-morebtn:focus-visible{outline:3px solid var(--tbf-acc2);outline-offset:3px}
.tbf-empty{grid-column:1/-1;border:1px dashed var(--tbf-line);padding:28px;text-align:center;color:var(--tbf-mut);font-size:14px}
.tbf-toast{font-size:12px;color:var(--tbf-acctx)}
.tbf-dds{grid-template-columns:repeat(4,minmax(0,1fr))}
.tbf-dd{position:relative}
.tbf-dd-btn{font:inherit;font-size:13px;width:100%;border-radius:50rem;display:flex;justify-content:space-between;align-items:center;gap:10px;color:var(--tbf-mut);background:var(--tbf-card);border:1px solid var(--tbf-line);padding:9px 12px;cursor:pointer;text-align:left}
.tbf-dd-btn:hover,.tbf-dd-btn[aria-expanded="true"]{border-color:var(--tbf-acc)}
.tbf-dd-btn:focus-visible{outline:2px solid var(--tbf-acc);outline-offset:2px}
.tbf-dd-btn.tbf-has{color:var(--tbf-fg);border-color:var(--tbf-acc)}
.tbf-sum{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tbf-dd-btn svg{flex:none}
.tbf-dd-panel{position:absolute;left:0;right:0;top:100%;margin-top:4px;z-index:40;background:var(--tbf-pop);border:1px solid var(--tbf-line2);border-radius:4.8px;padding:6px;display:grid;gap:2px;max-height:320px;overflow:auto;box-shadow:var(--tbf-shadow);min-width:240px}
.tbf-chip.tbf-row{border:0;width:100%;padding:8px 8px;font-size:13px;display:flex;align-items:center;gap:10px;text-align:left}
.tbf-row .tbf-lbl{flex:1;min-width:0}
.tbf-chip.tbf-row:hover:not(:disabled){background:var(--tbf-bg)}
.tbf-chip.tbf-row[aria-pressed="true"]{background:transparent;color:var(--tbf-fg);font-weight:600}
.tbf-chip.tbf-row[aria-pressed="true"] .tbf-n{color:var(--tbf-mut);opacity:1}
.tbf-box{width:16px;height:16px;border:1px solid var(--tbf-mut);border-radius:3px;flex:none;display:grid;place-items:center}
.tbf-row[aria-pressed="true"] .tbf-box{background:var(--tbf-acc);border-color:var(--tbf-acc)}
.tbf-row[aria-pressed="true"] .tbf-box::after{content:"";width:8px;height:4px;border:2px solid var(--tbf-onacc);border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.tbf-i{position:relative;display:inline-grid;place-items:center;width:15px;height:15px;margin-left:6px;border:1px solid currentColor;border-radius:50%;font-size:10px;font-weight:700;text-transform:none;letter-spacing:0;cursor:help;color:var(--tbf-acc)}
.tbf-i:focus-visible{outline:2px solid var(--tbf-acc);outline-offset:2px}
.tbf-i::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);width:max-content;max-width:240px;background:var(--tbf-pop);color:var(--tbf-fg);border:1px solid var(--tbf-line2);border-radius:4.8px;box-shadow:var(--tbf-shadow);padding:8px 10px;font-size:12px;font-weight:400;line-height:1.45;white-space:normal;z-index:50;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s}
.tbf-i:hover::after,.tbf-i:focus::after{opacity:1;visibility:visible}
@media (max-width:560px){.tbf-i::after{left:auto;right:-10px;transform:none}}
@media (max-width:900px){.tbf-grid,.tbf-dds,.tbf-grid.tbf-main{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.tbf-grid:not(.tbf-main):not(.tbf-dds){grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:560px){.tbf{padding-block:48px}.tbf-filters{padding:16px}.tbf-grid.tbf-main,.tbf-grid,.tbf-dds{grid-template-columns:1fr}.tbf-results{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.tbf-chip{transition:none}}
/* Compact finder (FZ-55: four short filters): all groups on one row, options stacked under each heading */
.tbf-compact .tbf-grid.tbf-main{grid-template-columns:repeat(4,minmax(0,1fr))}
.tbf-compact .tbf-main .tbf-chips{flex-direction:column;align-items:stretch;max-width:240px}
.tbf-compact .tbf-main .tbf-chip{justify-content:center}
@media (max-width:900px){.tbf-compact .tbf-grid.tbf-main{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.tbf-compact .tbf-grid.tbf-main{grid-template-columns:repeat(2,minmax(0,1fr))}.tbf-compact .tbf-main .tbf-chip{font-size:13px;padding:9px 10px}}
/* Quote-only configurations (Getac): price reads "Quote", the button opens the Quick Quote form with the SKU filled in. */
.tbf-price.tbf-q{font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--tbf-acctx)}
button.tbf-go{border:0;cursor:pointer;line-height:normal}
/* 'finder_flow' (Getac): every filter group shows its options two per row (equal-width buttons). Groups share each row's
   width (each grows by the same amount), so rows are filled evenly, including a shorter last row.
   "More Options" gets a full row of its own: one line when its buttons fit, otherwise two even lines. */
.tbf-flow .tbf-filters{gap:18px}
.tbf-flow .tbf-grid,.tbf-flow .tbf-grid.tbf-main{display:flex;flex-wrap:wrap;align-items:flex-start;gap:18px 24px}
.tbf-flow .tbf-g{flex:1 0 auto}
.tbf-flow .tbf-chips{display:inline-grid;grid-template-columns:repeat(2,1fr);gap:6px}
.tbf-flow .tbf-chip{justify-content:center;text-align:center}
.tbf-flow .tbf-main .tbf-chip{font-size:13.5px;padding:8px 13px}
.tbf-flow .tbf-g.tbf-full{flex-basis:100%}
.tbf-flow .tbf-g.tbf-full .tbf-chips{display:grid;grid-template-columns:repeat(var(--tbf-cols,4),auto)} /* columns per model from the data (one line when they fit) */
@media (max-width:1100px){.tbf-flow .tbf-g.tbf-full .tbf-chips{grid-template-columns:repeat(min(var(--tbf-cols,4),4),auto)}}
@media (max-width:700px){.tbf-flow .tbf-g.tbf-full .tbf-chips{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.tbf-flow .tbf-grid,.tbf-flow .tbf-grid.tbf-main{gap:14px 18px}}

/* Every configuration as a plain link under the finder (parts/model/finder.php, Oct 25) */
.tbf-all{background:var(--tbf-card);border:1px solid var(--tbf-line);border-radius:4.8px;padding:0}
.tbf-all summary{cursor:pointer;padding:14px 18px;font-family:var(--tbf-head);font-weight:600;font-size:15px;color:var(--tbf-fg)}
.tbf-all summary:focus-visible{outline:2px solid var(--tbf-acc);outline-offset:2px}
.tbf-all-list{list-style:none;margin:0;padding:4px 18px 16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2px 24px;font-size:14px;line-height:1.5}
.tbf-all-list li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;padding:7px 0;border-bottom:1px solid var(--tbf-line)}
.tbf-all-list a{color:var(--tbf-acctx);text-decoration:none}
.tbf-all-list a:hover{text-decoration:underline}
.tbf-all-list span{color:var(--tbf-mut)}
.tbf-all-list .tbf-all-fed{font-size:12px;border:1px solid var(--tbf-line2);border-radius:3px;padding:0 5px}
.tbf-all-list em{font-style:normal;font-weight:600;margin-left:auto;color:var(--tbf-fg)}
@media (max-width:560px){.tbf-all-list{grid-template-columns:1fr;padding:4px 14px 14px}}