﻿@font-face {
  font-family: Almarai;
  src: url("fonts/Almarai-Regular.ttf");
  font-display: swap;
}
:root {
  --primary: #00AD68;
  --dark-primary : #075E4A;
  --seconday: #F9D880;
  --dark-seconday: #CD9D35;
  --main-font: #435363;
  --gray-font: #7c8985;
  --light-gray: #EFEFEF;
  --light-bg: #fafbfa;
  --box-shadow: rgba(0, 0, 0, 0.08);
  --light-borders: rgba(231, 231, 231, 0.35);
  --list-limit: 6; 
  --main-font-family: Almarai;
  --text-h1: 3rem;
  --text-h2: 1.5rem;
  --text-lg: 1.25rem;
  --text-md: 1rem;
  --text-sm: 0.75rem;
  --rounded-sm: 5px;
  --rounded-md: 10px;
  --rounded-lg: 20px;
}
html[data-theme="dark"] {
  --light-bg: #1f1f1f;
  --dark-primary : #00AD68;
  --main-font: #8c9196;
}
a:hover {
  color: inherit;
  text-decoration: none;
}
.text-h1 {font-size: var(--text-h1) !important;}
.text-h2 {font-size: var(--text-h2) !important;}
.text-lg {font-size: var(--text-lg) !important;}
.text-md {font-size: var(--text-md) !important;}
.text-sm {font-size: var(--text-sm) !important;}

.text-primary { color: var(--primary) ;}
.text-dark-primary { color: var(--dark-primary);}
.text-seconday { color: var(--seconday);}
.text-dark-seconday { color: var(--dark-seconday);}
.text-main-font { color: var(--main-font);}
.text-gray-font { color: var(--gray-font);}

[dir=rtl] body {
  font-family: var(--main-font-family), sans-serif;
  font-size: 1.125rem;
  font-display: swap;

  
}

body [dir=rtl] {
  font-family: var(--main-font-family), sans-serif;
  font-size: 1.125rem;
  line-height: 30px;
   font-display: swap;

}

@media (max-width: 992px){
  .ds-footer-body {
    display: flex;
    flex-wrap: wrap;
  }
  .ds-footer-section {
    flex: 0 0 33%;
  }
  .ds-footer-section:last-child {
    flex: 0 0 100%;
  }
}
a {
  color: inherit;
  text-decoration: none;
}

/* tabs */
[tabContainer] {
  display: none !important;
}
[tabContainer].activeSection {
  display: block !important;
}
/*new tabs for html valitator*/
[data-tabContainer] {
  display: none !important;
}
[data-tabContainer].activeSection {
  display: block !important;
}


/* nds override */
.ds-text-input::placeholder {
  color: #babbba;
}