:root{

    --retailer-img-width:clamp(5vw, 10vh, 40vw);
}

.text-title{
    font-size:var(--fs-ll);
    font-weight:var(--fw-extra-bold);
}

.border-grey{
    border: 1px solid var(--light-border-grey);
}

#titleHeader{
    padding-top:var(--gap-l);
    margin-bottom:calc( -1 * var(--gap-m)); /* reduce the gap between title and price chart section */
}

#chartAndImg{
}

#dealSummaryAndImg{
    min-width: min( 30rem, 90vw);
}

#dealSummaryAndImg .image-container{
    aspect-ratio:5/4;
    /*max-height:24rem;*/
    max-width:30rem;
    width:100%;
}

#priceChartSection{
    min-width:min(36rem);
}

.chartContainer{
}

.tableRetail__row{
    max-width: 90rem;
    padding: var(--gap-l) var(--gap-xl);
}

.tableRetail__storeLogo{
    width:var(--retailer-img-width);
}

ul{
    list-style-type: none;
}

.tableRetail__price{
    min-width:10ch;
}

#willItRunAndWhatsInside{
    max-width:80rem;
}

#willItRun{
    /*padding-top:var(--gap-l);*/
}

#willItRun__MinimumRequirements,
#willItRun__RecommendedRequirements,
#willItRun__VerdictContainer{
    display:none;
}

#willItRun__VerdictContainer{
    margin-bottom:var(--gap-m);
}

#whatsInside__header{
    padding-bottom:var(--gap-l);
}

#whatsInside .toggleArrow[aria-expanded="false"]{
  transform: rotate(180deg);
}

#whatsInside .data[aria-expanded="false"]
{
}

#whatsInside .entry-data{
    grid-template-columns: 1fr 10px 1fr;
}

.accordion-content {
    height: 0;
    overflow: hidden;
    transition: height 0.35s ease;
}

#specs hr{
    background-color:grey;
}

#specs{
    margin-bottom:var(--gap-xl);
}

@media screen and (max-width: 1024px) and (max-aspect-ratio: 1/1){
    #chartAndImg{ 
        flex-direction:column; 
        gap:var(--gap-m);
    }
    #priceChartAndAlertSection{
        gap:var(--gap-m);
    }
    #willItRunAndWhatsInside{
        max-width:var(--content-max-width);
    }
    #specsTableContainer{
        flex-direction:column;
    }
}


@media screen and (max-width: 768px) and (max-aspect-ratio: 1/1){
    #priceChartSection{
        min-width:var(--content-max-width);
    }
    .tableRetail__row{
        flex-direction:column;
        gap:var(--gap-m);
    }
    #willItRunAndWhatsInside,
    #specs{
        padding:var(--gap-m) 0;
    }
    #willItRun__RequirementsBoxContainer{
        flex-direction:column;
    }
}
