/* FIX180 — Mobile/tablet header: remove duplicate top cart, enlarge logo.
   Desktop >=900px remains unchanged. */

@media (max-width:899px){
  body.sp-ios-home{
    --sp180-edge:clamp(5px,1.7vw,10px);
    --sp180-gap:clamp(5px,1.3vw,9px);
    --sp180-logo:clamp(46px,12.5vw,60px);
    --sp180-control:clamp(40px,10.8vw,50px);
    --sp180-camera:clamp(40px,10.5vw,48px);
    --sp180-radius:clamp(13px,3.5vw,18px);
  }

  /* Three columns only: Logo | Search | Camera */
  body.sp-ios-home .sl-online-header-inner{
    box-sizing:border-box!important;
    width:calc(100% - (var(--sp180-edge) * 2))!important;
    max-width:none!important;
    min-width:0!important;
    min-height:calc(var(--sp180-control) + 10px)!important;
    margin-inline:var(--sp180-edge)!important;
    padding:5px!important;

    display:grid!important;
    grid-template-columns:
      var(--sp180-logo)
      minmax(0,1fr)
      var(--sp180-camera)!important;
    grid-template-rows:1fr!important;
    grid-auto-flow:column!important;

    gap:var(--sp180-gap)!important;
    align-items:center!important;
    overflow:visible!important;
  }

  /* Remove duplicate header cart completely on phone/tablet. */
  body.sp-ios-home .sl-header-cart{
    display:none!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* Larger, clearer clickable logo. */
  body.sp-ios-home .sl-header-logo-link{
    grid-column:1!important;
    grid-row:1!important;

    box-sizing:border-box!important;
    width:var(--sp180-logo)!important;
    min-width:var(--sp180-logo)!important;
    max-width:var(--sp180-logo)!important;
    height:var(--sp180-control)!important;
    min-height:var(--sp180-control)!important;
    max-height:var(--sp180-control)!important;

    margin:0!important;
    padding:clamp(2px,.65vw,4px)!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    border:1px solid rgba(243,107,45,.08)!important;
    border-radius:var(--sp180-radius)!important;
    background:linear-gradient(180deg,#fff8f2 0%,#fff2e6 100%)!important;
    box-shadow:0 3px 10px rgba(243,107,45,.07)!important;
    overflow:hidden!important;
  }

  body.sp-ios-home .sl-header-logo{
    width:calc(var(--sp180-control) - 4px)!important;
    height:calc(var(--sp180-control) - 4px)!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    filter:none!important;
  }

  /* Search now gets all space freed by the removed cart. */
  body.sp-ios-home .sl-header-search{
    grid-column:2!important;
    grid-row:1!important;

    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:var(--sp180-control)!important;
    min-height:var(--sp180-control)!important;
    max-height:var(--sp180-control)!important;

    margin:0!important;
    padding-inline:clamp(7px,1.8vw,11px)!important;
    border-radius:var(--sp180-radius)!important;
  }

  body.sp-ios-home .sl-header-search-input{
    min-width:0!important;
    width:100%!important;
    font-size:clamp(11px,3.2vw,14px)!important;
  }

  body.sp-ios-home .sl-header-search-input::placeholder{
    font-size:clamp(10px,3vw,13px)!important;
  }

  /* Camera remains visible, but is secondary to search. */
  body.sp-ios-home .sl-header-scan{
    grid-column:3!important;
    grid-row:1!important;

    box-sizing:border-box!important;
    width:var(--sp180-camera)!important;
    min-width:var(--sp180-camera)!important;
    max-width:var(--sp180-camera)!important;
    height:var(--sp180-control)!important;
    min-height:var(--sp180-control)!important;
    max-height:var(--sp180-control)!important;

    margin:0!important;
    padding:0!important;
    border-radius:var(--sp180-radius)!important;
  }

  body.sp-ios-home .sl-header-scan svg{
    width:clamp(18px,5vw,22px)!important;
    height:clamp(18px,5vw,22px)!important;
  }
}

/* Narrow Android phones */
@media (max-width:359px){
  body.sp-ios-home{
    --sp180-edge:4px;
    --sp180-gap:4px;
    --sp180-logo:42px;
    --sp180-control:36px;
    --sp180-camera:36px;
    --sp180-radius:12px;
  }

  body.sp-ios-home .sl-online-header-inner{
    padding:4px!important;
  }

  body.sp-ios-home .sl-header-logo{
    width:34px!important;
    height:34px!important;
  }

  body.sp-ios-home .sl-header-search-input,
  body.sp-ios-home .sl-header-search-input::placeholder{
    font-size:10px!important;
  }
}

/* Typical phones */
@media (min-width:360px) and (max-width:430px){
  body.sp-ios-home{
    --sp180-logo:clamp(46px,12vw,50px);
    --sp180-control:clamp(40px,10.5vw,44px);
    --sp180-camera:clamp(39px,10vw,42px);
  }
}

/* Large phones */
@media (min-width:431px) and (max-width:599px){
  body.sp-ios-home{
    --sp180-logo:54px;
    --sp180-control:46px;
    --sp180-camera:44px;
    --sp180-gap:7px;
  }
}

/* Tablet */
@media (min-width:600px) and (max-width:899px){
  body.sp-ios-home{
    --sp180-logo:62px;
    --sp180-control:52px;
    --sp180-camera:50px;
    --sp180-gap:10px;
    --sp180-edge:12px;
    --sp180-radius:17px;
  }

  body.sp-ios-home .sl-online-header-inner{
    width:min(calc(100% - 24px),980px)!important;
    margin-inline:auto!important;
    padding:7px!important;
  }
}

/* Desktop keeps top cart because mobile bottom nav is not the primary navigation there. */
@media (min-width:900px){
  body.sp-ios-home .sl-header-cart{
    display:inline-flex!important;
  }
}
