/* Add custom CSS styles below */ 

#mobile-nav{
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    direction: ltr;
}

#mobile-nav .mobile-nav--item{
    direction: rtl; /* يحافظ على النصوص بالعربي */
}

#mobile-nav .mob-categ{
    display: none !important;
}
@media (min-width: 640px) {
  .navbar-brand img {
    max-height: 9rem;
  }
}
.s-block--tabs-produtcs .tab-trigger.is-active button {
  border-color: #004000;
  background-color: #004000;
  color: white;
}

  .s-button-text {
  pointer-events: none;
  align-items: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
  color: white;
}


button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #004000;
  background-image: none;
}
@media (max-width: 768px) {
button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: white;
  background-image: none;
 }
}
@media (min-width: 768px) {
  .s-block--tabs-produtcs .tabs > :not([hidden]) ~ :not([hidden]) :hover {
   border-color: #004000;
  background-color: #004000;
  color: white; 
  }
}

.header-is-dark #mainnav .header-btn__icon {
  color: #ffb45a;
}

@media (min-width: 768px) {
  button, [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button;
    background-color: #004000;
    background-image: none;
  }
}

.s-button-element:not(:disabled):not([loading]) {
  pointer-events: auto;
  background: #004000;
}

.mobile-nav-outer .mobile-nav--item {
  background: #0040;
}
@media (min-width: 768px) {

  [type="button"]{
        background-color: white;
  }
}
.store-header .inner {
    background: #004000;
}

  

.header-is-dark .store-header .mburger i {
  color: #ffb45a;
}
  #app.user--left-only .store-header .hdi-btn-left {
    display: flex;
    background: white;
  }
}

@media (max-width: 768px){
  .store-header .sicon-search {
  vertical-align: middle;
  display: flex;
  background: #004000;
  color: white;
}
}