import { Platform, StyleSheet } from 'react-native';

export default StyleSheet.create({
  container: { flex: 1, backgroundColor: '#f4f6f8' },
  header: { padding: 20, paddingTop: Platform.OS === 'android' ? 50 : 60, flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' },
  headerTitle: { color: '#fff', fontSize: 22, fontWeight: 'bold' },
  headerCount: { color: '#fff', fontSize: 14, opacity: 0.9 },
  refreshBtn: { backgroundColor: 'rgba(255,255,255,0.2)', paddingVertical: 6, paddingHorizontal: 12, borderRadius: 6 },
  modalHeader: { backgroundColor: '#fff', padding: 20, paddingTop: Platform.OS === 'android' ? 50 : 60, flexDirection: 'row', justifyContent: 'space-between', borderBottomWidth: 1, borderColor: '#eee', alignItems: 'center' },
  modalHeaderTitle: { fontSize: 24, fontWeight: 'bold', color: '#202223' },
  selectAllRow: { backgroundColor: '#fff', padding: 12, paddingHorizontal: 20, borderBottomWidth: 1, borderColor: '#eee', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' },
  pickBtnSmall: { padding: 8, paddingHorizontal: 15, borderRadius: 6 },
  radioOff: { width: 24, height: 24, borderRadius: 12, borderWidth: 2, borderColor: '#ccc' },
  radioOn: { width: 24, height: 24, borderRadius: 12, borderWidth: 2 },
  card: { backgroundColor: '#fff', padding: 16, marginVertical: 6, marginHorizontal: 12, borderRadius: 10, elevation: 2, shadowColor: '#000', shadowOpacity: 0.1, shadowRadius: 4, borderWidth: 1, borderColor: 'transparent' },
  cardSel: { borderWidth: 2, backgroundColor: '#f2fcf8' },
  unpaidCard: { borderColor: '#ff9800', borderWidth: 2 },
  auCard: { borderColor: '#2196F3', borderWidth: 2 },
  pickupCard: { borderColor: '#8e44ad', borderWidth: 2 },
  auText: { color: '#2196F3', fontWeight: 'bold', marginTop: 5 },
  pickupText: { color: '#8e44ad', fontWeight: 'bold', marginTop: 5 },
  ruralText: { color: '#e67e22', fontWeight: 'bold', marginTop: 5 },
  invalidText: { color: '#e74c3c', fontWeight: 'bold', marginTop: 5 },
  pendingText: { color: '#856404', fontWeight: 'bold', marginTop: 5 },
  orderName: { fontSize: 18, fontWeight: 'bold', color: '#202223' },
  customerText: { fontSize: 15, color: '#444', marginTop: 2 },
  methodTextSm: { fontSize: 12, fontWeight: 'bold', backgroundColor: '#e1f3ed', paddingHorizontal: 6, paddingVertical: 3, borderRadius: 10, overflow: 'hidden' },
  mainNoteBox: { backgroundColor: '#fff5ea', padding: 8, marginTop: 6, marginBottom: 8, borderRadius: 5, borderLeftWidth: 3, borderLeftColor: '#eecd9d' },
  mainNoteText: { color: '#8a6116', fontSize: 13, fontWeight: 'bold' },
  noteToggleBtn: { backgroundColor: '#007ace', paddingVertical: 7, paddingHorizontal: 10, borderRadius: 6, marginLeft: 12 },
  noteToggleBtnText: { color: '#fff', fontWeight: 'bold', fontSize: 11 },
  addressTapArea: { alignSelf: 'flex-start', marginTop: 4, marginBottom: 0, paddingTop: 4, paddingBottom: 2, paddingRight: 8 },
  mergeWarningBox: { backgroundColor: '#fff3cd', padding: 6, marginTop: 8, borderRadius: 5, borderLeftWidth: 3, borderLeftColor: '#ffc107' },
  mergeWarningText: { color: '#856404', fontSize: 12, fontWeight: 'bold' },
  itemRow: { flexDirection: 'row', padding: 15, backgroundColor: '#fff', borderBottomWidth: 1, borderColor: '#eee', alignItems: 'center' },
  itemPicked: { backgroundColor: '#f0f0f0', opacity: 0.5 },
  itemPickedOther: { backgroundColor: '#e8f4fd', opacity: 0.8 },
  otherPickerBadge: { color: '#007ace', fontSize: 11, fontWeight: 'bold', marginTop: 4 },
  strikethrough: { textDecorationLine: 'line-through', color: '#aaa' },
  thumb: { width: 70, height: 70, borderRadius: 8, marginRight: 15 },
  itemName: { fontSize: 15, fontWeight: '600', color: '#202223' },
  itemQty: { fontWeight: 'bold', fontSize: 20 },
  lowStockWarning: { fontSize: 11, color: '#e67e22', fontWeight: '600', marginTop: 4 },
  packBtn: { padding: 15, borderRadius: 10, alignItems: 'center', justifyContent: 'center' },
  lockBox: { backgroundColor: '#fff3cd', padding: 12, borderRadius: 8, marginBottom: 6, borderWidth: 1, borderColor: '#ffeeba' },
  lockText: { color: '#856404', fontWeight: 'bold', textAlign: 'center' },
  noteEditorBox: { backgroundColor: '#e8f4fd', borderRadius: 8, paddingVertical: 7, paddingHorizontal: 9, marginBottom: 10, flexDirection: 'row', alignItems: 'center', borderLeftWidth: 4, borderLeftColor: '#007ace' },
  noteInput: { flex: 1, fontSize: 14, minHeight: 30, marginRight: 8, color: '#000', paddingVertical: 0 },
  saveNoteBtn: { backgroundColor: '#007ace', paddingVertical: 8, paddingHorizontal: 10, borderRadius: 5 },
  validatingBox: { backgroundColor: '#fff3cd', padding: 15, borderRadius: 10, marginBottom: 15, borderWidth: 2, borderColor: '#ffeeba' },
  validatingText: { color: '#856404', fontWeight: 'bold', fontSize: 15, textAlign: 'center' },
  warningBoxSm: { backgroundColor: '#fadbd8', padding: 6, borderRadius: 5, alignSelf: 'flex-start', marginTop: 6 },
  warningTextSm: { color: '#c0392b', fontSize: 12, fontWeight: 'bold' },
  warningBox: { backgroundColor: '#fadbd8', padding: 15, borderRadius: 10, marginBottom: 15, borderWidth: 2, borderColor: '#e74c3c' },
  warningBoxTitle: { color: '#c0392b', fontWeight: '900', fontSize: 16, textAlign: 'center', marginBottom: 4 },
  warningBoxSub: { color: '#c0392b', fontWeight: '500', fontSize: 14, textAlign: 'center' },
  modalOverlay: { flex: 1, backgroundColor: 'rgba(0,0,0,0.85)', justifyContent: 'center', padding: 25 },
  modalContent: { backgroundColor: '#fff', padding: 25, borderRadius: 20 },
  modalOverlayTop: { flex: 1, backgroundColor: 'rgba(0,0,0,0.7)', justifyContent: 'flex-start', paddingTop: Platform.OS === 'ios' ? 60 : 40, paddingHorizontal: 15 },
  modalContentTop: { backgroundColor: '#fff', padding: 20, borderRadius: 20, maxHeight: '90%', elevation: 10, shadowColor: '#000', shadowOpacity: 0.2, shadowRadius: 10 },
  modalContentAlt: {
    backgroundColor: '#fff',
    padding: 25,
    borderTopLeftRadius: 25,
    borderTopRightRadius: 25,
    paddingBottom: Platform.OS === 'ios' ? 50 : 60,
    maxHeight: '90%',
  },
  stockRowBtn: { padding: 15, borderBottomWidth: 1, borderColor: '#eee', backgroundColor: '#f9f9f9', borderRadius: 8, marginBottom: 8 },
  stockRowBtnActive: { backgroundColor: '#e8f4fd', borderColor: '#007ace', borderWidth: 2 },
  stockRowText: { fontSize: 16, fontWeight: '600', color: '#444', textAlign: 'center' },
  stockRowTextActive: { color: '#007ace', fontWeight: '900' },
  rosterGrid: { flexDirection: 'row', flexWrap: 'wrap', justifyContent: 'space-between', marginBottom: 20 },
  rosterBtn: { width: '48%', backgroundColor: '#eee', padding: 15, borderRadius: 10, marginBottom: 10, alignItems: 'center' },
  rosterBtnActive: { },
  rosterBtnText: { fontSize: 16, fontWeight: 'bold', color: '#333' },
  input: { borderBottomWidth: 2, padding: 12, fontSize: 18, marginBottom: 20, textAlign: 'center' },
  qtyAdjustBtn: { width: 60, height: 60, borderRadius: 30, backgroundColor: '#eee', justifyContent: 'center', alignItems: 'center' },
  qtyAdjustText: { fontSize: 32, fontWeight: 'bold', color: '#333', marginTop: -4 },
  tabBtn: { flex: 1, padding: 10, borderRadius: 6, alignItems: 'center' },
  tabBtnActive: { backgroundColor: '#fff', elevation: 1, shadowColor: '#000', shadowOpacity: 0.1, shadowRadius: 2 },
  tabText: { color: '#666', fontWeight: 'bold' },
  tabTextActive: { color: '#007ace' },
  dimLabel: { fontSize: 12, color: '#666', marginBottom: 5, textAlign: 'center', fontWeight: 'bold' },
  dimInput: { backgroundColor: '#f9f9f9', borderWidth: 1, borderColor: '#ddd', borderRadius: 8, padding: 10, textAlign: 'center', fontSize: 16, fontWeight: 'bold' },
  qtyBadge: { padding: 8, borderRadius: 8, alignItems: 'center', justifyContent: 'center', minWidth: 65 },
  qtyBadgePending: { backgroundColor: '#f4f6f8', borderWidth: 1, borderColor: '#ddd' },
  qtyBadgeDone: { },
  settingRow: { flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', paddingVertical: 12, borderBottomWidth: 1, borderColor: '#eee' },
  settingLabel: { fontSize: 16, color: '#222', flex: 1, paddingRight: 12 },
  colorPreview: { width: 40, height: 40, borderRadius: 20, borderWidth: 2, borderColor: '#ccc' },
  scannerWrap: { flex: 1, backgroundColor: '#f4f6f8' },
  scannerTop: { height: '40%', backgroundColor: '#000', position: 'relative' },
  scannerCamera: { flex: 1 },
  scannerCameraError: { position: 'absolute', top: 15, left: 15, right: 15, backgroundColor: 'rgba(192, 57, 43, 0.92)', padding: 12, borderRadius: 8 },
  scannerCameraErrorText: { color: '#fff', fontWeight: '600', textAlign: 'center' },
  scannerTopOverlay: { position: 'absolute', bottom: 15, left: 15, right: 15, flexDirection: 'row', justifyContent: 'space-between', gap: 10 },
  scannerActionBtn: { flex: 1, paddingVertical: 12, borderRadius: 8, alignItems: 'center' },
  scannerActionBtnText: { color: '#fff', fontWeight: 'bold', fontSize: 13 },
  scannerBottom: { flex: 1, backgroundColor: '#fff', padding: 15 },
  scannerListTitle: { fontSize: 20, fontWeight: 'bold', color: '#202223', marginBottom: 10 },
  scannerDoneText: { textAlign: 'center', color: '#666', marginTop: 25, fontSize: 15 },
  scannerItemRow: { flexDirection: 'row', alignItems: 'center', paddingVertical: 10, borderBottomWidth: 1, borderColor: '#eee' },
  scannerThumb: { width: 56, height: 56, borderRadius: 8, marginRight: 12 },
  scannerItemName: { fontSize: 14, fontWeight: '600', color: '#202223' },
  scannerItemSku: { fontSize: 12, color: '#666', marginTop: 2 },
  scannerRemainingBadge: { backgroundColor: '#e8f4fd', paddingVertical: 8, paddingHorizontal: 12, borderRadius: 999 },
  scannerRemainingText: { color: '#007ace', fontWeight: 'bold', fontSize: 12 },
  scannerPermissionPanel: { flex: 1, backgroundColor: '#fff', justifyContent: 'center', padding: 24 },
  scannerPermissionTitle: { fontSize: 24, fontWeight: 'bold', color: '#202223', textAlign: 'center', marginBottom: 12 },
  scannerPermissionText: { fontSize: 16, color: '#4a4a4a', textAlign: 'center', marginBottom: 24 },
  scannerPermissionBtn: { paddingVertical: 14, borderRadius: 8, alignItems: 'center', marginTop: 10 },
  adminStaffRow: { flexDirection: 'row', alignItems: 'center', backgroundColor: '#fff', padding: 15, borderRadius: 10, marginBottom: 10, elevation: 1, shadowColor: '#000', shadowOpacity: 0.05, shadowRadius: 3 },
  adminStaffName: { fontSize: 16, fontWeight: '600', color: '#202223' },
  adminTrashBtn: { padding: 8, borderRadius: 8, backgroundColor: '#fdecea' },
  centeredView: { flex: 1, backgroundColor: 'rgba(0,0,0,0.5)', justifyContent: 'center', alignItems: 'center' },
  lockOverrideModal: { backgroundColor: '#fff', padding: 30, borderRadius: 15, width: '80%', alignItems: 'center', elevation: 10, shadowColor: '#000', shadowOpacity: 0.25, shadowRadius: 10 },
  lockOverrideTitle: { fontSize: 20, fontWeight: '900', color: '#c0392b', marginBottom: 15, textAlign: 'center' },
  lockOverrideMessage: { fontSize: 16, color: '#333', marginBottom: 10, textAlign: 'center' },
  lockOverrideSubtitle: { fontSize: 14, color: '#666', marginBottom: 20, textAlign: 'center', fontStyle: 'italic' },
  lockCountdownBox: { backgroundColor: '#f9f9f9', borderRadius: 10, padding: 20, marginBottom: 20, borderWidth: 2, borderColor: '#e74c3c', alignItems: 'center' },
  lockCountdownText: { fontSize: 48, fontWeight: '900', color: '#c0392b' },
  // Onboarding styles
  obContainer: { flex: 1, backgroundColor: '#007a58' },
  obCenter: { flex: 1, alignItems: 'center', justifyContent: 'center', padding: 32 },
  obScrollContent: { padding: 28, paddingTop: Platform.OS === 'ios' ? 72 : 56, paddingBottom: 48 },
  obLogo: { fontSize: 68, marginBottom: 16 },
  obAppName: { fontSize: 30, fontWeight: '900', color: '#fff', marginBottom: 8, textAlign: 'center' },
  obTagline: { fontSize: 15, color: 'rgba(255,255,255,0.7)', marginBottom: 0, textAlign: 'center' },
  obBtnPrimary: { backgroundColor: '#fff', borderRadius: 12, padding: 18, alignItems: 'center', marginBottom: 14 },
  obBtnPrimaryText: { color: '#007a58', fontWeight: '900', fontSize: 16 },
  obBtnSecondary: { borderWidth: 2, borderColor: 'rgba(255,255,255,0.55)', borderRadius: 12, padding: 18, alignItems: 'center' },
  obBtnSecondaryText: { color: '#fff', fontWeight: 'bold', fontSize: 16 },
  obBackBtn: { marginBottom: 22 },
  obBackText: { color: 'rgba(255,255,255,0.8)', fontSize: 15, fontWeight: 'bold' },
  obStepTitle: { fontSize: 24, fontWeight: '900', color: '#fff', marginBottom: 8 },
  obStepSub: { fontSize: 13, color: 'rgba(255,255,255,0.7)', marginBottom: 26, lineHeight: 19 },
  obLabel: { fontSize: 11, fontWeight: '800', color: 'rgba(255,255,255,0.8)', marginBottom: 6, textTransform: 'uppercase', letterSpacing: 0.6 },
  obInput: { backgroundColor: '#fff', borderRadius: 10, padding: 14, fontSize: 16, marginBottom: 18, color: '#202223' },
  obToggleRow: { flexDirection: 'row', alignItems: 'center', marginBottom: 22, paddingVertical: 4 },
  obErrorBox: { backgroundColor: 'rgba(0,0,0,0.25)', borderRadius: 8, padding: 12, marginBottom: 16, borderLeftWidth: 4, borderLeftColor: '#ff6b6b' },
  obErrorText: { color: '#fff', fontSize: 14, fontWeight: '600' },
  obChip: { flex: 1, borderWidth: 2, borderColor: 'rgba(255,255,255,0.45)', borderRadius: 10, padding: 14, alignItems: 'center' },
  obChipActive: { backgroundColor: '#fff', borderColor: '#fff' },
  obChipText: { color: 'rgba(255,255,255,0.85)', fontWeight: 'bold', fontSize: 14 },
  obChipTextActive: { color: '#007a58', fontWeight: '900' },
  obDivider: { height: 1, backgroundColor: 'rgba(255,255,255,0.2)', marginVertical: 22 },
});
