/* @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200;300;400;500;600;700;800;900&display=swap'); */

@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --color-main: #162A2B;
  --color-secondary: #CE931A;
  --bg-navbar: rgba(22, 42, 43, 0.66);
  /* Cairo font will be injected by Next.js font optimization via --font-cairo variable */
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

body {
  background-color: #fff;
  color: #000;
  font-family: var(--font-cairo, 'Cairo', sans-serif);
}

/* Ensure Cairo font is available for Tailwind arbitrary values like font-[Cairo] */
@layer utilities {
  .font-\[Cairo\] {
    font-family: var(--font-cairo, 'Cairo', sans-serif) !important;
  }
}

a {
  text-decoration: none;
}

::-moz-selection {
  background: rgba(250, 100, 9, 0.3);
}

::selection {
  background: rgba(250, 100, 9, 0.3);
}

::-webkit-scrollbar {
  width: 7px;
  height: 5px;
}

::-webkit-scrollbar-track {
  background-color: var(--bg-navbar);
}

::-webkit-scrollbar-thumb {
  background-color: #162A2B;
  border-radius: 0px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(22, 42, 43, 0.8);
}

::-webkit-scrollbar-corner {
  background-color: transparent;
}

/* Line Clamp Utilities */
/* .line-clamp-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
} */

/* Blog Specific Styles */
.bg-blog-gradient {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}