const MOCK_REVIEWS = [
  {
    text: "Спасибо за приём, мне всё понравилось, спасибо за приём, мне всё понравилось. Врач очень внимательный и профессиональный.",
    author: "Пациент клиники",
    doctor: "Тимофеева Наталья Александровна",
  },
  {
    text: "Очень довольна лечением! Прошла курс процедур, нос дышит отлично. Рекомендую клинику всем.",
    author: "Наталья К.",
    doctor: "Макарова Людмила Тимофеевна",
  },
];

export function ReviewsBlock() {
  return (
    <div
      className="rounded-xl p-8 space-y-6"
      style={{ background: "#fff", border: "1px solid var(--bb-border)" }}
    >
      {/* Заголовок */}
      <div>
        <h2 className="text-xl font-bold mb-2" style={{ color: "#111827" }}>
          Отзывы о нас
        </h2>
        <p className="text-sm" style={{ color: "#374151", lineHeight: 1.7 }}>
          За 12 лет работы наши врачи оториноларингологи избавили от болезней ухо, горло, носа
          более 50 000 пациентов. Но даже сейчас мы высоко ценим каждый положительный отзыв
          и искренние слова благодарности.
        </p>
      </div>

      {/* Карусель */}
      <div className="relative flex items-center gap-4">
        {/* Стрелка влево */}
        <button
          className="shrink-0 w-10 h-10 rounded-full flex items-center justify-center font-bold text-lg"
          style={{
            background: "var(--bb-sidebar-bg)",
            border: "1px solid var(--bb-border)",
            color: "var(--bb-text-muted)",
          }}
        >
          ‹
        </button>

        {/* Карточка отзыва */}
        <div
          className="flex-1 rounded-xl p-6"
          style={{ background: "#eef4d1" }}
        >
          <div
            className="text-8xl leading-none mb-2 font-serif"
            style={{ color: "#b8e6ed", lineHeight: 0.8 }}
          >
            «
          </div>
          <p
            className="text-sm italic leading-relaxed"
            style={{ color: "#374151" }}
          >
            {MOCK_REVIEWS[0].text}
          </p>
          <a
            href="#"
            className="inline-block mt-3 text-sm"
            style={{ color: "#0089c3" }}
          >
            Читать отзыв полностью
          </a>
        </div>

        {/* Стрелка вправо */}
        <button
          className="shrink-0 w-10 h-10 rounded-full flex items-center justify-center font-bold text-lg"
          style={{
            background: "var(--bb-sidebar-bg)",
            border: "1px solid var(--bb-border)",
            color: "var(--bb-text-muted)",
          }}
        >
          ›
        </button>
      </div>
    </div>
  );
}