@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
:root{
  --bg_black: #1F2937;
  --bg_gray: #4B5563;
  --bg_primary: #635FED;
  --bg_primary_dark: #5450c5;
  --bg_green:#25CD25;
  --bg_blue:#00B3D7;
  --bg_main_dark:#090917;
}
html,body{
    height: 100%;
    font-weight: 300;
}
.black_text{color: #1C1C1C;}
.text_black{color: var(--bg_black);}
.text_gray{color: var(--bg_gray);}
.bg_black{background-color: var(--bg_black);}
.text_main_black{
    color: var(--bg_main_dark);
}
.theme_bg{color: var(--bg_primary);}
.bg_green{color: var(--bg_green);}
.bg_orange{background-color: var(--bg_primary); color: var(--bg_primary);}
.bg_blue{color: var(--bg_blue);}
.textred{color:#E53535;}
.fw_100{font-weight: 100;}
.fw_200{font-weight: 200;}
.fw_300{font-weight: 300;}
.fw_400{font-weight: 400;}
.fw_500{font-weight: 500;}
.fw_600{font-weight: 600;}
.fw_700{font-weight: 700;}
.form-select{font-size:14px;}
.rounded15{border-radius: 15px;}
.font-14{
    font-size: 14px;
}

/* .bg_orange:hover{background-color: var(--bg_primary);} */
.btn-grey-block{background-color:#F3F3F3; color:#0F172A;}
.borbtm {
    border-bottom: 2px solid #f9f6f4;
}

body{
    font-family: "Inter", serif;;
}

.login_box{
    background-image: url(../images/Login_bg.png);
    content: '';
    width: 100%;
    height: 300px;
    background-repeat: no-repeat;
    top: 0;
    z-index: -9;
}

.login_form {
    padding: 24px 26px;
    background: #FFFFFF;
    box-shadow: 0px 4px 16px -1px #00000012;
    border-radius: 16px;
}

.login_form h1{
    font-family: "Inter", serif;
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
}

.login_form p{
    color: var(--bg_gray);
    font-weight: 400;
}

.login_box input.form-control {
    padding: 14px 15px;
    border: 1px solid #E5E7EB;
    border-radius: 9px;
    box-shadow: 0px 1px 2px 0px rgb(0 0 0 / 5%);
}

.theme_btn, .theme_btn:hover{
    padding: 12px 15px;
    background: #635FED;
    border: 1px solid #635FED;
    border-radius: 9px;
    width: 100%;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    color: #FFFFFF;
}
.btn-sm{
    border-radius:6px;
    padding: 5px 10px;
}
.eye-icon{
    position: absolute;
    right: 14px;
    top: 42px;
}
a{text-decoration: none;}

.login_box input.form-control:focus {
    border: 1px solid #CBD5E1;
    border-radius: 9px;
    outline: none !important;
    box-shadow: none !important;
}

.otp_verify_box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
}

.otp_verify_box input {
    width: 60px;
    height: 60px;
    border: 1px solid #CBD5E1;
    border-radius: 12px;
}




a{
    color: var(--bg_primary);
    text-decoration: none;
}
a:hover {
    color: var(--bg_primary_dark);
}
.titlebrownlight{color: var(--titlebrownlight);}

.sidebgleft{

    /* background-color:var(--sidebg); */

}

.closebutton{background-color: var(--closebtn); color: var(--colorGray); border: 1px solid var(--closebtn) }

.colorBlack {

    color: var(--colorBlack);

}

.titlebrown{

    color: var(--titlebrown);

}

.titlebrown:hover{

    color: var(--titlebrown);

}

.colorRed {

    color: var(--colorRed) !important;

}

.color-primary{background-color: var(--colorBlack);}

.colorRed:hover{

    background-color: var(--colorRed);

    color: var(--bodyBg) !important;

}

.colorLightRed {

    font-variant: var(--colorLightRed);

}

.colorGray{

    color: var(--colorGray) !important;

}

.colorGrayDark{

    color: var(--colorGrayDark);

}

.bgBody {

    background-color: var(--bodyBg);

}

.bgpurple {

    background-color: var(--colorpurple);

}



.bgRed {

    background-color: var(--colorRed);

}

.bgRed:hover{

    background-color: var(--colorRed);

}



.bgLightRed {

    background-color: var(--colorLightRed);

}



.colorGrey {

    color: var(--colorGrey) !important;

}



.colorGreen{

    color: var(--color-success);

}

.left_side {

    /* background: #FFF2E3; */

    background: url('../images/login_bg.svg');

    background-size: cover;

    background-repeat: no-repeat;

}

.left_side img {

    padding: 24px;

}

.fit-img{

    width: 100%;

    height: 100%;

    object-fit: cover;

}
.form-control {
    padding: 10px 15px;
    font-size: 14px;
    color: var(--bg_main_dark);
}
::placeholder{color: #ccc;}
.fs-10{

font-size: 10px;

}

.fs-12{

    font-size: 12px;

}

.fs-14{

    font-size: 14px;

}

.fs-16{

    font-size: 16px;

}

.fs-18{

    font-size: 18px;

}

.fs-22{

    font-size: 22px;

}

.fs-20{

    font-size: 20px;

}

.fs-26{

    font-size: 26px;

}

.fs-40{

    font-size:40px;

}


.fw-500{

    font-weight: 500;

}

.fw-600{

    font-weight: 600;

}

.fw-700{

    font-weight: 700;

}

.w-60{width:60%;}
.sidebar-heading img {
    width: 118px;
}
.fw-800{

    font-weight: 800;

}

.pmt_crd ul.list-group li.list-group-item span {

    width: 70%;

    text-align: end;

}

.pmt_crd ul.list-group li.list-group-item .dec_bsk {

    width: 100%;

    text-align: left;

}

.pmt_crd ul.list-group li.list-group-item .lbl_spc {

    width: fit-content;

}

.btnRed{

background: #072D94; /* Old browsers */

    color: #ffff;

}

.btnGray{

    background-color: #072D94;

    color: #fff;

}

.btnGray:hover{

    background-color: #072D94;

    color: #fff;

}

.btn-40{

    height: 40px;

    min-width: 40px;

    display: flex;

    justify-content: center;

    align-items: center;

    cursor: pointer;

}

.btn-50{

    height: 56px;

    display: flex;

    justify-content: center;

    align-items: center;

}

.avatar_02 {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    border: 1.5px solid #fff;
    box-shadow: 0px 4px 4px -1px #00000012;
}
.avatar_01 {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    overflow: hidden;
    border: 1.5px solid #fff;
    box-shadow: 0px 4px 4px -1px #00000012;
}
.btn_32{

    height: 32px;

    min-width: 32px;

    display: flex;

    justify-content: center;

    align-items: center;

    cursor: pointer;

}

.avtar_24{

    width: 24px;

    height: 24px;

    display: flex;

    overflow: hidden;

    border-radius: 100px;

}

.avtar_54{

    width: 100px;

    height: 100px;

    display: flex;

    overflow: hidden;

    border-radius: 6px;

}

.avtar_42 {
    width: 42px;
    height: 42px;
    display: flex;
    overflow: hidden;
    border-radius: 56px;
    background-color: #F0F0F0;
    padding: 8px;
}

.charity_54 {

    width: 54px;

    height: 54px;

    display: flex;

    overflow: hidden;

    border-radius: 6px;

    background-color: #E6DAD1;

    padding:9px;

}

.thumbnail_32 {

    width: 32px;

    height: 32px;

    overflow: hidden;

    border-radius: 4px;

    display: flex;

    justify-content: center;

    align-items: center;

}

.btnRed:hover, .btnRed:focus

.btnRed.active, .btnRed.show, .btnRed:first-child:active, :not(.btn-check)+.btnRed:active{

    background-color: var(--colorRed);

    color: #ffff;

    opacity: .9;

}



.btnDark{

    background-color: var(--colorBlack);

    color: #ffffff;

}

.btnDark:hover{

    opacity: .9;

    background-color: var(--colorBlack);

    color: #ffffff;

}

.btnDarkLight{

    background-color: #cccccc;

    color: var(--colorBlack);

}

.btnDarkLight:hover{

    background-color: var(--colorBlack);

    color: #ffffff;

}

.btnDarkLight:hover svg path{

    fill: #ffffff;

}



.btnLightRed{

    background: var(--colorLightRed);

    color: var(--colorRed);

}



.btnLightRed:hover{

    background: var(--colorRed);

    color: #ffffff;

}

.btnLightRed:hover svg path{

    fill: #ffffff;

}



.dangerBtn {

    background-color: var(--colorLightRed);

    color: var(--colorRed);

}

.btn.dangerBtn:hover {

    background-color:var(--colorRed);

    color: #ffff;

}

.btn.dangerBtn:hover svg path{

    fill: #ffffff;

}



.successBtn {

    background-color: var(--color-success-light);

    color: var(--color-success);

}



.custom-card .customInput::-webkit-input-placeholder {

    color:#fff;

}



.custom-card .customInput-text::-moz-placeholder {

    color:#fff;

}



.btn.successBtn:hover {

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

    color:#ffff;

}

.btn.successBtn:hover svg path {

    fill:#ffff;

}



.btnSuccessOutline{

    color: var(--color-success);

    background: transparent;

    border: 1px solid var(--color-success);

}

.btnSuccessOutline:hover svg path, .btnSuccessOutline:focus svg path, .btnSuccessOutline:active svg path{

    fill: #FFFFFF;

}

.btnSuccessOutline:hover, .btnSuccessOutline:focus, .btnSuccessOutline:first-child:active{

    background: var(--color-success);

    color: #FFFFFF;

}

.btn-20{

    height: 20px;

    padding: 6px 10px;

    border-radius: 4px;

}

.pb-40{

    padding-bottom: 40px;

}

.pt-30{

    padding-top: 30px;

}

.pb-30{

    padding-bottom: 30px;

}

.pb-20{

    padding-bottom: 20px;

}

.mb-30{

    margin-bottom: 30px;

}

.avtar_01 {
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 50%;
}

.avtar_01 img.fir-img {

    width: 26px;

    height: 26px;

    opacity: 0.6;

}

/* .sidebgleft {

    border-right: 1px solid rgb(18 140 126 / 29%);

} */

.lHeight{

    line-height: 1.1

}

.flex-wrap-inherit{

    flex-wrap: inherit !important;

}

.right_side span.pas_eye {
    top: 15px;
    right: 15px;
}

.custom-dropdown {
    border: none;
    box-shadow: 0px 5px 5px 4px rgb(0 0 0 / 6%);
    border-radius: 5px;
}

.custom-dropdown .dropdown-item.active, .custom-dropdown .dropdown-item:active, .custom-dropdown .dropdown-item:focus {

    background-color: var(--colorRed);

    color: #ffffff;

}

.custom-dropdown .dropdown-item:hover{

    background-color: var(--colorLightRed);

    color: var(--colorRed);

}

.content-wrapper {
    padding-top: 1rem;
    padding-left: 0rem;
    padding-right: 0rem;
    margin: 0 0 20px 0;
    min-height: calc(100vh - 11rem);
}

.form-check-input:checked {

    background-color: var(--bg_primary);

    border: 1px solid #c9cdd1;

}

.jb_chk .form-check-input:checked {

    background-color: #46ce4a;

    border: 1px solid #46cd4a;

}

.form-check-input:focus{
    box-shadow: 0 0 0 .25rem rgb(99 95 237 / 25%);
}

form.form_spc label {

    font-weight: 700;

}

/* 3 dot button  */

.drop_hd .showLeft {

    background-color: white !important;

    border: 1px solid white !important;

  }

  .drop_hd .icons li {

    background: black;

    height: 7px;

    width: 7px;

    line-height: 0;

    list-style: none outside none;

    margin-top: 3px;

    vertical-align: top;

    border-radius: 50%;

  }

  .drop_hd .btn-left {

    left: 0.4em;

  }

  .drop_hd .btn-right {

    right: 0.4em;

  }

  .drop_hd .btn-left,

  .drop_hd .btn-right {

    position: absolute;

    top: 0.24em;

  }

  .drop_hd .dropbtn {

    background-color: #4caf50;

    position: fixed;

    color: white;

    font-size: 16px;

    border: none;

    cursor: pointer;

  }

  .drop_hd .dropbtn:hover,

  .drop_hd .dropbtn:focus {

    background-color: #3e8e41;

  }

  .drop_hd .dropdown {
    position: absolute;
    display: inline-block;
    right: 0.4em;
  }

  .drop_hd .dropdown-content {

    display: none;

    position: relative;

    margin-top: 60px;

    background-color: #f9f9f9;

    min-width: 160px;

    overflow: auto;

    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);

    z-index: 1;

  }

  

  .drop_hd .dropdown-content a {

    color: black;

    padding: 12px 16px;

    text-decoration: none;

    display: block;

  }

  

  .drop_hd .dropdown a:hover {

    background-color: #f1f1f1;

  }

  

  .drop_hd .show {

    display: block;

  }



  /* 3 dot button */

  .customInput {

    font-size: 1rem;

    min-height: calc(1.8em + 1.4rem + 4px);

    position: relative;

    border-radius: 12px;

    border: 1px solid #E6E6E6;

    background: rgb(230 230 230 / 25%);

}

.form-control.customInput::Placeholder {

    color: #676767;

}

.customInput2{

    font-size: 1rem;

    min-height: calc(1.5em + 1rem + 4px);

    background-color: #F5F5F5;

    border: 1px solid #F5F5F5;

    border-radius: 4px;

    color: var(--colorBlack);

}

.customInput2.form-select{

    background-image: url(../images/dropdown.svg);

    background-size: 12px 8px;



}

.customTextArea{

    background-color: #F5F5F5;

    border: 1px solid #F5F5F5;

}



.customInput2:focus, .customTextArea:focus{

    color: #212529;

    background-color:#F5F5F5;

    border-color: #e8dddd;

}

.customInputLable{

    color: #A2A2A2;

    margin-bottom: 6px;

}









::-webkit-input-placeholder {

    color: #008000;

}



.customInput.form-select{

    background-image: url(../images/dropdown.svg);

    background-size: 12px 8px;



}

/* .customInput::placeholder{

    color: var(--colorBlock);

    opacity: 0.3;

} */

.prg .progress-bar {
    background: #49d367;
}

.prg {
    height: 7px;
}
.otp_blk {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 80%;
    margin: 0 auto;
}
.otp_blk input {
    width: 65px;
    text-align: center;
}
.submit-btn {
    width: 100%;
}
.otp_blk_cnt p {
    font-size: 14px;
    font-weight: 500;
    color: #00000066;
}
.form-control.customInput:focus {
    border-color: #dca917;
    background-color: transparent;
    box-shadow: none;
}

.customModel .modal-content {

    position: relative;

    padding: 40px;

}

.customModel .modal-content .modal-header {

    position: absolute;

    right: 20px;

    top: 20px;

    z-index: 9;

}



.Shadow_01{

    box-shadow: 0px 4px 16px -1px #00000012;

}

.border_01{

    border-color: #EBEBEB !important;

}

.card-header{

    border-bottom: 1px solid #EBEBEB !important;

}

.borderBottom{

    border-bottom: 1px solid #EBEBEB !important;

}

.borderTop{

    border-top: 1px solid #EBEBEB !important;

}

.CheckboxBtn .btn-outline-dark{

    background-color: #ffffff;

    border-color:#E6E6E6;

    padding: 10px 37px;

}

.add_medi_btn {

    background: #348d7e;

    gap: 10px;

}

td.dec_tdd {

    width: 30%;

    white-space: normal !important;

}

.grn_clr {

    color: #348d7e;

}

.jb_lbl {

    width: fit-content;

}

.medi_frm .modal-dialog {

    max-width: 600px;

}

.add_medi_btn:hover, .add_medi_btn:focus, .add_medi_btn:active {

    background: #292D32 !important;

    color: #fff !important;

}

.CheckboxBtn .btn-check:checked+.btn, .CheckboxBtn .btn.active, .CheckboxBtn .btn.show, .CheckboxBtn .btn:first-child:active, .CheckboxBtn :not(.btn-check)+.btn:active{

    background: var(--colorBlack);

}

.border{border-color:var(--colorRed)}

/* ===============Sidebar CSS Start here================== */

#wrapper {

    overflow-x: hidden;
    background-image:url(../images/Login_bg.png) ;
    padding: 20px;
    background-attachment: fixed;
    width: 100%;
    background-repeat: no-repeat;

}



/* width */
#sidebar-wrapper::-webkit-scrollbar {
    width: 5px;
    border-radius: 5px;
  }
  
  /* Track */
  #sidebar-wrapper::-webkit-scrollbar-track {
    background: #fff; 
  }
   
  /* Handle */
  #sidebar-wrapper::-webkit-scrollbar-thumb {
    background: #f9e6b0; 
    border-radius: 5px;
  }
  
  /* Handle on hover */
  #sidebar-wrapper::-webkit-scrollbar-thumb:hover {
    background: var(--main_blue); 
  }


#sidebar-wrapper {
    /* box-shadow: 0px 4px 6px #ccc; */
    width: 280px;
    padding: 0 10px;
    position: fixed;
    background-color: var(--bg_main_dark);
    
}

#sidebar-wrapper .list-group-flush>.list-group-item {
    border-width: 0;
    border-bottom: 1px solid transparent;
    border-top: 1px solid transparent;
    border-right: 1px solid transparent;
    border-left: 1px solid transparent;
    margin: 1px;
    padding: 10px 7px;
}

#sidebar-wrapper .list-group-item {
    background: transparent;
    color: #757575;
    font-weight: 400;
    margin: 2px 0;
    font-size: 15px;
    border: 0;
    padding: 8px 10px;
}

.pro_dta {
    background: #fff;
    padding: 30px 40px;
    border-radius: 10px;

}

.pro_dta:hover {
    box-shadow: 0px 0px 15px 6px #cccccc40;
}

.btn_log {
    border-radius: 10px;
    background: #DCA917;
    color: #fff;
}
.btn_log:hover, .btn_log:focus, .btn_log:active {
    background: #55b37e !important;
    color: #fff !important;
}

.btn_grp_spc button.active {
    background: #4fe738;
    opacity: 1;
    color: #fff;
}

.vw_btn span svg path {
    stroke: #fff;
}

.btn_grp_spc button {
    padding: 7px 18px;
    border: 1px solid transparent;
    border-radius: 20px;
    background: rgb(165 165 165 / 20%);
    color: #000;
    /* opacity: 0.5; */
}

.ad_med .vw_btn {
    margin: 0;
}

.rply .vw_btn {
    margin: 0;
}

.sub_img {

    height: 170px;

    width: 170px;

    overflow: hidden;
}
.bg-warning {
    background-color: #ffe69b !important;
    color: #473b17 !important;
    border-radius: 12px;
}
.subs_btn_rw {
    gap: 10px;
}
#sidebar-wrapper .list-group-item-light.list-group-item-action.active, #sidebar-wrapper .list-group-item-light.list-group-item-action:hover, #sidebar-wrapper .list-group-item-light.list-group-item-action:active, #sidebar-wrapper .list-group-item-light.list-group-item-action:focus {
    background-color: #635FED;
    color: #fff;
    border-radius: 10px;
}

#sidebar-wrapper .list-group-item-light.list-group-item-action.active svg path, #sidebar-wrapper .list-group-item-light.list-group-item-action:hover svg path, #sidebar-wrapper .list-group-item-light.list-group-item-action:active svg path, #sidebar-wrapper .list-group-item-light.list-group-item-action:focus svg path {
    stroke: #ffffff;
}
.crd_sub h5 {
    font-weight: 500;
    font-size: 16px;
    margin: 0;
}
.trnd_dsc {
    margin: 0 0 0 10px;
}
.trnd_dsc h2 {
    margin: 0;
}
.down_crd .icn_trnd {
    background-color: #E95B5B;
}
.down_crd .inc_trnd_dsc {
    background-color: #F6E1E1;
}
.down_crd .inc_trnd_dsc .txt {
    color: #DA3030;
}
#sidebar-wrapper .list-group .list-group-item span {
    margin-right: 10px;
}
/* .sidebgleft .list-group-item.active .menu-icons {
    display: none;
} */
.sidebgleft .list-group-item.active .act_icn {
    display: inline-block;
}
/* .sidebgleft .list-group-item .act_icn {
    display: none;
} */
#sidebar-wrapper .CompleteYourProfile{
    margin: 0 16px;
}
#sidebar-wrapper .CompleteYourProfile .btn{
    height: 48px;
    margin-top: 35px;
    margin-bottom: 20px;
}
/* .dashbaord_data li:nth-child(2) .box {
    background-color: #48BF451F;
} */
.tbl_scrl table th {
    text-transform: capitalize;
    background-color:#f8f8fe !important;
}
.tbl_scrl table tr.even {
    background-color: #f8f8fe !important;
}
.tbl_scrl table tr td:first-child {
    border-radius: 8px 0px 0px 8px;
}
.tbl_scrl table tr td:last-child {
    border-radius: 0 10px 10px 0px;
}
.btn_view_detail {
    background-color: var(--main_blue);
    color: #fff;
    padding: 7px 35px;
    border-radius: 10px;
}
.btn_view_detail:hover {
    background-color: #ecb004;
}
.tbl_scrl table th:first-child {
    border-radius: 8px 0px 0px 8px;
}
.tbl_scrl table th:last-child {
    border-radius: 0 10px 10px 0px;
}
.log_item {
    position: absolute;
    bottom: 0px;
    left: 0;
    background-color: #00000052 !important;
    border-radius: 8px !important;
    color: #fff !important;
}
.log_item svg path {
    stroke: #fff;
}
#sidebar-wrapper {
    height: 95vh;
    margin-left: -300px;
    transition: margin 0.25s ease-out;
    /* overflow-y: scroll; */
    overflow-x: hidden;
    padding-bottom: 20px;
    border-radius: 12px;
} 
#sidebar-wrapper .sidebar-heading {
    padding: 1.4rem 0.4rem 1rem !important;
    font-size: 1.2rem;
    position: relative;
    margin-bottom: 13px;
}
/* .dashbaord_data li:nth-child(3) .box {
    background-color: #E95B5B1A;
} */
#sidebar-wrapper .list-group {
    /* width: 280px; */
    margin: 0 auto;
    position: relative;
    min-height: 78vh;
}

  #page-content-wrapper {
    min-width: 100vw;
  }
  body.sb-sidenav-toggled #wrapper #sidebar-wrapper {
    margin-left: 0;
  }
  .overlay{
    width: 100vw;

    height: 100vh;

    display: none;

    position: fixed;

    z-index: 3;

    top: 0;

    overflow: hidden;

    background: rgba(0, 0, 0, 0.5);

    

}

.close-block {

    right: 15px;

    background: #fff;

    padding: 5px;

}

.upload-img {

    width: 162px;

    height: 162px;

    background: #f9f6f6;

    border-radius: 10px;

    padding: 21px;

    position: relative;

    margin: auto;

    overflow: hidden;

}



.browser_btn input {

    position: absolute;

    height: 41px;

    opacity: 0;

    width: 150px;

    margin: auto;

    left: 0px;

    right: 0px;

}

.upload-img img {

    width: 100%;

    height: 100%;

    object-fit: fill;

}

/* picture upload */

#picture__input {

    display: none;

  }

  .desc_blk {

    width: 75%;

}

.picture {
    width: 160px;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    text-align: center;
    border: 1px dashed #a1a1a1;
    cursor: pointer;
    transition: color 300ms ease-in-out, background 300ms ease-in-out;
    overflow: hidden;
    background-image: url(../images/user_photo.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
}

.picture__image {
    display: block;
    width: 100%;
    text-align: center;
    padding: 10px 0 0;
}
/* .picture:focus {
    box-shadow: 0 0 27px 1px rgb(131 131 131 / 31%);
} */
.picture__img {
    max-width: 100%;
}

/* picture upload   */

.tbl_blk {

    overflow: hidden;

    /* width: 100%; */

}

.tbl_scrl {

    overflow-x: auto;

}

body.revealviewer {

    overflow: hidden;

  }

  #fullscreencanvas {

    position: fixed;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    width: 100vw;

    height: 100vh;

    visibility: hidden;

    opacity: 0;

    background: white;

    z-index: 9000;

    pointer-events: none;

    display: block;

    transition: opacity .3s, visibility 0s .3s;

  }

  body.revealviewer #fullscreencanvas {

    opacity: 1;

    pointer-events: auto;

    visibility: visible;

    transition: opacity .5s, visibility 0s .0s;

  }

  #fullscreenimagearea {

      position: relative;

      width: 100%;

      height: 100%;

      display: flex;

      align-items: center;

      justify-content: center;

      background-color: rgb(0 0 0 / 50%);

  }

  #fullscreencanvas img {

    position: relative;

    cursor: pointer;

    transition: all .5s;

  }

  div#closeviewer {

    width: 35px;

    height: 35px;

    overflow: hidden;

    display: block;

    position: fixed;

    cursor: pointer;

    text-indent: -1000px;

    z-index: 100000;

    top: 10px;

    right: 10px;

  }

  div#closeviewer::before, div#closeviewer::after {

  /* render large cross inside close button */

    content: "";

    display: block;

    position: absolute;

    width: 100%;

    height: 6px;

    background: #fff;

    top: 50%;

    opacity: 0;

    margin-top: -3px;

    -webkit-transform: rotate(0deg);

    transform: rotate(0deg);

    transition: transform .5s, opacity .5s;

  }

  body.revealviewer div#closeviewer::before {

    -webkit-transform: rotate(-45deg);

    transform: rotate(-45deg);

    opacity: 1;

  }

  body.revealviewer div#closeviewer::after {

    -webkit-transform: rotate(-135deg);

    transform: rotate(-135deg);

    opacity: 1;

  }

  #fullimageloadingdiv, #zoomioloadingdiv {

    position: fixed;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    visibility: hidden;

    overflow: hidden;

    display: flex;

    pointer-events: none;

    z-index: 10000;

    align-items: center;

    justify-content: center;

    background: white;

  }

  #fullimageloadingdiv .spinner {

    width: 40px;

    height: 40px;

    margin: 100px auto;

    background-color: #333;

    border-radius: 100%;

    -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;

    animation: sk-scaleout 1.0s infinite ease-in-out;

  }

  @-webkit-keyframes sk-scaleout {

    0% {

      -webkit-transform: scale(0);

    }

    100% {

      -webkit-transform: scale(1.0);

      opacity: 0;

    }

  }

  @keyframes sk-scaleout {

    0% {

      -webkit-transform: scale(0);

      transform: scale(0);

    }

    100% {

      -webkit-transform: scale(1.0);

      transform: scale(1.0);

      opacity: 0;

    }

  }

  #zoomiocontainer {

    position: absolute;

    z-index: 9999;

    overflow: hidden;

    background: white;

    visibility: visible;

  }

  #zoomiocontainer img {

    width: auto;

    height: auto !important;

    position: absolute !important;

    display: block !important;

    cursor: move;

  }

  .disablepointer {

    pointer-events: none;

  }

  #zoomiocontainer.mobileclass {

    overflow: scroll;

    -webkit-overflow-scrolling: touch;

  }

  #zoomioloadingdiv .spinner {

    width: 40px;

    height: 40px;

    margin: 100px auto;

    background-color: #333;

    border-radius: 100%;

    -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;

    animation: sk-scaleout 1.0s infinite ease-in-out;

  }


  @-webkit-keyframes sk-scaleout {

    0% {

      -webkit-transform: scale(0);

    }

    100% {

      -webkit-transform: scale(1.0);

      opacity: 0;

    }

  }

  @keyframes sk-scaleout {

    0% {

      -webkit-transform: scale(0);

      transform: scale(0);

    }

    100% {

      -webkit-transform: scale(1.0);

      transform: scale(1.0);

      opacity: 0;

    }

  }

  .thumbnails {

    cursor: zoom-in;

  }

  @media (min-width: 768px) {

    #sidebar-wrapper {

      margin-left: 0;

    }

  

    #page-content-wrapper {

      min-width: 0;

      width: 100%;

    }

  

    body.sb-sidenav-toggled #wrapper #sidebar-wrapper {

      margin-left: -312px;

    }

  }







/* =============Navbar CSS Start Here============= */



.user-profile.dropdown-toggle::after{

    content: url(../images/dropdown.svg);

    border: none !important;

    margin-top: 5px;

}

.navbar-nav {

    flex-direction: inherit;

    margin-left: 12px;

}

.navbar-expand-lg .navbar-nav .nav-link {

    padding-right: var(--bs-navbar-nav-link-padding-x);

    padding-left: var(--bs-navbar-nav-link-padding-x);

}





#page-content-wrapper #sidebarToggle:active{

    border-color: transparent;



}

#page-content-wrapper #sidebarToggle:hover svg path, #page-content-wrapper #sidebarToggle:active svg path {

    stroke: #399a88;

}



.navbar.navbar-expand-lg.navbar-light.bgBody {

    margin-left: 0;

}

.dropdown-divider {

    border-top: 1px solid #EBEBEB;

}

.navbar-nav .nav-item.dropdown .dropdown-menu {

    position: absolute;

}

/* ==============Authentication CSS Start Here=============== */

#myVideo {

    position: fixed;

    right: 0;

    bottom: 0;

    min-width: 100%; 

    min-height: 100%;

  }

.login_wrapper{

    height: 100vh;

    display: flex;

    align-items: center;

    background:var(--bodyBg);

    width: 100%;

    position: relative;

    /* padding-right: 5%; */

}

.llog_bg {
    height: 96vh;
    position: relative;
    background-image: url(../images/login_bg_nw.png);
    text-align: center;
    background-position: center;
    background-size: cover;
    width: 96%;
    border-radius: 3%;
    margin: 0 auto;
}
.llog_bg:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgb(0 0 0 / 67%);
}

.llog_bg h2 {
    color: #fff;
    z-index: 99;
    position: relative;
    text-align: left;
    font-weight: 700;
    font-size: 32px;
}

.llog_bg h4 {
    color: #fff;
    z-index: 99;
    position: relative;
    text-align: left;
    font-size: 18px;
    font-weight: 500;
}
.log_bgg {
    display: grid;
    align-content: center;
    height: 100%;
    justify-content: center;
}

.lg_pg {

    background: #fafafa;

    /* height: auto; */

}

.llog_bg img.img-fluid {

    height: 100vh;

    object-fit: cover;

}

.card-shadow{

    position: relative;

    z-index: 9;

}

.card-shadow.cstm_log {
    width: 100%;
    max-width: 420px;
    border-color: transparent !important;
    /* background-color: #fff; */
}

/* .card-shadow:before {

    content: "";

    position: absolute;

    background: #FFFFFF;

    box-shadow: 0px 5px 22px rgb(0 0 0 / 8%);

    border-radius: 10px;

    padding: 40px;

    top: 41px;

    width: 90%;

    height: 100%;

    z-index: -9;

    left: 50%;

    right: 50%;

    transform: translate(-50%, -20px);

} */



/* ================Dashbaord CSS Start here================ */



.h-vh{height: 150px;}

#page-content-wrapper {
    margin-left: 291px;
    transition: margin 0.25s ease-out;
    /* border-radius: 20px 0px 0px 20px; */
    margin-top: 2px;
    margin-bottom: 20px;
    overflow-x: hidden;
}
.info_crd .crd {
    background-color: #F1F1F1;
    border-radius: 15px;
}
.decs_wtt {
    width: 200px;
    display: inline-block;
}
.info_crd .crd .img_crd {
    height: 175px;
    width: 175px;
    overflow: hidden;
    border-radius: 50%;
    margin: 0 auto;
}
.info_crd .crd .img_crd img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.pas_form {
    display: flex;
    align-items: center;
    background-color: #fff;
    padding: 15px;
    border-radius: 10px;
}
.cta_act button {
    background-color: #48BF45;
    border: 1px solid #48BF45;
    padding: 10px 20px;
    width: 100%;
    border-radius: 10px;
    color: #fff;
    font-weight: 600;
    margin: 10px 0 0;
}
.pri_rto {
    color: var(--main_blue);
}
.sub_btn button {
    border: 1px solid var(--main_blue);
    background-color: var(--main_blue);
    padding: 9px 15px;
    color: #fff;
    border-radius: 11px;
}
.subs_blk div#upcomingReservation_wrapper div#upcomingReservation_filter {
    position: absolute;
    right: 210px;
    top: -15px;
}
.subs_blk{
    position: relative;
}
.sub_btn {
    position: absolute;
    right: 25px;
    z-index: 99;
    top: 10px;
}
.add_subs .btn[type="submit"] {
    width: 100%;
    background-color: #ECB004;
    color: #fff;
    padding: 10px 20px;
    font-weight: 600;
}
.subs_blk div#upcomingReservation_wrapper div#upcomingReservation_filter input[type="search"] {
    padding: 10px;
    border-radius: 10px;
}
.pas_form input {
    outline: none;
    padding: 3px 0px 3px 10px;
}

.pas_form label {
    font-size: 14px;
}

.pas_form svg {
    height: 30px;
    width: 30px;
}
.sb-sidenav-toggled #page-content-wrapper{
    margin-left: 20px;
}

#dashboard .card-thumbnail {
    width: 186px;
    height: 186px;
    overflow: hidden;
    display: flex;
    border-radius: 10px;
}

#dashboard .edit-btn {
    position: absolute;
    right: 20px;
    top: 20px;
}
.supportbg{
    background: url(../images/card-bg.svg) #FFFFFF;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.card-icon img {
    width: 28px;
    /* opacity: 0.6; */
}
.lst_dtl {
    width: 50%;
}

.card-icon {
    background: transparent;
    border: 1px solid #f3f3f3;
    height: 70px;
    width: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}



.card-icon{
    max-width: 100%;
}

/* .dashbaord_data li .box p {

    min-height: 60px;

} */



.orders_requests_thumb {
    width: 40px;
    height: 40px;
    display: flex;
    overflow: hidden;
    border-radius: 4px;
}

.chl_rw .btn {
    color: var(--main_blue);
    font-weight: 500;
}

#dashboard .earningSec .card-body .icon {
    background:var(--colorLightRed);
    width: 110px;
    height: 110px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}



#dashboard .reportsCollectedSec .collectedReports svg circle {
    fill: var(--colorRed);
}

#dashboard .reportsCollectedSec .unresolvedReports svg circle {
    fill: #FFA7A7;
}



#dashboard .reportsCollectedSec .newReports svg circle {
    fill: #FFCDCC;
}

#dashboard .earningSec .card-body .icon {
    background:var(--colorLightRed);
    width: 110px;
    height: 110px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
}

#dashboard .reportsCollectedSec .collectedReports svg circle {
    fill: var(--colorPrimary);
}

#dashboard .reportsCollectedSec .unresolvedReports svg circle {
    fill: #FFA7A7;
}

#dashboard .reportsCollectedSec .newReports svg circle {
    fill: #FFCDCC;
}

.dashbaord_data li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.dashbaord_data .box {
    border-radius: 15px;
    background-color: #fff;
    gap: 20px 0px;
    position: relative;
    min-height: 120px;
}
.crd_sub {
    background-color: #F7F9FB;
    border-radius: 15px;
}
table.dataTable tbody tr.odd {
    background-color: #ffffff !important;
}
table.dataTable tbody tr {
    background-color: transparent !important;
}
.btn.bg-danger {
    background-color: #F6E1E1 !important;
    color: #E95B5B !important;
    padding: 7px 25px;
    border-radius: 10px;
    min-width: 150px;
}
/* ================Table CSS Start here================ */

.custom-table table { border-collapse: separate; border-spacing: 0; }

.custom-table table td {
    border-right: solid 1px #EBEBEB;
    border-style: none solid solid none;
    padding: 10px;
    font-size: 14px;
}

.custom-table table th {
    border-top: solid 1px #EBEBEB;
    border-bottom: solid 1px #EBEBEB;
    border-right: solid 1px #EBEBEB;
}

.custom-table table td, .custom-table table th{
    padding: 16px;
}

.custom-table table tr:last-child td{
    border-bottom: solid 1px #EBEBEB;
}

.custom-table table tbody tr td:first-child{
    border-left: solid 1px #EBEBEB;
}

.custom-table table tr:first-child th:first-child { border-top-left-radius: 10px; border-left: solid 1px #EBEBEB;}

.custom-table table tr:first-child th:last-child { border-top-right-radius: 10px; }

.custom-table table tr:last-child td:first-child { border-bottom-left-radius: 10px; }

.custom-table table tr:last-child td:last-child { border-bottom-right-radius: 10px; }

.custom-table table tr:first-child td { border-top-style: solid; }

.custom-table table tr td:first-child { border-left-style: solid; }





/* =====================DataTable CSS=================== */

table.dataTable.no-footer {
    border-bottom: none !important;
    padding-top: 16px;
}
table.dataTable tbody th, table.dataTable tbody td{
    vertical-align: middle;
}

table.dataTable thead th, table.dataTable tbody td {
    padding: 12px 16px;
    white-space:nowrap;
}

.break-spaces {
    white-space: break-spaces !important;
}

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
    background-color: #fff;
}

table.dataTable.display tbody tr.odd>.sorting_1, table.dataTable.order-column.stripe tbody tr.odd>.sorting_1, table.dataTable.display tbody tr.even>.sorting_1, table.dataTable.order-column.stripe tbody tr.even>.sorting_1 {
    background-color: #fff;
}

table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
    border-top: transparent;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #000 !important;
    border: 1px solid #635FED !important;
    background: #635FED !important;
    /* border-radius: 4px; */
}
.icn_trnd {
    height: 65px;
    width: 65px;
    background: #48BF45;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
div#upcomingReservation_info {
    color: #000 !important;
}
.inc_trnd_dsc {
    width: 30%;
    background-color: #DDEEE1;
    display: inline-flex;
    justify-content: center;
    padding: 5px;
    margin-left: auto;
    border-radius: 10px;
}
.inc_trnd_dsc .txt {
    color: #00A010;
    margin: 0 10px 0 0;
    font-weight: 500;
    font-size: 16px;
}
div#upcomingReservation_filter {
    color: #292d32 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    /* color: var(--colorRed) !important; */
    border: none;
    background: transparent !important;
    cursor: pointer;
}

.tbl_scrl .dataTables_wrapper .dataTables_paginate .paginate_button:hover {

    color: rgb(0, 0, 0) !important;

}  

.tbl_scrl .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {

    color: #fff !important;

}

.paginate_button.next, .paginate_button.previous {

    background-color: var(--colorLightRed) !important;

    border-radius: 4px;

    margin: 0px 10px;

    

}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    border-radius: 7px !important;
    margin-right: 10px;
    padding: 3px 11px !important;
    font-size: 14px;
    color: #1e1b1b !important;
    background-color: #F6F6F6;
}



.dataTables_wrapper .dataTables_paginate .paginate_button.disabled img, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover img, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active img{

    opacity: .5;

    /* background-color: var(--colorLightRed); */



}

.dataTables_wrapper .dataTables_paginate .paginate_button:active {

    outline: none;

    box-shadow: none !important;

}

.dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_paginate{

    padding-top: 16px !important;

}



.dataTables_length select {

    border-color: #D9D9D9;

    border-radius: 5px;

    width: 70px;

    height: 32px;

}

.dataTables_wrapper .dataTables_filter input {

    margin-left: 0.5em;

    background: #F5F5F5;

    box-shadow: none !important;

    border-radius: 5px;

    border: 1px solid #f3f3f3;

}

table.dataTable.dtr-inline.collapsed tbody td:first-child, table.dataTable.dtr-inline.collapsed tbody th:first-child{

    padding-left: 40px !important;

}

table.dataTable.dtr-inline.collapsed tbody td:first-child:before, table.dataTable.dtr-inline.collapsed tbody th:first-child:before{

    top: 18px !important;

    left: 10px !important;

}

/* ================Order management CSS================ */

.no-wrap {

    white-space: nowrap;

}



.oderSummary tbody tr td, .oderSummary tbody th {

padding: 5px 16px;

color: var(--colorBlack);

}



.oderSummary tbody tr:first-child td{

    padding-top: 14px;



}

.oderSummary tbody tr:last-child th{

    padding-bottom: 14px;

}

.OrdersInQueueModel hr{

    border-color: #EBEBEB;

    opacity: 1;

}

a.vw_btn.exp_btn {

    background: #292D32;

    margin: 0;

    gap: 0px 7px;

}

a.vw_btn.exp_btn span { 

    display: inline-flex;

    margin-top: -3px;

}

.avtar_45 {

    width: 50px;

    height: 50px;

}

.med_tbl td.sorting_1 .avtar_45 {

    width: 60px;

    height: 60px;

}

.med_tbl td.sorting_1 .avtar_45 img {

    border: 1px solid #f1f2f6;

}

.vw_btn {
    background-color: var(--main_blue);
    width: fit-content;
    color: #fff;
    font-weight: 600;
    border-radius: 10px;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    gap: 0px 4px;
    justify-content: center;
    margin: 0 auto;
}

.vw_btn:hover span {
    transform: translate(3px, 0px);
    transition: 0.3s ease-in-out;
}

.vw_btn:hover span svg path {
    stroke: #ffffff;
}

.ad_med textarea {

    min-height: 200px;

}

.ad_med textarea {

    min-height: 200px;

}
.ad_med_blk {
    background-color: #F1F1F1;
    height: 100%;
    border-radius: 15px;
}
.ad_med_blk .itm_end {
    text-align: center;
    margin: 60px 0 0 0;
}
.ad_med .form-control:focus, .ad_med .form-select:focus {
    border-color: #a8a8a8;
    box-shadow: none;
}
.vw_btn:hover, .vw_btn:active ,.vw_btn:focus {
    color: #fff !important;
    background-color: #ecb004 !important;
}  

.btn_act {

    border-radius: 30px;

    background: #31B5A0;

    color: #fff;

    border: 1px solid #31B5A0;

}

.btn_act:hover {

    border: 1px solid #31B5A0;

    color: #31B5A0;

}

.btn_dec {

    border-radius: 30px;

    background: #292D32;

    color: #fff;

}

.btn_dec:hover {

    border: 1px solid #292D32;

    color: #292D32;

}

div#upcomingReservation_length {

    color: #292d32 !important;

}

/* ===================Custom nav Pills=================== */

.customNavPills .nav-item .nav-link.active{

    height: 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    background-color: var(--colorBlack);

    color: #FFFFFF;

    border-radius: 100px;

}



.customNavPills .nav-item .nav-link{

    height: 38px;

    display: flex;

    align-items: center;

    justify-content: center;

    background-color: transparent;

    color: var(--colorGray);

    border-radius: 100px;

}



.customNavPills .nav-pills .nav-link:focus-visible{

    outline: none !important;

}





.customNavPills2 .nav-item .nav-link.active{

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--colorRed);

    border-bottom: 1px solid var(--colorRed);

    font-weight: 600;

}

.nav-pills.customNavPills2 .nav-link {

    background: transparent;

    color: #868686;

    height: 60px;

    padding-top: 0px;

    border-radius: 0px;

}

.add-table-btn {

    margin-top: -14px;

}

.pay_logo.me-2 {

    height: 18px;

    width: 18px;

    padding: 1px;

    overflow: hidden;

    display: flex;

    justify-content: center;

    align-items: center;

}

.modal hr{

    border-color: #EBEBEB;

    opacity: 1;

}

.thumnail_112{

    height: 112px;

    width: 112px;

    overflow: hidden;

    display: flex;

    justify-content: center;

    align-items: center;

    border-radius: 8px;

}













/* ==================Profile CSS Start Here================ */



#profile .card .card-body .customProgress .progress {

    overflow: visible;

    margin-bottom: px;

    height: 5px;

    border-radius: 100px;

}

#profile .card .card-body .customProgress .progress-bar {

    background-color: var(--colorBlack);

    position: relative;

    border-radius: 100px;

    overflow: visible;

}

#profile .card .card-body .customProgress .progress-bar span {

    position: absolute;

    bottom: -20px;

    font-size: 14px;

    line-height: 10px;

    right: -1.4em;

    color: var(--colorGrayDark);

}



#profile .card .card-body .profile-tabs{

    padding: 0px;

    display: flex;

    flex-direction: column;

    gap: 20px;

}

#profile .card .card-body .profile-tabs li{

    list-style: none;

    font-size: 18px;

    color: var(--colorBlack);

    position: relative;

    padding-left: 25px;

}

#profile .card .card-body .profile-tabs .filled:before{

    content: url(../images/filled.svg);

    position: absolute;

    top: 0;

    left: 0;

}



#profile .card .card-body .profile-tabs .unfilled:before{

    content: url(../images/no_filled.svg);

    position: absolute;

    top: 0;

    left: 0;

}



#profile .profile_details .serviceType{

    position: relative;

    padding-left: 20px;



}

#profile .profile_details .serviceType::before{

    content: url(../images/info_icon.svg);

    position: absolute;

    left: 0;

    top: 2px;

    

}



.customCheckbox{

    background-color: #DBDBDB;

    border: 1px solid #DBDBDB;

    background-image: url(../images/check.svg);

    background-size: auto;

}

.customCheckbox:focus{

    background-color: #DBDBDB;

    border-color:  transparent;

}

.customCheckbox:checked[type=checkbox]{

    background-image: url(../images/check.svg);

    background-color: var(--colorBlack);

}

.w-130{

    width: 130px;

}



.BusinessScheduletdTable td, th, tr {

    border-color: inherit;

    border-style: solid;

    border-width: 0;

    padding-bottom: 16px;

}








/* ===================Menu Management CSS=================== */

.search .form-control{

    background-color: #F5F5F5;

    border: 1px solid #F5F5F5;

    border-radius: 4px;

    color: var(--colorBlack);



}

.search .form-control:focus{

    color: #212529;

    background-color: #F5F5F5;

    border-color: #e8dddd;

}

#menu_management .cate_list{

    border-bottom: 1px solid #EBEBEB;

}

#menu_management .cate_list:last-child{

    border-bottom: none;

}



#menu_management .card .card-body.cate_croll {

    height: 527px;

    overflow: hidden;

    overflow-y: auto;

}

#Categories .accordion-item{

    border-bottom:1px  solid #EBEBEB;

}



#Categories .accordion-button:not(.collapsed){

    background-color: #ffffff;

    color: var(--colorBlack);

    

}



#Categories .accordion-body{

    padding: 1rem 0rem !important;

    border-top:1px  solid #EBEBEB;



}



#Categories .accordion-button {

    padding: 1.5rem 0rem !important;

    font-weight: 600;

    color: var(--colorBlack);

}

#Categories .actionBtn{

    position: absolute;

    top: 0;

    bottom: 0;

    right: 30px;

    z-index: 99999;

}

#Categories .actionBtn a {

    padding: 11px 10px;

}




/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button,

input::-webkit-inner-spin-button {

  -webkit-appearance: none;

  margin: 0;

}



/* Firefox */

input[type=number] {

  -moz-appearance: textfield;

}





.tableManagement .btn {

    background: #fff;

    color: #3F3E3E;;

    padding: 10px 20px;

    box-shadow: 0px 4px 4px rgb(240 180 59 / 8%);

    border-radius: 5px;

    font-weight: 500;

}

.tableManagement .btn.active{

    background-color: var(--colorBlack);

    color: #FFFFFF;

}



.border-right-0 {

    border-right: 0 !important;

}

.availability .input-group-text {

    position: absolute;

    top: 0;

    bottom: 0;

    right: 0;

    background: transparent;

}

.availability .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating){

    border-radius: 4px !important;

}

.btnaddon{

    background-color: #E8E8E8;

    min-height: calc(1.5em + 1rem + 4px);

}

.btnaddon:hover, .btnaddon:active .btnaddon:focus, .btnaddon:focus-visible, :not(.btn-check)+.btn:active {

    background-color: var(--bg_primary);

    border-color: var(--bg_primary);

}
.btn:focus-visible{
    background-color: var(--bg_primary);
    border-color: var(--bg_primary);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgb(99 95 237 / 30%);
}

.custom-dropdown .dropdown-item path {

    fill: var(--colorRed);

}

.user_block path {

    fill: var(--colorRed);

}

.user_block {

    background: #ffc9c8;

    padding: 21px;

    width: 65px;

    height: 65px;

    margin: auto;

    border-radius: 10px;

}

.pargh_block{

    max-width: 238px;

    /* word-break: break-word; */

    display: -webkit-box;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;

    overflow: hidden;

    white-space: normal;

}

/* chatbot styles */

.msger {

    display: flex;

    flex-flow: column;

    justify-content: center;

    width: 100%;

    /* max-width: 400px; */

    margin: 0px 0 30px;

    border-radius: 5px;

    box-shadow: 0 15px 15px -5px rgb(0 0 0 / 6%);

    font-family: 'Avenir LT Pro', sans-serif;

}

  

  .msger-chat::-webkit-scrollbar {

    width: 6px;

  }

  .msger-chat::-webkit-scrollbar-track {

    background: #ddd;

  }

  .msger-chat::-webkit-scrollbar-thumb {

    background: #bdbdbd;

  }

  .msg {

    display: flex;

    align-items: flex-end;

    margin-bottom: 10px;

  }

  .msg:last-of-type {

    margin: 0;

  }

  .msg-bubble {

    padding: 15px;

    border-radius: 15px;

    border: 1px solid #dcdcdc;

}

.msg-info {

    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 10px;

}

  .msg-info-name {

    margin-right: 10px;

    font-weight: bold;

  }

  .msg-info-time {

    font-size: 0.85em;

  }

  

  .left-msg .msg-bubble {

    border-bottom-left-radius: 0;

    background: #ffffff;

}

.ads_tbl .avtar_45 {

    width: 50px;

    height: 50px;

}

header.msger-header .msger-header-title {

    display: flex;

    align-items: center;

    gap: 15px;

}

header.msger-header span.hed_icn {

    display: inline-flex;

    justify-content: center;

    height: 40px;

    width: 40px;

    border-radius: 50%;

    background-color: #fff;

    overflow: hidden;

}

header.msger-header span.hed_icn img {

    max-width: 100%;

    height: auto;

}

header.msger-header {

    /* text-align: center; */

    background: #5ab2a6;

    padding: 15px 30px;

    border-bottom: 5px solid #eeeeee;

    color: #000;

    border-radius: 10px 10px 0 0;

}

.rply textarea::placeholder {

    color: #7a7c7f;

}

.rply input.vw_btn.btn {

    width: fit-content;

    padding: 10px 30px;

}

.rply textarea {

    height: 200px;

    padding: 20px;

}

  .right-msg {

    flex-direction: row-reverse;

  }

  .right-msg .msg-bubble {

    background: #5ab2a6;

    border-bottom-right-radius: 0;

    color: #000;

}

.msger-input::placeholder{

    color: #6c6a6a;

}

.msger-inputarea {

    display: flex;

    padding: 10px;

    background: #fff;

    border: 1px dashed #f4f8fe;

    border-top: 0;

    /* box-shadow: 0px 17px 18px 0px #0000000d; */

}

.msger-input:focus-visible {

    outline: transparent;

}   

.msger-input:active, .msger-input:focus {

    border: 0;

}

.msger-input {

    flex: 1;

    border: 0;

    padding: 0;

    height: 40px;

}   

.msg_inp_blk {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0px 0px 0px 20px;
    border: 1px solid #dcdcdc;
    border-radius: 30px;
}

.msger-send-btn {
    margin-left: 10px;
    padding: 10px 35px;
    background: #399b88;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.23s;
    border: 0;
    border-radius: 30px;
}

.msger-send-btn:hover {
    background: #292d32;
}
  .msger-chat {
    background-color: #eeeeee;
    padding: 10px;
    height: 400px;
    overflow-y: scroll;
}

.card-icon.crd_odd {
    background: #ffffff;
    border: none;
}

.crd_evn {
    background-color: #165CE7;
}

/* chatbot styles end */

/* .dropdown-toggle::after {
    float: right;
} */

/* ===============Media Query Start here=============== */

@media (max-width: 990px){

    .lg_pg {

        background: #fafafa;

        height: auto;

    }
    .sub_btn {
        position: relative;
        left: 0;
        text-align: center;
        
    }
    .subs_blk div#upcomingReservation_wrapper div#upcomingReservation_filter {
        position: unset;
    }

}

@media (max-width: 767px){

    .login_wrapper {

        background-size: cover;

        padding: 15px 0px;

        height: auto;

    }

    .custom-card{

        padding: 24px;

    }

    #page-content-wrapper {
        margin: 0px;
        border-radius: 0;
    }
    .sb-sidenav-toggled #page-content-wrapper {
        margin-left: 0;
    }
    body.sb-sidenav-toggled #wrapper #sidebar-wrapper {
        margin-left: 0;
        width: 100%;
        background-color: #ECB004;
    }   
    .log_item {
        position: relative;
    }
    button#sidebarToggle {
        margin-top: 10px;
        border: 1px solid #000;
    }
    .sub_btn {
        position: relative;
        left: 0;
        text-align: center;
    }
    .subs_blk div#upcomingReservation_wrapper div#upcomingReservation_filter {
        position: unset;
    }
    .subs_btn_rw {
        gap: 10px;
        flex-wrap: wrap;
    }

    #sidebar-wrapper{

        margin-left: -312px;

        z-index: 9;

    }

    #closeSidebar{

        display: block;

        position: absolute;

        right: 16px;

        top: 16px;

    }

    .sb-sidenav-toggled .overlay{

        display: block;

    }

    .lst_dtl {

        width: 100%;

        border-right: 0 !important;

    }

    .content_mn {

        padding-inline: 20px;

    }

    .ad_med {

        padding: 20px;

    }

    .llog_bg img.img-fluid {

        height: 70vh;

        object-fit: contain;

    }

}

@media (min-width: 767px){

    #closeSidebar{

        display: none;

    }

}

@media (min-width: 576px){

    .customModel .modal-dialog {

        max-width: 432px;

        margin-right: auto;

        margin-left: auto;

    }

}



.resttro_img img {

    width: 162px;

    height: 110px;

    object-fit: cover;

    border-radius: 5px;

}

ul.ms-recent-support-tickets li {

    list-style: none;

}  

ul.ms-recent-support-tickets {

    margin: 0px;

    padding: 0px;

}

.ms-twitter-feed .media {

    align-items: flex-start;

    display: flex;

} 

.ms-img-small {

    width: 73px;

    height: 73px;

    margin-top: 5px;

    border-radius: 100px;

}

.customer-meta {

    display: flex;

    justify-content: space-between;

    align-items: center;

}

.ms-feed li.ms-list-item {

    border-bottom: 1px solid rgba(0,0,0,.1);

    margin-bottom: 22px;

    padding-bottom: 22px;

}

.ms-feed li.ms-list-item:last-child{border-bottom: 0px; padding-bottom: 0;}

.binarydark {

    position: relative;

    width: 75px;

    height: 75px;

    background: #E4F7F7;

}
.btn.bg-success {
    background-color: #DDEEE1 !important;
    color: #48BF45 !important;
    padding: 7px 25px;
    border-radius: 10px;
    min-width: 150px;
}
.browndark{background-color:#114A53;}

.browndark {

    background-color: #88f5f33b;

}

.graylight {

    background-color: #F8F8F8;

}

.colorBlack svg {

    position: absolute;

}

/* .card{flex-direction: inherit;} */



/* .browndark img {

    width: 52px;

    position: absolute;

} */

.card {

    border: 0;

}

.btn-danger {

    background-color: #dc3545;

    color: #fff;

    border-color: transparent;

    /* border-radius: 7px; */

    /* padding: 7px 43px; */

}

table.dataTable thead th, table.dataTable thead td {
    padding: 12px 18px;
    border-bottom: 0 !important;
}

.charity_54 img {

    object-fit: contain;

    width: 100%;

    height: 100%;

}

.profile_photo img {

    width: 100%;

}

.profile_photo {

    background: #fff;

    box-shadow: 0 0 5px #cccc;

    width: 140px;

    border-radius: 100px;

    padding: 39px;

    height: 140px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: auto;

}

hr{opacity: .1;}

.profile_block {

    background: #fffafa;

    border-radius: 10px;

    text-align: center;

    padding: 29px;

}

.profile_img {

    width: auto;

    height: 242px;

    border-radius: 13px;

    overflow: hidden;

    margin: auto;

}

.profile_img img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}

.delete_block {

    background: rgb(168, 134, 107, 0.2);

    position: absolute;

    top: 0px;

    z-index: 999;

    right: 1px;

    padding: 12px;

    border-radius: 0px 0px 0 26px;

}

.upload_pict input {

    position: absolute;

    /* left: 0px; */

    right: 0px;

    left: 0px;

    margin: auto;

    width: 100px;

    opacity: 0;

}

.total_amount {

    background-color: #a5795b;

    padding: 12px;

    border-radius: 6px;

}

.readmore {

    text-decoration: underline;

    color: #a8866b;

}

.btn-danger.delete_btn:hover {

    color: #fff;

    background-color: #ff29212b;

}

/*************tablecss*****************/





table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {

    background-color: transparent !important;

}

table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {

    background-color: transparent;

}

table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {

    border-top:0px !important;

}

.work_block {

    background: #fffafa;

    width: 100%;

    padding: 8px;

}

div.ck-editor__editable {

    min-height: 500px;

  }

  .full_img_banner img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}

.full_img_banner {

    width: 100%;

    height: 269px;

    overflow: hidden;

}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #000;
    font-weight: 500;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 3px solid #000;
}

.nav-link{color: #000;}

.nav-link:focus, .nav-link:hover {color: #156568;}

.delete_btn {

    background-color: #FFE9E9;

    padding: 8px 9px;

    border-radius: 4px;

}

.user_profile_block img {

    object-fit: cover;

    width: 100%;

    height: 100%;

}

.user_profile_block {

    width: 140px;

    height: 140px;

    overflow: hidden;

    border-radius: 100px;

}

.profile_width{

    width: fit-content;

    position: relative;

}

.camera {

    position: absolute;

    /* top: 0px; */

    right: 0px;

    bottom: 0px;

}

.profile_width {

    width: fit-content;

    position: relative;

    margin: auto;

}

.camera input {

    position: absolute;

    top: 9px;

    opacity: 0;

}

.global-shadow {

    -webkit-box-shadow: 0 5px 20px rgba(var(--light-gray-rgba),.03);

    box-shadow: 0 5px 20px rgba(var(--light-gray-rgba),.03);

}

table.dataTable thead th, table.dataTable tfoot th {
    font-weight: 600 !important;
    background-color: transparent;
    color: #212121;
    font-size: 14px;
}

table.dataTable tbody th, table.dataTable tbody td {

    /* padding: 11px 17px; */

    font-size: 14px;
    font-weight: 400;
    border-bottom: 0;
    color: #475569;

}

.paginate_button.next, .paginate_button.previous {

    border:1px solid #dddddd;

    background-color: transparent !important;

}

.redtext{color:#FF3B30;}

.greentext{color:#306B34;}

.outer {

    position: relative;

    width: 600px;

    height: 400px;

  }

  .percent {

   position: absolute;

      left: 50%;

      transform: translate(-50%, 0);

      font-size: 80px;

      bottom: 0;

  }

  .green_block {

    background-color: #306B34;

    color: #fff;

    border-radius: 100px;

    width: 50px;

    height: 50px;

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: auto;

}

.blue_block {

    background-color: #0F6ECC;

    color: #fff;

    border-radius: 100px;

    width: 50px;

    height: 50px;

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: auto;

}

.red_block {

    background-color: #EA3A60;

    color: #fff;

    border-radius: 100px;

    width: 50px;

    height: 50px;

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: auto;

}

.purple_block {

    background-color: #89437E;

    color: #fff;

    border-radius: 100px;

    width: 50px;

    height: 50px;

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: auto;

}

.table_block_box tr td{padding: 13.2px; border-bottom: 0px;}

.switch {

    position: relative;

    display: inline-block;

    width: 60px;

    height: 34px;

  }

  

  .switch input { 

    opacity: 0;

    width: 0;

    height: 0;

  }

  

  .slider {

    position: absolute;

    cursor: pointer;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background-color: #ccc;

    -webkit-transition: .4s;

    transition: .4s;

  }

  

  .slider:before {

    position: absolute;

    content: "";

    height: 26px;

    width: 26px;

    left: 4px;

    bottom: 4px;

    background-color: white;

    -webkit-transition: .4s;

    transition: .4s;

  }

  input:checked + .slider {

    background-color: #2196F3;

  }

  

  input:focus + .slider {

    box-shadow: 0 0 1px #2196F3;

  }

  

  input:checked + .slider:before {

    -webkit-transform: translateX(26px);

    -ms-transform: translateX(26px);

    transform: translateX(26px);

  }

    /* Rounded sliders */

  .slider.round {

    border-radius: 34px;

  }

  

  .slider.round:before {

    border-radius: 50%;

  }

  .nav-pills .nav-link.active, .nav-pills .show>.nav-link {

    color: var(--bs-nav-pills-link-active-color);

    background-color: var(--bg_primary);

}

.method {

    background: #E8EFF8;

    padding: 10px;

}



/* spalash styles */

.logo svg {

    width: 120px;

}

.dropdown-menu.dropdown-block.show {
    display: block;
    position: relative !important;
    transform: translate(0px, 0px) !important;
}
.navbar {
    background-color: #fff;
    border-radius: 12px;
}
   /* user mgt */
   .edit-btn {
    background-color: #3EBB52;
    border-radius: 6px;
    width: 30px;
    height: 30px;
    border: 0px;
    padding: 4px;
    text-align: center;
}
.block-btn{
    background-color:#635FED;
    border-radius: 6px;
    width: 30px;
    height: 30px;
    border: 0px;
}  
.delete-btn{
    background-color:#E53535;
    border-radius:6px;
    width: 30px;
    height: 30px;
    border: 0px;
}  
  /* user mgt detail*/

.user-block {
    background-image: url('../images/user_bg.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    border-radius: 16px;
}
.user-photo {
    width: 122px;
    height: 122px;
    margin: auto;
}
.user-photo img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 100px;
    border: 4px solid #fff;
}
.bade-block {
    background-color: #fff;
    border-radius: 100px;
    width: 58px;
    margin: auto;
    padding: 4px;
}
.current-balance {
    display: flex;
    flex-wrap: wrap;
    background: rgb(231,249,235);
    background: linear-gradient(90deg, rgba(231,249,235,1) 3%, rgba(244,243,234,1) 100%);
    border-radius: 16px;
    padding: 32px;
    gap: 17px;
}

.total-loyalty {
    display: flex;
    flex-wrap: wrap;
    background: rgb(251,245,209);
background: linear-gradient(90deg, rgba(251,245,209,1) 3%, rgba(252,239,228,1) 100%);
    border-radius: 16px;
    padding: 32px;
    gap: 17px;
}
.icon-block {
    width: 44px;
    height: 44px;
    background-color: #FFF7F4;
    border-radius: 10px;
    padding: 11px;
}
ol.breadcrumb li {
    font-size: 18px;
    font-weight: 600;
    color: var(--bg_main_dark) !important;
}
ol.breadcrumb li a {
    color: #635FED;
    text-decoration: underline;
}
ol.breadcrumb li span {
    background-color: #E0F4E3;
    padding: 5px 15px;
    border-radius: 40px;
    font-size: 14px;
    color: #3EBB52;
}
.dataTables_wrapper .dataTables_length {
    float: left;
    font-size: 14px;
}
div#upcomingReservation_filter {
    color: #292d32 !important;
    font-size: 14px;
}
 /*Machines*/
 .switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
  }
  
  .switch input { 
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .slider {
    background-color: #635FED;
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #635FED;
  }
  
  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }
  .pargh-block {
    max-width: 238px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    /* line-height: 18px; */
    white-space: pre-wrap;
    margin-bottom: 0;
    padding-bottom: 0;
    vertical-align: middle;
}
.view-product-btn {
    background-color: #FCECE6;
    border: 0px;
    border-radius: 6px;
    color: #000000;
    padding: 6px 11px;
    font-size: 12px;
}
.breadcrumb-block::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #f9f6f4;
    left: 0;
    top: 73px;
}
 /*Vending machine orders*/
 .complete-btn{background-color:#E7FCE6;}
 .rejected-btn{background-color:#FFE2E2;}
 .pending-btn{background-color:#DBF9FF;}
 .viewbtn{
    background-color:#E1F6F5;
 }
 .detail-block {
    background-color: #FFF7F4;
    border-radius: 15px;
    padding: 31px;
    min-height: 397px;
}
ul.listing-block {
    margin: 0px;
    padding: 0px;
}
ul.listing-block li {
    list-style: none;
    display: inline-block;
    width: 49%;
    margin-bottom: 17px;
}
.dropdown-toggle::after {
    position: absolute;
    right: 9px;
    top: 16px;
}
.dropdown-item {
    color: #757575;
    font-size: 14px;
    border: 0px;
}
.dropdown-menu.dropdown-block.show {
    border: 0px;
}
.dropdown-item.active, .dropdown-item:active {
    background-color: #F6F6F6;
    color: #000;
}
 /*Warehouse Documents*/
 .dropstart .dropdown-toggle::before {
    border-top: .3em solid transparent;
    border-left: .3em solid;
    border-bottom: .3em solid transparent;
    border-right: 0px;
    position: absolute;
    right: 7px;
    top: 13px;
}
.warehouse .dataTables_length {
    display: none;
}
.warehouse .dataTables_wrapper .dataTables_filter {
    display: none;
}
ul.filter-block {
    margin: 0px;
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: end;
}
ul.filter-block li {
    display: inline-block;
    list-style: none;
    border-left: 1px solid #FBF4F0;
    padding: 14px 9px;
}
#sidebar-wrapper .list-group-item-light.list-group-item-action.active span.menu-icons svg path {
    stroke: #fff;
}
.left-search {
    width: 100%;
    margin-right: 15px;
}
ul.filter-block li ul li {
    padding: 0px;
    border-right: 0;
    width: 100%;
    line-height: 24px;
}
.filter-right .dropdown-item {
    color: #1C1C1C;
    font-size: 14px;
    border: 0px;
}
.filter-right .dropdown-menu {
    border: 0px;
    box-shadow: 0 0 5px #efe7e7;
    /* transform: translate(-3px, 54px) !important; */
}
ul.filter-block li ul li:nth-child(1) {
    border-bottom: 1px solid #cccccc6b;
}
ul.filter-block li ul li:nth-child(6) {
    border-bottom: 1px solid #cccccc6b;
}
ul.filter-block li ul li:nth-child(10) {
    border-bottom: 1px solid #cccccc6b;
}
.nav-tabs .nav-link {
    color: #A6A6A6;
}
table.dataTable tfoot th, table.dataTable tfoot td {
     border-top:0px !important;
}
.form{

    position: relative;
}

.form .fa-search{

    position: absolute;
    top:20px;
    left: 20px;
    color: #9ca3af;

}

.form span {
    position: absolute;
    right: 17px;
    top: 0;
    padding: 11px 0 4px 13px;
    border-left: 1px solid #d1d5db;
    height: 45px;
}
.form .search-block {
    position: absolute;
    right: 73px;
    top: 9px;
}
.left-pan{
    padding-left: 7px;
}



.form-input {
    height: 45px;
    text-indent: 1px;
    border-radius: 10px;
}
.form {
    width: 90%;
}
.form-input:focus{
    box-shadow: none;
    border:none;
}
.today-block::before {
    content: '';
    position: absolute;
    width: 47%;
    background-color: #e1dcdc;
    height: 1px;
    top: 11px;
    right: 0;
}
.today-block::after {
    content: '';
    position: absolute;
    width: 47%;
    background-color: #e1dcdc;
    height: 1px;
    top: 11px;
    left: 0;
}
.today-block {
    text-align: center;
    margin-top: 18px;
    position: relative;
}
.note-block {
    background-color: #FFF7F4;
    border-radius: 8px;
}
 /*inventory adjustments*/
.chip-container {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 5px;
    /* max-width: 400px; */
}
.chip {
    display: inline-flex;
    align-items: center;
    background-color: #FCF2EE;
    color: #1C1C1C;
    padding: 5px 10px;
    border-radius: 15px;
    font-size: 14px;
}
  .chip span {
    margin-left: 8px;
    cursor: pointer;
  }
  .chip-input {
    border: none;
    outline: none;
    font-size: 14px;
    padding: 5px;
  }
  .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}
.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e") !important;
}
.carousel-item img {
    margin: auto;
}
@media (max-width: 767px){

    .add_medi_btn {

        width: fit-content;

        margin: 10px 0 0 0;

    }

    .dataTables_wrapper .dataTables_paginate .paginate_button {

        margin-right: 0;

        padding: 5px 15px !important;

        font-size: 14px;

    }

    .dataTables_wrapper .dataTables_paginate {

        display: flex;

        flex-wrap: wrap;

        justify-content: center;

        gap: 10px 5px;

    }

    .msg-bubble {

        padding: 8px 10px;

        font-size: 13px;

    }

    .msg_inp_blk {

        flex-wrap: wrap;

        padding: 0px 0px 0px 5px;

        font-size: 13px;

    }

    .msger-input {

        width: 50%;

    }

    .msger-send-btn {

        width: 40%;

        margin-left: 5px;

        font-size: 13px;

        padding: 7px;

    }

    div#dashboard .card.w-75 {

        width: 100% !important;

    }

    .picture {
        width: 150px;
        height: 150px;
    }

}
.fit-img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.theme-btn.btn-primary{
    background-color: var(--bg_primary);
    border-color: var(--bg_primary);
}
.theme-btn.btn-primary:hover{
    background-color: var(--bg_primary_dark);
    border-color: var(--bg_primary_dark);
}
.icons-40 {
    width: 40px;
    height: 40px;
    padding: 7px;
    border: 1px solid #E3E3E3;
    border-radius: 50%;
    display: flex;
    justify-content: center;
}

.brand_profile {
    background: #f6f6ff;
    border-radius: 16px;
}

.wallets{
    background-image: url(../images/bg-gradient.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    box-shadow: 0px 4px 4px -1px #00000012;
    border: 1px solid #fff;
    border-radius: 10px;
}
.white-space-wrap{
    white-space: break-spaces !important;
}

.badge {
    font-size: 14px;
    font-weight: 400;
    border-radius: 16px;
    padding: 6px 14px;
}

.text-bg-success{
    background: #bcffd0 !important;
    border: 1px solid #2cbf43;
    color: #2cbf43 !important;
}
.text-bg-danger{
    background: #dc354618 !important;
    border: 1px solid #dc3545;
    color: #dc3545 !important;
}


.campain-table table.dataTable tbody th, .campain-table table.dataTable tbody td {
    vertical-align: top;
}

.transaction-card {
    padding: 16px;
    background: #f5f5ff;
    border-radius: 10px;
}
.border-bottom{
    border-color: #f9f6f4 !important;
}
.btn-secondary {
    background: #e9e8ff;
    border-color: #e9e8ff;
    color: #4441a1;
}

.btn-secondary:hover {
    background: #c5c4db;
    border-color: #c5c4db;
    color: #4441a1;
}
.avatar-upload {
    position: relative;
    max-width: 150px;
     margin: 0 auto;
    padding-bottom: 24px ;
  
  }
  .avatar-upload .avatar-edit {
    position: absolute;
    right: 3px;
    z-index: 1;
    bottom: 27px;
  }
  .avatar-upload .avatar-edit input {
    display: none;
  }
  .avatar-upload .avatar-edit input + label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: #FFFFFF;
    border: 1px solid transparent;
    box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 27%);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
    display: flex
;
    align-items: center;
    justify-content: center;
  }
  .avatar-upload .avatar-edit input + label:hover {
    background: #f1f1f1;
    border-color: #d6d6d6;
  }
  .avatar-upload .avatar-preview {
    width: 130px;
    height: 130px;
    position: relative;
    border-radius: 100%;
    border: 4px solid #F8F8F8;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
  }
  .avatar-upload .avatar-preview > div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }