{# ========================================================================= #}
{# :: Imports #}
{# ========================================================================= #}
{# atoms #}
{% import "styleguides/general/atoms/icon-button/icon-button-macros.njk" as iconButton %}
{% import "styleguides/general/atoms/button/button-macros.njk" as button %}

{# molecules #}
{% import "styleguides/general/molecules/authentication/authentication-macros.njk" as authentication %}

{# organisms #}
{% import "styleguides/general/organisms/overlay/overlay-macros.njk" as overlay %}

{# ========================================================================= #}
{# :: Settings #}
{# ========================================================================= #}
{% set state %}
  {{"is-open" if pageParams.activeOverlay and "overlay-authentication" in pageParams.activeOverlay }}
{% endset %}

{# ========================================================================= #}
{# :: Overlay - content #}
{# ========================================================================= #}
{% set content %}


	{{iconButton.default("o-overlay__close", {
		overlay: "overlay-authentication",
		icon: "icon-cross"
	})}}

	<div class="l-section">
		<div class="l-section__content">
			<div class="l-content">
				<div class="l-container">
					{{authentication.default("", {
				    title: "Uw activatie code",
				    value: "FHJ3K",
				    id: "sg-authentication",
				    link: "Opnieuw verzenden"
				  })}}
				</div>
			</div>
		</div>
		<div class="l-section__footer l-section__footer--full-width">
			<div class="l-container">
				{{button.link("a-button--fill-space", {
					text: "Bevestigen"
				})}}
			</div>
		</div>
	</div>

{% endset %}

{# ========================================================================= #}
{# :: Partial #}
{# ========================================================================= #}
{{overlay.default(
  "o-overlay--center js-overlay " + state,
  {
    hasBackground: true,
    id: "overlay-authentication",
    content: content
  }
)}}
