/* ==========================================================================
   IPEKERP_STOREFRONT_BRAND_RAIL_VISUAL_POLISH_V1_1

   Scope: existing vehicle-brand rail visual polish only.

   PRESERVED
   - Brand order
   - Brand href/search behavior
   - Existing local logo files / src values
   - Existing rail JS / arrows / scrolling behavior
   - Category navigation and category-only sticky behavior
   - Header/search/account/cart
   ========================================================================== */

@media (min-width: 1180px) {

  body .sf4-brand-rail[data-brand-rail="v2"] {
    background: #ffffff !important;
    border-bottom: 1px solid #edf1f5 !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand-rail__inner {
    height: 132px !important;
    min-height: 132px !important;
    padding-top: 12px !important;
    padding-bottom: 9px !important;
    gap: 10px !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand-rail__track {
    align-items: center !important;
    gap: 7px !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand {
    min-height: 102px !important;
    padding: 4px 3px 5px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;

    border: 1px solid transparent !important;
    border-radius: 14px !important;
    background: transparent !important;
    box-shadow: none !important;

    text-decoration: none !important;

    transition:
      background-color 150ms ease,
      border-color 150ms ease,
      box-shadow 150ms ease,
      transform 150ms ease !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand:hover,
  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand:focus-visible {
    background: #f8fbff !important;
    border-color: #dde9f5 !important;
    box-shadow: 0 7px 16px rgba(15, 42, 76, 0.055) !important;
    transform: translateY(-1px) !important;
    outline: none !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand__logo {
    width: 66px !important;
    height: 66px !important;
    min-width: 66px !important;
    min-height: 66px !important;

    display: grid !important;
    place-items: center !important;

    margin: 0 !important;
    padding: 5px !important;

    border: 1px solid #dbe5ef !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;

    box-shadow:
      0 3px 10px rgba(15, 42, 76, 0.045),
      inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;

    overflow: hidden !important;

    transition:
      border-color 150ms ease,
      box-shadow 150ms ease,
      transform 150ms ease !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand:hover .sf4-brand__logo,
  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand:focus-visible .sf4-brand__logo {
    border-color: #bcd3e9 !important;
    box-shadow:
      0 0 0 3px rgba(8, 104, 215, 0.055),
      0 6px 14px rgba(15, 42, 76, 0.065) !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand__logo > img.sf4-brand__asset.sf4-brand__asset--local {
    max-width: 56px !important;
    max-height: 54px !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand__logo--audi > img.sf4-brand__asset--local,
  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand__logo--ford > img.sf4-brand__asset--local,
  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand__logo--hyundai > img.sf4-brand__asset--local,
  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand__logo--citroen > img.sf4-brand__asset--local,
  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand__logo--landrover > img.sf4-brand__asset--local {
    max-width: 58px !important;
    max-height: 47px !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand__name {
    display: block !important;
    min-height: 15px !important;
    margin: 0 !important;

    color: #425670 !important;
    font-size: 10.3px !important;
    line-height: 1.12 !important;
    font-weight: 680 !important;
    letter-spacing: -0.01em !important;

    text-align: center !important;
    white-space: nowrap !important;

    transition: color 150ms ease !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand:hover .sf4-brand__name,
  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand:focus-visible .sf4-brand__name {
    color: #0b3566 !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand-rail__arrow {
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;

    border-color: #dce6f0 !important;
    background: #ffffff !important;
    color: #17375e !important;

    box-shadow: 0 5px 13px rgba(15, 42, 76, 0.06) !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand-rail__arrow:hover {
    border-color: #bed3e8 !important;
    background: #f8fbff !important;
    color: #0868d7 !important;

    transform: translateY(-1px) !important;
    box-shadow: 0 7px 16px rgba(15, 42, 76, 0.08) !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand-rail__arrow svg {
    width: 17px !important;
    height: 17px !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand[data-sf-brand-active="true"] {
    background: #f5f9fe !important;
    border-color: #c7dbef !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand[data-sf-brand-active="true"] .sf4-brand__logo {
    border-color: #8eb8e1 !important;
    box-shadow:
      0 0 0 3px rgba(8, 104, 215, 0.07),
      0 6px 15px rgba(15, 42, 76, 0.07) !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand[data-sf-brand-active="true"] .sf4-brand__name {
    color: #0868d7 !important;
    font-weight: 750 !important;
  }
}

@media (max-width: 1179px) {
  body .sf4-brand-rail[data-brand-rail="v2"]
  .sf4-brand {
    -webkit-tap-highlight-color: transparent;
  }
}