@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root, [data-bs-theme=light] {
    --bs-body-bg: #fcfcfc;
    --bs-jmp-dark: #f5f5f5;
    --bs-jmp-dark-border: #dedede;
    --bs-jmp-dark-text: #464646;
    --bs-card-bg: #ffffff;
    --bs-jmp-dark-hover: #eeeeee;
    --bs-jmp-dark-border-hover: #cccccc;
    --bs-jmp-dark-text-hover: #202020;
    --bs-jmp-dark-disabled: #bcbcbc;
    --bs-form-label: 0.875rem;
    --bs-jmp-border-hover: #b9b9b9;
    --bs-text-emphasis: #1b1b1b;
    --bs-tertiary-bg-rgb: 250, 250, 250;
    --bs-dark-rgb: 248, 248, 248;
    --bs-jmp-fade-bg: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 70%, rgba(255, 255, 255, 1) 100%);
    --bs-jmp-fade-bg-up: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 70%, rgb(255, 255, 255) 100%);
    --bs-secondary-bg-rgb: 250, 250, 250;
    --swiper-theme-color: var(--bs-primary);
    --bs-warning: #6F4A00;
    
    --bs-celery-rgb: 102, 142, 45;      /* darker green */
    --bs-lactose-rgb: 204, 172, 0;      /* darker yellow */
    --bs-soya-rgb: 204, 112, 0;         /* darker orange */
    --bs-mustard-rgb: 204, 156, 0;      /* darker mustard yellow */
    --bs-shellfish-rgb: 204, 79, 57;    /* darker tomato red */
    --bs-nuts-rgb: 123, 31, 31;         /* darker brown */
    --bs-pork-rgb: 204, 84, 144;        /* darker pink */
    --bs-fish-rgb: 0, 143, 191;         /* darker sky blue */
    --bs-gluten-rgb: 123, 64, 35;       /* darker dark brown */
    --bs-egg-rgb: 204, 204, 122;        /* darker pale yellow */
    /* Celery */
    --bs-allergy-celery-icon: 46, 92, 32;
    --bs-allergy-celery-bg: 230, 242, 226;

    /* Lactose */
    --bs-allergy-lactose-icon: 102, 87, 0;
    --bs-allergy-lactose-bg: 245, 240, 214;

    /* Soya */
    --bs-allergy-soya-icon: 102, 56, 0;
    --bs-allergy-soya-bg: 245, 232, 214;

    /* Mustard */
    --bs-allergy-mustard-icon: 92, 72, 0;
    --bs-allergy-mustard-bg: 244, 236, 210;

    /* crustaceans */
    --bs-allergy-crustaceans-icon: 112, 32, 24;
    --bs-allergy-crustaceans-bg: 246, 224, 220;

    /* Nuts */
    --bs-allergy-nuts-icon: 74, 24, 24;
    --bs-allergy-nuts-bg: 240, 222, 222;

    /* Pork */
    --bs-allergy-pork-icon: 112, 40, 72;
    --bs-allergy-pork-bg: 242, 224, 234;

    /* Fish */
    --bs-allergy-fish-icon: 0, 72, 102;
    --bs-allergy-fish-bg: 220, 236, 242;

    /* Gluten */
    --bs-allergy-gluten-icon: 74, 46, 24;
    --bs-allergy-gluten-bg: 238, 228, 220;

    /* Egg */
    --bs-allergy-egg-icon: 92, 92, 0;
    --bs-allergy-egg-bg: 244, 244, 214;

    /* Sesamfrø (Sesame) */
    --bs-allergy-sesame-icon: 92, 76, 40;
    --bs-allergy-sesame-bg: 242, 236, 224;

    /* Svovldioxid og sulfitter (Sulfites) */
    --bs-allergy-sulfites-icon: 96, 32, 64;
    --bs-allergy-sulfites-bg: 242, 222, 234;

    /* Lupin */
    --bs-allergy-lupin-icon: 64, 56, 112;
    --bs-allergy-lupin-bg: 228, 224, 242;

    /* Bløddyr (Molluscs) */
    --bs-allergy-molluscs-icon: 32, 72, 92;
    --bs-allergy-molluscs-bg: 222, 236, 242;
}

[data-bs-theme=dark] {
    --bs-body-bg: #232333;
    --bs-jmp-dark: #272739;
    --bs-jmp-dark-border: #222232;
    --bs-jmp-dark-text: #979797;
    --bs-jmp-dark-hover: #1e1e2c;
    --bs-jmp-dark-border-hover: #1a1a27;
    --bs-jmp-dark-text-hover: #d9d9d9;
    --bs-jmp-dark-disabled: #1e1e2c;
    --bs-secondary-bg-rgb: 33, 33, 48;
    /* --bs-tertiary-bg-rgb: 70, 71, 100; */
    --bs-secondary: #52547A;
    --bs-tertiary-bg-rgb: 41, 42, 60;
    --bs-form-label: 0.875rem;
    --bs-jmp-border-hover: #77789e;
    --bs-dark-rgb: 33, 33, 49;
    --bs-text-emphasis: #FFFFFF;
    --bs-jmp-fade-bg: linear-gradient(90deg, rgba(43, 44, 64, 0) 0%, rgba(43, 44, 64, 0.7) 70%, rgba(43, 44, 64, 1) 100%);
    --bs-jmp-fade-bg-up: linear-gradient(180deg, rgba(43, 44, 64, 0) 0%, rgba(43, 44, 64, 0.7) 70%, rgba(43, 44, 64, 1) 100%);
    --bs-card-bg: #2b2c40;
    --bs-border-color-rgb: 78, 79, 108;
    --bs-warning: #ffab00;
    --bs-celery-rgb: 141, 199, 63;      /* green, natural for celery */
    --bs-lactose-rgb: 255, 214, 0;      /* yellow, dairy / milk */
    --bs-soya-rgb: 255, 140, 0;         /* orange, soy / legumes */
    --bs-mustard-rgb: 255, 195, 0;      /* mustard yellow */
    --bs-shellfish-rgb: 255, 99, 71;    /* tomato red, seafood */
    --bs-nuts-rgb: 165, 42, 42;         /* brown, nuts / earthy */
    --bs-pork-rgb: 255, 105, 180;       /* pink, pork */
    --bs-fish-rgb: 0, 191, 255;         /* sky blue, fish / water */
    --bs-gluten-rgb: 160, 82, 45;        /* dark brown, wheat / bread */
    --bs-egg-rgb: 255, 255, 153;        /* pale yellow, eggs */
        /* Celery */
    --bs-allergy-celery-icon: 162, 210, 140;
    --bs-allergy-celery-bg: 44, 64, 40;

    /* Lactose */
    --bs-allergy-lactose-icon: 230, 216, 140;
    --bs-allergy-lactose-bg: 72, 68, 40;

    /* Soya */
    --bs-allergy-soya-icon: 230, 184, 140;
    --bs-allergy-soya-bg: 72, 56, 40;

    /* Mustard */
    --bs-allergy-mustard-icon: 224, 210, 140;
    --bs-allergy-mustard-bg: 68, 64, 40;

    /* crustaceans */
    --bs-allergy-crustaceans-icon: 230, 162, 152;
    --bs-allergy-crustaceans-bg: 72, 40, 40;

    /* Nuts */
    --bs-allergy-nuts-icon: 216, 160, 160;
    --bs-allergy-nuts-bg: 64, 36, 36;

    /* Pork */
    --bs-allergy-pork-icon: 224, 160, 190;
    --bs-allergy-pork-bg: 72, 40, 56;

    /* Fish */
    --bs-allergy-fish-icon: 160, 210, 230;
    --bs-allergy-fish-bg: 36, 56, 72;

    /* Gluten */
    --bs-allergy-gluten-icon: 210, 184, 160;
    --bs-allergy-gluten-bg: 64, 52, 40;

    /* Egg */
    --bs-allergy-egg-icon: 224, 224, 160;
    --bs-allergy-egg-bg: 72, 72, 40;

    /* Sesamfrø (Sesame) */
    --bs-allergy-sesame-icon: 210, 196, 160;
    --bs-allergy-sesame-bg: 64, 60, 44;

    /* Svovldioxid og sulfitter (Sulfites) */
    --bs-allergy-sulfites-icon: 224, 160, 196;
    --bs-allergy-sulfites-bg: 64, 36, 52;

    /* Lupin */
    --bs-allergy-lupin-icon: 196, 184, 230;
    --bs-allergy-lupin-bg: 48, 44, 72;

    /* Bløddyr (Molluscs) */
    --bs-allergy-molluscs-icon: 160, 210, 230;
    --bs-allergy-molluscs-bg: 36, 56, 72;

}

[data-bs-theme=dark] .btn-outline-secondary {
    background-color: #292a3c;
    color: var(--bs-text-body);
    box-shadow: none;
}

[data-bs-theme=light] .btn-outline-secondary {
    color: var(--bs-text-body);
    box-shadow: none;
    border-color: var(--bs-border-color);
}

[data-bs-theme=light] .btn-outline-secondary:active, .btn-outline-secondary:hover, .btn-outline-secondary:focus-visible  {
    color: var(--bs-text-body-empasis);
    background-color: var(--bs-card-bg);
    border-color: var(--bs-jmp-border-hover);
}

.aw-icon {
    font-family: "Material Symbols Outlined";
    font-size: 24px !important;
    font-variation-settings: 'wght' 200, 'FILL' 0, 'GRAD' 0, 'opsz' 24;
    padding-right: 2px;
    padding-left: 2px;
}
.aw-icon-s {
    font-size: 21px !important;
}

.aw-icon-xs {
    font-size: 14px !important;
}

.aw-icon-md {
    font-size: 24px !important;
}

.aw-icon-l {
    font-size: 36px !important;
}

.aw-icon-xl {
    font-size: 50px !important;
}

/** Fixes grouped floating inputs **/
.form-floating > .form-select {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
.form-floating > .form-control {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
.form-floating > .form-control:focus {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
.form-floating > .form-control:focus-within {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
.input-group:has(button) .form-control {
    padding-top: 1.625rem !important;
    padding-bottom: 0.625rem !important;
}
/* (Optional) If you want to keep the focus-within behavior for input-groups */
html:not([dir='rtl']) .input-group .form-select {
    padding: calc(0.543rem - 2px) calc(0.9375rem - 2px);
}
[dir='rtl'] .input-group .form-select {
    padding: calc(0.543rem - 2px) calc(0.9375rem - 2px);
}
.flatpickr-calendar.open {
    z-index: 1090 !important;
}
.bbd-btn-icon {
    block-size: calc(2.2505001rem + calc(var(--bs-border-width)* 2));
    inline-size: calc(2.2505001rem + calc(var(--bs-border-width)* 2));
    padding:0;
}

.bbd-notify-dot {
    transform: translate(-125%, 65%) !important
}
.bbd-notify-effects {
    position: relative;
}
.bbd-notify-effects:hover {
    transform: none !important; /* Prevents movement */
    box-shadow: none !important; /* Prevents hover effect from affecting size */
}
.bbd-notify-effects span {
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 0, 0, 0.7);
    }
    70% {
        box-shadow: 0 0 0 15px rgba(255, 0, 0, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 0, 0, 0);
    }
}
.bbd-notify-effects i {
    animation: bell-shake 2s infinite ease-in-out;
}
@keyframes bell-shake {
    0% { transform: rotate(0deg); }
    10% { transform: rotate(-20deg); }
    20% { transform: rotate(20deg); }
    30% { transform: rotate(-20deg); }
    40% { transform: rotate(20deg); }
    50% { transform: rotate(-10deg); }
    60% { transform: rotate(10deg); }
    70% { transform: rotate(-5deg); }
    80% { transform: rotate(5deg); }
    90% { transform: rotate(-2deg); }
    100% { transform: rotate(0deg); }
}

.jmp-menu-icon  {
    font-size: 24px;
    line-height: 1em;
    margin-right: 8px;
    object-fit: contain;
}

.jmp-logo-margin {
    margin-inline-start: 0.5em;
}

.jmp-logo-text {
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
}

.jmp-logo-text-bold {
    font-weight: 600;
}

.jmp-logo-text.jmp-logo-text-bold, span.app-brand-text.demo.menu-text.ms-2.jmp-logo-text {
    font-size: 1.45em;
}

.custom-option.custom-option-icon.checked .icon-base, .custom-option.custom-option-icon.checked .aw-icon {
    color: #696cff;
}

.jmp-bg-dark {
    background-color: var(--bs-jmp-dark) !important;
    color: var(--bs-jmp-dark-text);
}

.fs-7 {
    font-size: 0.6875rem !important;
}

.fs-08 {
    font-size: 0.8rem !important;
}

.btn-dark {
    background-color: var(--bs-jmp-dark);
    border-color: var(--bs-jmp-dark-border);
    box-shadow: none !important;
    color: var(--bs-jmp-dark-text);
}
.btn-dark:hover {
    background-color: var(--bs-jmp-dark-hover);
    border-color: var(--bs-jmp-dark-border-hover);
    box-shadow: none !important;
    color: var(--bs-jmp-dark-text-hover);
}

.jmp-category-name {
    display: -webkit-box;
    -webkit-line-clamp: 2;      /* Limit to 2 lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 15px;
    word-break: break-all;
}

@media (max-width: 1600px) {
.jmp-category-name {
    font-size: 11px;
}
}

.jmp-category-icon {
    font-size: 24px !important;
}

@media (max-width: 1600px) {
.jmp-category-icon {
    font-size: 21px !important;
}
}


.jmp-category-icon-wrapper {
    width: 48px;
    height: 48px;
}

@media (max-width: 1600px) {
.jmp-category-icon-wrapper {
    width: 32px;
    height: 32px;
}
}

.jmp-section-header {
    font-size: 1.25rem;
}

/*Dish create page*/

.jmp-dish-name {
    display: -webkit-box;
    -webkit-line-clamp: 1;      /* Limit to 1 lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
}

@media (max-width: 576px) {
    .jmp-dish-name {
        font-size: 11px;
    }

    .jmp-category-name {
        -webkit-line-clamp: 1;
    }

    .jmp-section-header {
        font-size: 1rem;
    }
}

input[readonly] {
    color: var(--bs-secondary-color);
    background-color: rgba(var(--bs-base-color-rgb), 0.06);
    border-color: rgba(var(--bs-base-color-rgb), 0.24);
    opacity: 1;
}

.input-group-merge:has(input:read-only) .form-control {
    border-right: 0px !important;
}

input[readonly] + .input-group-text {
    color: var(--bs-secondary-color);
    background-color: rgba(var(--bs-base-color-rgb), 0.06);
    border-color: rgba(var(--bs-base-color-rgb), 0.24);
    opacity: 1;
    margin-left: 0px !important;
}

.swiper-section {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  /* === CONTAINER === */
  .swiper-container-wrapper {
    position: relative;      /* anchor for absolute pagination */
    display: flex;
    align-items: flex-end;   /* align arrows & swiper bottom edges */
    justify-content: center;
    width: 100%;
    overflow: visible;       /* allow pagination above */
  }

  /* === SWIPER === */
  .swiper {
    flex: 1;
    width: 100%;
    height: 150px;
  }

  .swiper.mySwiper2 {
    flex: 1;
    width: 100%;
    height: 400px;
  }

  /* === ARROWS === */
  .swiper-button-prev,
  .swiper-button-next {
    position: static;
    width: 48px;
    height: 150px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--bs-jmp-dark);
    color: var(--bs-jmp-dark-text);
    transition: all 0.2s ease;
    cursor: pointer;
    user-select: none;
    z-index: 2;
  }
  /* Icons */
  .swiper-button-prev::after,
  .swiper-button-next::after {
    font-size: 20px;
  }


  .swiper-button-next-2, .swiper-button-prev-2 {
      height: 400px;
    }

    .swiper-slide {
        -webkit-user-select: none; /* Safari */
        -moz-user-select: none;    /* Firefox */
        -ms-user-select: none;     /* Internet Explorer/Edge */
        user-select: none;         /* Standard */
    }

    .swiper-button-prev:hover,
    .swiper-button-next:hover {
        background-color: var(--bs-jmp-dark-hover);

    }

    .swiper-button-disabled {
        opacity: 0.4;
        pointer-events: none;
        background-color: var(--bs-jmp-dark-disabled);
        color: var(--bs-jmp-dark-text);
    }

    /* === PAGINATION ABOVE THE SLIDER === */
    .swiper-pagination {
        position: absolute;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        z-index: 10;    /* ensures it's always visible */
    }

    .swiper-pagination-bullet {
        background: var(--bs-secondary-color, #999);
    }

    .swiper-pagination-bullet-active {
        background: var(--bs-primary, #0d6efd);
    }

    .swiper-pagination-bullets {
        bottom: unset !important;
        top: -24px !important;
    }


.jmp-dish-customize {
    font-size: 13px;
}

.jmp-cart-item-wrapper {
    max-height: calc(100vh - 382px - 24px - 16px); /* Viewport height - header - cart header - gap - payment box */
    overflow-y: scroll;
}

.jmp-cart-fade {
    height: 32px;
    background: #000000;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
}

    @media (max-width: 576px) {
      .swiper-button-prev, .swiper-button-next {
      position: static;
      width: 26px;
      /* height: 150px; */
      }

      /* Icons */
      .swiper-button-prev::after,
      .swiper-button-next::after {
        font-size: 16px;
      }

        /* === SWIPER === */
      .swiper {
        flex: 1;
        width: 100%;
        height: 50px;
      }

      .swiper-button-prev,
      .swiper-button-next {
      position: static;
      width: 32px;
      height: 50px;
    }

    .swiper.mySwiper2 {
        flex: 1;
        width: 100%;
        height: 280px;
      }

    .swiper-button-next-2, .swiper-button-prev-2 {
        height: 280px;
        }

    .swiper-pagination-bullet {
        width: 6px;
        height: 6px;
    }


    .swiper-pagination-bullets {
        bottom: unset !important;
        top: -16px !important;
    }

    .container-p-y > .row.jmp-pos-page {
        margin-top: 0; /* optional, just in case */
      }

      .container-p-y:has(> .row.jmp-pos-page) {
        padding-top: 1rem !important;
      }
    }

    /* POS */
    /* POS */

    .jmp-drawer-open {
    box-shadow: 0 -31px 40px rgba(0, 0, 0, 0.342);
    }

    .drawer-handle span {
        height: 3px;
        width: 16%;
        border-radius: 32px;
    }

    .drawer-cart-items {
        max-height: 300px;
        overflow-y: scroll;
    }

    .discount-cart {
        max-height: 400px;
        overflow-y: scroll;
    }

    @media (max-width: 576px) {
        .discount-cart {
            max-height: 215px;
            overflow-y: scroll;
        }
    }

    .split-single-cart {
        max-height: 45vh;
        overflow-y: scroll;
    }

    @media (max-width: 576px) {
        .split-single-cart {
            max-height: 45vh;
            overflow-y: scroll;
        }
    }

    .jmp-receipt-list {
        max-height: 70vh;
        overflow-y: auto;
    }

    .jmp-select-restaurant {
        padding: 0.23rem 0.4rem 0.23rem 1rem;
    }

    @media (min-width: 1200px) {
        .jmp-select-restaurant {
            padding: 0.4812rem 0.65rem 0.4812rem 1rem;
        }
    }

    .nav-link.active .jmp-button-text-hide {
        display: block;
    }
    .jmp-button-text-hide {
        display: none;
    }

.scroll-fade-x {
  position: relative;
}

.scroll-fade-x::before,
.scroll-fade-x::after {
  content: "";
  position: absolute;
  top: 0;
  width: 40px;        /* Adjust fade width */
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.scroll-fade-x::before {
  left: 0;
  background: linear-gradient(to right, var(--bs-modal-bg), rgba(255, 255, 255, 0));
}

.scroll-fade-x::after {
  right: 0;
  background: linear-gradient(to left, var(--bs-modal-bg), rgba(255, 255, 255, 0));
}


@media (max-width: 576px) {
    .modal .modal-dialog:not(.modal-fullscreen) {
        margin: 0.75rem;
        padding-inline: 0px !important;
    }
}

.jmp-discount-select {
    font-size: var(--bs-body-font-size);
}

.custom-option-title.jmp-discount-select.aw-icon {
    font-size: var(--bs-body-font-size) !important;
}

.popover-body {
    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}

/* Create dish */

.jmp-lang-tabs {
    overflow-y: scroll;
    padding-bottom: 8px;
}

/* kun til denne ul */
.jmp-lang-tabs.scroll-fade-x.jmp-lang-tabs-fade{
  position: relative; /* safety hvis noget andet overskriver */
  --bs-modal-bg: var(--bs-body-bg); /* så farven matcher siden, uden at ændre din fade-css */
}

/* mobil: gør den horisontal scrollbar og no-wrap */
@media (max-width: 576px){
  .jmp-lang-tabs.scroll-fade-x.jmp-lang-tabs-fade{
    overflow-x: auto;
    overflow-y: hidden;      /* override af din overflow-y: scroll, men kun her */
    flex-wrap: nowrap;       /* Bootstrap nav wrap ellers */
    -webkit-overflow-scrolling: touch;

    /* lidt luft så første og sidste item ikke ligger “under” fade */
    padding-left: 12px;
    padding-right: 12px;
  }

  /* valgfrit: skjul scrollbar */
  .jmp-lang-tabs.scroll-fade-x.jmp-lang-tabs-fade{
    scrollbar-width: none;
  }
  .jmp-lang-tabs.scroll-fade-x.jmp-lang-tabs-fade::-webkit-scrollbar{
    display: none;
  }
}

/* wrapper scroller ikke, men viser fade */
.jmp-tabs-fade{
  position: relative;
  overflow: hidden;
  --bs-modal-bg: var(--bs-body-bg); /* matcher baggrund uden at ændre din fade-css */
}

/* ul scroller */
@media (max-width: 576px){
  .jmp-tabs-scroll{
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
}

/* skjul venstre fade når vi er i starten */
.jmp-tabs-fade.is-start::before{
  opacity: 0 !important;
}

/* (valgfrit men nice) blød overgang */
.jmp-tabs-fade::before,
.jmp-tabs-fade::after{
  transition: opacity 160ms ease;
}

@media (max-width: 576px){
    .jmp-choice-text {
        display: none;
    }
}


.jmp-choices-tabs.active .jmp-choice-text {
    display: block;
}

.jmp-modifier-delete-spacing {
    margin-top: calc(var(--bs-form-label) + 0.55rem);
}

.form-label {
    font-size: var(--bs-form-label);
}

/* Bottom navigation */
@media (max-width: 576px){
    .layout-navbar {
        position: fixed !important;
        width: 100% !important;
        margin: 0px !important;
    }
}

/* Hover animations for table list */
  .jmp-card-hover {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  }
  .jmp-card-hover:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  }

  .border-hover {
    transition: 200ms border-color ease-in-out;
  }

  .border-hover:hover {
    border-color: var(--bs-jmp-border-hover) !important;
  }


  .jmp-pin-dot {
    block-size: 0.75rem !important;
    inline-size: 0.75rem !important;
    border-radius: 50%;
    display: inline-block;
  }

  .custom-option {
    transition: 200ms border-color ease-in-out;
    border-width: 1px !important;
}

  .custom-option:hover {
    border-color: var(--bs-jmp-border-hover);
    border-width: 1px;
}
  .custom-option:checked {
    border-color: var(--bs-primary);
}
.custom-option.checked:hover {
  border-color: var(--bs-primary);
}

.jmp-pin-box {
    height: 72px;
}

.jmp-pin-number {
    font-size: 1.5rem;
}

@media (max-width: 576px){
    .jmp-pin-box {
    height: 64x;
    }

    .jmp-pin-number {
        font-size: 1.25rem;
    }
}

.jmp-carrusel-fade {
    background: #ffffff;
background: var(--bs-jmp-fade-bg);
  pointer-events: none;
  user-select: none;
}

.jmp-carrusel-fade-up {
    background: #ffffff;
    background: var(--bs-jmp-fade-bg-up);
    pointer-events: none;
    user-select: none;
}

.jmp-user-name {
    transition: color 200ms ease-in-out;
}

.custom-option.checked .jmp-user-name {
    color: var(--bs-text-emphasis) !important;
}

.modal.jmp-pin-modal {
    --bs-modal-width: 12rem;
}

.jmp-user-quick-select.checked .avatar .jmp-quick-user-name {
    color: var(--bs-primary) !important;
}


.jmp-user-quick-select.checked {
    background-color:
 color-mix(in sRGB, var(--bs-paper-bg) var(--bs-bg-label-tint-amount), var(--bs-primary)) !important;
}

.form-check.custom-option {
    margin: 0px !important;
}

/* Removes hover lift effect on buttons with .btn-no-lift class */
.btn-no-lift:hover {
    transform: none !important;
}

.jmp-icon-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
}

.jmp-icon-box-sm {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
}

.jmp-paid * {
    opacity: 0.9;
}

/* Modifier styling */
.faded-top-line {
    background: linear-gradient(
      rgba(var(--bs-border-color-rgb), 0.2),
      rgba(var(--bs-border-color-rgb), 1)
    );
}

.jmp-modifier-item.accordion-item .accordion-header {
    padding-bottom: 1rem !important;
    transition: 200ms ease-out padding;
}

.jmp-modifier-item.accordion-item.active .accordion-header {
    padding-bottom: 0px !important;
}

/* Allergies */
.jmp-allergy-celery-box {
    background-color: rgba(var(--bs-celery-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-celery {
    fill: rgba(var(--bs-celery-rgb), 1);
}
.jmp-allergy-lactose-box {
    background-color: rgba(var(--bs-lactose-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-lactose {
    fill: rgba(var(--bs-lactose-rgb), 1);
}
.jmp-allergy-soya-box {
    background-color: rgba(var(--bs-soya-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-soya {
    fill: rgba(var(--bs-soya-rgb), 1);
}
.jmp-allergy-mustard-box {
    background-color: rgba(var(--bs-mustard-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-mustard {
    fill: rgba(var(--bs-mustard-rgb), 1);
}
.jmp-allergy-crustaceans-box {
    background-color: rgba(var(--bs-crustaceans-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-crustaceans {
    fill: rgba(var(--bs-crustaceans-rgb), 1);
}
.jmp-allergy-nuts-box {
    background-color: rgba(var(--bs-nuts-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-nuts {
    fill: rgba(var(--bs-nuts-rgb), 1);
}
.jmp-allergy-pork-box {
    background-color: rgba(var(--bs-pork-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-pork {
    fill: rgba(var(--bs-pork-rgb), 1);
}
.jmp-allergy-fish-box {
    background-color: rgba(var(--bs-fish-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-fish {
    fill: rgba(var(--bs-fish-rgb), 1);
}
.jmp-allergy-gluten-box {
    background-color: rgba(var(--bs-gluten-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-gluten {
    fill: rgba(var(--bs-gluten-rgb), 1);
}
.jmp-allergy-egg-box {
    background-color: rgba(var(--bs-egg-rgb), 0.2);
    padding: 4px;
    width: 26px;
    height: 26px;
    display: flex;
}

.jmp-allergy-egg {
    fill: rgba(var(--bs-egg-rgb), 1);
}


/* Allergies */
/* Allergies */
/* Allergies */
/* Allergies */
/* Allergies */
/* Allergies */
/* Allergies */
/* Allergies */


.jmp-badge-allergy-box {
    padding: 4px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.icon-celery, .icon-lactose, .icon-lupin, .icon-sesame, .icon-molluscs, .icon-so2, .icon-soya, .icon-mustard, .icon-crustaceans, .icon-nuts, .icon-pork, .icon-fish, .icon-gluten, .icon-egg {
    display: flex;
}

.jmp-badge-allergy-celery-box {
    background-color: rgb(var(--bs-allergy-celery-bg));
}
.icon-celery {
    color: rgb(var(--bs-allergy-celery-icon));
}

.jmp-badge-allergy-lactose-box {
    background-color: rgb(var(--bs-allergy-lactose-bg));
}
.icon-lactose {
    color: rgb(var(--bs-allergy-lactose-icon));
}

.jmp-badge-allergy-soya-box {
    background-color: rgb(var(--bs-allergy-soya-bg));
}
.icon-soya {
    color: rgb(var(--bs-allergy-soya-icon));
}

.jmp-badge-allergy-mustard-box {
    background-color: rgb(var(--bs-allergy-mustard-bg));
}
.icon-mustard {
    color: rgb(var(--bs-allergy-mustard-icon));
}

.jmp-badge-allergy-crustaceans-box {
    background-color: rgb(var(--bs-allergy-crustaceans-bg));
}
.icon-crustaceans {
    color: rgb(var(--bs-allergy-crustaceans-icon));
}

.jmp-badge-allergy-nuts-box {
    background-color: rgb(var(--bs-allergy-nuts-bg));
}
.icon-nuts {
    color: rgb(var(--bs-allergy-nuts-icon));
}

.jmp-badge-allergy-pork-box {
    background-color: rgb(var(--bs-allergy-pork-bg));
}
.icon-pork {
    color: rgb(var(--bs-allergy-pork-icon));
}

.jmp-badge-allergy-fish-box {
    background-color: rgb(var(--bs-allergy-fish-bg));
}
.icon-fish {
    color: rgb(var(--bs-allergy-fish-icon));
}

.jmp-badge-allergy-gluten-box {
    background-color: rgb(var(--bs-allergy-gluten-bg));
}
.icon-gluten {
    color: rgb(var(--bs-allergy-gluten-icon));
}

.jmp-badge-allergy-egg-box {
    background-color: rgb(var(--bs-allergy-egg-bg));
}
.icon-egg {
    color: rgb(var(--bs-allergy-egg-icon));
}


[data-bs-theme=light] .btn-outline-secondary {
    color: var(--bs-text-body);
    box-shadow: none;
    border-color: var(--bs-border-color);
    background-color: var(--bs-body-bg);
}

.jmp-badge-allergy-sesame-box {
    background-color: rgb(var(--bs-allergy-sesame-bg));
}

.icon-sesame {
    color: rgb(var(--bs-allergy-sesame-icon));
}

.jmp-badge-allergy-so2-box {
    background-color: rgb(var(--bs-allergy-sulfites-bg));
}

.icon-so2 {
    color: rgb(var(--bs-allergy-sulfites-icon));
}

.jmp-badge-allergy-lupin-box {
    background-color: rgb(var(--bs-allergy-lupin-bg));
}

.icon-lupin {
    color: rgb(var(--bs-allergy-lupin-icon));
}

.jmp-badge-allergy-molluscs-box {
    background-color: rgb(var(--bs-allergy-molluscs-bg));
}

.icon-molluscs {
    color: rgb(var(--bs-allergy-molluscs-icon));
}

.aw-menu-card-product-title {
font-size: 1.025rem !important;
}

/* Autocomplete list dropdown styling dishs add modifier */
.jmp-bg-secondary {
    background-color: var(--bs-jmp-dark);
}

.jmp-accordion-max {
    max-height: 500px; overflow-y: scroll; overflow-x: hidden;
}

/* Bottom navigation */
@media (max-width: 576px){
    .jmp-accordion-max {
        max-height: 400px; overflow-y: scroll; overflow-x: hidden;
    }
}

.jmp-no-border-mobile {
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
  }

@media (max-width: 768px) {
    .jmp-no-border-mobile {
      border: var(--bs-border-width) solid var(--bs-border-color);
      border-bottom: 0px solid var(--bs-border-color);
      border-radius: var(--bs-border-radius) var(--bs-border-radius) 0px 0px;
    }
  }

  .jmp-text-hover {
    transition: 200ms ease-in-out all;
  }

  .jmp-text-hover:hover {
    color: var(--bs-jmp-dark-text-hover) !important;
  }

  .transition150 {
    transition: all 150ms ease-in-out;
  }

  .transition250 {
    transition: all 250ms ease-in-out;
  }

  .menu-vertical .menu-item {
    position: relative;
}

@media (max-width: 1199.98px) {
    .layout-overlay {
        background: black;
    }
}

/* Tilføj menu modal */
.jmp-current-serving {
    font-size: 0.7975rem;
}

.jmp-menu-modal.active {
    padding-inline-end: 1rem !important;
    padding-inline-start: 1rem !important;
}

.quantity-subtract {
    border-radius: 3px 0px 0px 3px;
    border-width: 1px 0px 1px 1px;
    border-color: var(--bs-border);
    border-style: solid;
}

.quantity-add {
    border-radius: 0px 3px 3px 0px;
    border-width: 1px 1px 1px 0px;
    border-color: var(--bs-border);
    border-style: solid;
}

.bbd-quantity-increase, .bbd-quantity-decrease {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--bs-card-bg);
    border-color: var(--bs-border-color);
    border-style: var(--bs-border-style);
}


.bbd-quantity-increase {
    border-width: var(--bs-border-width) var(--bs-border-width) var(--bs-border-width) 0px;
}

.bbd-quantity-decrease {
    border-color: var(--bs-border-color);
    border-style: var(--bs-border-style);
    border-width: var(--bs-border-width) 0px var(--bs-border-width) var(--bs-border-width);
}

.bbd-quantity-increase:hover, .bbd-quantity-increase:focus, .bbd-quantity-increase:active, .bbd-quantity-increase:focus-visible {
    border-color: var(--bs-border-color);
    border-style: var(--bs-border-style);
    border-width: var(--bs-border-width) var(--bs-border-width) var(--bs-border-width) 0px;
}

.bbd-quantity-decrease:hover, .bbd-quantity-decrease:focus, .bbd-quantity-decrease:active, .bbd-quantity-decrease:focus-visible {
    border-color: var(--bs-border-color);
    border-style: var(--bs-border-style);
    border-width: var(--bs-border-width) 0px var(--bs-border-width) var(--bs-border-width);
}

.bbd-quantity-input {
    padding: 0px;
}

.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--bs-primary);
}

.aw-custom-tabs {
    background-color: var(--bs-body-bg);
    /* border-radius: var(--bs-border-radius); */
    width: auto;

}

.aw-custom-tabs-text {
    font-size: 12px;
}

@media (min-width: 576px){
    .aw-custom-tabs-text {
        font-size: 14px;
    }
}

@media (min-width: 768px) {
    .aw-custom-tabs-text {
        font-size: var(--bs-nav-link-font-size);
    }
}

.aw-setting-card:hover {
    background-color: var(--bs-light-bg-subtle) !important;
}

.aw-settings-aside-item:hover {
    background-color: var(--bs-light-bg-subtle) !important;
}

a.aw-settings-aside-item:hover span, a.aw-settings-aside-item:hover h2 {
    color: var(--bs-emphasis-color) !important;
}

a.aw-settings-aside-item.active span, a.aw-settings-aside-item.active h2 {
    color: var(--bs-emphasis-color) !important;
}

.aw-settings-aside-item.active {
    background-color: var(--bs-light-bg-subtle) !important;
}

.aw-navbar {
    position: fixed;
    bottom: 0px;
    width: calc(100% - 32px) !important;
    z-index: 12;
}

@media (min-width: 768px) {
    .aw-navbar {
        position: static;
        width: auto !important;
    }
}

.offcanvas-wide {
    --bs-offcanvas-width: min(1200px, 90vw);
}

.color-swatch {
    display: inline-block;
    width: 26px; height: 26px;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid transparent;
    outline: 2px solid transparent;
    outline-offset: 2px;
    transition: outline-color .12s, transform .1s;
  }
  .color-swatch:hover { transform: scale(1.1); }
  .color-swatch.active { outline-color: var(--bs-primary); }
  .color-swatch-custom {
    width: 26px; height: 26px;
    border-radius: 50%;
    border: 1.5px dashed var(--bs-border-color);
  }

  @media (min-width: 576px)  { .h-sm-100  { height: 100% !important; } }
  @media (min-width: 768px)  { .h-md-100  { height: 100% !important; } }
  @media (min-width: 992px)  { .h-lg-100  { height: 100% !important; } }
  @media (min-width: 1200px) { .h-xl-100  { height: 100% !important; } }
  @media (min-width: 1400px) { .h-xxl-100 { height: 100% !important; } }

  /* .alert.alert-warning.alert-dismissible {
    color: #6F4A00;
  } */