<?php
$formatter = Wpw::inst()->formatter();
$config = (isset($config) && !empty($config))
    ? $config
    : [];
// accent color
$accent_color = get_theme_mod('wpw_accent_colors');
$accent_color = json_decode(urldecode($accent_color), true);
$accent_color = (isset($accent_color[0]) && !empty($accent_color[0]))
    ? $accent_color[0]
    : 'rgb(25, 87, 243)';
// accent color
$secondary_color = get_theme_mod('wpw_secondary_text_color');
$secondary_color = json_decode(urldecode($secondary_color), true);
$secondary_color = (isset($secondary_color[0]) && !empty($secondary_color[0]))
    ? $secondary_color[0]
    : 'rgb(0,0,0,.6)';
//font
$font = get_theme_mod('wpw_headings_font');
// font size
$size = get_theme_mod('wpw_headings_ratio');
$_value = (!empty($size) && is_string($size))
    ? json_decode(urldecode_deep($size), true)
    : [];
$ratio = (isset($_value['ratio']) && !empty($_value['ratio']))
    ? $_value['ratio']
    : 4 / 3;
$headings_size = Wpw::inst()->helpers()->get_font_ratio($ratio);
foreach ($headings_size as $heading => $heading_size) {
    if (!isset($_value[$heading]) || empty($_value[$heading])) {
        $headings_size[$heading] = urlencode(json_encode($heading_size));
        continue;
    }
    $heading_size = json_decode(urldecode($_value[$heading]), true);
    $headings_size[$heading] = urlencode(json_encode($heading_size));
}
$headings_size['h1'] = str_replace('units', 'unit', $headings_size['h1']);
// text transform
$text_transform_default = get_theme_mod('wpw_headings_text_transform');
// letter spacing
$_letter_spacing = get_theme_mod('wpw_headings_font_letter_spacing');
if (empty($_letter_spacing)) {
    $_letter_spacing = '%7B%22number%22%3A%220.075%22%2C%22unit%22%3A%22rem%22%7D';
}
// main color
$main_color = get_theme_mod('wpw_accent_colors');
$main_color = (!empty($main_color) && is_string($main_color))
    ? json_decode(urldecode_deep($main_color))
    : null;
$main_color = (isset($main_color[0]) && !empty($main_color[0]))
    ? $main_color[0]
    : '#ffab00';
// container type
$lg_container_type = get_theme_mod('wpw_container_type', 'container-fluid');
$md_container_type = get_theme_mod('wpw_middle_container_type', 'container-fluid');
$sm_container_type = get_theme_mod('wpw_small_container_type', 'container-fluid');
// container width
$default_container_width = '%7B%22number%22%3A%2275%22%2C%22unit%22%3A%22%25%22%7D';
$md_container_width = get_theme_mod('wpw_middle_max_width');
if (empty($md_container_width)) {
    $md_container_width = $default_container_width;
}
$sm_container_width = get_theme_mod('wpw_small_max_width');
if (empty($sm_container_width)) {
    $sm_container_width = $default_container_width;
}
$lg_container_width = get_theme_mod('wpw_max_width');
if (empty($lg_container_width)) {
    $lg_container_width = $default_container_width;
}
$default_width = [
    'number' => 100,
    'unit' => '%',
];
$default_indents = [];


/**
 *-------------------------------- Main-----------------------------------------------
 */
// color
$text_color = (isset($config['header_v3_color']) && !empty($config['header_v3_color']))
    ? $config['header_v3_color']
    : '';
$text_color = Wpw::inst()->storage()->get($text_color);
// typography
$typography = (isset($config['header_v3_typography']) && !empty($config['header_v3_typography']))
    ? $config['header_v3_typography']
    : 'main';
$typography = $formatter->dynamic_typography($typography, '.wpw .variate-header_variant-3 h1.h3');
// title_divider_color
$title_divider = (isset($config['header_v3_title_divider']) && $config['header_v3_title_divider'])
    ? 'block'
    : 'none';
$title_divider_color = (isset($config['header_v3_title_divider_color']) && !empty($config['header_v3_title_divider_color']))
    ? $config['header_v3_title_divider_color']
    : '';
$title_divider_color = Wpw::inst()->storage()->get($title_divider_color);


/**
 * ------------------------------- Panel ----------------------------------
 * Panel lg
 */
// width
$lg_width_type = (isset($config['header_v3_layout']) && !empty($config['header_v3_layout']))
    ? $config['header_v3_layout']
    : 'container';
$lg_width = (isset($config['header_v3__width']) && !empty($config['header_v3__width']))
    ? $config['header_v3__width']
    : null;
if ($lg_width_type == 'full') {
    $lg_width = $default_width;
} elseif ($lg_width_type == 'container') {
    $lg_width = $lg_container_width;
}
$lg_width = $formatter->css_scalar($lg_width);
// margins 
$lg_margins = (isset($config['header_v3_outer_indent']) && !empty($config['header_v3_outer_indent']))
    ? $config['header_v3_outer_indent']
    : null;
$lg_margins = $formatter->css_spacing($lg_margins, $default_indents);
// border
$lg_border_style = (isset($config['header_v3_border']) && !empty($config['header_v3_border']))
    ? $config['header_v3_border']
    : 'none';
$lg_border_model = (isset($config['header_v3_border_model']) && !empty($config['header_v3_border_model']))
    ? $config['header_v3_border_model']
    : null;
$lg_border_color = (isset($config['header_v3_border_color']) && !empty($config['header_v3_border_color']))
    ? $config['header_v3_border_color']
    : null;
$lg_border_color = Wpw::inst()->storage()->get($lg_border_color);
$lg_border = $formatter->css_border_simplify($lg_border_style, $lg_border_model, $lg_border_color);
// border radius
$lg_border_radius = (isset($config['header_v3_border_radius']) && !empty($config['header_v3_border_radius']))
    ? $config['header_v3_border_radius']
    : null;
$lg_border_radius = $formatter->css_spacing($lg_border_radius);
/**
 * Panel md
 */
// width
$md_width_type = (isset($config['header_v3_middle_layout']) && !empty($config['header_v3_middle_layout']))
    ? $config['header_v3_middle_layout']
    : 'container';
$md_width = (isset($config['header_v3_middle_width']) && !empty($config['header_v3_middle_width']))
    ? $config['header_v3_middle_width']
    : null;
if ($md_width_type == 'full') {
    $md_width = $default_width;
} elseif ($md_width_type == 'container') {
    $md_width = $md_container_width;
}
$md_width = $formatter->css_scalar($md_width);
// margins 
$md_margins = (isset($config['header_v3_middle_outer_indent']) && !empty($config['header_v3_middle_outer_indent']))
    ? $config['header_v3_middle_outer_indent']
    : null;
$md_margins = $formatter->css_spacing($md_margins, $default_indents);
// border
$md_border_style = (isset($config['header_v3_middle_border']) && !empty($config['header_v3_middle_border']))
    ? $config['header_v3_middle_border']
    : 'none';
$md_border_model = (isset($config['header_v3_middle_border_model']) && !empty($config['header_v3_middle_border_model']))
    ? $config['header_v3_middle_border_model']
    : null;
$md_border_color = (isset($config['header_v3_middle_border_color']) && !empty($config['header_v3_middle_border_color']))
    ? $config['header_v3_middle_border_color']
    : null;
$md_border_color = Wpw::inst()->storage()->get($md_border_color);
$md_border = $formatter->css_border_simplify($md_border_style, $md_border_model, $md_border_color);
// border radius
$md_border_radius = (isset($config['header_v3_middle_border_radius']) && !empty($config['header_v3_middle_border_radius']))
    ? $config['header_v3_middle_border_radius']
    : null;
$md_border_radius = $formatter->css_spacing($md_border_radius);
/**
 * Panel sm
 */
// width
$sm_width_type = (isset($config['header_v3_small_layout']) && !empty($config['header_v3_small_layout']))
    ? $config['header_v3_small_layout']
    : 'container';
$sm_width = (isset($config['header_v3_small_width']) && !empty($config['header_v3_small_width']))
    ? $config['header_v3_small_width']
    : null;
if ($sm_width_type == 'full') {
    $sm_width = $default_width;
} elseif ($sm_width_type == 'container') {
    $sm_width = $sm_container_width;
}
$sm_width = $formatter->css_scalar($sm_width);
// margins
$sm_margins = (isset($config['header_v3_small_outer_indent']) && !empty($config['header_v3_small_outer_indent']))
    ? $config['header_v3_small_outer_indent']
    : null;
$sm_margins = $formatter->css_spacing($sm_margins, $default_indents);
// border
$sm_border_style = (isset($config['header_v3_small_border']) && !empty($config['header_v3_small_border']))
    ? $config['header_v3_small_border']
    : 'none';
$sm_border_model = (isset($config['header_v3_small_border_model']) && !empty($config['header_v3_small_border_model']))
    ? $config['header_v3_small_border_model']
    : null;
$sm_border_color = (isset($config['header_v3_small_border_color']) && !empty($config['header_v3_small_border_color']))
    ? $config['header_v3_small_border_color']
    : null;
$sm_border_color = Wpw::inst()->storage()->get($sm_border_color);
$sm_border = $formatter->css_border_simplify($sm_border_style, $sm_border_model, $sm_border_color);
// border radius
$sm_border_radius = (isset($config['header_v3_small_border_radius']) && !empty($config['header_v3_small_border_radius']))
    ? $config['header_v3_small_border_radius']
    : null;
$sm_border_radius = $formatter->css_spacing($sm_border_radius);

/**
 * ------------------------------- Content -------------------------------------------
 * Content lg
 */
// width
$lg_content_width_type = (isset($config['header_v3_container_width_type']) && !empty($config['header_v3_container_width_type']))
    ? $config['header_v3_container_width_type']
    : 'container';
$lg_content_width = (isset($config['header_v3_container_width']) && !empty($config['header_v3_container_width']))
    ? $config['header_v3_container_width']
    : null;
if ($lg_content_width_type == 'full') {
    $lg_content_width = $default_width;
} elseif ($lg_content_width_type == 'container') {
    $lg_content_width = $lg_width_type == $lg_content_width_type
        ? $default_width
        : $lg_container_width;
}
$lg_content_width = $formatter->css_scalar($lg_content_width);
// paddings
$lg_paddings = (isset($config['header_v3_inner_indent']) && !empty($config['header_v3_inner_indent']))
    ? $config['header_v3_inner_indent']
    : null;
$lg_paddings = $formatter->css_spacing($lg_paddings, $default_indents);
/**
 * Content md
 */
// width
$md_content_width_type = (isset($config['header_v3_middle_container_width_type']) && !empty($config['header_v3_middle_container_width_type']))
    ? $config['header_v3_middle_container_width_type']
    : 'container';
$md_content_width = (isset($config['header_v3_middle_container_width']) && !empty($config['header_v3_middle_container_width']))
    ? $config['header_v3_middle_container_width']
    : null;
if ($md_content_width_type == 'full') {
    $md_content_width = $default_width;
} elseif ($md_content_width_type == 'container') {
    $md_content_width = $md_width_type == $md_content_width_type
        ? $default_width
        : $md_container_width;
}
$md_content_width = $formatter->css_scalar($md_content_width);
// paddings
$md_paddings = (isset($config['header_v3_middle_inner_indent']) && !empty($config['header_v3_middle_inner_indent']))
    ? $config['header_v3_middle_inner_indent']
    : null;
$md_paddings = $formatter->css_spacing($md_paddings, $default_indents);

/**
 * Content sm
 */
// width
$sm_content_width_type = (isset($config['header_v3_small_container_width_type']) && !empty($config['header_v3_small_container_width_type']))
    ? $config['header_v3_small_container_width_type']
    : 'container';
$sm_content_width = (isset($config['header_v3_small_container_width']) && !empty($config['header_v3_small_container_width']))
    ? $config['header_v3_small_container_width']
    : null;
if ($sm_content_width_type == 'full') {
    $sm_content_width = $default_width;
} elseif ($sm_content_width_type == 'container') {
    $sm_content_width = $sm_width_type == $sm_content_width_type
        ? $default_width
        : $sm_container_width;
}
$sm_content_width = $formatter->css_scalar($sm_content_width);
// paddings
$sm_paddings = (isset($config['header_v3_small_inner_indent']) && !empty($config['header_v3_small_inner_indent']))
    ? $config['header_v3_small_inner_indent']
    : null;
$sm_paddings = $formatter->css_spacing($sm_paddings, $default_indents);

/**
 * Bg
 */
$_bg = !empty($config['header_v3_background'])
    ? $config['header_v3_background']
    : null;
$bg = $formatter->from_bg($_bg);

$out_style = /** @lang CSS */
    '
/*VARIANT-3 STYLE*/

' . $typography . '
.wpw .variate-header_variant-3 h1.h3  {
    color: ' . $text_color . ';
}

.variate-header_variant-3,
.variate-header_variant-3 li > a {
    color: ' . $text_color . ';
}

.variate-header_variant-3 .color-line-after:after {
    display: ' . $title_divider . ';
    background-color: ' . $title_divider_color . ';
}

@media (min-width: 0px) and (max-width: 767px) {
    .variate-header_variant-3  .variate-header__panel {
        width: ' . $sm_width . ';
    }
    
    .variate-header_variant-3 {
        padding: ' . $sm_margins . ';
    }
    
    .variate-header_variant-3 .panels-bg {
        border-radius: ' . $sm_border_radius . ';
        ' . $sm_border . '
    }
    
    .variate-header_variant-3 .variate-header__content {
        width: ' . $sm_content_width . ';
        padding: ' . $sm_paddings . ';
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .variate-header_variant-3  .variate-header__panel {
        width: ' . $md_width . ';
    }
    
    .variate-header_variant-3 {
        padding: ' . $md_margins . ';
    }
    
    .variate-header_variant-3 .panels-bg {
        border-radius: ' . $md_border_radius . ';
        ' . $md_border . '
    }
    
    .variate-header_variant-3 .variate-header__content {
        width: ' . $md_content_width . ';
        padding: ' . $md_paddings . ';
    }
}

@media (min-width: 992px) {
    .variate-header_variant-3  .variate-header__panel {
        width: ' . $lg_width . ';
    }
    
    .variate-header_variant-3 {
        padding: ' . $lg_margins . ';
    }
    
    .variate-header_variant-3 .panels-bg {
        border-radius: ' . $lg_border_radius . ';
        ' . $lg_border . '
    }
    
    .variate-header_variant-3 .variate-header__content {
        width: ' . $lg_content_width . ';
        padding: ' . $lg_paddings . ';
    }
}


';


if (!$formatter->is_empty_bg($_bg)) {
    $out_style .= '
.variate-header_variant-3 .panels-bg > .image-layer {
    background-image: url("' . $bg['image'] . '");
}

.variate-header_variant-3 .panels-bg > .pattern-layer {
    background-image: url("' . $bg['pattern'] . '");
    background-repeat: repeat;
    opacity: ' . $bg['pattern_opacity'] . '
}

.variate-header_variant-3 .panels-bg > .gradient-layer{
     ' . $bg['gradient'] . '
}

.variate-header_variant-3 .panels-bg > div.color-layer {
    background-color: ' . $bg['color'] . ';
}
    ';
}

print($out_style);