<?php /* NOTE: GENERATED BY GULP !!! */ ?><?php
$b = "flo-block-pricing-packages"; // To be used inside HTML

// Start: Class name automation
  $b__for_css = ".".$b; // To be used inside CSS
  $b__uniq = $b."--".mt_rand(1, 999); // To be used inside HTML
  $b__uniq_for_css = ".".$b__uniq; // To be used inside CSS
// End: Class name automation

// A. Title Area
  $pretitle = flo_data($data, "pretitle");
  $pretitle_font = flo_data($data, "pretitle_font");
  $title = flo_data($data, "title");
  $title_font = flo_data($data, "title_font");
  $title_color = flo_data($data, "title_color");
// B. Pricing Packages
  $pricing_packages = flo_data($data, "pricing_packages");
  $package_overlay_background_color = flo_data($data, "package_overlay_background_color");
  $package_overlay_elements_color = flo_data($data, "package_overlay_elements_color");
  $package_title_font = flo_data($data, "package_title_font");
  $package_description_font = flo_data($data, "package_text_font");
  $package_price_font = flo_data($data, "package_bottom_label_font");
// C. Button Area
  $button_link = flo_data($data, "button_link");
  $button_link_font = flo_data($data, "button_link_font");
  $button_link_color = flo_data($data, "button_link_color");
  $button_link_background_color = flo_data($data, "button_link_background_color");

  $total_packages_number = count($pricing_packages);
  $package_number_class = $total_packages_number == 3 ? $b."__packages-area--3-packages" : "";
?>

<?php echo $__env->make('core.style', [
  "breakpoint__general" => "

  ".
  flo_render_typography_styles(
  $b__uniq_for_css." ".$b__for_css."__pretitle",
  $pretitle_font
  )
  ."

  ".
  flo_render_typography_styles(
  $b__uniq_for_css." ".$b__for_css."__title",
  $title_font
  )
  ."

  ".
  flo_render_typography_styles(
  $b__uniq_for_css." ".$b__for_css."__package-title",
  $package_title_font
  )
  ."

  ".
  flo_render_typography_styles(
  $b__uniq_for_css." ".$b__for_css."__package-description",
  $package_description_font
  )
  ."

  ".
  flo_render_typography_styles(
  $b__uniq_for_css." ".$b__for_css."__package-price",
  $package_price_font
  )
  ."

  ".
  flo_render_typography_styles(
  $b__uniq_for_css." ".$b__for_css."__package-block-button",
  $button_link_font
  )
  ."

  ".$b__uniq_for_css." ".$b__for_css."__image-overlay {
    background-color: ".$package_overlay_background_color.";
  }
  ".$b__uniq_for_css." ".$b__for_css."__package-block-button {
    color: ".$button_link_color.";
    background-color: ".$button_link_background_color.";
    border-color: ".hex2rgba($button_link_color,0.1).";
  }
    ".$b__uniq_for_css." ".$b__for_css."__package-block-button:hover {
      color: ".$button_link_background_color.";
      background-color: ".$button_link_color.";
      border-color: ".$button_link_color.";
    }

  ".$b__uniq_for_css." ".$b__for_css."__title,
  ".$b__uniq_for_css." ".$b__for_css."__pretitle {
    color: ".$title_color.";
  }"
], array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<?php $__env->startSection('block_content'); ?>
  <div class="<?php echo $b; ?> <?php echo $b__uniq; ?>">
    <?php if($title or $pretitle): ?>
      <div class="<?php echo $b; ?>__title-area">

        <?php if($pretitle): ?>
          <h3 class="<?php echo $b; ?>__pretitle">
            <?php echo $pretitle; ?>

          </h3>
        <?php endif; ?>

        <?php if($title): ?>
          <h2 class="<?php echo $b; ?>__title">
            <?php echo $title; ?>

          </h2>
        <?php endif; ?>

      </div>
    <?php endif; ?>
    <div class="<?php echo $b; ?>__packages-area <?php echo $package_number_class; ?>">
      <?php foreach($pricing_packages as $pricing_package): ?>
        <?php
          $package_image = flo_data($pricing_package, "image");
          $package_title = flo_data($pricing_package, "title");
          $package_description = flo_data($pricing_package, "text");
          $package_price = flo_data($pricing_package, "bottom_label");
          $package_url = flo_data($pricing_package, "package_url");
          $package_elements_color_on_image = flo_data($pricing_package, "elements_on_image_color");

          $srcset_sizes = [
           'mobile' => array('width' => 600, 'height' => 950),  // mobile size
           'tablet' => array('width' => 1024/ $total_packages_number * 2 , 'height' =>760 ), // tablet size
           'desktop' => array('width' => (1280 - 290) / $total_packages_number * 2, 'height' => 950),
          ];

          $image_srcset = generate_srcsets($package_image['url'], $srcset_sizes, $crop = true);

        ?>

        <div class="<?php echo $b; ?>__package"
        style="
          --elements-on-image-color:<?php echo $package_elements_color_on_image; ?>;
          --elements-on-hover-color:<?php echo $package_overlay_elements_color; ?>;
        ">
          <img class="<?php echo $b; ?>__package-image"
          src="<?php echo $package_image['url']; ?>"
          srcset="<?php echo $image_srcset['srcsets']; ?>"
          alt="<?php echo $package_image['alt']; ?>"
          sizes="<?php echo $image_srcset['sizes']; ?>"/>
          <div class="<?php echo $b; ?>__package-content">
            <div class="<?php echo $b; ?>__image-overlay"></div>

            <?php if($package_title): ?>
              <h3 class="<?php echo $b; ?>__package-title"><?php echo $package_title; ?></h3>
            <?php endif; ?>

            <?php if($package_description): ?>
              <p class="<?php echo $b; ?>__package-description"><?php echo $package_description; ?></p>
            <?php endif; ?>

            <?php if($package_price): ?>
              <div class="<?php echo $b; ?>__package-price"><?php echo $package_price; ?></div>
            <?php endif; ?>

          </div>
          <?php if($package_url): ?>
            <a href="<?php echo $package_url; ?>" class="<?php echo $b; ?>__package-link" aria-label="<?php echo $package_image['alt']; ?>"></a>
          <?php endif; ?>
        </div>
      <?php endforeach; ?>
    </div>
    <?php if($button_link): ?>
      <div class="<?php echo $b; ?>__package-block-button-wrap">
        <a class="<?php echo $b; ?>__package-block-button" href="<?php echo $button_link['url']; ?>"><?php echo $button_link['title']; ?></a>
      </div>
    <?php endif; ?>
  </div>
<?php $__env->stopSection(true); ?>

<?php echo $__env->make('layout.block', [
  "block_classes" => "", // Will be added to main block div. e.g. flo-block--full-width
  // "data_onready" => "block_name" // Specify a function (see _blank.js on how to define) that will be executed on document ready.
], array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>