/* 正确引入自定义字体 */

@font-face {

    font-family: 'customFont';

    src: url('../fonts/alata.ttf') format('truetype');

    font-weight: 300;

    /* 如果这是常规字重 */

    font-style: normal;

    /* 如果这是正常样式 */

    font-display: swap;

    /* 确保文本在字体加载期间可见 */

}

.flex {
    display: flex;
}

/*  center auto */
.flexc1 {
    display: flex;
    justify-content: center;
}

/* auto center */
.flexc2 {
    display: flex;
    align-items: center;
}

/*  center center */
.flexcc {
    display: flex;
    justify-content: center;
    align-items: center;
}

.flex-between {
    justify-content: space-between;
}

.flex-around {
    justify-content: space-around;
}

.flex-column {
    display: flex;
    flex-flow: column;
}

.flex-start {
    justify-content: flex-start;
}

.shrink {
    flex-shrink: 0;
}

.addCloseIcon {
    width: 25px;
    height: 25px;
    transition: transform 0.5s ease, opacity 0.3s ease;
}

.addCloseIcon.rotated {
    /* 旋转 45 度 */
}

.history-timeline,
.wellness-form-section,
.patterns-grid,
.symptom-grid {
    max-height: 5000px;
    /* 确保够大 */
    overflow: hidden;
    transition: max-height 1s ease, opacity 1s ease;
    opacity: 1;
}

.history-timeline.collapsed,
.wellness-form-section.collapsed,
.patterns-grid.collapsed,
.symptom-grid.collapsed {
    max-height: 0;
    opacity: 0;
    padding: 0;
}

.addCloseIcon {
    width: 25px;
    height: 25px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    transition: background-image 0.3s ease;
    /* 平滑过渡 */
    cursor: pointer;
}

/* 默认加号图标 */


/* 展开/收起内容动画 */
.history-timeline,
.wellness-form-section {
    max-height: 5000px;
    /* 确保足够大 */
    overflow: hidden;
    transition: max-height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
    opacity: 1;
}

.history-timeline.collapsed,
.wellness-form-section.collapsed {
    max-height: 0;
    opacity: 0;
    padding: 0;
}



/* 定义全局样式变量 */

:root {

    --font-main: 'customFont', -apple-system, BlinkMacSystemFont, sans-serif;

    --primary-gradient: #F57683;
    --light: #FDEDEE;
    --purple: #e7e4ee;

}



/* 应用字体 */

body {

    font-family: var(--font-main);

}



html {

    font-family: 'customFont';

}



.btn {

    background: #F57683;

}



/* header */

.e-con-inner {

    display: flex;

    justify-content: space-between;

    width: 100%;

    max-width: min(100%, 1940px);

    margin: 0 auto;

    font-size: 16px;

    font-weight: 400;

    align-self: auto;

    flex-basis: auto;

    flex-grow: 1;

    flex-shrink: 1;

    align-items: center;
    z-index: 9;

}



.leftlogo {

    position: relative;

}



.leftlogo img {

    width: 148px;

    border: none;

    border-radius: 0;

    box-shadow: none;

    height: auto;

    max-width: 100%;

}



.rightnav {

    margin: 0px 0px 0 100px;

    max-width: 100%;

    gap: 20;

    display: flex;

    justify-content: initial;

    flex-wrap: initial;



}



.elementor-nav-menu--main {

    display: flex;



}



.elementor-nav-menu {

    display: flex;

    flex-wrap: wrap;

    line-height: normal;

    list-style: none;

    margin: 0;

    padding: 0;

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

    position: relative;

    z-index: 2;

}



.elementor-nav-menu>li {

    display: flex;

    border-width: 0;

    position: relative;

}



header .elementor-nav-menu>li a {

    padding: 13px 20px;

    font-size: 16px;

    font-weight: 400;

    color: #010102;

    flex-grow: 1;

    white-space: nowrap;

    box-shadow: none;

    text-decoration: none;

    letter-spacing: -0.113px;

}



header .elementor-nav-menu>li a:hover,

header .elementor-nav-menu>li a:active {

    color: #F4A6AE;

}



.elementor-menu-toggle {

    display: none;

    margin: 0 auto;

    background-color: #fff;

    color: #33373d;

    border-radius: 3px;

    cursor: pointer;

    padding: .25em;

}



.elementor-menu-toggle .e-font-icon-svg {

    fill: #33373d;

    height: 1em;

    width: 1em;

}



.elementor-nav-menu--dropdown {

    background-color: #fff;

    animation: hide-scroll .3s backwards;

    transform: scaleY(1);

    overflow-y: hidden;

    overflow-x: hidden;

    overflow-y: auto;

    transform-origin: top;

    transition: max-height .3s, transform .3s;

    display: none;

    position: absolute;

    z-index: 9997;

}



.elementor-nav-menu--dropdown .elementor-nav-menu {

    flex-direction: column;

}



header .elementor-nav-menu>li a {

    justify-content: center;

}



.menu-item {

    list-style: none !important;

}

.menu-item-has-children .sub-menu {

    display: none;

    position: absolute;

    top: 100%;

    left: 0;

    background: #F8F9FF;

    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);

    min-width: 200px;

    z-index: 1000;

    padding: 10px 0;

    border-radius: 5px;

}

@keyframes hide-scroll {



    0%,

    to {

        overflow: hidden;

    }

}



#go,

#clear {

    width: calc(16.66% - 5.334px);

}



.sub-con-inner {

    display: flex;

    justify-content: center;

    align-items: center;

    flex-wrap: wrap;

    width: 100%;

}



.sub-item {

    width: 55px;

    margin-inline-end: -16px;

}



.sub-item img {

    width: 833px;

    max-width: 100%;

    /* filter: brightness(100%) contrast(100%) saturate(100%) blur(0px) hue-rotate(0deg); */

    border-style: solid;

    border-width: 2px 2px 2px 2px;

    border-color: #FCEDEE;

    border-radius: 50px 50px 50px 50px;

    display: inline-block;

    vertical-align: middle;

}



.xbtn {

    font-weight: 400;

    font-size: 11px;

    color: #374151;

}



.input.red {

    border-color: #ff0000
}



@media (max-width: 980px) {

    .e-con-inner {

        background: #f8f9ff;

    }

    .elementor-nav-menu--dropdown .elementor-nav-menu li {

        width: 100%;

    }





    .btnflex {

        width: 100%;

    }



    #btnExample1 {

        margin-bottom: 10px;

    }



    #go,

    #clear,

    #btnPlanPdf,

    #btnShopPdf,

    #mpGo,

    #mpRefreshPlan {

        width: calc(50% - 4px);

    }



    .input {

        flex: auto;

        width: calc(50% - 4px);

    }



    #mpWeeks,

    #mpDays,

    #mpCalories,

    #mpDietbox,

    #mpCuisine,

    #mpExclude {

        max-width: none;

        min-width: 0;

        width: 32.33%;

        flex: auto;

    }



    .header {

        flex-direction: column;

    }



    .metaRow {

        flex-direction: column;

    }



    .btnrow {

        flex-direction: row;

    }



    .elementor-element {

        flex-direction: column;

    }



    .footer {

        padding: 25px 20px;

    }



    .elementor-item {

        padding: 0;

        font-size: 13px;

        margin: 0 15px;

    }



    .alltitle {

        font-size: 36px;

        text-align: center;

    }



    .menu-item:first-child .elementor-item {

        margin-left: 0;

    }



    .menu-item:last-child .elementor-item {

        margin-right: 0;

    }



    .btndownload {

        width: 100%;

    }



    .actions,

    .search,

    .tags,

    .dayPager {

        justify-content: center;

        text-align: center;

    }



    .brand {

        padding-top: 100px;

    }



    .brand .sub {

        width: 100%;

        text-align: center;

    }



    .mealplan-title {

        font-size: 19px;

    }



    .input {

        font-size: 12px;

    }



    #mpForm .tiny {

        font-size: 12px;

        width: 100%;

    }



    .mt10 {

        margin-top: 10px;

    }



    .drightBtn {

        gap: 10px;

    }



    .e-con-inner {

        position: fixed;

        top: 0;

        left: 0;

        width: 100%;

        box-sizing: border-box;

    }



    .elementor-nav-menu--main {

        display: none;

    }



    .elementor-menu-toggle {

        display: block;

        margin: 38px 20px 20px 0;

    }



    .elementor-menu-toggle__icon--close {

        display: none;

    }



    header .elementor-nav-menu>li a {

        margin: 0;

    }



    header .elementor-nav-menu>li a:hover,

    header .elementor-nav-menu>li a:active {

        background-color: #3f444b;

        color: #fff;

    }



    .sub-con-inner {

        padding-top: 10px;

    }



    .sub-item {

        width: 40px;

    }



    .sub {

        margin: 20px;

    }

}



/* header end */