@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



* {

  padding: 0px;

  margin: 0px;

  box-sizing: border-box;

}



body {

  padding: 0px;

  margin: 0px;

  font-family: "Poppins", sans-serif;

}



body {

  overflow-x: auto;

  padding-bottom: 0px;

}



body::-webkit-scrollbar {

  height: 4px;

  width: 6px;

}



body::-webkit-scrollbar-track {

  background: #000;

  /* border: 1px solid #1E1E1E; */

}



body::-webkit-scrollbar-thumb {

  background-color: #4aeab170;

  border-radius: 20px;

}



a {

  text-decoration: none !important;

  outline: none !important;

}



img {

  border: none;

}



.clr {

  clear: both;

}







/* ====== ZYVO LOGIN CSS ====== */



.login-wrap {

  width: 100%;

  height: 100vh;

  background: #fff;

  display: flex;

  align-items: center;

  justify-content: center;



  /* ----- left right sec css ---- */



  .login-in {

    width: 100%;

    height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #fff;

    border-radius: 0;

    overflow: hidden;



    /* logo css start */

    .login-logo {

      flex: 50%;

      height: 100%;

      padding: 50px 0;

      display: flex;

      position: relative;



      .logo {

        width: 100%;

        height: auto;

        margin: auto;

        text-align: center;

      }



      img {

        width: 25%;

        height: 100%;

      }

    }



    /* logo css end */



    /* form css start */

    .login-form {

      flex: 50%;

      background: #3A4B4C;

      height: 100%;

      display: flex;

      align-items: center;

      flex-direction: column;

      justify-content: center;

      padding: 100px 50px;



      .login-btn {

        width: 100%;

        height: auto;

        color: #000 !important;

        border: none;

        display: flex;

        border-radius: 30px;

        background: #4AEAB1;

        text-align: center;

        align-items: center;

        justify-content: center;

        font-size: 18px;

        font-weight: 500;

        padding: 12px 0;

      }



      form {

        width: 100%;

        height: auto;

        border-radius: 17px;

        background: #fff;

        padding: 51px 50px 100px 50px;

        /* padding: 0px; */

        display: flex;

        flex-direction: column;

        align-items: center;

        gap: 25px;

      }



      h1 {

        color: #000;

        text-align: center;

        font-size: 30px;

        font-style: normal;

        font-weight: 500;

        line-height: normal;

        margin-bottom: -4px;

      }



      .line-bottom {

        border: 1px solid #e5e5e5;

        width: 100%;

      }



      .login-lbl {

        width: 100%;

        height: 51px;

        margin-bottom: 0;

        border-radius: 30px !important;

        border: none;

        background: #FFF;

        position: relative;

        overflow: hidden;

        display: flex;

        align-items: center;



        img {

          width: 45px;

          border-radius: 34px;

          height: 45px;

          position: absolute;

          left: 3px;

        }



        p {

          color: #FF3434;

          font-size: 13px;

          font-weight: 400;

          margin: 0;

          width: 100%;

        }



        .login-txt {

          width: 100%;

          height: 100%;

          /* border: none; */

          color: #7A7A7A;

          font-size: 15px;

          border: 1px solid #C4C4C4;

          border-radius: 30px;

          font-weight: 500;

          padding: 0px 45px 0px 55px;



          ::placeholder {

            color: #7A7A7A;

            font-weight: 300;

            font-size: 14px;

          }



        }



        .password-eye {

          position: absolute;

          width: 20px;

          height: 20px;

          display: flex;

          top: auto;

          right: 15px;

          border: none;

          align-items: center;

          background: none;

          justify-content: center;

          transition: .5s;



          i {

            color: #C0C0C0;

            cursor: pointer;

          }



          .fa-eye-slash:before {

            content: '';

            width: 20px;

            height: 20px;

            display: block;

            background-size: contain;

            background-position: center;

            background-repeat: no-repeat;

            background-image: url(../images/ZYVO-images/all-icons/eye-close.svg);

          }



          .fa-eye:before {

            content: '';

            width: 20px;

            height: 20px;

            display: block;

            background-size: contain;

            background-position: center;

            background-repeat: no-repeat;

            background-image: url(../images/ZYVO-images/all-icons/eye-open.svg);

          }





        }

      }



      .rembr-me {

        width: 100%;

        display: flex;

        align-items: center;

        gap: 4px;

        line-height: 5px;

        /* font-family: 'Font Awesome 5 Pro'; */

        color: #000000;

        font-size: 16px;

        font-weight: 500;

        justify-content: flex-start;



        input[type="checkbox"] {

          width: 19px;

          height: 18px;

          margin-right: 4px;

          cursor: pointer;

          appearance: none;

          border: 2px solid #000;

          /* background-color: #CE2127; */

          border-radius: 3px;

          outline: none;

        }



        input[type="checkbox"]:checked {

          background-image: url(../images/ZYVO-images/all-icons/arrow-check.svg);

          background-position: center;

          background-repeat: no-repeat;

          background-size: 20px;

          border: none;

          background-color: #4AEAB1;

        }



      }



    }



    /* form css start */





  }



  /* ----- left right sec css ---- */



}



/* --- Login succesfull modalpopup css --- */



#login-succ .modal-dialog {

  max-width: 380px;

  height: 100%;

  margin: 0rem auto;

  display: flex;

  align-items: center;

  justify-content: center;



  .logout-in-btn {

    border: none;

    padding: 12px 60px;

    color: #000 !important;

    font-size: 15px;

    font-weight: 500;

    border-radius: 28px;

    background: #4AEAB1;

    line-height: normal;

  }



  .modal-body {

    padding: 2.4rem 1rem;

  }



  .modal-content button.close {

    width: 22px;

    height: 22px;

    opacity: .5;

    background: none;

    border: none;

    outline: none;

    position: absolute;

    right: 8px;

    top: 8px;

    z-index: 99;

  }



  .modal-content button.close img {

    width: 100%;

    height: 100%;

  }



}



#login-succ .modal-content {

  border-radius: 10px;

  background: #FFF;



  .logout-in {

    h1 {

      font-weight: 600;

      font-size: 26px;

      margin: 10px 0 10px 0;

      color: #000;

    }



    img {

      width: 81px;

      /* box-shadow: 0px 0px 10px 0px #00000040; */

      border-radius: 50%;

    }



    p {

      margin: 20px 0;

      color: #000;

      text-align: center;

      font-family: Poppins;

      font-size: 16px;

      font-style: normal;

      font-weight: 500;

    }

  }





}





/* --- Login succesfull modalpopup css --- */





/* ====== ZYVO LOGIN CSS ====== */



/*==== LOGOUT-POPUP =====*/



.clearfix::after {

  content: '';

}



.logout-in {

  width: 100%;

  height: 100%;

  text-align: center;



  i {

    font-size: 70px;

    color: #171748;

  }

}





/*==== LOGOUT-POPUP =====*/





/* ====== ADMIN DASHBOARD PAGE CSS ======= */



.dashboard-wrap {

  background-image: url(../images/ZYVO-images/all-icons/dasboard-bg.svg);

  padding: 11px;

  height: auto;

  background-repeat: repeat;

  background-size: 100%;

}





/* ---TRACKER CSS --- */

.tracker-boxes-wrap {

  display: flex;

  width: 100%;

  align-items: center;

  gap: 23px;



  & .box {

    border: 1px solid #E2E2E2;

    width: 25%;

    padding: 10px 10px;

    background: #fff;

    gap: 12px;

    display: flex;

    border-radius: 5px;

  }



  & .content-wrap {

    display: flex;

    flex-direction: column;

  }



  img {

    width: 53px;

  }



  h3 {

    font-size: 20px;

    font-weight: 500;

    color: #000;

    margin-bottom: 0;

  }



  p {

    font-size: 16px;

    font-weight: 400;

    color: #000;

    margin-bottom: 5px;

  }



}



/* ---TRACKER CSS --- */



/* --- BOOKING CSS ---- */



.boooking-boxes-wrap {

  display: flex;

  width: 100%;

  gap: 23px;

  padding-top: 26px;



  .booking-boxes {

    border: 1px solid #E2E2E2;

    width: 50%;

    padding: 10px 22px;

    background: #fff;

    border-radius: 5px;





    .header-sec {

      display: flex;

      align-items: center;

      justify-content: space-between;





      h3 {

        font-size: 18px;

        font-weight: 500;

        color: #000;

        margin-bottom: 0;

      }



      form {

        width: auto;

        height: auto;

        display: flex;

        align-items: center;

        gap: 5px;



        & a img {

          width: 40px;

        }



      }



      /* select option */

      .influ-select {

        width: 100%;

        height: 40px;

        min-width: 130px;

        margin-left: 0;

        border: 1px solid #E2E2E2;

        border-radius: 38px;



        select {

          width: 100%;

          height: 100%;

          color: #000;

          font-size: 14px;

          font-weight: 500;

          border-radius: 38px;

          outline: none;

          border: none;

          cursor: pointer;

          appearance: none;

          padding: 0 10px;

          background: url(../images/ZYVO-images/all-icons/dropdown.svg);

          background-position: center right 10px;

          background-size: auto;

          background-repeat: no-repeat;

          background-color: #fff;

        }



        option {

          color: #000;

        }



        ::placeholder {

          color: #000;

        }



      }



      /* select option */





    }







    /*CUSTOM SELECT DROPDOWN*/



    /* The container must be positioned relative: */





    .edit-in_txt-new {

      height: 45px;

      width: 100%;

      min-width: 116px;

      /* height: 100%; */

      border: none;

      outline: none;

      padding-left: 11px;

      /* margin-bottom: 6px; */

      padding-right: 40px;

      font-size: 14px;

      border-radius: 52px;

      border: 1px solid #E2E2E2;

      color: #444444;

      margin-bottom: 1px;

      margin-top: 2px;

    }



    .select-items {

      position: absolute;

      /* background-color: #fff; */

      top: 100%;

      left: 0;

      border-radius: 10px;

      border: 1px solid #E2E2E2;

      background: #FFF;

      right: 0;

      /* border: 1px solid #C0C0C0; */

      z-index: 99999;

      margin-top: 6px;

      /* padding: 9px 14px 4px 11px; */

      border-radius: 5px;

    }



    /* Hide the items when the select box is closed: */

    .select-hide {

      display: none;

    }



    .custom-select {

      position: relative;

      padding: 0;

    }



    .custom-select select {

      display: none;

      /*hide original SELECT element: */

    }



    .select-selected {

      background-color: transparent;

    }



    /* Style the arrow inside the select element: */

    .select-selected:after {

      position: absolute;

      content: "";

      top: 0;

      right: 6px;

      display: flex;

      width: 16px;

      background-repeat: no-repeat;

      background-size: contain;

      height: 100%;

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

      /* z-index: 9999; */

      justify-content: center;

      background-position: center;

      align-items: center;

      transform: rotate(0deg);

      transition: .5s;

    }



    /* Point the arrow upwards when the select box is open (active): */

    .select-selected.select-arrow-active:after {

      transform: rotate(90deg);

      transition: .5s;

    }



    /* style the items (options), including the selected item: */

    .select-items div,

    .select-selected {

      color: #000;

      padding: 11px 10px;

      /* font-family: 'Montserrat'; */

      border: 0;

      font-weight: 500;

      border-color: transparent;

      cursor: pointer;

      width: 100%;

      text-align: left;

      margin-bottom: 5px;

    }



    .select-items div:first-child {

      border-radius: 5px 5px 5px 5px;

    }



    .select-items div:last-child {

      border-radius: 5px 5px 5px 5px;

    }



    /* Style items (options): */

    .select-items {

      position: absolute;

      top: 100%;

      left: -85px;

      right: 0px;

      padding: 4px 4px;

      width: 100%;

      min-width: 201px;

      z-index: 99999;

      margin-top: 6px;

      border-radius: 5px 5px 5px 5px;

    }



    /* Hide the items when the select box is closed: */

    .select-hide {

      display: none;

    }



    .select-items div:hover,

    .same-as-selected {

      background: #f0f0f2;

      color: #000;

      border-radius: 5px 5px 5px 5px;

    }



    /*CUSTOM SELECT DROPDOWN*/











    /* USER DETAIL CSS */



    .user-boxes-wrap {

      border: 1px solid #E2E2E2;

      border-radius: 5px;

      padding: 5px 10px;

      align-items: center;

      display: flex;

      margin-top: 12px;

      margin-bottom: 12px;



      & .user-data-box {

        display: flex;

        justify-content: space-between;

        width: 100%;



        /* img sec */

        & .image-sec {

          display: flex;

          align-items: center;

          gap: 7px;



          img {

            width: 40px;

            height: 40px;

            object-fit: cover;

          }



          p {

            font-size: 16px;

            font-weight: 500;

            color: #000;

            margin-bottom: 0;

          }



          span {

            background: #3A4B4C;

            padding: 3px 10px;

            border-radius: 30px;

            color: #fff;

            font-size: 13px;

            margin-bottom: 0;

          }

        }



        /* img sec */



        /* Schedule css */

        .schedule-sec {

          display: flex;

          align-items: center;

          gap: 7px;





          & span.primary {

            font-size: 16px;

            background: #b1ddfd;

            padding: 5px 9px;

            font-weight: 500;

            border-radius: 30px;

            color: #000;

            margin-bottom: 0;

          }



          & span.go-green {

            font-size: 16px;

            background: #4AEAB1;

            padding: 5px 9px;

            font-weight: 500;

            border-radius: 30px;

            color: #000;

            margin-bottom: 0;

          }



          & span.waiting {

            font-size: 16px;

            background: #FFF178;

            font-weight: 500;

            padding: 5px 9px;

            border-radius: 30px;

            color: #000;

            margin-bottom: 0;

          }



        }



        /* Schedule css */



      }





    }



    /* USER DETAIL CSS */



  }



  /* USER CASH FLOW CSS */



  .user-cash-boxes {

    border: 1px solid #E2E2E2;

    width: 24%;

    padding: 10px 9px;

    background: #fff;

    border-radius: 5px;





    .header-sec {

      display: flex;

      align-items: center;

      justify-content: space-between;

      gap: 7px;



      h3 {

        font-size: 18px;

        font-weight: 500;

        color: #000;

        margin-bottom: 0;

      }



      form {

        width: auto;

        height: auto;

        display: flex;

        align-items: center;

        gap: 5px;



        & a img {

          width: 34px;

        }



      }



      /* select option */

      .influ-select {

        width: 100%;

        height: 38px;

        min-width: 108px;

        margin-left: 0;

        border: 1px solid #E2E2E2;

        border-radius: 38px;



        select {

          width: 100%;

          height: 100%;

          color: #000;

          font-size: 14px;

          font-weight: 500;

          border-radius: 38px;

          outline: none;

          border: none;

          cursor: pointer;

          appearance: none;

          padding: 0 10px;

          background: url(../images/ZYVO-images/all-icons/dropdown.svg);

          background-position: center right 10px;

          background-size: auto;

          background-repeat: no-repeat;

          background-color: #fff;

        }



        option {

          color: #000;

        }



        ::placeholder {

          color: #000;

        }

      }



      /* select option */

    }



    /*CUSTOM SELECT DROPDOWN*/



    /* The container must be positioned relative: */





    .edit-in_txt-new {

      height: 45px;

      width: 100%;

      min-width: 116px;

      /* height: 100%; */

      border: none;

      outline: none;

      padding-left: 11px;

      /* margin-bottom: 6px; */

      padding-right: 40px;

      font-size: 14px;

      border-radius: 52px;

      border: 1px solid #E2E2E2;

      color: #444444;

      margin-bottom: 1px;

      margin-top: 2px;

    }



    .select-items {

      position: absolute;

      /* background-color: #fff; */

      top: 100%;

      left: 0;

      border-radius: 10px;

      border: 1px solid #E2E2E2;

      background: #FFF;

      right: 0;

      /* border: 1px solid #C0C0C0; */

      z-index: 99999;

      margin-top: 6px;

      /* padding: 9px 14px 4px 11px; */

      border-radius: 5px;

    }



    /* Hide the items when the select box is closed: */

    .select-hide {

      display: none;

    }



    .custom-select {

      position: relative;

      padding: 0;

    }



    .custom-select select {

      display: none;

      /*hide original SELECT element: */

    }



    .select-selected {

      background-color: transparent;

    }



    /* Style the arrow inside the select element: */

    .select-selected:after {

      position: absolute;

      content: "";

      top: 0;

      right: 10px;

      display: flex;

      width: 16px;

      background-repeat: no-repeat;

      background-size: contain;

      height: 100%;

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

      /* z-index: 9999; */

      justify-content: center;

      background-position: center;

      align-items: center;

      transform: rotate(0deg);

      transition: .5s;

    }



    /* Point the arrow upwards when the select box is open (active): */

    .select-selected.select-arrow-active:after {

      transform: rotate(90deg);

      transition: .5s;

    }



    /* style the items (options), including the selected item: */

    .select-items div,

    .select-selected {

      color: #000;

      padding: 11px 10px;

      /* font-family: 'Montserrat'; */

      border: 0;

      font-weight: 500;

      border-color: transparent;

      cursor: pointer;

      width: 100%;

      text-align: left;

      margin-bottom: 5px;

    }



    .select-items div:first-child {

      border-radius: 5px 5px 5px 5px;

    }



    .select-items div:last-child {

      border-radius: 5px 5px 5px 5px;

    }



    /* Style items (options): */

    .select-items {

      position: absolute;

      top: 100%;

      left: -85px;

      right: 0px;

      padding: 4px 4px;

      width: 100%;

      min-width: 201px;

      z-index: 99999;

      margin-top: 6px;

      border-radius: 5px 5px 5px 5px;

    }



    /* Hide the items when the select box is closed: */

    .select-hide {

      display: none;

    }



    .select-items div:hover,

    .same-as-selected {

      background: #f0f0f2;

      color: #000;

      border-radius: 5px 5px 5px 5px;

    }



    /*CUSTOM SELECT DROPDOWN*/



  }



  /* USER CASH FLOW CSS */

}





/* ------- PROGRESS CIRCLE ------ */



circle {

  fill: transparent;

  /* stroke: orange; */

  stroke-dasharray: 509;

  /* stroke-dashoffset: 471; */

  animation: clock-animation 2s linear;

}



@keyframes clock-animation {

  0% {

    stroke-dashoffset: 471;

  }



  100% {

    stroke-dashoffset: 200;

  }

}



.progress-circle {

  display: flex;

  justify-content: center;

  margin-top: 10px;

  flex-direction: column;

  align-items: center;





  .user-ratings {

    display: flex;

    flex-direction: column;

    align-items: flex-start;





    /* INACTIVE CSS USER */



    & .inactive-user {

      position: relative;



      ::before {

        content: "";

        padding: 7px;

        background-color: #FBE3C3;

        border-radius: 20px;

        position: absolute;

        left: -21px;

        top: 5px;

      }



      p {

        font-size: 16px;

        font-weight: 500;

        color: #000;

        margin-bottom: 8px;

      }



    }



    /* INACTIVE CSS USER */



    /* ACTIVE CSS USER */



    & .active-users {

      position: relative;



      ::before {

        content: "";

        padding: 7px;

        background-color: #F5A43D;

        border-radius: 20px;

        position: absolute;

        left: -21px;

        top: 5px;

      }





      p {

        font-size: 16px;

        font-weight: 500;

        color: #000;

        margin-bottom: 0;

      }



    }



    /* ACTIVE CSS USER */



  }





  .cashflow-ratings {

    display: flex;

    flex-direction: column;

    align-items: flex-start;





    /* INACTIVE CSS USER */



    & .inactive-user {

      position: relative;



      ::before {

        content: "";

        padding: 7px;

        background-color: #CFEFEC;

        border-radius: 20px;

        position: absolute;

        left: -21px;

        top: 5px;

      }



      p {

        font-size: 16px;

        font-weight: 500;

        color: #000;

        margin-bottom: 8px;

      }



    }



    /* INACTIVE CSS USER */



    /* ACTIVE CSS USER */



    & .active-users {

      position: relative;



      ::before {

        content: "";

        padding: 7px;

        background-color: #64CCC1;

        border-radius: 20px;

        position: absolute;

        left: -21px;

        top: 5px;

      }





      p {

        font-size: 16px;

        font-weight: 500;

        color: #000;

        margin-bottom: 0;

      }



    }



    /* ACTIVE CSS USER */



  }





}



/* ------- PROGRESS CIRCLE ------ */





/* GRAPH CSS */



.graph-wrap {

  margin: 13px 0 14px 35px;

  display: flex;

  justify-content: center;



  & .vertical {

    position: absolute;



    .left-graph-scale {

      position: absolute;

      left: -37px;



      p {

        font-size: 14px;

        font-weight: 500;

        color: #000;

        margin-bottom: -4px;

      }



      ::after {

        content: "----------------------------------------------------";

        color: #e1edf9;

      }



    }



    .progress-bar {

      display: flex;

      float: left;

      height: 240px;

      gap: 5px;

      width: 34px;

      align-items: center;

    }



    .progress-track {

      position: relative;

      width: 18px;

      height: 100%;

      background: #e5ebf1;

    }



    .progress-fill {

      position: relative;

      background: #389CE5;

      height: 50%;

      width: 18px;

      color: #fff;

      text-align: center;

      font-family: "Lato", "Verdana", sans-serif;

      font-size: 12px;

      line-height: 20px;

    }



  }



  .rounded .progress-track,

  .rounded .progress-fill {

    /* box-shadow: inset 0 0 5px rgba(0, 0, 0, .2); */

    border-radius: 29px;

  }



  .rounded .progress-track,

  .rounded .progress-fill span {

    color: #389ce5;

    font-size: 2px;

  }





  .month-wrap {

    display: flex;



    p {

      font-size: 14px;

      font-weight: 500;

      color: #000;

      margin-bottom: 0;

    }



  }



}



/* GRAPH CSS */



/* --- BOOKING CSS ---- */







/*---------- ALL DROPDOWN CSS----------- */



.profile-functions {



  .influ-dropdown button.influ-btn.influ-drop-btn {

    background: none;

    border: none;

  }



  .influ-dropdown {

    position: relative;

  }



  .influ-drop-list {

    position: absolute;

    right: 0;

    padding: 10px 0px;

    border: 1px solid #E2E2E2;

    border-radius: 5px;

    width: 100%;

    min-width: 187px;

    background: #FFF;

    box-shadow: none !important;

    margin-top: 5px;

  }



  .influ-drop-list-search {

    width: 100%;

    border-radius: 5px;

    background: rgba(3, 45, 98, 0.12);

    display: flex;

    align-items: center;

  }



  .influ-drop-list-inner {

    width: 100%;

    height: auto;

    overflow: hidden;

    margin: 0;



    ul {

      list-style-type: none;

      padding-left: 8px;

      width: 100%;

      height: auto;

      overflow: hidden;

      margin: 0;

    }



    li {

      padding: 6px 9px;

      margin-bottom: 5px;

    }



    li:nth-child(2) {

      border-bottom: 1px solid #E2E2E2;

    }







    a {

      font-size: 16px;

      font-weight: 400;

      color: #3F3D56;

      padding: 7px 9px;

      margin-bottom: 8px;

    }



  }



  .influ-drop-list-item {

    width: 100%;

    color: #333;

    font-size: 14px;

    font-weight: 500;

    display: flex;

    align-items: center;

    justify-content: flex-start;

    gap: 8px;

    padding: 5px 0;

  }



}





/* DATERANGE */



.daterange-btn {

  width: auto;

  height: auto;

  background: transparent;

  border-radius: 5px;

  display: flex;

  align-items: center;

  gap: 5px;

  position: relative;



  img {

    width: 15px;

    height: 21px;

    position: absolute;

    left: 10px;

  }



  input[type="text"] {

    padding: 8.5px 10px;

    font-size: 13px;

    font-weight: 500;

    padding-left: 32px;

    outline: none;

    color: #a5a1a1;

    border: 1px solid #E2E2E2;

    /* border: none; */

    border-radius: 20px;

    background-color: transparent;

    width: 130px;

    cursor: pointer;

  }



  input[type="text"]::placeholder {

    color: #a5a1a1;

  }



}



/* DATERANGE */





/*---------- ALL DROPDOWN CSS----------- */





/* ====== ADMIN DASHBOARD PAGE CSS ======= */





/* =========== TABLE CSS --------------- */



/* -- ALL DROPDOWN STRIP */



.influ-strip-2 {

  width: 100%;

  border: 1px solid #E2E2E2;

  height: auto;

  background: #fff;

  padding: 10px;

  border-radius: 0px;

  margin-bottom: 20px;



  form {

    display: flex;

    align-items: center;

    justify-content: space-between;

  }



  .influ-search {

    width: 300px;



    label {

      width: 100%;

      margin-bottom: 0 !important;

      display: inline-flex;

      background: #fff;

      border: 1px solid #E2E2E2;

      align-items: baseline;

      border-radius: 20px;



      input {

        width: 100%;

        height: 37px;

        position: relative;

        background: #ffffff;

        border: none;

        color: #a5a1a1;

        padding: 0px 19px;

        font-size: 13px;

        font-weight: 500;

        outline: none;

        border-radius: 30px;

      }



      input::placeholder {

        color: #a5a1a1;

        line-height: 20px;

      }



      button {

        width: 40px;

        height: 100%;

        border: none;

        background: none;

        padding: 10px;

        color: #fff;

        outline: none;

        cursor: pointer;

        margin-left: auto;

      }



    }



    .influ-search label button {

      width: 40px;

      height: 100%;

      border: none;

      background: none;

      padding: 10px;

      color: #fff;

      outline: none;

      cursor: pointer;

      margin-left: auto;

    }

  }



  .influ-btns {

    width: auto;

    display: flex;

    align-items: center;

    justify-content: flex-end;

    gap: 8px;

    flex-wrap: wrap;







    .influ-dropdown {

      position: relative;



      .extra-width-btn {

        min-width: 165px;

        width: 100%;

      }



      .influ-btn {

        color: #a5a1a1 !important;

        font-weight: 500;

        /* border: none; */

        border: 1px solid #E2E2E2;

        padding: 8px 12px;

        font-size: 13px;

        justify-content: space-between;

        outline: none;

        border-radius: 24px;

        background: #fff;

        display: flex;

        align-items: center;

        gap: 5px;



        i {

          font-size: 15px;

          color: #252849;

          margin-right: 0;

          margin-left: 5px;

          width: auto;

          height: 21px;

          display: flex;

          align-items: center;

        }



      }



      /*CUSTOM SELECT DROPDOWN*/



      /* The container must be positioned relative: */





      .edit-in_txt-new {

        height: 41px;

        width: 100%;

        min-width: 145px;

        /* height: 100%; */

        border: none;

        outline: none;

        padding-left: 11px;

        /* margin-bottom: 6px; */

        padding-right: 40px;

        font-size: 14px;

        border-radius: 52px;

        border: 1px solid #E2E2E2;

        color: #444444;

        margin-bottom: 1px;

        margin-top: 2px;

      }



      .select-items {

        position: absolute;

        /* background-color: #fff; */

        top: 100%;

        left: 0;

        border-radius: 10px;

        border: 1px solid #E2E2E2;

        background: #FFF;

        right: 0;

        /* border: 1px solid #C0C0C0; */

        z-index: 99999;

        margin-top: 6px;

        /* padding: 9px 14px 4px 11px; */

        border-radius: 5px;

      }



      /* Hide the items when the select box is closed: */

      .select-hide {

        display: none;

      }



      .custom-select {

        position: relative;

        padding: 0;

      }



      .custom-select select {

        display: none;

        /*hide original SELECT element: */

      }



      .select-selected {

        background-color: transparent;

      }



      /* Style the arrow inside the select element: */

      .select-selected:after {

        position: absolute;

        content: "";

        top: 0;

        right: 10px;

        display: flex;

        width: 16px;

        background-repeat: no-repeat;

        background-size: contain;

        height: 100%;

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

        /* z-index: 9999; */

        justify-content: center;

        background-position: center;

        align-items: center;

        transform: rotate(0deg);

        transition: .5s;

      }



      /* Point the arrow upwards when the select box is open (active): */

      .select-selected.select-arrow-active:after {

        transform: rotate(90deg);

        transition: .5s;

      }



      /* style the items (options), including the selected item: */

      .select-items div,

      .select-selected {

        color: #808080;

        padding: 9px 10px;

        /* font-family: 'Montserrat'; */

        border: 0;

        font-weight: 400;

        border-color: transparent;

        cursor: pointer;

        width: 100%;

        text-align: left;

        margin-bottom: 5px;

      }



      .select-items div:first-child {

        border-radius: 5px 5px 5px 5px;

      }



      .select-items div:last-child {

        border-radius: 5px 5px 5px 5px;

      }



      /* Style items (options): */

      .select-items {

        position: absolute;

        top: 100%;

        left: -57px;

        right: 0px;

        padding: 4px 4px;

        width: 100%;

        min-width: 201px;

        z-index: 99999;

        margin-top: 6px;

        border-radius: 5px 5px 5px 5px;

      }



      /* Hide the items when the select box is closed: */

      .select-hide {

        display: none;

      }



      .select-items div:hover,

      .same-as-selected {

        background: #f0f0f2;

        color: #808080;

        border-radius: 5px 5px 5px 5px;

      }



      /*CUSTOM SELECT DROPDOWN*/



    }



  }



  .influ-btn {

    color: #a5a1a1 !important;

    font-weight: 500;

    /* border: none; */

    border: 1px solid #E2E2E2;

    padding: 8px 12px;

    border-radius: 24px;

    font-size: 13px;

    outline: none;

    /* border-radius: 6px; */

    background: #fff;

    display: flex;

    align-items: center;

    gap: 5px;

  }



  .create-new-article {

    font-size: 15px;

    background: #4AEAB1;

    padding: 5px 12px;

    font-weight: 400;

    border-radius: 30px;

    color: #000 !important;

    margin-bottom: 0;

  }



}









/* -- ALL DROPDOWN STRIP */



/* -- TABLE CSS --- */



.influ-table {

  width: 100%;

  height: auto;



  table {

    width: max-content;

    min-width: 100%;

    border-collapse: separate;

    border-spacing: 0 9px;

    height: auto;

    text-align: center;



    tr th:nth-child(1) {

      border-radius: 14px 0px 0px 14px;

    }



    tr th:last-child {

      border-radius: 0px 14px 14px 0px;

    }



    tr td:nth-child(1) {

      border-radius: 14px 0px 0px 14px;

    }



    tr td:last-child {

      border-radius: 0px 14px 14px 0px;

    }



    tr {

      background: #fff;

    }



    /* tr th:nth-child(1) {

      background: #fff;

      border-radius: 14px 0px 13px 17px;

    } */



    tr th {

      font-size: 14px;

      border-bottom: 1px solid #E2E2E2;

      border-top: 1px solid #E2E2E2;

      /* border-radius: 27px; */

      font-weight: 500;

      /* border: 1px solid #E2E2E2; */

      padding: 17px 50px;

      color: #3A4B4C;

      background: #fff;

      border-right: none;

    }



    tr th:first-child {

      border-left: 1px solid #E2E2E2;

    }



    tr th:last-child {

      border-right: 1px solid #E2E2E2;

    }



    tr td:first-child {

      border-left: 1px solid #E2E2E2;

    }



    tr td:last-child {

      border-right: 1px solid #E2E2E2;

    }



    tr td {

      /* border-right: 1px solid #032D62;

      border-bottom: 1px solid #032D62; */

      border-bottom: 1px solid #E2E2E2;

      border-top: 1px solid #E2E2E2;

      font-size: 13px;

      font-weight: 500;

      color: #333333;

      padding: 10px;

      vertical-align: middle;

    }



    tr td.profile-picture img {

      width: 55px;

      height: auto;

    }



    .profile-picture {

      display: flex;

      align-items: center;

      gap: 9px;



      input[type="checkbox"] {

        width: 19px;

        height: 18px;

        margin-right: 4px;

        cursor: pointer;

        appearance: none;

        border: 2px solid #95AEC7;

        /* background-color: #CE2127; */

        border-radius: 3px;

        outline: none;

      }



      input[type="checkbox"]:checked {

        background-image: url(../images/ZYVO-images/all-icons/arrow-check.svg);

        background-position: center;

        background-repeat: no-repeat;

        background-size: 20px;

        border: none;

        background-color: #4AEAB1;

      }



      img {

        width: 55px;

        height: 55px;

        object-fit: contain;

      }

    }



    .article-picture {

      display: flex;

      align-items: center;

      gap: 9px;



      input[type="checkbox"] {

        width: 19px;

        height: 18px;

        margin-right: 4px;

        cursor: pointer;

        appearance: none;

        border: 2px solid #95AEC7;

        /* background-color: #CE2127; */

        border-radius: 3px;

        outline: none;

      }



      input[type="checkbox"]:checked {

        background-image: url(../images/ZYVO-images/all-icons/arrow-check.svg);

        background-position: center;

        background-repeat: no-repeat;

        background-size: 20px;

        border: none;

        background-color: #4AEAB1;

      }



      img {

        width: 89px;

        height: 70px;

        object-fit: contain;

        border-radius: 10px;

      }

    }



    .dot-toogle {

      position: relative;
      padding: 2px;



      .date-toggle-warp {

        display: flex;

        gap: 25px;



        img {

          width: 5px;

          cursor: pointer;

        }

      }



      .dot-toogle-list {

        display: none;

        position: absolute;

        right: 0;

        top: 20px;

        padding: 10px;

        width: 100%;

        border-radius: 5px;

        background: #FFF;

        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);



        .toggle-list-items {

          display: flex;

          flex-direction: column;

          align-items: flex-start;

          gap: 10px;



          a {

            color: #3F3D56;

            width: 100%;

            text-align: justify;

            padding: 2px;

          }

          button {

            color: #3F3D56;

            width: 100%;

            text-align: justify;

            padding: 2px;

            border: none;

            background: none;

            cursor: pointer;

            outline: none;

          }

          button:disabled {

            cursor: default;

          }

        }



      }



    }







    .status-btns {



      a.active {

        font-size: 15px;

        background: #4AEAB1;

        padding: 5px 12px;

        font-weight: 400;

        border-radius: 30px;

        color: #000;

        margin-bottom: 0;

      }



      a.inactive {

        font-size: 15px;

        background: #FFF178;

        padding: 5px 12px;

        font-weight: 400;

        border-radius: 30px;

        color: #000;

        margin-bottom: 0;

      }



      a.blocked {

        font-size: 15px;

        background: #D3F3F3;

        padding: 5px 12px;

        font-weight: 400;

        border-radius: 30px;

        color: #000;

        margin-bottom: 0;

      }



    }



    tr:last-child {

      border-bottom: 1px solid #E5E5E5;

    }



    .social-action-wrap {

      display: flex;

      align-items: center;

      justify-content: center;

      gap: 8px;

    }



  }





}



.table-responsive {

  overflow-x: auto;

  padding-bottom: 0px;

}



.table-responsive::-webkit-scrollbar {

  height: 8px;

}



.table-responsive::-webkit-scrollbar-track {

  background: #000;

}



.table-responsive::-webkit-scrollbar-thumb {

  background-color: #4aeab170;

  border-radius: 20px;

}



/* -- TABLE CSS --- */





/* PAGINATION CSS */



.influ-pagi {

  width: 100%;

  height: auto;

  text-align: center;

  padding: 35px 0;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

}



.influ-pagi ul {

  padding: 0px;

  margin: 0;

  display: inline-block;

}



.influ-pagi ul li {

  list-style: none;

  display: inline-block;

  margin: 0 4px;

}



.influ-pagi ul li a {

  font-size: 15px;

  font-weight: 500;

  transition: .5s;

  color: rgba(0, 0, 0, 0.80);

  border: 1px solid rgba(0, 0, 0, 0.80);

  width: 45px;

  border-radius: 42px;

  height: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.influ-pagi ul li:first-child a {

  font-size: 15px;

  font-weight: 500;

  transition: .5s;

  color: rgba(0, 0, 0, 0.80);

  border: 1px solid rgba(0, 0, 0, 0.80);

  width: 45px;

  border-radius: 42px;

  height: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.influ-pagi ul li:last-child a {

  font-size: 15px;

  font-weight: 500;

  transition: .5s;

  color: rgba(0, 0, 0, 0.80);

  border: 1px solid rgba(0, 0, 0, 0.80);

  width: 45px;

  border-radius: 42px;

  height: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.influ-pagi ul li:first-child a:hover {

  color: #fff;

  background: #3A4B4C;

  border-color: #3A4B4C;

  transition: .5s;

}



.influ-pagi ul li:last-child a:hover {

  color: #fff;

  background: #3A4B4C;

  border-color: #3A4B4C;

  transition: .5s;

}



.influ-pagi ul li.active a {

  color: #fff;

  background: #3A4B4C;

  border-color: #3A4B4C;

  transition: .5s;

}



.influ-pagi ul li a:hover {

  color: #fff;

  background: #3A4B4C;

  border-color: #3A4B4C;

  transition: .5s;

}



.influ-pagi form {

  position: absolute;

  right: 0;

}







/* PAGINATION CSS */





/* ALL POPUP CSS */



#edit-pop .modal-dialog {

  max-width: 534px;

  /* border-radius: 56px; */

}



#edit-pop .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}



#edit-pop .modal-content {

  border-radius: 19px;

  outline: 0;

}



#add-pop .modal-dialog {

  max-width: 534px;

  /* border-radius: 56px; */

}



#add-pop .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}



#add-pop .modal-content {

  border-radius: 19px;

  outline: 0;

}



#create-postion-pop .modal-dialog {

  max-width: 534px;

  /* border-radius: 56px; */

}



#create-postion-pop .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}



#create-postion-pop .modal-content {

  border-radius: 19px;

  outline: 0;

}





/* create new article popup css */



#create-newarticle-pop .modal-dialog {

  max-width: 818px;

  /* border-radius: 56px; */

}



#create-newarticle-pop .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}



#create-newarticle-pop .modal-content {

  border-radius: 19px;

  outline: 0;

}



/* create new article popup css */







#logout .modal-dialog {

  max-width: 424px;

}



#logout .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}



#logout .modal-content {

  border-radius: 19px;

  outline: 0;

}



#logout2 .modal-dialog {

  max-width: 424px;

}



#logout2 .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}



#generate-report-popup .modal-content {

  border-radius: 19px;

  outline: 0;

}



#generate-report-popup .modal-dialog {

  max-width: 424px;

}



#generate-report-popup .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}





#delete .modal-content {

  border-radius: 19px;

  outline: 0;

}



#delete .modal-dialog {

  max-width: 424px;

}



#delete .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}







#logout2 .modal-content {

  border-radius: 19px;

  outline: 0;

}







.all-commonbtns-popup {

  display: flex;

  justify-content: center;

  gap: 17px;

}





.all-commonbtns-popup a:nth-child(1) {

  border-radius: 30px;

  background: #4AEAB1;

  color: #000000;

  text-align: center;

  padding: 10px 35px;

  font-size: 17px;

  width: 100%;

  font-weight: 500;

}



.all-commonbtns-popup a:nth-child(2) {

  border-radius: 30px;

  background: transparent;

  color: #000000;

  text-align: center;

  border: 1px solid #4AEAB1;

  padding: 10px 35px;

  font-size: 17px;

  width: 100%;

  font-weight: 400;

}



.edit-pop-wrap {

  padding: 19px 40px;





  h2 {

    font-size: 28px;

    font-weight: 500;

    color: #000;

    text-align: center;

    margin-bottom: 23px;

  }



  form {



    label {

      width: 100%;

      display: flex;

      flex-direction: column;

      gap: 2px;

      color: #333;

      font-size: 16px;

      position: relative;

      margin-bottom: 20px;

      font-weight: 400;

    }



    h3 {

      color: #444444;

      font-size: 16px;

      font-style: normal;

      font-weight: 500;

      margin-bottom: 4px;

    }



    input[type="text"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    input[type="email"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    textarea {

      border-radius: 5px;

      border: 1px solid #C0C0C0;

      background: #fff;

      width: 100%;

      height: 150px;

      padding: 8px 10px;

      color: #444444;

      resize: none;

      font-size: 14px;

      font-weight: 400;

      outline: none;



      ::placeholder {

        color: #444444;

      }

    }



    ::placeholder {

      color: #444444;

    }



  }



}



.add-pop-wrap {

  padding: 19px 40px;





  h2 {

    font-size: 28px;

    font-weight: 500;

    color: #000;

    text-align: center;

    margin-bottom: 23px;

  }



  form {



    label {

      width: 100%;

      display: flex;

      flex-direction: column;

      gap: 2px;

      color: #333;

      font-size: 16px;

      position: relative;

      margin-bottom: 20px;

      font-weight: 400;

    }



    h3 {

      color: var(--Primay-black, #444444);

      font-size: 16px;

      font-style: normal;

      font-weight: 400;

      margin-bottom: 4px;

    }



    input[type="text"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    input[type="email"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    ::placeholder {

      color: #444444;

    }



  }



}





/* CREATE POSTION POPUP CSS */



.create-position-wrap {

  padding: 19px 40px;





  h2 {

    font-size: 28px;

    font-weight: 500;

    color: #000;

    text-align: center;

    margin-bottom: 23px;

  }



  form {



    label {

      width: 100%;

      display: flex;

      flex-direction: column;

      gap: 2px;

      color: #333;

      font-size: 16px;

      position: relative;

      margin-bottom: 20px;

      font-weight: 400;

    }



    h3 {

      color: var(--Primay-black, #444444);

      font-size: 16px;

      font-style: normal;

      font-weight: 400;

      margin-bottom: 4px;

    }



    input[type="text"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    input[type="email"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    ::placeholder {

      color: #A8A8A8;

      font-size: 14px;

    }



    .border-warp {

      border: 1px solid #C0C0C0;

      border-radius: 10px;

      padding: 14px 14px 4px 14px;

      margin-bottom: 16px;

    }



    .select-credital {

      display: flex;

      gap: 24px;

      justify-content: center;



      input[type="radio"] {

        appearance: none;

        width: 5px;

        height: 5px;

        border-radius: 50%;

        background: transparent;

        cursor: pointer;

        outline: 6px solid #3A4B4C;

        outline-offset: 2px;

      }



      input[type="radio"]:checked {

        width: 10px;

        height: 10px;

        border: none;

        padding: 10px;

        outline: none;

        background: #3a4b4c;

      }



      p {

        color: #444444;

        font-size: 16px;

        font-weight: 500;

        margin-bottom: 0;

      }



      .one-wrap {

        display: flex;

        align-items: center;

        gap: 16px;

      }

    }



  }









  .creditail-btns-popup {

    display: flex;

    justify-content: center;



    a {

      border-radius: 30px;

      background: transparent;

      color: #000000;

      text-align: center;

      padding: 10px 35px;

      background-color: #4AEAB1;

      font-size: 17px;

      width: 30%;

      font-weight: 600;

    }

    button {

      border: none;

      border-radius: 30px;

      background: transparent;

      color: #000000;

      text-align: center;

      padding: 10px 35px;

      background-color: #4AEAB1;

      font-size: 17px;

      /* width: 30%; */

      font-weight: 600;

    }

    button:disabled {

      opacity: 0.6;

      cursor: not-allowed;

    }

  }



}



/* CREATE POSTION POPUP CSS */



/* CREATE NEW ARTICLE POPUP CSS */



.create-newarticle-wrap {

  padding: 19px 40px;



  .all-commonbtns-popup {

    display: flex;

    justify-content: center;

    gap: 17px;



    a:nth-child(1) {

      border-radius: 30px;

      background: transparent;

      color: #000000;

      text-align: center;

      border: 1px solid #000000;

      padding: 10px 35px;

      font-size: 17px;

      width: 100%;

      font-weight: 400;

    }



    a:nth-child(2) {

      border-radius: 30px;

      background: transparent;

      color: #000000;

      text-align: center;

      border: 1px solid #000000;

      padding: 10px 35px;

      font-size: 17px;

      width: 100%;

      font-weight: 400;

    }



    a:nth-child(3) {

      border-radius: 30px;

      background: #4AEAB1;

      color: #000000;

      text-align: center;

      padding: 10px 35px;

      font-size: 17px;

      width: 100%;

      font-weight: 500;

    }



  }



  h2 {

    font-size: 28px;

    font-weight: 500;

    color: #000;

    text-align: center;

    margin-bottom: 23px;

  }



  form {

    display: flex;

    gap: 20px;

    flex-direction: column;



    & .first-sec-wrap {

      display: flex;

      gap: 15px;

      margin-bottom: -22px;

    }



    label {

      width: 100%;

      display: flex;

      flex-direction: column;

      gap: 2px;

      color: #333;

      font-size: 16px;

      position: relative;

      margin-bottom: 20px;

      outline: none;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    /* UPLOAD ARTCLE CSS */



    .article-upload-wrap {

      position: relative;

    }



    .upload-imge-wrap {

      position: relative;

    }



    label.add-blog-image {

      height: 119px;

      align-items: center;

      display: flex;

      justify-content: center;

      cursor: pointer;

    }



    .upload-icon-wrap {

      display: flex;

      justify-content: center;

      /* margin-top: 26px; */

      position: absolute;

      top: 13px;

      right: 50%;

      left: 50%;



      img {

        width: 30px;

      }

    }



    /* UPLOAD ARTCLE CSS */



    h3 {

      color: #000;

      font-size: 16px;

      font-style: normal;

      font-weight: 500;

      margin-bottom: 4px;

      position: absolute;

      left: 13px;

      top: 13px;

      z-index: 9;

    }



    input[type="text"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px 7px 66px;

      /* border-radius: 18px; */

      text-align: end;

      color: #000;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: none;

      outline: none;

      /* border: 1px solid #C0C0C0; */

      border-radius: 7px;

    }



    input[type="email"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    ::placeholder {

      color: #000;

      font-size: 16px;

    }



    .left-sec-article {

      width: 50%;

    }



    .right-sec-article {

      width: 50%;

    }



    /* category wrap */



    .category-box {

      width: 100%;

      height: 47px;

      padding: 7px 9px 7px 66px;

      /* border-radius: 18px; */

      text-align: left;

      color: #000;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border-radius: 7px;



      select {

        border: none;

        position: absolute;

        width: 32%;

        right: 14px;

        outline: none;

        top: 10px;

        appearance: none;

        padding: 0 10px;

        background: url(../images/ZYVO-images/all-icons/article-imgs/dropdown.svg);

        background-position: center right 3px;

        background-size: 16px;

        background-repeat: no-repeat;

      }



      input#datepicker2 {

        top: -7px;

        right: 0;

        text-align: end;

      }

    }



    /* category wrap */



  }









  .creditail-btns-popup {

    display: flex;

    justify-content: center;



    a {

      border-radius: 30px;

      background: transparent;

      color: #000000;

      text-align: center;

      padding: 10px 35px;

      background-color: #4AEAB1;

      font-size: 17px;

      width: 30%;

      font-weight: 600;

    }

  }



}



/* CREATE NEW ARTICLE POPUP CSS */





/*Date-Picker*/



.ui-datepicker {

  width: auto;

  background: #fff;

  padding: 10px;

  display: none;

  border-radius: 5px;

  box-shadow: 0px 2.10396px 10.5198px rgba(170, 170, 170, 0.5);

}



.ui-datepicker-calendar th {

  border: 0;

  width: 35px;

  height: 35px;

  line-height: 35px;

  text-align: center;

  color: #000;

  font-size: 14px;

  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

}



.ui-datepicker-calendar td {

  border: 0;

  text-align: center;

  color: #000;

  font-size: 14px;

  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

}



.ui-datepicker-calendar td a {

  color: #000;

  display: block;

  width: 35px;

  height: 35px;

  line-height: 35px;

  font-weight: 500;

  /* border-radius: 50%; */

  border: 1px solid #c5c5c5;

  background: #f6f6f6;

  gap: 4px;

  margin: 1px;

  font-weight: 500;

  color: #454545;

}



.ui-datepicker-calendar td a:hover {

  color: #000 !important;

  background: #ffdb84;

}



.ui-datepicker-today a {

  color: #000 !important;

  background: #ffbf238f !important;

}



.ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all {

  display: flex;

  justify-content: space-between;

  position: relative;

  align-items: center;

  margin-bottom: 10px;

  border-radius: 5px;

  z-index: 99;

  background: #ffbf23;

  padding: 7px;

}



.ui-datepicker-prev {

  color: transparent;

  float: none;

  font-size: 5px;

  /* text-transform: uppercase; */

  /* background: #000; */

  background-image: url(../images/Froyoo-images/arrow-left.png);

  padding: 13px 10px;

  border-radius: 5px;

  margin-left: 8px;

  font-weight: 500;

  background-repeat: no-repeat;

  /* color: #333333 !important; */

  cursor: pointer;

}







.ui-datepicker-next span {

  display: none;

}



.ui-datepicker-next {

  color: transparent;

  float: none;

  font-size: 10px;

  /* text-transform: uppercase; */

  /* background: #000; */

  background-image: url(../images/Froyoo-images/arrow-right.png);

  padding: 13px 12px;

  border-radius: 5px;

  background-repeat: no-repeat;

  font-weight: 500;

  /* color: #333333 !important; */

  cursor: pointer;

}







.ui-datepicker-title {

  margin-bottom: 0px;

  clear: left;

  position: absolute;

  text-align: center;

  width: 100%;

  font-size: 14px;

  color: #000;

  font-weight: 500;

  z-index: -1;

}



/*Date-Picker*/







/* GENERATE REPORT POPUP */





.generate-report-wrap {

  padding: 19px 23px;





  h2 {

    font-size: 28px;

    font-weight: 500;

    color: #000;

    text-align: center;

    margin-bottom: 23px;

  }



  form {

    & .checklist-wrap {



      .checklist-item {

        display: flex;

        align-items: center;

        justify-content: space-between;

        border: 1px solid #C0C0C0;

        padding: 12px 9px;

        border-radius: 8px;

        margin-bottom: 15px;



        input[type="checkbox"] {

          width: 19px;

          height: 18px;

          margin-right: 4px;

          cursor: pointer;

          appearance: none;

          border: 2px solid #95AEC7;

          /* background-color: #CE2127; */

          border-radius: 3px;

          outline: none;

        }



        input[type="checkbox"]:checked {

          background-image: url(../images/ZYVO-images/all-icons/arrow-check.svg);

          background-position: center;

          background-repeat: no-repeat;

          background-size: 20px;

          border: none;

          background-color: #4AEAB1;

        }



        p {

          color: #000;

          font-size: 16px;

          font-weight: 500;

          margin-bottom: 0;

        }

      }



      .checklist-btns-popup {

        display: flex;

        justify-content: center;



        a {

          border-radius: 30px;

          background: transparent;

          color: #000000;

          text-align: center;

          padding: 10px 35px;

          background-color: #4AEAB1;

          font-size: 17px;

          width: 100%;

          font-weight: 500;

        }

      }



    }

  }





}



/* GENERATE REPORT POPUP */











/* LOGOUT POPUP CSS */



.logout-pop-wrap {

  padding: 19px 40px;



  .logout-img-wrap {

    display: flex;

    margin: 0 auto;

    justify-content: center;

  }



  h2 {

    font-size: 28px;

    font-weight: 500;

    color: #000;

    text-align: center;

    margin-bottom: 23px;

  }



  p {

    font-size: 16px;

    font-weight: 400;

    color: #000;

    text-align: center;

    margin-bottom: 20px;

    margin-top: 20px;

  }



  form {



    label {

      width: 100%;

      display: flex;

      flex-direction: column;

      gap: 2px;

      color: #333;

      font-size: 16px;

      position: relative;

      margin-bottom: 20px;

      font-weight: 400;

    }



    h3 {

      color: var(--Primay-black, #444444);

      font-size: 16px;

      font-style: normal;

      font-weight: 400;

      margin-bottom: 4px;

    }



    input[type="text"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    input[type="email"] {

      width: 100%;

      height: 47px;

      padding: 7px 9px;

      /* border-radius: 18px; */

      text-align: left;

      color: #444444;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    ::placeholder {

      color: #444444;

    }





    .logoutbtns-popup {

      display: flex;

      justify-content: center;

      gap: 15px;



      a:nth-child(1) {

        border-radius: 30px;

        background: #4AEAB1;

        color: #000000;

        text-align: center;

        padding: 10px 53px;

        font-size: 17px;

        width: auto;

        font-weight: 400;

      }



      a:nth-child(2) {

        border-radius: 30px;

        background: transparent;

        color: #000000;

        text-align: center;

        padding: 10px 35px;

        border: 1px solid #4AEAB1;

        font-size: 17px;

        width: auto;

        font-weight: 400;

      }



    }





  }





}



/* LOGOUT POPUP CSS */



/* ALL POPUP CSS */





/* VIOLATION PAGE CSS */



.violation-managementdetailwrap {

  width: 100%;

  display: flex;

  gap: 15px;

  justify-content: space-between;



  /* LEFT SEC */



  & .violation-left-sec {

    width: 25%;



    .violation-card-inner {

      width: 100%;

      padding: 10px 0px;

      /* background: #fff; */

      border-radius: 5px;



      .review-head {

        padding-left: 13px;

        padding-right: 13px;

        display: flex;

        justify-content: space-between;



        & .count-review {

          display: flex;

          align-items: center;

          gap: 7px;



          img {

            width: 20px;

          }



          span {

            color: #FCA800;

            font-size: 16px;

            font-style: normal;

            font-weight: 500;

            margin-bottom: 0;

          }



          p {

            color: #444444;

            font-size: 16px;

            font-style: normal;

            font-weight: 500;

            margin-bottom: 0;

          }

        }



        & .sort-by {

          display: flex;

          gap: 5px;

          align-items: center;



          p {

            color: #444444;

            font-size: 16px;

            font-style: normal;

            font-weight: 500;

            margin-bottom: 0;

          }



          select {

            outline: none;

            border: none;

            color: #444444;

            font-weight: 500;

            background: transparent;



            option {

              font-size: 16px;

            }

          }



        }



      }



      /* REPORT USER BOXES */



      .all-report-wraps {

        padding: 12px;



        .reports-box {

          border: 1px solid #E2E2E2;

          border-radius: 10px;

          padding: 10px;

          background-color: #fff;

          display: flex;

          align-items: normal;

          position: relative;

          gap: 9px;

          margin-bottom: 18px;

          cursor: pointer;



          &.active {

            border: 1px solid #000 !important;

          }



          .report-box-inner {

            display: flex;

            gap: 9px;

            flex-grow: 1;

          }



          .img-reportuser {

            flex-basis: auto;

            height: auto;

            width: auto;

            /* margin-left: auto; */

            font-size: 13px;

            padding: 1px 2px;

            color: #fff;





            img {

              width: 46px;

              padding: 1px;

              border: 2px solid #95AEC7;

              border-radius: 36px;

            }

          }



          .content-report {

            h3 {

              font-size: 15px;

              font-weight: 600;

              color: #000;

              margin-bottom: 0;

              padding: 0px 0px 0px 0px;

            }



            p {

              font-size: 14px;

              font-weight: 400;

              color: #333333;

              margin-bottom: 8px;

            }



            span {

              font-size: 12px;

              /* background: #FFF178; */

              padding: 5px 12px;

              font-weight: 400;

              border-radius: 30px;

              color: #000;

              margin-bottom: 0;



              &.pending {

                background: #FFF178;

              }



              &.resolved {

                background: #4AEAB1;

              }



              &.blocked {

                background: rgba(58, 75, 76, 0.05);

              }

            }

          }



          .dot-toogle {

            position: absolute;

            right: 13px;

            padding: 2px;



            .date-toggle-warp {

              display: flex;

              gap: 25px;



              img {

                width: 5px;

                cursor: pointer;

              }

            }



            .dot-toogle-list {

              display: none;

              position: absolute;

              z-index: 1;

              right: 0;

              top: 20px;

              padding: 10px;

              width: auto;

              border-radius: 5px;

              background: #FFF;

              box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);



              .toggle-list-items {

                display: flex;

                flex-direction: column;

                align-items: flex-start;

                gap: 10px;



                a {

                  color: #3F3D56;

                  width: 100%;

                  text-align: justify;

                  padding: 2px;

                  font-size: 14px;

                }

                button {

                  color: #3F3D56;

                  width: 100%;

                  text-align: justify;

                  padding: 2px;

                  font-size: 14px;

                  border: none;

                  background: none;

                  cursor: pointer;

                  outline: none;

                }

                button:disabled {

                  cursor: default;

                }

              }



            }



          }





        }

      }









      /* REPORT USER BOXES */



    }

  }



  /* LEFT SEC */



  & .violation-center-sec {

    width: 50%;



    .violation-card-inner {

      border: 1px solid #E2E2E2;

      width: 100%;

      padding: 10px 0px;

      background: #fff;

      border-radius: 10px;



      /* user span */

      & .user-spam-box {

        display: flex;

        align-items: baseline;

        gap: 15px;

        border-bottom: 1px solid #E2E2E2;



        h3 {

          font-size: 18px;

          font-weight: 500;

          color: #000;

          margin-bottom: 0;

          padding: 10px 10px 19px 13px;

        }



        span {

          font-size: 14px;

          /* background: #FFF178; */

          padding: 5px 12px;

          font-weight: 400;

          border-radius: 30px;

          color: #000;

          margin-bottom: 0;



          &.pending {

            background: #FFF178;

          }



          &.resolved {

            background: #4AEAB1;

          }



          &.blocked {

            background: rgba(58, 75, 76, 0.05);

          }

        }

      }



      /* user span */



      /* report detail */

      & .report-spam-box {

        border-bottom: 1px solid #E2E2E2;

        padding-bottom: 15px;





        h3 {

          font-size: 18px;

          font-weight: 500;

          color: #000;

          margin-bottom: 0;

          padding: 13px 10px 17px 13px;

        }





        & .check-btns {

          padding-bottom: 10px;

          padding-left: 13px;

          padding-right: 13px;



          a {

            border-radius: 30px;

            background: transparent;

            color: #000000;

            text-align: center;

            border: 1px solid #E5E5E5;

            padding: 7px 23px;

            font-size: 14px;

            width: 100%;

            font-weight: 400;

          }



          a:focus {

            background: #b1ddfd;

          }



          textarea {

            width: 100%;

            height: 92px;

            padding: 7px 9px;

            /* border-radius: 18px; */

            text-align: left;

            color: #000;

            position: relative;

            resize: none;

            /* padding-right: 84px; */

            font-size: 14px;

            font-weight: 400;

            border: 1px solid #C0C0C0;

            border-radius: 7px;



            ::placeholder {

              color: #000;

              font-size: 14px;

            }



          }





        }



      }



      /* report detail */



      /* user review */



      & .user-review-box {

        padding-bottom: 15px;





        h3 {

          font-size: 18px;

          font-weight: 500;

          color: #000;

          margin-bottom: 0;

          padding: 13px 10px 17px 13px;

        }





        .review-head {

          padding-left: 13px;

          padding-right: 13px;

          display: flex;

          justify-content: space-between;



          & .count-review {

            display: flex;

            align-items: center;

            gap: 7px;



            img {

              width: 20px;

            }



            span {

              color: #FCA800;

              font-size: 16px;

              font-style: normal;

              font-weight: 500;

              margin-bottom: 0;

            }



            p {

              color: #444444;

              font-size: 16px;

              font-style: normal;

              font-weight: 500;

              margin-bottom: 0;

            }

          }



          & .sort-by {

            display: flex;

            gap: 5px;

            align-items: center;



            p {

              color: #444444;

              font-size: 16px;

              font-style: normal;

              font-weight: 500;

              margin-bottom: 0;

            }



            select {

              outline: none;

              border: none;

              color: #444444;

              font-weight: 500;



              option {

                font-size: 16px;

              }

            }



          }



        }







      }



      /* user review */



      /* all User listing */



      .all-review-list {



        & .box {

          display: flex;

          position: relative;

          padding: 12px 0px;

          align-items: center;

          gap: 7px;

          border-bottom: 1px solid #E2E2E2;

          margin-left: 14px;

          margin-right: 14px;





          .user-imgae-review {

            flex-basis: auto;

            height: auto;

            width: auto;

            /* margin-left: auto; */

            font-size: 13px;

            border: 2px solid #95AEC7;

            padding: 1px 2px;

            color: #fff;

            font-weight: 500;

            border-radius: 36px;

            display: flex;

            align-items: center;



            img {

              width: 37px;

            }

          }



          .heading-review-list {

            display: flex;

            align-items: flex-start;

            flex-direction: column;



            h3 {

              font-size: 15px;

              font-weight: 600;

              color: #000;

              margin-bottom: 0;

              padding: 8px 10px 0px 0px;

            }



            p {

              font-size: 14px;

              font-weight: 400;

              color: #333333;

              margin-bottom: 12px;

            }



            .all-star {

              position: absolute;

              right: 16px;

              display: flex;

              flex-direction: column;

              align-items: flex-end;



              span {

                font-size: 14px;

                font-weight: 400;

                color: #333333;

                margin-bottom: 12px;

              }





              img {

                width: 15px;

              }

            }





          }



        }



        & .all-review-btns {

          display: flex;

          gap: 14px;

          justify-content: center;

          margin-top: 20px;



          a {

            border-radius: 30px;

            background: transparent;

            color: #000000;

            border: 1px solid #000;

            padding: 10px 26px;

            font-size: 14px;

            width: auto;

            font-weight: 500;

          }

        }







      }



      /* all User listing */





    }



  }





  /* RIGHT SEC */



  & .violation-right-sec {

    width: 25%;



    .violation-guest-inner {

      border: 1px solid #E2E2E2;

      width: 100%;

      padding: 10px 0px;

      background: #fff;

      border-radius: 10px;

      display: flex;

      justify-content: center;

      flex-direction: column;

      margin-bottom: 14px;

    }



    .profile-guest {

      display: flex;

      align-items: center;

      justify-content: center;

      gap: 7px;

      padding-bottom: 10px;

      border-bottom: 1px solid #E2E2E2;

      margin: 0 13px;



      h3 {

        font-size: 15px;

        font-weight: 600;

        color: #000;

        margin-bottom: 0;

        padding: 0px 0px 0px 0px;

      }



      & .count-review {

        display: flex;

        align-items: center;

        gap: 7px;



        img {

          width: 20px;

        }



        span {

          color: #FCA800;

          font-size: 16px;

          font-style: normal;

          font-weight: 500;

          margin-bottom: 0;

        }



        p {

          color: #444444;

          font-size: 16px;

          font-style: normal;

          font-weight: 500;

          margin-bottom: 0;

        }

      }



    }



    .user-imgae-review {

      flex-basis: auto;

      height: auto;

      width: auto;

      /* margin-left: auto; */

      font-size: 13px;

      border: 2px solid #95AEC7;

      padding: 1px 2px;

      color: #fff;

      font-weight: 500;

      border-radius: 36px;

      display: flex;

      align-items: center;



      img {

        width: 37px;

        height: 37px;

        border-radius: 50%;

        object-fit: cover;

      }

    }



    span {

      font-size: 14px;

      font-weight: 400;

      color: #333333;

      margin-bottom: 5px;

      text-align: center;

    }



    & .all-review-btns {

      display: flex;

      gap: 14px;

      justify-content: center;

      margin-top: 10px;

      flex-direction: column;

      padding: 0px 12px;



      a:nth-child(1) {

        border-radius: 8px;

        background: #3A4B4C;

        color: #fff;

        padding: 10px 26px;

        font-size: 14px;

        width: auto;

        text-align: center;

        font-weight: 500;

      }



      a:nth-child(2) {

        border-radius: 8px;

        background: transparent;

        color: #000000;

        text-align: center;

        border: 1px solid #000;

        padding: 10px 26px;

        font-size: 14px;

        width: auto;

        font-weight: 500;

      }



    }



    .total-wrap {

      border-top: 1px solid #E2E2E2;

      margin: 0 13px;



      .booking-list-wrap {

        padding: 0;

      }

    }





    .booking-img-wrap {

      display: flex;

      align-items: center;

      gap: 10px;

      padding: 0 0px;

      border-bottom: 1px solid #E2E2E2;

      margin: 0 13px;

      padding-bottom: 15px;

      margin-bottom: 10px;



      img {

        width: 73px;

      }



      .content {

        width: 100%;

        display: flex;

        align-items: flex-start;

        flex-direction: column;



        span {

          font-size: 13px;

          font-weight: 400;

          color: #333333;

          margin-bottom: 0;

          text-align: center;

        }



        h3 {

          font-size: 13px;

          font-weight: 500;

          color: #000;

          margin-bottom: 0;

          padding: 3px 1px 3px 0px;

        }



        & .count-review {

          display: flex;

          align-items: center;

          gap: 7px;



          img {

            width: 15px;

          }



          span {

            color: #FCA800;

            font-size: 13px;

            font-style: normal;

            font-weight: 500;

            margin-bottom: 0;

          }



          p {

            color: #A4A4A4;

            font-size: 13px;

            font-style: normal;

            font-weight: 500;

            margin-bottom: 0;

          }

        }

      }







    }



    .booking-list-wrap {

      display: flex;

      justify-content: space-between;

      padding: 0px 13px;

      margin-bottom: 11px;

      margin-top: 5px;





      p {

        font-size: 14px;

        font-weight: 500;

        color: #000;

        margin-bottom: 0;

      }



      span {

        font-size: 14px;

        font-weight: 500;

        color: #000;

        margin-bottom: 0;

      }

    }



  }



  /* RIGHT SEC */





}



/* VIOLATION PAGE CSS */





















/* FAQ CSS */



.faq-main-wrap {

  box-shadow: 0px 3px 6px 0px #00000040;

  padding: 24px 23px;

  background: #fff;



  & .heading-faq {

    display: flex;

    align-items: center;

    justify-content: space-between;



    h1 {

      font-size: 22px;

      font-weight: 500;

      color: #000;

      margin-bottom: 0;

    }



    a {

      border-radius: 30px;

      background: #4AEAB1;

      color: #000000;

      text-align: center;

      padding: 10px 17px;

      font-size: 17px;

      width: auto;

      font-weight: 500;

    }



  }



  .faq-wrap {

    width: 100%;

    height: auto;

    background: #ffffff;

    padding: 20px 0px;

  }



  .faq-wrap .accordion {

    display: flex;

    flex-wrap: wrap;

    gap: 15px;

    align-items: flex-start;

  }



  .faq-wrap .accordion-header {

    margin-bottom: 0;

    font-weight: 600;

    font-size: 14px;

    color: #000;

    padding: 15px 110px 15px 10px;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: space-between;

  }



  .faq-wrap .accordion-item {

    width: 100%;

    border-radius: 5px;

    border-top: 1px solid #dee2e6;

  }



  .faq-wrap .accordion-button {

    border-radius: 5px;

    outline: none;

    box-shadow: none;

    position: relative;

    width: 22px;

    height: 22px;

    padding: 0;

    display: flex;

    align-items: center;

    justify-content: center;

  }



  .accordion-button-over {

    position: absolute;

    right: 10px;

    display: flex;

    align-items: center;

    gap: 8px;

    top: auto;

  }



  .accordion-button-over a {

    width: 22px;

    height: 22px;

    display: block;

  }



  .accordion-button-over a img {

    width: 100%;

    height: 100%;

  }



  .faq-wrap .accordion-button::after {

    background-image: url(../images/ZYVO-images/all-icons/faq-plus.svg);

    background-size: 22px;

    width: 22px;

    height: 22px;

    position: absolute;

    right: auto;

  }



  .faq-wrap .accordion-button:not(.collapsed)::after {

    background-image: url(../images/ZYVO-images/all-icons/faq-minus.svg);

    background-size: 22px;

    width: 22px;

    height: 22px;

  }



  .faq-wrap .accordion-button:not(.collapsed) {

    background-color: transparent;

    color: #000;

  }



  .faq-wrap .accordion-body {

    font-weight: 500;

    font-size: 13px;

    color: #333;

    padding: 10px;

    line-height: 25px;

    border-top: none;

  }





}





/* FAQ CSS */





/* TERMS AND CONDTION CSS */





.terms-condition-wrap {

  box-shadow: 0px 3px 6px 0px #00000040;

  padding: 24px 23px;

  background: #fff;



  h1 {

    font-size: 22px;

    font-weight: 500;

    color: #000;

    margin-bottom: 0;

  }





  & .terms-condition-btns {

    display: flex;

    gap: 14px;

    justify-content: flex-start;

    margin-top: 20px;



    a:nth-child(1) {

      border-radius: 30px;

      background: #4AEAB1;

      color: #000000;

      text-align: center;

      padding: 10px 35px;

      font-size: 17px;

      width: auto;

      font-weight: 500;

    }



    a:nth-child(2) {

      border-radius: 30px;

      background: transparent;

      color: #000000;

      border: 1px solid #4AEAB1;

      text-align: center;

      padding: 10px 35px;

      font-size: 17px;

      width: auto;

      font-weight: 500;

    }



    a:nth-child(2):hover {

      background-color: #4AEAB1;

      color: #000000;

      border: 1px solid #4AEAB1;

    }





  }



  & .terms-content-inner {

    border: 1px solid #C0C0C0;

    padding: 14px 14px;

    border-radius: 11px;

    margin-top: 15px;



    h3 {

      font-size: 18px;

      font-weight: 400;

      color: #000;

      margin-bottom: 12px;

    }



    p {

      font-size: 16px;

      font-weight: 400;

      color: #333333;

      margin-bottom: 12px;

    }



  }



  /* ABOUTS US */



  & .about-content-inner {

    padding: 14px 0px;

    margin-top: 4px;

    gap: 15px;

    display: flex;

    flex-wrap: wrap;



    .about-card-border {

      border: 1px solid #C0C0C0;

      width: 32%;

      padding: 22px 22px;

      border-radius: 11px;



      h3 {

        color: #3A4B4C;

        font-size: 16px;

        font-weight: 500;

        margin-bottom: 17px;

      }



      & .about-card-box {

        box-shadow: 0px 0px 4px 0px #00000040;



        & .imgwrap-about {

          height: 200px;
          display: flex;
          align-items: center;
          justify-content: center;
          overflow: hidden;

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

        }



        & .about-content {

          padding: 10px 10px;



          p {

            font-size: 14px;

            font-weight: 400;

            color: #333333;

            margin-bottom: 0;


            display: -webkit-box;
            -webkit-line-clamp: 4;
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-overflow: ellipsis;

          }



          & .about-heading {

            display: flex;

            align-items: baseline;

            justify-content: space-between;



            h3 {

              color: #3A4B4C;

              font-size: 16px;

              font-weight: 500;

              margin-bottom: 5px;

            }



            .action-btns {

              display: flex;

              gap: 5px;

            }



          }





        }



      }



    }



  }



  /* ABOUTS US */



}





/* TERMS AND CONDTION CSS */





/* NOTIFICATION CSS */



.notification-wrap {

  padding: 24px 5px;

  background: transparent;



  h1 {

    font-size: 22px;

    font-weight: 500;

    color: #000;

    margin-bottom: 0;

    border: 1px solid #DAD9D9;

    padding: 14px;

    border-radius: 14px;

    background: #fff;

  }





  & .notification-inner {

    border: 1px solid #DAD9D9;

    background: #fff;

    padding: 14px 14px;

    border-radius: 11px;

    margin-top: 15px;

    box-shadow: 0px 0px 3px 0px #00000040;





    h3 {

      font-size: 18px;

      font-weight: 500;

      color: #000;

      margin-bottom: 12px;

    }



    p {

      font-size: 16px;

      font-weight: 400;

      color: #000;

      margin-bottom: 12px;

    }



    span {

      font-size: 14px;

      font-weight: 400;

      color: #b7b2b2;

    }



  }



}



/* NOTIFICATION CSS */



/* SIDEBAR DROPDOWN CSS */



.dropdown-content {

  display: none;

  position: relative;

  min-width: 100%;

  z-index: 1;

  margin-left: 38px;

  transition: width .3s ease;



  a {

    display: block;

    /* padding: 4px 0; */

    padding-left: 12px;

    /* font-weight: 500; */

    padding: 2px 15px;

    font-weight: 500;

    /* color: #000; */

    font-size: 14px;

    margin-bottom: 10px;

    border-radius: 48px 0 0 48px;

    color: #3A4B4C;

    white-space: nowrap;

  }



  a.active {

    color: rgba(0, 119, 29, 1);

  }





}



.dropbtn:before {

  content: "\f078";

  font-family: "Font Awesome 5 Pro";

  font-size: 15px;

  position: absolute;

  right: 30px;

  height: auto;

  top: auto;

  bottom: auto;

  transition: width .3s ease;

}



.show {

  display: block;

}



.submit_button {

  border-radius: 30px;

  background: #4AEAB1;

  color: #000000;

  text-align: center;

  padding: 10px 35px;

  font-size: 17px;

  /* width: 100%; */

  border: 0px;

  font-weight: 500;

}





/* SIDEBAR DROPDOWN CSS */





/* =========== TABLE CSS --------------- */



/* ------------ APPLY WARNING POPUP CSS ----------------  */



#apply-warning-popup .modal-heading button {

  background: none;

  border: none;

  outline: none;

  width: auto;

  height: auto;

  position: absolute;

  right: 10px;

  top: 10px;

  z-index: 9999;

}





.apply-warning-wrap {

  padding: 19px 23px;



  h2 {

    font-size: 24px;

    font-weight: 500;

    color: #000;

    text-align: center;

    margin-bottom: 23px;

  }



  & form {

    label {

      width: 100%;

      display: flex;

      flex-direction: column;

      gap: 2px;

      color: #333;

      font-size: 16px;

      position: relative;

      margin-bottom: 20px;

      outline: none;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

    }



    textarea {

      width: 100%;

      height: 146px;

      padding: 13px 9px 13px 9px;

      /* border-radius: 18px; */

      text-align: left;

      resize: none;

      color: #000;

      position: relative;

      /* padding-right: 84px; */

      font-size: 14px;

      font-weight: 400;

      border: 1px solid #C0C0C0;

      border-radius: 7px;

      margin-bottom: 23px;

    }



    textarea::placeholder {

      color: #000;

    }



    .category-box {

      width: 100%;

      height: 47px;

      padding: 7px 9px 7px 66px;

      /* border-radius: 18px; */

      text-align: left;

      color: #000;

      position: relative;

      /* padding-right: 84px; */

      font-size: 16px;

      font-weight: 400;

      border-radius: 7px;

    }



    h3 {

      color: #000;

      font-size: 16px;

      font-style: normal;

      font-weight: 500;

      margin-bottom: 4px;

      position: absolute;

      left: 13px;

      top: 13px;

      z-index: 9;

    }



    select {

      border: none;

      position: absolute;

      width: 36%;

      right: 14px;

      outline: none;

      top: 10px;

      appearance: none;

      padding: 0 10px;

      background: url(../images/ZYVO-images/all-icons/article-imgs/dropdown.svg);

      background-position: center right 3px;

      background-size: 16px;

      background-repeat: no-repeat;

    }



    .warning-btns-popup {

      display: flex;

      justify-content: center;



      a {

        border-radius: 30px;

        background: transparent;

        color: #000000;

        text-align: center;

        padding: 10px 35px;

        background-color: #4AEAB1;

        font-size: 17px;

        width: 100%;

        font-weight: 500;

      }

      button {
        border: none;

        border-radius: 30px;

        background: transparent;

        color: #000000;

        text-align: center;

        padding: 10px 35px;

        background-color: #4AEAB1;

        font-size: 17px;

        width: 100%;

        font-weight: 500;

      }

      button:disabled {
        opacity: 0.5;
        cursor: not-allowed;
      }


    }



  }



}



/* ------------ APPLY WARNING POPUP CSS ---------------- */


/* ------------------  NEW CSS DK CSS 13-01-2025 -------------- */

.border-line {
  border-bottom: 1px solid #C4C4C4;
  padding-top: 2px;
  width: 100%;
}

#calender-popup .modal-heading button {
  background: none;
  border: none;
  outline: none;
  width: auto;
  height: auto;
  position: absolute;
  right: 10px;
  top: 10px;
  z-index: 9999;
}

.daterange-wrap {
  display: flex;
  justify-content: center;
  padding-bottom: 38px;
  padding-top: 10px;
}

a.dropbtn.active:before {
  content: '';
  /* Hide the icon */
  display: none;
}

/* ------------------  NEW CSS DK CSS 13-01-2025 -------------- */