.woocommerce-billing-fields, .woocommerce-shipping-fields{
	pointer-events: all !important;
}

.cp_table label {
	display: inline-block;
	padding: 6px 10px;
	margin: 3px;
	border: 1px solid #ccc;
	border-radius: 4px;
	cursor: pointer;
	transition: 0.2s;
}

.cp_table input:checked + label {
	background-color: var(--ast-global-color-0);
	color: white;
}


.occlusion-fields {
    display:flex;
    
    gap:20px;
	.ntp_slider{
		display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 10px;
        align-items: center;
        border: 2px var(--ast-global-color-0) solid;
        padding: 10px;
        border-radius: 15px;
	}
    .ntp_slider-col{
        display:flex;
		flex-direction:column;
        gap:20px;
    }
	.radio_slider input[type="radio"] {
		display: none;
	}
	.radio_slider label span {
		display: inline-block;
		padding: 8px 14px;
		border: 2px solid #ccc;
		border-radius: 8px;
		cursor: pointer;
		transition: 0.2s;
		  box-sizing: border-box;
	}

	.radio_slider input[type="radio"]:checked + span {
		border-color: var(--ast-global-color-0);
		background-color: var(--ast-global-color-0);
		
		color: #fff;
	}
}

.extractions-fields .cp_squares, .restrictions-fields .cp_squares, .paint-fields .cp_squares{
    width:min-content;
    display:grid;
    gap:20px;
    grid-template-columns:repeat(2, 1fr);

    .cp_l-col,.cp_r-col {
        display:flex;
        flex-direction:column;
        gap:20px;
    }
    
    .cp_table {
         display:grid;
        grid-template-columns:repeat(8, minmax(60px, 1fr));
        gap:0px;
        & label{
            max-width:50px;
            text-align:center;
            width:100%;
            margin:0px;
            padding:10px 0px;
        }
    }
}

.restrictions-fields{
		fieldset{
			border:none;
			
		}
		.cp_textarea-container{
			margin-top:20px;
		}
		
		textarea{
			resize: vertical;
			
		}
	}
	
	


.paint-fields input[type="checkbox"]:checked + input.shade-value + label {
	border-color: var(--ast-global-color-0);
	background-color: var(--ast-global-color-0);		
	color: #fff;
}

@media screen and (max-width:768px){
    .occlusion-fields {
        flex-direction:column !important;
        & .ntp_slider{
            flex-direction:column;
        }
    }

    .extractions-fields, .extractions-fields, .paint-fields, .restrictions-fields {
        overflow-x:scroll;
        
        & .cp_squares{
            scroll-snap-type: x mandatory;
            max-width:100%;
			overflow-x: scroll;
            & label{
                scroll-snap-align: start;
            }
        }
    }

    
}