"use client"

import { useEffect, useState } from "react"
import Link from "next/link"
import Image from "next/image"
import { motion } from "framer-motion"
import { ArrowLeft } from "lucide-react"

export default function AboutPage() {
  const [mounted, setMounted] = useState(false)

  useEffect(() => {
    setMounted(true)
  }, [])

  if (!mounted) return null

  return (
    <main className="relative flex min-h-screen flex-col items-center px-4 py-8 overflow-hidden bg-[#E2E2C1]">
      {/* Логотип вверху */}
      <motion.div 
        className="w-full flex justify-center mb-8"
        initial={{ opacity: 0 }}
        animate={{ opacity: 1 }}
        transition={{ duration: 0.7 }}
      >
        <div className="w-24 h-12 relative">
          <Image 
            src="/logo.svg" 
            alt="Dressed For Success Logo" 
            fill 
            unoptimized={true}
            className="object-contain"
          />
        </div>
      </motion.div>
      
      {/* Карточка с информацией о владельце */}
      <motion.div
        className="w-full max-w-2xl bg-white/80 backdrop-blur-sm rounded-xl shadow-md p-6 md:p-8"
        initial={{ opacity: 0, y: 20 }}
        animate={{ opacity: 1, y: 0 }}
        transition={{ duration: 0.8, delay: 0.2 }}
      >
        <h1 className="text-2xl md:text-3xl font-bold text-[#2B5F47] mb-6 text-center">
          Карта предприятия
        </h1>
        
        <div className="space-y-4 text-[#2B5F47]">
          <div className="border-b border-[#2B5F47]/20 pb-3">
            <h2 className="font-semibold text-lg">1. Наименование предприятия</h2>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">1.1 Полное</h2>
            <p>Индивидуальный предприниматель Плотников Михаил Владимирович</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">1.2 Сокращенное</h2>
            <p>ИП Плотников Михаил Владимирович</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3">
            <h2 className="font-semibold text-lg">2. ИНН</h2>
            <p>421713424512</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3">
            <h2 className="font-semibold text-lg">3. Адрес ИП:</h2>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">3.1 Юридический адрес:</h2>
            <p>654066, Кемеровская область-Кузбасс, г. Новокузнецк, ул. Грдины, дом 23, кв. 186</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">3.2 Фактический адрес:</h2>
            <p>654066, Кемеровская область-Кузбасс, г. Новокузнецк, ул. Грдины, дом 23, кв. 186</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3">
            <h2 className="font-semibold text-lg">4. Телефон</h2>
            <p>8 905 966 2401</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3">
            <h2 className="font-semibold text-lg">5. Эл.почта (E-mail)</h2>
            <p>Pmv-84@yandex.ru</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3">
            <h2 className="font-semibold text-lg">6. Сведения о регистрации ИП</h2>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">6.1 Наименование регистрирующего органа</h2>
            <p>Межрайонная инспекция Федеральной налоговой службы №15 по Кемеровской области-Кузбассу</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">6.2 ОГРНИП</h2>
            <p>325420500025878 от 17.03.2025 г.</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3">
            <h2 className="font-semibold text-lg">7. Сведения о банках и банковских счетах</h2>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">7.1 Полное наименование банка</h2>
            <p>Филиал «Новосибирский» АО «АЛЬФА-БАНК» г. Новосибирск</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">7.2 БИК</h2>
            <p>045004774</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">7.3 Корреспондентский счет</h2>
            <p>30101810600000000774</p>
          </div>
          
          <div className="border-b border-[#2B5F47]/20 pb-3 pl-4">
            <h2 className="font-semibold text-lg">7.4 Расчетный счет</h2>
            <p>40802810023070009086</p>
          </div>
          
          <div>
            <h2 className="font-semibold text-lg">8. Руководитель предприятия</h2>
            <p>Плотников Михаил Владимирович</p>
          </div>
        </div>
      </motion.div>
      
      {/* Кнопка возврата на главную */}
      <motion.div
        className="mt-8"
        initial={{ opacity: 0 }}
        animate={{ opacity: 1 }}
        transition={{ duration: 0.7, delay: 0.4 }}
      >
        <Link 
          href="/"
          className="flex items-center text-[#2B5F47] font-medium hover:text-[#1a3c2c] transition-colors"
        >
          <ArrowLeft className="h-4 w-4 mr-2" />
          Вернуться на главную
        </Link>
      </motion.div>
    </main>
  )
} 