/**
 * CSS for: .WEDDING_PACKAGE
 * Used with: flammeum_WEDDING_PACKAGE_shortcode()
 */

.WEDDING_PACKAGES_WRAP {
    --wedding_packages-title_height: 7rem;
    --wedding_packages-diff: 1rem;
    --wedding_packages-flex_gap: 0.5rem;
    
    display: flex;
    flex-direction: row;
    gap: var(--wedding_packages-flex_gap);
    flex-wrap: wrap;
    
    filter: drop-shadow(0 0 2rem rgba(206, 172, 176, 0.3));
}



.WEDDING_PACKAGE {
    flex: 0 1 calc(25% - var(--wedding_packages-flex_gap));
    
    position: relative;
    margin-top: var(--wedding_packages-diff);
    margin-bottom: var(--wedding_packages-diff);
    border-radius: 1rem;
    overflow: hidden;
    border: 1px solid #ceacb0;
    background: #fff;
    
    display: flex;
    flex-direction: column;
}
.WEDDING_PACKAGE.--highlighted {
    margin-top: 0;
    margin-bottom: 0;
}
.WEDDING_PACKAGE .TITLE {
    flex: 0 1 var(--wedding_packages-title_height);
    
    position: relative;
    padding: 0 1.5rem 1rem;
    
    display: flex;
    justify-content: center;
    align-items: center;
}
.WEDDING_PACKAGE .TITLE::after {
    position: absolute;
    bottom: 1rem;
    left: 15%;
    content: " ";
    height: 1px;
    width: 70%;
    background: #292929;
}
.WEDDING_PACKAGE.--highlighted .TITLE {
    flex: 0 0 calc(var(--wedding_packages-title_height) + var(--wedding_packages-diff));
    
    padding-top: var(--wedding_packages-diff);
    background: #ceacb0;
}
.WEDDING_PACKAGE .TITLE h2 {
    margin: 0;
    text-wrap: balance;
}



.WEDDING_PACKAGE .CONTENT_TOP {
    flex: 1 0 1px;
    padding: 0 1rem;
}
.WEDDING_PACKAGE .CONTENT_BOTTOM {
    flex: 0 1 1px;
}
.WEDDING_PACKAGE.--highlighted .CONTENT_TOP,
.WEDDING_PACKAGE.--highlighted .CONTENT_BOTTOM {
    position: initial;
}
.WEDDING_PACKAGE .CONTENT_BOTTOM .PRICE_ROW {
    padding: 0 1rem;
    margin: 0.2rem 0;
    
    display: flex;
}
.WEDDING_PACKAGE .CONTENT_BOTTOM .GUESTS,
.WEDDING_PACKAGE .CONTENT_BOTTOM .PRICE {
    border-bottom: 1px solid #777;
    
    display: flex;
    align-items: end;
}
.WEDDING_PACKAGE .CONTENT_BOTTOM .GUESTS {
    flex: 1 1 1px;
    padding-bottom: 0.3rem;
}
.WEDDING_PACKAGE .CONTENT_BOTTOM .PRICE {
    flex: 0 0 max-content;
    font-size: 1.5rem;
    text-align: right;
    padding: 0.3rem 0;
}
.WEDDING_PACKAGE .CONTENT_BOTTOM .GUESTS p,
.WEDDING_PACKAGE .CONTENT_BOTTOM .PRICE p {
    margin: 0;
}



.WEDDING_PACKAGE .CONTENT_BOTTOM .ORDER_BUTTONS_WRAP input.pink_button[type="button"] {
    margin: 1rem;
    width: calc(100% - 2rem);
}



.WEDDING_PACKAGE.--highlighted .CONTENT_BOTTOM .ORDER_BUTTONS_WRAP input[type="button"] {
    margin-bottom: 2rem;
}
.WEDDING_PACKAGE .CONTENT_BOTTOM .ORDER_BUTTONS_WRAP {
    margin-top: 1rem;
}
.WEDDING_PACKAGE.--highlighted .CONTENT_BOTTOM .ORDER_BUTTONS_WRAP {
    background: #ceacb0;
}



@media only screen and (max-width: 1200px) and (min-width: 801px) {
    .WEDDING_PACKAGE {
        flex: 0 1 calc(50% - var(--wedding_packages-flex_gap));
    }
}
@media only screen and (max-width: 800px) {
    .WEDDING_PACKAGE {
        flex: 0 1 100%;
    }
}