/*
    Предрейсовые осмотры - мобильное приложение
    Стили компонента модального окна с полем ввода
*/

//---------------------
//Подключение библиотек
//---------------------

const { StyleSheet, Platform } = require('react-native'); //StyleSheet React Native
const { APP_COLORS } = require('../../config/theme'); //Цветовая схема приложения
const { UI } = require('../../config/appConfig'); //Конфигурация UI
const { responsiveSize, responsiveSpacing, widthPercentage } = require('../../utils/responsive'); //Адаптивные утилиты

//-----------
//Тело модуля
//-----------

//Стили диалога ввода
const styles = StyleSheet.create({
    backdrop: {
        flex: 1,
        backgroundColor: APP_COLORS.overlay,
        justifyContent: 'center',
        alignItems: 'center',
        paddingHorizontal: UI.PADDING
    },
    container: {
        width: '100%',
        maxWidth: widthPercentage(90),
        backgroundColor: APP_COLORS.surface,
        borderRadius: UI.BORDER_RADIUS,
        ...Platform.select({
            ios: {
                shadowColor: APP_COLORS.black,
                shadowOpacity: 0.25,
                shadowRadius: 10,
                shadowOffset: { width: 0, height: 4 }
            },
            android: {
                elevation: 10
            },
            web: {
                boxShadow: '0 4px 10px rgba(0, 0, 0, 0.25)'
            }
        })
    },
    header: {
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'space-between',
        paddingHorizontal: UI.PADDING,
        paddingVertical: responsiveSpacing(3),
        borderBottomWidth: StyleSheet.hairlineWidth,
        borderBottomColor: APP_COLORS.borderSubtle
    },
    title: {
        fontSize: UI.FONT_SIZE_LG,
        fontWeight: '600',
        color: APP_COLORS.textPrimary,
        flex: 1
    },
    closeButton: {
        width: responsiveSize(32),
        height: responsiveSize(32),
        borderRadius: responsiveSize(16),
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: APP_COLORS.surfaceAlt
    },
    closeButtonText: {
        fontSize: responsiveSize(24),
        color: APP_COLORS.textSecondary,
        fontWeight: '300',
        lineHeight: responsiveSize(32)
    },
    content: {
        paddingHorizontal: UI.PADDING,
        paddingVertical: responsiveSpacing(4)
    },
    label: {
        marginBottom: responsiveSpacing(2),
        color: APP_COLORS.textSecondary
    },
    input: {
        height: UI.INPUT_HEIGHT,
        borderWidth: 1,
        borderColor: APP_COLORS.borderMedium,
        borderRadius: UI.BORDER_RADIUS,
        paddingHorizontal: responsiveSpacing(3),
        fontSize: UI.FONT_SIZE_MD,
        color: APP_COLORS.textPrimary,
        backgroundColor: APP_COLORS.surface
    },
    inputFocused: {
        borderColor: APP_COLORS.primary,
        borderWidth: 2
    },
    inputError: {
        borderColor: APP_COLORS.error
    },
    placeholder: {
        color: APP_COLORS.textTertiary
    },
    errorText: {
        color: APP_COLORS.error,
        marginTop: responsiveSpacing(1.5)
    },
    buttonsRow: {
        flexDirection: 'row',
        paddingHorizontal: UI.PADDING,
        paddingBottom: responsiveSpacing(4),
        gap: responsiveSpacing(3)
    },
    cancelButton: {
        flex: 1,
        backgroundColor: APP_COLORS.surfaceAlt,
        borderWidth: 1,
        borderColor: APP_COLORS.borderMedium
    },
    cancelButtonText: {
        color: APP_COLORS.textSecondary
    },
    confirmButton: {
        flex: 1
    }
});

//----------------
//Интерфейс модуля
//----------------

module.exports = styles;
