#map {
      height: 100%;
    }
   
    #floating-panel {
      position: absolute;
      top: 10px;
      left: 25%;
      z-index: 5;
      background-color: #fff;
      padding: 5px;
      border: 1px solid #999;
      text-align: center;
      font: 12px / 20px 'Helvetica Neue', Arial, Helvetica, sans-serif;
      line-height: 30px;
      padding-left: 10px;
    }
    #floating-panel {
      background-color: #fff;
      border: 1px solid #999;
      left: 25%;
      padding: 5px;
      position: absolute;
      top: 10px;
      z-index: 5;
    }
      
 

      #map .mapboxgl-popup-content
      {
        background: #ffffff;
        font-weight: 300;
          font-size: 14px;
          overflow: hidden;
          color: #000000;
          width: 262px !important;
          border-radius:0.75rem;
      }

       #map .mapboxgl-popup-content h3{    
        /*text-transform: uppercase;    */
        text-align: center;    
        margin-top: 5px;    
        color: #000000;
        font-size: 16px
        }

    
        #map .mapboxgl-popup-content .data_block{
        text-align: center;
        }
        #map .mapboxgl-popup-content img{  
        max-width: 100%;   
        margin: auto;  
        display: block;
        }
        #map .mapboxgl-popup-content .data_block .left,#map .mapboxgl-popup-content .data_block .center, #map .mapboxgl-popup-content .data_block .right{   
        display: inline-block;    
        width: 49%;    
        font-size: 14px;    
        margin: 0px auto;
        }
        
        /*btn css*/
        #map .mapboxgl-popup-content .data_block_btn{
        text-align: center;
        }
        
        #map .mapboxgl-popup-content .data_block_btn .left{   
        display: inline-block;    
        width: 28%;    
        font-size: 9px;    
        }
        
        #map .mapboxgl-popup-content .data_block_btn .right{   
        display: inline-block;    
        width: 70%;    
        font-size: 14px;  
        }
        
        #map .mapboxgl-popup-content a.btn_view_more_head {
            border: 1px solid #83a4a4;
            color: #ffffff;
             padding: 8px; 
            display: block;
            max-width: 215px;
            text-align: center;
            margin: 0 auto 9px auto;   
            /* font-weight: 400; */
            font-size: 8px;
            background: #3276B1;
            border-radius:0.75rem;
        }
        
      
        
        
        #map .mapboxgl-popup-content .data_block  label{      
        margin-right: 10px;    
        font-weight: 600;    
        display: inline-block;
        color:#000;
        }
        #map .mapboxgl-popup-content .data_block .left img{     
        width: 12px;     
        margin-right: 5px;    
        display: inline-block;
        }
        #map .mapboxgl-popup-content .data_block .right img{    
        width: 16px;    
        margin-right: 5px;    
        display: inline-block;
        }
        #map .mapboxgl-popup-content p{  

            line-height: 12px;
    text-align: justify;
    font-size: 10px;
        } 
        .mapboxgl-popup-anchor-top .mapboxgl-popup-tip
        {
              border-bottom-color: #000 !important;
        }
        #map .mapboxgl-popup-content a.btn_view_more {   
         border: 1px solid #83a4a4;   
         color: #83a4a4;   
         padding: 8px;    
         display: block;   
         max-width: 130px;   
         text-align: center;   
         margin: 15px auto 9px 117px;    
         font-weight: 400;    
         font-size: 16px;
         text-decoration: none;
         }
         #map .mapboxgl-popup-content a.btn_view_more:hover {    
         background: #83a4a4;    
         color: #000 !important;
         }
        #map .mapboxgl-popup-content a.btn_view_more {
        border: 1px solid #83a4a4;    
        color: #ffffff;    
        padding: 8px;    
        display: block;    
        max-width: 215px;    
        text-align: center;    
        margin: 0 auto 9px auto;    
        font-weight: 400;    
        font-size: 16px;
        background:#000000;
        }
        #map .mapboxgl-popup-content a.btn_view_more:hover {    
        background: #000000;    
        color: #ffffff !important;
        }
        #map .mapboxgl-popup-content .mapboxgl-popup-close-button
        {
          color: #ffffff;
          font-size: 22px;   
          top: 10px;   
          right: 15px;
        }
        #map .mapboxgl-popup-content .mapboxgl-popup-close-button:hover
        {
          color: #ffffff !important
        }
        
        .mapboxgl-ctrl-top-left, .mapboxgl-ctrl-top-right, .mapboxgl-ctrl-bottom-left, .mapboxgl-ctrl-bottom-right {
            position: absolute;
            pointer-events: none;
            z-index: 2;
            margin-top: 76px;
        }

        .fusion-sticky-header-wrapper{
        height: auto !important;
        }
        .fusion-header{
        display: none;
        }
        
        .fullscreen {
          width: 100%;
          height: 100%;
        }
        
        /*new style*/
        /* Base styles */
.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.navbar-brand img {
  width: 60%;
}

.navbar-toggler {
  display: none; /* Hide by default */
}

.collapse {
  display: flex;
  justify-content: flex-end;
}

/* Mapbox container styles */
.mapbox-container {
  position: relative;
  height: 100vh; /* Adjust as needed */
}

.search-bar-container {
    position: absolute;
    top: 32px;
    z-index: 1000;
    display: flex;
    width: 100%;
    left: 0;
    right:0;
    margin:0 auto;
}
.search-panel {
    max-width: 600px;
    margin: 0 auto;
    background: linear-gradient(90deg, rgba(217, 217, 217, 0.5) 0%, rgba(115, 115, 115, 0.5) 100%);
    padding: 8px;
    border-radius: 9px;
    backdrop-filter: blur(20px);
}
.width100percent{width:100%;}
.width70percent{width:70%;}
.mapboxgl-ctrl-top-right{bottom: 75px !important;
    right: 10px !important;}

@media (max-width: 767px){
    
    .mapboxgl-ctrl-top-right{
        bottom: 120px !important;
    right: 0px !important;
    }
}

.mapboxgl-ctrl-top-right .mapboxgl-ctrl {
        bottom: 0 !important;
        right: 0 !important;
        position: absolute;
    }

 .toggleweb {
        display: flex !important;
    }
    
    .togglemobile {
        display: none !important;
    }
    

/* Mobile view */
@media (max-width: 992px) {

#map .mapboxgl-popup-content h3 {
    /*text-transform: uppercase;*/
    text-align: center;
    margin-top: 5px;
    color: #000;
    font-size: 13px;
}

#map .mapboxgl-popup-content {
    background: #ffffff;
    font-weight: 300;
    /* font-size: 17px; */
    overflow: hidden;
    color: #000;
    width: 262px !important;
}


  .navbar-nav .nav-item {
    display: none; /* Hide navbar items */
  }

  .navbar-toggler {
    display: block; /* Show toggle button */
  }

  .navbar-brand {
    flex: 1; /* Ensure logo and toggle button are inline */
  }

  .navbar-brand img {
    width: 50%; /* Adjust logo size for mobile view */
  }

  /* Hide search bar and select option in navbar on mobile */
  .navbar-nav .nav-item {
    display: none;
  }

  /* Adjust search bar and select option in mapbox for mobile view */
  .search-bar-container {
        position: absolute;
        top: 32px;
        z-index: 1000;
        display: flex;
        gap: 0px;
        padding: 0px 0px;
        width: 95%;
    }

    
    .toggleweb {
        display: none !important;
    }
    
    .togglemobile {
        display: flex !important;
    }


  .selectcompanymobile {
    width: 100%; /* Full width for mobile view */
  }
}

@media (max-width: 576px) {
  .navbar-brand img {
    width: 40%; /* Adjust logo size for smaller mobile view */
  }
}


.logo_width {
    width: 64% !important; 
    display: inline-block;
}

.selectcss {
    background: linear-gradient(90deg, rgba(217, 217, 217, 0.5) 0%, rgba(115, 115, 115, 0.5) 100%);
    backdrop-filter: blur(20px);
    border-radius: 0.75rem;
    border-color:#36adad;
}

.borderradius {
    border-radius: 1.5rem;
}

.heightcss {
    height: 1.1em !important;
}

.marginleft {
    margin-left: auto !important;
}

.margintop {
    margin-top:10px
}

.marginright {
    margin-right: 1rem !important;
}

.marginleftsecond {
    margin-left: 1rem !important;
}



.menuwidth {
    max-width:1350px !important;
    left:65%;
}

.choices {
    position: relative;
    overflow: hidden;
    margin-bottom: 0px;
    border-radius: 0.75rem;
	border: 1px solid #36adad;
	box-shadow: 0 0 0 2px #36adad;
	font-size: 14px;
	font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
    background: linear-gradient(90deg, rgba(60, 60, 60, 0.75) 0%, rgba(25, 25, 25, 0.75) 100%);
    backdrop-filter: blur(20px);
}

/* Ensure inner container doesn't override the gradient */
.choices__inner {
    background: transparent !important;
}

/* Selected value (closed state) */
.choices__inner .choices__list--single .choices__item {
    color: #fff;
}

/* Selected option (open dropdown) */
.choices__list--dropdown .choices__item--selectable.is-selected,
.choices__list[aria-expanded] .choices__item--selectable.is-selected {
    color: #fff;
}

.is-flipped .choices__list--dropdown, .is-flipped .choices__list[aria-expanded] {
    top: 0 !important;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: -1px;
    border-radius: 0.75rem;
	height:300px !important;
}



.choices__list--dropdown, .choices__list[aria-expanded] {
    /*visibility: hidden;*/
    z-index: 1;
    position: absolute;
    width: 100%;
    background: linear-gradient(90deg, rgba(60, 60, 60, 0.85) 0%, rgba(25, 25, 25, 0.85) 100%);
    backdrop-filter: blur(20px);
    border: 1px solid #ddd;
    top: 100%;
    margin-top: -36px !important;
    border-radius: 0.75rem;
    overflow: hidden;
    word-break: break-all;
    will-change: visibility;
    color: #fff; /* default text color in dropdown */
}

/* Dropdown items text color */
.choices__list--dropdown .choices__item,
.choices__list[aria-expanded] .choices__item {
    color: #fff;
}

/* Highlighted (hover/keyboard) item */
.choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

/* Search input inside open dropdown */
.choices[data-type*=select-one] .choices__input {
    color: #fff;
}

.choices[data-type*=select-one] .choices__input::placeholder {
    color: rgba(255, 255, 255, 0.85);
}
.choices[data-type*=select-one] .choices__input {
    display: block;
    width: 100%;
    padding-left: 11px !important;
    border-bottom: 1px solid #ddd;
    background-color: #fff;
    margin: 0;
}

.choices__list--dropdown .choices__item--selectable[data-select-text], .choices__list[aria-expanded] .choices__item--selectable[data-select-text] {
    font-size:14px;
    font-family:'Helvetica Neue', Arial, Helvetica, sans-serif;
   
}

.is-open .choices__inner {
   border-radius: 0.75rem;
}

.is-focused .choices__inner, .is-open .choices__inner {
    box-shadow: 0 0 0 2px #36adad;
}

.mapboxgl-ctrl-top-right .mapboxgl-ctrl-group {
    display:flex /* Change from column to row */
}

.mapboxgl-ctrl-group button {
    margin-right: 4px; /* Optional: Add some spacing between buttons */
}

.nav-link {
    display: block;
    padding: 0.1rem 2rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.nav.nav-pills {
    background: rgba(0, 0, 0, 0);
    border-radius: 0.75rem;
    position: absolute;
    width: 180px;
    height: 25px;
	border:1px solid #2f466d;
	z-index:1000;
	bottom: 25px;
    right: 10px;
}

/* Desktop: move day/night pills to right of searchbox (top-right) */
@media (min-width: 992px) {
    #tabs-pricing {
        position: absolute;
        top: 32px;
        right: 10px;
        bottom: auto;
        left: auto;
    }
}
@media (max-width:767px){
    
    .nav.nav-pills{
    bottom:80px !important;
}
}
.nav.nav-pills .nav-link {
    z-index: 3;
    color: #ffffff;
    border-radius: 0.5rem;
    background-color: inherit;
}

.nav.nav-pills .nav-link.active {
    animation: 0.2s ease;
    box-shadow: 0px 1px 5px 1px #ddd;
    background-color: #fff !important;
    color: #000;
}

.nav.nav-pills .nav-link:hover:not(.active) {
    color: #ffffff;
}



.widthMap {
    width: 100%;
    height: auto;
    margin-top:-14px;
}

.compLogo {
    width:20%;
    margin-bottom:20px
}

.analyze-action {
  position: absolute;
  left: 30px;
  top: 140px;
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-radius: 5px;
  padding: 2px;
  cursor: pointer;
  z-index: 1001;
}

.company-action {
  position: absolute;
  left: 30px;
  top: 180px; /* placed under analyze-action */
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-radius: 5px;
  padding: 2px;
  cursor: pointer;
}

.company-action img {
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.company-action.active img {
  background: rgba(200, 200, 200, 0.95);
  border-radius: 50%;
  padding: 6px; /* increase hit area and create circular background */
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

.analyze-action img {
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.analyze-action.active img {
  background: rgba(200, 200, 200, 0.95);
  border-radius: 50%;
  padding: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

/* Background wrapper that visually includes analyze/company action buttons */
.actions-bg {
  position: absolute;
  left: 25px;
  top: 120px;
  width: 45px;          /* wide enough to cover both icons and padding */
  height: 110px;         /* tall enough to include both buttons */
  background: rgba(115, 115, 115, 0.85);
  border-radius: 20px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.view-action {
    position: absolute;
    right: 0;
    top: 90px;
    background: white;
    padding: 5px 10px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    width: 40px;                  /* collapsed width (enough for chevron) */
    overflow: hidden;             /* hides the text */
    white-space: nowrap;
    cursor: pointer;
    transition: width 0.3s ease;  /* smooth expand */
    z-index: 9999;
  }
  
  .view-action svg {
    flex-shrink: 0;               /* keep SVG always visible */
  }
  
  .view-action p {
    margin: 0;
    margin-left: 8px;
    opacity: 0;                   /* hidden initially */
    transition: opacity 0.2s ease;
  }
  
  .view-action:hover {
    width: 120px;                 /* expanded width */
  }
  
  .view-action:hover p {
    opacity: 1;                   /* fade in text */
  }
  
  .btn-toggle-overview {
    border-radius: 20px;
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 25px;
  }
.overview-container {
    position: absolute;
    left: 100px;
    top: 120px;
    background: linear-gradient(270deg, rgba(217, 217, 217, 0.5) 0%, rgba(115, 115, 115, 0.5) 100%);
    padding: 5px;
    border-radius: 9px;
    max-width: 450px;
    max-height: 700px;
    backdrop-filter: blur(20px);
    z-index: 9999;
}

.company-types-container {
    position: absolute;
    left: 100px;
    top: 120px;
    background: linear-gradient(90deg, rgba(217, 217, 217, 0.5) 0%, rgba(115, 115, 115, 0.5) 100%);
    padding: 5px;
    border-radius: 9px;
    max-width: 450px;
    max-height: 700px;
    backdrop-filter: blur(20px);
    z-index: 9999;
}

.overview-items thead {
  color: white;
  border: none;
  font-size: 15px;
}

.change-view {
  padding-left: 5px;
}

.leader-content th, .leader-content tr, .leader-content td {
  border: none;
}


.overview-actions {
    margin: auto;
    gap: 15px;
}

.overview-actions button {
  background: transparent;
    color: white;
    border: 1px solid white;
}

.overview-items{
    margin: auto;
    padding: 3px;
}



.overview-items span {
  font-size: 15px;
}

.overview-items p {
  margin-bottom: 0;
  font-size: 12px;
}

@media (max-width: 992px) {
    
    .togglecss {
        top: 553px;
        flex-wrap: nowrap;
        margin-bottom: 61px;
        left: -95px;
    }  
    
    .widthMap {
       width: 100%;
       height:auto;
       margin-top:10px;
    }
    
    .compLogo {
        width:50%;
        margin-bottom:20px
    }
   
}

/* Ensure background stays behind buttons on mobile and aligns with their responsive positions */
@media (max-width: 768px) {
  .actions-bg {
    left: 5px;
    top: 30px;
    width: 45px;          /* wide enough to cover both icons and padding */
    height: 100px;         /* tall enough to include both buttons */
  }
}

.btnModalClose {
    float: right;
    border: none;
    background: none;
    color: #3171a1;
    font-size: 22px;
}


.mapboxgl-ctrl-top-right .mapboxgl-ctrl {
    margin: 468px 10px 0 0;
    float: right;
}

.togglecss {
   
    bottom: 20px;
    right: 10px;
}

/* Notebooks and smaller desktops (1024px - 1280px) */
@media only screen and (min-width: 1024px) and (max-width: 1280px) {
   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
       margin: 470px 10px 0 0;  /* Adjust positioning */
    }
    
    .togglecss {
    	top: 551px;
    	left: 80px;
    }
}

/* Desktops (1281px - 1440px) */
@media only screen and (min-width: 1281px) and (max-width: 1440px) {
   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
       margin: 460px 10px 0 0;  /* Adjust positioning */
    }
    
    .togglecss {
        top: 551px;
        left: 80px;
    }
}

/* Large desktops (1441px and above) */
@media only screen and (min-width: 1441px) {
   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
       margin: 468px 10px 0 0;  /* Adjust positioning */
    }
    
    .togglecss {
    	top: 515px;
    	left: -95px;
    }
}

/*@media only screen and (max-width: 480px) {*/
  /* Styles for small smartphones */
/*   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {*/
/*       margin: 370px 10px 0 0;*/
/*        float: right;*/
/*    } */
    
/*    .togglecss {*/
/*    	top: 455px;*/
/*    	flex-wrap: nowrap;*/
/*    	margin-bottom: 61px;*/
/*    	left: -95px;*/
/*    }*/
/*}*/

/*@media only screen and (max-width: 768px) {*/
  /* Your mobile styles go here */
  
/*   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {*/
/*       margin: 430px 10px 0 0;*/
/*        float: right;*/
/*    } */
    
/*    .togglecss {*/
/*    	top: 515px;*/
/*    	flex-wrap: nowrap;*/
/*    	margin-bottom: 61px;*/
/*    	left: -95px;*/
/*    }*/
/*}*/

/*@media only screen and (min-width: 481px) and (max-width: 768px) {*/
  /* Styles for medium and large smartphones */
/*   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {*/
/*       margin: 370px 10px 0 0;*/
/*        float: right;*/
/*    } */
    
/*    .togglecss {*/
/*    	top: 455px;*/
/*    	flex-wrap: nowrap;*/
/*    	margin-bottom: 61px;*/
/*    	left: -95px;*/
/*    }*/
/*}*/

/*@media only screen and (min-width: 768px) and (max-width: 1024px) {*/
  /* Styles for medium and large smartphones */
/*   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {*/
/*       margin: 430px 10px 0 0;*/
/*        float: right;*/
/*    } */
    
/*    .togglecss {*/
/*    	top: 509px;*/
/*    	flex-wrap: nowrap;*/
/*    	margin-bottom: 61px;*/
/*    	left: -95px;*/
/*    }*/
/*}*/
.leader-content {
  font-size: 15px;
}
/* Small smartphones (max-width: 480px) */
@media only screen and (max-width: 480px) {
   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
       margin: 468px 10px 0 0;
    } 
    
    .togglecss {
    	top: 551px;
    	left: -95px;
    }

    .leader-content {
      font-size: 12px;
    }
    .overview-items span {
      font-size: 12px;
    }

    .overview-items thead {
      font-size: 12px;
    }
}



/* Mobile devices up to 768px */
@media only screen and (max-width: 768px) {
   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
       margin: 468px 10px 0 0;
    } 
    
    .togglecss {
    	top: 551px;
    	left: -95px;
    }

    .analyze-action {
      left: 10px;
      top: 45px;
    }

    .company-action {
      left: 10px;
      top: 85px;
    }

    .overview-container {
      top: 130px;
      max-width: 320px;
      left: 2%;
      right: 2%;
      overflow-y: scroll;
      margin: auto;
    }
}

.table > :not(caption) > * > * {
  padding: 0.2rem 0;
}

.mapboxgl-popup-anchor-bottom {
  z-index: 101;
}


/* Medium tablets (481px to 768px) */
@media only screen and (min-width: 481px) and (max-width: 768px) {
   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
       margin: 449px 10px 0 0;
    } 
    
    .togglecss {
    	top: 530px;
    	left: -95px;
    }
}

/* Tablets and smaller laptops (769px to 1024px) */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
   .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
       margin: 468px 10px 0 0;
    } 
    
    .togglecss {
    	top: 551px;
    	left: 80px;
    }
}

.mapboxgl-popup {
  z-index: 101 !important;
}

/* Force search input to have grey background matching overview panel */
.choices[data-type*=select-one] .choices__input {
    background: rgba(217, 217, 217, 0.5) !important;
    backdrop-filter: blur(20px);
    color: #fff;
}

.center-center{
  align-items: center;
  justify-content: center;
  display: flex
}