body {
    background-color: #f7f7f7 !important;
}

/* Hide the Elementor site header during the ordering process (this page only) */
.elementor-location-header {
    display: none;
}

/* The cutoff notice comes back on its own, matching the green bar the header used to show. */
.select-meals-cutoff {
    min-height: 35px;
    padding: 6px 20px;
    background-color: #51ab3a;
    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.select-meals-cutoff #mps-cutoff-shortcode-header-notice {
    color: #ffffff;
    font-size: 14px;
    line-height: 20px;
}

@media (min-width: 768px) {
    .select-meals-cutoff #mps-cutoff-shortcode-header-notice br {
        display: none;
    }
}

/*Stepper*/
.stepper {
    border-bottom: 1px solid #e5e5e5;
    padding: 16px 0;
    background-color: #fff;
    margin-bottom: 10px;
}

/* 270px por passo, que era a proporção do desenho de dois passos. Manter os 541px originais com
   três passos espremia cada um em 180px, e o padding de 45px do conteúdo comia um quarto disso. */
.stepper-content {
    width: 810px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    /* Respiro branco entre as formas. Sem ele a seta de um passo entra no encaixe do seguinte e os
       dois viram um bloco só, o que fica pior ainda quando o primeiro está preenchido de verde. */
    gap: 8px;
}

@media (max-width: 768px) {
    .stepper-content {
        width: 100%;
        max-width: 380px;
    }
}

/* Partes iguais da linha. As formas esticam para o item, então acrescentar um passo estreita todas
   em vez de estourar o container. */
.stepper-item {
    position: relative;
    flex: 1 1 0;
    height: 60px;
}

.stepper-item svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

@media (max-width: 768px) {
    .stepper {
        padding: 11px 0;
        border-color: #00940099;
        margin-bottom: 0;
    }

    .stepper-item {
        height: 42px;
        min-width: 0;
    }

    .stepper-content {
        gap: 4px;
    }
}

.stepper-item-content {
    position: relative;
    z-index: 2;
    padding-left: 45px;
    height: 60px;
    display: flex;
    flex-direction: column;
    gap: 0;
    justify-content: center;
}

.stepper-item-content strong {
    font-family: "Inter";
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #424242;
}

.stepper-item-content div {
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #737373;
    opacity: 0.5;
}

@media (max-width: 768px) {
    .stepper-item-content {
        height: 42px;
        padding-left: 12px;
        padding-right: 10px;
    }

    .stepper-item-content strong {
        font-size: 12px;
        line-height: 16px;
        padding-top: 2px;
        white-space: nowrap;
    }

    .stepper-item-content div {
        font-size: 10px;
        line-height: 16px;
        white-space: nowrap;
    }
}

.stepper-item.active .stepper-item-content strong,
.stepper-item.active .stepper-item-content div {
    color: #006f00;
}

.stepper-item.active svg path {
    fill: #f7fff8;
    stroke: #1bc01b;
}

.stepper-item.completed .stepper-item-content strong,
.stepper-item.completed .stepper-item-content div {
    color: #fff;
    opacity: 1;
}

.stepper-item.completed svg path {
    fill: #009400;
    stroke: #009400;
}

/* A completed step is a link back to its page. The theme underlines and recolours anchors; the
   text keeps the completed styling above. */
a.stepper-item-content {
    text-decoration: none;
}

a.stepper-item-content:hover strong,
a.stepper-item-content:hover div {
    text-decoration: underline;
}
/*End Stepper*/
/*Select meals wrapper*/
.select-meals-wrapper-content {
    max-width: 1240px;
    margin: auto;
    overflow: hidden;
}

/*QTY select meals*/
.bulk-qty-meals-selected {
    display: flex;
    justify-content: space-between;
    width: 100%;
    position: relative;
    padding-top: 45px;
    margin-bottom: 16px;
}

.bulk-qty-meals-selected .line {
    width: calc(100% - 68px);
    height: 0px;
    border-bottom: 2px dashed #e5e5e5;
    top: 58px;
    left: 34px;
    position: absolute;
}

.bulk-qty-meals-selected .line-meals {
    height: 0px;
    border-bottom: 2px solid #1bc01b;
    top: 58px;
    left: 47px;
    position: absolute;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 768px) {
    .bulk-qty-meals-selected .item {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
    }
}

.bulk-qty-meals-selected .line-meals:not(.active) {
    display: none;
}

.bulk-qty-meals-selected .line-meals > div {
    position: absolute;
    width: 28px;
    height: 28px;
    background: #eeffef;
    border: 2.33333px solid #009400;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bulk-qty-meals-selected .line-meals > div span {
    width: 11.67px;
    height: 11.67px;
    background: #1bc01b;
    border-radius: 50%;
}

.bulk-qty-meals-selected .line-meals > div > div.mps-tooltip {
    padding: 0 8px;
    height: 28px;
    background: #d2fed5;
    border: 1px solid rgba(0, 148, 0, 0.3);
    border-radius: 8px;
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    font-family: "Inter";
    font-weight: 700;
    font-size: 16px;
    line-height: 28px;
    color: #006f00;
}

@media (max-width: 768px) {
    .bulk-qty-meals-selected .line-meals > div > div.mps-tooltip {
        font-size: 12px;
        line-height: 24px;
        height: 24px;
    }

    .bulk-qty-meals-selected .line-meals {
        left: 10%;
    }

    .bulk-qty-meals-selected .line-meals > div span {
        width: 8.3px;
        height: 8.3px;
    }

    .bulk-qty-meals-selected .line-meals > div {
        width: 20px;
        height: 20px;
        right: 3px;
    }

    .bulk-qty-meals-selected {
        margin-bottom: auto;
        width: 100%;
        max-width: 385px;
    }
}

.bulk-qty-meals-selected .line-meals > div > div.mps-tooltip.qty-5 {
    transform: translateX(-40%);
}

.bulk-qty-meals-selected .line-meals > div > div.mps-tooltip.qty-5.qty-last {
    transform: translateX(-60%);
}

.bulk-qty-meals-selected .line-meals > div > div.mps-tooltip:after {
    content: "";
    display: block;
    position: absolute;
    width: 12px;
    height: 12px;
    left: calc(50% - 12px / 2 - 1px);
    background: #d2fed5;
    border-radius: 1px;
    transform: matrix(-0.71, 0.71, 0.71, 0.71, 0, 0);
    bottom: -7px;
}

.bulk-qty-meals-selected .item {
    display: flex;
    flex-direction: column;
    width: 65px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.bulk-qty-meals-selected .item span.bullet {
    width: 26px;
    height: 26px;
    background: #ffffff;
    border: 4px solid #e5e5e5;
    border-radius: 50%;
    margin-bottom: 5px;
    position: relative;
}

@keyframes mps-bullet-pop {
    0% {
        transform: scale(1);
    }
    45% {
        transform: scale(1.18);
    }
    100% {
        transform: scale(1);
    }
}

.bulk-qty-meals-selected .item.active span.bullet {
    animation: mps-bullet-pop 0.32s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@media (prefers-reduced-motion: reduce) {
    .bulk-qty-meals-selected .line-meals {
        transition: none;
    }

    .bulk-qty-meals-selected .item.active span.bullet {
        animation: none;
    }
}

.bulk-qty-meals-selected .item:not(.active) span.bullet svg {
    display: none;
}

.bulk-qty-meals-selected .item.active span.bullet svg {
    width: 32px;
    height: 32px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@media (max-width: 768px) {
    .bulk-qty-meals-selected .line,
    .bulk-qty-meals-selected .line-meals {
        top: 55px;
    }

    .bulk-qty-meals-selected .item span.bullet {
        height: 20px;
        width: 20px;
    }

    .bulk-qty-meals-selected .item.active span.bullet svg {
        width: 24px;
        height: 24px;
    }
}

.bulk-qty-meals-selected .item strong {
    font-family: "Inter";
    font-weight: 700;
    font-size: 26px;
    line-height: 28px;
    text-align: center;
    letter-spacing: -0.772779px;
    color: #292929;
}

.bulk-qty-meals-selected .item span:not(.bullet) {
    font-family: "Inter";
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    letter-spacing: -0.772779px;
    color: #525252;
}

.bulk-qty-meals-selected .item b {
    font-family: "Inter";
    font-weight: 700;
    font-size: 16px;
    line-height: 18px;
    text-align: center;
    letter-spacing: -0.5px;
    color: #009400;
}

.bulk-qty-meals-selected .item span.first-order {
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #009400;
    margin-top: 2px;
}

@media (max-width: 768px) {
    .bulk-qty-meals-selected .item strong {
        font-size: 16px;
        line-height: 18px;
        letter-spacing: -0.5px;
    }

    .bulk-qty-meals-selected .item span:not(.bullet) {
        font-size: 10px;
        line-height: 16px;
        letter-spacing: -0.5px;
        margin-top: -5px;
    }

    .bulk-qty-meals-selected .item b {
        font-size: 10px;
        line-height: 18px;
        letter-spacing: -0.5px;
        font-weight: 500;
    }
}
/*End QTY select meals*/

/*Add to unlock*/
.bulk-qty-meals-selected.no-discount .item b,
.bulk-qty-meals-selected.no-discount .item span.first-order,
.bulk-qty-meals-selected.no-discount + .add-to-unlock {
    display: none;
}

.add-to-unlock {
    background: #fed74b;
    border-radius: 8px;
    text-align: center;
    line-height: 42px;
    font-family: "Inter";
    font-weight: 500;
    font-size: 22px;
    text-align: center;
    letter-spacing: -0.5px;
    color: #4e1d09;
}

.add-to-unlock:not(.active) {
    display: none;
}

.add-to-unlock strong {
    color: #4e1d09;
    font-weight: 700;
}

@media (max-width: 768px) {
    .add-to-unlock {
        line-height: 26px;
        font-size: 14px;
    }

    .select-meals-wrapper {
        padding: 0 16px;
    }
}
/*End add to unlock*/

/*Selection type cards*/
.selection-type--cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-bottom: 42px;
}

@media screen and (max-width: 768px) {
    .selection-type--cards {
        grid-template-columns: repeat(1, 1fr);
    }
}

.selection-type--cards > div {
    display: flex;
    flex-direction: column;
    position: relative;
    border: 1px solid var(--Gray-Scale-200, #e5e5e5);
    padding: 24px;
    border-radius: 12px;
    background-color: #fff;
    gap: 26px;
}

.selection-type--cards > div.selected {
    border: 2px solid var(--Brand-Green-500, #1bc01b);
}

.selection-type--cards > div > div {
    flex-grow: 1;
}

.selection-type--cards > div img {
    position: absolute;
    right: 0;
    top: 0;
}

.selection-type--cards > div.training-mode img {
    top: -70px;
    right: -50px;
    max-width: 110px;
}

.selection-type--cards > div.build-own-mode img {
    top: -60px;
    right: -50px;
    max-width: 210px;
}

@media screen and (max-width: 768px) {
    .selection-type--cards > div.build-own-mode img {
        top: -30px;
        width: 150px;
    }

    .selection-type--cards > div.training-mode img {
        top: -40px;
    }
}

.selection-type--cards > div h3 {
    font-family: "Inter";
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    color: #141414;
    margin-bottom: 16px;
}

.selection-type--cards > div p {
    font-family: "Inter";
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #525252;
}

.selection-type--cards > div:not(.selected) button {
    background: linear-gradient(180deg, #2ad12a 0%, #1bc01b 56.94%);
    box-shadow:
        inset -2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 0px 2px 1.7px rgba(255, 255, 255, 0.6);
    color: #ffffff;
}

.selection-type--cards > div:not(.selected) button:hover {
    color: #fff;
    background: linear-gradient(0deg, #2ad12a 0%, #1bc01b 100%);
}

.selection-type--cards > div button {
    border-radius: 12px;
    font-family: "Inter";
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    text-transform: none;
    justify-content: center;
    height: 48px;
    border: 1px solid transparent;
}

.selection-type--cards > div.selected button {
    color: #009400;
    background-color: #fff;
    box-shadow: none;
    border-color: #009400;
}

/*Packages cards*/
.the-packages {
    border-top: 1px solid #e5e5e5;
    padding-top: 40px;
    margin-bottom: 40px;
}

.the-packages h2,
.step-row h2 {
    font-family: "Inter";
    font-weight: 600;
    font-size: 32px;
    line-height: 38px;
    letter-spacing: -1px;
    color: #424242;
    text-align: center;
    margin-bottom: 24px;
}
.packages.packages--cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.packages.packages--cards .package.package-card {
    position: relative;
    display: block;
    max-height: 140px;
    padding: 22px 18px 18px;
    border-radius: 12px;
    border: 1px solid #ececec;
    background: #fff;
    box-shadow:
        0 22px 55px 0 rgba(0, 0, 0, 0.04),
        0 9.19px 22.98px 0 rgba(0, 0, 0, 0.0288),
        0 4.91px 12.28px 0 rgba(0, 0, 0, 0.0238),
        0 2.75px 6.89px 0 rgba(0, 0, 0, 0.02),
        0 1.46px 3.66px 0 rgba(0, 0, 0, 0.0162),
        0 0.61px 1.52px 0 rgba(0, 0, 0, 0.0112);
    overflow: visible;
    cursor: pointer;
}

.packages.packages--cards .package.package-card:hover,
.packages.packages--cards .package.package-card:has(.radio-icon input:checked),
.packages.packages--cards .package.package-card.active {
    border: 1px solid #1bc01b;
    outline: none;
}

.package.package-card .radio-icon {
    position: absolute;
    top: 20px;
    right: 18px;
    width: 20px;
    height: 20px;
}

label.package.package-card .radio-icon input {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

label.package.package-card .radio-icon .radio-dot {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1.5px solid #b8b8b8;
    background: #fff;
    display: block;
    box-sizing: border-box;
    transition: all 0.2s ease;
}

label.package.package-card .radio-icon:has(input:checked) .radio-dot {
    border: 6px solid #1bc01b !important;
    outline: 2px solid #fff !important;
    box-shadow: 0 0 0 4px #38eb47 !important;
    outline-offset: 0 !important;
    background: #fff;
}

.package-card__content {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.package-card__qty {
    color: #1bc01b;
    font-size: 52px;
    font-weight: 600;
    line-height: 0.95;
    letter-spacing: -0.02em;
    margin-bottom: 6px;
}
.package-card__title {
    color: #141414;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.1;
    margin-bottom: 6px;
}
.package-card__delivery {
    color: #737373;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.2;
}
.package-card__discount {
    color: #005500;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    margin-top: -15px;
    text-align: right;
}
.package-card__top-label {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 6px 12px;
    border-radius: 6px;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    z-index: 2;
}
.package-card__top-label.recommended {
    background: #009400;
    color: #fff;
}
.package-card__top-label.best-value {
    background: #fec84b;
    color: #7a2e0e;
}

#selectPackage.bulk-category-tabs {
    display: flex;
    gap: 0;
    width: 100%;
    max-width: 100%;
    margin: 24px 0 32px;
    padding: 4px;
    border-radius: 10px;
    border: 1px solid #e9eaeb;
    background: #fafafa;
}

#selectPackage.bulk-category-tabs [data-tab-trigger] {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: transparent;
    flex: 1 1 auto;
    white-space: nowrap;
    min-height: 36px;
    padding: 0 10px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    cursor: pointer;
    color: #737373;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    transition: 0.2s ease;
    text-transform: none;
    border: 1px solid transparent;
}

#selectPackage.bulk-category-tabs [data-tab-trigger].active,
#selectPackage.bulk-category-tabs:not(:has(.active)) [data-tab-trigger]:first-child {
    background: #ffffff;
    color: #009400;
    box-shadow:
        0 1px 3px 0 rgba(10, 13, 18, 0.1),
        0 1px 2px -1px rgba(10, 13, 18, 0.1);
    border: 1px solid #1bc01b;
}

@media (max-width: 768px) {
    #selectPackage.bulk-category-tabs [data-tab-trigger] {
        font-size: 14px;
    }

    /* One scrolling row instead of wrapping, so a fourth or fifth category does not add a line.
       The fades sit on the wrapper because the scroller's own pseudo elements would slide away
       with the content; .at-start / .at-end come from the script in content-tabs.php. */
    .bulk-category-tabs-fade {
        position: relative;
    }

    .bulk-category-tabs-fade::before,
    .bulk-category-tabs-fade::after {
        content: "";
        position: absolute;
        top: 1px;
        bottom: 1px;
        width: 40px;
        z-index: 2;
        pointer-events: none;
        opacity: 1;
        transition: opacity 0.2s ease;
    }

    .bulk-category-tabs-fade::before {
        left: 1px;
        border-radius: 9px 0 0 9px;
        background: linear-gradient(90deg, #fafafa 0%, rgba(250, 250, 250, 0) 100%);
    }

    .bulk-category-tabs-fade::after {
        right: 1px;
        width: 70px;
        border-radius: 0 9px 9px 0;
        background: linear-gradient(270deg, #fafafa 0%, rgba(250, 250, 250, 0) 100%);
    }

    .bulk-category-tabs-fade.at-start::before,
    .bulk-category-tabs-fade.at-end::after {
        opacity: 0;
    }

    #selectPackage.bulk-category-tabs {
        margin-bottom: 0;
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 4px;
        scrollbar-width: none;
    }

    #selectPackage.bulk-category-tabs::-webkit-scrollbar {
        display: none;
    }

    #selectPackage.bulk-category-tabs [data-tab-trigger] {
        flex: 0 0 auto;
    }
}

.bulk-category-tabs__count,
.bulk-category-tabs__label {
    font: inherit;
    line-height: 1;
}

.step-body.meals.swiper {
    position: relative;
    padding: 8px 0 20px 0 !important;
    z-index: 50;
    margin-bottom: 22px;
}

@media (min-width: 769px) {
    .step-body.meals.swiper:after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #f7f7f7 78.06%);
        width: 120px;
        height: 310px;
        z-index: 5;
        pointer-events: none;
    }

    /* No fade over the last meal: hide the scroll hint once the swiper reaches the end. */
    .step-body.meals.swiper:has(.swiper-button-next.swiper-button-disabled):after,
    .step-body.meals.swiper:has(.swiper-button-next.swiper-button-lock):after {
        display: none;
    }
}

.step-row.step-visible > .numeric-title,
.step-row.step-visible > .step-body,
.step-row.step-visible > .meals-details {
    visibility: visible;
}

.step-row.step-visible .step-body,
.step-row.step-visible .meals-details {
    display: block;
}

.step-body.meals.swiper {
    overflow: visible !important;
    -webkit-clip-path: inset(-20px 0 -600px 0) !important;
    clip-path: inset(-20px 0 -600px 0) !important;
    z-index: 50 !important;
}

.swiper.meals .swiper-wrapper {
    padding-bottom: 0 !important;
}

.swiper-slide {
    flex-shrink: 0 !important;
    height: auto !important;
    width: 136px;
}

.swiper.meals .swiper-slide {
    width: 160px !important;
    padding: 2px;
    padding-top: 8px;
}

.swiper.meals .swiper-slide .item {
    padding: 16px 0;
    background: #fff;
    border-radius: 16px;
    border: 1px solid #e5e5e5;
    box-shadow:
        0 12px 16px -4px rgba(10, 13, 18, 0.08),
        0 4px 6px -2px rgba(10, 13, 18, 0.03),
        0 2px 2px -1px rgba(10, 13, 18, 0.04);
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    cursor: pointer;
    height: 280px;
}

.swiper.meals:not(:has(.item.active)) .swiper-slide:first-of-type .item,
.swiper.meals .swiper-slide .item.active {
    border: 1px solid #51ab3a;
    outline: 2px solid rgba(27, 192, 27, 0.6);
    background: #fcfffd;
}

.swiper.meals .swiper-slide img {
    max-width: 143px !important;
    width: 143px;
}

.swiper.meals .swiper-slide .item h2 {
    color: #001d00;
    font-family: Inter;
    font-size: 16px;
    font-weight: 600;
    height: 30px;
    text-align: center;
    line-height: 15px;
    display: flex;
    justify-self: center;
    align-items: center;
    margin-bottom: 0;
}

/* A name that runs long ("Protein Chocolate Muffin") comes down a size instead of wrapping past the
   room the card gives it. */
.swiper.meals .swiper-slide .item h2[data-long-title] {
    font-size: 14px;
}

.swiper.meals .swiper-slide .item span.lbl_cooked {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 9px;
    background: #009400;
    border-radius: 4.79346px;
}

.swiper.meals .swiper-slide .item [data-price] {
    color: #009400;
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.swiper.meals .swiper-slide .item [data-price-full] {
    line-height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Inter";
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    text-decoration-line: line-through;
    color: #a3a3a3;
}

.step-body.meals.swiper:not(.discount) .swiper-slide .item [data-price-full] {
    display: none;
}

.swiper.meals .swiper-slide .item .box-button {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: stretch;
    width: 114px;
    height: 34px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    background: #fff;
    overflow: visible;
}

.swiper.meals .swiper-slide .item .box-button button {
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent;
    outline: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s ease;
}

.swiper.meals .swiper-slide .item .box-button button:disabled {
    cursor: default;
    background: transparent;
}

.swiper.meals .swiper-slide .item .box-button p {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #001d00;
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    border-left: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
}

.swiper.meals .swiper-slide .item .box-button:has(button:disabled) p {
    color: #001d00;
}

.swiper.meals .swiper-slide .item .box-button button svg {
    width: 30px;
    height: 30px;
    fill: #006f00;
}

.swiper.meals .swiper-slide .item .box-button button:disabled svg {
    fill: #d0d5dd;
}

.meals-details {
    position: relative;
    z-index: 10 !important;
}

.step-row.step-visible > .numeric-title,
.step-row.step-visible > .step-body,
.step-row.step-visible > .meals-details {
    visibility: visible;
}

.step-row.step-visible .step-body,
.step-row.step-visible .meals-details {
    display: block;
}

.wrapper-meal {
    display: none;
}

.meals-details .wrapper-meal {
    border-radius: 16px;
    background: #fff;
}

.wrapper-meal.active {
    display: block;
}

.bulk-meal-card {
    display: grid;
    grid-template-columns: 1fr 590px;
    gap: 20px;
    border: 1px solid rgba(27, 192, 27, 0.6);
    border-radius: 24px;
    background: #fff;
    padding: 42px 32px;
}

.bulk-meal-card__left {
    display: flex;
    flex-direction: column;
}

.bulk-meal-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 32px;
}

@media (max-width: 768px) {
    .bulk-meal-card {
        grid-template-columns: minmax(0, 1fr);
        padding: 16px;
    }

    .bulk-meal-card__left {
        display: none;
    }

    .step-body.meals.swiper {
        margin-bottom: 0;
    }
}

.bulk-meal-card__top h2 {
    color: #093409;
    font-size: 32px;
    font-weight: 500;
    line-height: 32px;
    margin: 0;
    font-weight: 600;
}

.bulk-meal-card__price {
    color: #009400;
    font-size: 32px;
    font-weight: 600;
    line-height: 65px;
    white-space: nowrap;
    letter-spacing: -2px;
}

.bulk-meal-card__image {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 210px;
    flex-direction: column;
    /* Only sideways: the enlarged image runs past the card on the left and right, and that
       overflow has to be cut without clipping the food off the top or bottom. */
    overflow-x: clip;
}

.bulk-meal-card__image img {
    width: 100%;
    margin: 0 auto;
}

.bulk-meal-card__right {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bulk-meal-macros-top {
    display: grid;
    grid-template-columns: minmax(210px, 3fr) repeat(3, minmax(72px, 1fr));
    border: 1px solid #e5e5e5;
    border-radius: 18px;
    overflow: hidden;
    background: #fcfcfc;
}

.bulk-meal-macros-top__kcal,
.bulk-meal-macros-top__macro {
    min-height: 62px;
    padding: 9px 14px;
}

.bulk-meal-macros-top__kcal {
    display: flex;
    align-items: center;
    gap: 0;
}

.bulk-meal-macros-top__icon--progress {
    position: relative;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bulk-meal-macros-top__icon--progress .circle {
    width: 29px;
    height: 29px;
    transform: rotate(272deg);
}

.bulk-meal-macros-top__icon--progress .circle circle {
    fill: none;
    stroke-width: 4;
    stroke-linecap: round;
}
.bulk-meal-macros-top__icon--progress .circle circle:first-child {
    stroke: #e5e5e5;
}

.bulk-meal-macros-top__icon--progress .circle circle {
    fill: none;
    stroke-width: 4;
    stroke-linecap: round;
}

.bulk-meal-macros-top__icon--progress .circle circle:last-child {
    stroke: #1bc01b;
    stroke-dasharray: 117;
    transition: stroke-dashoffset 0.3s ease;
}

.bulk-meal-macros-top__icon--progress .flash {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 34px;
    height: 34px;
    transform: translate(-50%, -50%);
}

.bulk-meal-macros-top__kcal-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.bulk-meal-macros-top__kcal-text strong {
    color: #009400;
    font-size: 22px;
    font-weight: 600;
    line-height: 1;
}

.bulk-meal-macros-top__kcal-text span {
    color: #6b7280;
    font-size: 12px;
    line-height: 1.2;
}

.bulk-meal-macros-top__kcal,
.bulk-meal-macros-top__macro {
    min-height: 62px;
    padding: 9px 14px;
}

.bulk-meal-macros-top__macro {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border-left: 1px solid #ececec;
    text-align: center;
}

.bulk-meal-macros-top__macro strong {
    color: #009400;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
}

.bulk-meal-macros-top__macro span {
    color: #737373;
    font-size: 12px;
    line-height: 1;
}

.navigation-footer-section {
    display: flex;
    align-items: center;
    gap: 24px;
}

.step-body.meals.swiper .navigation-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 20px;
    position: relative;
    z-index: 6;
}

/* Figma layout: pagination alone on the left, then the Selected Meals button with the arrows
   right after it. The arrows sit inside .navigation-footer-section in the shared markup, so
   `display: contents` promotes that group's children to flex items of the footer and `order`
   places them. Desktop only: the mobile rules below rely on the section being a real box. */
@media (min-width: 769px) {
    .step-body.meals.swiper .navigation-footer .navigation-footer-section {
        display: contents;
    }

    .step-body.meals.swiper .navigation-footer .swiper-pagination {
        order: 1;
    }

    /* The auto margin is what splits the row: pagination stays left, and the button group plus
       the arrows are pushed together against the right edge. Without `flex: 0 0 auto` the
       container stretches and the button drifts to the middle. */
    .step-body.meals.swiper .navigation-footer .tooltip-target-container {
        order: 2;
        flex: 0 0 auto;
        margin-left: auto;
    }

    .step-body.meals.swiper .navigation-footer .navigation-footer-button {
        order: 3;
    }
}

@media (max-width: 768px) {
    .step-body.meals.swiper .navigation-footer {
        flex-direction: column;
    }

    .step-body.meals.swiper .navigation-footer .tooltip-target-container {
        flex-direction: column-reverse;
        width: 100%;
    }

    .navigation-footer-section {
        flex-direction: row-reverse;
        justify-content: space-between;
        width: 100%;
    }

    .bulk-meal-macros-top {
        display: flex;
    }

    .bulk-meal-card__right {
        min-width: 0;
    }

    .bulk-meal-macros-top__kcal-text strong,
    .bulk-meal-macros-top__macro strong {
        font-size: 16px;
        line-height: 18.46px;
    }

    .bulk-meal-macros-top__macro span {
        font-size: 12px;
        line-height: 11.54px;
    }

    .bulk-meal-macros-top__kcal {
        flex: 0 1 auto;
        gap: 5px;
    }

    .bulk-meal-macros-top__macro {
        flex: 1 1 auto;
    }

    .bulk-meal-macros-top__icon--progress {
        width: 24px;
        height: 24px;
        min-width: 24px;
        min-height: 24px;
    }

    .bulk-meal-macros-top__kcal,
    .bulk-meal-macros-top__macro {
        min-height: 52px;
        min-width: 0;
        padding-left: 6px;
        padding-right: 6px;
    }

    .bulk-meal-suggestions {
        grid-template-columns: 1fr !important;
    }

    .bulk-meal-accordion__toggle span {
        font-size: 14px !important;
    }
}

.navigation-footer,
.step-body.meals.swiper .navigation-footer,
.step-body.meals.swiper .swiper-button-prev,
.step-body.meals.swiper .swiper-button-next,
.footer-buttons {
    overflow: visible !important;
}

.step-body.meals.swiper .navigation-footer .swiper-pagination {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: auto !important;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 0;
    padding: 4px 8px;
    text-align: left;
    flex: 0 0 auto;
    padding: 0;
}

.swiper-pagination-bullet {
    width: 16px !important;
    height: 5px !important;
    border-radius: 99px !important;
}

.swiper-pagination-bullet-active {
    background-color: #16a61a !important;
}

@media (max-width: 768px) {
    .step-body.meals.swiper .navigation-footer .swiper-pagination {
        gap: 0;
    }

    .swiper-pagination-bullet {
        width: 10px;
        margin: 0 2px !important;
    }

    .bt_submit {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
        width: 100% !important;
    }
}

.navigation-footer-button {
    display: flex;
    gap: 10px;
}

.step-body.meals.swiper .navigation-footer .swiper-button-prev,
.step-body.meals.swiper .navigation-footer .swiper-button-next {
    position: static !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    width: 48px;
    height: 48px;
    margin: 0;
    border-radius: 999px;
    background: #16a61a;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.step-body.meals.swiper .navigation-footer .swiper-button-prev svg path,
.step-body.meals.swiper .navigation-footer .swiper-button-next svg path {
    stroke: #fff;
}

.step-body.meals.swiper .navigation-footer .swiper-button-prev.swiper-button-disabled,
.step-body.meals.swiper .navigation-footer .swiper-button-next.swiper-button-disabled {
    background-color: #e5e5e5;
    pointer-events: none;
    display: flex !important;
    opacity: 1;
}

.step-body.meals.swiper .navigation-footer .swiper-button-prev.swiper-button-disabled svg path,
.step-body.meals.swiper .navigation-footer .swiper-button-next.swiper-button-disabled svg path {
    stroke: #a3a3a3;
}

.step-body.meals.swiper .navigation-footer .swiper-button-prev svg,
.step-body.meals.swiper .navigation-footer .swiper-button-next svg {
    width: 20px;
    height: 20px;
}

.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after,
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
    display: none;
}
.swiper.meals .swiper-slide:has(.item.disabled) {
    display: none;
}

.desktop {
    display: block;
}

.mobile {
    display: none !important;
}

.tooltip-target {
    position: relative;
    z-index: 20;
}

@media screen and (max-width: 768px) {
    .tooltip-target {
        width: 100%;
    }
}

.step-body.meals.swiper .navigation-footer .tooltip-target-container {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 16px;
}

button {
    padding: 0;
    margin: 0;
    outline: none;
    border: none;
    background: inherit;
    display: flex;
    align-items: center;
}

.bt_bundle {
    display: flex;
    height: 44px;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #009400;
    background: #f7fff8;
    color: #009400 !important;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    text-transform: none;
    position: relative;
}

@media screen and (max-width: 768px) {
    .tooltip-target .bt_bundle {
        width: 100%;
    }
}

.step-body.meals.swiper .navigation-footer .bt_bundle {
    height: 52px;
    padding: 8px 18px;
    border-radius: 10px;
    border: 1px solid #009400;
    background: #f7fff8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
    width: 355px;
}

@media screen and (max-width: 768px) {
    .step-body.meals.swiper .navigation-footer .bt_bundle {
        width: 100%;
    }
}
.step-body.meals.swiper .navigation-footer .bt_bundle .text {
    color: #009400;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
}

.step-body.meals.swiper .navigation-footer .bt_bundle .text {
    color: #009400;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
}

.tooltip_bundle {
    z-index: 9999 !important;
    pointer-events: auto !important;
}

.tooltip-target {
    position: relative;
}
.tooltip-target .bt_bundle {
    position: relative;
    z-index: 3;
}
.tooltip_bundle {
    padding-top: 8px;
    background: #fff;
    width: 320px;
    margin: 0 auto;
    border-radius: 8px;
    position: absolute;
    top: 130%;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 5px 15px #ececec;
    z-index: 2;
    display: none;
}
.tooltip_bundle .bundle-header {
    padding: 4px 16px 8px 16px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #efede8;
    justify-content: space-between;
}
.tooltip_bundle .bundle-header h4 {
    color: #646b68;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    text-transform: uppercase;
}
.tooltip_bundle .bundle-header button {
    color: #51ab3a;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    padding: 0;
    background: transparent;
}

.tooltip_bundle:before {
    content: "";
    position: absolute;
    height: 50px;
    top: -49px;
    left: 0;
    width: 100%;
    display: block;
    z-index: 2;
}
.tooltip_bundle::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent white transparent;
}

.tooltip_bundle .empty {
    display: none;
}
.tooltip_bundle.empty .empty {
    display: inherit;
}
.tooltip_bundle .empty h4 {
    color: #51ab3a;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.tooltip_bundle .empty {
    text-align: center;
    padding: 16px 0;
}
.tooltip_bundle .empty p {
    color: #646b68;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
.tooltip_bundle .bundle-rows {
    border-bottom: 1px solid #efede8;
    padding: 0 0 8px 16px;
    max-height: 264px;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.tooltip_bundle .bundle-rows .bundle-row {
    display: flex;
    align-items: center;
    gap: 11px;
    justify-content: stretch;
}
.tooltip_bundle .bundle-rows .bundle-row .border {
    flex: 1;
    justify-content: space-between;
    padding: 12px 16px 0 4px;
}
.tooltip_bundle .bundle-rows .bundle-row:not(:last-of-type) .border {
    border-bottom: 1px solid #ececec;
    padding-bottom: 12px;
}
.tooltip_bundle .bundle-rows .bundle-row > img {
    max-height: 24px;
}
.tooltip_bundle .bundle-rows .bundle-row .border,
.tooltip_bundle .bundle-rows .bundle-row .controller,
.tooltip_bundle .bundle-rows .bundle-row .box-button {
    display: flex;
    align-items: center;
}
.tooltip_bundle .bundle-rows .bundle-row .border > span {
    color: #646b68;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}
.tooltip_bundle .bundle-rows .bundle-row .box-button,
.tooltip_bundle .bundle-rows .bundle-row .controller {
    gap: 4px;
}
.tooltip_bundle .bundle-rows .bundle-row .controller p {
    color: #131313;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    min-width: 18px;
    text-align: center;
}
.tooltip_bundle .bundle-rows .bundle-row .box-button:not(:has(button)) p {
    color: #51ab3a;
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
}
.tooltip_bundle .bundle-rows .bundle-row .box-button:not(:has(button)) p:after {
    content: "x";
}

.tooltip_bundle button {
    padding: 0 !important;
    background-color: transparent !important;
}
.bundle-totals {
    padding: 16px;
    border-bottom: 1px solid #efede8;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.bundle-totals > div {
    display: flex;
    justify-content: space-between;
}
.bundle-totals > div .column {
    color: #646b68;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}
.bundle-totals > div .column:last-of-type {
    color: #88908d;
}

.bundle-totals > div .column:has(.free) {
    color: #51ab3a;
}
.bundle-totals > div .column .badge {
    color: #fafafa;
    font-size: 10px;
    font-weight: 600;
    line-height: 14px;
    padding: 0 4px;
    border-radius: 2px;
    background: #51ab3a;
    margin-right: 4px;
}
.bundle-totals > div .column:has(.badge) {
    display: flex;
    align-items: center;
}

/* The hyphen in "-$6.85" is a legal break opportunity, and a narrow column takes it, leaving the
   minus alone on the first line and the amount below (seen in Firefox). Keep the figure whole. */
.bundle-totals > div .column .amount {
    white-space: nowrap;
}

.bundle-footer {
    display: flex;
    padding: 8px 16px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    background: #fafafa;
    border-radius: inherit;
}
.bundle-footer .column {
    color: #424644;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    text-transform: uppercase;
}
.bundle-footer .column:last-of-type {
    font-size: 16px;
    line-height: 24px;
    text-transform: none;
}

.tooltip_bundle.empty :is(.bundle-header, .bundle-totals, .bundle-footer) {
    display: none;
}

.tooltip_bundle .bundle-rows .bundle-row .border,
.tooltip_bundle .bundle-rows .bundle-row .controller,
.tooltip_bundle .bundle-rows .bundle-row .box-button {
    display: flex;
    align-items: center;
}

.tooltip_bundle .bundle-rows .bundle-row .box-button,
.tooltip_bundle .bundle-rows .bundle-row .controller {
    gap: 4px;
}

.bulk-meal-card__controller {
    margin-top: auto;
    position: relative;
}

.wrapper-meal .bulk-meal-card .box-button {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: stretch;
    width: 139px;
    height: 43px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
}

.wrapper-meal .bulk-meal-card .box-button button,
.bulk-meal-suggestion-item .box-button button {
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.wrapper-meal .bulk-meal-card .box-button p {
    font-size: 22px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #001d00;
    font-weight: 600;
    border-left: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
}

.bulk-meal-accordions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bulk-meal-accordion {
    border: 1px solid rgba(27, 192, 27, 0.5);
    border-radius: 8px;
    background: rgba(118, 217, 118, 0.02);
    overflow: hidden;
}

.bulk-meal-accordion__toggle {
    width: 100%;
    min-height: 40px;
    padding: 0 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    cursor: pointer;
}

.bulk-meal-accordion__toggle:hover {
    background: transparent;
}

.bulk-meal-accordion__toggle span {
    color: #141414;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    text-transform: none;
}

.bulk-meal-accordion__toggle svg {
    transition: transform 0.25s ease;
}

.bulk-meal-accordion.is-open .bulk-meal-accordion__toggle svg {
    transform: rotate(180deg);
}

.bulk-meal-accordion__content {
    display: none;
    padding: 0 14px 14px;
}

.bulk-meal-accordion.is-open .bulk-meal-accordion__content {
    display: block;
}

.bulk-meal-accordion__content > p {
    color: #525252;
    font-size: 14px !important;
    line-height: 1.5;
    margin: 0;
}

.bulk-meal-storage {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.bulk-meal-storage__badge,
.bulk-meal-reheat-card__badge {
    display: inline-flex;
    align-self: flex-start;
    padding: 6px;
    border-radius: 999px;
    background: #92fb99;
    color: #093409;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.04em;
}

.bulk-meal-storage__group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bulk-meal-storage__head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.bulk-meal-storage__icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bulk-meal-storage__head strong {
    display: block;
    color: #005500;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.1;
}

.bulk-meal-storage__head span {
    display: block;
    color: #737373;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.2;
}

.bulk-meal-storage ul,
.bulk-meal-reheat-card__list {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.bulk-meal-storage li,
.bulk-meal-reheat-card__list li {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    color: #424644;
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 6px;
}

.bulk-meal-storage li svg,
.bulk-meal-reheat-card__list li svg {
    flex-shrink: 0;
    /* Centers the 8px dot on the first text line: (1.5em - 8px) / 2. */
    margin-top: calc(0.75em - 5px);
}

.bulk-meal-reheat {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.bulk-meal-reheat-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bulk-meal-reheat-card__head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.bulk-meal-reheat-card__icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bulk-meal-reheat-card__title-wrap h5 {
    color: #0f7d19;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.1;
    margin: 0;
}

.bulk-meal-reheat-card__title-wrap span {
    color: #6b7280;
    font-size: 12px;
    line-height: 1.2;
}

.bulk-meal-suggestions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.bulk-meal-suggestion-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.bulk-meal-suggestion-item__thumb-wrap {
    position: relative;
    width: 72px;
    flex: 0 0 72px;
}

.bulk-meal-suggestion-item__thumb-wrap img {
    width: 100%;
    height: auto;
    display: block;
}

.bulk-meal-suggestion-item__plus {
    position: absolute;
    top: -4px;
    right: 10px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bulk-meal-suggestion-item__content {
    flex: 1;
    min-width: 0;
}

.bulk-meal-suggestion-item__content h6 {
    color: #2d2d2d;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    margin: 0 0 6px;
}

.bulk-meal-suggestion-item__price {
    display: none;
}

.footer-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 24px;
    align-items: center;
}

@media (max-width: 768px) {
    .footer-buttons {
        flex-direction: column;
    }
}

.footer-buttons button#exitEdition {
    margin: 0 auto 0 0;
}
.footer-buttons .bt_submit {
    flex: 0 0 auto;
}
.footer-buttons .tooltip_bundle {
    bottom: 130%;
    top: initial;
}
.footer-buttons .tooltip_bundle::after {
    top: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #fafafa transparent;
    transform: rotate(180deg);
}
.footer-buttons .tooltip_bundle::before {
    bottom: -49px;
    top: initial;
}

.bt_submit {
    background: linear-gradient(180deg, #2ad12a 0%, #1bc01b 56.94%);
    box-shadow:
        inset -2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 0px 2px 1.7px rgba(255, 255, 255, 0.6);
    border-radius: 8px;
    display: flex;
    height: 52px;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    border: none;
    outline: none;
    position: relative;
    width: 355px;
}

.bt_submit:not(:disabled) svg {
    fill: #fff !important;
}

.bt_submit:hover {
    background: #499a34;
}

.bt_bundle:disabled,
.bt_submit:disabled {
    background: #ececec;
    border: 1px solid #ececec;
}

.bt_submit .text {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    text-transform: none;
}
.bt_bundle:disabled .text,
.bt_submit:disabled .text {
    color: #b7c3bd;
}
.bt_bundle:disabled svg path {
    fill: #b7c3bd;
}
.bt_bundle {
    height: 52px;
    padding: 8px 18px;
    border-radius: 10px;
    border: 1px solid rgb(0, 148, 0) !important;
    background: rgb(247, 255, 248) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
    width: 355px;
}

.step-row.step-visible {
    opacity: 1;
    max-height: 4000px;
    overflow: visible;
    pointer-events: auto;
    transform: translateY(0);
    margin-bottom: 32px;
    transition:
        opacity 0.35s ease,
        transform 0.35s ease,
        max-height 0.45s ease,
        margin 0.35s ease;
}

.step-row.step-visible > .numeric-title,
.step-row.step-visible > .step-body,
.step-row.step-visible > .meals-details {
    visibility: visible;
}

.step-row.step-visible {
    display: block;
}

.step-row.step-visible .step-body,
.step-row.step-visible .meals-details {
    display: block;
}

#bulkPackageStep.bulk-package-locked {
    position: relative;
    border-radius: 16px;
}

#bulkPackageStep.bulk-package-locked::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 30;
    background: rgba(247, 247, 247, 0.75);
    backdrop-filter: blur(1.5px);
    border-radius: 10px;
}

#bulkPackageStep.bulk-package-locked .mps-package-step {
    pointer-events: none;
    user-select: none;
}

button {
    padding: 0;
    margin: 0;
    outline: none;
    border: none;
    background: inherit;
    display: flex;
    align-items: center;
}

button.delete {
    padding: 0;
    background: transparent;
}

#mps_blundle_button_show,
#mps_bundle_button_show,
#mps_cart_bundle .button_hide {
    box-shadow:
        0px 2px 1px 0px rgba(93, 86, 60, 0.02),
        0px 2px 6px 0px rgba(206, 201, 180, 0.14);
    display: flex;
    position: absolute;
    right: 100%;
    top: 24px;
    cursor: pointer;
}

#mps_blundle_button_show,
#mps_bundle_button_show {
    z-index: 998;
    position: fixed;
    left: inherit;
    right: -500px;
    transition: all 1s;
    top: 50%;
    transform: translate(0, -50%);
}

#mps_blundle_button_show,
#mps_bundle_button_show {
    z-index: 998;
    position: fixed;
    left: inherit;
    right: -500px;
    transition: all 1s;
    top: 50%;
    transform: translate(0, -50%);
}

#mps_blundle_button_show,
#mps_bundle_button_show {
    &.view {
        right: 0;
    }
}

#mps_blundle_button_show .before,
#mps_bundle_button_show .before,
#mps_cart_bundle .button_hide .before {
    width: 48px;
    background: #1bc01b;
    border: 1px solid #d6d6d6;
    border-radius: 32px 0px 0px 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#mps_blundle_button_show .before,
#mps_bundle_button_show .before {
    margin-right: -50px;
    transition: all 0.5s;
}

#mps_blundle_button_show .content,
#mps_bundle_button_show .content,
#mps_cart_bundle .button_hide .content {
    padding: 16px 0;
    border-radius: 8px 0px 0px 8px;
    border: 1px solid #d6d6d6;
    background: #f7fff8;
    width: 142px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}

#mps_blundle_button_show .content span,
#mps_bundle_button_show .content span,
#mps_cart_bundle .button_hide .content span {
    font-family: "Inter";
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #2a2a2a;
}

@media (min-width: 769px) {
    #mps_blundle_button_show .count,
    #mps_bundle_button_show .count {
        display: none;
    }
}

#mps_blundle_button_show:hover .before,
#mps_bundle_button_show:hover .before {
    margin-right: 0;
}
#mps_cart_bundle .button_hide .content,
#mps_blundle_button_show:hover .content,
#mps_bundle_button_show:hover .content {
    border-radius: 0;
}

#mps_cart_bundle {
    position: fixed;
    right: 0;
    z-index: 100;
    background: #fff;
    border: 1px solid #ececec;
    border-right: none;
    padding-top: 16px;
    border-radius: 8px 0 0 8px;
    max-width: 300px;
    width: 100%;
    display: flex;
    flex-direction: column;
    transition: all 1s;
    top: 50%;
    transform: translate(0, -50%);
    max-height: 85vh;
}

@media (max-width: 768px) {
    #mps_cart_bundle,
    #mps_blundle_button_show {
        display: none;
    }
}

#mps_cart_bundle .selected_meals {
    overflow-y: auto;
    overflow-x: hidden;
    padding: 12px;
}
#mps_cart_bundle .selected_meals.empty .empty {
    display: inherit;
    text-align: center;
    padding: 16px 0;
}
#mps_cart_bundle .selected_meals.empty .empty h4 {
    color: #51ab3a;
    font-family: Inter;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: 0.1px;
    text-transform: uppercase;
    margin-bottom: 8px;
}
#mps_cart_bundle .selected_meals.empty .empty p {
    color: #646b68;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0.1px;
}

#mps_cart_bundle .footer_container {
    display: flex;
    padding: 0 12px 12px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    /* margin-top: auto; */
}

#mps_cart_bundle .your-selection {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

#mps_cart_bundle .your-selection .the-selection {
    font-family: "Inter";
    font-weight: 600;
    font-size: 15px;
    line-height: 24px;
    color: #525252;
}

#mps_cart_bundle .your-selection .clear-all {
    font-family: "Inter";
    font-weight: 500;
    font-size: 12px;
    line-height: 24px;
    color: #009400;
    cursor: pointer;
}

.page-buttons,
#buttons-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: start;
    align-self: center;
    gap: 15px;
    z-index: 0;
}
#mps_cart_bundle #buttons-wrapper {
    align-self: stretch;
}
.page-buttons button,
#buttons-wrapper button {
    height: 48px;
    border-radius: 5px;
    font-weight: 600;
    font-size: 14px;
    display: flex;
    padding: 0 10px;
    align-items: center;
    justify-content: center;
    min-width: 250px;
    border: none;
    outline: none;
    text-transform: inherit;
    border-radius: 100px;
    color: #fff;
}

#buttons-wrapper #bt_continue_bundle {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 16px;
    gap: 4px;
    height: 52px;
    background: linear-gradient(180deg, #2ad12a 0%, #1bc01b 56.94%);
    box-shadow:
        inset -2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 0px 2px 1.7px rgba(255, 255, 255, 0.6);
    border-radius: 8px;
    width: 100%;
}

#buttons-wrapper #bt_continue_bundle:disabled {
    color: #d9d9d9;
    border-radius: 4px;
    background: #ececec !important;
}

#buttons-wrapper #bt_continue_bundle:disabled .button-icon {
    background-color: #d9d9d9;
}

#mps_cart_bundle .selected_meals.empty .empty h4 {
    color: #51ab3a;
    font-family: Inter;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: 0.1px;
    text-transform: uppercase;
    margin-bottom: 8px;
}
#mps_cart_bundle .row {
    margin: 0;
    padding: 0;
    padding: 0;
    border-bottom: 1px solid #52525220;
}
#mps_cart_bundle .selected_meals .empty,
#mps_cart_bundle .selected_meals.empty .row {
    display: none;
}
#mps_cart_bundle .title {
    font-family: "Inter";
    font-weight: 600;
    font-size: 16px;
    line-height: 1.3em;
    color: #292929;
    margin: 0 0 8px 0;
}
#mps_cart_bundle .row .selection {
    display: flex;
    align-items: stretch;
    gap: 0;
    flex-direction: column;
    gap: 4px;
}
#mps_cart_bundle .mobile-header {
    display: none;
}
#mps_cart_bundle .mobile-header span {
    color: #000 !important;
}
#mps_cart_bundle .button_hide .before svg {
    transform: rotate(180deg);
}

#mps_cart_bundle .bundle-totals {
    margin-top: 22px;
    padding: 22px 0;
    border-top: 1px solid #efede8;
}
#mps_cart_bundle .bundle-totals > div .column {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #525252;
}

#mps_cart_bundle .bundle-totals > div .column span.free,
#mps_cart_bundle .bundle-totals > div .column :has(.free) {
    font-weight: 600;
    color: #009400;
}

@media (min-width: 769px) {
    #mps_cart_bundle.bundle-hide {
        transform: translate(500px, -50%);
    }
    #mps_blundle_button_show .count,
    #mps_bundle_button_show .count {
        display: none;
    }
}
#mps_cart_bundle .row .selection .line {
    display: flex;
    gap: 4px;
    justify-content: space-between;
    padding: 4px 12px 4px 0;
}
#mps_cart_bundle .row .selection .line .meal {
    display: flex;
    gap: 8px;
    flex: 1;
    min-width: 0;
    align-items: center;
}
#mps_cart_bundle .row .selection .line .meal .image {
    margin: 0;
    flex: 0 0 32px;
    display: initial;
}
#mps_cart_bundle .row .selection .line .meal .image img {
    margin-left: 50%;
    transform: translateX(-50%);
    max-width: 130%;
}
#mps_cart_bundle .row .selection .line .meal div:has(.meal-name) {
    flex: 1;
    min-width: 0;
}
#mps_cart_bundle .row .selection .line .meal .meal-name {
    overflow: hidden;
    color: #001d00;
    text-overflow: ellipsis;
    font-family: Inter;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: 0.1px;
    white-space: nowrap;
    margin-bottom: 0;
}
#mps_cart_bundle .row .selection .line .meal .delete-button {
    margin-left: auto;
}
#mps_cart_bundle .row .selection .line .meal .delete-button svg path {
    fill: #f04438;
}
#mps_cart_bundle .row .selection .line .controls:has(button) {
    display: flex;
    align-items: center;
    flex-basis: 64px;
    border: 1px solid #dbdbdb;
    border-radius: 7px;
}
#mps_cart_bundle .row .selection .line .controls:not(:has(button)) {
    display: none;
}
#mps_cart_bundle .row .selection .line .controls .quantity {
    color: #292929;
    text-align: center;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0.1px;
    width: 26px;
    background-color: #f7f7f7;
}
#mps_cart_bundle .row .selection .line .meal .delete-button,
#mps_cart_bundle .row .selection .line .controls button {
    border: none;
    background: transparent;
    width: 20px;
    height: 24px;
    padding: 0;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

#mps_cart_bundle .row .selection .line .controls button.decrease {
    border-right: 1px solid #dbdbdb;
}

#mps_cart_bundle .row .selection .line .controls button.increase {
    border-left: 1px solid #dbdbdb;
}
/*Calculator*/
.mps-training-mode-calculator {
    margin-bottom: 42px;
}

.mps-training-mode-calculator .step-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 32px;
    background-color: #fff;
    border-radius: 12px;
    border: 1px solid #e5e5e5;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .step-body {
        padding: 16px;
    }
}

.mps-training-mode-calculator .calculator-card {
    border: 1px solid #e5e5e5;
    padding: 24px;
    border-radius: 12px;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .calculator-card {
        padding: 24px 14px;
    }
}

.mps-training-mode-calculator .calculator-card h3 {
    font-family: "Inter";
    font-weight: 600;
    font-size: 20px;
    line-height: 28px;
    color: #141414;
    margin-bottom: 16px;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .calculator-card h3 {
        font-size: 18px;
    }
}

.mps-training-mode-calculator .calculator-card .calculation-inputs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .calculator-card .calculation-inputs {
        grid-template-columns: repeat(1, 1fr);
    }
}

.mps-training-mode-calculator .calculation-inputs .calculation-input-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.mps-training-mode-calculator .calculation-inputs .calculation-input-item label {
    font-family: "Inter";
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #292929;
    padding: 0;
    background: transparent;
    border: 0;
    outline: 0;
}

.mps-training-mode-calculator .calculation-inputs .calculation-input-item input,
.mps-training-mode-calculator .calculation-inputs .calculation-input-item select {
    padding: 0 12px;
    height: 40px;
    flex: 0 0 auto;
    background-color: #ffffff;
    border: 1px solid #d6d6d6;
    box-shadow: 0px 1px 2px rgba(10, 13, 18, 0.05);
    border-radius: 8px;
    font-family: "Inter";
    font-weight: 400;
    font-size: 14px;
    color: #141414;
}

.mps-training-mode-calculator .calculator-card.number-of-days h3 {
    text-align: center;
}

.mps-training-mode-calculator .calculator-card.number-of-days p {
    text-align: center;
    font-family: "Inter";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.1px;
    color: #424242;
    margin-bottom: 16px;
}

.mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
}

.mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items label {
    padding: 0;
    background: transparent;
    border: 0;
    outline: 0;
    font-family: "Inter";
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    color: #141414;
    position: relative;
    height: 24px;
    display: flex;
    align-items: center;
    gap: 5px;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items label {
        font-size: 14px;
    }
}

.mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items label input {
    opacity: 0;
    width: 24px;
}

.mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items label b {
    position: absolute;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    border: 2px solid #fff;
    left: 0;
    top: 0;
    background-color: #a3a3a3;
}

.mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items label b:before {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
}

.mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items label input:checked + b {
    border-color: #1bc01b;
    background-color: #fff;
}

.mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items label input:checked + b:before {
    background-color: #1bc01b;
}

.mps-training-mode-calculator .calculator-card.number-of-days .number-of-days--items label input:checked + b:after {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    position: absolute;
    content: "";
    background-color: #fff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.mps-training-mode-calculator .calculator-card.calculator-results {
    background: rgba(247, 255, 248, 0.5);
    border: 1px solid #1bc01b;
    border-radius: 12px;
    padding: 24px;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .calculator-card.calculator-results {
        padding: 12px;
    }
}

.mps-training-mode-calculator .results-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .results-wrapper {
        grid-template-columns: 1fr;
    }
}

.mps-training-mode-calculator .results-wrapper .results-item {
    background: #ffffff;
    border: 1px solid rgba(27, 192, 27, 0.4);
    border-radius: 12px;
    padding: 8px 0;
    display: flex;
    flex-direction: column;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .results-wrapper .results-item:nth-child(1) {
        order: 1;
    }
    .mps-training-mode-calculator .results-wrapper .results-item:nth-child(2) {
        order: 4;
    }
    .mps-training-mode-calculator .results-wrapper .results-item:nth-child(3) {
        order: 2;
    }
    .mps-training-mode-calculator .results-wrapper .results-item:nth-child(4) {
        order: 5;
    }
    .mps-training-mode-calculator .results-wrapper .results-item:nth-child(5) {
        order: 3;
    }
    .mps-training-mode-calculator .results-wrapper .results-item:nth-child(6) {
        order: 6;
    }
}

.mps-training-mode-calculator .results-wrapper .results-item h4 {
    padding: 10px 24px 0;
    font-family: "Inter";
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 29px;
    color: #424242;
    padding-top: 0;
    border-left: 2px solid #1bc01b;
    display: flex;
    align-items: center;
}

.mps-training-mode-calculator .results-wrapper .results-item div {
    font-family: "Inter";
    font-weight: 600;
    font-size: 20px;
    line-height: 20px;
    color: #141414;
    padding: 7px 24px 6px;
}

.mps-training-mode-calculator .results-wrapper .results-item div span {
    font-size: 16px;
}

/* The "what is this" mark beside Basal Metabolic Rate and the note it opens. The mark is the SVG
   itself, so the button adds no border of its own; the note is a span because every div inside
   the item is styled as a result figure. */
.mps-training-mode-calculator .results-wrapper .results-item h4 {
    position: relative;
}

.mps-training-mode-calculator .results-item .mps-result-tip-trigger {
    display: inline-flex;
    width: 16px;
    height: 16px;
    margin-left: 6px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    line-height: 0;
    cursor: pointer;
}

.mps-training-mode-calculator .results-item .mps-result-tip {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 24px;
    right: 24px;
    z-index: 3;
    max-width: 300px;
    padding: 16px 20px;
    border-radius: 8px;
    background: #d2fed5;
    color: #006f00;
    font-family: Inter;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-align: left;
    text-transform: none;
}

.mps-training-mode-calculator .results-item .mps-result-tip.is-open {
    display: block;
}

.mps-training-mode-calculator .results-wrapper .results-item.protein {
    background-image: url(https://mealprepsundayservice.com/wp-content/uploads/2025/01/daily-protein.png);
    background-repeat: no-repeat;
    background-position: right 10px center;
}

.mps-training-mode-calculator .results-wrapper .results-item.carbs {
    background-image: url(https://mealprepsundayservice.com/wp-content/uploads/2025/01/daile-carbs.png);
    background-repeat: no-repeat;
    background-position: right 10px center;
}

.mps-training-mode-calculator .results-wrapper .results-item.vegs {
    background-image: url(https://mealprepsundayservice.com/wp-content/uploads/2025/01/daily-vegetables.png);
    background-repeat: no-repeat;
    background-position: right 10px center;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .results-wrapper .results-item.protein {
        background-image: url(https://mealprepsundayservice.com/wp-content/uploads/2025/01/daily-protein-mobile.png);
    }
    .mps-training-mode-calculator .results-wrapper .results-item.carbs {
        background-image: url(https://mealprepsundayservice.com/wp-content/uploads/2025/01/daile-carbs-mobile.png);
    }
    .mps-training-mode-calculator .results-wrapper .results-item.vegs {
        background-image: url(https://mealprepsundayservice.com/wp-content/uploads/2025/01/daily-vegetables-mobile.png);
    }
}

.package-suggestion {
    font-family: "Inter";
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #005500;
    margin-bottom: 20px;
}

@media screen and (max-width: 768px) {
    .package-suggestion {
        font-size: 13px;
    }
}

.package-suggestion__items {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

@media screen and (max-width: 768px) {
    .package-suggestion__items {
        flex-direction: column;
    }
}

.package-suggestion__items > div {
    border: 1px solid #1bc01b66;
    border-radius: 12px;
    flex-grow: 1;
    flex-shrink: 1;
    padding: 8px 0;
}

.package-suggestion__items > div > div {
    border-left: 2px solid #1bc01b;
    padding-left: 12px;
    font-family: "Inter";
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 28px;
    color: #141414;
}

.package-disclaimer p {
    font-family: "Inter";
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #292929;
    max-width: 750px;
}

@media screen and (max-width: 768px) {
    .package-disclaimer p {
        font-size: 14px;
        line-height: 24px;
    }
}

.package-disclaimer p strong {
    color: #006f00;
}

.calculator-footer {
    text-align: center;
}

.calculator-footer button {
    align-items: center;
    font-family: "Inter";
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #ffffff;
    background: linear-gradient(180deg, #2ad12a 0%, #1bc01b 56.94%);
    box-shadow:
        inset -2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 0px 2px 1.7px rgba(255, 255, 255, 0.6);
    border-radius: 12px;
    text-transform: none;
    width: 310px;
    height: 48px;
    justify-content: center;
    margin: auto;
}

.calculator-footer button:disabled {
    background: linear-gradient(180deg, #bdbdbd 0%, #bacedd 56.94%);
    opacity: 0.5;
    box-shadow:
        inset -2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 2px 0px 2.1px rgba(255, 255, 255, 0.4),
        inset 0px 2px 1.7px rgba(255, 255, 255, 0.6);
    border-radius: 12px;
}

@media screen and (max-width: 768px) {
    .calculator-footer button {
        width: 100%;
    }
}

.calculator-footer button:not(:disabled):hover {
    color: #fff;
    background: linear-gradient(0deg, #2ad12a 0%, #1bc01b 100%);
}
/*End calculator*/

.calculator-card.calculator-results:not(.active) {
    position: relative;
}

.calculator-card.calculator-results:not(.active):before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 99;
    background: rgba(247, 247, 247, 0.75);
    border-radius: 10px;
}

.calculator-card.calculator-results:not(.active) .results-wrapper .results-item,
.package-suggestion__items > div {
    position: relative;
}

.calculator-card.calculator-results:not(.active) .results-wrapper .results-item:before,
.calculator-card.calculator-results:not(.active) .package-suggestion__items > div:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 98;
    backdrop-filter: blur(4.5px);
}

.subtitle-training-mode:not(.active) {
    display: none;
}

.subtitle-training-mode {
    font-family: "Inter";
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.1px;
    color: #424242;
}

.subtitle-training-mode strong {
    font-weight: 700;
    color: #009400;
}

#bulkMealsStep {
    margin-bottom: 42px;
}
/* ==========================================================================
   Select type — first step of the ordering flow (page-select-type.php)
   ========================================================================== */

.select-type-wrapper {
    box-sizing: border-box;
    max-width: 1100px;
    margin: 0 auto;
    padding: 32px 16px 64px;
}

.select-type-header {
    text-align: center;
    margin-bottom: 50px;
}

.select-type-header h1 {
    margin: 0 0 8px;
    color: #141414;
    font-family: "Inter", sans-serif;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.2;
}

.select-type-header p {
    margin: 0;
    color: #424242;
    font-family: "Inter", sans-serif;
    font-size: 18px;
    line-height: 1.5;
}

.select-type-wrapper .selection-type--cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    align-items: stretch;
}

/* Column, so the button sits at the bottom whatever the copy length: the two cards keep the same
   height and their Select buttons line up. */
.select-type-wrapper .selection-type--cards > div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 24px;
    padding: 24px;
    border: 1px solid #e5e5e5;
    border-radius: 16px;
    background: #fff;
    box-shadow:
        0 4px 6px -1px rgba(10, 13, 18, 0.1),
        0 2px 4px -2px rgba(10, 13, 18, 0.06);
}

.select-type-wrapper .selection-type--copy {
    position: relative;
    min-height: 0;
}

/* Top right, out of the text flow, so a longer copy never pushes it around. */
.select-type-wrapper .selection-type--copy img {
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
    height: auto;
}

.select-type-wrapper .selection-type--copy h3 {
    margin: 0 0 8px;
    padding-right: 130px;
    color: #141414;
    font-family: "Inter", sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
}

.select-type-wrapper .selection-type--copy p {
    margin: 0;
    max-width: 42ch;
    color: #424242;
    font-family: "Inter", sans-serif;
    font-size: 16px;
    line-height: 1.5;
}

.select-type-wrapper .selection-type--cards button {
    width: 100%;
    padding: 14px 24px;
    border: 0;
    border-radius: 8px;
    background: #00b82b;
    color: #fff;
    cursor: pointer;
    font-family: "Inter", sans-serif;
    font-size: 18px;
    font-weight: 600;
}

.select-type-wrapper .selection-type--cards button:hover {
    background: #00a527;
}

/* Revealed by select-type.js when Training Mode is chosen. */
.select-type-wrapper .mps-training-mode-calculator {
    display: none;
    margin-top: 32px;
}

.select-type-wrapper .mps-training-mode-calculator.active {
    display: block;
}

@media (max-width: 768px) {
    .select-type-wrapper {
        padding: 24px 16px 48px;
    }

    .select-type-header {
        margin-bottom: 30px;
    }

    .select-type-header h1 {
        font-size: 28px;
    }

    .select-type-header p {
        font-size: 16px;
    }

    .select-type-wrapper .selection-type--cards {
        grid-template-columns: minmax(0, 1fr);
    }

    .select-type-wrapper .selection-type--copy img {
        width: 96px;
        right: -30px !important;
    }

    .select-type-wrapper .selection-type--copy h3 {
        padding-right: 106px;
        font-size: 22px;
    }
}

/* ==========================================================================
   Training mode — three screens inside the Select meals step
   ==========================================================================
   The flow is the same at every width: metrics, then targets, then the meals. Only the look of the
   cards differs, and that comes from the rules content-tell-goals.php already has above. */

/* Everything else on the page waits until the meals screen.
   Escondido só enquanto a tela não é a das meals, em vez de esconder e depois restaurar: `revert`
   devolveria o valor do navegador e trocaria por `block` todo elemento que o tema define como
   `flex` ou `grid`, quebrando o layout justamente ao chegar nas meals. Sem restauração, cada um
   mantém o próprio display. */
.select-meals-wrapper.is-training-mode .select-meals-wrapper-content:not(.meals-visible) > :not(.mps-training-mode) {
    display: none;
}

.mps-training-mode[data-screen="meals"] {
    display: none;
}

.mps-training-mode {
    box-sizing: border-box;
    padding: 32px 16px 48px;
}

.mps-training-mode__header {
    text-align: center;
    margin-bottom: 28px;
}

.mps-training-mode__header h1 {
    margin: 0 0 8px;
    color: #141414;
    font-family: "Inter", sans-serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.2;
}

.mps-training-mode__header p {
    margin: 0 auto;
    max-width: 46ch;
    color: #424242;
    font-family: "Inter", sans-serif;
    font-size: 16px;
    line-height: 1.45;
}

/* Screen one: metrics. The results card and the component's own footer button stay out; the flow
   is driven by the buttons below instead. */
.mps-training-mode[data-screen="metrics"] .calculator-card.calculator-results,
.mps-training-mode[data-screen="metrics"] .mps-training-mode__actions,
.mps-training-mode .calculator-footer {
    display: none;
}

/* Screen two: targets. */
body:has(.mps-training-mode:not([data-screen="meals"])) #mps_blundle_button_show,
body:has(.mps-training-mode:not([data-screen="meals"])) #mps_cart_bundle {
    display: none;
}

.mps-training-mode[data-screen="results"] .calculator-card:not(.calculator-results),
.mps-training-mode[data-screen="results"] .mps-training-mode__header,
.mps-training-mode[data-screen="results"] .mps-training-mode__submit,
.mps-training-mode[data-screen="results"] .mps-training-mode__privacy {
    display: none;
}

/* Os dois botões primários do fluxo compartilham o tratamento: gradiente, borda e as três luzes
   internas. Separados, viravam dois verdes diferentes na mesma jornada. */
.mps-training-mode__submit,
.mps-training-mode__next {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    height: 48px;
    padding: 8px 16px;
    border: 1px solid #25b425;
    border-radius: 12px;
    background: linear-gradient(180deg, #2ad12a 0%, #1bc01b 56.94%);
    box-shadow:
        -2px 0 2.1px 0 rgba(255, 255, 255, 0.4) inset,
        2px 0 2.1px 0 rgba(255, 255, 255, 0.4) inset,
        0 2px 1.7px 0 rgba(255, 255, 255, 0.6) inset;
    color: #fff;
    cursor: pointer;
    font-family: "Inter", sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: none;
}

.mps-training-mode__submit {
    width: 100%;
    max-width: 260px;
    margin: 28px auto 0;
}

.mps-training-mode__next {
    flex: 1 1 auto;
}

.mps-training-mode__privacy {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 16px auto 0;
    max-width: 680px;
    color: #424242;
    font-family: "Inter", sans-serif;
    font-size: 15px;
    line-height: 1.4;
}

.mps-training-mode__privacy svg {
    flex: 0 0 auto;
}

.mps-training-mode__privacy strong {
    color: #00b82b;
}

/* Below the targets, never beside them. */
.mps-training-mode__actions {
    display: flex;
    gap: 12px;
    margin: 24px auto 0;
    max-width: 680px;
}

.mps-training-mode__back {
    flex: 0 0 auto;
    box-sizing: border-box;
    height: 48px;
    padding: 8px 32px;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    background: #fff;
    color: #141414;
    cursor: pointer;
    font-family: "Inter", sans-serif;
    font-size: 17px;
    font-weight: 600;
    text-transform: none;
}

@media (max-width: 768px) {
    .mps-training-mode {
        padding: 24px 16px 48px;
    }

    .mps-training-mode__header h1 {
        font-size: 28px;
    }

    /* The card chrome belongs to the desktop page; on the phone the fields stand on the page. */
    .mps-training-mode .calculator-card:not(.calculator-results) {
        padding: 0;
        border: 0;
        background: none;
    }

    .mps-training-mode .calculator-card:not(.calculator-results) > h3 {
        text-align: center;
    }

    .mps-training-mode__back {
        padding: 8px 24px;
    }

    /* No celular a ordem é Gender, Activity Level, Weight, Your Goal. O componente é compartilhado
       e no desktop as duas colunas leem Gender/Weight e Activity/Goal, então a ordem do DOM fica
       como está e só a exibição do celular troca os dois do meio. */
    .mps-training-mode .calculation-inputs .calculation-input-item:nth-child(2) {
        order: 3;
    }

    .mps-training-mode .calculation-inputs .calculation-input-item:nth-child(3) {
        order: 2;
    }

    .mps-training-mode .number-of-days--items {
        display: flex;
        justify-content: center;
        gap: 20px;
    }
}

/* O gradiente e as luzes internas precisam sair juntos, senão o botão desabilitado continua com
   relevo de botão clicável. */
.mps-training-mode__submit:disabled {
    border-color: #d4d4d4;
    background: #d4d4d4;
    box-shadow: none;
    cursor: not-allowed;
}

/* Fora do fluxo: dentro do grid de 2 colunas, uma mensagem que ocupa altura empurra a linha de
   baixo a cada tecla digitada. Como popover ela avisa sem mover nada. */
.mps-training-mode-calculator .calculation-inputs .calculation-input-item {
    position: relative;
}

.mps-training-mode-calculator .calculation-input-item .calculation-input-error {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 5;
    margin: 6px 0 0;
    padding: 8px 10px;
    max-width: 100%;
    background: #fff;
    border: 1px solid #f0c4c0;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(10, 13, 18, 0.12);
    font-family: "Inter";
    font-weight: 400;
    font-size: 13px;
    line-height: 18px;
    color: #d92d20;
}

.mps-training-mode-calculator .calculation-input-item .calculation-input-error::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 14px;
    width: 8px;
    height: 8px;
    background: #fff;
    border-left: 1px solid #f0c4c0;
    border-top: 1px solid #f0c4c0;
    transform: rotate(45deg);
}

.mps-training-mode-calculator .calculation-inputs .calculation-input-item input[aria-invalid="true"] {
    border-color: #d92d20;
}

.mps-training-mode-calculator .calculation-input-error[hidden] {
    display: none;
}

/* No celular o card e' de coluna unica e o peso e' o ultimo campo, entao o popover cairia por cima
   do titulo do card seguinte. Aqui ele volta ao fluxo: empurrar uma coluna unica nao desalinha
   nada, e nao ha linha ao lado para deslocar. */
@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .calculation-input-item .calculation-input-error {
        position: static;
        margin: 4px 0 0;
        padding: 0;
        font-size: 12px;
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .mps-training-mode-calculator .calculation-input-item .calculation-input-error::before {
        content: none;
    }
}

/* O peso acompanha o nome sem competir com ele: mesmo tamanho, peso normal. */
.bulk-meal-card__top h2 .bulk-meal-card__unit {
    font-weight: 400;
}

/* The line has a short wording for narrow screens; only one of the two is ever shown. The rule for
   the phone is written with the calculator in front of it so it wins wherever these sheets place
   their mobile blocks. */
.package-suggestion .on-narrow {
    display: none;
}

@media screen and (max-width: 768px) {
    .mps-training-mode-calculator .package-suggestion .on-wide {
        display: none;
    }

    .mps-training-mode-calculator .package-suggestion .on-narrow {
        display: inline;
    }
}

/* Breakfast panel, the same one the My Account grid carries: this page loads its own sheet, so the
   rules travel with it. */
/* Breakfast panel: what the plan still asks for in the morning, above the grid's own bar. The
   message on the left, the count on the right. */
.bulk-breakfast-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin: 20px 0 15px 0;
    padding: 16px 20px;
    border: 1px solid #1bc01b;
    border-radius: 16px;
    background: #ffffff;
}

.bulk-breakfast-panel[hidden] {
    display: none;
}

/* The mark stands beside the heading, and the copy runs under the heading rather than under the
   mark: inside the heading it was the copy that lined up with the icon. */
.bulk-breakfast-panel__message {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.bulk-breakfast-panel__message > svg {
    flex: 0 0 auto;
}

.bulk-breakfast-panel__message h3 {
    color: #093409;
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 32px;
    margin: 0 0 4px;
}

.bulk-breakfast-panel__message p {
    margin: 0;
    color: #0f0f0f;
    font-family: Inter;
    font-size: 14px;
    font-weight: 500;
    opacity: 0.8;
    line-height: 22px;
}

.bulk-breakfast-panel__message strong {
    font-weight: 600;
}

.bulk-breakfast-panel__progress {
    flex: 0 0 auto;
    width: 300px;
}

/* The cutlery stands beside the count AND the bar, so it sits outside the two of them. */
.bulk-breakfast-panel__meter {
    display: flex;
    align-items: center;
    gap: 10px;
}

.bulk-breakfast-panel__meter > div {
    flex: 1;
}

.bulk-breakfast-panel__meter > svg {
    flex: 0 0 auto;
}

.bulk-breakfast-panel__total {
    color: #0f0f0f;
    font-family: Inter;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

/* The figures and the "of" between them are one green phrase. */
.bulk-breakfast-panel__total strong {
    color: #009400;
    font-weight: 700;
}

/* The bar reads as the count above it: it fills as the morning is covered. */
.bulk-breakfast-panel__bar {
    height: 8px;
    margin: 6px 0 0;
    border-radius: 999px;
    background: rgba(0, 148, 0, 0.2);
    overflow: hidden;
}

.bulk-breakfast-panel__bar span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: 999px;
    background: #1bc01b;
    transition: width 0.25s ease;
}

.bulk-breakfast-panel__counts {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}

.bulk-breakfast-panel__count {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    padding: 8px;
    border: 1px solid #009400;
    border-radius: 8px;
    color: #093409;
    font-family: Inter;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    white-space: nowrap;
}

.bulk-breakfast-panel__count svg {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
}

.bulk-breakfast-panel__count strong {
    font-weight: 700;
}

@media (max-width: 767px) {
    /* Stacked on a phone, where the message and the count have no room side by side. */
    .bulk-breakfast-panel {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding: 16px;
    }

    .bulk-breakfast-panel__message h3 {
        font-size: 16px;
        line-height: 22px;
    }

    .bulk-breakfast-panel__message p {
        font-size: 12px;
        line-height: 18px;
    }

    .bulk-breakfast-panel__progress {
        width: auto;
    }

    .bulk-breakfast-panel__count {
        font-size: 12px;
        padding: 8px;
    }
}

/* The Breakfast mark on the cards, the same one the My Account grid carries. */
/* The breakfast mark sits above the photo, on its own line. The line is there on every card, marked
   or not, so a grid that mixes the two keeps one height. */
.swiper.meals .swiper-slide .item .item-header {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: auto;
    position: relative;
    left: 25px;
    min-height: 5px;
}

.swiper.meals .swiper-slide .item span.lbl_breakfast {
    padding: 0 8px;
    border-radius: 4.793px;
    border: 1px solid rgba(0, 148, 0, 0.4);
    background: var(--Brand-Green-25, #f7fff8);
    color: var(--Brand-Green-600, #009400);
    text-align: center;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}


/* The spinner the ordering buttons show while the next page is built, as the rest of the flow uses
   it. A disabled card keeps its colour: the click was taken, it is not unavailable. */
#loadingUpsell {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-left: 8px;
    border: 3px solid #ffffff;
    border-top: 3px solid transparent;
    border-radius: 50%;
    animation: spinUpsell 0.7s linear infinite;
}

@keyframes spinUpsell {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* While the next page is built the card reads as taken: the button greys out and shows the spinner,
   instead of staying green as if it were still waiting for the click. */
.select-type-wrapper .selection-type--cards button:disabled {
    background: #e5e5e5;
    color: #8b8b8b;
    cursor: progress;
    opacity: 1;
}

.select-type-wrapper .selection-type--cards button:disabled #loadingUpsell {
    border-color: #8b8b8b;
    border-top-color: transparent;
}

.bulk-qty-meals-selected .line-meals[data-meals="19"] > div > div.mps-tooltip,
.bulk-qty-meals-selected .line-meals > div > div.mps-tooltip.qty-last {
    left: auto !important;
    right: 0 !important;
    transform: none !important;
}

.bulk-qty-meals-selected .line-meals[data-meals="19"] > div > div.mps-tooltip:after,
.bulk-qty-meals-selected .line-meals > div > div.mps-tooltip.qty-last:after {
    left: auto;
    right: 4px;
}

.bulk-qty-meals-selected .line-meals[data-meals="1"] > div > div.mps-tooltip,
.bulk-qty-meals-selected .line-meals[data-meals="2"] > div > div.mps-tooltip,
.bulk-qty-meals-selected .line-meals[data-meals="3"] > div > div.mps-tooltip,
.bulk-qty-meals-selected .line-meals[data-meals="4"] > div > div.mps-tooltip,
.bulk-qty-meals-selected .line-meals[data-meals="5"] > div > div.mps-tooltip {
    left: 0 !important;
    right: auto !important;
    transform: none !important;
}

.bulk-qty-meals-selected .line-meals[data-meals="1"] > div > div.mps-tooltip:after,
.bulk-qty-meals-selected .line-meals[data-meals="2"] > div > div.mps-tooltip:after,
.bulk-qty-meals-selected .line-meals[data-meals="3"] > div > div.mps-tooltip:after,
.bulk-qty-meals-selected .line-meals[data-meals="4"] > div > div.mps-tooltip:after,
.bulk-qty-meals-selected .line-meals[data-meals="5"] > div > div.mps-tooltip:after {
    left: 4px;
    right: auto;
}

/* Training Mode: a "+" the plan has already filled. Drawn like the disabled one on the card, but
   it is not disabled, so the click still arrives and opens the explanation. */
#mps_cart_bundle .row .selection .line .controls button:disabled,
#mps_cart_bundle .row .selection .line .controls button.is-full {
    color: #d0d5dd;
    cursor: default;
}

.tooltip_bundle .bundle-rows .bundle-row .box-button button.is-full {
    cursor: default;
}

.tooltip_bundle .bundle-rows .bundle-row .box-button button.is-full svg path {
    fill: #d0d5dd;
}

/* Why the plan takes no more meals. Above the selection tooltip, which sits at 9999. */
.mps-training-full-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(0, 0, 0, 0.25);
}

.mps-training-full-modal[hidden] {
    display: none;
}

.mps-training-full-modal__box {
    width: 100%;
    max-width: 440px;
    padding: 32px 24px 24px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 3px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(206, 201, 180, 0.15);
    text-align: center;
}

.mps-training-full-modal__box h4 {
    margin: 0 0 12px;
    color: #424644;
    font-family: Inter;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
}

.mps-training-full-modal__box p {
    margin: 0 0 12px;
    color: #424644;
    font-family: Inter;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.mps-training-full-modal__box button {
    display: block;
    width: 100%;
    height: 48px;
    margin-top: 12px;
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    background: linear-gradient(180deg, #2ad12a 0%, #1bc01b 56.94%);
    color: #fff;
    font-family: Inter;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    text-transform: none;
    cursor: pointer;
}

.mps-training-full-modal__box button:hover {
    background: #499a34;
}

/* Pre-cooked weight and nutrition boxes, same look as the grams/ounces row on the regular meals. */
.bulk-meal-weight-row,
.bulk-meal-nutrition-row {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 8px;
    flex-wrap: wrap;
}

.bulk-meal-weight-row div,
.bulk-meal-nutrition-row div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 14px 8px;
    flex: 0 1 calc(20% - 4px);
    min-width: 90px;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    background: #fcfcfc;
}

.bulk-meal-weight-row div strong,
.bulk-meal-nutrition-row div strong {
    font-weight: 600;
    font-size: 14px;
    line-height: 14px;
    color: #009400;
}

.bulk-meal-weight-row div span,
.bulk-meal-nutrition-row div span {
    font-weight: 600;
    font-size: 10px;
    line-height: 10px;
    color: #093409;
}

/* The nutrition boxes come two per line, so value and label have room to be read. */
.bulk-meal-nutrition-row div strong {
    font-size: 15px;
    line-height: 15px;
}

.bulk-meal-nutrition-row div span {
    font-size: 12px;
    line-height: 12px;
}