/*Kamerkeuze*/

.roomBlock, 
.transportBlock
{
	width:600px;
	@pv-roomblock();
}

.priceBlock
{
	@pv-priceblock();
}

	.roomBlock .rooms, .transportBlock .transports
	{
		width:100%;
	}

	.roomBlock .selectedRooms
	{
		margin:5px 0;
	}

		.roomBlock .selectedRooms li
		{
			margin-bottom:5px;
		}

.roomLogo
{
	.box-sizing();
	width:72px;
	padding:6px;
background: #FFFFFF;
border: 1px solid #BFDDEF;
box-sizing: border-box;
border-radius: 4px;

	@pv-matrix-roomlogo();
}

.roomInfo
{
	margin-left:15px;
	width:513px;
}

	.roomInfo .row
	{
		width:100%;		
	}

	.roomInfo .roomTitle
	{
		font-weight:bold;		
		padding-top:3px;
		margin-right:5px;
	}

	ul.ico_travelers li
	{
		float:left;
	}

	ul.ico_travelers li.adult
	{
		width:10px;
		height:27px;
		margin-right:4px;
		@pv-ico-travelers-adult();
	}
        ul.ico_travelers li.adult.light
		{
			@pv-ico-travelers-adult-light();
		}

	ul.ico_travelers li.child
	{
		width:7px;
		height:20px;
		margin-right:5px;
		margin-top:7px;
		@pv-ico-travelers-child();
	}
		ul.ico_travelers li.child.light
		{
			@pv-ico-travelers-child-light();
		}

	ul.ico_travelers li.infant
	{
		width:11px;
		height:16px;
		margin-right:3px;
		margin-top:11px;
		@pv-ico-travelers-infant();
	}

		ul.ico_travelers li:last-child
		{
			margin-right:0px;
		}

.box-matrix .availableRooms h4{
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 5px;
    color: #bf0000;
}

.box-matrix .availableRooms span.wait-sub-title {
    @pv-matrix-availablerooms-h5();
}

.box-matrix .availableRooms div .dashed-box {
    border:none;
    h5 {
        margin-top:0 !important;
        color:@pv-color-red;
    }
}

.box-matrix .prices .availableRooms,
.box-matrix .prices .availableTransports {
	margin: 10px 0;
	border: none;
	background: #F9F9F9;
	border-radius: 2px;
}

.box-matrix .prices .availableRooms {
	.h5 {
		color: @dr-color-blue;
		font-weight: bold;
		font-size: 16px;
		line-height: 24px;
		margin: 10px 0;
	}

	.room-selector {
		height: 58px;
		background:#fff;
		margin-bottom: 14px;
		position: relative;
		border: 1px solid #bfddef;
		border-radius: 4px;
		box-sizing: border-box;
		width: 50%;
		padding: 22px 2px 2px 45px;
		display:inline-block;
		cursor:pointer;

		div.h5 {
			position: absolute;
			top: 10px;
			left: 45px;
			font-family: Lato;
			font-weight: bold;
			font-size: 10px;
			line-height: 12px;
			color: #0077bf;
			text-transform: uppercase;
			margin:0;
			pointer-events:none;
			z-index:2;
		}

		select{
			border:none;
			z-index:1;
			background:none;
			position:absolute;
			top:0;
			left:0;
			padding: 18px 0 0 45px;
			width:100%;
			height:100%;
		}

		&::before {
			position: absolute;
			top: 15px;
			left: 10px;
			content: '';
			width: 24px;
			height: 24px;
			filter: invert(30%) sepia(97%) saturate(1109%) hue-rotate( 177deg) brightness(96%) contrast(101%);
			background: url('img//Base/ico/2021/Transport/Hotel.svg') no-repeat 0 0;
			z-index:2;
			pointer-events:none;
		}

		&::after {
			position: absolute;
			right: 10px;
			top: 15px;
			content: '';
			width: 24px;
			height: 24px;
			filter: invert(30%) sepia(97%) saturate(1109%) hue-rotate( 177deg) brightness(96%) contrast(101%);
			background: url('img//Base/ico/2021/General/Arrow Down.svg') no-repeat 0 0;
			z-index:2;
			pointer-events:none;
		}
	}
}

.box-matrix .prices .roomBlock span.wait-sub-title,
.box-matrix .prices .tripBlock span.wait-sub-title {
	margin: 10px 0;

	&:first-child {
		margin: 15px 0 10px 0;
	}
}

#assignTravelers
{
	margin-bottom:10px;
	border-spacing:10px 0px;
	border-collapse:separate;
}
	#assignTravelers .travelerLabel
	{
		width:222px;
        span {
            font-weight:@pv-font-weight-regular !important;
        }
	}

	#assignTravelers .travelerSelect
	{
		.box-sizing();
		width: 85px;

		@pv-matrix-room-travelerselect();
        @pv-custom-checkbox();
	}

	#assignTravelers td.travelerSelect
	{
		padding:5px 23px !important;

        .radio {
            float:left;
            margin-bottom: 8px;
            padding-left: 17px !important;
        }
	}

	#assignTravelers td
	{
		height:32px
	}
	
		/* one to four item */
		#assignTravelers .travelerSelect:only-child,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(2),
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(2) ~ #assignTravelers .travelerSelect,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(3),
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(3) ~ #assignTravelers .travelerSelect,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(4),
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(4) ~ #assignTravelers .travelerSelect
		{
			width: 84px;	
            padding: 5px 0px;		
		}

		/* five items */
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(5),
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(5) ~ #assignTravelers .travelerSelect,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(6),
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(6) ~ #assignTravelers .travelerSelect,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(7),
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(7) ~ #assignTravelers .travelerSelect,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(8),
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(8) ~ #assignTravelers .travelerSelect
		{
			width: 25px;
			padding:0 5px;
		}

		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(5) span,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(5) ~ #assignTravelers .travelerSelect span,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(6) span,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(6) ~ #assignTravelers .travelerSelect span,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(7) span,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(7) ~ #assignTravelers .travelerSelect span, 		
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(8) span,
		#assignTravelers .travelerSelect:nth-child(2):nth-last-child(8) ~ #assignTravelers .travelerSelect span {
			display:none;
		}

		#assignTravelers .travelerSelect {
            input
		    {
                padding-left: 17px !important;
		    	height:27px;
		    	display:block;
		    	float:left;
            }
        }

		#assignTravelers .travelerSelect input:checked ~ label.adult
		{
			margin-left:5px;
			width:10px;
			height:27px;
			display:block;
			float:right;
            @pv-ico-travelers-adult();
		}

		#assignTravelers .travelerSelect input:checked ~ label.child
		{
			margin-left:5px;
			width:10px;
			height:27px;
			display:block;
			float:right;
            @pv-ico-travelers-child();
		}

		#assignTravelers .travelerSelect input:checked ~ label.infant
		{
			margin-left:5px;
			width:11px;
			height:27px;
			display:block;
			float:right;
            @pv-ico-travelers-infant();
		}

		#assignTravelers tr:first-child .travelerSelect
	    {
			@pv-matrix-room-travelerselect-first();
	    }

	    #assignTravelers tr:last-child .travelerSelect
	    {
			@pv-matrix-room-travelerselect-last();
	    }

#tbAvailableRooms
{
	border-collapse: collapse;
	border: none;
	border-spacing: 0;
}

	#tbAvailableRooms tr
	{
		margin-bottom:5px;
		float:left;
	}

    #tbAvailableRooms th 
    {
        font-weight:@pv-font-weight-semibold;
    }

	#tbAvailableRooms .rmRadio
	{
		width:34px;
        @pv-custom-checkbox();
	}
	#tbAvailableRooms .rmLogo
	{
		width:82px;
	}
	#tbAvailableRooms .rmType
	{
		width:300px;
	}

		#tbAvailableRooms .rmType .roomInfo
		{
			margin-left:0;
			width:100%;
		}

	#tbAvailableRooms .rmOccupation
	{
		width:90px;
        text-align: center;
	}
	#tbAvailableRooms .rmPrice
	{
		width:70px;
        text-align: center;
	}

.arc-dashed
{
	height:38px;
	width:100%;
	display:block;
	@pv-arc-dashed();
}

	.arc-dashed.flight
	{
		@pv-arc-dashed-flight();
	}

.arrow-dashed
{
	@pv-arrow-dashed();
}
/*Kamerkeuze*/