/* Mix Recipes — frontend recipe header + gallery styles */

/* ==========================================================================
   Image gallery strip (imported document images)
   ========================================================================== */

.mr-recipe-gallery {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 28px;
    border-radius: 8px;
    scrollbar-width: thin;
    scrollbar-color: #e2d8cc transparent;
}
.mr-recipe-gallery::-webkit-scrollbar { height: 4px; }
.mr-recipe-gallery::-webkit-scrollbar-track { background: transparent; }
.mr-recipe-gallery::-webkit-scrollbar-thumb { background: #e2d8cc; border-radius: 2px; }

.mr-recipe-gallery__item {
    flex: 0 0 auto;
    scroll-snap-align: start;
    border-radius: 6px;
    overflow: hidden;
}
.mr-recipe-gallery__item img {
    height: 340px;
    width: auto;
    max-width: 80vw;
    object-fit: cover;
    display: block;
}

@media (max-width: 600px) {
    .mr-recipe-gallery__item img { height: 220px; }
}

/* ==========================================================================
   Recipe header (servings, time, kcal)
   ========================================================================== */

.mr-recipe-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 20px;
    margin-bottom: 32px;
    padding: 16px 20px;
    background: #faf8f5;
    border-radius: 8px;
    border: 1px solid #e8e0d4;
}

.mr-recipe-header__item {
    display: flex;
    flex-direction: column;
    padding-left: 24px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 16px 16px;
    position: relative;
    min-height: 24px;
    justify-content: center;
}

.mr-recipe-header__value {
    font-size: 0.9rem;
    font-weight: 600;
    color: #333;
    line-height: 1.3;
}

.mr-recipe-header__flavor {
    display: block;
    font-size: 0.75rem;
    font-style: italic;
    color: #888;
    line-height: 1.2;
    margin-top: 2px;
}

/* Plates selector — fork & knife icon */
.mr-recipe-header__plates {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23666' d='M264 77c-93.6 0-169.6 75.9-169.6 169.6S170.4 416 264 416s169.6-75.9 169.6-169.6S357.7 77 264 77zm0 298.2c-70.9 0-128.7-57.7-128.7-128.7S193.2 118 264 118s128.7 57.7 128.7 128.7S334.9 375.2 264 375.2zM264 152c-51.9 0-94.2 42.2-94.2 94.2 0 51.9 42.2 94.2 94.2 94.2 51.9 0 94.2-42.2 94.2-94.2S316.1 152 264 152zM501.3 260.7V54.6c0-2-1.3-3.8-3.2-4.4-1.9-.6-4 0-5.2 1.6-25.7 33.9-39.6 75.3-39.6 117.8v75.4c0 8.6 7 15.7 15.7 15.7h6.5c-6.4 66.4-10.7 159.4-10.7 170.3 0 17.1 10.6 31 23.6 31s23.6-13.9 23.6-31c0-10.9-4.3-103.9-10.7-170.3zM68.4 219.8c13-7.9 21.8-22.2 21.8-38.6l-6.5-105.6c-.2-4-3.6-7.2-7.6-7.2-4.4 0-7.8 3.7-7.6 8l4.2 84.7c0 4.8-3.9 8.6-8.6 8.6-4.8 0-8.6-3.9-8.6-8.6l-2.1-84.7c-.1-4.5-3.8-8-8.2-8-4.5 0-8.1 3.6-8.2 8l-2.1 84.7c0 4.8-3.9 8.6-8.6 8.6-4.8 0-8.6-3.9-8.6-8.6l4.2-84.7c.2-4.4-3.3-8-7.6-8-4 0-7.4 3.1-7.6 7.2L0 181.3c0 16.4 8.7 30.7 21.8 38.6 8.5 5.1 13.2 14.8 12.1 24.6C26.6 310.9 21.6 419.2 21.6 431c0 17.1 10.6 31 23.6 31s23.6-13.9 23.6-31c0-11.8-5-120.1-12.4-186.5 1.1-9.8 5.8-19.5 12.1-24.6l.9-.1z'/%3E%3C/svg%3E");
    padding-left: 28px;
}

.mr-recipe-header__plates .mr-plates-form {
    margin: 0;
    padding: 0;
}

.mr-plates-select {
    font-size: 0.9rem;
    font-weight: 600;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 4px 8px;
    background: #fff;
    cursor: pointer;
    color: #333;
}

/* Clock icon — preparation */
.mr-recipe-header__prep {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 97.16 97.16'%3E%3Cpath fill='%23666' d='M48.58 0C21.79 0 0 21.79 0 48.58s21.79 48.58 48.58 48.58 48.58-21.79 48.58-48.58S75.37 0 48.58 0zm0 86.82c-21.09 0-38.24-17.16-38.24-38.24S27.49 10.34 48.58 10.34 86.82 27.49 86.82 48.58 69.67 86.82 48.58 86.82zM73.9 47.08H52.07V20.83c0-2.21-1.79-4-4-4s-4 1.79-4 4v30.25c0 2.21 1.79 4 4 4H73.9c2.21 0 4-1.79 4-4s-1.79-4-4-4z'/%3E%3C/svg%3E");
}

/* Pot icon — cooking */
.mr-recipe-header__cook {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 475.624 475.624'%3E%3Cpath fill='%23666' d='M450.452 259.201c.325 7.649.39 16.794-6.917 21.224-4.324 2.626-9.901 2.756-15.436 1.951v-58.737H46.055v58.916c-5.04.569-10.031.26-13.965-2.13-7.308-4.43-7.243-13.575-6.917-21.224.667-15.729-23.719-15.664-24.386 0-.667 15.729 3.601 34.473 18.996 42.277 8.397 4.259 17.314 5.503 26.28 5.032v77.473c-.008 50.617 42.179 91.642 94.218 91.642h196.305c52.031 0 91.512-41.025 91.512-91.633V306.42c9.462.699 18.891-.447 27.743-4.942 15.396-7.812 19.663-26.548 18.996-42.277-1.224-15.729-26.066-15.729-24.33 0zM46.055 208.3h382.043v-34.481H267.03c-1.488-5.471-4.324-10.364-8.275-14.201v-25.207h-43.35v25.207c-3.951 3.837-6.796 8.73-8.275 14.201H46.055V208.3zM112.677 15.783c-14.168 14.713-20.395 32.75-14.095 52.754 6.413 20.362 26.231 43.618 12.599 64.687-8.462 13.095 10.559 28.377 19.102 15.16 11.356-17.566 12.372-34.026 5.657-53.64C127.852 71.17 110.416 53.141 131.77 30.975c11.47-12.322-7.738-27.376-19.093-15.192zM174.129 4.622c-12.51 16.038-15.965 32.466-11.965 52.34 5.072 25.174 20.118 47.804 4.519 72.613-8.283 13.176 10.73 28.474 19.102 15.16 11.502-18.297 14.9-35.652 10.486-56.908C191.383 63.238 176.011 40.86 193.228 18.783 202.904 7.378 183.81-7.79 174.129 4.622z'/%3E%3C/svg%3E");
}

/* Fire icon — kcal */
.mr-recipe-header__kcal {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23666' d='M256.024 356.661c-15.132 11.517-46.374 39.999-46.374 78.805 0 25.619 20.792 46.462 46.35 46.462s46.35-20.843 46.35-46.462c0-36.951-31.26-66.771-46.326-78.805zM364.632 89.113c-5.621-6.357-15.323-6.742-21.444-1.028l-70.585 65.879V15.999c0-11.549-13.925-20.178-24.353-13.87-1.974 1.194-48.882 29.838-96.279 81.855C94.342 167.232 55.093 244.241 55.093 310.605 55.093 421.655 145.22 512 256 512c-42.1 0-76.35-34.334-76.35-76.535 0-68.192 66.208-108.571 69.026-110.257 4.94-2.953 11.125-2.815 15.929.35 2.766 1.824 67.744 45.407 67.744 109.906C332.35 477.666 298.1 512 256 512c110.78 0 200.907-90.345 200.907-201.395 0-83.254-37.002-158.413-92.275-221.492z'/%3E%3C/svg%3E");
}

/* Responsive: stack vertically on small screens */
@media (max-width: 600px) {
    .mr-recipe-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 14px 16px;
    }
}