/*---------------------------------------------------------------------*/
/*  LOADER - COOKING
/*---------------------------------------------------------------------*/
.loaded .loader{
    display: none !important;
}
.loader {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100dvh;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    background: #ffa41f;
    z-index: 2147483647;
}
.loader h4 {
    position: relative;
    margin: 0 auto;
    top: 20vh;
    width: 100vw;
    text-align: center;
    font-size: 6vh;
    color: #333;
    opacity: .75;
    animation: pulse 2.5s linear infinite;
}

#cooking {
    position: relative;
    margin: 0 auto;
    top: 5vh;
    width: 60vh;
    height: 60vh;
    overflow: hidden;
}
#cooking .bubble {
    position: absolute;
    border-radius: 100%;
    box-shadow: 0 0 0.25vh #4d4d4d;
    opacity: 0;
}
#cooking .bubble:nth-child(1) {
    margin-top: 2.5vh;
    left: 58%;
    width: 2.5vh;
    height: 2.5vh;
    background-color: #454545;
    animation: bubble 2s cubic-bezier(0.53, 0.16, 0.39, 0.96) infinite;
}
#cooking .bubble:nth-child(2) {
    margin-top: 3vh;
    left: 52%;
    width: 2vh;
    height: 2vh;
    background-color: #3d3d3d;
    animation: bubble 2s ease-in-out .35s infinite;
}
#cooking .bubble:nth-child(3) {
    margin-top: 1.8vh;
    left: 50%;
    width: 1.5vh;
    height: 1.5vh;
    background-color: #333;
    animation: bubble 1.5s cubic-bezier(0.53, 0.16, 0.39, 0.96) 0.55s infinite;
}
#cooking .bubble:nth-child(4) {
    margin-top: 2.7vh;
    left: 56%;
    width: 1.2vh;
    height: 1.2vh;
    background-color: #2b2b2b;
    animation: bubble 1.8s cubic-bezier(0.53, 0.16, 0.39, 0.96) 0.9s infinite;
}
#cooking .bubble:nth-child(5) {
    margin-top: 2.7vh;
    left: 63%;
    width: 1.1vh;
    height: 1.1vh;
    background-color: #242424;
    animation: bubble 1.6s ease-in-out 1s infinite;
}
#cooking #area {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50%;
    height: 50%;
    background-color: transparent;
    transform-origin: 15% 60%;
    animation: flip 2.1s ease-in-out infinite;
}
#cooking #area #sides {
    position: absolute;
    width: 100%;
    height: 100%;
    transform-origin: 15% 60%;
    animation: switchSide 2.1s ease-in-out infinite;
}
#cooking #area #sides #handle {
    position: absolute;
    bottom: 18%;
    right: 80%;
    width: 35%;
    height: 20%;
    background-color: transparent;
    border-top: 1vh solid #333;
    border-left: 1vh solid transparent;
    border-radius: 100%;
    transform: rotate(20deg) rotateX(0deg) scale(1.3, 0.9);
}
#cooking #area #sides #pan {
    position: absolute;
    bottom: 20%;
    right: 30%;
    width: 50%;
    height: 8%;
    background-color: #333;
    border-radius: 0 0 1.4em 1.4em;
    transform-origin: -15% 0;
}
#cooking #area #pancake {
    position: absolute;
    top: 24%;
    width: 100%;
    height: 100%;
    transform: rotateX(85deg);
    animation: jump 2.1s ease-in-out infinite;
}
#cooking #area #pancake #pastry {
    position: absolute;
    bottom: 26%;
    right: 37%;
    width: 40%;
    height: 45%;
    background-color: #333;
    box-shadow: 0 0 3px 0 #333;
    border-radius: 100%;
    transform-origin: -20% 0;
    animation: fly 2.1s ease-in-out infinite;
}

@keyframes jump {
    0% {
        top: 24%;
        transform: rotateX(85deg);
    }
    25% {
        top: 10%;
        transform: rotateX(0deg);
    }
    50% {
        top: 30%;
        transform: rotateX(85deg);
    }
    75% {
        transform: rotateX(0deg);
    }
    100% {
        transform: rotateX(85deg);
    }
}
@keyframes flip {
    0% {
        transform: rotate(0deg);
    }
    5% {
        transform: rotate(-27deg);
    }
    30%,
    50% {
        transform: rotate(0deg);
    }
    55% {
        transform: rotate(27deg);
    }
    83.3% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(0deg);
    }
}
@keyframes switchSide {
    0% {
        transform: rotateY(0deg);
    }
    50% {
        transform: rotateY(180deg);
    }
    100% {
        transform: rotateY(0deg);
    }
}
@keyframes fly {
    0% {
        bottom: 26%;
        transform: rotate(0deg);
    }
    10% {
        bottom: 40%;
    }
    50% {
        bottom: 26%;
        transform: rotate(-190deg);
    }
    80% {
        bottom: 40%;
    }
    100% {
        bottom: 26%;
        transform: rotate(0deg);
    }
}
@keyframes bubble {
    0% {
        transform: scale(0.15, 0.15);
        top: 80%;
        opacity: 0;
    }
    50% {
        transform: scale(1.1, 1.1);
        opacity: 1;
    }
    100% {
        transform: scale(0.33, 0.33);
        top: 60%;
        opacity: 0;
    }
}
@keyframes pulse {
    0% {
        transform: scale(1, 1);
        opacity: .25;
    }
    50% {
        transform: scale(1.2, 1);
        opacity: 1;
    }
    100% {
        transform: scale(1, 1);
        opacity: .25;
    }
}
/* END LOADER - COOKING */


/*Preloader image*/
.loading-image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100vh;
    background-color: #ffffff !important;
}

.loading-image img {
    z-index: 9999;
    max-width: 50%;
}

@media (min-width: 300px) and (max-width: 767px) {
    .loading-image img {
        width: 50%;
    }
}

@media (min-width: 768px) {
    .loading-image img {
        width: 50%;
    }
}

@media (min-width: 992px) {
    .loading-image img {
        width: 15%;
    }

}
.animate{will-change:transform,opacity,filter;animation:var(--a1,none),var(--a2,none),var(--a3,none),var(--a4,none),var(--a5,none),var(--a6,none)}

@keyframes fadeInOut{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes pulse{0%,100%{transform:scale(.95);opacity:.8}50%{transform:scale(1.05);opacity:1}}
@keyframes spin360{to{transform:rotate(360deg)}}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10%)}}
@keyframes swing{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes bounceY{0%,100%{transform:translateY(0)}50%{transform:translateY(-18%)}}
@keyframes glowPulse{0%,100%{filter:drop-shadow(0 0 0 rgba(13,110,253,0)) drop-shadow(0 0 0 rgba(13,110,253,0))}50%{filter:drop-shadow(0 0 12px rgba(13,110,253,.55)) drop-shadow(0 0 24px rgba(13,110,253,.35))}}
@keyframes hueRotate{to{filter:hue-rotate(360deg)}}
@keyframes blurInOut{0%,100%{filter:blur(0);opacity:.85}50%{filter:blur(2px);opacity:1}}

.fade{--a1:fadeInOut 1.6s ease-in-out infinite}
.pulse{--a2:pulse 1.2s ease-in-out infinite}
.spin{--a3:spin360 1.1s linear infinite}
.float{--a4:floatY 1.8s ease-in-out infinite}
.swing{--a5:swing 1.4s ease-in-out infinite}
.bounce{--a5:bounceY 1.1s cubic-bezier(.28,.84,.42,1) infinite}
.glow{--a6:glowPulse 1.4s ease-in-out infinite}
.hue{--a6:hueRotate 2.4s linear infinite}
.blur{--a6:blurInOut 1.2s ease-in-out infinite}

.speed-slow{--a1:fadeInOut 2.2s ease-in-out infinite;--a2:pulse 2.2s ease-in-out infinite;--a3:spin360 2.2s linear infinite;--a4:floatY 2.2s ease-in-out infinite;--a5:swing 2.2s ease-in-out infinite;--a6:glowPulse 2.2s ease-in-out infinite}
.speed-fast{--a1:fadeInOut .8s ease-in-out infinite;--a2:pulse .8s ease-in-out infinite;--a3:spin360 .8s linear infinite;--a4:floatY .8s ease-in-out infinite;--a5:swing .8s ease-in-out infinite;--a6:glowPulse .8s ease-in-out infinite}
.paused{animation-play-state:paused}

@media (prefers-reduced-motion:reduce){
    .animate{animation:none}
}


/* Spinning Around */
div.spinning_around {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 8vmax;
    height: 8vmax;
    border-radius: 50%;
    animation: spinRight 800ms linear infinite;
}
div.spinning_around:before, div.spinning_around:after {
    content: '';
    width: 6vmax;
    height: 6vmax;
    display: block;
    position: absolute;
    top: calc(50% - 3vmax);
    left: calc(50% - 3vmax);
    border-left: 3px solid #ffffff;
    border-radius: 100%;
    animation: spinLeft 800ms linear infinite;
}

div.spinning_around:after {
    width: 4vmax;
    height: 4vmax;
    top: calc(50% - 2vmax);
    left: calc(50% - 2vmax);
    border: 0;
    border-right: 2px solid #ffffff;
    animation: none;
}

@keyframes spinLeft {
    from {transform:rotate(0deg);}
    to {transform:rotate(720deg);}
}

@keyframes spinRight {
    from {transform:rotate(360deg);}
    to {transform:rotate(0deg);}
}



/* Article Search */
.listing-context .sep { opacity:.5; }

.chip {
    display:inline-flex; align-items:center; gap:.35rem;
    padding:.35rem .65rem; border-radius:999px; font-size:.875rem; line-height:1;
    border:1px solid rgba(0,0,0,.08);
    background: rgba(0,0,0,.04);
    color: var(--bs-body-color);
    transition: all .18s ease;
    box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.chip .label { position:relative; top:.5px; } /* micro-ajuste tipográfico */
.chip i { font-size:.9em; }

.chip-category { background: var(--bs-info-bg-subtle, #e7f1ff); border-color: rgba(13,110,253,.15); }
.chip-tag      { background: var(--bs-secondary-bg-subtle, #eee); }
.chip-search   { background: var(--bs-warning-bg-subtle, #fff3cd); border-color: rgba(255,193,7,.25); }

.chip-link { text-decoration:none; color: inherit; }
.chip-link:hover .chip {
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0,0,0,.08);
    filter: saturate(1.05);
}

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