/* Related products block — match homepage widget layout */
.block.related .product-item-info {
    width: 300px !important;
}

.block.related .product-item-name {
    display: block !important;
    font-size: 16px !important;
    font-family: 'Fredoka One', cursive !important;
    text-align: center;
    color: #333 !important;
    height: auto !important;
    min-height: 40px;
}

.block.related .product-item-name a,
.block.related .product-item-name a:visited {
    color: #333 !important;
    font-size: 16px !important;
    text-decoration: none;
}

/* PDP gallery — constrain Fotorama to image size, remove dark background */
.fotorama__stage {
    background: transparent !important;
}

.fotorama__stage__shaft {
    background: transparent !important;
}

.product.media .fotorama {
    max-width: 460px !important;
}

.product.media .fotorama__nav-wrap {
    max-width: 460px !important;
}

/* Galleriet paa en telefon.
   view.xml giver galleribilledet 440 px, og Fotorama saetter det tal som
   bredde direkte paa sine egne elementer. Paa en 390 px skaerm blev siden
   derfor 455 px bred, og hele sideindholdet kunne skubbes vandret. Loftet paa
   460 px ovenfor hjalp ikke — det er hoejere end skaermen.

   max-width kan klemme en bredde, der staar direkte paa elementet, og skal
   derfor saettes hele vejen ned gennem Fotoramas lag. */
@media (max-width: 767px) {
    .product.media,
    .product.media .gallery-placeholder,
    .product.media .fotorama,
    .product.media .fotorama__wrap,
    .product.media .fotorama__stage,
    .product.media .fotorama__stage__shaft,
    .product.media .fotorama__stage__frame,
    .product.media .fotorama__nav-wrap,
    .product.media .fotorama__img {
        max-width: 100% !important;
    }
}

/* Hide per-page limiter — replaced by infinite scroll */
.toolbar-products .limiter,
.toolbar-products .pages {
    display: none !important;
}

/* Infinite scroll loader */
.infinite-scroll-loader {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 30px 0;
}

.infinite-scroll-loader span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #AFCA0B;
    animation: infinite-scroll-bounce 0.6s infinite alternate;
}

.infinite-scroll-loader span:nth-child(2) { animation-delay: 0.2s; }
.infinite-scroll-loader span:nth-child(3) { animation-delay: 0.4s; }

@keyframes infinite-scroll-bounce {
    from { opacity: 0.3; transform: translateY(0); }
    to   { opacity: 1;   transform: translateY(-8px); }
}

/* Social media footer icons */
.footer-social {
    display: flex;
    justify-content: center;
    gap: 16px;
    padding: 20px 0 10px;
    border-top: 1px solid #eee;
    margin-top: 20px;
}

.footer-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #1da1f2;
    color: #fff !important;
    font-size: 20px;
    text-decoration: none !important;
    transition: opacity 0.2s;
}

.footer-social-link:hover {
    opacity: 0.85;
}

.footer-social-link .fa-twitter  { color: #fff; }
.footer-social-link .fa-facebook { color: #fff; }
.footer-social-link .fa-instagram { color: #fff; }

.footer-social-link:has(.fa-twitter)   { background: #1da1f2; }
.footer-social-link:has(.fa-facebook)  { background: #1877f2; }
.footer-social-link:has(.fa-instagram) { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); }

.block-search input {
    border-radius: 40px;
    padding: 5px 10px;
    height: 40px;
    border: 1px solid #ddd;
    background: #eeeeee;
    width: 93%;
    font-family: 'Open Sans';
}
/* Minicart two green buttons */
.minicart-actions-top {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 16px 8px;
}

.minicart-btn-checkout,
.minicart-btn-viewcart {
    display: block;
    width: 100%;
    padding: 12px 0;
    border-radius: 6px;
    font-family: 'Fredoka One', cursive;
    font-size: 16px;
    font-weight: normal;
    text-align: center;
    cursor: pointer;
    border: none;
    text-decoration: none !important;
    transition: background 0.15s;
}

.minicart-btn-checkout,
#top-cart-btn-checkout {
    background: #AFCA0B !important;
    color: #fff !important;
    border: none !important;
    opacity: 1 !important;
}

.minicart-btn-checkout:hover,
#top-cart-btn-checkout:hover {
    background: #8fa309 !important;
    color: #fff !important;
}

.minicart-btn-viewcart {
    background: #AFCA0B;
    color: #fff !important;
}

.minicart-btn-viewcart:hover {
    background: #8fa309;
    color: #fff !important;
}

/* Hide the old secondary viewcart link */
.block-minicart .actions .secondary,
.block-minicart > .block-content > .actions:last-child {
    display: none !important;
}

.block.block-search {
    float: none;
    padding-left: 0px;
    position: relative;
    width: 100%;
    z-index: 4;
    margin-top:20px;
}

.block-search .control {
    padding: 0 0 0 !important;
}

.block-search .action.search.disabled, .block-search .action.search[disabled], fieldset[disabled] .block-search .action.search{
    margin-right: 40px;
    margin-top:3px;

}

.block-search .action.search:before{
    color: #7c549f !important;
    font-weight: 700 !important;
}

.block-search .action.search {
    margin-right: 40px !important;
    margin-top:3px !important;
}

/* position:relative er FJERNET her.
   Den stod uden media-query og aflyste derfor Lumas egen mobilregel
   `.nav-sections { position: fixed; left: calc(-100% + 54px) }`, som gemmer
   menuen ude til venstre, til man trykker paa hamburgeren. Uden den faldt
   menuen ned i flowet og fyldte 969 px mellem headeren og indholdet: paa en
   telefon begyndte produktet foerst i y=1265, altant halvanden skaerm nede.

   Desktop har i forvejen sin egen position (sticky) laengere nede i filen, saa
   der er intet at erstatte den med. */
.nav-sections {
    background-color: white;
    margin-bottom: 5px !important;
}

/* KUN desktop. Paa mobil bygger Luma de to faneblade (Menu / Konto) med float
   og negativ margen — og en flex-container ignorerer float, saa den negative
   margen alene skubbede panelet en halv skaerm ud til venstre, naar menuen
   blev aabnet. */
@media (min-width: 768px) {
    .nav-sections-items {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

nav.navigation {
    background: white;
}

.custom-navigation {
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    max-width: 1280px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

.navigation .level0 .submenu li {
    list-style: none;
}

.navigation .nav-1 .submenu a:hover {
    background-color: #AFCA0B !important;
    color:black !important;
}

.navigation .nav-2 .submenu a:hover {
    background-color: #f73e98 !important;
    color:black !important;
}

.navigation .nav-3 .submenu a:hover {
    background-color: #95D2D5 !important;
    color:black !important;
}

.navigation .nav-4 .submenu a:hover {
    background-color: #6565A3 !important;
    color:black !important;
}
.navigation .nav-5 .submenu a:hover {
    background-color: #F29200 !important;
    color:black !important;
}
.navigation .nav-6 .submenu a:hover {
    background-color: #A47EB8 !important;
    color:black !important;
}


.single-information {
    text-align: center;
    -webkit-box-shadow: 0px 26px 39px -13px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 5px 5px -13px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 15px 39px -13px #a9a5a5;
    border-radius: 15px;
    overflow: hidden;
    height: auto;
    width: 100%;
    margin: 0 0 10px;
}

.single-information .green .single-information-header {
    color: rgba(0, 0, 0, 0.75);
    background: #AFCA0B;
}

.single-information .single-information-content {
    background: white;
    padding: 25PX 30px;
    height: 180px;
    width: auto;
}

.single-information .green .single-information-footer {
    padding: 15px 10px;
    background: white;
    height: auto;
    width: 100%;
}

.single-information .single-information-header i {
    width: 50px;
    padding: 12px 0;
    border-radius: 100%;
    margin: 0 0 10px 0;
    font-size: 24PX;
    webkit-transition: .4s;
    transition: .4s;
}

.single-information .green .single-information-header {
    color: rgba(0, 0, 0, 0.75);
    background: #AFCA0B;
}

.single-information .single-information-header h2 {
    font-size: 20px;
}

.single-information .single-information-content p {
    font-family: 'Open Sans' !important;
    font-size: 12px;
}

.single-information .green .single-information-footer .single-information-btn {
    color: rgba(0, 0, 0, 0.75);
    border: #AFCA0B 2px solid;
    background: white;
}

.single-information .single-information-footer {
    padding: 20px 0 35px 0 !important;
}

.single-information .single-information-footer .single-information-btn {
    padding: 8px 12px;
    border-radius: 20px;
    color: rgba(0, 0, 0, 0.75);
    margin-bottom: 10px;
    webkit-transition: .4s;
    transition: .4s;
    text-decoration: none;
    font-family: 'Fredoka One';
    font-size: 14px;
}

.single-information .single-information-header {
    padding: 30px 0;
    color: rgba(0, 0, 0, 0.75);
    webkit-transition: .4s;
    transition: .4s;
}

.single-information .green .single-information-header i {
    background: white;
    color: #AFCA0B;
}

.single-information .single-information-header h2 {
    font-size: 20px;
    margin-bottom: 0.5rem !important;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.2;
    color: inherit;
    font-family: 'Fredoka One' !important;
}

.single-information a {
    color: #373737;
    text-decoration: none !important;
}

.single-information .single-information-content p {
    font-family: 'Open Sans' !important;
    font-size: 12px;
}

.single-information .red .single-information-header {
    color: rgba(0, 0, 0, 0.75);
    background: #f73e98;
}

.single-information .red .single-information-header i {
    background: white;
    color: #f73e98;
}

.single-information .red .single-information-footer .single-information-btn {
    color: rgba(0, 0, 0, 0.75);
    border: #f73e98 2px solid;
    background: white;
}

.single-information .blue .single-information-header {
    color: rgba(0, 0, 0, 0.75);
    background: #95D2D5;
}

.single-information .blue .single-information-header i {
    background: white;
    color: #95D2D5;
}

.single-information .blue .single-information-footer .single-information-btn {
    color: rgba(0, 0, 0, 0.75);
    border: #95D2D5 2px solid;
    background: white;
}

.single-information .purple .single-information-header {
    color: rgba(0, 0, 0, 0.75);
    background: #6565A3;
}

.single-information .purple .single-information-header i {
    background: white;
    color: #6565A3;
}

.single-information .purple .single-information-footer .single-information-btn {
    color: rgba(0, 0, 0, 0.75);
    border: #6565A3 2px solid;
    background: white;
}

.single-information .orange .single-information-header {
    color: rgba(0, 0, 0, 0.75);
    background: #F29200;
}

.single-information .orange .single-information-header i {
    background: white;
    color: #F29200;
}

.single-information .orange .single-information-footer .single-information-btn {
    color: rgba(0, 0, 0, 0.75);
    border: #F29200 2px solid;
    background: white;
}

.single-information .yellow .single-information-header {
    color: rgba(0, 0, 0, 0.75);
    background: #A47EB8;
}

.single-information .yellow .single-information-header i {
    background: white;
    color: #A47EB8;
}

.single-information .yellow .single-information-footer .single-information-btn {
    color: rgba(0, 0, 0, 0.75);
    border: #A47EB8 2px solid;
    background: white;
}

.product-items .product-item-name {
    margin-bottom: 0.5rem;
    font-family: 'Open Sans';
    font-weight: 500;
    line-height: 1.2;
    padding: 10px;
    font-size: 1rem;
    height: 50px;
}

.action.primary, .action-primary {
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 6px;
    padding-bottom: 6px;
    border-radius: 20px;
    color: black;
    margin-bottom: 10px;
    border: 2px solid #AFCA0B;
    font-family: 'Fredoka One';
    webkit-transition: .4s;
    transition: .4s;
    font-size: 14px;
    background: white;
}

.product-image-wrapper {
    display: block;
    height: 0;
    overflow: unset;
    position: relative;
    z-index: 1;
    padding-bottom: 100% !important;
}

/* Kategorisidens kort er 237 px bredt. Karrusellen brugte 300, saa billedet
   stod med et tomt baelte paa hver side. Marginen giver luften mellem kortene —
   slick regner slidets bredde ud fra indholdets ydre maal, saa den skal sidde
   her og ikke paa li'et. */
.block.widget .product-item-info {
    width: 237px !important;
    margin: 4px 12px;
}

.action.primary:focus, .action-primary:focus {
    color: #fff;
    background: #9ab50a;
    border: 2px solid #9ab50a;
    border-radius: 20px;
}

.action.primary .fa {
    margin-right: 5px;
    font-size: 17px !important;
}

.product-info-main .action.tocart {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
    font-size: 18px !important;
}

/* PDP qty + button alignment */
.box-tocart .fieldset {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.box-tocart .field.qty {
    margin: 0 !important;
}

.box-tocart .field.qty .control {
    margin: 0 !important;
}

.box-tocart .field.qty input.qty {
    width: 60px !important;
    height: 55px !important;
    text-align: center !important;
    font-size: 16px !important;
    border: 2px solid #ddd !important;
    border-radius: 8px !important;
    margin-top: 10px !important;
}

.box-tocart .actions {
    margin: 0 !important;
}


.action.primary:hover, .action-primary:hover {
    background: #9ab50a;
    border-color: #9ab50a;
    color: #fff;
}

.action.primary:hover .fa,
.action.primary:hover span,
.action-primary:hover .fa,
.action-primary:hover span {
    color: #fff;
}

.navigation .level0 > .level-top {
    font-family: 'Fredoka One';
    color: #0d0d0d !important;
    font-size: 15px;
    font-weight: normal;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* Nav icons via ::before using FontAwesome unicode */
.navigation .level0 > .level-top::before {
    font-family: FontAwesome !important;
    font-size: 26px !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    margin-right: 6px;
}

/* nav-1: Shop */
.navigation .nav-1 > .level-top::before {
    content: "\f291";
    color: #AFCA0B;
}

/* nav-2: Alkalær */
.navigation .nav-2 > .level-top::before {
    content: "\f129";
    color: #e02b27;
}

/* nav-3: Privatundervisning */
.navigation .nav-3 > .level-top::before {
    content: "\f044";
    color: #4a90d9;
}

/* nav-4: Uddannelse */
.navigation .nav-4 > .level-top::before {
    content: "\f19d";
    color: #6565A3;
}

/* nav-5: Metode */
.navigation .nav-5 > .level-top::before {
    content: "\f1b2";
    color: #FF6600;
}

/* nav-6: Nyheder */
.navigation .nav-6 > .level-top::before {
    content: "\f0ac";
    color: #A47EB8;
}

/* nav-7: Blog */
.navigation .nav-7 > .level-top::before {
    content: "\f09e";
    color: darkred;
}

.minicart-wrapper .action.showcart:before {
    display: none !important;
}

.minicart-wrapper .action.showcart {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none !important;
    color: #333;
    font-family: 'Fredoka One', cursive;
    font-size: 15px;
    font-weight: normal;
    padding: 0 4px;
}

.showcart-icon-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.showcart-basket-icon {
    font-size: 26px !important;
    color: #AFCA0B;
    line-height: 1;
}

.action.tocart.primary .showcart-basket-icon {
    font-size: 16px !important;
    margin-right: 5px;
}

.showcart-label {
    color: #0d0d0d;
    font-family: 'Fredoka One', cursive;
    font-size: 15px;
    text-transform: capitalize;
}


.minicart-wrapper .action.showcart .text {
    display: none;
}

.navigation .level0 .submenu {
    background: white !important;
    border: 1px solid #eeeeee !important;
    padding: 10px !important;
    width: 300px !important;
}
.navigation .level0 .submenu a {
    font-family: 'Open Sans' !important;
    font-size: 12px !important;
    color:black !important;
    font-weight: normal;
}

.navigation .level0.parent > .level-top > .ui-menu-icon:after {
    font-size: 22px !important;
    font-weight: bolder !important;
}

.product-item .price-box {
    height: 60px;
}

.old-price, .old.price {
    display: none;
}

.product-item .price-box .old-price .price {
    display: none;
}

/* Tier price box */
.tier-price-box {
    background: #f5f5f5;
    border-radius: 8px;
    padding: 10px 14px;
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tier-price-row {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Fredoka One', cursive;
    font-size: 15px;
}

.tier-qty {
    min-width: 70px;
    color: #333;
}

.tier-prices {
    display: flex;
    align-items: center;
    gap: 5px;
}

.tier-price-after {
    color: #AFCA0B;
    font-weight: bold;
    font-size: 16px;
}

.tier-price-before {
    text-decoration: line-through;
    color: #999;
    font-size: 14px;
    margin-left: 4px;
}

.tier-save {
    color: #555;
    font-size: 13px;
    margin-left: auto;
}

.price-savings {
    display: block;
    font-size: 16px;
    font-weight: 400;
    font-family: 'Fredoka One', cursive;
    color: #555;
    margin-top: 2px;
}

.product-item .price-box .price {
    font-size: 20px;
    font-weight: 400 !important;
    white-space: nowrap;
    font-family: 'Fredoka One';
}

/* Den gamle footer var en lilla bjaelke med to spalter hvide links og
   h5-overskrifter. Den opmaerkning findes ikke mere — .footer-quicklinks,
   ul.quick-links og h5 er alle vaek — og reglerne til den er derfor fjernet
   frem for at blive overtrumfet. De gjorde aktiv skade: baggrunden malede en
   lilla bjaelke rundt om den nye footer, og `.page-footer a` satte hvid tekst
   i 12 px paa alt derinde, hvilket bl.a. skrumpede navnet i hjoernet.

   Selve udseendet ligger nu i footer-ny.css paa .alk-footer. Wrapperen skal
   kun lade den fylde. */
.page-footer {
    background: none;
    padding: 0;
}

.list-unstyled a {
    font-family: 'Open Sans';
    color: black;
}

.bg-white {
    background-color: #fff!important;
}

.newsletter {
    padding: 80px 0;
    background: #f2f2f2;
}

.newsletter .content {
    max-width: 650px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 2;
}

.panel.header {
    display: none;
}

.minicart-wrapper {
    z-index: 100;
    display: inline-flex;
    align-items: center;
    margin-left: 16px;
}

.minicart-wrapper .action.showcart .counter.qty {
    position: absolute;
    top: -6px;
    right: -8px;
    margin: 0;
    border-radius: 50% !important;
    font-size: 10px;
    min-width: 16px !important;
    height: 16px;
    line-height: 16px;
    padding: 0 3px;
    background: #AFCA0B;
    color: #fff;
    text-align: center;
}

.block.block-search {
    float: none;
    padding-left: 0px;
    position: relative;
    width: 100%;
    z-index: 4;
    margin-top: 0px;
}

.block-search .nested {
    display: none !important;
}

.page-header {
    border-bottom: 1px solid #cbcbcb !important;
    padding-bottom: 5px;
}

.newsletter .content .btn {
    min-height: 40px;
    border-radius: 0;
    background: #243c4f;
    color: #fff;
    font-weight: 600;
    font-family: 'Open Sans';
}

.div[data-content-type='slider'] .slick-list, div[data-content-type='slider'] .slick-track, div[data-content-type='slider'] .slick-slide{
    border-radius: 15px;
}

.minicart-items .product-image-wrapper .product-image-photo{
    width: 125px !important;
    height: 125px !important;
}

.minicart-items .product-item-name a {
    color:black;

}

.minicart-items .product-item-name {
    margin: 0 0 0px !important;
    padding: 0;
    text-align: left;
}

.minicart-items .product-item-details .price {
    font-size: 16px !important;

}

.minicart-items .product-item-details .price-including-tax, .minicart-items .product-item-details .price-excluding-tax
{
    margin: 0 0 0 !important;
}

/* Minicart item bottom row: price left, qty+delete right */
.minicart-item-bottom {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: 8px;
    gap: 8px;
    width: 100%;
}

.minicart-item-price {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.minicart-item-price .price-container,
.minicart-item-price .price-wrapper,
.minicart-item-price .price {
    display: inline !important;
    font-family: 'Fredoka One', cursive !important;
    font-size: 15px !important;
    color: #0d0d0d !important;
    white-space: nowrap;
}

.minicart-item-qty-row {
    display: flex;
    align-items: end;
    gap: 6px;
    flex-shrink: 0;
}

.minicart-qty-label {
    font-size: 14px !important;
    color: #0d0d0d !important;
    font-family: 'Fredoka One', cursive !important;
}

.minicart-item-qty-row .item-qty {
    width: 46px;
    padding: 3px 6px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-align: center;
}

.minicart-delete-btn {
    color: #ccc !important;
    font-size: 16px;
    line-height: 1;
    text-decoration: none !important;
    margin-left: 4px;
    transition: color 0.15s;
    display: inline-flex;
    align-items: center;
}

.minicart-delete-btn:hover {
    color: #e02b27 !important;
}

/* Hide text label — rely on the ::before trash icon from Magento CSS */
.minicart-delete-btn span {
    display: none;
}

/* Always hide the update button — auto-click handles it invisibly */
.update-cart-item {
    display: none !important;
}

/* Hide empty widgets + "Recently added" subtitle + items-total heading.
   Keep .subtitle.empty visible — that's the "Der er ingen produkter i kurven." message. */
#minicart-widgets,
.block-minicart .subtitle:not(.empty),
.block-minicart .items-total {
    display: none !important;
}

/* Remove extra padding at bottom of minicart */
.block-minicart .block-content {
    padding-bottom: 0 !important;
}

.minicart-items-wrapper {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* Hide old product actions block (delete moved inline) */
.minicart-items .product.actions {
    display: none !important;
}
.block-minicart .block-content > .actions > .primary .action.primary {
    background-color: #AFCA0B;
    color: white;
    border: #00ff21;
    font-weight: normal;
}

.minicart-items .product-item-details {
    padding-left: 0;
}

/* New flexbox item layout */
.minicart-item-wrap {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 0;
}

.minicart-item-img {
    flex-shrink: 0;
    width: 135px;
}

/* Override Magento base CSS absolute positioning that causes blank space */
.minicart-item-img .product-item-photo {
    position: static !important;
    display: block !important;
}

.minicart-item-img .product-image-container {
    width: 135px !important;
    max-width: 135px !important;
    display: block !important;
}

.minicart-item-img .product-image-wrapper {
    display: block;
    padding-bottom: 0 !important;
}

.minicart-item-img .product-image-photo {
    width: 135px !important;
    height: auto !important;
    position: static !important;
    display: block;
}

.minicart-item-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

h1#page-title-heading {
    font-size: 24px;
    margin-bottom: 23px;
    color: #AFCA0B;
    font-family: 'Fredoka One';
}

.breadcrumbs .items {
    font-size: 12px !important;
    color:black;
}

.filter-options-content a {
    font-family: 'Open Sans';
    font-size: 16px;
    color:black;
}

/* Produktkortet.
   Rammen stod kun paa .page-products, saa de samme varer laa uden kort, naar de
   blev vist gennem en widget paa forsiden — billedet svaevede, og teksten gik
   helt ud til kanten. Selektorerne er lagt sammen her, saa kortet kun findes ét
   sted: retter man kategorisiden, foelger forsiden med. */
.page-products .product-item-info,
.block.widget .product-item-info {
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px 3px #eee;
    transition: box-shadow .2s;
}

.page-products .product-item-info:hover,
.block.widget .product-item-info:hover {
    box-shadow: 0 4px 16px 4px #ddd;
}

.page-products .product-item-details,
.block.widget .product-item-details {
    padding: 8px 12px 12px;
}

.product-item .price-box{
    text-align: center;
}

.products-grid .product-item-actions {
    text-align: center;
}

.product-items .product-item-name {
    font-size: 16px;
    text-align: center;
    display: block;
    width: 100%;
    height: 45px;
    font-family: 'Fredoka One';
    padding-bottom: 0 !important;
    margin: 0 !important;
    padding-top: 0px;
}

.product-items .product-image-container {
    width:100% !important;
}

.products-grid .product-item .price-box {
    height: 45px;
    margin: 0px 0 25px;
}

/* Hoejden holder kortene ens. width:auto gav billedet dets egen bredde ud
   fra hoejden, og paa en telefon blev det 184 px i et kort paa 176 — saa stak
   det ud over kanten. contain klemmer det ind uden at trykke det skaevt. */
.product-items .product-image-photo {
    height: 230px;
    max-width: 100%;
    object-fit: contain;
}

/* Paa en telefon er kortet 176 px bredt, og billedrammen dermed 174 px hoej.
   De faste 230 px hang saa 28 px ud i hver ende — foroven ud over kortets kant
   og forneden ind over produktnavnet. Loftet klemmer billedet ned i rammen;
   contain sikrer at det ikke bliver trykket skaevt. */
@media (max-width: 767px) {
    .product-items .product-image-photo {
        max-height: 100%;
    }
}

.catalog-category-menu{
    font-family: 'Open Sans';
    font-size: 12px;
    line-height: 2.5;
}

.sidebar-main {
    padding-right: 0px !important;
    margin-top: 40px;
}

.sidebar-main .card-body {
    padding-left: 0 !important;
    padding-top: 5px !important;
}

.page-wrapper > .breadcrumbs{
    margin-top: 12px;
}

.toolbar-products{
    padding: 0px 30px;
}

.product-item{
    font-size: 0px;
}

.cms-menu .parent{
    list-style: none;
}

.cms-menu .parent ul{
    list-style: none;
    padding-left: 0px;
    color:black;
}

.cms-menu .parent strong{
    color: #f8238a;
    font-family: 'Fredoka One';
}

.cms-menu {
    padding-left: 0px;
}

.cms-menu .parent li span {
    font-family: 'Open Sans';
    font-size: 12px;
    color:black;
}

.cms-menu .parent li span:hover {
    color: #f8238a;
    text-decoration: unset !important;
}

.cms-menu .parent li a:hover {
    text-decoration: unset !important;
}

.h1, h2, h3, h4, h5 {
    font-family: 'Fredoka One' !important;
}

.h3, h3 {
    font-size: 1.75rem !important;
}

.product-info-main .price-box{
    font-size: 1.75rem !important;
}

.opc-progress-bar-item > span {
    font-size: 1.2rem;
}

.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 93%;
    margin-left: 15px;
    opacity: 0;
    transition: .5s ease;
    background-color: #f73e98;
}

.overlayy {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 93%;
    margin-left: 15px;
    opacity: 0;
    transition: .5s ease;
    background-color: #95D2D5 ;
}

.overlay3 {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 93%;
    margin-left: 15px;
    opacity: 0;
    transition: .5s ease;
    background-color: #AFCA0B ;
}

.overlay4 {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 93%;
    margin-left: 15px;
    opacity: 0;
    transition: .5s ease;
    background-color: #A47EB8;
}


.text {
    color: white;
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
}

.kundetype-div {
    border-radius: 5px;
    font-family: 'Fredoka One';
    padding: 10px 0 !important;
}

.shadow {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

p {
    color: #373737;
}

#div1:hover .overlay {
    opacity: 1;
}

#div2:hover .overlayy {
    opacity: 1;
}

#div3:hover .overlay3 {
    opacity: 1;
}

#div4:hover .overlay4 {
    opacity: 1;
}

.modal-content {
    border: none !important;
}

.modal-header {
    border-bottom: none !important;
}
mark, .mark {
    background-color: white;
}

.minicart-wrapper .action.showcart{
    display: inline-block;
}

label {
    margin-bottom: 0px !important;
}

/* ============================================================
   Desktop-layout som temaets styles-l.css mangler (checkout-modul).
   Leveres her scoped til desktop, sidst i kaskaden.
   ============================================================ */
@media (min-width: 768px) {
    /* --- Kurv-side: ren tabel-række (foto + detaljer side om side) --- */
    .cart.table-wrapper .item .col.item {
        display: table-cell;
        padding: 20px 8px 20px 0;
        position: static;
    }
    .cart.table-wrapper .product-item-photo {
        display: table-cell;
        position: static;
        width: 1%;
        max-width: 120px;
        padding: 0 20px 0 0;
        vertical-align: top;
    }
    .cart.table-wrapper .product-item-photo .product-image-photo,
    .cart.table-wrapper .product-image-container {
        width: auto !important;
        max-width: 100px;
        height: auto;
    }
    .cart.table-wrapper .product-item-details {
        display: table-cell;
        vertical-align: top;
        text-align: left;
        white-space: normal;
        width: 99%;
    }
    .cart.table-wrapper .product-item-name {
        text-align: left;
        margin: 0 0 10px;
        padding: 0;
        height: auto;
        font-family: 'Fredoka One';
        font-size: 16px;
    }
    .cart.table-wrapper .item-actions td {
        padding: 0 0 15px 0;
        text-align: left;
        border-top: 0;
    }
    .cart.table-wrapper .cart.item .col {
        vertical-align: top;
        padding-top: 20px;
    }
}

@media (min-width: 768px) {
    /* --- Header-logoer i kolonnernes yderkanter ---
       Bootstrap's d-lg-block/d-xl-block sætter display:block !important på
       .col-3, så flexbox (justify-content) er død her. text-align virker
       derimod på block-kolonner: univers-logo yderst til venstre,
       butikslogo yderst til højre. */
    .header.content .row {
        margin-bottom: 20px !important;  /* gap under logo-rækken (overskriver inline -10px) */
    }
    .header.content .col-3:first-child {
        text-align: left;   /* butikslogo til venstre kant af main-containeren (gutter bevaret) */
    }
    .header.content .col-3:last-child {
        text-align: right;  /* univers-logo til højre kant af main-containeren (gutter bevaret) */
    }
    .header.content .col-3 > a {
        float: none;
        display: inline-block;
        margin: 0;
    }
    .header.content .search-form-replace .block.block-search,
    .header.content .block-search {
        margin-top: 0;
    }
}

/* --- Klæbende header ---------------------------------------------------
   Den gamle side satte .navbar-header til position:fixed ved 72px scroll og
   kompenserede for den tabte højde med en body-padding-klasse — deraf hoppet,
   når man passerede grænsen. Her bruges position:sticky: begge rækker bliver i
   flowet, så der er ingenting at kompensere for og intet hop.

   HELE headeren følger med — logo, søgefelt og kurv i den øverste række,
   menuen i den nederste — som i det nye design, hvor <header> er sticky.

   De to rækker er SØSKENDE i Magentos opmærkning (.page-header og
   .nav-sections ligger side om side i .page-wrapper), ikke indlejrede. De kan
   derfor ikke klæbe med samme top-værdi: så ville menuen lægge sig oven i
   toppen. Menuen får i stedet den øverste rækkes højde som afstand, og den
   måles af js/sticky-nav, fordi den skifter med skærmbredden.

   Kun fra 768px og op. Under den grænse er .nav-sections Magentos
   udtræksmenu med sin egen positionering, og den skal ikke røres. */
.nav-sticky-sentinel {
    /* Målepunkt for js/sticky-nav: 1px højt og trukket tilbage igen, så det
       ikke flytter noget. Elementet indsættes af scriptet. */
    height: 1px;
    margin-bottom: -1px;
}

@media (min-width: 768px) {
    /* Den øverste række skal danne sit eget lag OVER menuen; ellers folder
       søgeforslagene og minikurvens dropdown ned BAG den. */
    .page-header {
        position: sticky;
        top: 0;
        z-index: 100;
        background-color: #fff;
    }

    .nav-sections {
        position: sticky;
        /* Falder tilbage på 81px, hvis scriptet ikke nåede at måle — det er
           højden ved en normal skærm, så menuen sidder rigtigt uanset hvad. */
        top: var(--alk-top-hoejde, 81px);
        z-index: 90;
        background-color: #fff;
        /* Kanten ligger her hele tiden, bare gennemsigtig. Så skifter den
           farve i stedet for at dukke op, og intet flytter sig en pixel. */
        border-bottom: 1px solid transparent;
        transition: box-shadow .18s ease, border-color .18s ease;
    }

    /* Sættes af js/sticky-nav, så snart siden er scrollet — da klæber hele
       headeren, og skyggen hører til under dens nederste kant. Uden JS klæber
       den stadig; så er det kun skyggen, der udebliver. */
    .nav-sections.is-stuck {
        border-bottom-color: #e3e3e3;
        box-shadow: 0 6px 14px -10px rgba(0, 0, 0, .55);
    }

    /* Spring til et anker må ikke lande inde under den klæbende header —
       derfor hele dens højde og ikke kun menuens. */
    html {
        scroll-padding-top: var(--alk-hele-hoejde, 134px);
    }
}