
/*.ResidentsMainContainer{*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: space-between;*/
/*    width: 100%;*/
/*    background: #FFF;*/
/*    border-radius: 24px;*/
/*    height: 75vh;*/
/*    padding: 24px 24px 0 24px;*/
/*}*/

/*.TopMiddleContainer{*/
/*    display: flex;*/
/*    flex-direction: column;*/

/*}*/
/* */
/*.TopContainer{*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    align-items: center;*/
/*    margin-bottom: 24px;*/
/*}*/

/*.SearchBarContainer{*/
/*    display: flex;*/
/*    justify-content: flex-start;*/
/*    width: 50%;*/
/*}*/

/*.TopContainer .SearchWrapper {*/
/*    position: relative;*/
/*    width: 90%;*/
/*}*/

/*.TopContainer .SearchInput {*/
/*    width: 100%;*/
/*    padding: 10px 12px;*/
/*    border-radius: 8px;*/
/*    background: #fff;*/
/*    color: #666;*/
/*    font-family: Inter;*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    line-height: 20px;*/
/*    border: 1px solid #ccc;*/
/*    outline: none;*/
/*    box-sizing: border-box;*/
/*    max-height: 40px;*/
/*}*/

/*.TopContainer .SearchInput:focus {*/
/*    border: 1px solid #3885FD ;*/
/*}*/

/*.TopContainer .SearchIcon {*/
/*    position: absolute;*/
/*    right: 12px;*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*/
/*    pointer-events: none;*/
/*}*/

.Action_Buttons_Container{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
}

.Action_Buttons_Container .Btn{
    padding: 8px 8px 8px 12px;
}

/*.Btn{*/
/*    width: auto;*/
/*    align-items: center;*/
/*    display: flex;*/
/*    background: none;*/
/*    border: none;*/
/*    gap: 6px;*/
/*}*/

/*.Btn span{*/
/*    font-family: Inter;*/
/*    font-size: 12px;*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    line-height: 140%;*/
/*    color: var(--root-faint---on-light, #666);*/
/*}*/

/*.Btn_Small{*/
/*    max-height: 40px;*/
/*    padding: 8px;*/
/*    border-radius: 8px;*/
/*}*/

/*.Btn_Small span{*/
/*    font-weight: 500;*/
/*    font-size: 12px;*/
/*}*/


/*.Btn_Border_lightGrey{*/
/*    border: 1.5px solid #E7E7E7;*/
/*}*/

/*.Btn_Border_lightGrey:hover{*/
/*    transition: box-shadow 0.25s ease;*/
/*    box-shadow: 0 0 5px rgba(231, 231, 231, 0.5);*/
/*}*/

/*.Btn_Border_lightGrey span{*/
/*    color: var(--root-faint---on-light, #666);*/
/*}*/

/*.Btn_lightBlue{*/
/*    background: #1A71F6;*/
/*    border: 1.5px solid #1A71F6;*/
/*}*/

/*.Btn_lightBlue:hover{*/
/*    transition: box-shadow 0.25s ease;*/
/*    box-shadow: 0 0 5px rgba(26, 113, 246, 0.5);*/
/*}*/

/*.Btn_lightBlue span{*/
/*    color: #FFF;*/
/*}*/

/*.Icon_24P{*/
/*    height: 24px;*/
/*    width: 24px;*/
/*}*/

/*.Btn_Filter{*/
/*    width: auto;*/
/*    border-radius: 8px;*/
/*    border: 1.5px solid #E7E7E7;*/
/*    align-items: center;*/
/*    gap: 6px;*/
/*    display: flex;*/
/*    padding: 8px;*/
/*    background: none;*/
/*    max-height: 40px;*/
/*}*/

/*.Btn_Filter span{*/
/*    color: var(--root-faint---on-light, #666);*/
/*    font-family: Inter;*/
/*    font-size: 12px;*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    line-height: 140%;*/
/*}*/

/*.Icon_Filter{*/
/*    height: 24px;*/
/*    width: 24px;*/
/*}*/

/*.Btn_Export{*/
/*    width: auto;*/
/*    border-radius: 8px;*/
/*    border: 1.5px solid #E7E7E7;*/
/*    align-items: center;*/
/*    gap: 6px;*/
/*    display: flex;*/
/*    padding: 8px;*/
/*    background: none;*/
/*    max-height: 40px;*/
/*}*/

/*.Btn_Export span{*/
/*    color: var(--root-faint---on-light, #666);*/
/*    font-family: Inter;*/
/*    font-size: 12px;*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    line-height: 140%;*/
/*}*/

/*.Icon_Export{*/
/*    height: 24px;*/
/*    width: 24px;*/
/*}*/

/*.Btn_Add{*/
/*    width: auto;*/
/*    border-radius: 8px;*/
/*    border: 1.5px solid #1A71F6;*/
/*    align-items: center;*/
/*    gap: 6px;*/
/*    display: flex;*/
/*    padding: 8px;*/
/*    background: #1A71F6;*/
/*    max-height: 40px;*/
/*}*/

/*.Btn_Add span{*/
/*    color: #FFF;*/
/*    font-family: Inter;*/
/*    font-size: 12px;*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    line-height: 140%;*/
/*}*/

/*.Icon_Add{*/
/*    height: 24px;*/
/*    width: 24px;*/
/*}*/


/*.InputWrapper{*/
/*    padding: 8px 16px;*/
/*    max-height: 40px;*/
/*    border-radius: 8px;*/
/*    width: 80%;*/
/*    max-width: 500px;*/
/*}*/
/* ─── your existing desktop styles ─── */
/*.TopMiddleContainer{*/
/*    height: 90%;*/
/*}*/

/*.MiddleContainer{*/
/*    display: flex;*/
/*    justify-content: flex-start;*/
/*    align-items: center;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    margin-bottom: 24px;*/
/*    border-radius: 16px;*/
/*    background: var(--Background-Light, #FFF);*/
/*}*/

/*.TableWrapper {*/
/*    width: 100%;*/
/*    max-height: 100%;           !* ← set your desired max height *!*/
/*    height: 100%;               !* fix it to that height once it hits max-height *!*/
/*    margin: 0 auto;              !* center if you like *!*/
/*    border: 1px solid var(--Neutral-100, #E7E7E7);*/
/*    border-radius: 16px;*/
/*    overflow: hidden;            !* clip any extra rows; JS will paginate them *!*/
/*}*/

/*.MyTable {*/
/*    overflow: hidden;*/
/*    border-radius: 16px;*/
/*    width: 100%;*/
/*    border-collapse: collapse;*/
/*}*/

/*.MyTable th,*/
/*.MyTable td {*/
/*    font-family: Inter, serif;*/
/*    padding: 10px;*/
/*    text-align: left;*/
/*}*/

/*.MyTable th {*/
/*    background-color: #F6F6F6;*/
/*    color: var(--Neutral-800, #454545);*/
/*    font-size: 14px;*/
/*    line-height: 20px; !* 142.857% *!*/
/*    letter-spacing: 0.1px;*/
/*    font-weight: 500;*/
/*    position: relative;*/
/*    height: 24px;*/
/*}*/

/*.MyTable tr {*/
/*    gap: 22px;*/
/*}*/

/*.MyTable td {*/
/*    height: 60px;*/
/*    border-top: 1px solid var(--Neutral-100, #E7E7E7);*/
/*}*/

/*.MyTable .Divider {*/
/*    width: 1px;*/
/*    height: 22px;*/
/*    position: absolute;*/
/*    left: 0;*/
/*    top: 12px;*/
/*    background: var(--Neutral-100, #E7E7E7);*/
/*}*/

.List_Row_Content{
    height: 66px;  /*ADDED NEW --------------------------------------------*/
}

.List_Row_Content .Checkbox_Cell{
    margin-top: 5px;
}

/*.BottomContainer{*/
/*    width: 100%;*/
/*    height: 10%;*/
/*    max-height: 60px;*/
/*    display: flex;*/
/*    justify-content: flex-end;*/
/*    align-items: center;*/
/*}*/

/*.Pagination {*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    align-items: center;*/
/*    gap: 10px;*/
/*    font-size: 14px;*/
/*    width: 100%;*/
/*}*/

/*.Pagination .PageStatus{*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*    color: var(--Neutral-500, #737373);*/
/*    !* Text/Text Reguler/text sm *!*/
/*    font-family: "Inter";*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    line-height: 150%;*/
/*    gap: 4px;*/
/*}*/

/*.Pagination .PaginationNumber{*/
/*    color: #1A71F6;*/
/*    font-family: Inter;*/
/*    font-size: 14px;*/
/*    font-weight: 400;*/
/*}*/

/*.Pagination .TotalPages{*/
/*    color: var(--Neutral-500, #737373);*/
/*    font-family: Inter;*/
/*    font-size: 14px;*/
/*    font-weight: 400;*/
/*}*/

/*.Pagination .ArrowContainer{*/
/*    display: flex;*/
/*    gap: 10px;*/
/*}*/

/*.ArrowContainer .PaginationNumber2{*/
/*    display: flex;*/
/*    border-radius: 8px;*/
/*    border: 1px solid var(--Neutral-300, #B0B0B0);*/
/*    padding: 4px 6px 4px 8px;*/
/*    color: var(--Neutral-800, #454545);*/
/*    font-family: Inter;*/
/*    font-size: 14px;*/
/*    align-items: center;*/
/*    max-height: 26px;*/
/*}*/

/*.ArrowContainer .PageStatus2{*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*    color: var(--Neutral-800, #454545);*/
/*    font-family: Inter;*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    line-height: 150%;*/
/*    gap: 4px;*/
/*}*/


/*.ArrowBtn {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    cursor: pointer;*/
/*    font-size: 18px;*/
/*    padding: 4px 6px;*/
/*    border: 1px solid var(--Neutral-300, #B0B0B0);*/
/*    border-radius: 8px;*/
/*    background: none;*/
/*    max-height: 26px;*/
/*}*/

/*.ActionIcons button {*/
/*    background: none;*/
/*    border: none;*/
/*    cursor: pointer;*/
/*}*/

/*.ResidentName{*/
/*    display: flex; */
/*    flex-direction: column; */
/*    gap: 6px;*/
/*    color: var(--Neutral-800, #454545);*/
/*    font-family: Inter;*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    letter-spacing: 0.14px;*/
/*}*/

/*.Initials {*/
/*    color: var(--Cerulean-Blue-600, #1A71F6);*/
/*    font-family: "Inter";*/
/*    font-weight: 400;*/
/*    line-height: 150%;*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*}*/

/*.EmergencyContact{*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    gap: 6px;*/
/*} */

/*.ContactName{*/
/*    color: var(--Neutral-800, #454545);*/
/*    font-family: "Inter", serif;*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*}*/

/*.ContactNumber{*/
/*    color: var(--Cerulean-Blue-600, #1A71F6);*/
/*    font-family: "Inter";*/
/*    font-weight: 400;*/
/*    line-height: 150%;*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    */
/*}*/

/*.RoomInfo{*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    gap: 6px;*/
/*    font-family: "Inter";*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    color: var(--Neutral-800, #454545);*/

/*}*/

/*.Gender{*/
/*    font-family: "Inter";*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    color: var(--Neutral-800, #454545);*/
/*}*/

/*.Age{*/
/*    font-family: "Inter";*/
/*    font-size: 14px;*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    color: var(--Neutral-800, #454545);*/
/*}*/

/*.Status{*/
/*    color: #3885FD;*/
/*    font-family: "Inter";*/
/*    font-size: 12px;*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    border-radius: 10px;*/
/*    background: #D8E3F8;*/
/*    width: fit-content;*/
/*    padding: 6px;*/
/*}*/

/*.TableRowStatus{*/
/*    width: 120px;*/
/*}*/

/*.TableRowGender{*/
/*    width: 120px;*/
/*}*/

/*.TableRowAge{*/
/*    width: 120px;*/
/*}*/


.PopupDelete {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.PopupContent {
    background: white;
    padding: 24px;
    border-radius: 8px;
    text-align: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.PopupContent button {
    margin: 8px;
    padding: 6px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.ConfirmBtn {
    background-color: #F44336;
    color: white;
}

.CancelBtn {
    background-color: #DADADA;
}

/*Add Popup ---------------------------------------------------------------------------------------------------------------*/
html.popup-open,
body.popup-open {
    overflow: hidden;
    height: 100%;
}

.PopupOverlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(6px); /* ✅ blur effect */
    -webkit-backdrop-filter: blur(6px);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    z-index: 9999;
}
.AddPopup {
    position: relative;
    background: white;
    border-radius: 16px;
    width: 95%;
    max-width: 1200px;
    height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    z-index: 9;

}
.AddPopupHeader {
    background: linear-gradient(to right, #dce6f9, #f5f8ff);
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 10;
    max-height: 60px;
}

.CloseAddBtn{
    background: none;
    border: none;
}

.CloseAddPopup{
    height: 24px;
    width: 24px;
    cursor: pointer;
}

/*Admission Container ---------------------------------------------------------*/
.AdmissionContainer{
    /*display: flex;*/
    /*justify-content: center;*/
    /*align-items: center;*/
    /*gap: 24px;*/
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: auto;
    width: 100%;
}

.Term_Container{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
}

.Header_Container_Right{
    height: 100%;
    width: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.AdmissionContainer .LongTerm{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}

.LongTerm .Text{
    color: #263238;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.LongTerm .ToggleContainer{
    background: var(--white-07, rgba(255, 255, 255, 0.70));
    border-radius: 8px;
    display: flex;
    width: 55px;
    height: 36px;
    padding: 8px;
    justify-content: center;
    align-items: center;
}

.LongTerm .ToggleSvg{
    height: 20px;
    width: 20px;
}

.AdmissionContainer .ShortTerm{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}


/*.AdmissionContainer .ToggleContainer {*/
/*    display: flex;*/
/*    width: auto;*/
/*    height: 48px;*/
/*    padding: 4px;*/
/*    gap: 4px;*/
/*    border-radius: 12px;*/
/*    background: var(--White-whiteblue-100, #F2F4F5);*/
/*    cursor: pointer;*/
/*}*/



.ShortTerm .Text{
    color: #263238;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.ShortTerm .ToggleContainer{
    background: var(--white-07, rgba(255, 255, 255, 0.70));
    border-radius: 8px;
    display: flex;
    width: 55px;
    height: 36px;
    padding: 8px;
    justify-content: center;
    align-items: center;
}

.ShortTerm .ToggleSvg{
    height: 20px;
    width: 20px;
}

.Popup_Header_Close_Container{
    display: flex;
    position: relative;
    background-color: #36b37e;
    height: 100%;
    width: 100px;
}
/*Admission Container End --------------------------------------------------------*/

/*Tab Navigation -----------------------------------------------------------------*/
.TabNavigation {
    justify-content: center;
    display: flex;
    align-items: center;
    gap: 16px;
    /*padding-top: 24px;*/
    background: none;
    position: sticky;
    z-index: 9;
    padding-bottom: 24px;
}
.TabButton {
    gap: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #0D0D0D;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.4px;
    padding: 12px 24px;
    border-radius: 8px 8px 0px 0px;
    border: none;
    background: #e0e0e0;
    cursor: pointer;
}
.TabButton.active {
    background: #D8E3F8;
}

.TabContent {
    display: none;
}
.TabContent.active {
    display: block;
    /*padding-bottom: 24px;*/
    /*overflow-y: scroll;*/
}
/*Tab Navigation End-----------------------------------------------------------*/

/*Upload and Assign Container ---------------------------------------------------*/
.UploadAssignContainer{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
}

/* ------------Profile Image-------------- */
.ProfileUpload {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 12px;
    color: #1A71F6;
    font-weight: 500;
    font-size: 14px;
    text-decoration: underline;
}
.ProfileImage {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #E0E0E0;
}
/*-------------------------------------*/

.CustomDropdown.Room {
    display: flex;
    align-items: center;
    gap: 16px;
    font-family: 'Inter', sans-serif;
    position: relative;
}

.DropdownLabel.Room {
    font-weight: 500;
    font-size: 14px;
}

.DropdownSelect.Room {
    position: relative;
    width: 312px;
    padding: 16px;
    height: auto;
    border: 1px solid #ccc;
    border-radius: 8px;
    cursor: pointer;
    background: #fff;
    transition: border-color 0.3s ease;
}

.DropdownSelect.Room.active {
    border-color: #3885FD;
}

.SelectedValue.Room {
    font-size: 14px;
}

.DropdownArrow.Room {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    transition: transform 0.3s ease;
    pointer-events: none;
}

.DropdownArrow.Room.rotated {
    transform: translateY(-50%) rotate(180deg);
}

.DropdownOptions.Room {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    margin-top: 8px;
    padding: 0;
    list-style: none;
    background: white;
    border: 1px solid #ccc;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    max-height: 200px;
    overflow-y: auto;
    display: none;
    z-index: 10;
}

.DropdownOptions.Room li {
    padding: 12px 16px;
    cursor: pointer;
}

.DropdownOptions.Room li:hover {
    background: #f0f0f0;
}

.DropdownSelect.Room.active .DropdownOptions.Room {
    display: block;
}
/*Upload and Assign Container End---------------------------------------------------*/

/*Form Input ---------------------------------------------------------------------*/
/*.ScrollableFormArea {*/
/*    flex: 1;*/
/*    !*overflow-y: scroll;*!*/
/*    padding: 0 36px 12px 36px;*/
/*}*/
.ScrollableFormArea {
    flex: 1;
    overflow-y: auto;
    padding: 0;
    display: block;
    /*height: 58vh;*/
    height: 100%;
    width:100%;
}
.FormWrapper {
    display: flex;
    flex-direction: column;
    gap: 32px;
    height: auto;
    padding-bottom: 12px;
}

.FormHeadingContainer{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    border-bottom: 1px solid rgba(38, 50, 56, 0.10);
    padding: 24px 10px 10px 0;
}

.FormHeading{
    width: auto;
    color: #263238;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.DeleteFormBtn{
    font-size: 16px;
    font-weight: 500;
    background: none;
    border: none;
}

.FormSection {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 24px;
}
.FormSection.MentalHistory {
    display: flex;
    width: 100%;
    gap: 24px;
}
.FormGroup {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.FormGroup.MentalHistory {
    width: 100%;
}
.FormGroup label {
    font-weight: 500;
    font-size: 14px;
    color: #0C0C0C;
    font-family: Inter;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.4px;
}
.FormGroup input,
.FormGroup select {
    padding: 10px 12px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    height: 40px;
}

.FormGroup input:focus{
    border: 1px solid #3885FD;
    outline: none;
}
/*Form Input End --------------------------------------------------------------------------*/

/*General Tab ----------------------------------------------------------------------------*/
/*Gender Dropdown --------------------------------------------*/
.CustomDropdown{
    display: flex;
    align-items: center;
    gap: 16px;
    font-family: 'Inter', sans-serif;
    position: relative;
    height: 40px;
}

.DropdownSelect {
    position: relative;
    width: 100%;
    cursor: pointer;
    padding: 10px 12px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    transition: border-color 0.3s ease;
    height: 40px;
}

.CustomDropdown.active .DropdownSelect{
    border-color: #3885FD;
}

.CustomDropdown .DropdownOptions {
    display: none;
}

.CustomDropdown.active .DropdownOptions {
    display: block;
}


.SelectedValue {
    font-size: 14px;
    color: #2B2B2B;
}

.SelectedValue:focus {
    color: #000000;
}

.DropdownArrow {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    transition: transform 0.3s ease;
    pointer-events: none;
}

.CustomDropdown.active .DropdownArrow {
    transform: translateY(-50%) rotate(180deg);
}

.DropdownOptions {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    margin-top: 8px;
    padding: 0;
    list-style: none;
    background: white;
    border: 1px solid #ccc;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    max-height: 200px;
    overflow-y: auto;
    display: none;
    z-index: 10;
}

.DropdownOptions li {
    padding: 12px 16px;
    cursor: pointer;
}

.DropdownOptions li.highlight {
    background-color: #D8E3F8;
}

.DropdownOptions li:hover {
    background: #f0f0f0;
}

/*Gender Dropdown End -----------------------------------------------*/
/*Date of Birth dropdown --------------------------------------------*/
.DOBDropdownWrapper {
    display: flex;
    gap: 16px;
}

.DOBDropdownWrapper .CustomSelect {
    position: relative;
    width: 100%;
}

.DOBDropdownWrapper .CustomSelect select {
    width: 100%;
    padding: 10px 12px;
    appearance: none;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    color: #757575;
    background-color: #fff;
    cursor: pointer;
    height: 40px;
}

.DOBDropdownWrapper .CustomSelect select:focus {
    border-color: #3885FD;
    outline: none;
}

.DOBDropdownWrapper .CustomSelect .DropdownArrow {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    width: 14px;
    height: 14px;
}
/*Date of Birth dropdown End------------------------------------------*/
/*Next Kin End ------------------------------------------------------*/
/*.HeartRow {*/
/*    display: flex;*/
/*    justify-content: flex-start;*/
/*    align-items: center;*/
/*    width: 100%;*/
/*    margin-bottom: 24px;*/
/*}*/
.FormHeadingContainer .FormHeading{
    width: 100%;
}
.HeartRow {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
}

.HeartLabel {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.HeartLabel span{
    color: #000;
    font-family: Inter;
    /*font-size: 16px;*/
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.4px;
}

.HeartSvg{
    margin-bottom: -1px;
    width: 16px;
    height: 16px;
}

.AddButtonForm {
    width: 100%;
    max-height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 16px;
    background: none;
    border: 1px dashed #3885FD;
    cursor: pointer;
    gap: 9px;
    border-radius: 4px;
    /*margin-bottom: 24px;*/
}

.AddButtonForm .AddText {
    background: none;
    border: none;
    color: #3885FD;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.PlusAddSvg{
    margin-left: 9px;
}

.FormWrapper.NextKin{
    gap: 0;
    margin-top: 24px;
}
/*Next Kin End ----------------------------------------------*/
/*General Tab End-----------------------------------------------------------------------*/

/*Medical Tab --------------------------------------------------------------------------*/
/*Dropdown Diagnosis  -------------------------------------------------*/
.ContainerDiagnosis {
    position: relative;
    width: 100%;
    font-family: sans-serif; }

.InputWrapperDiagnosis {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 4px 10px 4px 10px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    height: fit-content;
    cursor: pointer;
    transition: border-color 0.2s;
}
.InputWrapperDiagnosis:focus-within,
.ContainerDiagnosis.active .InputWrapperDiagnosis {
    border-color: #3885FD;
}

.PlaceholderDiagnosis {
    padding: 10px 0;
    color: #DADADA;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.4px;
    user-select: none;
}

.SelectedOptionsDiagnosis .TagDiagnosis {
    border-radius: 4px;
    background: #E9E9E9;
    color: #092854;
    padding: 6px 4px;
    margin: 4px 8px 4px 0;
    height: 30px;
    display: inline-flex;
    align-items: center;
    font-size: 14px;
}
.SelectedOptionsDiagnosis .TagDiagnosis .RemoveBtnDiagnosis {
    width: 14px;
    height: 14px;
    margin-left: 6px;
    cursor: pointer;
}

.ArrowWrapperDiagnosis {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 12px;
}
.ContainerDiagnosis.active .ArrowWrapperDiagnosis {
    transform: rotate(180deg) translateY(-50%);
    bottom: 50%;
}

.DropdownDiagnosis {
    position: absolute;
    bottom: calc(100% + 4px);         /* was calc(100% + 0.25em) */
    left: 0;
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    z-index: 10;
    display: none;
}
.ContainerDiagnosis.active .DropdownDiagnosis {
    /*display: block;*/
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding: 4px;
    border-radius: 8px;
}
.DropdownDiagnosis .OptionDiagnosis {
    /*padding: 8px;*/
    margin: 4px;
    cursor: pointer;
    border-radius: 8px;
    padding: 10px;
    color: #092854;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.DropdownDiagnosis .OptionDiagnosis:hover {
    background: #f0f0f0;
}
.DropdownDiagnosis .OptionDiagnosis.selected {
    background: #e0eaff;
}
/*Dropdown Diagnosis End ----------------------------------------------*/
/*Dropdown Allergies  ------------------------------------------------*/
.ContainerAllergies {
    position: relative;
    width: 100%;
    font-family: sans-serif; }

.InputWrapperAllergies {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 4px 10px 4px 10px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    height: fit-content;
    cursor: pointer;
    transition: border-color 0.2s;
}
.InputWrapperAllergies:focus-within,
.ContainerAllergies.active .InputWrapperAllergies {
    border-color: #3885FD;
}

.PlaceholderAllergies {
    padding: 10px 0;
    color: #DADADA;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.4px;
    user-select: none;
}

.SelectedOptionsAllergies .TagAllergies {
    border-radius: 4px;
    background: #E9E9E9;
    color: #092854;
    padding: 6px 4px;
    margin: 4px 8px 4px 0;
    height: 30px;
    display: inline-flex;
    align-items: center;
    font-size: 14px;
}
.SelectedOptionsAllergies .TagAllergies .RemoveBtAllergies {
    width: 14px;
    height: 14px;
    margin-left: 6px;
    cursor: pointer;
}

.ArrowWrapperAllergies {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 12px;
}
.ContainerAllergies.active .ArrowWrapperAllergies {
    transform: rotate(180deg) translateY(-50%);
    bottom: 50%;
}

.DropdownAllergies {
    position: absolute;
    bottom: calc(100% + 4px);         /* was calc(100% + 0.25em) */
    left: 0;
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    z-index: 10;
    display: none;
}
.ContainerAllergies.active .DropdownAllergies {
    /*display: block;*/
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding: 4px;
    border-radius: 8px;
}
.DropdownAllergies .OptionAllergies {
    /*padding: 8px;*/
    margin: 4px;
    cursor: pointer;
    border-radius: 8px;
    padding: 10px;
    color: #092854;
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.DropdownAllergies .OptionAllergies:hover {
    background: #f0f0f0;
}
.DropdownAllergies .OptionAllergies.selected {
    background: #e0eaff;
}
/*Dropdown Allergies End ---------------------------------------*/
/*Medical Tab End -----------------------------------------------------------------------*/

/*Assessment Tab End -----------------------------------------------------------------------*/
/*General  History --------------------------------------------*/
.DropdownSelect{
    
}
.SelectedValue{
    
}
.DropdownOptions{
    
}
/*General  History End--------------------------------------------*/
/*Assessment Tab End -----------------------------------------------------------------------*/

/*Routine Tab End -----------------------------------------------------------------------*/
#formContainerMorning,
#formContainerAfternoon,
#formContainerNight {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* two equal columns */
    column-gap: 24px;  /* space between dropdown & note */
}

/* Ensure your FormGroup fills its column */
#formContainerMorning .FormGroup,
#formContainerAfternoon .FormGroup,
#formContainerNight .FormGroup {
    width: 100%;
}

.rowWrapper {
    grid-column: 1 / -1;
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 24px;
    column-gap: 24px
}

/* 3) The remove button “×” */
.rowWrapper .removeBtn {
    position: absolute;
    top: 0;
    right: 0;
    background: transparent;
    border: none;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
}
/*Routine Tab End --------------------------------------------------------------------------------------------*/

/*Document Tab -------------------------------------------------------------------------------------------*/
.TabContent {

    .TabContent.active {
        height: auto;
        width: 100%;
        overflow-y: auto;
    }
    
    .Border{
        padding: 0;
        margin: 0;
        border: 1px solid #E2E8F0;
        border-radius: 6px;
    }

     .TopContainer {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 65px;
        padding: 14px 16px;
         margin-bottom: 0px;
         border-bottom: 1px solid #E2E8F0;
    }

     .SearchBarContainer {
         width: 80%;
         gap: 24px;
         display: flex;
    }

     .SearchWrapper {
         width: 30%;
    }

     .SearchIcon {
         left: 10px;
         height: 20px;
         width: 20px;
    }

     .SearchInput {
         padding-left: 35px;
    }

     .DropdownArrow {

    }
    
    .FilterWrapper{
        width: 30%;
    }
    
    .FilterInput{
        padding: 10px 12px;
        font-size: 14px;
        border: 1px solid #ccc;
        border-radius: 6px;
        height: 40px;
        outline: none;
    }

    .FilterWrapper input:focus{
        border-color: #3885FD;
        outline: none;
    }
    
     .AddFileBtn {
        border-radius: 8px;
        background: #1A71F6;
        padding: 10px 36px;
        color: #FFF;
        text-align: center;
        font-family: Poppins;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        height: 40px;
        border: none;
    }

    .Hidden
    {
        display: none;
    }
    .PositionRelative
    {
        position: relative;
    }
    .Pointer
    {
        cursor: pointer;
    }
    .NoWrap
    {
        white-space: nowrap;
    }

    /* ---------- Middle / Empty ---------- */
    .MiddleContainer
    {
        position: relative;
        padding: 0;
        /*min-height: 270px;*/
        /*min-height: 250px;*/
        /*min-height: clamp(33vh, 33vh, 33vh);*/
        min-height: 22vh;
        box-sizing: border-box;
        overflow: visible; /* so popups aren’t clipped */
        margin-bottom: 0;
    }
    .EmptyState
    {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
    }
    .EmptyStateImg
    {
        width: 20px;
        height: 20px;
        display: block;
        margin: 0 auto 12px auto;
    }
    .EmptyStateText
    {
        font-family: sans-serif;
        font-size: 14px;
        color: #0F172B;
    }

    /* ---------- Table ---------- */
    .TableWrapper
    {
        overflow: visible; /* prevent menu clipping */
        margin: 0;
        border: none;
        border-radius: 0;
    }
    .MyTable
    {
        width: 100%;
        border-collapse: collapse;
        font-family: sans-serif;
    }
    .MyTable thead
    {
        position: sticky;
        top: 0;
        z-index: 1;
    }
    .MyTable th
    {
        padding: 16px;;
        font-size: 14px;
        background: none;
        text-align: left;
        max-height: 50px;
        color: #314158;
    }
    .MyTable td
    {
        padding: 16px;            /* 16px padding */
        border-top: 1px solid #E2E8F0;
        font-size: 14px;
        vertical-align: middle;
        position: relative;
        max-height: 55px;
        color: #62748E;
    }
    .CheckboxHead
    {
        width: 2%;
    }
    .DateHead
    {
        width: 12%;
    }
    .TypeHead
    {
        width: 8%;
    }
    .NameHead
    {
        width: 30%;
        overflow-x: hidden;
    }
    .NoteHead
    {
        width: 33%;
    }
    .SizeHead
    {
        width: 12%;
    }
    .EmptyHead
    {
        width: 3%;
    }
    .FileName
    {
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .FileName img
    {
        width: 19px;
        height: 22px;
    }

    /* Placeholder rows */
    .PlaceholderCell
    {
        color: #bbbbbb;
        font-style: italic;
    }

    /* Type pills */
    .TypePill
    {
        display: inline-block;
        padding: 4px 6px;
        border-radius: 8px;
        border: 1px solid;
        font-size: 10px;
        font-weight: 500;
    }
    .PPTType { background: rgba(251, 44, 54, 0.1); color: #FB2C36; border-color: rgba(251, 44, 54, 0.25);}
    .PDFType { background: rgba(251, 44, 54, 0.1); border-color: rgba(251, 44, 54, 0.25); color: #FB2C36; }
    .XSLType { background: rgba(0, 193, 106, 0.1); border-color:  rgba(0, 193, 106, 0.25); color: #00C16A;}
    .TXTType { background: #E8F2FF; border-color: #87BDFF; color: #0072FF;}
    .OTHType { background: rgba(98, 116, 142, 0.1); border-color: rgba(49, 65, 88, 0.5); color: rgba(49, 65, 88, 0.8);}

    /* Note input */
    .NoteInput
    {
        width: 100%;
        font-size: 13px;
        padding: 4px 6px;
        box-sizing: border-box;
        border: 1px solid #ccc;      /* default when it appears */
        outline: none;
        background: #fff;
    }

    .NoteInput:focus
    {
        border: 1px solid #1A71F6;   /* blue on focus */
    }

    /* ---------- 3-dot toggle menu ---------- */
    .MenuTriggerWrapper
    {
        position: relative;
        display: inline-block;
        z-index: 6000;
    }
    .MenuTriggerImg
    {
        width: 18px;
        height: 18px;
        cursor: pointer;
    }
    .RowHoverMenu
    {
        position: absolute;
        top: -4px;                 /* align to top of the dots */
        right: calc(100% + 6px);   /* to the LEFT of the dots */
        background: #ffffff;
        border: 1px solid rgba(218, 218, 218, 0.5);
        box-shadow: 0 4px 8px rgba(0,0,0,.05);
        padding: 6px;
        min-width: 130px;
        display: none;             /* shown by JS toggle */
        z-index: 7000;
        border-radius: 10px;
    }
    .RowHoverMenuItem
    {
        padding: 6px 16px;
        background: none;
        border: none;
        width: 100%;
        text-align: left;
        cursor: pointer;
        font-size: 14px;
        font-family: Inter;
        border-radius: 6px;
    }
    .RowHoverMenuItem:hover
    {
        background: #f5f5f5;
    }

    /* ---------- Pagination ---------- */
    .BottomContainer
    {
        border-top: 1px solid #E2E8F0;
        padding: 12px 16px;
    }
    .Pagination
    {
        display: flex;
        align-items: center;
        gap: 6px;
        justify-content: flex-end;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 500;
    }
    .PageButton
    {
        padding: 6px 10px;
        border: 1px solid #CAD5E2;
        background: #ffffff;
        cursor: pointer;
        border-radius: 6px;
        color: #314158;
    }
    .PageButton.Active
    {
        background: #00C16A;
        color: #ffffff;
        border-color: #00C16A;
    }
    .PageButton.Disabled
    {
        opacity: 0.4;
        cursor: default;
    }

    /* ---------- Modal (Upload) ---------- */
    .Modal
    {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 3000;
    }
    .ModalBackdrop
    {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.4);
    }
    .ModalContent
    {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: #ffffff;
        padding: 24px;
        border-radius: 32px;
        width: 600px;
        min-height: 400px;
        max-height: 700px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.2);
        font-family: Inter;
    }
    /* close “×” */
    .CloseBtn {
        position: absolute;
        top: 24px;
        right: 24px;
        background: none;
        border: none;
        cursor: pointer;
    }
    .CloseIcon{
        width: 26px;
        height: 26px;
    }
    /* header */
    .UploadHeader {
        display: flex;
        align-items: center;
        gap: 24px;
    }
    .HeaderIcon {
        width: 60px;
        height: 60px;
        padding: 14px;
        border: 1px solid #ccc;
        border-radius: 100%;
    }
    .HeaderText h2 {
        margin: 0;
        font-size: 20px;
        color: #292D32;
        font-weight: 500;
    }
    .HeaderText p {
        margin: 6px 0 0;
        font-size: 14px;
        color: #A9ACB4;
    }
    
    .BreakLine{
        height: 1px;
        background-color: #CBD0DC;
        width: 600px;
        margin: 24px 0 24px -24px;
    }

    /* drop-zone */
    .DropZone {
        border-radius: 16px;
        border: 1.5px dashed #CBD0DC;
        background: #FFF;
        padding: 24px;
        text-align: center;
        margin-bottom: 16px;
        transition: background 0.2s;
        width: 100%;
        height: 265px;
    }
    .DropZone.hover {
        background: #f0f8ff;
    }
    .DropIcon {
        width: 40px;
        height: 40px;
        margin-bottom: 16px;
        margin-top: 16px;
    }
    .DropZone p {
        margin: 0 0 10px 0;
        font-size: 20px;
        color: #292D32;
        font-weight: 500;
    }
    .DropZone span {
        font-size: 14px;
        color: #A9ACB4;
        font-weight: 400;
    }
    /* reuse .BrowseBtn for the button */
    .ModalTitle
    {
        margin-top: 0;
        font-size: 18px;
    }
    .BrowseBtn
    {
        margin-top: 36px;
        padding: 14px 24px;
        font-size: 14px;
        cursor: pointer;
        background: none;
        border: 1px solid #CBD0DC;
        border-radius: 8px;
        color: #54575C;
    }
    .MaxSizeNote
    {
        margin-top: 6px;
        font-size: 12px;
        color: #777777;
    }
    .UploadList
    {
        max-height: 200px;
        overflow: auto;
    }
    .UploadItem
    {
        margin-bottom: 10px;
        padding: 16px;
        border-radius: 16px;
        background: #EEF1F7;
    }
    .UploadName
    {
        font-size: 15px;
        font-weight: 500;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .UploadMeta
    {
        display:flex;
        align-items:center;
        gap: 8px;
        font-size:12px;
        color:#555;
    }
    .UploadMeta .Dot
    {
        font-weight:bold;
        line-height:0;
    }
    .Spin{
        display:inline-block;
        animation: spin 1.6s linear infinite;
        transform-origin: 50% 50%;
        will-change: transform;
    }
    @keyframes spin{
        to{ transform: rotate(360deg); }
    }
    .ProgressBarWrapper
    {
        margin-top: 10px;
        background: #CBD0DC;
        height: 8px;
        border-radius: 4px;
        overflow: hidden;
    }
    .ProgressBar
    {
        height: 8px;
        width: 0%;
        background: #375EF9;
        transition: width 0.2s linear;
    }
    .ModalActions
    {
        display: none;
        text-align: right;
    }
    .CancelBtn
    {
        padding: 6px 12px;
        cursor: pointer;
        display: none;
    }
    /* ---------- Confirm Delete Modal ---------- */
    .ConfirmModalContent
    {
        width: 400px;
        flex-wrap: wrap;
        height: auto;
        min-height: 140px;
        border-radius: 24px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text-align: center;
    }
    .ConfirmText
    {
        font-weight: 400;
        font-size: 14px;
        font-family: Inter;
        margin-bottom: 24px;
    }
    .ConfirmActions
    {
        text-align: center;
        display: flex;
        flex-direction: row-reverse;
        gap: 10px;
        justify-content: flex-start;
    }
    .ConfirmBtn
    {
        padding: 6px 12px;
        cursor: pointer;
        border-radius: 4px;
        min-width: 60px;
    }
    .ConfirmBtnYes
    {
        background: #FB2C36;
        color: #ffffff;
        border: none;
    }
    .ConfirmBtnCancel
    {
        background: #ffffff;
        border: 1px solid #dddddd;
        color: #62748E;
    }
}
/*Document Tab End -------------------------------------------------------------------------------------------*/

/*Short Term Admission Toggle  -------------------------------------------------------------------------------------------*/
/* row that spans both cols */
/*.rowWrapper {*/
/*    grid-column: 1 / -1;*/
/*    display: grid;*/
/*    grid-template-columns: repeat(2, 1fr);*/
/*    gap: 24px;*/
/*}*/

/*.med-template .rowWrapper{*/
/*    padding: 0 24px 0 24px;*/
/*}*/

/*.med-template .FormGroup{*/
/*    margin-left: 24px;*/
/*    margin-right: 12px;*/
/*}*/

.YesNoToggleGroup span {
    margin-right: 8px;
    font-weight: 400;
    font-size: 14px;
    font-family: Inter;
    color: #263238;
    opacity: .8;
}
.YesNoToggleGroup img {
    width: 15px;
    height: 15px;
    cursor: pointer;
    margin-left: 20px;
    margin-right: 35px;
}

/* keep your existing AddButtonForm styles, or tweak here */
.AddButtonForm {
    margin-top: 16px;
}

/* ——— Remove any other unintended borders ——— */
/*.ShortTermInjected .FormGroup,*/
.ShortTermInjected .YesNoToggleGroup img {
    border: none !important;
}

.ShortTermInjected.med-template{
    border: 1px solid rgba(38, 50, 56, 0.10);
    border-radius: 8px;
    padding: 16px 24px;
    background-color: #cccccc0f;
    overflow: hidden;
    display: flex;
    flex-direction: column-reverse;
}

.FormSection.ShortTermInjected.reason-field{
    grid-template-columns: repeat(1, 1fr);
}

.ShortTermInjected .FormHeadingContainer{
    display: none;
}

/*.ShortTermInjected .FormHeadingContainer .FormHeading{*/
/*    font-weight: 400;*/
/*    background-color: #fff;*/
/*    padding: 8px 12px;*/
/*    outline: 1px solid rgba(38, 50, 56, 0.10);*/
/*    border-radius: 8px 0 8px 0;*/
/*}*/
/*Short Term Admission Toggle End -------------------------------------------------------------------------------------------*/

/*Save Button Container -----------------------------------------------------------------*/
.Button {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-weight: bold;
    cursor: pointer;
}

.FormActions {
    display: flex;
    width: 100%;
    height: auto;
    padding: 12px 0 24px 0;
    justify-content: flex-end;
}

.SaveButton{
    border-radius: 8px;
    background: #1A71F6;
    padding: 10px 38px;
    margin-right: 36px;
    color: #FFF;
    text-align: center;
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    height: 40px;
}
/*Save Button Container End-----------------------------------------------------------------*/

input::placeholder {
    color: #DADADA;
}
/*Add Popup End---------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 768px) {

}