@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@600;700;800&family=Tajawal:wght@400;500;600;700&display=swap");

@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("fonts/ibm-plex-sans-arabic-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("fonts/ibm-plex-sans-arabic-500.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("fonts/ibm-plex-sans-arabic-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("fonts/ibm-plex-sans-arabic-700.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("fonts/inter-latin.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --alenezi-ui-font: "Tajawal", "IBM Plex Sans Arabic", "Segoe UI", Tahoma, sans-serif;
  --alenezi-heading-font: "Cairo", "Tajawal", "IBM Plex Sans Arabic", "Segoe UI", Tahoma, sans-serif;
}

html { font-size: 17px; }
body, button, input, textarea, select { font-family: var(--alenezi-ui-font) !important; }
h1, h2, h3, h4, .admin-logo b, .store-brand b { font-family: var(--alenezi-heading-font) !important; font-weight: 700; }

@media (max-width: 620px) {
  html { font-size: 16px; }
}
