:root {
  --primary: #0066ff;
  --secondary: #ed6234;
  --blck: #424242;
  --gray: #adadad;
}

#header {
  direction: rtl;
}

#header * {
  box-sizing: border-box;
}

#header span {
  font-weight: inherit;
}

#header .orange {
  color: var(--secondary);
}

#header .blue {
  color: var(--primary);
}

#header strong {
  font-weight: bold;
}

#header button:focus {
  box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.5);
  outline: none;
}

#header button:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: none;
}

#header button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Hide legacy Xtra header so only header-main is visible */
#site_header.page_header,
#site_header {
  display: none !important;
}

/* Prevent unexpected theme background behind search icon */
#header #search-btn,
#header #search-btn svg,
#header #search-box .holder svg,
#header svg use[href="#search-ic"] {
  background: transparent !important;
  background-color: transparent !important;
}

/* Prevent parent-theme forced 48x48 on desktop logo anchor */
#header .logo > a.desktop {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

#header .logo > a.desktop img {
  width: 150px !important;
  height: auto !important;
  max-width: none !important;
  min-width: 0 !important;
}

.petboom-no-scroll,
body.petboom-no-scroll {
  overflow: hidden !important;
}

@media (max-width: 1026px) {
  /* Neutralize theme rule: .logo > a, .logo > h1, .logo h2 { width/height:48px !important; } */
  #header .logo > a,
  #header .logo > h1,
  #header .logo h2 {
    width: auto !important;
    height: auto !important;
  }
  #header .logo > a.desktop {
    display: none !important;
  }
  #header .logo > a.mobile {
    display: block !important;
  }

  /* Keep drawer opening below the visible mobile header row */

  /* Remove any inherited button/chrome background from hamburger */
  #header #hamburger,
  #header #hamburger:hover,
  #header #hamburger:focus,
  #header #hamburger:active,
  #header #hamburger svg {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* Prevent logo from being forced too small by global rules */

}

@media (min-width: 1027px) {
  #header .logo > a.desktop {
    display: block !important;
  }
  #header .logo > a.mobile {
    display: none !important;
  }
}