<div class="cookie-compliance" id="coiConsentBanner">
    <div class="cookie-compliance__body">
        <div class="cookie-compliance__body__content">
            <div class="cookie-page cookie-page--padding">
                <h1>Magasin anvender cookies</h1>
                <div class="align-center--text">
                    <p>...for at huske dine indstillinger, lave trafikmålinger og vise dig målrettet indhold og annoncer. Ved at klikke på ”Accepter alle cookies” accepterer du alle former for cookies, men du kan til enhver tid ændre dine indstillinger eller trække dit samtykke tilbage ved at klikke på ”Indstillinger for cookies”. Du kan læse mere om vores brug af cookies i vores  ”Cookiepolitik”.</p>
                </div>
            </div>
            <div class="cookie-page scroll">
                <div class="cookie-page__scroll">
                    <h1>Magasin anvender cookies</h1>
                    <div class="cookie-page__manchet">
                        <p class="align-center--text">Magasin.dk anvender cookies. Nogle er nødvendige, mens andre hjælper os med at gøre din kundeoplevelse bedst mulig.</p>
                    </div>
                
                        <div class="input-checkbox-w-text" id="switch-cookie_cat_necessary">
                            <label for="cookie_cat_necessary-id">
                                <input name="cookie_cat_necessary" type="checkbox" class="native" disabled="" id="cookie_cat_necessary-id" onclick="CookieInformation.changeCategoryConsentDecision('cookie_cat_necessary');">
                                <div class="checkbox"></div>
                            </label>
                            <div class="input-checkbox-w-text__text">
                                <h4>Nødvendige</h4>
                                <p>Nødvendige cookies hjælper med at gøre en hjemmeside brugbar, ved at aktivere grundlæggende funktioner, såsom side-navigation og adgang til sikre områder af hjemmesiden. Hjemmesiden kan ikke fungere optimalt uden disse cookies.</p>
                            </div>
                        </div>
                        <div class="input-checkbox-w-text" id="switch-cookie_cat_functional">
                            <label for="cookie_cat_functional-id">
                                <input name="cookie_cat_functional" type="checkbox" class="native" id="cookie_cat_functional-id" onclick="CookieInformation.changeCategoryConsentDecision('cookie_cat_functional');">
                                <div class="checkbox"></div>
                            </label>
                            <div class="input-checkbox-w-text__text">
                                <h4>Funktionelle</h4>
                                <p>Funktionelle cookies gør det muligt at gemme oplysninger, der ændrer den måde hjemmesiden ser ud eller opfører sig på. F.eks. dit foretrukne sprog eller den region som du befinder dig i.</p>
                            </div>
                        </div>
                        <div class="input-checkbox-w-text" id="switch-cookie_cat_statistic">
                            <label for="cookie_cat_statistic-id">
                                <input name="cookie_cat_statistic" type="checkbox" class="native" id="cookie_cat_statistic-id" onclick="CookieInformation.changeCategoryConsentDecision('cookie_cat_statistic');">
                                <div class="checkbox"></div>
                            </label>
                            <div class="input-checkbox-w-text__text">
                                <h4>Statistiske</h4>
                                <p>Statistiske cookies hjælper hjemmesidens ejer med at forstå, hvordan besøgende interagerer med hjemmesiden, ved at indsamle og rapportere oplysninger.</p>
                            </div>
                        </div>
                        <div class="input-checkbox-w-text" id="switch-cookie_cat_marketing">
                            <label for="cookie_cat_marketing-id">
                                <input name="cookie_cat_marketing" type="checkbox" class="native" id="cookie_cat_marketing-id" onclick="CookieInformation.changeCategoryConsentDecision('cookie_cat_marketing');">
                                <div class="checkbox"></div>
                            </label>
                            <div class="input-checkbox-w-text__text">
                                <h4>Marketing</h4>
                                <p>Marketing cookies bruges til at spore besøgende på tværs af hjemmesider. Hensigten er at vise annoncer, der er relevante og engagerende for den enkelte bruger, og dermed mere værdifulde for udgivere og tredjeparts-annoncører.</p>
                            </div>
                        </div>
                        <div class="input-checkbox-w-text" id="switch-cookie_cat_unclassified">
                            <label for="cookie_cat_unclassified-id">
                                <input name="cookie_cat_unclassified" type="checkbox" class="native" id="cookie_cat_unclassified-id" onclick="CookieInformation.changeCategoryConsentDecision('cookie_cat_unclassified');">
                                <div class="checkbox"></div>
                            </label>
                            <div class="input-checkbox-w-text__text">
                                <h4>Uklassificerede</h4>
                                <p>Uklassificerede cookies er vi i færd med at klassificere, sammen med udbyderne af de enkelte cookies.</p>
                            </div>
                        </div>
                    
                    <div class="cookie-page__byline">
                        <p class="align-center--text">Du kan se hvilke cookies der anvendes for magasin.dk på siden <a href="https://www.magasin.dk/sider/om-magasin/kundeservice/pages_webshop_cookies.html">cookiepolitik</a></p>
                    </div>
                </div>
            </div>
            <div class="cookie-compliance__body__buttons">
                <button class="button-style js--modal-close" id="submit-category">
                    <div class="button-style__text-container">
                        <div>Accepter alle cookies</div>
                        <div>Anvend</div>
                    </div>
                </button>
                <a href="javascript:;" class="js--cookie-settings">
                    Indstillinger for cookies
                </a>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
var cookieScript        = document.getElementById('CookieConsent');



function showCookieBanner() {
    var coiConsentBanner = document.getElementById('coiConsentBanner');
    coiConsentBanner.style.display = 'block';
    document.body.classList.add('cookie-modal-open')
}

showCookieBanner()

function hideCookieBanner() {
    var coiConsentBanner = document.getElementById('coiConsentBanner');
    coiConsentBanner.style.display = 'none';
    document.body.classList.remove('cookie-modal-open')
}

function setCheckboxesSelection() {
  var allCheckboxes = Array.prototype.slice.call(
    document.querySelectorAll('input[name][type="checkbox"]:not([name=""])'));
  // var checkboxes = window.CookieInformation._getCookieInformationCheckboxes(allCheckboxes, window.cicl);

  allCheckboxes.forEach(function (checkbox) {
    checkbox.checked = true// !!window.cicc[checkbox.attributes.name.value];
  });
}

// if (JSON.stringify(window.cicc) === JSON.stringify({cookie_cat_necessary: true})) {
  // window.cicc = CookieInformation._setAllCategoriesToApproved(window.cicl);
  setCheckboxesSelection();
// }


(function() {
var cookiePages = document.body.querySelectorAll('.cookie-page')

if(cookiePages.length === 0) {
    return
}

var cookieSettingsLink = document.body.querySelector('.js--cookie-settings') || null
var scrollableContainerArea = document.body.querySelector('.cookie-page__scroll')
var submitButtonContainer = document.body.querySelector('.cookie-compliance__body__buttons')

// Save height references to animate with
var cookiePageDefaultHeight = window.getComputedStyle(cookiePages[0]).height
var scrollableContainerMaxHeight = window.getComputedStyle(cookiePages[1]).maxHeight
var scrollableContainerAccualHeight = window.getComputedStyle(scrollableContainerArea).height
var scrollableTargetHeight = parseInt(scrollableContainerMaxHeight) < parseInt(scrollableContainerAccualHeight)
  ? scrollableContainerMaxHeight
  : scrollableContainerAccualHeight

// Hide second page to start with
cookiePages[1].style.opacity = '0'

onClick(cookieSettingsLink, goToCookieSettings)

function onClick(el, cb, args) {
    el.addEventListener('click', cb.bind(this, args), false)
}

function goToCookieSettings() {
    var firstPage = cookiePages[0]
    var secondPage = cookiePages[1]
    
    function closeFirstPage() {
        // Remove first page
        firstPage.style.removeProperty('opacity')
        firstPage.classList.add('hidden')

        // Fade in second page
        secondPage.style.opacity = '1'

        // Immediately set second page to same height as first page
        secondPage.style.height = cookiePageDefaultHeight
        
        firstPage.removeEventListener('transitionend', closeFirstPage)
    }
    
    function openSecondPage() {
            // Trigger button and link change
            submitButtonContainer.classList.add('active')
    
            // Put back default transition
            secondPage.style.removeProperty('transition')
    
            // Expand the scroll area to its full height
            if(secondPage.style.height !== 'auto') secondPage.style.height = scrollableTargetHeight

            secondPage.removeEventListener('transitionend', openSecondPage)
    }

    // Fade out first page
    firstPage.style.opacity = '0'
    
    // Temporarily disable transition on max-height
    secondPage.style.transition = 'opacity .5s ease-in-out'

    // After first page is done fading
    firstPage.addEventListener('transitionend', closeFirstPage)
    
    // After second page has faded in
    secondPage.addEventListener('transitionend', openSecondPage)
    

    // Self destructing function to give scroll area a dynamic height
    // NOTE: Could be running by default after page-change is done
    function setAutoHeight() {
        secondPage.style.height = 'auto'
            
        window.removeEventListener('resize', setAutoHeight)
    }
    window.addEventListener('resize', setAutoHeight)
}

})()</script>