.vl-my-valio-button-circle{--_text-color: var(--valio-pure-white);--_background-color: var(--valio-action-blue);--_border-color: var(--valio-action-blue);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;align-self:center;width:2.875rem;height:auto;font-size:.875rem;font-weight:var(--font-weight-medium);line-height:1.1;letter-spacing:.0088rem;text-transform:uppercase;color:var(--_text-color);background-color:var(--_background-color);border-radius:50%;border:none;aspect-ratio:1;padding:0;margin:0;transition:all .25s cubic-bezier(0.19, 1, 0.22, 1);cursor:pointer}.vl-my-valio-button-circle:focus-visible{outline:2px solid var(--valio-action-blue);outline-offset:2px;transition:none}.vl-my-valio-button-circle.is-size-sm{width:1.875rem;padding:.25rem .5rem}.vl-my-valio-button-circle:hover,.vl-my-valio-button-circle:active{--_text-color: var(--valio-pure-white);--_background-color: var(--valio-action-blue);--_border-color: var(--valio-action-blue);filter:brightness(1.1)}.vl-my-valio-button-circle:hover svg path,.vl-my-valio-button-circle:active svg path{stroke:var(--_text-color)}.vl-my-valio-button-circle:disabled{opacity:.5;pointer-events:none;color:var(--color-gray-500)}.vl-my-valio-button-circle:disabled svg path{stroke:var(--color-gray-500)}.vl-my-valio-button-circle:disabled{pointer-events:none;cursor:default}.vl-my-valio-button-circle--secondary{--_text-color: var(--color-brand);--_background-color: var(--valio-pure-white);--_border-color: var(--valio-pure-white)}
.vl-my-valio-button-dashed{display:inline-flex;align-self:center;justify-content:center;align-items:center;gap:.375rem;flex-shrink:0;font-size:1rem;color:var(--color-brand);line-height:1.2;font-weight:var(--font-weight-medium);letter-spacing:.0088rem;background-color:rgba(0,0,0,0);transition:all .25s cubic-bezier(0.19, 1, 0.22, 1);border:1px dashed;border-color:rgba(97,97,97,.45);border-radius:.5rem;padding:.875rem 1rem;cursor:pointer;width:100%;height:3.5rem}.vl-my-valio-button-dashed:focus-visible{outline:2px solid var(--valio-action-blue);outline-offset:2px;transition:none}.vl-my-valio-button-dashed:hover{border-color:var(--color-brand)}
.vl-link-button{--_text-color: var(--valio-pure-white);--_background-color: var(--valio-action-blue);--_border-color: var(--valio-action-blue);display:inline-flex;flex-shrink:0;align-items:center;align-self:center;gap:.375rem;width:max-content;height:2.4375rem;font-size:.875rem;font-weight:var(--font-weight-medium);line-height:1;letter-spacing:.0088rem;text-transform:uppercase;color:var(--_text-color);background-color:var(--_background-color);border-radius:1.5rem;border:2px solid var(--_border-color);padding:.75rem 1.375rem;transition:all .25s cubic-bezier(0.19, 1, 0.22, 1);cursor:pointer}.vl-link-button:focus-visible{outline:2px solid var(--valio-action-blue);outline-offset:2px;transition:none}.vl-link-button.is-size-sm{font-size:.875rem;padding:.25rem .5rem}.vl-link-button:hover,.vl-link-button:active{--_text-color: var(--valio-pure-white);--_background-color: var(--valio-action-blue);--_border-color: var(--valio-action-blue);filter:brightness(1.1)}.vl-link-button:hover svg path,.vl-link-button:active svg path{stroke:var(--_text-color)}.vl-link-button:disabled{opacity:.5;pointer-events:none;color:var(--color-gray-500)}.vl-link-button:disabled svg path{stroke:var(--color-gray-500)}.vl-link-button:disabled{pointer-events:none;cursor:default}.vl-link-button--secondary{--_text-color: var(--color-brand);--_background-color: var(--valio-pure-white);--_border-color: var(--valio-pure-white)}.vl-link-button--outline{--_text-color: var(--valio-action-blue);--_background-color: var(--valio-pure-white);--_border-color: var(--valio-action-blue)}.vl-link-button--text{--_text-color: var(--valio-action-blue);--_background-color: transparent;--_border-color: transparent;padding:0}.vl-link-button--text:hover,.vl-link-button--text:active{--_text-color: $button-primary-hover;--_background-color: transparent;--_border-color: transparent}
.vl-my-valio-button-pill{--_text-color: var(--valio-pure-white);--_background-color: var(--valio-action-blue);--_border-color: var(--valio-action-blue);display:inline-flex;flex-shrink:0;align-items:center;align-self:center;gap:.375rem;width:max-content;height:2.4375rem;font-size:.875rem;font-weight:var(--font-weight-medium);line-height:1;letter-spacing:.0088rem;text-transform:uppercase;color:var(--_text-color);background-color:var(--_background-color);border-radius:1.5rem;border:2px solid var(--_border-color);padding:.75rem 1.375rem;transition:all .25s cubic-bezier(0.19, 1, 0.22, 1);cursor:pointer}.vl-my-valio-button-pill:focus-visible{outline:2px solid var(--valio-action-blue);outline-offset:2px;transition:none}.vl-my-valio-button-pill.is-size-sm{font-size:.875rem;padding:.25rem .5rem}.vl-my-valio-button-pill:hover,.vl-my-valio-button-pill:active{--_text-color: var(--valio-pure-white);--_background-color: var(--valio-action-blue);--_border-color: var(--valio-action-blue);filter:brightness(1.1)}.vl-my-valio-button-pill:hover svg path,.vl-my-valio-button-pill:active svg path{stroke:var(--_text-color)}.vl-my-valio-button-pill:disabled{opacity:.7;pointer-events:none;color:#fff;background-color:#204cc5}.vl-my-valio-button-pill:disabled svg path{stroke:unset}.vl-my-valio-button-pill:disabled{pointer-events:none;cursor:default}.vl-my-valio-button-pill--secondary{--_text-color: var(--color-brand);--_background-color: var(--valio-pure-white);--_border-color: var(--valio-pure-white)}.vl-my-valio-button-pill--outline{--_text-color: var(--valio-action-blue);--_background-color: var(--valio-pure-white);--_border-color: var(--valio-action-blue)}.vl-my-valio-button-pill--text{--_text-color: var(--valio-action-blue);--_background-color: transparent;--_border-color: transparent;padding:0;height:fit-content}.vl-my-valio-button-pill--text:hover,.vl-my-valio-button-pill--text:active{--_text-color: $button-primary-hover;--_background-color: transparent;--_border-color: transparent}.vl-my-valio-button-pill--text:disabled{opacity:1;pointer-events:none;cursor:default;background-color:rgba(0,0,0,0);color:var(--color-gray-500)}.vl-my-valio-button-pill--text:disabled svg path{stroke:var(--color-gray-500)}
.vl-my-valio-button-close{display:inline-flex;align-items:center;justify-content:center;background-color:var(--valio-natural-white);border:none;font-size:2rem;cursor:pointer;line-height:1;padding:0;width:2rem;height:2rem;border-radius:50%;border:1px solid rgba(0,0,0,0);transition:.25s ease-in-out}.vl-my-valio-button-close:focus-visible{outline:2px solid var(--valio-action-blue);outline-offset:2px;transition:none}.vl-my-valio-button-close svg{width:2rem;height:2rem}.vl-my-valio-button-close:hover{border-color:var(--color-brand)}
.vl-my-valio-modal__handle{display:flex;align-items:center;justify-content:center;padding-block-start:var(--spacing-12);padding-block-end:var(--spacing-48);position:absolute;top:0;left:0;right:0;margin:0 auto;touch-action:none}@media(min-width: 1080px){.vl-my-valio-modal__handle{display:none}}.vl-my-valio-modal__handle-bar{display:block;width:3.4375rem;height:.25rem;background:rgba(0,0,0,.3);border-radius:1.5rem}
.vl-my-valio-modal__overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9998;background:rgba(212,210,207,.7);backdrop-filter:blur(7px);opacity:1;transition:opacity .25s cubic-bezier(0.19, 1, 0.22, 1);touch-action:none;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.vl-form-element__label{display:block;font-size:.875rem;line-height:1.25;font-weight:var(--font-weight-medium);color:var(--color-brand);margin-block-end:var(--spacing-8)}.vl-form-element__input{padding:.875rem 1.25rem .9375rem 1.25rem;background-color:var(--valio-natural-white);border:1px solid var(--valio-additional-brown);border-radius:.5rem;font-size:1rem;line-height:1.2;color:var(--color-brand);height:3rem;width:100%}.vl-form-element__input ::placeholder{color:var(--color-brand)}.vl-form-element__input:focus-visible{outline:2px solid var(--valio-action-blue);outline-offset:2px;transition:none}
.vl-form-element-textarea__input{height:9rem}
.vl-form-element-text__input{height:3rem}
@keyframes skeleton-shimmer{0%{background-position:-470px 0}100%{background-position:470px 0}}.skeleton-loader{background:linear-gradient(to right, #e0e0e0 8%, #f0f0f0 18%, #e0e0e0 33%);background-size:1200px 100%;animation:skeleton-box-shimmer 1.5s linear infinite;border-radius:.5rem}.skeleton-grid-card{background-color:#f5f5f5;border-radius:.5rem;overflow:hidden;aspect-ratio:1}.skeleton-grid-card__image{border-radius:.5rem;width:100%;height:auto;aspect-ratio:163/117}.skeleton-grid-card__info{width:90%;margin-inline:auto}.skeleton-grid-card__title{width:80%;height:1rem;margin-block-start:.5rem;margin-block-end:.375rem}.skeleton-grid-card__count{width:50%;height:.675rem}
@keyframes skeleton-shimmer{0%{background-position:-470px 0}100%{background-position:470px 0}}.skeleton-loader{background:linear-gradient(to right, #e0e0e0 8%, #f0f0f0 18%, #e0e0e0 33%);background-size:1200px 100%;animation:skeleton-box-shimmer 1.5s linear infinite;border-radius:.5rem}
.vl-loading-spinner{transform-origin:center;animation:vl-spinner-360 .75s infinite linear}@keyframes vl-spinner-360{100%{transform:rotate(360deg)}}
.vl-create-folder-view__title{margin-block-end:var(--spacing-24)}.vl-create-folder-view__actions{margin-block-start:var(--spacing-40);display:flex;justify-content:center;gap:1rem}
.vl-delete-folder-view{display:grid;place-items:center;width:80%;margin-inline:auto}.vl-delete-folder-view__title{text-align:center;margin:0}.vl-delete-folder-view__description{text-align:center;margin-block-start:var(--spacing-24);margin-block-end:var(--spacing-32)}.vl-delete-folder-view__actions{display:flex;gap:var(--spacing-24)}@media(max-width: 599px){.vl-delete-folder-view__actions{flex-direction:column}}
.vl-remove-recipe-view{display:grid;place-items:center;width:80%;margin-inline:auto}.vl-remove-recipe-view__title{text-align:center;margin:0}.vl-remove-recipe-view__description{text-align:center;margin-block-start:var(--spacing-24);margin-block-end:var(--spacing-32)}.vl-remove-recipe-view__actions{display:flex;gap:var(--spacing-24)}@media(max-width: 599px){.vl-remove-recipe-view__actions{flex-direction:column}}
.vl-edit-folder-view{display:grid}.vl-edit-folder-view__input{margin-block-end:var(--spacing-24)}.vl-edit-folder-view__title{margin-block-end:var(--spacing-24)}.vl-edit-folder-view__actions{margin-block-start:var(--spacing-8);display:flex;justify-content:center;gap:1rem}@media(max-width: 599px){.vl-edit-folder-view__actions{flex-direction:column-reverse}}
.vl-folder-actions-view-row{background:none;border:none;padding:0;margin:0;cursor:pointer;display:flex;gap:var(--spacing-12);align-items:center;border-bottom:1px solid hsla(0,0%,38%,.2);padding-block:var(--spacing-16);width:100%}.vl-folder-actions-view-row__label{color:var(--color-brand);font-size:1rem}
.vl-my-valio-selectable-folder-list-item--error{border:1px dashed #d63638;background-color:#fef2f2;color:#9b2c2c;display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;min-height:50px}.vl-my-valio-selectable-folder-list-item--error>.vl-my-valio-selectable-folder-list-item__label{display:none}.vl-my-valio-selectable-folder-list-item--error .vl-my-valio-selectable-folder-list-item__label--error{flex-grow:1;font-size:.9rem;padding-right:1rem}.vl-my-valio-selectable-folder-list-item--error .vl-my-valio-selectable-folder-list-item__retry-button{padding:.25rem .75rem;border:1px solid #e2e8f0;background-color:#fff;color:#2d3748;cursor:pointer;border-radius:4px;font-weight:600;font-size:.8rem;flex-shrink:0}.vl-my-valio-selectable-folder-list-item--error .vl-my-valio-selectable-folder-list-item__retry-button:hover{background-color:#f7fafc}
.vl-my-valio-selectable-folder-list-item{background-color:var(--valio-natural-white);border-radius:.5rem;margin:0;height:3.5rem;overflow:hidden}.vl-my-valio-selectable-folder-list-item:has(.vl-checkbox__input:focus-visible){outline:2px solid var(--valio-action-blue);outline-offset:2px;transition:none}.vl-my-valio-selectable-folder-list-item label{display:flex;align-items:center;padding:0 1rem 0 0;gap:.75rem;cursor:pointer;position:relative;border:1px solid rgba(0,0,0,0);height:100%;border-radius:.5rem}.vl-my-valio-selectable-folder-list-item label:hover{border-color:var(--valio-action-blue)}.vl-my-valio-selectable-folder-list-item label:has(.vl-checkbox__input:checked){outline:2px solid var(--valio-action-blue);outline-offset:2px;transition:none}.vl-my-valio-selectable-folder-list-item__thumbnail{width:3.5rem;height:3.5rem;object-fit:cover;object-position:center}.vl-my-valio-selectable-folder-list-item__label{flex-grow:1;font-size:1rem;line-height:1.2;font-weight:var(--font-weight-medium);color:var(--color-brand);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;text-overflow:ellipsis}.vl-my-valio-selectable-folder-list-item input[type=checkbox]{opacity:0;position:absolute;width:0;height:0}.vl-my-valio-selectable-folder-list-item input[type=checkbox]~.vl-my-valio-selectable-folder-list-item__checkbox-custom{width:24px;height:24px;border:2px solid #ccc;border-radius:50%;background-color:#fff;margin-left:1rem;flex-shrink:0;position:relative}.vl-my-valio-selectable-folder-list-item input[type=checkbox]:checked~.vl-my-valio-selectable-folder-list-item__checkbox-custom{background-color:var(--valio-action-blue);border-color:var(--valio-action-blue)}.vl-my-valio-selectable-folder-list-item input[type=checkbox]:checked~.vl-my-valio-selectable-folder-list-item__checkbox-custom::after{content:"";position:absolute;left:7px;top:3px;width:6px;height:12px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.vl-my-valio-selectable-folder-list{display:grid;gap:1rem;list-style-type:none;padding-left:0;max-height:20rem;overflow:auto;margin:.5rem 0 2rem 0}
.vl-move-recipe-view{display:grid}.vl-move-recipe-view__title{margin-block-end:var(--spacing-8)}@media(min-width: 1080px){.vl-move-recipe-view__title{margin-block-end:var(--spacing-12)}}.vl-move-recipe-view__description{margin-block-end:var(--spacing-24)}.vl-move-recipe-view>.vl-my-valio-selectable-folder-list{margin-block-start:1rem;margin-block-end:0}.vl-move-recipe-view>.vl-my-valio-button-pill{margin-block-start:var(--spacing-32);justify-self:center}
.vl-save-recipe-view{display:grid}.vl-save-recipe-view__title{margin-block-end:var(--spacing-8)}@media(min-width: 1080px){.vl-save-recipe-view__title{margin-block-end:var(--spacing-12)}}.vl-save-recipe-view__description{margin-block-end:var(--spacing-24)}.vl-save-recipe-view>.vl-my-valio-selectable-folder-list{margin-block-start:1rem;margin-block-end:0}.vl-save-recipe-view>.vl-my-valio-button-pill{margin-block-start:var(--spacing-32);justify-self:center}