"use client";
import React from "react";

export default function ContactForm() {
  return (
    <div className="grid gap-6 md:grid-cols-2">
      {/* Get in Touch Card */}
      <div className="rounded-xl border border-[#FF7518] shadow bg-white text-black">
        <div className="p-6">
          <h2 className="text-2xl font-semibold mb-6">Get in Touch</h2>
          <div className="space-y-6">
            <div className="flex items-start space-x-4">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                width="24"
                height="24"
                viewBox="0 0 24 24"
                fill="none"
                stroke="currentColor"
                strokeWidth="2"
                strokeLinecap="round"
                strokeLinejoin="round"
                className="w-6 h-6 text-[#ff4f00] mt-1"
              >
                <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" />
              </svg>
              <div>
                <p className="font-medium">Phone Support</p>
                <p className="text-gray-400">+1 (555) 123-4567</p>
                <p className="text-sm text-gray-500 mt-1">
                  Available 24/7 for urgent matters
                </p>
              </div>
            </div>
            <div className="flex items-start space-x-4">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                width="24"
                height="24"
                viewBox="0 0 24 24"
                fill="none"
                stroke="currentColor"
                strokeWidth="2"
                strokeLinecap="round"
                strokeLinejoin="round"
                className="w-6 h-6 text-[#ff4f00] mt-1"
              >
                <rect width="20" height="16" x="2" y="4" rx="2" />
                <path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7" />
              </svg>
              <div className="space-y-4">
                <div>
                  <p className="font-medium">Sales Inquiries</p>
                  <a
                    href="mailto:sales@reya.cloud"
                    className="text-[#ff4f00] hover:underline"
                  >
                    sales@reya.cloud
                  </a>
                </div>
                <div>
                  <p className="font-medium">Technical Support</p>
                  <a
                    href="mailto:support@reya.cloud"
                    className="text-[#ff4f00] hover:underline"
                  >
                    support@reya.cloud
                  </a>
                </div>
                <div>
                  <p className="font-medium">Report Abuse</p>
                  <a
                    href="mailto:abuse@reya.cloud"
                    className="text-[#ff4f00] hover:underline"
                  >
                    abuse@reya.cloud
                  </a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      {/* Business Hours Card */}
      <div className="rounded-xl border border-[#FF7518] shadow bg-white text-black">
        <div className="p-6">
          <h2 className="text-2xl font-semibold mb-6">Business Hours</h2>
          <div className="space-y-4">
            <div>
              <p className="font-medium">Sales Department</p>
              <p className="text-gray-400">
                Monday - Friday: 9:00 AM - 6:00 PM EST
              </p>
            </div>
            <div>
              <p className="font-medium">Technical Support</p>
              <p className="text-gray-400">24/7/365</p>
              <p className="text-sm text-gray-500 mt-1">
                Priority support for enterprise customers
              </p>
            </div>
            <div className="pt-4">
              <p className="text-gray-400">
                For urgent matters outside of business hours, please use our
                24/7 phone support or submit a ticket through your customer
                portal.
              </p>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}