/*
* Warna di bawah ini adalah warna default dari tema barka
* Silakan ubah nilainya jika menginginkan warna lain
*/
:root {
  --primary-color: #B52F1F;
  --secondary-color: #B52F1F;
  --tertiary-color: #F59E0B;
  --accent-color: #F59E0B;
  --loader-color: #B52F1F;
}

/* Fix HANYA foto kepala sekolah yang stretching di sidebar */
.bg-white.space-y-3.py-3 img[alt="Headmaster Photo"] {
  width: 100%;
  height: auto !important;
  object-fit: contain !important;
  max-width: 100%;
  aspect-ratio: auto !important;
}

/* Line clamp utility jika belum ada */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Smooth scroll untuk animasi */
html {
  scroll-behavior: smooth;
}

/* Force CSS Variables onto Tailwind Utility Classes */
.bg-primary,
.bg-secondary {
  background-color: var(--primary-color) !important;
}

.text-primary,
.text-secondary {
  color: var(--primary-color) !important;
}

.text-title {
  color: var(--primary-color) !important;
}

.text-tertiary,
.text-accent {
  color: var(--accent-color) !important;
}

.bg-accent,
.bg-tertiary {
  background-color: var(--accent-color) !important;
}

.border-tertiary,
.lg\:border-tertiary {
  border-color: var(--accent-color) !important;
}

.hover\:bg-accent:hover,
.hover\:bg-tertiary:hover {
  background-color: var(--accent-color) !important;
  color: #000000 !important;
}

.hover\:text-secondary:hover {
  color: var(--primary-color) !important;
}

.hover\:text-tertiary:hover {
  color: var(--accent-color) !important;
}

.text-yellow-400,
.text-yellow-500 {
  color: #F59E0B !important;
}

.bg-yellow-400,
.bg-yellow-500 {
  background-color: #F59E0B !important;
}

::selection {
  background: #B52F1F;
  color: #F59E0B;
}

.text-gray-100 {
  display: flex;
  align-items: center;
  white-space: nowrap; /* Prevents text wrapping */
}

.space-x-2 > * + * {
  margin-left: 0.5rem; /* Adjust spacing between phone and email */
}