import { styled } from "styled-components";
import { Colors } from "@/app/components/common/variable";
import { device } from "@/app/components/common/Devices";

export const ContactFormRow = styled.div`
    border-radius: 23px;
    background:${Colors.white} ;
    box-shadow: 0px 20px 52px rgba(0, 0, 0, 0.10);
    padding: 62px 50px;
    h4{
        margin-bottom: 30px;
    }
    .form-btn-group{
        flex-wrap: wrap;
        grid-gap: 20px;
    }
    
    @media ${device.laptop}{
        padding: 40px;
    }
    @media ${device.tablet}{
        padding: 30px;
    }
    @media ${device.mobile}{
        padding: 20px;
        .form-btn-group{
            grid-gap: 10px;
        }
        h4{
            margin-bottom: 20px;
        }
    }
`;