:root {
  --background-50: 0.997 0.001 106.423;
  --background-100: 0.962 0.001 106.423;
  --background-200: 0.907 0.001 106.423;
  --background-300: 0.827 0.001 106.423;
  --background-400: 0.717 0.001 106.423;
  --background-500: 0.587 0.001 106.423;
  --background-600: 0.457 0.001 106.423;
  --background-700: 0.347 0.001 106.423;
  --background-800: 0.257 0.001 106.423;
  --background-900: 0.177 0.001 106.423;
  --background-950: 0.107 0.001 106.423;
  --accent-50: 0.97 0.014 242.574;
  --accent-100: 0.935 0.023 242.574;
  --accent-200: 0.875 0.038 242.574;
  --accent-300: 0.78 0.059 242.574;
  --accent-400: 0.67 0.086 242.574;
  --accent-500: 0.51 0.113 242.574;
  --accent-600: 0.5 0.109 242.574;
  --accent-700: 0.4 0.095 242.574;
  --accent-800: 0.31 0.074 242.574;
  --accent-900: 0.23 0.055 242.574;
  --accent-950: 0.15 0.036 242.574;
  --primary-50: 0.97 0.013 250.825;
  --primary-100: 0.935 0.021 250.825;
  --primary-200: 0.875 0.036 250.825;
  --primary-300: 0.78 0.055 250.825;
  --primary-400: 0.67 0.08 250.825;
  --primary-500: 0.427 0.105 250.825;
  --primary-600: 0.5 0.101 250.825;
  --primary-700: 0.4 0.088 250.825;
  --primary-800: 0.31 0.073 250.825;
  --primary-900: 0.23 0.059 250.825;
  --primary-950: 0.15 0.043 250.825;
  --secondary-50: 0.97 0.015 244.049;
  --secondary-100: 0.935 0.025 244.049;
  --secondary-200: 0.875 0.043 244.049;
  --secondary-300: 0.78 0.066 244.049;
  --secondary-400: 0.67 0.096 244.049;
  --secondary-500: 0.512 0.126 244.049;
  --secondary-600: 0.5 0.121 244.049;
  --secondary-700: 0.4 0.099 244.049;
  --secondary-800: 0.31 0.076 244.049;
  --secondary-900: 0.23 0.057 244.049;
  --secondary-950: 0.15 0.037 244.049;
  --foreground-50: 0.97 0.003 284.49;
  --foreground-100: 0.93 0.004 284.49;
  --foreground-200: 0.86 0.005 284.49;
  --foreground-300: 0.76 0.007 284.49;
  --foreground-400: 0.65 0.01 284.49;
  --foreground-500: 0.54 0.013 284.49;
  --foreground-600: 0.43 0.016 284.49;
  --foreground-700: 0.34 0.018 284.49;
  --foreground-800: 0.27 0.02 284.49;
  --foreground-900: 0.2 0.021 284.49;
  --foreground-950: 0.219 0.021 284.49;
  --font-heading: "Tajawal", "Cairo", "Noto Sans Arabic", sans-serif;
  --font-body: "Tajawal", "Cairo", "Noto Sans Arabic", sans-serif;
}

html { scroll-behavior: smooth; overflow-x: hidden; }

body {
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  background: oklch(var(--background-50));
  color: oklch(var(--foreground-950));
  overflow-x: hidden;
}

.font-heading, h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); }

@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 0 0 0 oklch(var(--accent-500) / 0.35), 0 0 0 0 oklch(var(--accent-500) / 0.2); }
  50% { box-shadow: 0 0 0 10px oklch(var(--accent-500) / 0), 0 0 0 14px oklch(var(--accent-500) / 0); }
}
.glow-ring {
  animation: glow-pulse 2.2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  border-color: oklch(var(--accent-500) / 0.5) !important;
}

.article-content h1 {
  font-size: 1.75rem;
  font-weight: 800;
  color: oklch(var(--foreground-900));
  margin-top: 2rem;
  margin-bottom: 1rem;
  line-height: 1.3;
  font-family: var(--font-heading);
}
.article-content h2 {
  font-size: 1.3rem;
  font-weight: 700;
  color: oklch(var(--foreground-900));
  margin-top: 2rem;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid oklch(var(--primary-200));
  font-family: var(--font-heading);
}
.article-content h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: oklch(var(--foreground-900));
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
  font-family: var(--font-heading);
}
.article-content h4 {
  font-size: 1.05rem;
  font-weight: 700;
  color: oklch(var(--foreground-800));
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
  font-family: var(--font-heading);
}
.article-content p {
  margin-bottom: 1.25rem;
  line-height: 1.85;
  color: oklch(var(--foreground-800));
}
.article-content ul {
  list-style: none;
  padding-right: 0;
  margin-bottom: 1.25rem;
}
.article-content ul li {
  position: relative;
  padding-right: 1.5rem;
  margin-bottom: 0.75rem;
  line-height: 1.75;
  color: oklch(var(--foreground-800));
}
.article-content ul li::before {
  content: "";
  position: absolute;
  right: 0;
  top: 0.6rem;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: oklch(var(--primary-400));
}
.article-content ol {
  padding-right: 1.75rem;
  margin-bottom: 1.25rem;
  list-style: decimal;
}
.article-content ol li {
  margin-bottom: 0.75rem;
  line-height: 1.75;
  color: oklch(var(--foreground-800));
}
.article-content a {
  color: oklch(var(--primary-600));
  text-decoration: underline;
  font-weight: 500;
}
.article-content a:hover { color: oklch(var(--primary-700)); }

.article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 0.75rem;
  margin: 1.5rem auto;
  display: block;
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
}
.article-content figure { margin: 1.5rem 0; }
.article-content figcaption {
  text-align: center;
  font-size: 0.875rem;
  color: oklch(var(--foreground-500));
  margin-top: 0.5rem;
}

.article-content blockquote {
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
  border-right: 4px solid oklch(var(--primary-500));
  background: oklch(var(--primary-50));
  border-radius: 0.5rem;
  color: oklch(var(--foreground-700));
  font-style: italic;
}
.article-content blockquote p:last-child { margin-bottom: 0; }

.article-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  font-size: 0.95rem;
  overflow-x: auto;
  display: block;
}
.article-content thead { background: oklch(var(--background-100)); }
.article-content th,
.article-content td {
  border: 1px solid oklch(var(--background-200));
  padding: 0.65rem 0.9rem;
  text-align: right;
}
.article-content th { font-weight: 700; color: oklch(var(--foreground-900)); }
.article-content tbody tr:nth-child(even) { background: oklch(var(--background-50)); }

.article-content hr {
  border: none;
  border-top: 2px solid oklch(var(--background-200));
  margin: 2rem 0;
}
.article-content pre {
  background: oklch(var(--background-100));
  padding: 1rem;
  border-radius: 0.5rem;
  overflow-x: auto;
  direction: ltr;
  text-align: left;
  margin: 1.25rem 0;
  font-size: 0.875rem;
}
.article-content code {
  background: oklch(var(--background-100));
  padding: 0.15rem 0.4rem;
  border-radius: 0.3rem;
  font-family: "Courier New", monospace;
  font-size: 0.9em;
  direction: ltr;
  display: inline-block;
}
.article-content pre code { background: transparent; padding: 0; }

.article-content strong, .article-content b { font-weight: 700; color: oklch(var(--foreground-900)); }
.article-content em, .article-content i { font-style: italic; }
.article-content u { text-decoration: underline; text-underline-offset: 3px; }
.article-content sub { vertical-align: sub; font-size: 0.75em; }
.article-content sup { vertical-align: super; font-size: 0.75em; }

[x-cloak] { display: none !important; }

/* Homepage mobile helpers */
.site-doctor-slots {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.site-doctor-slots::-webkit-scrollbar {
  display: none;
}

/* Doctor card: glowing book button after slot selection */
@keyframes book-btn-glow-pulse {
  0%, 100% {
    box-shadow:
      0 0 0 0 oklch(var(--accent-500) / 0.45),
      0 0 10px 4px oklch(var(--accent-500) / 0.3);
  }
  50% {
    box-shadow:
      0 0 0 6px oklch(var(--accent-500) / 0.18),
      0 0 18px 8px oklch(var(--accent-500) / 0.5);
  }
}
.book-btn-glow {
  animation: book-btn-glow-pulse 1.4s ease-in-out infinite;
}

.book-btn-idle {
  background-color: oklch(var(--background-300));
  color: oklch(var(--foreground-400));
  cursor: not-allowed;
  pointer-events: none;
  transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

/* Day carousel slide animations — swipe شمال→يمين = اليوم التالي */
@keyframes day-slide-next {
  from { opacity: 0.4; transform: translateX(-24px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes day-slide-prev {
  from { opacity: 0.4; transform: translateX(24px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes day-slide-hint-forward {
  from { opacity: 0.45; transform: translateX(-30px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes day-slide-hint-back {
  from { opacity: 0.45; transform: translateX(30px); }
  to { opacity: 1; transform: translateX(0); }
}
.day-slide-next { animation: day-slide-next 0.3s ease-out; }
.day-slide-prev { animation: day-slide-prev 0.3s ease-out; }
.day-slide-hint-forward { animation: day-slide-hint-forward 0.45s ease-out; }
.day-slide-hint-back { animation: day-slide-hint-back 0.45s ease-out; }

.site-day-carousel {
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
}

@keyframes booking-form-glow {
  0%, 100% {
    box-shadow: 0 0 0 0 oklch(var(--primary-400) / 0.35), 0 10px 30px oklch(var(--primary-500) / 0.15);
  }
  50% {
    box-shadow: 0 0 0 10px oklch(var(--primary-400) / 0), 0 15px 40px oklch(var(--primary-500) / 0.25);
  }
}

.booking-form-highlight {
  animation: booking-form-glow 1.2s ease-in-out 3;
}
