import { type ReactNode } from 'react'
import { ThemeProvider } from '../../theme/ThemeContext'
import ThemeToggle from '../../components/uiws/ThemeToggle'
import '../../theme/theme.css'

/**
 * UIWS 이식 화면 공통 래퍼. 관리자(/admin) 셸 안에서 렌더되며,
 * .uiws-scope + ThemeProvider 로 다크/라이트 토큰을 격리 적용한다(기존 Mall 테마 무영향).
 * 우상단 ThemeToggle 로 양 모드 전환(영속 mall_uiws_theme).
 */
export default function UiwsLayout({ children }: { children: ReactNode }) {
  return (
    <ThemeProvider>
      <div className="uiws-scope" style={{ minHeight: '100%', background: 'var(--uiws-bg)', borderRadius: 12, padding: 20 }}>
        <div style={{ display: 'flex', justifyContent: 'flex-end', marginBottom: 8 }}>
          <div style={{ width: 140 }}><ThemeToggle /></div>
        </div>
        {children}
      </div>
    </ThemeProvider>
  )
}
