#shop-template-apto {
    --color-primary: #0577bf;
    --color-optic-lines: #0577bf;
    --color-optic-lines-popup: #0577bf;
    --color-background-header: #1f2630;
}

#shop-template-apto apto-header .logo img {
    max-width: 60%;
    margin: 0 auto;
}

#shop-template-apto button.mat-flat-button.mat-primary:hover:not(.mat-button-disabled) {
    background-color: #232323;
}

#shop-template-apto apto-sidebar-summary-price apto-quantity-input-editable,
#shop-template-apto apto-sidebar-summary-price .select-basket,
#shop-template-apto apto-summary apto-quantity-input-editable,
#shop-template-apto apto-sidebar-summary-button .share-button,
#shop-template-apto apto-summary-configuration .summary.configuration:nth-child(3) {
    display: none;
}

#shop-template-apto apto-summary-configuration .single-section .section-right,
#shop-template-apto apto-summary-configuration .single-section .summary-section-divider {
    display: none;
}

#shop-template-apto .area-element.step-by-step.disabled,
#shop-template-apto .custom-text-element.step-by-step.disabled,
#shop-template-apto .float-input-element.step-by-step.disabled,
#shop-template-apto .default-element-step-by-step.step-by-step.disabled,
#shop-template-apto .selectbox-element.step-by-step.disabled,
#shop-template-apto .width-height-element.step-by-step.disabled {
    opacity: 0.5;    
}

#shop-template-apto apto-summary-configuration .single-section.price .section-right {
    display: flex;
}

#shop-template-apto apto-summary-configuration .single-section.price .summary-section-divider {
    display: block;
}

@media only screen and (min-width: 767px) {
    #shop-template-apto .area-element.step-by-step,
    #shop-template-apto .custom-text-element.step-by-step,
    #shop-template-apto .float-input-element.step-by-step,
    #shop-template-apto .default-element-step-by-step.step-by-step,
    #shop-template-apto .selectbox-element.step-by-step,
    #shop-template-apto .width-height-element.step-by-step {
        grid-template-areas: "picture header"
                            "picture description"
                            "picture attachment"
                            "picture element"
                            "picture extra-item"
                            "picture buttons";
        grid-template-columns: calc(var(--image-tablet-width) + 2* var(--element-gap)) 1fr;
    }
}

@media only screen and (max-width: 768px) {
    #shop-template-apto apto-header .logo img {
        max-width: 120%;
    }
}