/* @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:opsz,wght@6..12,400;6..12,700&display=swap'); */
@import url('https://use.typekit.net/mbp2iux.css');

:root {
    --background: 196.46deg 100% 46.47%;
    --foreground: 0deg 0% 100%;
    --card: 0 0% 100%;
    --card-foreground: 230deg 8.82% 13.33%;
    --primary: 196.46deg 100% 46.47%;
    --primary-foreground: 0 0% 100%;
    --secondary: 207.5deg 100% 9.41%;
    --secondary-foreground: 0 0% 100%;
    --cta: 24deg 100% 50%;
    --cta-foreground: 0 0% 100%;
    --border: 216deg 14.71% 86.67%;
    --input: 216deg 14.71% 86.67%;
    --radius: .375rem;

    --text-lg-size: 1rem;
    --text-xl-size: 1.25rem;
    --text-2xl-size: 1.5rem;
    --text-3xl-size: 1.75rem;
    --text-4xl-size: 2rem;
    --text-5xl-size: 2.25rem;
    --text-6xl-size: 2.5rem;
}

@media (prefers-color-scheme: dark) {
    :root:not(.light) {
        --card: 207.5deg 100% 9.41%;
        --primary: 196.46deg 100% 46.47%;
        --primary-foreground: 0 0% 100%;
        --secondary: 207.5deg 100% 9.41%;
        --secondary-foreground: 0 0% 100%;    
        --cta: 24deg 100% 50%;
        --cta-foreground: 0 0% 100%;
        --input: 207.5deg 40% 29.41%;
        --border: 207.5deg 40% 29.41%;
    }
}

body {
    line-height: 1.33;
}

.bg-card .heading {
    --text-lg-size: 1.125rem;
    --text-xl-size: 1.125rem;
    --text-2xl-size: 1.125rem;
    --text-3xl-size: 1.25rem;
    --text-4xl-size: 1.5rem;
    --text-5xl-size: 1.75rem;
    --text-6xl-size: 2rem;
}

.prose h1,
.prose h2,
.prose h3,
.prose h4,
.prose h5,
.prose h6 {
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: .5em;
}

.prose h4,
.prose h5,
.prose h6 {
    font-size: 1rem;
}

.prose h1+*,
.prose h2+*,
.prose h3+*,
.prose h4+*,
.prose h5+*,
.prose h6+* {
    margin-top: 0;
}

.prose :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
    margin-top: 1em;
}

.heading {
    text-transform: none;
}

body {
    background-color: hsl(var(--background));
    font-family: futura-pt,sans-serif;
    font-weight: 300;
}

.site-background {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: -10;
    overflow: hidden;
    background: url(../Images/Blauw-Blok-VRIJ-860px-PSD.jpg);
    background-size: cover;
    background-position: right;
}

@media (min-width: 481px) {
    .site-background {
        background-image: url(../Images/Blauw-Blok-VRIJ-1400px-PSD.jpg);
    }
}

@media (min-width: 1024px) {
    .site-background {
        background-image: url(../Images/Blauw-Blok-VRIJ-2200px-PSD.jpg);
    }
}

header,
.mobile-filter-bar {
    --card: var(--secondary);
    --card-foreground: var(--secondary-foreground);
}

.logo {
    max-height: 88px;
}

strong {
    font-weight: bold;
}

.progress-stepper--step,
main .bg-card:not(.mobile-filter-bar):not(.progress-stepper--wrapper):not(.category-anchors):not(#summary-mobile):not(.rounded-full) {
    border-radius: var(--radius);
}

main .bg-card.offcanvas {
    border-radius: 0 var(--radius) var(--radius) 0 !important;
}

.btn {
    border-radius: var(--radius);
    font-weight: bold;
    text-transform: uppercase;
}

.qty-input-field {
    border-radius: var(--radius);
}

.prose :where(p):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
    margin-top: 1em;
    margin-bottom: 1em;
}
.prose :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
    margin-top: 0;
}
.prose :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
    margin-bottom: 0;
}
.prose :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
    margin: 0;
}

.price.typography.text-2xl+.typography.text-xs {
    font-size: inherit;
    line-height: inherit;
}
.price.typography.text-2xl small {
    font-size: 1rem;
    line-height: 1.5;
}


.pagetitle-container {
    text-shadow: 1px 1px 2px rgba(0,0,0,.15);
}
.pagetitle-container button {
    --primary: var(--foreground);
    --primary-foreground: var(--background);
    box-shadow: 1px 1px 2px rgba(0,0,0,.15);
}



/**
  ** Contact info
  **/
.contact-info a {
    font-weight: 700;
}

.contact-info .heading {
    text-transform: none;
    font-weight: inherit;
    font-size: inherit;
    line-height: inherit;
}

/**
 ** Product List
 **/
.product-list .product-item .more-information,
.product-list .product-item h4,
.product-list .product-item h5 {
    display: none;
}

.product-list .price small {
    display: inline;
}

.product-list .product-item {
    overflow: hidden;
}

.product-list .btn.bg-cta.text-xl {
    --text-xl-size: var(--text-base-size);
    --text-xl-line-height: var(--text-base-line-height);
}

/**
 ** Product Detail
 **/
.product-detail--html-description img {
    max-height: 350px;
    width: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: var(--radius);
}

.product-detail--html-description .col-text {
    display: none;
}

.product-detail--html-description .more-information>br:first-child {
    display: none;
}

/**
 ** Activity Container
 **/
.activity-container--start-time {
    border-radius: var(--radius);
    font-weight: 700;
}

.activity-container--selected-time {
    border-radius: 100rem;
}

/**
 ** Table Order
 **/
.category-anchors .bg-card.shadow {
    --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1), 0 -1px 3px 0 rgb(0 0 0 / 0.1), 0 -1px 2px -1px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color), 0 -1px 3px 0 var(--tw-shadow-color), 0 -1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.mobile-filter-bar {
    box-shadow: 0 1rem 1rem -1rem rgba(0, 0, 0, .15) !important
}

#summary-mobile {
    box-shadow: 0 -1rem 1rem -1rem rgba(0, 0, 0, .15) !important
}

.menu-list--item.selected {
    --card: var(--primary);
    --card-foreground: var(--primary-foreground);
}
.menu-list--item.selected .text-primary {
    --primary: var(--primary-foreground);
}

.menu-list--item.selected .prose {
    --tw-prose-body: --tw-prose-invert-body;
    --tw-prose-headings: --tw-prose-invert-headings;
    --tw-prose-lead: --tw-prose-invert-lead;
    --tw-prose-links: --tw-prose-invert-links;
    --tw-prose-bold: --tw-prose-invert-bold;
    --tw-prose-counters: --tw-prose-invert-counters;
    --tw-prose-bullets: --tw-prose-invert-bullets;
    --tw-prose-hr: --tw-prose-invert-hr;
    --tw-prose-quotes: --tw-prose-invert-quotes;
    --tw-prose-quote-borders: --tw-prose-invert-quote-borders;
    --tw-prose-captions: --tw-prose-invert-captions;
    --tw-prose-kbd: --tw-prose-invert-kbd;
    --tw-prose-kbd-shadows: --tw-prose-invert-kbd-shadows;
    --tw-prose-code: --tw-prose-invert-code;
    --tw-prose-pre-code: --tw-prose-invert-pre-code;
    --tw-prose-pre-bg: --tw-prose-invert-pre-bg;
    --tw-prose-th-borders: --tw-prose-invert-th-borders;
    --tw-prose-td-borders: --tw-prose-invert-td-borders;
}

.menu-list--item.selected .btn {
    --primary: var(--card-foreground);
    --primary-foreground: var(--card-foreground);
}

.menu-list--item.selected .bg-muted {
    --muted: var(--primary-foreground);
    background-color: hsl(var(--primary-foreground) / 25%);
}

.category-anchors--item button {
    border-radius: 100rem;
}

.menu-list--item br {
    display: none;
}

/**
 ** Upsell
 **/

.upsell-item--content p:empty {
    display: none;
}

/**
 ** Blazor default components
 **/
#components-reconnect-modal {
    background: hsl(var(--background) / 80%);

    --card: transparent;
    --card-foreground: --foreground;
}

#components-reconnect-modal .bg-card {
    max-width: 480px;
    text-wrap: balance;
}

#components-reconnect-modal .bg-card .heading {
    --text-xl-size: 1.25rem;
    /* 20px */
    --text-2xl-size: 1.5rem;
    /* 24px */
}

/**
 ** Footer
 **/
.footer--container {
    font-size: var(--text-sm-size);
}
.footer--links {
    display: flex;
    gap: 1rem;
}


.product-list .product-item--image img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
}