/*RECEIPT*/

#receipt
{	
	padding:5px 0 0px 0;
	margin:44px 0 0 0;
	position:relative;
	display:block;
	.box-sizing();
	width:100%;
	@pv-receipt();

	& > .price{
		position:absolute;
		right:10px;
		top:-10px;
		@pv-pricetag();

		.fieldMessageBox{
			display:none;
		}
	}

    .wait-box
    {
	    width:100% !important;
	    padding:0 !important;
	    position:relative !important;
	    top:0;left:0;
	    border:none !important;
        background:url(img/base/gradient/gradient_even-wachten-aub.png) repeat-x left bottom;

        &.shadow
        {
            .box-shadow(none) !important;
	        -ms-filter: none !important;
        }
    }

    span.tt
    {
        display:block;
        width: 20px;
        height: 20px;
        position:absolute;
        left: 13px;
    	@pv-transport-blue();    
    }


	.box-header
	{
		@header-default();
		color:@color-text-body;
	}

	.box-content
	{
		background:none;
		border:none;

		a
		{
			@pv-receipt-a();
		}

        

        label.accommodation {
            @pv-receipt-icon();
            &:before{
				content:"\e909";
            }
        }
        label.destination {
            @pv-receipt-icon();
            &:before{
				content:"\e941";
            }
        }
        label.travelers {
            @pv-receipt-icon();
            &:before{
				content:"\e929";
            }
        }
        label.transport {
            @pv-receipt-icon();
            &.FL:before,
			&.VL:before{
				content:"\e912";
            }
			&.HO:before,
            &.EV:before{
				content:"\e914";
            }
        }
        label.outward {
            @pv-receipt-icon();
        }
        label.return {
            @pv-receipt-icon();
        }
        label.provider {
            @pv-receipt-icon();
            &:before{
				content:"\e92d";
            }
        }
        label.travelduration {
            @pv-receipt-icon();
            &:before{
				content:"\e939";
            }
        }
        label.care {
            @pv-receipt-icon();
            &:before{
				content:"\e925";
            }
        }
        label.rooms {
            @pv-receipt-icon();
            &:before{
				content:"\e913";
            }
        }

	}

	.image 
    {
		width:290px;
		padding:0 0 10px 0;
		margin:0 0 10px 0;
		@pv-receipt-image();

        img 
        {
			width:100%;
		}

		h2 
        {
			font-size: 17px;
            font-weight:bold;
			line-height:24px;
			@pv-receipt-image-h2();
		}

		h3 
        {
            margin-bottom:5px;
			font-size: 12px;
			@pv-receipt-image-h3();
		}
	}

	#ctl00_ContentPlaceContentBlock3_Receipt_pnlButtonSave{
		& > .row{
			display:flex;
			flex-direction:column;
		}

		#ctl00_ContentPlaceContentBlock3_Receipt_btnMailTrip {
			float:none;
			justify-content:center;
			margin-top:10px;
		}
	}

}



#receipt.content-box .price-overview-block
{
	float:right;
}

	#receipt .price-overview 
    {
		padding:0 0 10px 0;
		margin:0 0 10px 0;
		width:290px;
		@pv-receipt-priceoverview();
	
	    h3 {
		    font-size: 16px;
		    line-height:19px;
		    margin-bottom:5px;
		    font-weight: normal;
            
			@pv-receipt-priceoverview-h3();
	    }
    

	    ul.ulPrices
	    {
		    float:left;
		
		    li
		    {
			    float:left;
		    }

		    .description
		    {
			    width:190px;
		    }

		    .total
		    {
			    width:100px;
		    }
        }

	    dt {
		    float:left;
		    text-align:left;
		    clear:left;
		    width:190px;
	    }
	    dd {
		    float:right;
		    text-align:right;
		    clear:right;
		    width:100px;
	    }

	    dl
        {
            width:290px;

		    &.price {
			    font-weight:bold;
			    margin-top:4px;
			    padding-top:4px;

			    dt {
				    font-size:16px;
                    width:120px;
			    }
			    dd {
				    font-size:20px;
                    width: 170px;
			    }
				@pv-receipt-price();
            }

		    &:not(.price) {
			    padding-bottom:4px;
			    float:left;
                border-bottom:1px solid #8cd1ff;
		    }
        }
    }

	#receipt .downpayment {
		width:290px;
	}

	#receipt .savings {
		position:relative;
		height:41px;
		width:100%;
		padding:8px 10px 0;
		.box-sizing();
		font-size:20px;
		text-transform:uppercase;
		@pv-receipt-savings();
		border-bottom-left-radius:8px;
		border-bottom-right-radius:8px;

		dt {
			float:left;
			@pv-receipt-savings-dt();
		}
		dd {
			float:right;
			text-align:right;
			@header-small();
		}
    }



			


	#receipt .row
	{
		display:block;
		float:left;
		width:100%;

        @pv-receipt-row();

		label
		{
			width:22%;
			float:left;

            &.font-twc.fwb {
                /*font-size:16px !important;*/
            }
		}

		.field, 
        ul
		{
			width:84%;
			word-break:break-word;
		}

	    .spacer{
            height:1px;
		    width:~"calc(100% + 32px)";
		    display:block;
		    float:left;
		    margin:0 0 0 -16px;
			@pv-receipt-spacer();
	    }

		.priceBreakDown {
			.total{
				@header-small();
			}
		}
    }

    #receipt .receipt-transport-date {
        @header-small();
		margin-bottom:10px;
    }

    #receipt .receipt-transport-departure-time,
    #receipt .receipt-transport-arrival-time {
        position: absolute;
        left: -45px;
    }

	#transport-overview .row ul { width:100%; }

	#transport-overview .row .airline {
		position:relative;
		width:100%;
		.box-sizing();
	}
	#receipt .row .airline {
		position:relative;
	}

		#transport-overview .row .airline span {
			position:absolute;
			left:0px;
			top:25px;
		}
		#receipt .row .airline span {
			position:absolute;
			left:-110px;
			top:25px;
		}

	#receipt .last-row {
		@pv-receipt-lastrow();
	}
	#receipt .price-container {
		margin:5px 0 0 0;
		position:relative;
		padding:0 0 0 0;
		@pv-receipt-pricecontainer();
		height:auto;
		display:flex;
		flex-direction:column;

		&.large{
			font-size:16px;
		}

		.price-info:empty{
			display:none;
		}

		.total-us{
			font-size:16px;
			font-weight:bold;
			padding-top:10px;
		}
    }

	#receipt .deal-guarantee-holder{
		position:relative;
		width:100%;
		float:left;

		.deal-guarantee{
			position:absolute;
		    right:0;
		    top:0;
            height:60px;
            width:60px;
			filter:none;
            img {
                width:100%;
            }
	    }
	}

		#receipt .price-container dl {
			margin-top:-5px;

		    dt {
			    width:65%;
			    vertical-align:bottom;
		    }

		    dd {
			    width:35%;
                text-align:right;
			    white-space:nowrap;

			    small {
				    font-size:100%;
			    }
		    }
        }

        #receipt .price-container .price {
            width:100%;
            text-align:left;
        }

		#receipt .price-container p,
        #receipt .price-container ul  {
			width:185px;
            @pv-receipt-pricecontainer-width();
		}

		#receipt .price-container div.price-info {
            margin-top: 5px;
			width:185px;
			@text-small();
            @pv-receipt-pricecontainer-width();

			a.excluded{
				text-decoration:none;
			}
		}

	#receipt .receiptMessage
	{
		margin:10px 0;
	}

	#receipt .receiptMessage .receiptMessageText
	{
		padding:15px;
        background-color: #f1f1f1;
	}

		#receipt .receiptMessage .receiptMessageText strong
		{
			float:left;
		}

		#receipt .receiptMessage .receiptMessageText .receiptMessageToDo
		{
			width:100%;
		}

			#receipt .receiptMessage .receiptMessageText .receiptMessageToDo li
			{ 
                position: relative;
                padding-left: 13px;
                &::before {
                    content: '';
                    display: inline-block;
                    width:6px;
                    height:6px;
                    .border-radius(3px);
                    background-color:#c00;
                    position:absolute;
                    left:0;
                    top:4px;
                }
			}

		#receipt .receiptMessage .receiptMessageText .btn-geel {
			padding-left:5px;
			width:135px;
			@pv-receipt-btngeel();
            margin-top: 15px !important;
		}

	#receipt .receiptChooseTrip
	{
		margin:10px 0;
		width:100%;
	}

#receipt #discountAndAdditions {
	width: 100%;

	li {
		padding-bottom: 6px;
	}

	.discount {
		color: #390;
		font-weight: bold;

		&.strike{

			span{
				text-decoration:line-through;
			}
		}
	}
}

/*RECEIPT*/
#receipt {
	.dashed-box {
		width: 100%;
		.box-sizing();
		border: none;

		span.title {
			font-size: 16px;
			font-weight: bold;
			margin-bottom: 10px;
			display: inline-block;
		}

		span.sub-title {
			font-size: 16px;
			font-weight: bold;
			clear: both;
			display: inline-block;
		}
	}

	.pnlwait2,
	.pnlwait4 {
		width: 100%;
	}

	@media @tablet, @mobile {
		.pricelabel .price-popup input:checked+span{
			left:auto !important;
			right:-10px !important;
			z-index:99999 !important;
			&:after{
				right:6.5% !important;
			}
		}
	}
}


#receipt-mobile-bar{
	position:fixed;
	bottom:-50px;
	left:0;
	width:100%;
	z-index:333;
	height:50px;
	background:@color-white;
	padding:10px 20px;
	box-sizing:border-box;
	@header-default();
	transition: bottom 2s ease 0s; /* only transition top property */
	display:flex;
	justify-content:space-around;
	align-items: center;
	box-shadow: 0 0 12px -3px #000;

	&.show{
		bottom:0;
	}
}


.excluded-costs {
	width: 100%;
	color: @color-text-subtle;
	clear: both;
	font-weight:300;
	font-size:12px;
	line-height:20px;

	.excluded {
		width: 100% !important;
		margin-bottom:10px;
	}

	ul{
		width:100% !important;
		li{
			width:100%;
			padding-bottom:6px;
			line-height:20px;
		}
	}
}

#ctl00_ContentPlaceContentBlock3_Receipt_pnlButtonSave{
	margin-top:15px;
	float:left;
	clear:both;
	width:100%;
}

#receipt{
	ul#localTaxAndCosts{
		display:flex;
		flex-direction:column;
		li{
			display:flex;
			flex-direction:row;
			column-gap:8px;
			& > span:first-child{
				flex:1;
			}
		}
	}
}