/*
 * Company Name: Obodo
 * Website: https: //obodo.tech
 * Developers: Adham Arej, Salman Arej
 * Creation Date: December 19, 2024
 * Description: Custom CSS file for styling Salesforce components and responsive UI design.
 */
:root {
    --font-small: 0.875rem;
    --font-medium: 1rem;
    --font-large: 1.125rem;
    --font-xlarge: 1.25rem;
    --primary-color: #0047BB;
}

.form-control:focus,
.slds-input:focus,
.slds-combobox__input:focus,
.slds-combobox__input.slds-has-focus {
    border-color: #0056b3;
    box-shadow: 0 6px 12px rgba(0, 123, 255, 0.2);


}

.slds-p-around_medium a {
    font-size: var(--font-medium);

}

.slds-modal__container .dt-outer-container,
.slds-modal__container .slds-table_header-fixed_container {
    height: 10px !important;
}

.mainBody .bPageBlock .detailList th {

    padding-top: 5px;
    padding-bottom: 5px;
}

.slds-table_header-fixed_container {
    padding-top: 0rem;
}

.slds-file-selector__dropzone {
    border: none;
}

.slds-modal__container .slds-p-around_medium {
    font-size: var(--font-small);
    color: red;
    border-top-right-radius: var(--slds-c-modal-radius-border, var(--sds-c-modal-radius-border, var(--lwc-borderRadiusMedium, 0.25rem)));
    border-top-left-radius: var(--slds-c-modal-radius-border, var(--sds-c-modal-radius-border, var(--lwc-borderRadiusMedium, 0.25rem)));
}

.slds-form-element {
    font-family: Calibri, Arial, sans-serif;
    font-size: 16px;

    line-height: 1.5;

}

.slds-scope .slds {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0px;
}

.slds-scope .mainBody {
    flex: 1;
    padding: 1rem;
}

.slds-scope footer {
    padding: 1rem;
    text-align: center;
    background: #f8f8f8;
}

.detailList .dataCol table {
    width: 90%;
    margin: 1rem auto;
    border-collapse: collapse;
    font-size: 16px;
    background-color: #f8f8f8;
    border: 1px solid #ddd;
}

.detailList .dataCol table td,
.detailList .dataCol table th {
    padding-left: 1rem;
    padding-right: 1rem;

    text-align: left;
    border: 1px solid #ddd;
}

.detailList .dataCol table th {
    background-color: var(--primary-color);
    color: white;
}

.detailList .dataCol table tr:nth-child(even) {
    background-color: #f2f2f2;
}

.mainBody .slds-card .bPageBlock,
.mainBody .slds-card .bResource .secondaryPalett {
    background-color: #E3E3E3 !important;
}

.slds-icon-utility-down {
    display: block;
}

.slds-form-element__label b {
    text-transform: capitalize;
}

.comm-page-custom-siteplanregistration .slds-form-element_horizontal:not(.slds-is-editing) {
    padding-right: 0;
}

.slds-input-has-icon .slds-input__icon {
    width: 0.1rem !important;
    height: var(--lwc-squareIconMediumContentAlt, 0.875rem);
    position: absolute;
    top: 50%;
    margin-top: -.4375rem;
    line-height: 1;
    border: 0;
    z-index: 2;
    right: 1.3rem;
}

.footer {
    margin-top: 1px;
}

.slds-button {
    text-transform: capitalize;

}

.slds-button_brand {}


.slds-docked-form-footer {


    width: 100%;
    margin-top: auto;
    position: absolute;
}

.slds-p-horizontal_medium,
.slds-p-horizontal--medium {
    padding-left: 0px;
    padding-right: 0px;
}



.slds-text-color_error {
    font-size: var(--font-medium);
    font-weight: 700;
    margin-left: 0.25rem;
}


.slds-p-left_small {
    padding-left: 0px;
}

.slds-p-right_medium {
    padding-right: 0px;
}

.slds-is-relative {
    position: static;
}

.slds-p-bottom_x-large {
    padding-bottom: 62px;
}


[c-mp_newsiteplanrequestwebcomponent_mp_newsiteplanrequestwebcomponent]>h2 {
    margin-left: 5px;

}

.slds-form-element {
    font-size: 17px;
}

.slds-form-element__label {
    font-size: var(--font-medium);


}

.slds-table {
    font-size: var(--font-small);
}

.slds-radio__label {
    font-size: 16px;

}

.slds-button,
.slds-icon-action-delete {

    margin-right: 5px
}

div[align="right"] lightning-icon.slds-icon-action-delete {
    margin-right: 7px !important;

}

.comm-page-custom-siteplanregistration .slds-icon-action-delete .slds-icon_xx-small,
.comm-page-custom-siteplanregistration .slds-icon-action-delete .slds-icon_small {

    width: 1.2rem;
    height: 1.2rem;
}

@media (max-width: 768px) {
    .comm-page-custom-siteplanregistration .slds-form-element_horizontal:not(.slds-is-editing) {
        padding-right: 3px;
    }

    .comm-page-custom-siteplanregistration .slds-table_cell-buffer tr>th:last-child {

        padding-right: 3px;
    }



    .slds-form-element {
        font-size: var(--font-medium);

    }

    .slds-radio .slds-form-element__label {
        font-size: 16px;

    }

    .slds-radio__label {
        font-size: 16px;

    }

    .comm-page-custom-siteplanregistration .slds-icon-action-delete .slds-icon_xx-small,
    .comm-page-custom-siteplanregistration .slds-icon-action-delete .slds-icon_small {
        width: 1rem;
        height: 1rem;
    }
}



@media (min-width:1400px) {

    .my-md-5 {
        margin-bottom: 18rem !important;
    }
}


@media (min-width: 768px) and (max-width: 1024px) {
    .slds-form-element {
        font-size: 16px;

    }

    .slds-radio .slds-form-element__label {
        font-size: 16px;

    }

    .slds-radio__label {
        font-size: 16px;

    }
}


@media (min-width: 1024px) {
    .slds-form-element {
        font-size: var(--font-medium);

    }

    .slds-radio .slds-form-element__label {
        font-size: var(--font-medium);

    }

    .slds-radio__label {
        font-size: 16px;

    }
}

.request-type-container {
    font-family: Calibri, Arial, sans-serif;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 20px;
}

.request-type-container legend {
    font-weight: bold;
    font-size: 18px;
    color: #333;
    margin-bottom: 10px;
}

.request-type-container .slds-form-element__label {
    font-size: 16px;
    color: #000;
}

.request-type-container input[type="radio"] {
    width: 18px;
    height: 18px;
    accent-color: #007bff;
}

.request-type-container label:hover {
    color: #007bff;
    cursor: pointer;
}

.uaePassImg {
    background: url('../image/UAEPASS-EN-.svg') no-repeat;

    display: inline-block;
    height: 54px !important;
    width: 310px;
    background-size: contain;

    background-position: center;

}

.salesforceIdentityForgotPassword2 .inputContainer input {
    width: 100%;



    font-size: 16px;

    padding: 10px 15px;

    border-radius: 8px;


}



@media (min-width: 767px) {

    .slds-form-element_horizontal .slds-form-element__control,
    .slds-form_horizontal .slds-form-element .slds-form-element__control,
    .slds-form_stacked .slds-form-element_horizontal .slds-form-element__control {

        padding-right: 3%;
        clear: none;
    }
}

@media (max-width: 767px) {
    .salesforceIdentityForgotPassword2 .inputContainer input {
        font-size: 14px;
    }

    .slds-checkbox td {
        line-height: 1.6;
    }

    h2.mb-4 {
        font-size: 1.5rem;

        line-height: 1.8rem;

    }

    .container {
        max-width: 100%;
        margin: 0 auto;

    }

    .form-group {
        margin-bottom: 15px;
    }

    .col-md-6 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .rowVar .col-md-6 {
        width: 50%;

        flex: 0 0 50%;
        max-width: 100%;
        margin-bottom: 10px !important;
    }

    .rowVar .col-md-6 .buttonlinks {
        font-size: 14px !important;

        padding: 10px 0;


    }

    .col-md-6.border-left.py-5.py-md-0 {
        display: flex;
        flex-direction: column;

        align-items: center;

        justify-content: center;

        height: auto;

    }

    .border-left {
        border-left: 1px solid rgb(255, 255, 255) !important;
    }

    .salesforceIdentityForgotPassword2 .inputContainer,
    .form-control {
        border-radius: 8px;

        padding: 15px;

        border: 1px solid #ccc;

        transition: border-color 0.3s ease;
    }

    .form-control:focus {
        border-color: var(--primary-color);

        box-shadow: 0 0 5px rgba(0, 71, 187, 0.5);

    }

    footer .footerbg {


        background-size: cover;

        background-repeat: no-repeat;



        padding-top: 0;


        align-items: center;

        justify-content: center;

        color: #333;

        font-size: 14px;

    }

    .siteforceContentArea .comm-layout-column:not(:empty) {
        padding-top: 0;

    }

    .container .headerrow {
        margin-top: 15px;
        margin-bottom: 15px;
        display: flex;
        flex-wrap: nowrap;
        margin-left: -5px;
        margin-right: 15px;
    }

    .headerrow .ddalogo {
        background: url(../image/dda-logo-new.svg) no-repeat center right;

        background-size: contain;
        height: 50px;

        width: 150px;

        margin: 10px;

        cursor: pointer;

    }

    .headerrow .dubailogo {
        background: url(../image/newgovtlogo.svg) no-repeat center center;

        background-size: contain;
        height: 50px;

        width: 150px;

        margin: 10px;

        cursor: pointer;

    }


    .rowVar.mt-1.mt-md-5.justify-content-center {
        display: flex;
        justify-content: center;
        width: fit-content;

        margin: 0 auto;

        gap: 20px;

    }

    .btn-primary,
    .rowVar .col-md-6 .buttonlinks,
    .rowVar .btn {
        color: #fff;

        background-color: var(--primary-color);

        border: none;

        text-transform: uppercase !important;

        font-weight: bold !important;

        font-size: 16px !important;

        margin-left: 22px;

        height: 50px;

        width: 210px;



        border-radius: 8px;

        align-items: center;
        text-align: center;
        padding: 7px;
    }


    .rowVar .btn:hover {
        background-color: #003399 !important;

        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15) !important;

    }



    .rowVar .btn:hover {
        background-color: #003399;

        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);

    }

    .navigation {
        display: flex;
        justify-content: center;


        background-color: var(--primary-color);

        padding: 10px 0;

    }

    .navlink {
        color: #ffffff navlink !important;
        text-decoration: none;
        margin: 0 15px;
        font-weight: bold;
        text-align: center !important;
        white-space: nowrap;
        display: inline-block;
    }

    .form-group .rowVar {
        display: flex;
        flex-direction: column;
        align-items: center;

    }

    .slds-form-element_horizontal .slds-form-element__help {

        margin-left: 3%;
    }

    .salesforceIdentityForgotPassword2 {
        margin-top: 2%;
        padding-left: 5%;
        padding-right: 5%;
    }

    .slds-grid.cMPPortalTheme[data-aura-rendered-by="87:0"] {
        margin-top: 50px;



    }

    .uiOutputRichText[data-aura-rendered-by="27:2;a"] {
        margin-top: 15px;
    }

    .slds-p-around_medium a,
    .slds-form-element_horizontal .slds-form-element__label {
        font-size: var(--font-medium);

    }

}

@media (min-width: 768px) and (max-width: 1024px) {
    .slds-form-element_horizontal .slds-form-element__label {
        font-size: 13px;

    }

    .container {
        max-width: 90% !important;
        margin: 0 auto !important;
    }


    .btn-primary,
    .rowVar .col-md-6 .buttonlinks,
    .rowVar .btn {
        color: #fff;
        background-color: var(--primary-color);
        border: none;
        text-transform: uppercase;
        font-weight: bold !important;
        font-size: 16px;
        height: 50px;
        width: 210px;
        text-align: center !important;
        border-radius: 8px;
        margin: 10px auto !important;
        align-items: center;
        text-align: center !important;
        padding: 7px;
        gap: 5px;
    }



    .salesforceIdentityForgotPassword2 .inputContainer .form-control {
        font-size: 1.2rem !important;
        padding: 10px !important;
        width: 100% !important;
        max-width: 300px !important;

        margin: 10px auto !important;

    }


    .changPasswordLink {
        text-align: center !important;
        margin-top: 10px !important;
    }


    .buttoninfo {
        margin: auto !important;
    }


    .border-left {
        border-left: 1px solid #ccc !important;
        padding-left: 20px !important;
        margin-left: 10px !important;
    }


    .row {
        justify-content: center !important;
        margin: 0 !important;
    }


    .uaePassImg {
        max-width: 250px;
        margin: 0 auto;

        display: block;
    }


    .img-fluid {
        max-width: 200px;
        height: auto !important;
        margin: -20px auto;

    }


    .text-center.p-1.mt-3.mx-5.p-md-5.mx-md-5 {
        padding: 1rem !important;
        margin: 2rem;
    }


    .rowVar.mt-1.mt-md-5.justify-content-center {
        display: flex;
        justify-content: center mx-md-5 !important;
        width: fit-content;
        margin: 0 auto;

        gap: 20px;

    }

    .col-md-6.col-lg-3.mb-1 {
        flex: 0 0 45%;
        max-width: 45%;

    }


    .col-md-6.border-left.py-5.py-md-0 {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 auto !important;
        text-align: center !important;

    }


    h2.mb-4 {
        text-align: center;
    }


    .col-md-6 {
        display: flex;
        justify-content: center;

        align-items: center;

        height: 100%;

        text-align: center;
    }

    .form-group .rowVar {
        display: flex;
        flex-direction: column;
        align-items: center;

    }

    footer .footerbg {
        height: 50vh;

        background-image: url('../image/footer.png');
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: contain;
    }

}

@media (min-width: 1024px) and (max-width: 1500px) {


    footer .footerbg {
        height: 50vh;

        background-image: url('../image/footer.png');
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: contain;
    }
}

@media (min-width: 550px) {
    .slds-grid.cMPPortalTheme[data-aura-rendered-by="87:0"] {
        flex: 1 !important;

        display: flex;

        flex-direction: column;

        justify-content: center;

        align-items: center;



    }
}


body.comm-page-check-password,
body.comm-page-forgot-password {
    height: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;

}

.slds-grid.cMP_CommunityTheme[data-aura-rendered-by="82:0"],
.slds-grid.cMPPortalTheme[data-aura-rendered-by="87:0"] {
    flex: 1 !important;

}



body.comm-page-check-password footer,
body.comm-page-forgot-password footer {
    text-align: center;
    padding: 10px 0;
    background-color: #F4F4F4;
    color: #333;
    position: relative;

    bottom: 0;
    width: 100%
}


.inputContainer {
    display: flex;
    align-items: center
}

.uiButton {
    border-radius: 8px !important;
}

.comm-panels-container {
    height: 0px !important;

    min-height: 0px;

    overflow: visible;

}





.salesforceIdentityForgotPassword2 .inputContainer input:focus {
    border-color: var(--primary-color);

    box-shadow: 0 0 5px rgba(0, 71, 187, 0.5);

}

@media (max-width: 767px) {
    footer {

        bottom: 0;
        width: 100%;
    }
}



 
div:not([id]) .slds-table_bordered {
    border: none;

    border-collapse: collapse;

    border-spacing: 0;

}



div:not([id]) .slds-table_header-fixed_container[lwc-392cvb27u8q]>.slds-scrollable_y[lwc-392cvb27u8q]::before {
    border-bottom: none;

}



.modal-container.slds-modal__container[data-aura-rendered-by="105:161;a"] .slds-modal__footer {
    display: block;
}

.uiPanel--medium .panel-header button:first-of-type,
.uiPanel--default .panel-header button:first-of-type {

    text-align: center;
}

@media (max-width: 768px) {

    .mainBody .bPageBlock .detailList {
        width: 100%;

        border-collapse: collapse;

    }

    .mainBody .bPageBlock .detailList tr {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .mainBody .bPageBlock .detailList d {
        border: 1px solid #ccc;

        padding: 10px;

        width: 100%;

        box-sizing: border-box;

        text-align: left;

    }

    .mainBody .bPageBlock .detailList th {
        font-weight: 400;
        padding-top: 7px;
        padding-bottom: 7px;
    }

    .mainBody .bPageBlock .detailList .dataCol {
        width: 100%;
    }



    .slds-scope .slds-card td {
        font-size: 18px;

    }
}


.comm-page-custom-siteplanregistration h2[style*="font-family:Arial;font-size:12px; color : red"] b {

    font-size: var(--font-small);
    color: #EB0000;

}

.slds-assistive-text[lwc-4897l11qtae] {
    color: #FFFFFF;
    background-color: #D32F2F;
    padding: 5px;
    border-radius: 4px;

    font-size: 14px;
}


.comm-page-custom-siteplanregistration .slds-input {
    border-color: #949494;
    background-color: #ffffff;
    font-size: var(--font-small);
    border-radius: 5px;

}

::placeholder {
    color: #a9a9a9;
}

.comm-page-custom-siteplanregistration .slds-input:focus {
    border-color: #0056b3;
    box-shadow: 0 0 5px rgba(0, 86, 179, 0.5);
}

.comm-page-custom-siteplanregistration .slds-form-element__help {

    font-size: 14px;
    margin-top: 5px;
}



.customfooter {
    z-index: 1;
    background-color: #f8f9fa;
    padding: 10px 15px;
    border-top: 1px solid #ddd;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer a,
.customfooter a {
    color: rgb(0, 0, 238);

    text-decoration: underline;
    font-size: var(--font-small);
    padding: 2px 4px;
}

.customfooter a:hover {
    color: rgb(0, 102, 204);
    background-color: rgb(240, 240, 240);
    text-decoration: none;
}

.customfooter p {
    margin: 0px;
    font-size: 14px;
    color: #333;
}

.customfooter .left-text {
    text-align: left;
}

.customfooter .right-text {
    text-align: right;
}
.comm-page-custom-siteplanregistration .slds-checkbox {
display:block;
 border: #000;
}
.slds-checkbox table {
    border-collapse: collapse;

    width: 100%;
}

.slds-checkbox tr {
    display: flex;
    flex-direction: column;
}

.slds-checkbox td {
        line-height: 1.6;   
font-size: var(--font-medium);
    text-align: left;
    width: 100%;
}
 
.slds-scope #j_id0\:frm\:j_id15 p {
    color: #CC0000 !important;


    font-weight: 500;

}

html body.slds-scope .mainBody .slds-card {
    background: var(--primary-color) !important;
}

.slds-scope a[href*="FeePayment"] {
    color: rgb(0, 0, 238);

    text-decoration: underline;

}

.slds-scope a[href*="Home"] {
    color: rgb(0, 0, 238);

    text-decoration: underline;

}

@media(max-width:376px) {
    .slds-card__body .slds-container_fluid .slds-text-heading_medium {
        padding: 0px 2px;
    }

    .slds-col {
        width: 100%;
    }

    .navlink {
        margin: 0px;
    }
}

.slds-modal__container h4 {
    font-size: var(--font-large);

}
.comm-page-login-home .slds-modal__footer  {
    display: flex;
    justify-content: center;
    align-items: center;
}
.slds-combobox_container .slds-dropdown {
    max-height: 15vh;
    overflow-y: auto;
}