{% liquid
  assign border = block.settings.border
  assign border_color = block.settings.border_color
  assign border_radius = block.settings.border_radius
  assign background_color = block.settings.background_color
  assign icon_color = block.settings.icon_color
  assign text_color = block.settings.text_color
  assign font_size = block.settings.font_size
  assign font_message = block.settings.font_family_message
  assign disable_weekends = block.settings.disable_weekends
  assign delivery_days = block.settings.delivery_days
  assign message = block.settings.message
  assign cut_off_time = block.settings.cut_off_time
  assign time_zone = block.settings.time_zone
  capture truck_icon
   render 'truck-icon' height: 28, width: 32, fill: icon_color
  endcapture
%}
{% style %}
{{ font_message | font_face }}
  .delivery-date-container{
    display: flex;
    padding: 12px;
    gap: 12px;
    align-items: flex-start;
  }
  .delivery-date-container svg{
    width: 32px;
    height: 28px;
  }
  .delivery-date-container .rte > *{
    margin: 0;
    line-height: normal;
  }
  {{ block.id | prepend:'#' }} .rte > *{
    color: {{ text_color }};
    font-size: {{ font_size }}px;
    font-family: {{ font_message.family }}, {{ font_message.fallback_families }};
    font-weight: {{ font_message.weight }};
    font-style: {{ font_message.style }};
  }
  {{ block.id | prepend:'#' }} {
       border: {{ border }}px solid {{ border_color }};
       border-radius: {{ border_radius }}px;
       background-color: {{ background_color }};       
   }
   {{ block.id | prepend:'#' }} svg{
    fill: {{ icon_color }};
   }
{% endstyle %}

<div class="{{ block.settings.visibility }}"
  {{ block.shopify_attributes }}
  style="--margin-top: {{ block.settings.margin_top | divided_by: 10.0 }}rem;--margin-bottom: {{ block.settings.margin_bottom | divided_by: 10.0 }}rem;"

>

<div id="{{ block.id }}">
  {% capture settings %}
    {
      "disable_weekends": {{ disable_weekends | json }},
      "delivery_days": {{ delivery_days | json }},
      "truck_icon": {{ truck_icon | json }},
      "message": {{ message | json }},
      "cut_off_time": {{ cut_off_time | json }},
      "time_zone": {{ time_zone | json }}
      
    }
    {% endcapture %}
  <current-date data-settings="{{ settings | escape }}"></current-date>
</div>
  </div>
<script src="{{ "current-date.js" |  asset_url }}" defer></script>