/*
 * SCR-M(내정보/프로필) — WISE 모바일 mypage 이식(구조·컴포넌트·플로우 문자 그대로 차용).
 * 레퍼런스: guardia-messenger/app/uiws/mypage.tsx.
 *   · 프로필 헤드(아바타+카메라 배지 → 사진 선택→미리보기→적용 시에만 업로드)
 *   · 정보 행(InfoRow) · 계정/보안(2FA 상태) · 생체인식 잠금 토글 · 환경설정 · 로그아웃
 * 추가: ① 생체인식 로컬 잠금(진입 게이트) ② 프로필 사진 등록(갤러리/카메라).
 * 보안: 새 시크릿·토큰·자격증명을 console로 출력하지 않는다. 생체 원본은 OS에만.
 */
import { Ionicons } from '@expo/vector-icons';
import { router, useFocusEffect } from 'expo-router';
import React, { useCallback, useEffect, useState } from 'react';
import {
  ActivityIndicator,
  Alert,
  Image,
  Modal,
  Pressable,
  ScrollView,
  StyleSheet,
  Switch,
  Text,
  View,
} from 'react-native';
import { Avatar } from '../components/Avatar';
import { Banner } from '../components/Banner';
import { Card } from '../components/Card';
import { useAuth } from '../context/AuthContext';
import { useSecureScreen } from '../context/SecureScreenContext';
import { ApiRequestError, isDegraded } from '../lib/api';
import {
  authenticateBiometric,
  isBiometricEnabled,
  isBiometricSupported,
  isSessionUnlocked,
  markSessionUnlocked,
  setBiometricEnabled,
} from '../lib/biometric';
import {
  isPickerAvailable,
  pickFromCamera,
  pickFromLibrary,
  type PickedImage,
} from '../lib/imagePick';
import { avatarUrl, getMe, getOtpStatus, uploadAvatar } from '../lib/profile';
import { prefGet, prefSet } from '../lib/secureStore';
import type { EventRole, MePrincipal, OtpStatusDto } from '../lib/types';
import { colors, radius, spacing, touch, type } from '../theme';

const roleLabel: Record<EventRole, string> = {
  ORGANIZER: '주최자',
  EXHIBITOR: '참가업체',
  CONTRACTOR: '장치·시공업체',
  HALL_MANAGER: '홀매니저',
};

// 환경설정(이 기기 로컬 저장 — 서버 동기화 계약 부재, web MyPage와 동일 정책).
const PREFS_KEY = 'kintex.prefs';
interface Prefs {
  notifyDeadline: boolean;
  notifyApproval: boolean;
  notifyPayment: boolean;
}
const DEFAULT_PREFS: Prefs = { notifyDeadline: true, notifyApproval: true, notifyPayment: true };

export default function ProfileScreen() {
  const { user, signOut } = useAuth();

  // 개인정보 화면 — 캡처 차단 + 백그라운드 마스킹(B4/B7).
  useSecureScreen('profile');

  const [me, setMe] = useState<MePrincipal | null>(null);
  const [loading, setLoading] = useState(false);
  const [loadErr, setLoadErr] = useState('');
  const [otp, setOtp] = useState<OtpStatusDto | null>(null);

  // 프로필 사진 — 선택 → 미리보기(적용/취소) → 적용 시에만 업로드(WISE 불변식).
  const [photoUrl, setPhotoUrl] = useState<string | null>(null);
  const [photoBusy, setPhotoBusy] = useState(false);
  const [previewImg, setPreviewImg] = useState<PickedImage | null>(null);
  const [previewErr, setPreviewErr] = useState('');
  const [photoPending, setPhotoPending] = useState(false); // 서버 미반영(degrade) 로컬 프리뷰 상태

  // 생체인식
  const [bioSupported, setBioSupported] = useState(false);
  const [bioEnabled, setBioEnabled] = useState(false);
  const [locked, setLocked] = useState(false); // 잠금 게이트 통과 전 콘텐츠 차단

  // 환경설정
  const [prefs, setPrefs] = useState<Prefs>(DEFAULT_PREFS);

  const displayName = me?.displayName ?? user?.displayName ?? '사용자';

  const loadProfile = useCallback(async () => {
    setLoading(true);
    setLoadErr('');
    try {
      const p = await getMe();
      setMe(p);
      setPhotoUrl(avatarUrl(p.userId));
      setPhotoPending(false);
    } catch (e) {
      // /me 실패 시 최소한 로그인 세션 정보로 화면 유지(전면 오류 회피).
      setLoadErr(e instanceof ApiRequestError ? e.message : '내정보를 불러오지 못했습니다.');
    } finally {
      setLoading(false);
    }
    try {
      setOtp(await getOtpStatus());
    } catch {
      setOtp(null); // 상태 조회 실패는 무시(섹션은 안내로 degrade)
    }
  }, []);

  // 환경설정 로드
  useEffect(() => {
    prefGet(PREFS_KEY)
      .then((raw) => {
        if (raw) setPrefs({ ...DEFAULT_PREFS, ...(JSON.parse(raw) as Partial<Prefs>) });
      })
      .catch(() => setPrefs(DEFAULT_PREFS));
  }, []);

  // 생체 지원/토글 상태
  useEffect(() => {
    isBiometricSupported().then(setBioSupported).catch(() => setBioSupported(false));
    isBiometricEnabled().then(setBioEnabled).catch(() => setBioEnabled(false));
  }, []);

  // 진입 게이트 — 생체 잠금 활성 + 세션 미해제 시 인증 요구.
  const runLockGate = useCallback(async () => {
    const enabled = await isBiometricEnabled();
    if (!enabled || isSessionUnlocked()) {
      setLocked(false);
      return;
    }
    setLocked(true);
    const ok = await authenticateBiometric();
    if (ok) {
      markSessionUnlocked();
      setLocked(false);
    }
  }, []);

  useFocusEffect(
    useCallback(() => {
      runLockGate();
      loadProfile();
    }, [runLockGate, loadProfile]),
  );

  const savePrefs = async (next: Prefs) => {
    setPrefs(next);
    try {
      await prefSet(PREFS_KEY, JSON.stringify(next));
    } catch {
      /* graceful */
    }
  };

  const toggleBiometric = async (next: boolean) => {
    if (next) {
      // 활성화 전 1회 본인 확인.
      const ok = await authenticateBiometric();
      if (!ok) {
        Alert.alert('생체인식', '생체 인증에 실패했습니다. 다시 시도해 주세요.');
        return;
      }
      markSessionUnlocked(); // 방금 인증했으므로 이 세션은 통과 처리(즉시 재프롬프트 방지).
    }
    await setBiometricEnabled(next);
    setBioEnabled(next);
  };

  // ── 사진 선택(미리보기용) — 업로드 호출 없음 ──
  const pickForPreview = async (from: 'library' | 'camera') => {
    if (photoBusy) return;
    if (!isPickerAvailable()) {
      Alert.alert('프로필 사진', '이미지 선택 기능을 사용할 수 없는 기기입니다.');
      return;
    }
    const img = from === 'library' ? await pickFromLibrary() : await pickFromCamera();
    if (!img) {
      // 권한 거부/취소/미설치: 모달이 열려있으면 유지, 아니면 무동작 + 권한 안내.
      return;
    }
    setPreviewImg(img);
    setPreviewErr('');
  };

  // ── 적용 — 이 시점에만 1회 업로드. 미구현/네트워크면 로컬 프리뷰로 degrade ──
  const applyPhoto = async () => {
    if (!previewImg || photoBusy) return;
    setPhotoBusy(true);
    setPreviewErr('');
    try {
      const res = await uploadAvatar(previewImg);
      const base = res.photoUrl || (me ? avatarUrl(me.userId) : null);
      setPhotoUrl(base ? `${base}${base.includes('?') ? '&' : '?'}_t=${Date.now()}` : previewImg.uri);
      setPhotoPending(false);
      setPreviewImg(null);
    } catch (e) {
      if (isDegraded(e)) {
        // 백엔드 아바타 업로드 미구현 — 로컬 프리뷰 유지 + 대기 안내(파괴적 실패 아님).
        setPhotoUrl(previewImg.uri);
        setPhotoPending(true);
        setPreviewImg(null);
      } else {
        setPreviewErr(e instanceof ApiRequestError ? e.message : '사진 업로드에 실패했습니다.');
      }
    } finally {
      setPhotoBusy(false);
    }
  };

  const cancelPreview = () => {
    if (photoBusy) return;
    setPreviewImg(null);
    setPreviewErr('');
  };

  const onChangePhoto = () => {
    if (photoBusy) return;
    Alert.alert('프로필 사진', '사진을 선택하세요', [
      { text: '갤러리', onPress: () => pickForPreview('library') },
      { text: '카메라', onPress: () => pickForPreview('camera') },
      { text: '취소', style: 'cancel' },
    ]);
  };

  const onSignOut = () => {
    Alert.alert('로그아웃', '로그아웃하시겠습니까?', [
      { text: '취소', style: 'cancel' },
      {
        text: '로그아웃',
        style: 'destructive',
        onPress: async () => {
          await signOut();
          router.replace('/login');
        },
      },
    ]);
  };

  // 생체 잠금 게이트 — 미통과 시 콘텐츠 차단 화면.
  if (locked) {
    return (
      <View style={styles.lockWrap}>
        <Ionicons name="finger-print" size={56} color={colors.primary600} />
        <Text style={styles.lockTitle}>생체인식 잠금</Text>
        <Text style={styles.lockHint}>지문 또는 Face로 잠금을 해제하세요.</Text>
        <Pressable
          style={styles.lockBtn}
          onPress={runLockGate}
          accessibilityRole="button"
          accessibilityLabel="생체 인증 다시 시도"
        >
          <Text style={styles.lockBtnText}>다시 시도</Text>
        </Pressable>
      </View>
    );
  }

  const roles = me?.eventRoles ? Object.values(me.eventRoles) : [];

  return (
    <ScrollView style={styles.wrap} contentContainerStyle={styles.scroll}>
      {/* ── 프로필 ── */}
      <Text style={styles.section}>내 정보</Text>
      {loading ? (
        <ActivityIndicator color={colors.primary600} style={{ marginVertical: spacing.md }} />
      ) : (
        <Card>
          <View style={styles.profileHead}>
            <Pressable
              testID="profile-photo"
              onPress={onChangePhoto}
              disabled={photoBusy}
              accessibilityLabel="프로필 사진 변경"
              accessibilityRole="button"
            >
              <Avatar photoUrl={photoUrl} name={displayName} size={56} testID="profile-avatar" />
              <View style={styles.photoEdit}>
                {photoBusy ? (
                  <ActivityIndicator color={colors.white} size="small" />
                ) : (
                  <Ionicons name="camera" size={13} color={colors.white} />
                )}
              </View>
            </Pressable>
            <View style={{ flex: 1, marginLeft: 12 }}>
              <Text style={styles.profileName}>{displayName}</Text>
              <Text style={styles.profileId}>
                {me?.userId ?? user?.userId ?? '-'}
                {me?.roleCode ? ` · ${me.roleCode}` : ''}
              </Text>
            </View>
          </View>

          {photoPending ? (
            <Text style={styles.pendingNote}>
              선택한 사진은 이 기기에만 표시됩니다 — 서버 반영은 준비 중입니다.
            </Text>
          ) : null}

          {loadErr ? <Banner tone="warning">{loadErr}</Banner> : null}

          <InfoRow label="이름" value={displayName} />
          <InfoRow label="사용자 ID" value={me?.userId ?? user?.userId ?? null} testID="profile-userid" />
          <InfoRow label="전역 역할" value={me?.roleCode ?? null} />
          <InfoRow label="전시관(테넌트)" value={me?.tenantId ?? null} />
          <InfoRow
            label="구분"
            value={me?.hallManager ?? user?.hallManager ? '킨텍스 내부(홀매니저)' : '일반 계정'}
          />
        </Card>
      )}

      {/* ── 참여 행사 역할 ── */}
      {roles.length > 0 ? (
        <>
          <Text style={styles.section}>참여 행사 역할</Text>
          <Card>
            {Object.entries(me!.eventRoles).map(([eventId, r]) => (
              <View key={eventId} style={styles.infoRow}>
                <Text style={styles.infoLabel} numberOfLines={1}>
                  {eventId}
                </Text>
                <View style={styles.rolePill}>
                  <Text style={styles.rolePillText}>{roleLabel[r] ?? r}</Text>
                </View>
              </View>
            ))}
          </Card>
        </>
      ) : null}

      {/* ── 계정·보안(2차 인증) ── */}
      <Text style={styles.section}>계정 · 보안</Text>
      <Card>
        <View style={styles.bioRow}>
          <View style={{ flex: 1, paddingRight: 12 }}>
            <Text style={styles.rowTitle}>2차 인증(OTP)</Text>
            <Text style={styles.hint}>
              {otp?.otpEnabled
                ? `활성화됨 · ${otp.verifyMethod === 'OTP' ? 'Authenticator(OTP)' : otp.verifyMethod || 'OTP'}`
                : '미설정 — 로그인 시 인증 앱(TOTP) 2단계 인증을 사용합니다.'}
            </Text>
          </View>
          <View style={otp?.otpEnabled ? styles.badgeOn : styles.badgeOff}>
            <Text style={otp?.otpEnabled ? styles.badgeOnText : styles.badgeOffText}>
              {otp?.otpEnabled ? '켜짐' : '꺼짐'}
            </Text>
          </View>
        </View>
      </Card>

      {/* ── 생체인식 잠금 ── */}
      <Text style={styles.section}>생체인식 잠금</Text>
      <Card>
        {bioSupported ? (
          <View style={styles.bioRow}>
            <View style={{ flex: 1, paddingRight: 12 }}>
              <Text style={styles.rowTitle}>지문 · Face 잠금</Text>
              <Text style={styles.hint}>
                켜면 내정보 진입 시 지문 또는 Face로 재인증합니다. 로그인 2차 인증은 그대로 유지됩니다.
              </Text>
            </View>
            <Switch
              testID="profile-biometric-toggle"
              value={bioEnabled}
              onValueChange={toggleBiometric}
              trackColor={{ false: colors.neutral200, true: colors.primary600 }}
              thumbColor={colors.white}
            />
          </View>
        ) : (
          <Text style={styles.hint}>
            이 기기는 생체인식을 지원하지 않거나 지문/Face가 등록되어 있지 않습니다. 기기 설정에서 생체
            정보를 등록한 뒤 다시 시도해 주세요.
          </Text>
        )}
      </Card>

      {/* ── 환경설정(알림) ── */}
      <Text style={styles.section}>알림 설정</Text>
      <Card>
        {(
          [
            ['notifyDeadline', '마감 D-데이 알림'],
            ['notifyApproval', '승인·검수 알림'],
            ['notifyPayment', '결제·정산 알림'],
          ] as const
        ).map(([key, label]) => (
          <View key={key} style={styles.bioRow}>
            <Text style={[styles.rowTitle, { flex: 1 }]}>{label}</Text>
            <Switch
              testID={`profile-pref-${key}`}
              value={prefs[key]}
              onValueChange={(v) => savePrefs({ ...prefs, [key]: v })}
              trackColor={{ false: colors.neutral200, true: colors.primary600 }}
              thumbColor={colors.white}
            />
          </View>
        ))}
        <Text style={styles.hint}>알림 설정은 이 기기에 저장됩니다. 서버 동기화는 준비 중입니다.</Text>
      </Card>

      {/* ── 로그아웃 ── */}
      <Pressable
        style={styles.logoutBtn}
        onPress={onSignOut}
        accessibilityRole="button"
        accessibilityLabel="로그아웃"
      >
        <Ionicons name="log-out-outline" size={18} color={colors.error} />
        <Text style={styles.logoutText}>로그아웃</Text>
      </Pressable>

      <Text style={styles.version}>KINTEX AI 전시관리 · 내정보</Text>

      {/* ── 프로필 사진 미리보기 모달(선택→미리보기→적용 확정) ── */}
      <Modal visible={!!previewImg} transparent animationType="fade" onRequestClose={cancelPreview}>
        <Pressable style={styles.modalBackdrop} onPress={cancelPreview}>
          <Pressable style={styles.modalSheet} onPress={() => {}}>
            <View style={styles.modalHeaderRow}>
              <Text style={styles.modalTitle}>프로필 사진 변경</Text>
              <Pressable
                testID="photo-cancel-x"
                onPress={cancelPreview}
                disabled={photoBusy}
                hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}
                accessibilityLabel="닫기"
              >
                <Ionicons name="close" size={22} color={colors.neutral500} />
              </Pressable>
            </View>

            <View style={styles.previewWrap}>
              {previewImg ? (
                <Image
                  testID="photo-preview-image"
                  source={{ uri: previewImg.uri }}
                  style={styles.previewImg}
                  resizeMode="cover"
                />
              ) : null}
              {photoBusy ? (
                <View style={styles.previewOverlay}>
                  <ActivityIndicator color={colors.white} size="small" />
                </View>
              ) : null}
            </View>
            <Text style={styles.previewCaption}>원형으로 표시됩니다.</Text>

            <View style={styles.modalPickRow}>
              <Pressable
                testID="photo-pick-library"
                style={[styles.pickBtn, photoBusy && styles.disabled]}
                onPress={() => pickForPreview('library')}
                disabled={photoBusy}
              >
                <Ionicons name="image-outline" size={16} color={colors.neutral900} />
                <Text style={styles.pickText}>갤러리</Text>
              </Pressable>
              <Pressable
                testID="photo-pick-camera"
                style={[styles.pickBtn, photoBusy && styles.disabled]}
                onPress={() => pickForPreview('camera')}
                disabled={photoBusy}
              >
                <Ionicons name="camera-outline" size={16} color={colors.neutral900} />
                <Text style={styles.pickText}>카메라</Text>
              </Pressable>
            </View>

            {previewErr ? <Text style={styles.err}>{previewErr}</Text> : null}

            <Pressable
              testID="photo-apply"
              style={[styles.applyBtn, photoBusy && styles.disabled]}
              onPress={applyPhoto}
              disabled={photoBusy}
            >
              {photoBusy ? (
                <View style={styles.applyBusyRow}>
                  <ActivityIndicator color={colors.white} size="small" />
                  <Text style={styles.applyText}>적용 중…</Text>
                </View>
              ) : (
                <Text style={styles.applyText}>적용</Text>
              )}
            </Pressable>
            <Pressable
              testID="photo-cancel"
              style={[styles.cancelBtn, photoBusy && styles.disabled]}
              onPress={cancelPreview}
              disabled={photoBusy}
            >
              <Text style={styles.cancelText}>취소</Text>
            </Pressable>
          </Pressable>
        </Pressable>
      </Modal>
    </ScrollView>
  );
}

function InfoRow({ label, value, testID }: { label: string; value: string | null; testID?: string }) {
  return (
    <View style={styles.infoRow}>
      <Text style={styles.infoLabel}>{label}</Text>
      <Text style={styles.infoValue} testID={testID} numberOfLines={1}>
        {value && value.length ? value : '-'}
      </Text>
    </View>
  );
}

const styles = StyleSheet.create({
  wrap: { flex: 1, backgroundColor: colors.neutral050 },
  scroll: { padding: spacing.md, paddingBottom: spacing.xl },
  section: {
    color: colors.neutral900,
    fontSize: type.h3.fontSize,
    fontWeight: '800',
    marginTop: spacing.md,
    marginBottom: spacing.sm,
  },

  profileHead: { flexDirection: 'row', alignItems: 'center', marginBottom: spacing.sm },
  photoEdit: {
    position: 'absolute',
    right: -2,
    bottom: -2,
    width: 22,
    height: 22,
    borderRadius: 11,
    backgroundColor: colors.primary600,
    alignItems: 'center',
    justifyContent: 'center',
    borderWidth: 2,
    borderColor: colors.white,
  },
  profileName: { color: colors.neutral900, fontSize: type.h2.fontSize, fontWeight: '800' },
  profileId: { color: colors.neutral500, fontSize: type.caption.fontSize, marginTop: 3 },
  pendingNote: { color: colors.warning, fontSize: type.caption.fontSize, marginBottom: spacing.sm },

  infoRow: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
    paddingVertical: 9,
    borderTopWidth: 1,
    borderTopColor: colors.neutral200,
  },
  infoLabel: { color: colors.neutral500, fontSize: type.caption.fontSize, fontWeight: '700' },
  infoValue: {
    color: colors.neutral900,
    fontSize: type.body.fontSize,
    fontWeight: '600',
    flexShrink: 1,
    textAlign: 'right',
    marginLeft: 12,
  },
  rolePill: {
    backgroundColor: colors.primary100,
    borderRadius: radius.pill,
    paddingHorizontal: 10,
    paddingVertical: 4,
  },
  rolePillText: { color: colors.primary700, fontSize: type.caption.fontSize, fontWeight: '700' },

  bioRow: { flexDirection: 'row', alignItems: 'center', paddingVertical: 4 },
  rowTitle: { color: colors.neutral900, fontSize: type.body.fontSize, fontWeight: '700', marginBottom: 4 },
  hint: { color: colors.neutral500, fontSize: type.caption.fontSize, lineHeight: 18, marginTop: 4 },

  badgeOn: { backgroundColor: '#E7F5EF', borderRadius: radius.pill, paddingHorizontal: 10, paddingVertical: 4 },
  badgeOnText: { color: colors.success, fontSize: type.caption.fontSize, fontWeight: '800' },
  badgeOff: { backgroundColor: colors.neutral200, borderRadius: radius.pill, paddingHorizontal: 10, paddingVertical: 4 },
  badgeOffText: { color: colors.neutral700, fontSize: type.caption.fontSize, fontWeight: '800' },

  logoutBtn: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'center',
    gap: 8,
    marginTop: spacing.lg,
    minHeight: touch.min,
    borderRadius: radius.sm,
    borderWidth: 1,
    borderColor: colors.error,
    backgroundColor: colors.white,
  },
  logoutText: { color: colors.error, fontSize: type.h3.fontSize, fontWeight: '700' },
  version: { textAlign: 'center', color: colors.neutral500, fontSize: type.caption.fontSize, marginTop: spacing.md },

  // 생체 잠금 게이트
  lockWrap: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    gap: spacing.sm,
    padding: spacing.lg,
    backgroundColor: colors.neutral050,
  },
  lockTitle: { color: colors.neutral900, fontSize: type.h2.fontSize, fontWeight: '800', marginTop: spacing.sm },
  lockHint: { color: colors.neutral500, fontSize: type.body.fontSize, textAlign: 'center' },
  lockBtn: {
    marginTop: spacing.md,
    minHeight: touch.min,
    paddingHorizontal: spacing.lg,
    borderRadius: radius.sm,
    backgroundColor: colors.primary600,
    alignItems: 'center',
    justifyContent: 'center',
  },
  lockBtnText: { color: colors.white, fontSize: type.h3.fontSize, fontWeight: '700' },

  // 사진 미리보기 모달
  modalBackdrop: { flex: 1, backgroundColor: 'rgba(0,0,0,0.55)', justifyContent: 'flex-end' },
  modalSheet: {
    backgroundColor: colors.white,
    borderTopLeftRadius: radius.md,
    borderTopRightRadius: radius.md,
    borderWidth: 1,
    borderColor: colors.neutral200,
    padding: spacing.lg,
    paddingBottom: spacing.xl,
  },
  modalHeaderRow: { flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between' },
  modalTitle: { color: colors.neutral900, fontSize: type.h3.fontSize, fontWeight: '800' },
  previewWrap: {
    width: 120,
    height: 120,
    borderRadius: 60,
    alignSelf: 'center',
    marginVertical: spacing.md,
    overflow: 'hidden',
    borderWidth: 1,
    borderColor: colors.neutral200,
    backgroundColor: colors.primary050,
  },
  previewImg: { width: 120, height: 120, borderRadius: 60 },
  previewOverlay: {
    ...StyleSheet.absoluteFillObject,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: 'rgba(0,0,0,0.35)',
  },
  previewCaption: { color: colors.neutral500, fontSize: type.caption.fontSize, textAlign: 'center', marginTop: -4 },
  modalPickRow: { flexDirection: 'row', gap: 10, marginTop: spacing.md },
  pickBtn: {
    flex: 1,
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'center',
    gap: 8,
    minHeight: touch.min,
    borderRadius: radius.sm,
    borderWidth: 1,
    borderColor: colors.neutral200,
    backgroundColor: colors.white,
  },
  pickText: { color: colors.neutral900, fontSize: type.body.fontSize, fontWeight: '700' },
  applyBtn: {
    marginTop: spacing.md,
    minHeight: touch.min,
    borderRadius: radius.sm,
    backgroundColor: colors.primary600,
    alignItems: 'center',
    justifyContent: 'center',
  },
  applyBusyRow: { flexDirection: 'row', alignItems: 'center', gap: 8 },
  applyText: { color: colors.white, fontSize: type.h3.fontSize, fontWeight: '800' },
  cancelBtn: {
    marginTop: spacing.sm,
    minHeight: touch.min,
    borderRadius: radius.sm,
    borderWidth: 1,
    borderColor: colors.neutral200,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: colors.white,
  },
  cancelText: { color: colors.neutral700, fontSize: type.h3.fontSize, fontWeight: '700' },
  err: { color: colors.error, fontSize: type.caption.fontSize, marginTop: spacing.sm },
  disabled: { opacity: 0.6 },
});