{{ var sprite = 'https://dmn92m25mtw4z.cloudfront.net/img_set/sprite/v1/sprite-1w.png'; }}
{{ var spritesheet = '/img/uploads/freemium-core-sprites.svg'; }}
{{? it.markup }}
	{{= it.markup }}
	{{?? it.canon_dropdown }} {{# def.canon_dropdown }}
	{{?? it.footer }} {{# def.footer }}
	{{?? it.footer__simple }} {{# def.footer__simple }}
{{?}}

/* PUBLIC DEFS */
	{{## def.canon_dropdown: 
		
		{{ var self = it.canon_dropdown; }}
		
		<ol class="page-footer__dropdown">
			<li role="heading">
				{{= self.heading }}
			</li>
			{{~ self.items :item }}
				<li>
					<a class="page-footer__dropdown-link" href="{{= item.textbook_url || '' }}" {{=self.data_nav}}>
						{{= item.course_name }}
					</a>
				</li>
			{{~}}
		</ol>
		#}}

	{{## def.footer: 
		
		{{ var self = it.footer; }}
		
		<div class="organic-graphic-footer ">
			
				</div>
		<footer id="page-footer" class="page-footer relative bg-footer z-3 pt-0 ">
			<ul class="page-footer__groupings flex flex-col items-center gap-6 sm-gap-4">
				{{~ self.group_ids :group_id:index }}
				{{ var group = self.groups[group_id]; }}
				<li class="page-footer__group ">
						<ol id="footer-{{= group_id}}" class="page-footer__group-items {{? index===1}} flex flex-row{{?}}" data-group="{{= group_id }}" data-count="{{= group.item_ids.length }}
						">  
							{{~ group.item_ids :item_id }}
								{{ var item = self.items[item_id]; }}
								{{ var has_icon = item.fa_icon ? 'has-icon' : ''; }}
								{{ var subject_key = item.subject_key ? 'data-subject-key="'+item.subject_key+'"' : ''; }}
								{{? group_id!== "socials" }}
								<li class="page-footer__group-item ">
									<a class="page-footer__group-link {{= has_icon }}" href="{{= item.url || '#' }}" {{= subject_key }}>
										 {{= item.label }}
									</a>
								</li>
								{{?? group_id=== "socials" }}
								<li class="page-footer__group-item ">
									<a class="page-footer__group-link" href="{{= item.url || '#' }}" {{= subject_key }}>
										<img src="{{= item.img }}" alt="{{= item.label}}" width="36px" height="36px">
										 
									</a>
								</li>
								{{?}}
							{{~}}
						</ol>
					</li>
				{{~}}
			</ul>
			<div class="page-footer__copyright gap-2 flex justify-center">
				<p class="tex-sm font-white">
				{{= self.items['copyright']['label'] }}</p>
				<a class="page-footer__copyright-link" href="{{= self.items['privacy'].url }}">
					{{= self.items['privacy'].label }}
				</a>
				<a class="page-footer__copyright-link" href="{{= self.items['tos'].url }}">
					{{= self.items['tos'].label }}
				</a>
			</div>
		
		</footer>
		#}}

	{{## def.footer__simple: 
		{{ var self = it.footer__simple; }}
		<footer id="page-footer" class="page-footer ">
			<div class="page-footer__copyright no-top-space">
				<a class="page-footer__copyright-link" href="{{= self.items['privacy'].url }}">
					{{= self.items['privacy'].label }}
				</a>
				<a class="page-footer__copyright-link" href="{{= self.items['tos'].url }}">
					{{= self.items['tos'].label }}
				</a>
				{{= self.items['copyright']['label'] }}
			</div>
		</footer>
		#}}

/* PRIVATE DEFS */

	{{## def.icon :sprite_id:
		{{ var url = spritesheet + '#' + sprite_id; }}
		<use xlink:href="{{= url }}"></use>
		#}}

	{{## def.icon__dropdown:
		<svg class="space-left-xxs" width="6" height="6">
			{{# def.icon :'svg-caret-down' }}
		</svg>
		#}}