/* QA101.31 — QR image without a text badge; language at the header end.
 * Desktop bands: 34 + 112 + 50 = 196px, plus the existing 1px border.
 * Header contents follow the reference's 1320px container with 12px gutters.
 * Page sections and hero keep their existing dimensions.
 */
.sppauto-theme .sppauto-header { background:#fff; }
.sppauto-theme .sppauto-header [hidden] { display:none!important; }
.sppauto-theme .sppauto-header .wrap { width:min(calc(100% - 48px),1296px); }
.sppauto-theme .sppauto-topbar { height:34px; background:#e5e5e5; color:#111; }
.sppauto-theme .sppauto-topbar-inner { height:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.sppauto-theme .sppauto-topbar-contact { display:flex; align-items:center; gap:14px; min-width:0; }
.sppauto-theme .sppauto-topbar-contact a { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; font-size:12px; line-height:18px; direction:ltr; }
.sppauto-theme .sppauto-topbar-contact a+a { border-inline-start:1px solid #aaa; padding-inline-start:14px; }
.sppauto-theme .sppauto-topbar-contact svg { width:14px; height:14px; flex-shrink:0; }
.sppauto-theme .sppauto-topbar-social { display:flex; flex-shrink:0; align-items:center; gap:8px; margin-inline-start:auto; }
.sppauto-theme .sppauto-topbar-social a { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#000; color:#fff; }
.sppauto-theme .sppauto-topbar-social svg { width:14px; height:14px; }
.sppauto-theme .sppauto-header .nav { height:112px; grid-template-columns:260px minmax(0,1fr) auto; gap:24px; }
.sppauto-theme .sppauto-header .logo { min-width:0; }
.sppauto-theme .sppauto-header .logo img { display:block; width:260px; max-width:100%; height:auto; }
.sppauto-theme .sppauto-header .header-sppmatch-search { min-width:0; max-width:700px; }
.sppauto-theme .sppauto-header .header-search-shell { height:48px; background:rgba(248,249,249,.86); border-color:#dfe3e5; grid-template-columns:auto 1px minmax(0,1fr) 48px; box-shadow:none; font-family:"Aptos","Segoe UI","Helvetica Neue",Arial,sans-serif; }
.sppauto-theme .sppauto-header .header-search-shell:focus-within { background:#fff; border-color:#c3c9cc; box-shadow:0 12px 34px rgba(17,19,21,.09); }
.sppauto-theme .sppauto-header .header-sppmatch-brand { display:block; padding-inline:16px; font-size:16px; direction:ltr; unicode-bidi:isolate; }
.sppauto-theme .sppauto-header .header-search-divider { display:block; height:18px; }
.sppauto-theme .sppauto-header .header-search-form input { grid-column:3; height:46px; font-size:11px; padding-inline:15px; }
.sppauto-theme .sppauto-header .header-search-form button { grid-column:4; width:48px; height:46px; background:transparent; color:#34393c; border:0; border-inline-start:1px solid #e0e3e5; }
.sppauto-theme .sppauto-header .header-search-form svg { width:17px; height:17px; }
.sppauto-theme .sppauto-header .header-search-shell.is-searching .header-search-form button,
.sppauto-theme .sppauto-header .header-search-form button:hover,
.sppauto-theme .sppauto-header .header-search-form button:focus-visible { background:var(--red); color:#fff; }
.sppauto-theme .sppauto-header .header-actions { justify-self:end; justify-content:flex-end; gap:10px; }
.sppauto-theme .sppauto-header .header-actions>.lang-switcher { display:block; }
.sppauto-theme .sppauto-header .lang-trigger { height:44px; background:#fff; border-color:#dfe3e5; color:#22272a; font-family:"Aptos","Segoe UI","Helvetica Neue",Arial,sans-serif; white-space:nowrap; }
.sppauto-theme .sppauto-header .lang-name { display:inline; }
.sppauto-theme .sppauto-header .lang-trigger:hover,
.sppauto-theme .sppauto-header .lang-trigger[aria-expanded="true"] { background:#f7f8f8; border-color:#bfc5c8; color:#22272a; }
.sppauto-theme .sppauto-header-qr { display:flex; align-items:center; gap:14px; color:#fff; }
.sppauto-theme .sppauto-header-qr img { display:block; width:75px; height:75px; }
.sppauto-theme .sppauto-primary-nav { height:50px; background:#000; color:#fff; }
.sppauto-theme .sppauto-primary-links { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); height:100%; }
.sppauto-theme .sppauto-primary-links>a { display:flex; align-items:center; justify-content:center; min-width:0; padding-inline:10px; color:#fff; font-size:15px; font-weight:500; line-height:1.2; text-align:center; }
.sppauto-theme .sppauto-primary-links>a[aria-current="page"] { background:#d00000; }
.sppauto-theme .sppauto-primary-links>a:hover,
.sppauto-theme .sppauto-primary-links>a:focus-visible { background:#b90000; color:#fff; }
.sppauto-theme .sppauto-primary-links>a:focus-visible { outline-color:#fff; outline-offset:-3px; }
.sppauto-theme .sppauto-qr-dialog { position:fixed; margin:auto; width:min(370px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow:auto; border:1px solid #ddd; padding:30px; background:#fff; color:#111; text-align:center; font-family:inherit; }
.sppauto-theme .sppauto-qr-dialog::backdrop { background:#0009; }
.sppauto-theme .sppauto-qr-dialog:not([open]) { display:none; }
.sppauto-theme .sppauto-qr-close { display:grid; place-items:center; margin-block:0 4px; margin-inline:auto 0; width:36px; height:36px; border:1px solid #ddd; background:#fff; color:#111; font-size:24px; cursor:pointer; }
.sppauto-theme .sppauto-qr-dialog h2 { margin:0 0 10px; font-size:24px; }
.sppauto-theme .sppauto-qr-dialog p { margin:0 0 10px; font-size:13px; line-height:1.5; color:#555; }
.sppauto-theme .sppauto-qr-dialog img { width:264px; height:auto; max-width:100%; margin:0 auto 16px; }
.sppauto-theme .sppauto-qr-catalog { display:block; padding:13px 16px; background:#c90000; color:#fff; font-size:13px; }
@media(max-width:1200px) and (min-width:761px) {
  .sppauto-theme .sppauto-topbar-email { display:none!important; }
  .sppauto-theme .sppauto-header .nav { grid-template-columns:230px minmax(0,1fr) auto; gap:18px; }
  .sppauto-theme .sppauto-header .logo img { width:230px; }
  .sppauto-theme .sppauto-header-qr { gap:10px; }
  .sppauto-theme .sppauto-header-qr img { width:64px; height:64px; }
  .sppauto-theme .sppauto-primary-links>a { font-size:13px; }
}
/* Keep the 112px band at tablet widths: logo beside search and controls. */
@media(max-width:1000px) and (min-width:761px) {
  .sppauto-theme .sppauto-header .nav { grid-template-columns:230px minmax(0,1fr); grid-template-rows:48px 44px; grid-template-areas:"logo search" "logo actions"; gap:8px 18px; padding-block:6px; }
  .sppauto-theme .sppauto-header .logo { grid-area:logo; }
  .sppauto-theme .sppauto-header .header-sppmatch-search { grid-area:search; }
  .sppauto-theme .sppauto-header .header-actions { grid-area:actions; }
  .sppauto-theme .sppauto-header-qr img { width:44px; height:44px; }
}
@media(max-width:760px) {
  .sppauto-theme .sppauto-header .wrap { width:calc(100% - 28px); }
  .sppauto-theme .sppauto-topbar { height:30px; }
  .sppauto-theme .sppauto-topbar-inner { justify-content:space-between; gap:10px; }
  .sppauto-theme .sppauto-topbar-contact { gap:10px; }
  .sppauto-theme .sppauto-topbar-contact a { font-size:10px; gap:4px; }
  .sppauto-theme .sppauto-topbar-contact svg { width:12px; height:12px; }
  .sppauto-theme .sppauto-topbar-contact a+a { padding-inline-start:0; border:0; }
  .sppauto-theme .sppauto-topbar-social { gap:6px; }
  .sppauto-theme .sppauto-topbar-social a { width:20px; height:20px; }
  .sppauto-theme .sppauto-topbar-social svg { width:12px; height:12px; }
  .sppauto-theme .sppauto-topbar-landline,
  .sppauto-theme .sppauto-topbar-email,
  .sppauto-theme .sppauto-header-qr { display:none!important; }
  .sppauto-theme .sppauto-primary-links { display:flex; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; }
  .sppauto-theme .sppauto-primary-links::-webkit-scrollbar { display:none; }
  .sppauto-theme .sppauto-primary-links>a { flex:0 0 auto; min-width:96px; padding-inline:16px; font-size:12px; white-space:nowrap; }
  .sppauto-theme .sppauto-header .nav { min-height:128px; height:128px; padding-block:8px; gap:12px; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:52px 48px; }
  .sppauto-theme .sppauto-header .logo img { width:190px; }
  .sppauto-theme .sppauto-header .header-sppmatch-search { max-width:none; }
  .sppauto-theme .sppauto-header .header-sppmatch-brand { padding-inline:11px; font-size:14px; }
  .sppauto-theme .sppauto-header .header-search-form input { height:46px; font-size:16px; padding-inline:12px; }
  .sppauto-theme .sppauto-header .header-search-form button { width:48px; height:46px; }
  .sppauto-theme .sppauto-header .header-actions { gap:8px; }
  .sppauto-theme .sppauto-header .lang-trigger { height:44px; min-width:52px; padding-inline:8px; gap:6px; }
  .sppauto-theme .sppauto-header .lang-name { display:none; }
}
@media(max-width:380px) {
  .sppauto-theme .sppauto-header .logo img { width:160px; }
}

/* QA102.14 — center the QR between the product search and language selector. */
@media (min-width:1201px){
  .sppauto-theme .sppauto-header .nav{grid-template-columns:260px minmax(0,1fr) 143px auto;gap:24px}
  .sppauto-theme .sppauto-header .header-sppmatch-search{max-width:none;justify-self:stretch}
  .sppauto-theme .sppauto-header .header-actions{display:contents}
  .sppauto-theme .sppauto-header .sppauto-header-qr{justify-self:center}
  .sppauto-theme .sppauto-header .lang-switcher{justify-self:end}
}
@media (max-width:1200px) and (min-width:1001px){
  .sppauto-theme .sppauto-header .nav{grid-template-columns:230px minmax(0,1fr) 96px auto;gap:18px}
  .sppauto-theme .sppauto-header .header-sppmatch-search{max-width:none;justify-self:stretch}
  .sppauto-theme .sppauto-header .header-actions{display:contents}
  .sppauto-theme .sppauto-header .sppauto-header-qr{justify-self:center}
  .sppauto-theme .sppauto-header .lang-switcher{justify-self:end}
}

/* QA103.66 — Center product search in the real gap between logo and QR. */
@media (min-width:1201px){
  .sppauto-theme .sppauto-header .nav{
    grid-template-columns:260px minmax(0,1fr) 75px auto;
    gap:24px;
  }
  .sppauto-theme .sppauto-header .header-sppmatch-search{
    width:min(94%,900px);
    max-width:900px;
    justify-self:center;
  }
  .sppauto-theme .sppauto-header .sppauto-header-qr{
    width:75px;
    justify-self:center;
  }
}
@media (max-width:1200px) and (min-width:1001px){
  .sppauto-theme .sppauto-header .nav{
    grid-template-columns:230px minmax(0,1fr) 64px auto;
    gap:18px;
  }
  .sppauto-theme .sppauto-header .header-sppmatch-search{
    width:96%;
    max-width:760px;
    justify-self:center;
  }
  .sppauto-theme .sppauto-header .sppauto-header-qr{
    width:64px;
    justify-self:center;
  }
}
