/* ══════════════════════════════════════════════════════════
   AAryans.cz — Mobile Icon & Header Fixes
   ══════════════════════════════════════════════════════════ */

@media screen and (max-width: 767px) {

  /* ── Logo: slightly smaller so header is less cramped ── */
  .site-name-wrapper img {
    max-height: 48px !important;   /* reduced from native ~60px */
    width: auto !important;
  }
  .site-name-wrapper {
    max-width: 58% !important;     /* prevent logo pushing icons off screen */
  }

  /* ── Icon cluster: position relative to .top-navigation-bar (sticky, top:0, height:0)
     Logo center sits at viewport y≈52; icons are 40px tall → top = 52−20 = 32px      ── */
  .top-navigation-tools,
  .top-navigation-tools--language {
    top:       32px !important;
    bottom:    auto !important;
    transform: none !important;
    right:     12px !important;
  }

  /* ── Icon row: compact horizontal flex ── */
  .responsive-tools {
    gap: 2px !important;
  }

  /* ── All three icons: same 40×40 box ── */
  .responsive-tools .cart-count,
  .responsive-tools .toggle-window[data-target="login"],
  .responsive-tools .toggle-window[data-target="menu"] {
    width:           40px !important;
    min-width:       40px !important;
    height:          40px !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    flex-shrink:     0 !important;
  }

  /* ── Cart: needs position:relative so badge <i> can be anchored ── */
  .responsive-tools .cart-count {
    position: relative !important;
  }

  /* ── Shopping-bag SVG (FV Studio rule lost when cart moved to .responsive-tools) ── */
  .responsive-tools .cart-count::before {
    background-image:    url("https://cdn.myshoptet.com/usr/api.fv-studio.cz/user/documents/upload/clients/aaryans/img/shopping-bag-blue.svg") !important;
    background-size:     contain !important;
    background-repeat:   no-repeat !important;
    background-position: center !important;
    width:               30px !important;
    height:              30px !important;
    display:             inline-block !important;
    content:             '' !important;
    font-size:           0 !important;
    color:               transparent !important;
  }

  /* ── Cart badge: circle top-right of the bag ── */
  .responsive-tools .cart-count i {
    position:        absolute !important;
    top:             -4px !important;
    right:           -4px !important;
    min-width:       18px !important;
    height:          18px !important;
    padding:         0 3px !important;
    box-sizing:      border-box !important;
    border-radius:   50% !important;
    background-color: #0B3C5D !important;
    color:           #fff !important;
    font-size:       10px !important;
    font-style:      normal !important;
    font-weight:     700 !important;
    line-height:     18px !important;
    text-align:      center !important;
    display:         block !important;
    z-index:         2 !important;
  }

  /* ── Login icon: brand blue ── */
  .responsive-tools .toggle-window[data-target="login"],
  .responsive-tools .toggle-window[data-target="login"]::before {
    color: #0075A0 !important;
  }

  /* ── Dead-zone fix: no gap between search bar and page content ── */
  .breadcrumbs-wrapper,
  .container.breadcrumbs-wrapper {
    margin-top:  0 !important;
    padding-top: 0 !important;
  }
  #content-wrapper,
  .content-wrapper:not(.homepage-box) {
    margin-top:  0 !important;
    padding-top: 0 !important;
  }
  .product-detail,
  .detail-box,
  .product-page {
    margin-top:  0 !important;
    padding-top: 0 !important;
  }

}
