@import "vars.css";
@import "commons.css";
@import "text.css";

* {
  box-sizing: border-box;
  margin    : 0;
  padding   : 0;

  /* border: solid 1px red; */
}
:focus {
    outline: none;
}
:focus-within {
    outline: none !important;
}
body {
  font-family     : 'Work Sans', sans-serif!important;
  background-color: var(--background-page )!important;
  padding-top     : 5.5rem;
  min-height      : 100vh;
  color           : var(--primary-color);
  font-size       : 0.875rem;
}

header.header {
    padding: 0.8rem 2.25rem 0.8rem 6.125rem;
    background-color: var(--background-page );
    z-index: 999;
}
.header .header-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--gray-100);
}
.header button {
  box-shadow: 0px 2px 2px #0000001A;
}

.header .scroll {
  height: 150px;
  overflow-y      : scroll;
}


.header .scroll::-webkit-scrollbar {
  width         : 8px;
  -webkit-heigth: thin;
}

.header .scroll::-webkit-scrollbar-track {
  box-shadow   : inset 0 0 6px rgba(0, 0, 0, 0);
  border-radius: 10px;
  background-color: #FFF;
}

.header .scroll::-webkit-scrollbar-thumb {
  border-radius: 10px;
  box-shadow   : inset 0 0 6px rgba(8, 30, 72, 0.3);
}

h1 {
    color: var(--secondary-color);
    font-size: 1.375rem;
    font-weight: 600;
    margin-bottom: 0;
}

/* FILTER IMAGE */

.img-no-filter {
  filter: none !important;
}
.img-filter {
  filter:  invert(92%) sepia(2) hue-rotate(180deg) saturate(1000%);
}

/* /FILTER IMAGE */



/**************************/
/*       DATEPICKER       */
/**************************/
.date-container input[type="text" i] {
  padding  : 0.5rem 1rem;
  height   : 2.25rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--gray-400);
  position: relative;
  border: 1px solid #0000001F;
  border-radius: 26px;
}
.date-container ::placeholder {
  color: var(--primary-color) !important;
}
#ui-datepicker-div {
  width: 21.3% !important;
  top: 10px;
}
.date-container {
  position: relative;
}
.date-container img {
  position: absolute;
  right: 10px;
  top: 7px;
  cursor: pointer;
}
.date-container .img-date {
  position: absolute;
  right: 10px;
  top: 6px !important;
  cursor: pointer;
}

.ui-widget.ui-widget-content {
  background   : #FFFFFF 0% 0% no-repeat padding-box;
  box-shadow   : 0px 3px 26px #00000075;
  border-radius: 8px;
}

.ui-datepicker .ui-datepicker-header {
  position                  : relative !important;
  padding                   : 0;
  background-color          : #071d49;
  border-top-left-radius    : 8px;
  border-top-right-radius   : 8px;
  border-bottom-left-radius : 0;
  border-bottom-right-radius: 0;
  height                    :51px;
  border                    : none;
  padding:8px 0px 12px 0px !important;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
    width: 35% !important;
    background-color: #071d49;
    color: #FFF;
    border: none;
    /* margin: 0 1rem; */
}
.ui-datepicker .ui-datepicker-title select {
  font-size    : 1.375rem !important;
  margin       : 0 1rem !important;
  font-family  : "Work Sans";
}
.ui-datepicker .ui-datepicker-title select:hover {
  background-color: #FFFFFF14;
  border-radius   : 0.25rem;
  height          : 2.25rem;
}
    .ui-datepicker .ui-datepicker-title select option {
        background-color: #FFF;
        font-size: 14px;
        color: #071d49;
        display: block;
        white-space: nowrap;
        min-height: 1.2em;
        /* padding: 0px 2px 1px; */
    }
/* .ui-datepicker-title .ui-datepicker-year {

} */


.ui-datepicker-title .ui-datepicker-year::-webkit-scrollbar {
  width         : 0.5rem;
  -webkit-heigth: thin;
}

.ui-datepicker-title .ui-datepicker-year::-webkit-scrollbar-track {
  background-color          : #FFF;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.ui-datepicker-title .ui-datepicker-year::-webkit-scrollbar-thumb {
  border-radius: 10px;
  box-shadow   : inset 0 0 6px rgba(8, 30, 72, 0.3);
}


.ui-datepicker .ui-datepicker-prev {
    left: 0;
    top: 14px !important;
    color: #fff !important;
}

.ui-datepicker .ui-datepicker-next {
    right: 0;
    top: 14px !important;
    color: #fff !important;
}

.ui-datepicker .ui-datepicker-title {
  margin     : 0 1rem !important;
  line-height: 1.8em;
  text-align : center !important;
  color      : #FFF;
  margin-top : 0rem !important;
  font-size  : 1.5rem !important;
}
.form-control.k-widget {
    width: 100% !important;
}
.ui-datepicker table td a {
    min-width: 20px !important;
}
.ui-datepicker {
    width: auto !important;
    padding: 0 !important;
}
.ui-state-default, 
.ui-widget-content .ui-state-default, 
.ui-widget-header .ui-state-default, 
.ui-button, 
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
    background : #FFF !important;
    color      : #000000D6 !important;
    font-size  : 14px !important;
}
.ui-datepicker table {
  width          : 100% !important;
  border-collapse: collapse !important;
}
.ui-datepicker tr {
  margin: 0 16px;
  font-size: 14px;
}
.ui-datepicker th {
  padding    : 0.7em 0.3em;
  text-align : center;
  font-weight: bold;
  border     : 0;
  color      : #C4C4C4;
}
.ui-datepicker td a {
  border: 0 !important;
  padding: 8px 10px !important;
}

.ui-datepicker td a:hover  {
  background-color: #FC6C2114 !important;
  border-radius: 50% !important;
}
.ui-widget.ui-widget-content {
  border: none !important;
}
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    border: none;
    background: #FFF;
    color: var(--secondary-color) !important;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    border: 1px solid var(--secondary-color) !important;
    background: #FFF;
    font-weight: normal !important;
    border-radius: 50% !important;
}
.ui-datepicker .ui-datepicker-prev span, 
.ui-datepicker .ui-datepicker-next span {
    display: none !important;
  }
.ui-datepicker .ui-datepicker-prev, 
.ui-datepicker .ui-datepicker-next {
    position: absolute !important;
    top: 4rem ;
}

/*.ui-datepicker .ui-datepicker-prev:hover, 
.ui-datepicker .ui-datepicker-next:hover {
    background-color: #081E48;
    border: none;
}
    */

/*     /DATEPICKER       */

/*       DATATABLE       */

.main-table{
    box-shadow: 0px 3px 8px #00000029;
}
/*thead th:hover::after {
    position: relative;
    left: 10px;
    height: 10px;
    width: 10px;
    content: url("../../assets/icons/Icons_Sort_Hover.svg");
}
thead th.active::after {
    position: relative;
    left: 7px;
    top: 4px;
    height: 8px;
    width: 8px;
    content: url("../../assets/icons/Icons_Sort_Active.svg");
}*/
.none-chevron:hover::after,
.none-chevron.active::after  {
    content: "";
}

.table-icon {
    background-color: var(--primary-color);
    border-radius: 50%;
    border: none;
    height: 2.25rem;
    width: 2.25rem;
    display: grid;
    place-items: center;
}
.table-container {
    background-color: var(--gray-300);
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border: 1px var(--gray-400) solid;
  }
  .table>thead {
    vertical-align: middle;
    color         : var(--primary-color);
    font-size     : 0.875rem;
    padding       : 1rem;
  }
  table.dataTable {
    margin-top: 0 !important;
  }
  table.dataTable td, table.dataTable th {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    padding: 0.5rem;
  }
  table.dataTable th {
    border-left: solid 1px var(--gray-200);
  }
    table.dataTable th:last-child {
        border-right: solid 1px var(--gray-200);
    }
  table.dataTable td:first-child, table.dataTable th:first-child {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    /*padding-left: 1rem;*/
  }
  table .notify {
    width        : 8px;
    height       : 8px;
    min-width    : 8px;
    min-height   : 8px;
    border-radius: 100px;
    margin-right : 8px;
  }
  
  table tr {
    transition: 0.2s background-color linear;
  }
  
  tbody tr {
    background-color: #ffffff !important;
  }

.table {
    --bs-table-hover-bg: #a92a2714 !important;
}

td {
    padding: 2px 12px;
    border-left: solid 1px #ddd;
    color: var(--gray-100);
    font-size: 14px !important;
}

    td:last-child {
        border-right: solid 1px #ddd;
    }
  
  table .notify.success {
    background-color: var(--success-color);
  }
  
  table .notify.danger {
    background-color: var(--danger-color);
  }
  
  table .notify.purple {
    background-color: var(--purple-color);
  }
  
  table .notify.gray {
    background-color: var(--gray-600);
  }
  
  
  .table-blue-icon {
    background-color: var(--primary-color);
    border-radius: 50%;
    border: none;
    height: 2.25rem;
    width: 2.25rem;
    display: grid;
    place-items: center;
  }
  .table-red-icon {
    background-color: red;
    border-radius: 50%;
    border: none;
    height: 2.25rem;
    width: 2.25rem;
    display: grid;
    place-items: center;
  }
  .table-red-icon img {
    filter: invert(100%) contrast(10%) brightness(200%);
  }

  .first-line-table {
      background-color       : var(--primary-color);
      padding                : 0.75rem 1rem 0.9375rem;
      color                  : var(--white-color);
      font-size              : 1.125rem;
      border-top-left-radius : 2px;
      border-top-right-radius: 2px;
      font-weight            : 600;
  }
  
  .second-line-table {
      background-color: var(--white-color);
      padding: 1rem;
  }

/*      /DATATABLE       */



/*         BUTTONS       */
.btn-white {
    height          : 2.25rem;
    padding         : 0.25rem 1rem;
    background-color: var(--white-color);
    font-size       : 14px;
    border-radius   : 27px;
    border          : 1px solid var(--gray-200);
    opacity         : 1;
    display         : flex;
    align-items     : center;
    justify-content : center;
    line-height     : 100%;
    font-weight     : 500;
    color           : var(--primary-color);
    margin-right    : 0.5rem;
}
.btn-blue {
  color           : var(--white-color) !important;
  border          : none !important;
  background-color: var(--primary-color) !important;
}
.first-line-table div >.btn-blue.active {
  background-color: #FFFFFF52;
}
.btn-blue:hover {
  background-color: #FFFFFF29 !important;
}


button img {
    height: 1.5rem;
    width : 1.5rem;
}

.disabled-btn {
  border: 1px solid var(--gray-200) !important;
  color: var(--gray-200);
}
.btn-disabled-search {
  background-color: var(--gray-300);
  color: var(--gray-200);
  border: none;
}
.disabled-btn img {
  opacity: 0.4 !important;
}

/*        /BUTTONS       */

/*      CHIP FOR ALERT      */
.btn-chip {
  height          : 2.25rem;
  padding         : 0.625rem 1rem;
  background-color: #ED354D29;
  color           : var(--primary-color);
  font-size       : 14px;
  border-radius   : 27px;
  opacity         : 1;
  border          : solid 1px #ED354D;
  display         : flex;
  align-items     : center;
  justify-content : space-between;
  line-height     : 100%;
  width           : 100%;
}
.btn-chip img {
  height: 1rem;
  width : 1rem;
}
/*      /CHIP FOR ALERT */

/*         SIDE MENU        */
:root {
    --nav-width-collapsed: 4.125rem;
    --nav-width-expand: 21.3125rem;
    --nav-background-color: #ffffff;
    --nav-primary-color: #071D49;
    --nav-primary-color-hover: #41B6E642;
    --nav-secondary-color: #a92a27;
    --nav-listing-color: #333333;
    --nav-expand-item-color-hover: #fc6c2126;
    --nav-icon-size: 2.25rem;
    --nav-text-line-height: 2.25rem;
}


body {
  margin-left: var(--width-collapsed);
}

/*************************************************/
/* NAVIGATION */
/*************************************************/
.navigation {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    width: var(--nav-width-collapsed);
    /* height          : 100vh; */
    background-color: var(--primary-color);
    transition: 0.3s ease-in-out;
    overflow: hidden;
    overflow-y: hidden;
    z-index: 99999 !important;
}

/* Scroll setup */
.navigation::-webkit-scrollbar {
  width         : 8px;
  -webkit-heigth: thin;
}

::-webkit-scrollbar-track {
  box-shadow   : inset 0 0 6px rgba(0, 0, 0, 0);
  border-radius: 10px;
}

.navigation::-webkit-scrollbar-thumb {
  height       : 16px !important;
  border-radius: 10px;
  box-shadow   : inset 0 0 6px rgba(8, 30, 72, 0.3);
}

::-webkit-scrollbar:vertical {
  height: 10px;
}
/* /Scroll setup */


.navigation:hover {
  width     : var(--nav-width-expand);
  box-shadow: 0px 3px 26px #41B6E675;
  overflow-y: scroll;
}


/* HEADER */
.navigation .header {
  position       : relative;
  width          : 100%;
  height         : 3.75rem;
  display        : flex;
  justify-content: space-between;
  align-content  : center;
  padding        : 0.5rem 0.2rem;
  background-color: var(--primary-color);
}

/* LOGO */
.navigation .header .brand {
  position           : absolute;
  left: 6.125rem;
  opacity            : 0;
  transition-property: opacity;
  transition-duration: 0.2s;
  transform-style    : linear;
}

.navigation .header .brand img {
  width     : 6.75rem;
  height    : 2.25rem;
  margin-top: 0.5rem;

}

/* NAVBAR EXPANDED*/
.navigation.open .header .brand,
.navigation:hover .header .brand {
  opacity: 1;
}

/* BURGER ACTION MENU */
.navigation .header .menu {
  margin-left: 5px;
  cursor     : pointer;
}

    .navigation .header .menu img {
        width: 3rem;
        /* background-image: url("../../assets/icons/icon-navigation-menu_24px.svg");
        */ filter: invert(50%) sepia(0%) saturate(0%) hue-rotate(346deg) brightness(304%) contrast(97%);
        cursor: pointer;
    }

/* CHANGE THE BURGER ICON */
.navigation.open .header .menu img,
.navigation:hover .header .menu img {
    /* background-image: url("../../assets/icons/icon-navigation-menu-24px-active.svg"); */
    cursor: pointer;
}

/* NAVBAR LIST*/
    .navigation>ul {
  top           : 0;
  left          : 0;
  width         : 100%;
  height        : 100%;
  display       : flex;
  flex-direction: column;
  flex          : 1;
  padding-top   : 2.125em;
  padding-right : 0;
  padding-left  : 0.4rem;
  margin        : 0;
}

        .navigation > ul li {
            list-style: none;
            /* position     : relative; */
            width: 100%;
            margin: 1px 0;
            border-bottom: 1px solid transparent;
           
        }

            .navigation > ul li a {
                padding-left: 1rem;
                position: relative;
                text-decoration: none;
                display: block;
                width: calc(var(--nav-width-expand) - 1.875rem);
                display: flex;
                align-items: center;
                color: var(--nav-primary-color);
                transition: 0.3s color ease-in-out;
                height: 2.25rem;
            }
    .navigation > ul li a > span{
        display:none;

    }
.navigation:hover ul li a > span{
    display:block;
}
.navigation > ul > li.active > a div {
    background-color: var(--white-color);
    display: grid;
    place-items: center;
    border-radius: 50%;
    height: 2.25rem;
    width: 2.25rem;
    position: relative;
    margin-left: -10px;
} 
.navigation>ul>li.active>a div #filtrado {
  filter:  invert(92%) sepia(2) hue-rotate(180deg) saturate(1000%);
}


    /* NOTIFICATION MENU COLLAPSED*/
    .navigation > ul li a img.item-icon {
        display: block;
        position: relative;
        /* min-width  : var(--nav-icon-size);
  min-height : var(--nav-icon-size); */
        width: 1rem;
        height: 1rem;
        line-height: var(--nav-icon-size);
        text-align: center;
    }

    /* ITEM LABEL */
    .navigation > ul li a > span {
        position: relative;
        font-size: 14px;
        line-height: var(--nav-text-line-height);
        padding-left: 1.1rem;
        margin-left: 0.625rem;
        flex-grow: 1 !important;
        transition: 0.2s color linear;
        color: var(--white-color);
    }

    .navigation > ul li a:hover > span {
        color: var(--primary-color);
        font-weight: 600;
    }





/*************************************************/
/* NAVIGATOR EXPANDED */
/*************************************************/
.navigation.open > ul > li.active,
.navigation:hover > ul > li.active {
    background-color: var(--white-color);
    border-top-left-radius: 2.5rem;
    border-bottom-left-radius: 2.5rem;
    border-top-right-radius: 2.5rem;
    border-bottom-right-radius: 2.5rem;
}

    .navigation.open > ul > li.active span,
    .navigation:hover > ul > li.active span {
        color: var(--primary-color);
        font-weight: 600;
        padding-left: 7px;
    }

    .navigation.open > ul > li.active div,
    .navigation:hover > ul > li.active div {
        background-color: transparent;
    }


    .navigation.open > ul > li.active a,
    .navigation:hover > ul > li.active a {
        color: var(--white-color);
    }

.navigation.open > ul > li:hover,
.navigation:hover > ul > li:hover {
    color: #FFF;
    background-color: #FFFFFF16;
    border-top-left-radius: 2.5rem;
    border-bottom-left-radius: 2.5rem;
    border-top-right-radius: 2.5rem;
    border-bottom-right-radius: 2.5rem;
}

    .navigation.open > ul > li:hover span,
    .navigation:hover > ul > li:hover span {
        color: #FFF;
    }

.navigation.open > ul,
.navigation:hover > ul {
    padding-right: 8px;
}




    .navigation.open > ul li,
    .navigation:hover > ul li {
        margin-right: 0.938rem;
    }


/* CHANGE THE COLOR OF SVG */
@supports(filter: invert(100%)) {


    .navigation > ul li .item-icon {
        filter: invert(50%) sepia(0%) saturate(0%) hue-rotate(346deg) brightness(304%) contrast(97%);
    }

    .navigation.open > ul li.active .item-icon,
    .navigation:hover > ul li.active .item-icon {
        filter: invert(50%) sepia(0%) saturate(0%) hue-rotate(346deg) brightness(304%) contrast(97%);
    }
}





.navigation > ul ul {
    display: none;
    position: relative;
    min-width: 140px;
    margin-left: 4px !important;
    transition: 0.3s height linear;
    height: 0px;
}

.navigation > ul li:hover ul {
    display: block;
    height: auto;
}

.navigation li ul li {
    position: relative;
}




.navigation.open {
    left: 0vh;
}

/*        /SIDE MENU        */



/*       DROPDOWN        */
.user-menu {
    display: flex;
}

.user-menu-container {
    background-color: #FFF;
}


.user-name {
    display: flex;
    /* margin     : auto; */
    align-items: center;
    color: var(--primary-color);
    font-weight: 500;
    font-size: 0.875rem;
}

.user-detail {
    font-weight: 300;
    color: #666
}

/*.user-menu.dropdown-toggle::after*/
/*.dropbtn.dropdown-toggle::after*/ 
/*{
    position: relative;
    margin: 0.5rem 0.625rem 0rem 0.625rem !important;
}*/

.dropdown-user {
    position: absolute;
    padding-top: 0;
    border-radius: 1rem;
    opacity: 1;
    top: 0.2rem !important;
}

    .dropdown-user li {
        padding: 10px 5px 10px 20px;
        border-bottom: solid 1px #CDD2DA;
    }

        .dropdown-user li:first-child,
        .dropdown-user li:last-child {
            border-bottom: none;
        }

            .dropdown-user li:last-child a {
                color: #A63B49;
            }


        .dropdown-user li a {
            text-decoration: none;
            display: block;
            width: 100%;
            padding: 0.25rem 1rem;
            font-size: 14px;
            color: var(--primary-color);
            text-align: inherit;
            text-decoration: none;
            white-space: nowrap;
            background-color: transparent;
            border: 0;
        }

    .dropdown-user .user-data {
        background-color: #CDD2DA;
        border-top-left-radius: 16px;
        border-top-right-radius: 16px;
        height: 4.5rem;
        padding: 1.125rem 1.25rem 0.5rem 1.25rem;
    }

        .dropdown-user .user-data p {
            margin-bottom: 0;
            font-size: 14px;
            font-weight: 600;
            color: var(--primary-color);
        }

        .dropdown-user .user-data span {
            color: #071d49;
            font-size: 14px;
        }

.btn-value {
    height: 2.25rem;
    border-radius: 1.6875rem;
    color: var(--primary-color);
    font-size: 14px;
    padding: 0 0.8125rem;
    border: 1px solid #C4C4C4;
    background-color: #FFF;
    box-shadow: 0px 2px 2px #0000001a;
    display: flex;
    align-items: center;
}
    .btn-value:hover{
        text-decoration:none;
    }
    .btn-drop-filter {
        background-color: var(--white-color);
        border: 1px solid #081E4829;
        font-size: 14px;
        color: var(--primary-color);
        border-radius: 50px;
        margin-left: 1.25rem;
        height: 2.25rem;
        font-weight: 500;
    }


/*       /DROPDOWN         */

/*       WELCOME PAGE UTILITIES     */
.button-card {
    background-color: var(--primary-color);
    color: var(--white-color);
    border-radius: 0.5rem;
    border: 1px solid var(--primary-color);
    width: 100%;
    height: 152px;
    font-size: 18px;
    padding: 1.8rem;
}

.button-card-inactive {
    color: var(--gray-200);
    border-radius: 0.5rem;
    width: 24%;
    height: 152px;
    font-size: 18px;
    padding: 1.8rem;
    background: #C4C4C429 0% 0% no-repeat padding-box;
    box-shadow: 0px 8px 10px #00000014;
    border: 1px solid #C4C4C4;
}

.button-card:hover {
    background: var(--secondary-color) 0% 0% no-repeat padding-box;
    border: 2px solid #FFFFFF99;
}

.button-card img {
    height: 3rem;
    width: 3rem;
    margin-bottom: 1rem;
}

.button-card-inactive img {
    filter: contrast(30%) opacity(0.5);
    height: 54px;
    width: 54px;
    margin-bottom: 1rem;
}

.carousel-item img {
    height: 24.5rem;
}

.second-text-color {
    color: var(--secondary-color);
}

/*        Dropdown Search       */
.dropbtn {
    height: 2.25rem;
    border-radius: 1.6875rem;
    color: var(--primary-color);
    font-size: 14px;
    font-weight: 600;
    border: 1px solid var(--gray-200);
    box-shadow: 0px 2px 2px #0000001a;
    background-color: var(--white-color);
}

.grp-list-dropdown {
    /* max-width: 100px; */
    overflow-y: scroll !important;
    max-height: 375px;
}
#myInput {
    box-sizing: border-box;
    background-image: url('../../assets/icons/Icons_Search.svg');
    background-position: 14px 12px;
    background-repeat: no-repeat;
    font-size: 16px;
    padding: 14px 20px 12px 45px;
    border: none;
    border-bottom: 1px solid #ddd;
}

    #myInput:focus {
        outline: 1px solid #ddd;
    }

.dropdown-search {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f6f6f6;
    min-width: 260px;
    overflow: auto;
    border: 1px solid #0000001F;
    border-radius: 0.5rem;
    z-index: 100000;
}

    .dropdown-content a {
        color: var(--primary-color);
        background-color: var(--white-color);
        padding: 12px 16px;
        text-decoration: none;
        display: block;
        font-weight: 600;
    }

        .dropdown-content a:hover {
            background-color: #FC6C2114;
        }

/* .dropdown a:hover {background-color: #ddd;} */

.dropdown-search .show {
    display: block;
}
/*       /Dropdown Search       */
/*       /WELCOME PAGE UTILITIES     */

.help-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2.25rem;
    width: 2.25rem;
    border-radius: 50%;
    padding: 0.6rem 0.73rem;
    background-color: #FFF;
    margin-right: 1rem;
    border: 1px solid var(--gray-200);
    box-shadow: 0px 2px 2px #0000001A;
}

    .help-icon img,
    .btn-value img {
        height: 1rem;
        width: 1rem;
    }

/*        PAGINATION         */
.btn-drop-pagination {
    background-color: var(--white-color);
    border: 1px solid var(--gray-200);
    font-size: 14px;
    color: var(--primary-color);
    border-radius: 50px;
}

.btn-drop-pagination-list {
    border: 1px solid #0000001F;
    border-radius: 0.5rem;
    opacity: 1;
    width: 22% !important;
}

    .btn-drop-pagination-list a,
    .btn-drop-pagination-list li {
        color: var(--primary-color);
        font-size: 14px;
        font-weight: 500;
    }

        .btn-drop-pagination-list a:hover,
        .btn-drop-pagination-list li:hover {
            background-color: #FC6C2114
        }

.btn-check:focus + .btn,
.btn:focus {
    outline: 0px;
    box-shadow: none;
}

.pagination a {
    font-size: 14px;
    color: black;
    float: left;
    height: 2.25rem;
   /* width: 2.25rem;*/
    display: grid;
    place-items: center;
    text-decoration: none;
}

    .pagination a.active,
    .pagination-mobile a.active {
        background-color: var(--primary-color);
        color: white;
        border-radius: 50%;
    }

/*       /PAGINATION         */



/***************************************/
/*             SEARCH BOX              */
/***************************************/

:root {
    --search-text-color: #9fa3b1;
    --search-border-color: #071d493D;
}

.search-box {
    width: 31.25rem;
    border-radius: 50px;
    height: 2.25rem;
    display: flex;
    /* border       : solid 1px #081E483D; */
    /* box-shadow   : 0px 3px 24px #41B6E66B; */
}

.search-mobile {
    display: none;
}

/* SEARCH ICON */
.search-box .input-group .input-group-text {
    background-color: #fff;
    border-right: none;
    border-top-left-radius: 3.125rem;
    border-bottom-left-radius: 3.125rem;
    width: 1.875rem;
}

/* TEXT INPUT */
.search-box .input-group input[type="search"] {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    /* border                    : none; */
    border-left: none;
    padding: 0.487rem 0.5975rem;
    font-size: 14px;
    height: 2.25rem;
}


.search-box .input-group .input-group-text::before {
    content: url("../../assets/icons/Icons_Search.svg");
    height: 8px;
    width: 8px;
    position: absolute;
    left: 5px;
    top: 3px;
}

/* DROPDOWN */
.search-box .dropdown > .dropdown-toggle {
    padding: 5px 0.75rem;
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    background-color: #FFF;
    border-color: #fff;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    border: 1px solid var(--search-border-color);
    border-left: none;
    height: 2.25rem;
}

    /* ARROW */
    .search-box .dropdown > .dropdown-toggle::after {
        border-right: 0.4em solid transparent;
        border-left: 0.4em solid transparent;
        border-top: 0.35em solid var(--primary-color);
        vertical-align: 0 !important;
    }

.search-box .btn:focus {
    outline: 0;
    box-shadow: none;
}

.search-box .dropdown .default_option {
    padding: 5px 5px 5px 10px;
    color: var(--primary-color);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    z-index: 1000;
}

.search-box .dropdown ul {
    position: absolute;
    top: 2.5rem;
    left: -12px !important;
    padding: 0.5rem 0;
    color: var(--primary-color);
    background: #fff;
    width: 15.625rem;
    border: 1px solid #0000001F;
    border-radius: 0.5rem;
    /* box-shadow   : 8px 8px 6px -10px #b3c6ff; */
    z-index: 1;
}


    .search-box .dropdown ul.active {
        display: block;
    }

    .search-box .dropdown ul li {
        padding: 0;
    }

        .search-box .dropdown ul li a {
            padding: 7px 15px;
            color: var(--primary-color);
            font-size: 14px;
            font-weight: 600;
            white-space:pre-wrap;
        }

.search-box ul .dropdown-item:hover {
    background-color: #a92a2714;
}

.search-box .search_field {
    width: 20rem;
    height: 100%;
    position: relative;
}

    .search-box .search_field .input {
        width: 98%;
        height: 100%;
        border: 0px;
        font-size: 16px;
        padding-left: 18px;
        padding-right: 18px;
    }


.search-box ::placeholder,
.search-box ::-webkit-input-placeholder,
.search-box ::-moz-placeholder,
.search-box :-moz-placeholder,
.search-box :-ms-input-placeholder {
    color: var(--search-text-color);
}


/*********************************/
/*     SIMPLE SEARCH BAR         */
/*********************************/

.simple-search-bar {
    position: relative;
}

    .simple-search-bar input {
        border: 1px solid var(--gray-200);
        color: var(--primary-color) !important;
        border-radius: 28px;
        opacity: 1;
        width: 18.5rem;
        height: 2.25rem;
        padding-left: 40px;
    }

    .simple-search-bar img {
        position: absolute;
        top: 4px;
        left: 2%;
        /* z-index: 1; */
    }

.simple-search-bar-items {
    position: absolute;
    background-color: #FFF;
    display: none;
    border: 1px solid #0000001F;
    border-radius: 16px;
    opacity: 1;
    width: 150%;
    top: 120%;
    right: 0;
    padding: 1rem 0;
}


    .simple-search-bar-items li {
        height: 2.25rem;
        padding: 0.5rem 1rem;
        color: var(--primary-color);
        font-size: 14px;
        font-weight: 500;
        display: flex;
        justify-content: space-between;
    }

        .simple-search-bar-items li span p {
            color: #727272;
        }

        .simple-search-bar-items li h6 {
            color: #C4C4C4;
            font-size: 14px;
        }

        .simple-search-bar-items li:hover h6 {
            color: var(--secondary-color);
        }

        .simple-search-bar-items li:hover {
            background-color: #FC6C2114;
        }

.simple-search-bar:active .simple-search-bar-items {
    display: block;
}


/*           FOOTER          */

.footer {
    padding: 1rem 2rem 1.25rem 6.5rem;
}

    .footer section p {
        color: var(--gray-100);
    }

    .footer div > p {
        font-weight: 400;
    }

    .footer img {
        margin-left: 2rem;
        margin-bottom: 1rem;
        height: 1.5rem;
        width: 1.5rem;
    }

.footer-info a {
    text-decoration: none;
    color: var(--primary-color);
    font-weight: 600;
}

.footer-info a:hover {
    color: var(--secondary-color)!important;
}

    .footer-info a::after {
        content: "|";
        margin-left: 0.6rem;
        color: #707070;
        margin-right: 0.2rem;
    }

    .footer-info a:last-child::after {
        content: "";
        margin-left: 0;
        margin-right: 0;
    }

/* SOCIAL MEDIA ICON */
/* Facebook */
.footer .facebook-icon img:hover {
    content: url("../../assets/img/Glyphs_Facebook_On.svg");
}
/* Instagram */
.footer .second-section-footer .instagram-icon img {
    content: url("../../assets/img/Glyphs_Twitter_Off.svg");
}

.footer .instagram-icon img:hover {
    content: url("../../assets/img/Glyphs_Twitter_On.svg");
}
/* Linkedin */
.footer .linkedin-icon img:hover {
    content: url("../../assets/img/Glyphs_Linkedin_On.svg");
}
/* Youtube */
.footer .youtube-icon img:hover {
    content: url("../../assets/img/Glyphs_Youtube_On.svg");
}
/*          /FOOTER          */


/*********************************************8*/

/* HORIZONTAL NAVIGATION NAVBAR */


ul {
    list-style: none;
}




/* BUTTON HEADER */
.view-as {
    height: 3rem;
    width: 14.375rem;
    margin-left: 0.9375rem;
}




.btn-back {
    display: flex;
    align-items: center;
    border: none;
    background-color: #FFF;
    font-size: 14px;
    color: var(--primary-color);
    border-radius: 27px;
    padding: 2px 15px 2px 5px;
    height: 2.25rem;
}

.btn-search {
    background-color: var(--secondary-color);
    font-size: 14px;
    color: #FFF;
    border: none;
    border-radius: 28px;
    padding: 0.4375rem 1.25rem;
    margin-left: 0.9rem;
    height: 2.23rem;
}

.btn-default {
    height: 36px;
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #FFF;
    border: none;
    border-radius: 27px;
    padding: 0.5rem 1rem;
    line-height: 100%;
}
/*      DROPDOWN FILTER    */
.dropdown-menu {
    border: 1px solid #0000001F;
    border-radius: 8px;
    opacity: 1;
}

    .dropdown-menu li {
        font-size: 14px;
        color: var(--primary-color);
        font-weight: 600;
    }

.scroll li {
    padding: 0.6875rem 1.1875rem 0.5625rem 1rem;
}

.dropdown-menu li:hover {
    background-color: #fff;
}
/*     /DROPDOWN FILTER    */


/*      BREADCRUMB       */
.breadcrumb-line .breadcrumb-item a,
.breadcrumb-line .breadcrumb-item {
    color: #FFF;
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
}

.make-payment-first-line .breadcrumb-item::before {
    color: #FFFFFF6B;
}

.make-payment-first-line .breadcrumb-item:last-child:before {
    color: #FFF;
}

.btn-close-mobile {
    display: none;
}

.breadcrumb-line img {
    filter: invert(100%) contrast(200%) brightness(100%);
}

.breadcrumb-line button img {
    filter: invert(0%) contrast(0%) brightness(0%);
}

.breadcrumb-active-color {
    color: #FFFFFF6B !important;
}
/*      /BREADCRUMB      */


.btn-dropdown-language {
    position: relative;
    /* margin-left  : -6.875rem !important; */
    border: 1px solid #0000001F;
    border-radius: 1rem;
    opacity: 1;
    padding: 0.5rem 0rem 0.75rem 0;
}

 /*   .btn-dropdown-language a,
    .btn-dropdown-language li {
        color: var(--primary-color);
        font-size: 14px;
        font-weight: 600;
    }*/

        .btn-dropdown-language a:hover,
        .btn-dropdown-language li:hover {
            background-color: #FC6C2114;
            text-decoration:none;
        }

.main-user-container {
    position: relative;
    z-index: 2000;
}

/* SPINNER */

/* /SPINNER */



.message-notification {
    position: absolute;
    display: grid;
    place-items: center;
    top: -5px;
    right: -5px;
    font-size: 0.6875rem;
    height: 1rem;
    width: 2rem;
    border-radius: 27px;
    background-color: #ED354D;
    color: #FFF;
}



/* Checkbox style */

.form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
    /* margin-top: 2rem; */
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #0000001F;
   /* -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;*/
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.form-check {
    display: flex;
    min-height: 0;
    padding-left: 10px;
    margin-bottom: 0;
}

.form-check-input:checked {
    background-color: var(--secondary-color) !important;
    border-color: var(--secondary-color) !important;
}


.form-check-input:focus {
    border-color: none !important;
    outline: 0 !important;
    box-shadow: none !important;
    border: 1px solid #00000066 !important;
}

.form-check .form-check-input,
.form-check-input {
    min-width: 1.125rem;
    min-height: 1.125rem;
    margin-top: 0;
    border: 1px solid #00000066;
    float: none;
    margin-left: 0;
}

.form-select:focus {
    border: 1px solid #0000001F;
    box-shadow: none;
}


/* TOASTS */

.toast-header {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    color: var(--primary-color);
    font-size: 14px;
    font-weight: 600;
    background-color: #FFF;
    /* background-clip: padding-box; */
    border-bottom: 1px solid rgba(0,0,0,.05);
    border-top-left-radius: 0.5rem !important;
    border-top-right-radius: 0.5rem;
}

.toast-body {
    padding: 0.75rem;
    word-wrap: break-word;
    background-color: #FFF;
    color: var(--primary-color);
    font-size: 14px;
    height: 6rem;
}
/* /TOASTS */

/* MODAL */

.modal-content {
    box-shadow: 0px 3px 26px #00000075;
    border-radius: 1rem;
}

.modal-body {
    font-size: 14px;
    color: var(--primary-color);
}

.modal-header {
    border-bottom: none;
}

#exampleModal {
    top: 200px;
    border-radius: 50px;
}

#exampleModalLabel {
    color: var(--primary-color) !important;
    font-size: 1rem;
    font-weight: 500;
    /* font-family: "Poppins" !important; */
}

.modal-footer {
    border-top: none;
}

.bootbox-alert .modal-footer button {
    padding: 8px 30px !important;
    border: 0 !important;
    color: #fff !important;
    font-size: 13px;
    width: auto !important;
    font-weight: 600 !important;
    border-radius: 31px;
    background-color: var(--secondary-color);
}
.bootbox .modal-footer .btn-primary {
    padding: 8px 30px !important;
    border: 0 !important;
    color: #fff !important;
    font-size: 13px;
    width: auto !important;
    font-weight: 600 !important;
    border-radius: 31px;
    background-color: var(--secondary-color) !important;
}
.bootbox-alert .modal-header .close{
    font-size:26px !important
}

.modal-footer button:hover {
    color: #ffffff;
    background: var(--secondary-color);
    box-shadow: none;
}
.modal-footer button:focus {
    color: #ffffff;
    background: var(--secondary-color);
    box-shadow: none;
}


/* /MODAL */
/* FILE OPTION SECTION */
.file-option {
    display: flex;
    justify-content: space-between;
    border: solid 1px #C4C4C4;
    border-radius: 0.5rem;
    height: 2.25rem;
    padding: 0 1rem;
}

    .file-option button {
        border: none;
        background-color: #FFF;
        color: var(--secondary-color);
        display: flex;
        align-items: center;
        font-size: 0.875rem;
    }

/* /FILE OPTION SECTION */



/* MAIN */

.main-content {
    margin-left: 6.125rem;
    margin-right: 2.25rem;
}


.container {
    position: relative;
    width: 50%;
}

.image {
    display: block;
    width: 6.25rem;
    height: auto;
}

.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 6.25rem;
    width: 6.25rem;
    opacity: 0;
    transition: .5s ease;
    background-image: url(/assets/img/Glyphs_Facebook_On.svg);
    background-color: #008CBA;
}

.container:hover .overlay {
    opacity: 1;
}

/**************************************/


.gbg-btn-secondary {
    background-color: var(--secondary-color);
    border-radius: 1.6875rem;
    color: #ffffff;
    font-size: 13px;
    padding: 0.3rem 0.75rem;
}


    .gbg-btn-secondary:hover {
        color: #ffffff;
    }


.chips .close {
    position: absolute;
    right: 15px;
    top: 8px;
    width: 20px;
    height: 20px;
    opacity: 0.7;
    transition: 0.3s opacity linear;
    display: flex;
    cursor: pointer;
}

    .chips:hover,
    .chips .close:hover {
        opacity: 1;
    }

    .chips .close:before,
    .chips .close:after {
        position: absolute;
        left: 15px;
        content: ' ';
        height: 17px;
        width: 2px;
        background-color: #fff;
    }

    .chips .close:before {
        transform: rotate(45deg);
    }

    .chips .close:after {
        transform: rotate(-45deg);
    }



.chips.primary {
    background-color: var(--primary-color);
    border: 1px solid var(--primary-color);
}

.chips.transparent {
    background-color: transparent;
    border: 1px solid var(--gray-200);
    color: var(--primary-color);
}


.gbg-card {
    border-radius: 15px;
    margin-bottom: 2rem;
    min-height: 248px;
}

.wrapper .search_box .search_field .small {
    display: none;
}

.search_box .search_field .long {
    display: inline-block;
}

/* DATATABLE */
table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before {
    background-color: var(--primary-color) !important;
}

.custom-table-1 tbody {
    vertical-align: middle;
    border-top: 0px !important;
}

.notification-row {
    font-weight: 600;
}



.form-control:focus {
    color: #212529;
    background-color: #fff;
    border-color: transparent;
    outline: 0;
    box-shadow: none;
}


/**********************************************/
/* STATS */
/**********************************************/
.card-stat {
    border: 1px #ccc solid;
    border-radius: 15px;
    padding: 25px;
    min-height: 240px;
}



    .card-stat h3.subtitle-stat {
        color: var(--secondary-color) !important;
        font-size: 14px;
        font-weight: 600;
    }

    .card-stat h4.title-stat {
        color: var(--primary-color) !important;
        font-size: 22px;
        font-weight: 600;
    }

    .card-stat h4 small {
        font-weight: 300;
        font-size: 14px;
    }

    .card-stat .description-stat {
        color: var(--primary-color) !important;
    }

    .card-stat .separator-stat {
        position: relative;
        display: inline-block;
        height: 1px;
        padding-right: 5px;
    }

    .card-stat .subtotal-stat {
        text-align: right;
        width: 100px;
        color: var(--gray-600);
    }

    .card-stat .total-stat {
        border-radius: 50px;
        background-color: var(--secondary-color-opacity);
    }

        .card-stat .total-stat .subtotal-stat {
            color: var(--primary-color) !important;
        }
.block-pointer {
    pointer-events: none;
    cursor: not-allowed;
}
.datepicker-icon{
    position:absolute !important;
    right:10px !important;
    top:10px !important;
}


bootbox-close-button close{
    width:100%;
    display:flex;
    justify-content:flex-end;
    border:none;
    background-color:transparent;
    font-size:26px !important;
}

.bootbox-alert .close {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    border: none;
    background-color: transparent;
    font-size: 26px !important;
}
.ui-select-match  .form-control{
    background-color:transparent !important;
}

.ui-select-choices-row a{
    text-decoration:none !important;
}

 .hyperlink {
    color: var(--secondary-color) !important;
 }

/* new payment styles */
.grey-box {
    background-color: #071d49;
    border-radius: 6px;
    padding: 15px;
    color: #fff;
}
.paymentmethod input[type="text"] {
    border: 1px solid #b7c0cb;
    border-radius: 0;
    min-height: 30px;
    padding: 7px 15px;
    padding-left: 10px;
    -webkit-appearance: none;
    appearance: none;
    color: #071d49;
}

.paymentmethod .radio-inline input[type="radio"] {
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    margin-right:6px;
}

.paymentmethod .radio-inline span {
    display: inline-block;
    vertical-align: top;
}
.paymentmethod .other-pay a {
    color: var(--secondary-color) !important;
    text-decoration: underline !important;
    font-weight: bold !important;
}
.paymentmethod .other-pay {
    color: #fff;
    border-radius: 4px;
    font-weight: normal;
    padding: 3px 12px;
    cursor: pointer;
}


.paymentmethod .btn-wrap {
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid #dedede;
}
@media(min-width:769px){
	
	.active-policies-row {
		justify-content:center;
	}
}
    
@media(max-width:992px) {

    .policypayment .table-responsive {
        margin-bottom:16px;
    }
}
@media(min-width:992px) {
    .policypayment .max-height {
        max-height: 220px;
    }

    .policypayment table.dataTable thead th {
        position: sticky !important;
        top: 0 !important;
    }
}
tr.expandDtls  td{
    padding: 13px !important;
    margin: 0 !important;
    background: #fbfbfb !important;
}
    tr.expandDtls:hover td{
        background: #fbfbfb !important;
    }

tr.expandDtls .seperation {
    border-right: 2px solid #2a5796;
    margin: 0 10px 0 4px;
}
tr.expandDtls .expand_policydetails {
    padding: 10px;
}

/*Payment confirmation page*/
.paymentconfirmation .gray-box {
    background: #eae9e9;
    border-radius:6px;
    padding:15px 25px;
}
.paymentconfirmation .green-txt {
    display: flex;
    align-items: center;
    height: 100%;
    color: #0c8a30;
    font-size: 16px;
}
.paymentconfirmation .payment-box {
    max-width: 250px;
    min-height: 66px;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--secondary-color);
    border-radius: 6px;
    justify-content: center;
    padding: 6px 10px;
}
.paymentconfirmation .payment-box-heading {
    font-size: 15px;
    color:#000000;
}
.paymentconfirmation .payment-box-subheading {
    color: #ffffff;
    font-size: 20px;
    line-height: normal;
}
.paymentconfirmation .main-header, .paymenterror .main-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: normal;
}
.paymenterror .red-box {
    background-color: #ffdcd7;
    padding: 15px 10px;
    border-radius: 4px;
}
.paymenterror .red-txt {
    display: flex;
    align-items: center;
    height: 100%;
    color: red;
    font-size: 16px;
}
.paymenterror .paymentfailedassistance {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #fff;
    border: 1px solid #c5c5c5;
    min-height: 150px;
    padding: 10px 25px;
}
.paymenterror .paymentfailedassistance p{
    margin-bottom:0!important;
}
.paymenterror .paymentfailedassistance a {
    color: var(--secondary-color);
    cursor:pointer;
}

.paynowsection .info-bgborder h4 {
    color: var(--secondary-color);
    font-size: 18px;
}
.paynowsection .info-bgborder {
    border-radius: 5px;
}

.paynowsection .payment-seperations {
    padding-bottom: 20px;
    border-bottom: 1px solid #005696;
    margin-bottom: 20px;
    width: 100%;
}
    .paynowsection .payment-seperations p, .paynowsection p {
        margin-bottom: 0 !important;
    }


span.amountopay {
    display: block;
    font-weight: 600;
    font-size: 16px;
}
    span.amountopay b {
        color: var(--secondary-color);
        font-size: 16px;
        margin-left: 10px;
        font-weight:900;
    }

.footer a.linkedin-icon {
    position: absolute;
    right: 2.25rem;
    bottom: 5px;
}



/*benefit accumulator dialog*/
.ngdialog.ngdialog-theme-default.benefitaccumulatdialog {
    overflow: hidden !important;
        padding-top: 24px!important;
    padding-bottom: 50px!important;
}
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .ngdialog-content {
        width: auto;
        max-width: 83%;
        padding: 0 !important;
        font-family: 'Work Sans',sans-serif !important;
        background:transparent!important;
       /* margin-top: 80px!important;*/
    }

.ngdialog.ngdialog-theme-default.benefitaccumulatdialog .ngdialog-close {
    z-index: 2;
    top: 0;
}
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .tablecontainer th {
        background: #eeeeef;
        color: #52565a !important;
        font-weight: 400;
        border-left: 1px solid #ddd !important;
        border-top: 1px solid #ddd !important;
        border-bottom: 1px solid #ddd !important;
        padding: 2px 10px;
        font-size: 13px;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .tablecontainer td {
        border-left: 1px solid #ddd !important;
        border-top: 1px solid #ddd !important;
        border-bottom: 1px solid #ddd !important;
        padding: 2px 10px;
    }
.ngdialog.ngdialog-theme-default.benefitaccumulatdialog table tbody tr:nth-child(2n) {
    background-color: #fff !important;
}

.ngdialog.ngdialog-theme-default.benefitaccumulatdialog table tbody tr {
    background: #F9f9f9 !important;
}

/*commit styles*/
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .request-type, .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .request-section {
        padding: 5px 2px 5px 12px !important;
    }

    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .deduct-proname {
        background: rgb(0 44 86 / 18%) !important;
        color: #002c56 !important;
        margin:12px 12px 0!important;
    }
 /*   .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .modal-heading {
        font-size: 1rem !important;
    }

    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .modal-header {
        padding: 10px !important;
    }*/

    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .deduct-main-heading > div, .table-bordered th {
        padding: 6px 4px !important;
    
        background: #eeeeef;
        color: #52565a !important;
   /*     border-left: 1px solid #ddd !important;
        border-top: 1px solid #ddd !important;
        border-bottom: 1px solid #ddd !important;*/
        font-weight: normal !important;
        font-size: 13px;
        line-height: normal;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .policy-info-buttons .btn.btn-default {
        padding: 6px 14px !important;
        height: 26px !important;
    }

    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .tab-section-cases .btn.btn-default.active {
        background: var(--secondary-color) !important;
        color: #fff !important;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .tab-section-cases .btn.btn-default {
        background: #fff !important;
        border: 1px solid #88888830;
        border-radius: 6px 6px 0px 0px !important;
        color: #686767 !important;
        margin-right: 4px;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .schudlepopup .tre-menu {
        height: calc(100vh - 182px) !important;
        margin: 12px !important;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .benefitMainPane {
        overflow: hidden !important;
        height: 450px !important;
        /*display: flex;
        justify-content: center;
        align-items: center;*/
    }

    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .schudlepopup .tree-right {
        /*height: 100% !important;*/
        height: calc(100vh - 182px) !important;
        margin-top: 13px !important;
        margin-left:12px;
        max-width:97%!important;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .schudlepopup li {
        font-size: 13px;
        margin-bottom: 0 !important;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .request-type h6, .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .request-section h6 {
        margin: 0 !important;
        font-size: 14px;
        background: #002c56 !important;
        color: #fff !important;
        padding: 6px 10px !important;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .schudlepopup .tree-right-mainview {
        padding-top: 0;
        margin-top: 0;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .details .request-section label {
        font-size: 12px;
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .head-highlight {
        background: rgb(0 44 86 / 18%) !important;
        display: inline-block;
        text-transform: uppercase;
        font-size: 13px !important;
        font-family: 'Poppins', sans-serif;
        margin-bottom: 4px;
        color: var(--primary-color);
        /*min-width: 38%;*/
    }
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .td-border {
        border-bottom: 1px solid #ddd !important;
        padding: 2px 10px;
    }
        .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .td-border:last-of-type {
            border-bottom: none !important;
        }
.ngdialog.ngdialog-theme-default.benefitaccumulatdialog .tablecontainer th:last-child {
    border-right: 1px solid #ddd !important;
}
.preloader-mainview {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .preloader-mainview .fa.fa-spinner {
        font-size: 27px;
    }
.ngdialog.ngdialog-theme-default.benefitaccumulatdialog .ngdialog-close:before{
    content:none!important;
}

.ngdialog.ngdialog-theme-default.benefitaccumulatdialog .ngdialog-close {
    box-sizing: content-box; 
    width: 1em;
    height: 1em; 
    padding: .25em .25em; 
    color: #000; 
    background: url('data:image/svg+xml,%3csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 16 16\' fill=\'%23000\'%3e%3cpath d=\'M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z\'/%3e%3c/svg%3e') center / 1em auto no-repeat; /* Background with SVG */
    border: 0;
    border-radius: .375rem; 
    opacity: .5; 
    right: 16px;
    top: 16px;
}
    .ngdialog.ngdialog-theme-default.benefitaccumulatdialog .ngdialog-close:hover {
        opacity: 1;
    }

.claimbox .step-content {
    top: 32%;
    right: 63px;
}

/*16-02-2026*/

.search-box.square .dropdown > .dropdown-toggle {
    padding: 5px 0.75rem;
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    background-color: #FFF;
    border-color: #fff;
    border-radius: 8px !important;

    border: 1px solid var(--search-border-color);
    height: 2.25rem;
    width: 200px;
  
}
.search-box.square .input-group input[type="search"] {
    border-left: 1px solid var(--search-border-color) !important;
    border-radius: 8px !important;
}
.searchBox {
    margin-right: 12px!important;
}
/*table.no-border-table td, table.no-border-table th {
    border-left: none !important;
}
table.no-border-left {
    border:1px solid #ddd !important
}*/
.search, .reset-search {
    position: relative;
}
.search {
    box-sizing: border-box;
    background-image: url('../../assets/img/Icons_Search_White.svg');
    background-position: 12px 11px;
    background-repeat: no-repeat;
    padding: 0.4375rem 2rem;
}

.search:focus {
    outline: 1px solid #ddd;
}
.iconDescription.icon-white {
    /* Modern browsers */
    filter: invert(100%);
    /* Older Safari */
    -webkit-filter: invert(100%);
    /* Very old Firefox */
    -moz-filter: invert(100%);
    /* Legacy IE (limited support) */
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(invert=1)";
}


.reset-search {
    box-sizing: border-box;
    background-image: url('../../assets/img/refresh-arrow-white-icon.svg');
       background-position: 17px 11px;
    background-repeat: no-repeat;
    padding: 0.4375rem 2.2rem;
}
.reset-search:focus {
    outline: 1px solid #ddd;
}

.policytypebox {
    background: #a92a2714;
    display: inline-block;
    padding: 3px 6px;
}