body{
    font-family: "Inter", sans-serif;
}
.container{
    width: 40%;margin: 0 auto; margin: 40px 5vw;
}
.first-unit,.third-unit{
    border: 0.9px solid #C8C8C8;
}
.specification1,.specification3{
    display:none;padding:0px 26px;
}
.size-dropdown{
    width: 29%; padding:20px 5px 20px 20px; display: flex; flex-direction: column; gap: 10px;
}.color-dropdown{
    width: 25%; padding:20px 5px 20px 5px; display: flex; flex-direction: column; gap: 10px;
}
.percent{
    margin-left: 15px;
background-color: #FF6B82;
padding: 2px 8px;
color: white;
font-size:14px;
}
.styled-text {
text-align: center;
margin: 20px 0;
display: flex;
justify-content: center;
text-align: center; 
font-size: 25px; 
font-weight: 600;
color: #FF6B82;
}

.styled-text span {
position: relative;
display: inline-block;
padding: 0 10px;
}

.styled-text::before,
.styled-text::after {
content: "";
flex-grow: 1;
height: 1px;
background-color: #C8C8C8;
margin: 0 10px;
top: 15px;
position: relative;
}

.styled-text span::before {
right: 100%;
margin-right: 10px;
}

.styled-text span::after {
left: 100%;
margin-left: 10px;
}

.radio-btn {
appearance: none; 
width: 20px;     
height: 20px;
border-radius: 50%; 

margin-right: 10px;
cursor: pointer;
outline: none;
position: relative; 
}

.radio-btn::before {
content: ''; 
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%; 
border: 2px solid #333; 
transition: border-color 0.1s ease;
}

.radio-btn::after {
content: ''; 
position: absolute;
top: 5px;
left: 5px;
width: 14px;
height: 14px;
border-radius: 50%; 
background-color: transparent; 
transition: background-color 0.3s ease;
}


.radio-btn:checked::before {
border-color: #FF6B82; 
}

.radio-btn:checked::after {
background-color: #FF6B82; 
}
.price-box{
display: flex;
flex-direction: column;
gap:40px;
}
#dropdown1,#dropdown2{
width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px;
}
.color-label,.size-label{
font-size: 14px;padding:0px 20px;
}
.most-popular{
width:160px; background-color: #FF6B82;color:white;text-align: center;padding:10px;font-size:18px;margin-top: 0px;margin-bottom: 0px; position: absolute;top: -14px; right: 10px;border-radius: 5px;
}
.first-unit,.second-unit,.third-unit{
    padding: 38px 35px 20px;
    cursor:pointer;
}
.free-text{
    font-size:16px;color:#FF6B82;font-weight:500;
}
.add-to-cart{
    color: white; background-color: #FF6B82;
            width: 100%;
            border: none;
            padding: 15px;
            border-radius: 5px;
            font-size: 16px;
            margin-top: 10px;
}
.powered-by-text{
    font-size:16px;color: #00000066;
}
.powered-div{
    display:flex;justify-content:end;
}
.free-delivery-box{
    display:flex;justify-content: space-between;
}
#priceDisplay{
    font-size:16px;
}
.unit-name{
    display:flex;flex-direction:column;margin-left: 10px;
}
.unit-text{
    margin-top:0px;margin-bottom:0px;
}
.unit-price-tag{
    margin-top:0px;
    margin-bottom:0px;
}
@media only screen and (max-width:768px){

.size-dropdown{
    width:35%;
}
.color-dropdown{
    width:30%;
}
#dropdown1,#dropdown2{
    padding:8px 4px;
}
.container{
    width:95%;
    margin:40px 3vw;
}
.first-unit,.second-unit,.third-unit{
    padding: 38px 20px 20px;
}
        
}
@media only screen and (min-width:768px) and (max-width:992px){
.container{
    width:70% !important;
}
.size-dropdown{
    width:25% !important;
}
.color-dropdown{
    width:20%;
}
#dropdown1,#dropdown2{
    padding:8px;
}
}
