/***************
 Result page css 
 ***************/

/* common loader css */
.loader {
  width: 100%;
  text-align: center;
}

.loader img {
  height: 100px;
}


 input:-webkit-autofill,
 input:-webkit-autofill:hover,
 input:-webkit-autofill:focus,
 input:-webkit-autofill:active {
   transition: background-color 5000s ease-in-out 0s;
 }
 
 .btn-info:not(:disabled):not(.disabled).active:focus,
 .btn-info:not(:disabled):not(.disabled):active:focus,
 .show>.btn-info.dropdown-toggle:focus {
   box-shadow: unset;
   border-color: rgba(0, 0, 0, 0.1);
 }
 
 /* navbar css for result page */
 .result_navbar_section {
   width: 100%;
   padding: .8rem 9% !important;
   position: sticky;
   top: 0;
   z-index: 99999;
 }
 .header_bars{
  background-color: var(--black-color);
 }
 
 .result_navbar_section .mobile_bars {
  cursor: pointer;
    position: absolute;
    top: 13px;
    /* margin: 0 40px; */
    left: 110px;
 }
 
 .mobile_bars .bars {
   position: relative;
   color: #000;
   font-size: 35px;
 }
 
 .fillterWrapper .filter-tooltip{
  top: 10px !important
 }
 .result_navbar_section #open_list_bar {
   position: fixed;
   top: 0px;
   left: -100%;
   z-index: 999;
   height: 100vh;
   transition: all .5s ease-in-out;
   list-style: none;
   box-shadow: 0 0 5px grey;
   background: #f8f9fa;
   overflow-y: scroll;
 }
 
 #open_list_bar .cat_bar_logo_link {
   padding: 0 15px;
 }
 
 #open_list_bar .cat_bar_logo_link .cat_bar_img {
   width: 30px;
 }
 
 #open_list_bar .cat_title {
   color: #000;
   font-weight: 900;
   font-size: 14px;
   position: relative;
   left: 10px;
   top: 3px;
 }
 
 #open_list_bar .close_bar_btn {
   position: absolute;
   right: 8px;
   font-size: 28px;
   top: 15px;
   cursor: pointer;
 }
 
 .list-items-container .list_cat_heading {
   padding: 8px 15px;
   background-color: var(--primary-color);
   color: #fff;
   font-size: 13px;
 }
 
 .list-items-container .list_cat_name {
   padding: 8px 15px;
   font-size: 12px;
   border-bottom: 1px solid rgb(209, 213, 219)
 }
 
 .list-items-container .list_cat_name:active {
   color: #000 !important
 }
 
 .list-items-container .list_cat_name:hover {
   background-color: #e9ecef;
 }
 
 /* h1,h2 for result page , searchbox and length selector css*/
 .pageHeading>.result_heading {
   font-size: 22px;
   font-weight: 600;
   color: #000;
 }
 
 .serachSection {
   height: auto;
 }
 
 
 .letter-close-button-commonPage {
   position: absolute;
   right: 300px;
   top: 24px;
   font-size: 15px;
   cursor: pointer;
   display: none;
 }
 
 .ltr-cls-btn-commonPage {
   display: block;
 }
 
 .tab_link_wrapper {
   display: flex;
   width: 100%;
   justify-content: center;
   background: var(--black-color);
   border-radius: 40px;
   margin: 10px 0px;;
   padding: 10px;
   /* border: 2px solid var(--black-color); */
 }
 
 .tab_link_wrapper .flex-row {
   -ms-flex-direction: row !important;
   flex-direction: row !important;
   display: flex;
   overflow: hidden;
   margin: 0 25px;
 }
 
 .tab_link_wrapper #next {
   background: url('/assets/images/next.webp');
   background-size: cover;
   width: 21px;
   height: 21px;
   object-fit: cover;
   padding: 3px;
   border: none;
   position: absolute;
   top: 6px;
   right: 10px;
 }
 
 .tab_link_wrapper #prev {
   background: url('/assets/images/prev.webp');
   background-size: cover;
   width: 21px;
   height: 21px;
   object-fit: cover;
   padding: 3px;
   border: none;
   position: absolute;
   top: 6px;
   left: 10px;
 }
 
 .active-tab {
   border-bottom: solid 3px var(--primary-color) !important;
 }
 
 .tab_link_wrapper .tab_link {
   font-size: 15px;
   font-weight: 900;
   margin: 0 5px;
   padding-top: 5px;
   border: none;
   outline: none;
   background-color: inherit;
   color: white
 }
 
 /* advanced filter and sorting css */
 .Advancedbtn .filter_count {
   width: 20px;
   color: white;
   height: 20px;
   text-align: center;
   background-color: #808080;
   padding-top: 2px;
   border-radius: 50%;
   margin-right: 1px;
   position: relative;
   left: 150px;
 }
 
 .Advancedbtn .filterButton {
   background: #f8f9fa;
   box-shadow: 0 0 3px #343a4063;
   width: 190px;
   border-radius: 10px;
   border: none;
   outline: none;
   font-weight: 900;
   font-size: 13px;
   padding: 8.5px;
   text-align: left;
 }
 
 .Advancedbtn .angle-arrow {
   background: url(../images/angle-arrow-down.svg) no-repeat;
   background-size: contain;
   width: 10px;
   height: 20px;
   font-weight: 900;
   position: absolute;
   top: 20px;
   right: 5px;
   margin: -3px 0;
 }

 
 /* .fillterWrapper .same {
   margin-bottom: 10px;
 } */
/*  
 .tick {
   background: url("/assets/images/close-btn.svg") no-repeat;
   background-position: 95% 50%;
 } */
 
 
 .sort-select,
 #select_dropDown {
   background: #f8f9fa;
   border: solid 1px var(--black-color);
   box-shadow: 2px 2px 1px 0px var(--black-color);
   word-wrap: normal;
   width: 190px;
   border-radius: 10px;
   cursor: pointer;
   padding: 10px;
   text-align: left;
   color: #1c1107;
   font-size: 13px;
   font-weight: 600;
   font-stretch: normal;
   font-style: normal;
   outline: none;
 }
 .length-select{
  background: #f8f9fa;
    border: solid 1px var(--black-color);
    box-shadow: 2px 2px 1px 0px var(--black-color);
    word-wrap: normal;
    width: 190px;
    border-radius: 10px;
    cursor: pointer;
    padding: 10px;
    text-align: left;
    color: #1c1107;
    font-size: 13px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    outline: none;
 }
 
 /* result data css */
 #home_page_search_result {
   padding: 10px;
   font-size: 12px;
 }
 
 #home_page_search_result:hover {
   text-decoration: underline !important;
 }
 
 .wordCount {
   text-indent: 10px;
   font-size: 18px;
 }
 
 .filterSortedIcons {
   flex-basis: 11%;
   display: flex;
   font-size: 20px;
   gap: 20px;
   cursor: pointer;
   display: none
 }
 
 .allGroupWords {
   background-color: white !important;
   width: auto;
   height: auto;
   border-radius: 15px;
   box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
   margin: 10px 0;
   border:2px solid var(--black-color)
 }
 
 .allGroupWords>.wordListHeading {
   background: var(--black-color);
   padding: 10px 0px 5px 25px;
   border-top-right-radius: 13px;
   border-top-left-radius: 13px;
   color: #fff;
 }
 
 .wordListHeading>h3 {
   font-size: 20px;
   font-weight: 600;
 }
 
 .wordList {
   padding: 15px;
 }
 
 .wordList>ul {
   display: inline-flex;
   width: 100%;
   flex-wrap: wrap;
 }
 .fillterWrapper input{
  padding: 10px !important;
  font-size: 14px;
  width: 140px;
 }
 .fillterWrapper .filter-tooltip img{
  width: 22px;
 }
 
 .wordList>ul li {
  
   padding: 8px 0;
   background: #f8f9fa;
   border-radius: 5px;
   margin: 6px 6px;
   width: auto;
   min-width: 100px;
   text-align: center;
   border: solid 1px var(--black-color);
   box-shadow: 2px 2px 1px 0px var(--black-color);
 }
 
 .wordList .anchor__style {
   color: #000 !important;
   font-size: 15px;
   text-decoration: none !important;
   font-weight: 600;
 }
 
 .wordList .anchor__style .highlight {
   color: #ff0000 !important;
 }
 
 .points {
   color: #73716e;
   font-weight: 600;
 }
 
 .errorMsg {
   text-align: center;
   font-size: 20px;
   color: red;
   font-weight: 800;
 }
 
 /* close */
 
 
 @media (max-width: 768px) {
 
   /* result page navbar, closebtn, heading css for mobile */
   .allGroupWords,.allGroupWords>.wordListHeading{
    border-radius: 0px;
    border: none;
   }
   .result_navbar_section {
     padding: 1.2rem 15px !important;
   }
 
   .nav_menu_bar {
     display: none;
   }
 
   .result_navbar_section .mobile_bars {
     display: block;
     position: absolute;
     top: 30px;
     margin: 0;
     left: 30px;
   }
 
   .letter-close-button-commonPage {
    right: 45%;
    top: 17px;
    font-size: 15px;
   }
   .letter-close-button-commonPage  svg{
    width: 30px;
   }
 
   .pageHeading>.result_heading {
     font-size: 1.8rem;
     padding-left: 25px;
   }
 
   /* length selector css for mobile */
 
   .tab_link_wrapper .flex-row {
     margin: 0 15px;
   }
 
   .tab_link_wrapper .tab_link {
     font-size: 12px;
   }
 
   .tab_link_wrapper #prev {
     top: 6px;
     left: 5px;
     width: 16px;
     height: 16px;
   }
 
   .tab_link_wrapper #next {
     top: 6px;
     right: 5px;
     width: 16px;
     height: 16px;
   }
 
   /* advanced filter and sorting css for mobile */
   .angle-arrow {
     display: none;
   }
 
   .Advancedbtn .filterButton {
     display: none;
   }
 
   .fillterWrapper {
     right: auto;
     position: fixed;
     left: 0px;
     top: 135px;
     width: 100%;
   }
 
   .Advancedbtn .filter_count {
     display: none !important;
   }
 
   .filterSortedIcons {
     display: flex;
     gap: 8px;
   }
   .fillterWrapper{
    position: static;
   }
   .filters{
    flex-direction: column;
   }
   #sort-select{
    margin-top: 1rem;
   }
 
   /* result data css for mobile */
   .pad {
     padding-bottom: 50px;
   }
 
   .wordCount {
     font-size: 1.3rem;
   }
 
 }