<?php
$wpw = Wpw::inst();
$resource = $wpw->resource();
$formatter = $wpw->formatter();
$storage = $wpw->storage();
unset($wpw);
$default_colors = $formatter->parse_mod('wpw_form_colors');

$primary_text_color = '#555';
$divider_color = 'rgba(0,0,0,.3)';
$accent_color = '#ffab00';

$class_name = !empty($config['class_name'])
    ? '.' . $config['class_name']
    : '.project-input_text-primary';

$default_paddings = [
    'top' => [
        'number' => 10,
    ],
    'bottom' => [
        'number' => 10,
    ],
    'right' => [
        'number' => 10,
    ],
    'left' => [
        'number' => 10,
    ],
];

$default_border = [
    'top' => [
        'number' => 1,
    ],
    'bottom' => [
        'number' => 1,
    ],
    'right' => [
        'number' => 1,
    ],
    'left' => [
        'number' => 1,
    ],
];


// secondary color
$secondary_color = 'rgba(0,0,0,0.6)';

// disabled color
$disabled_color = 'rgba(0,0,0,.3)';


$icon_font = Wpw::inst()->storage()->get('default_icon_font');


/**
 * Form defaults
 */
// indents
$form_default_padding =  $default_paddings;
$form_default_margins =  [];

// border

$form_default_border_style =  'solid';
$form_default_border_model =  $default_border;
$form_default_border_radius =  [];

$form_default_border_style_hover =  'solid';
$form_default_border_model_hover =  $default_border;
$form_default_border_radius_hover =  [];

$form_default_border_style_focus =  'solid';
$form_default_border_model_focus = $default_border;
$form_default_border_radius_focus =  [];

// colors

$form_default_border_color =  $divider_color;
$form_default_control_color =  $accent_color;

$form_default_border_color_hover =  $divider_color;
$form_default_control_color_hover =  $accent_color;

$form_default_border_color_focus =  $divider_color;
$form_default_control_color_focus =  $accent_color;

// background


// shadow
$form_default_bs_hl = '';
$form_default_bs_vl =  '';
$form_default_bs_br =  '';
$form_default_bs_sr =  '';
$form_default_bs_color =  '';

$form_default_bs_hl_hover =  '';
$form_default_bs_vl_hover =  '';
$form_default_bs_br_hover =  '';
$form_default_bs_sr_hover =  '';
$form_default_bs_color_hover =  '';

$form_default_bs_hl_focus =  '';
$form_default_bs_vl_focus =  '';
$form_default_bs_br_focus =  '';
$form_default_bs_sr_focus =  '';
$form_default_bs_color_focus =  '';

$input_padding = !empty($config['input_padding'])
    ? $config['input_padding']
    : $form_default_padding;
$input_padding = $formatter->css_spacing($input_padding);
$input_margin = !empty($config['input_margin'])
    ? $config['input_margin']
    : $form_default_margins;


$input_margin = $formatter->css_spacing($input_margin);

$input_use_icon_glyph = !empty($config['input_use_icon_glyph'])
    ? $config['input_use_icon_glyph']
    : 'on';
$input_glyph = $input_hover_glyph = $input_focus_glyph = '';

$input_typography = !empty($config['input_typography'])
    ? $config['input_typography']
    : 'main';
$_input_typography = $formatter->dynamic_typography($input_typography, $class_name.'.project-input.project-input_text ::placeholder');
$_webkit_input_typography = $formatter->dynamic_typography($input_typography, $class_name.'.project-input.project-input_text ::-webkit-input-placeholder');
$_ms_input_typography = $formatter->dynamic_typography($input_typography, $class_name.'.project-input.project-input_text ::-ms-input-placeholder');
$_ms2_input_typography = $formatter->dynamic_typography($input_typography, $class_name.'.project-input.project-input_text :-ms-input-placeholder');
$input_typography = $formatter->dynamic_typography($input_typography, $class_name.'.project-input.project-input_text,  '.$class_name.'.project-input.project-input_text');


// default ===========================================
// border
$input_border_style = !empty($config['input_border_style'])
    ? $config['input_border_style']
    : $form_default_border_style;
$input_border_model = !empty($config['input_border_model'])
    ? $config['input_border_model']
    : $form_default_border_model;
$border_model_alter = $formatter->from_spacing($input_border_model);
$input_border_model = $formatter->css_spacing($input_border_model);
$input_border_radius = !empty($config['input_border_radius'])
    ? $config['input_border_radius']
    : $form_default_border_radius;
$input_border_radius = $formatter->css_spacing($input_border_radius);
// color
$input_use_default_color = !empty($config['input_use_default_color'])
    ? $config['input_use_default_color']
    : 'on';
$input_border_color = !empty($config['input_border_color'])
    ? $config['input_border_color']
    : '';
$input_border_color = Wpw::inst()->storage()->get($input_border_color);
$input_placeholder_color = !empty($config['input_placeholder_color'])
    ? $config['input_placeholder_color']
    : '';
$input_placeholder_color = $storage->get($input_placeholder_color);
$input_text_color = !empty($config['input_text_color'])
    ? $config['input_text_color']
    : '';
$input_text_color = $storage->get($input_text_color);

// bg
$input_bg = !empty($config['input_bg'])
    ? $config['input_bg']
    : '';
$input_bg = $formatter->from_bg($input_bg);
// shadow
$input_bs_hl = !empty($config['input_bs_hl'])
    ? $config['input_bs_hl']
    : $form_default_bs_hl;
$input_bs_hl = $formatter->css_scalar($input_bs_hl);
$input_bs_vl = !empty($config['input_bs_vl'])
    ? $config['input_bs_vl']
    : $form_default_bs_vl;
$input_bs_vl = $formatter->css_scalar($input_bs_vl);
$input_bs_br = !empty($config['input_bs_br'])
    ? $config['input_bs_br']
    : $form_default_bs_br;
$input_bs_br = $formatter->css_scalar($input_bs_br);
$input_bs_sr = !empty($config['input_bs_sr'])
    ? $config['input_bs_sr']
    : $form_default_bs_sr;
$input_bs_sr = $formatter->css_scalar($input_bs_sr);
$input_bs_color = !empty($config['input_bs_color'])
    ? $config['input_bs_color']
    : '';
$input_bs_color = Wpw::inst()->storage()->get($input_bs_color);
$input_bs = " box-shadow: {$input_bs_hl} {$input_bs_vl} {$input_bs_br} {$input_bs_sr} {$input_bs_color}; ";

// hover ===========================================
// border
$input_hover_border_style = !empty($config['input_hover_border_style'])
    ? $config['input_hover_border_style']
    : $form_default_border_style_hover;
$input_hover_border_model = !empty($config['input_hover_border_model'])
    ? $config['input_hover_border_model']
    : $form_default_border_model_hover;
$border_model_hover_alter = $formatter->from_spacing($input_hover_border_model);
$input_hover_border_model = $formatter->css_spacing($input_hover_border_model);
$input_hover_border_radius = !empty($config['input_hover_border_radius'])
    ? $config['input_hover_border_radius']
    : $form_default_border_radius_hover;
$input_hover_border_radius = $formatter->css_spacing($input_hover_border_radius);
// color
$input_hover_use_default_color = !empty($config['input_hover_use_default_color'])
    ? $config['input_hover_use_default_color']
    : 'on';
$input_hover_border_color = !empty($config['input_hover_border_color'])
    ? $config['input_hover_border_color']
    : '';
$input_hover_border_color = Wpw::inst()->storage()->get($input_hover_border_color);
$input_hover_placeholder_color = !empty($config['input_hover_placeholder_color'])
    ? $config['input_hover_placeholder_color']
    : '';
$input_hover_placeholder_color = $storage->get($input_hover_placeholder_color);
$input_hover_text_color = !empty($config['input_hover_text_color'])
    ? $config['input_hover_text_color']
    : '';
$input_hover_text_color = $storage->get($input_hover_text_color);

// bg
$input_hover_bg = !empty($config['input_hover_bg'])
    ? $config['input_hover_bg']
    : '';
$input_hover_bg = $formatter->from_bg($input_hover_bg);
// shadow
$input_hover_bs_hl = !empty($config['input_hover_bs_hl'])
    ? $config['input_hover_bs_hl']
    : $form_default_bs_hl_hover;
$input_hover_bs_hl = $formatter->css_scalar($input_hover_bs_hl);
$input_hover_bs_vl = !empty($config['input_hover_bs_vl'])
    ? $config['input_hover_bs_vl']
    : $form_default_bs_vl_hover;
$input_hover_bs_vl = $formatter->css_scalar($input_hover_bs_vl);
$input_hover_bs_br = !empty($config['input_hover_bs_br'])
    ? $config['input_hover_bs_br']
    : $form_default_bs_br_hover;
$input_hover_bs_br = $formatter->css_scalar($input_hover_bs_br);
$input_hover_bs_sr = !empty($config['input_hover_bs_sr'])
    ? $config['input_hover_bs_sr']
    : $form_default_bs_sr_hover;
$input_hover_bs_sr = $formatter->css_scalar($input_hover_bs_sr);
$input_hover_bs_color = !empty($config['input_hover_bs_color'])
    ? $config['input_hover_bs_color']
    : '';
$input_hover_bs_color = Wpw::inst()->storage()->get($input_hover_bs_color);
$input_hover_bs = " box-shadow: {$input_hover_bs_hl} {$input_hover_bs_vl} {$input_hover_bs_br} {$input_hover_bs_sr} {$input_hover_bs_color}; ";

// focus ===========================================
// border
$input_focus_border_style = !empty($config['input_focus_border_style'])
    ? $config['input_focus_border_style']
    : $form_default_border_style_focus;
$input_focus_border_model = !empty($config['input_focus_border_model'])
    ? $config['input_focus_border_model']
    : $form_default_border_model_focus;
$border_model_focus_alter = $formatter->from_spacing($input_focus_border_model);
$input_focus_border_model = $formatter->css_spacing($input_focus_border_model);
$input_focus_border_radius = !empty($config['input_focus_border_radius'])
    ? $config['input_focus_border_radius']
    : $form_default_border_radius_focus;
$input_focus_border_radius = $formatter->css_spacing($input_focus_border_radius);
// color
$input_focus_use_default_color = !empty($config['input_focus_use_default_color'])
    ? $config['input_focus_use_default_color']
    : 'on';
$input_focus_border_color = !empty($config['input_focus_border_color'])
    ? $config['input_focus_border_color']
    : '';
$input_focus_border_color = Wpw::inst()->storage()->get($input_focus_border_color);
$input_focus_placeholder_color = !empty($config['input_focus_placeholder_color'])
    ? $config['input_focus_placeholder_color']
    : '';
$input_focus_placeholder_color = $storage->get($input_focus_placeholder_color);
$input_focus_text_color = !empty($config['input_focus_text_color'])
    ? $config['input_focus_text_color']
    : '';
$input_focus_text_color = $storage->get($input_focus_text_color);

// bg
$input_focus_bg = !empty($config['input_focus_bg'])
    ? $config['input_focus_bg']
    : '';
$input_focus_bg = $formatter->from_bg($input_focus_bg);
// shadow
$input_focus_bs_hl = !empty($config['input_focus_bs_hl'])
    ? $config['input_focus_bs_hl']
    : $form_default_bs_hl_focus;
$input_focus_bs_hl = $formatter->css_scalar($input_focus_bs_hl);
$input_focus_bs_vl = !empty($config['input_focus_bs_vl'])
    ? $config['input_focus_bs_vl']
    : $form_default_bs_vl_focus;
$input_focus_bs_vl = $formatter->css_scalar($input_focus_bs_vl);
$input_focus_bs_br = !empty($config['input_focus_bs_br'])
    ? $config['input_focus_bs_br']
    : $form_default_bs_br_focus;
$input_focus_bs_br = $formatter->css_scalar($input_focus_bs_br);
$input_focus_bs_sr = !empty($config['input_focus_bs_sr'])
    ? $config['input_focus_bs_sr']
    : $form_default_bs_sr_focus;
$input_focus_bs_sr = $formatter->css_scalar($input_focus_bs_sr);
$input_focus_bs_color = !empty($config['input_focus_bs_color'])
    ? $config['input_focus_bs_color']
    : '';
$input_focus_bs_color = Wpw::inst()->storage()->get($input_focus_bs_color);
$input_focus_bs = " box-shadow: {$input_focus_bs_hl} {$input_focus_bs_vl} {$input_focus_bs_br} {$input_focus_bs_sr} {$input_focus_bs_color}; ";


echo /** @lang CSS */
    '

body '.$class_name.'.project-input.project-input_text,
'.$class_name.'.project-input.project-input_text {
    color: '.$input_text_color.';

    padding: ' . $input_padding . ';
    margin: ' . $input_margin . ';

}

'.$class_name.'.project-input.project-input_text .background {
    border-style: ' . $input_border_style . ';
    border-width: ' . $input_border_model . ';
    border-color: ' . $input_border_color . ';
    border-radius: ' . $input_border_radius . ';
    ' . $input_bs . '
}

'.$input_typography.'
'.$_input_typography.'
'.$_webkit_input_typography.'
'.$_ms_input_typography.'
'.$_ms2_input_typography.'


'.$class_name.'.project-input.project-input_text ::-webkit-input-placeholder {
    color: '.$input_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text :-ms-input-placeholder {
    color: '.$input_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text ::-ms-input-placeholder {
    color: '.$input_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text ::placeholder {
    color: '.$input_placeholder_color.';
}

body '.$class_name.'.project-input.project-input_text .background > .color-layer,
'.$class_name.'.project-input.project-input_text .background > .color-layer {
    ' . $input_bg['fill'] . '
}

body '.$class_name.'.project-input.project-input_text .background > .image-layer,
'.$class_name.'.project-input.project-input_text .background > .image-layer {
    background-image: url("' . $input_bg['image'] . '");
}


body '.$class_name.'.project-input.project-input_text:hover,
'.$class_name.'.project-input.project-input_text:hover {
    color: '.$input_hover_text_color.';

    padding: ' . $input_padding . ';
    margin: ' . $input_margin . ';

}

'.$class_name.'.project-input.project-input_text:hover .background {
    border-style: ' . $input_hover_border_style . ';
    border-width: ' . $input_hover_border_model . ';
    border-color: ' . $input_hover_border_color . ';
    border-radius: ' . $input_hover_border_radius . ';
    ' . $input_hover_bs . '
}


'.$class_name.'.project-input.project-input_text:hover ::-webkit-input-placeholder {
    color: '.$input_hover_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text:hover :-ms-input-placeholder {
    color: '.$input_hover_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text:hover ::-ms-input-placeholder {
    color: '.$input_hover_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text:hover ::placeholder {
    color: '.$input_hover_placeholder_color.';
}

body '.$class_name.'.project-input.project-input_text:hover .background > .color-layer,
'.$class_name.'.project-input.project-input_text:hover .background > .color-layer {
    ' . $input_hover_bg['fill'] . '
}

body '.$class_name.'.project-input.project-input_text:hover .background > .image-layer,
'.$class_name.'.project-input.project-input_text:hover .background > .image-layer {
    background-image: url("' . $input_hover_bg['image'] . '");
}


body '.$class_name.'.project-input.project-input_text.project-input_focused,
'.$class_name.'.project-input.project-input_text.project-input_focused {
    color: '.$input_focus_text_color.';

    padding: ' . $input_padding . ';
    margin: ' . $input_margin . ';
}

'.$class_name.'.project-input.project-input_text.project-input_focused .background {
    border-style: ' . $input_focus_border_style . ';
    border-width: ' . $input_focus_border_model . ';
    border-color: ' . $input_focus_border_color . ';
    border-radius: ' . $input_focus_border_radius . ';
    ' . $input_focus_bs . '
}


'.$class_name.'.project-input.project-input_text.project-input_focused ::-webkit-input-placeholder {
    color: '.$input_focus_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text.project-input_focused :-ms-input-placeholder {
    color: '.$input_focus_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text.project-input_focused ::-ms-input-placeholder {
    color: '.$input_focus_placeholder_color.';
}
'.$class_name.'.project-input.project-input_text.project-input_focused ::placeholder {
    color: '.$input_focus_placeholder_color.';
}

body '.$class_name.'.project-input.project-input_text.project-input_focused .background > .color-layer,
'.$class_name.'.project-input.project-input_text.project-input_focused .background > .color-layer {
    ' . $input_focus_bg['fill'] . '
}

body '.$class_name.'.project-input.project-input_text.project-input_focused .background > .image-layer,
'.$class_name.'.project-input.project-input_text.project-input_focused .background > .image-layer {
    background-image: url("' . $input_focus_bg['image'] . '");
}
';