<?php
$datas = $args['data'];

$titre = isset($datas['titre']) ? $datas['titre'] : '';
$sous_titre = isset($datas['sous_titre']) ? $datas['sous_titre'] : '';
$specifications = isset($datas['specifications']) ? $datas['specifications'] : '';
$texte = isset($datas['texte']) ? $datas['texte'] : '';
$image = isset($datas['image']) ? $datas['image'] : '';
$vertical = isset($datas['alignement_vertical']) ? 'items-' . $datas['alignement_vertical'] : 'items-start';
// $sur_titre = isset($datas['sur_titre']) ? $datas['sur_titre'] : '';
// $sur_texte = isset($datas['sur_texte']) ? $datas['sur_texte'] : '';
$sens = isset($datas['reverse']) && $datas['reverse'] == true ?  'md:flex-row-reverse' : 'md:flex-row';
$textJustify = isset($datas['text_align']) ? 'text-' . $datas['text_align'] : 'text-left';
$textFullwidth = isset($datas['max_width']) && $datas['max_width'] == true ?  'max-w-lg' : 'w-full';
$lien = isset($datas['lien']) ? $datas['lien'] : '';
?>

<div class="container flex flex-col-reverse   <?php echo $sens . " " . $vertical ?> gap-10 lg:gap-28 relative py-10 lg:pb-28">
  <div class="left basis-5/12">
    <?php if ($image != false) { ?>
      <img <?php acf_responsive_image($image['ID'], 'full', '100%') ?> alt="" class="w-full  scroll-appear scroll-appear-image">
    <?php } ?>
  </div>

  <div class="right basis-6/12">
    <div>
      <?php if ($titre != '') : ?>
        <h2 class=" new-section-title !text-left scroll-appear"><?php echo $titre ?></h2>
      <?php endif ?>

      <?php if ($specifications != '') { ?>
        <ul class="mb-10 lg:mb-20">
          <?php foreach ($specifications as $specification) : ?>
            <?php if ($specification['titre'] != '') { ?>
              <li class="flex items-center text-[17px] mb-10 last-mb-0  scroll-appear">
                <strong class="new-section-title  !text-left  pr-4 !mb-0 "><?php echo $specification['titre'] ?></strong>
                <span class="w-[30px] h-[1px] bg-[#DEDEDE] "></span>
                <span class="tracking-[1px]  pl-4"><?php echo $specification['texte'] ?></span>
              </li>
            <?php } else { ?>
              <li class="flex items-center text-[17px] mb-1 scroll-appear">
                <span class="tracking-[1px]"><?php echo $specification['texte'] ?></span>
              </li>
            <?php } ?>
          <?php endforeach; ?>
        </ul>
      <?php } ?>
      <?php if ($sous_titre != '') { ?>
        <h3 class="new-section-title !text-left  mb-10 scroll-appear"><?php echo $sous_titre ?></h3>
      <?php } ?>
      <div class="scroll-appear <?php echo $textFullwidth ?> content  leading-relaxed"><?php echo $texte ?></div>

      <?php if ($lien != '') : ?>
        <div class="mt-10">
          <a href="<?php echo $lien['url']; ?>" class="btn btn-primary w-full md:w-auto"><?php echo $lien['title']; ?></a>
        </div>
      <?php endif; ?>
    </div>
  </div>
</div>