@import "./StepIndicator.css";
@import "./FormStepField.css";
@import "./FormHeader.css";
@import "./StateCityField.css";
@import "./SuccessMessage.css";

.portlet,
.portlet-content,
.portlet-header {
    padding: 0 !important;
    margin: 0 !important;
}

.form-landingpage {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    overflow: hidden;
    position: relative;
    background-color: transparent;
}

.form-landingpage
 .form-container {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    width: 100%;
    max-width: 725px;
    height: fit-content;
    gap: 24px;
}

.form-landingpage
 .form-container
    .stepped-form{
        display: flex;
        width: 100%;
        flex-direction: column;
        gap: 16px;
}

.form-landingpage
 .form-container
    .lgpd-data{
        display: flex;
        width: fit-content;
        gap: 8px;
        align-items: center;
        align-self: start;
}

.form-landingpage
 .form-container
    .lgpd-data
        .lgpd-data-icon{
            content: url("data:image/svg+xml,%3Csvg%20width%3D%2226%22%20height%3D%2226%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20width%3D%2226%22%20height%3D%2226%22%20rx%3D%223%22%20fill%3D%22%23E7F1F7%22%2F%3E%3Cmask%20id%3D%22a%22%20style%3D%22mask-type%3Aalpha%22%20maskUnits%3D%22userSpaceOnUse%22%20x%3D%225%22%20y%3D%225%22%20width%3D%2215%22%20height%3D%2215%22%3E%3Cpath%20fill%3D%22%23D9D9D9%22%20d%3D%22M5%205h15v15H5z%22%2F%3E%3C%2Fmask%3E%3Cg%20mask%3D%22url(%23a)%22%3E%3Cpath%20d%3D%22M8.75%2018.75c-.344%200-.638-.122-.883-.367A1.204%201.204%200%200%201%207.5%2017.5v-6.25c0-.344.122-.638.367-.883S8.407%2010%208.75%2010h.625V8.75c0-.865.305-1.602.914-2.21a3.012%203.012%200%200%201%202.211-.915c.865%200%201.602.305%202.21.914.61.61.915%201.346.915%202.211V10h.625c.344%200%20.638.122.883.367s.367.54.367.883v.813a3.557%203.557%200%200%200-.586-.141%204.373%204.373%200%200%200-.664-.047c-1.208%200-2.24.427-3.094%201.281-.854.854-1.281%201.886-1.281%203.094%200%20.469.068.906.203%201.313.136.406.328.802.578%201.187H8.75Zm5.29-.29a3.012%203.012%200%200%201-.915-2.21c0-.865.305-1.602.914-2.21a3.012%203.012%200%200%201%202.211-.915c.865%200%201.602.305%202.21.914.61.61.915%201.346.915%202.211%200%20.865-.305%201.602-.914%202.21-.61.61-1.346.915-2.211.915a3.012%203.012%200%200%201-2.21-.914ZM10.624%2010h3.75V8.75c0-.52-.182-.964-.547-1.328a1.808%201.808%200%200%200-1.328-.547c-.52%200-.963.182-1.328.547a1.808%201.808%200%200%200-.547%201.328V10Zm6.29%205.977a.904.904%200%200%200%20.273-.665.904.904%200%200%200-.274-.664.904.904%200%200%200-.664-.273.904.904%200%200%200-.664.273.904.904%200%200%200-.274.665c0%20.26.092.481.274.664a.904.904%200%200%200%20.664.273c.26%200%20.482-.091.664-.273Zm.21%201.93c.27-.147.495-.35.672-.61a2.783%202.783%200%200%200-.75-.32%203.155%203.155%200%200%200-1.594%200c-.26.067-.51.174-.75.32.177.26.401.463.672.61.27.145.563.218.875.218.313%200%20.604-.073.875-.219Z%22%20fill%3D%22%233C89B7%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
            display: inline-flex;
            width: 26px;
            height: 26px;
            flex-shrink: 0;
            align-items: center;
            justify-content: center;
            border-radius: 3px;
}

.form-landingpage
 .form-container
    .lgpd-data
        .lgpd-data-text{
            display: inline;
            font-family: 'oxygen-regular', var(--font-family-figtree, Figtree), sans-serif;
            color: var(--Colour-ranges-Secondary-secondary-500, #3C89B7);
            font-size: 12px;
            font-weight: 600;
            letter-spacing: -0.36px;
}

@media (min-width:744px) and (max-width: 1280px){
    .form-landingpage .form-container {
            gap: 16px;
    }

    .form-landingpage .form-container .stepped-form {
        margin-top: 8px;
    }
}

@media (max-width:743px){
    .form-landingpage
     .form-container {
         width: 100%;
         height: fit-content;
    }

    .state-city-fields {
        gap: 16px;
    }
}
