/* ---------------- CATALOG --------------- */

.flex-catalog {
    .section {
        img.detail {
            max-height:300px;
            aspect-ratio:16/10;
            object-fit:contain;
            margin-bottom:5px;
        }
    }

    .left-column {
        justify-content:center;
        align-items:flex-end;
    }

    ul {
        padding-left:8vw;
        &.delicious{
            line-height:2.2em;
            padding:0;
            color:var(--text-primary);
            li{padding:0;}
            li::before {
                content:'✔';
                background-color:#3683F4;
                color:#fff;
                position:initial;
                display:inline;
                border-radius:1em;
                text-align:center;
                padding:0 .3em;
                font-size:1em;
                margin-right:5px;
            }
        }
    }
}
/* ----------  SECTION ------------ */
.product-section {
    flex-direction:row-reverse;
    padding:0 0 50px;
    justify-content:space-around;
    align-items:center;
    gap:20px;

    .section{
        overflow:hidden;
        flex:1 1 300px;
        padding-left:20px;

        h2 {
            font-size:40px;
            text-align:left;
            font-weight:500;
        }

        &.left-column img {
            height:300px;
            aspect-ratio:10/16;
            object-fit:contain;
            margin-left:40px;
        }

        ul{
            padding-left:.5em;
            font-size:16px;
            color:var(--gray);
        }
    }
}

.container {zbackground:#efe}

.flex-section.flex-items {
    gap:10px 40px;
    flex-direction:row-reverse;
    justify-content: left;

    .section.section-item {zborder:dotted 1px;;
        min-width:200px;
        flex:0 0 240px;

        a {zborder:dotted 1px;
            padding:0 10px;
            display:flex;
            flex-flow:column nowrap;
            align-items:center;
            height:480px;
            overflow:hidden;
            gap:7px;
            font-size:14px;
            font-weight:300;
            p {
                font-size:16px;
                text-align:center;
                font-weight:500;
            }
        }

        img.detail{
            width:90%;
            aspect-ratio:10/12;
            object-fit:contain;
        }
    }
}


/* mobile */
@media only screen and (max-width: 600px)  {
    h2 {font-size:20px}
}



/* ---------------- PRODUCT --------------- */

h2.caption {
    margin-bottom: 30px;
    .favor {
        color:#66b;
        font-size:14px;
        font-weight:normal;

        i:before {
            color:gold;
            font-size:24px;
            margin:0 5px 0 15px;
            vertical-align: bottom;
        }
        span:before {content:'В избранное';}
        &.active span:before {content:'В избранном';}
    }
}

div.delicious {
    padding:15px 0 0 0;
    gap:30px;
    &>div {
        width:200px;
        border:solid 1px blue;
        border-radius:var(--radius-big);
        text-align:center;
        overflow:hidden;
        background:blue;
        color:white;
        a {
            padding:0;
            line-height:1.2em;
            img {
              object-fit:cover;
              height:60px;
              width:200px;
            }
        }
    }
}