/* app/assets/stylesheets/admin_dashboard.css */

/* General Styles */
.admin-dashboard {
    font-family: Arial, sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
  }
  
  .admin-dashboard h1 {
    text-align: center;
    margin-bottom: 30px;
  }
  
  /* Flex Container for Charts */
  .admin-dashboard .charts-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px; /* Adjust as needed */
    gap: 20px; /* Space between charts */
    margin-bottom: 40px;
    flex-wrap: wrap; /* Allow wrapping on smaller screens */
  }
  
  /* Individual Chart Sections */
  .admin-dashboard .chart-section {
    flex: 1 1 45%; /* Grow and shrink with a base width of 45% */
    min-width: 300px; /* Minimum width to maintain readability */
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  /* Section Headers */
  .admin-dashboard .section-header {
    font-size: 1.2em;
    margin-bottom: 10px;
    text-align: center;
  }
  
  /* Canvas Styling */
  .admin-dashboard canvas {
    width: 100% !important; /* Ensure canvas takes full width of its container */
    height: 500px !important; /* Set desired height (e.g., 200px) */
    max-height: 300px; /* Optional: Maximum height to prevent excessive growth */
  }
  
  /* Table Styling */
  .admin-dashboard table {
    width: 100%;
    max-width: 1200px; /* Align with charts container */
    border-collapse: collapse;
    margin-bottom: 30px;
  }
  
  .admin-dashboard table th,
  .admin-dashboard table td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: center;
  }
  
  .admin-dashboard table th {
    background-color: #f2f2f2;
    font-weight: bold;
  }
  
  .admin-dashboard table td {
    white-space: nowrap;
  }
  
  /* Responsive Adjustments */
  @media (max-width: 768px) {
    .admin-dashboard .charts-container {
      flex-direction: column;
      align-items: center;
    }
  
    .admin-dashboard .chart-section {
      flex: 1 1 100%;
    }
  
    .admin-dashboard canvas {
      height: 250px !important; /* Adjust height for smaller screens if needed */
    }
  }
  
.institution-item.highlighted {
    background-color: #cce6ff; /* Light blue */
}

/* Hide latitude and longitude within institution items */
.institution-item .right-content p:nth-child(2),
.institution-item .right-content p:nth-child(3),
/* Hide latitude and longitude within oncologist items */
.oncologist-item .left-content p:nth-child(2),
.oncologist-item .left-content p:nth-child(3),
.oncologist-item .right-content p:nth-child(1),
.oncologist-item .right-content p:nth-child(2),
.oncologist-item .right-content p:nth-child(3) 
{
      display: none;
}

/* General styling */
body {
    font-family: Roboto, sans-serif;
    padding: 0;
    margin: 0;
}

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

.container {
    height: 100%;
    display: flex;
    flex-direction: column;
    padding-bottom: env(safe-area-inset-bottom);
}

.container {
    padding-bottom: env(safe-area-inset-bottom);
}

.banner {
    background-color: white; /* Green background color */
    padding: 5px; /* Padding around content */
    display: flex;
    align-items: center; /* Center vertically */
    border: 1px solid lightgrey; /* Add border */
    flex-direction: row;
}
  
.banner h1 {
    margin: 0; /* Remove default margin for h1 */
    color: #0d86ff;
}

.custom-recaptcha {
    /* placeholder for now */
}

.sections {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    padding: 5px; /* Padding around content */
    margin: 10px;
}

.section {
    margin-left: 10px;
    position: relative;
}

.section-button {
    background-color: white;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
    border-radius: 5px;
    z-index: 9999; /* Set a high z-index value */
    height: 50px;
    font-size: 14px;
}

.section-button:hover {
    text-decoration: underline;
}

.section-content {
    display: none;
    position: fixed;
    top: 100px; /* Adjust as needed */
    right: 0;
    width: 50%;
    background-color: #f9f9f9;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    z-index: 9999; /* Set a high z-index value */
    margin-right: 20px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Add subtle shadow */
    font-size: 14px; /* Adjust font size */
    line-height: 1.6; /* Adjust line height */
    color: #333; /* Text color */
    overflow-y: auto;
    max-height: calc(100vh - 175px); /* Set maximum height to 100vh minus header height and some padding */
}

.content {
    display: flex;
    flex-direction: row;
    flex: 1;
    overflow-y: auto;
}

.left-overall {
    flex: 1;
    display: flex;
    overflow-y: auto;
    position: relative;
    z-index: 3;
    background-color: white;
}

.right-overall {
    flex: 3;
    display: flex;
    flex-direction: row;
}

.map-container {
    flex: 3;
    position: relative;
    z-index: 2;
}

.overlay-container {
    position: absolute; /* Or fixed if required */
    top: 0;
    left: 0;
    width: 100%;
    height: 0; /* Set height to 0 when not visible */
    display: none; /* Hide it unless necessary */
    z-index: 10; /* Ensure it's layered above other content */
}

.blank-space {
    flex: 3;
    z-index: 1;
}

.blank-space * {
    pointer-events: none; /* Make children of the container transparent to pointer events */
}

/* Map styling */
#map {
    width: 100%;
    height: 100%;
}

/* Filter container styling */
.filters {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); /* Add shadow with blur radius of 10px and color with 0.1 opacity */
    height: 50px;
    border-radius: 5px;
}

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

.toggle-button {
    background-color: #f5f5f5;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
    height: 30px; /* Adjust the height as needed */
    display: inline-block;
    border-radius: 5px;
}

.toggle-button.active {
    background-color: #989898; /* Change to your desired active background color */
    color: white;
}
  
.toggle-button:not(:last-child) {
    margin-right: 5px;
}

/* Title styling */
h1, h2 {
    text-align: center;
}

h2 {
    font-size: 20px;
}

/* Rounded corners */
.rounded {
    border-radius: 8px;
}

.title {
    margin: 0; /* Remove default margin */
    font-size: 24px; /* Adjust font size as needed */
    padding-left: 10px;
    padding-right: 60px;
    position: relative;
}

.title-link {
    text-decoration: none; /* Remove underline */
    color: inherit;        /* Use the parent element's color */
}

.beta-tag {
    display: inline-block;
    background-color: #4da6ff; /* Orange color for Beta tag */
    color: white;
    padding: 2px 6px;
    font-size: 0.4em;
    margin-left: 10px;
    border-radius: 3px;
    cursor: pointer;
    position: absolute; /* Needed for positioning the tooltip */
    top: 0;
}
  
.beta-tag::after {
    content: 'This application is currently in beta. Our goal is to help users find the right oncologist, but please note that the app is still under development and has not been fully tested. As a beta user, your experience is valuable to us. You may encounter some issues or incomplete features as we continue to refine the app. Your feedback will play a crucial role in helping us improve the service. Thank you for your understanding and support!';
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    background-color: #f9f9f9;
    color: rgb(117, 117, 117);
    padding: 8px;
    width: 400px;
    font-size: 14px; /* Adjust font size */
    font-weight: normal;
    border-radius: 5px;
    z-index: 10;
    text-align: left; /* Left align text */
    white-space: normal; /* Allows the text to wrap naturally */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Adds a subtle shadow for better visibility */
}
  
.beta-tag:hover::after {
    display: block;
}

.search-button {
    cursor: pointer;
    background-color: #0d86ff;
    color: white;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    display: flex;
    align-items: center;
    margin: 0;
    margin-right: 0;
    margin-left: 10px;
    border: none;
    width: 60px;
    height: 50px;
}

.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 100; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0, 0, 0); /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
  }
  
  .modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
  }
  
  .close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
  }
  
  .close:hover,
  .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
  }

.search-button:hover {
    background-color: #4da6ff; /* Lighter blue background color on hover */
}

.search-button img {
    width: 25px; /* Adjust the width as needed */
    height: 25px; /* Adjust the height as needed */
    margin: 0 auto;
    fill: #4da6ff;
}

.search-button:hover img {
    content: url(/assets/spyglass-light-73ec99429b1953eed3e98d24f47545c7c62a3e80b721526b3c3c4ee22d323ac5.png);
}

/* Adjust the height of the text field and select dropdown */
#zip_code, #search_radius, #cancer_type {
    height: 30px; /* Adjust the height as needed */
    border: none;
    border-radius: 0;
    font-size: 14px; /* Adjust font size to maintain consistency */
    box-sizing: border-box; /* Ensure padding and border are included in the element's total width and height */
    margin-left: 5px;
    margin-right: 5px;
    padding-left: 10px;
    padding-right: 10px;
    background-color: white;
    box-shadow: none; /* Remove mobile-specific shadows */
}

/* Target the select elements within #search_radius and #cancer_type */
#search_radius option, #cancer_type option {
    background-color: white !important; /* Set background color to white */
}

#search_radius, #cancer_type {
    border-left: 1px solid #ccc; /* Add border to maintain consistent appearance */
}

.zip-validation-dialog {
    display: none;
    padding: 10px;
    background-color: #ff9999; /* Red background */
    color: white; /* White text */
    border-radius: 5px;
  }
  
/* Additional styles to make the dialog box look nice */
.zip-validation-dialog p {
    margin: 0;
}

/* Error Message Styling */
.error-message {
    background-color: #ffe6e6; /* Light red background */
    border-left: 6px solid #ff4d4d; /* Darker red border on the left */
    margin-top: 20px;
    padding: 10px 16px;
    color: #cc0000; /* Dark red text */
    border-radius: 4px;
  }
  
  /* No Results Message Styling */
  .no-results-message {
    background-color: #ffffe6; /* Light yellow background */
    border-left: 6px solid #ffcc00; /* Orange border on the left */
    margin-top: 20px;
    padding: 10px 16px;
    color: #996600; /* Dark yellow text */
    border-radius: 4px;
  }
  
  .no-results-message ul {
    margin-top: 10px;
    padding-left: 20px;
    list-style-type: disc;
  }
  
  /* Ensure responsiveness */
  @media (max-width: 768px) {
    .error-message, .no-results-message {
      padding: 8px 12px;
      font-size: 14px;
    }
}

.missing-inputs-dialog {
    display: none;
    padding: 10px;
    background-color: #ff9999; /* Red background */
    color: white; /* White text */
    border-radius: 5px;
  }
  
/* Additional styles to make the dialog box look nice */
.missing-inputs-dialog p {
    margin: 0;
}

.zip-validation-dialog.hide {
    display: none;
}
  
.institution-list {
    list-style-type: none; /* Remove default list bullet points */
    overflow-y: auto;
    flex: 1;
    position: relative;
}

.institution-list h2 {
    background-color: white;
    padding: 15px;
    margin: 0;
}

.institution-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.sorting-options {
    padding: 15px;
    background-color: white;
    display: flex;
    align-items: center;
}

#sort-institution, #sort-oncologist {
    border: none;
    margin-left: 5px;
    background-color: white;
}

.oncologist-list {
    overflow-y: auto;
    flex: 1;
    z-index: 3;
}

.oncologist-list h2 {
    background-color: white;
    padding: 15px;
    margin: 0;
}

.oncologist-title {
    display: flex;
    justify-content: space-between;
    background-color: white;
}
  
.institution-item {
    background-color: white; /* Background color for each item */
    border-top: 1px solid lightgray;
    padding: 10px; /* Add padding to each item */
    font-size: 12px;
    line-height: 1;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
  
.institution-item h3 {
    margin: 0; /* Remove default margin */
    width: 45%;
}

/* Adjust styling of specific content blocks */
.institution-item .left-content {
    text-align: left; /* Align left */
    flex: 1.5;
}

.institution-item .right-content {
    text-align: right; /* Align right */
    flex: 1;
}

.institution-item p {
    margin-top: 5px;
    margin-bottom: 5px;
}

.highlight-nci-center {
    background-color: #d9ead3; /* Light green color */
}

.oncologist-item {
    background-color: white; /* Background color for each item */
    border-top: 1px solid lightgray;
    padding: 10px; /* Add padding to each item */
    font-size: 12px;
    line-height: 1; /* Adjust line height */
    display: flex;
    flex-direction: column;
}

/* Apply hover effect to institution items */
.institution-item:hover {
    background-color: #e0e0e0; /* Light grey background color on hover */
    cursor: pointer; /* Change cursor to pointer on hover */
}

.oncologist-item p {
    margin: 5px 0; /* Adjust margin for each paragraph */
    flex: 1; /* Make paragraphs take equal space */
}

.oncologist-item .top-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

/* Adjustments for specific content blocks */
.oncologist-item .left-content {
    text-align: left; /* Align left */
    margin-right: 10px; /* Add margin to separate from right content */
}

.oncologist-item .right-content {
    text-align: right; /* Align right */
}

/* Apply styling to link */
.oncologist-item a {
    color: #007bff; /* Link color */
    text-decoration: none; /* Remove underline */
}

.oncologist-item .bottom-content {
    margin-top: auto; /* Add some top margin to separate it from the rest of the content */
    color: #333; /* Adjust text color */
    text-align: center;
}
  


/* Dynamic classes below */

.banner-center {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex: 1;
    padding-bottom: 25vh;
}

.banner-unverified {
    display: none;
}

.title-center {
    font-size: 60px; /* Adjust font size as needed */
    padding-bottom: 10px;
}

.content-hide {
    display: none;
}

.recaptcha-verified {
    display: none;
}

/* Overlay styles */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.overlay-content {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    position: relative;
}

.spinner {
    border: 8px solid #f3f3f3; /* Light grey */
    border-top: 8px solid #0d86ff; /* Blue */
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
    margin: 0 auto;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.progress-bar-container {
    width: 100%;
    background-color: #f3f3f3;
    border-radius: 4px;
    margin: 20px 0;
}

.progress-bar {
    width: 0;
    height: 8px;
    background-color: #0d86ff;
    border-radius: 4px;
    transition: width 0.5s;
}

.overlay button {
    margin-top: 20px;
}

/* Banner toggle button */
.banner-toggle {
    background: none;
    border: none;
    font-size: 16px;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1001;
    display: none; /* Hide by default */
    align-items: center;
    color: #333;
    padding: 5px;
}

.banner-toggle .toggle-icon {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #333; /* Downward arrow */
    transition: transform 0.3s;
    margin-right: 5px;
    transform: rotate(0deg); /* Initial state */
}

.banner.collapsed .toggle-icon {
    transform: rotate(0deg); /* Downward arrow */
}

.banner:not(.collapsed) .toggle-icon {
    transform: rotate(180deg); /* Upward arrow */
}

.banner-toggle .toggle-text {
    font-size: 12px;
    display: inline-block;
    visibility: visible;
}

.banner.collapsed .filters,
.banner.collapsed .terms-container {
    display: none; /* Hide content when collapsed */
}

@media (max-height: 650px) {
    .banner-center {
        padding-bottom: 0; /* Remove bottom padding */
    }
}

@media (max-height: 375px) {
    .title {
        font-size: 40px;    /* Reduce font size to 40px */
    }

    /* Override flex properties to prevent .banner-center from growing */
    .banner-center {
        flex: 0 0 auto;
        margin-top: auto; /* Pushes it to the bottom */
        padding-bottom: 30px; /* Remove bottom padding */
    }

    /* Ensure .content fills available space */
    .content {
        flex: 1 0 auto;
    }

}

/* 1535PX WIDTH */

@media (max-width: 1535px) {
    body.map-visible .sections {
        display: none;
    }
}

/* 1335PX WIDTH */

@media (max-width: 1335px) {
    body.map-visible .terms-container {
        display: none;
    }
}

/* 1170PX WIDTH */

@media (max-width: 1170px) {

    .institution-title, .oncologist-title {
        display: flex;
        flex-direction: column; /* Stack items vertically */
        align-items: flex-start; /* Align items to the start (left-aligned) */
        padding: 10px 0; /* Add padding for spacing */
    }

    .sorting-options {
        margin-top: 10px; /* Add some spacing below the title */
        width: 100%; /* Ensure it takes full width */
    }

    .sorting-options label {
        display: block; /* Move label to its own line */
        margin-bottom: 5px; /* Add spacing below label */
    }

    /* Make the container a flex column */
    .container {
      display: flex;
      flex-direction: column;
      height: 100%;
    }
  
    /* Adjust the content area to flex column */
    .content {
      display: flex;
      flex-direction: column;
      flex: 1 1 auto;
      overflow: visible;
    }
  
    /* Map container adjustments */
    .right-overall {
      order: 1;
      flex: 1 1 auto;
      display: flex;
      flex-direction: column;
      overflow: visible;
    }
  
    .map-container {
      flex: 1 1 auto;
      position: relative;
      overflow: hidden;
    }
  
    #map {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
    }
  
    /* Institution list adjustments */
    .left-overall {
      order: 2;
      flex: none;
      width: 100%;
      background-color: white;
    }
  
    .institution-list {
        display: flex;  
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        max-height: 15vh; /* Adjust as needed */
        min-height: 125px;
        flex-direction: row;
    }

    .institution-item,
    .oncologist-item {
        flex: 0 0 auto;
        width: 300px; /* Make the item wider when at the bottom */
        padding-right: 15px; /* Add spacing between items */
        box-sizing: border-box; /* Include padding and borders in width */
    }

    .institution-item, .oncologist-item {
        border-top: none; /* Remove the top border */
        border-bottom: none; /* Remove the bottom border */
        border-left: 1px solid lightgray; /* Add left border */
        box-sizing: border-box; /* Include padding and borders in width */
    }

    .right-content {
        white-space: nowrap;
    }
  
    /* Oncologist list adjustments */
    .oncologist-list {
      display: none; /* Hidden by default */
      order: 3;
    }

    .oncologist-list {
        display: flex;  
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        max-height: 15vh; /* Adjust as needed */
        min-height: 125px;
        flex-direction: row;
    }
}

/* 935PX WIDTH */

@media (max-width: 935px) {
    body.map-visible .banner {
        flex-direction: column;
        align-items: center;
    }
    
    body.map-visible .filters {
        flex-direction: column;
        align-items: stretch;
        margin: 10px; /* Add horizontal padding */
        width: 100%;
        height: auto;
    }

    body.map-visible .filter-group {
        width: 100%; /* Make filter groups take full width */
        display: flex;
        align-items: center;
    }

    body.map-visible #zip_code, #search_radius, #cancer_type {
        width: 90%;
        margin-left: 0;
        margin-right: 0;
        align-items: center;
    }

    body.map-visible .search-button {
        width: 100%;
        margin-left: 0;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 5px;
    }

    /* Remove vertical borders from #search_radius and #cancer_type */
    body.map-visible #search_radius, #cancer_type {
        border-left: none;
        border-top: 1px solid #ccc;
    }

    body.map-visible #zip_code, #search_radius, #cancer_type {
        height: 40px;
    }

    body.map-visible .title {
        font-size: 24px;
    }

    body.map-visible .beta-tag {
        font-size: 0.3em;
    }

    body.map-visible .section-content {
        width: 70%;
    }

    body.map-visible .banner-toggle {
        display: flex;
    }

    body.map-visible .banner {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1000;
    }

    body.map-visible .content {
        margin-top: 60px; /* Adjust based on the banner's expanded height */
    }

    body.map-visible .banner.collapsed + .content {
        margin-top: 30px; /* Adjust based on the banner's collapsed height */
    }
}

/* 768PX WIDTH */

@media (max-width: 768px) {
    .banner {
        flex-direction: column;
        align-items: center;
    }
    
    .filters {
        flex-direction: column;
        align-items: stretch;
        margin: 10px; /* Add horizontal padding */
        width: 100%;
        height: auto;
    }

    .filter-group {
        width: 100%; /* Make filter groups take full width */
        display: flex;
        align-items: center;
    }

    #zip_code, #search_radius, #cancer_type {
        width: 90%;
        margin-left: 0;
        margin-right: 0;
        align-items: center;
    }

    .search-button {
        width: 100%;
        margin-left: 0;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 5px;
    }

    /* Remove vertical borders from #search_radius and #cancer_type */
    #search_radius, #cancer_type {
        border-left: none;
        border-top: 1px solid #ccc;
    }

    #zip_code, #search_radius, #cancer_type {
        height: 40px;
    }

    .title {
        font-size: 50px;
    }

    .beta-tag {
        font-size: 0.3em;
    }

    .section-content {
        width: 70%;
    }
}
/* required styles */

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg {
	max-width: none !important;
	max-height: none !important;
	}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	width: auto;
	padding: 0;
	}

.leaflet-container img.leaflet-tile {
	/* See: https://bugs.chromium.org/p/chromium/issues/detail?id=600120 */
	mix-blend-mode: plus-lighter;
}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
svg.leaflet-zoom-animated {
	will-change: transform;
}

.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline-offset: 1px;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1.5;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(/assets/images/layers-0e356f4d554162eb71f127f50460dbc55d405027189ebe90b20729ef18d13d36.png);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(/assets/images/layers-2x-ba8fa601e413b14db27db07285ade3951721e02244c31523284ab2d1ed53c3dc.png);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	font-size: 13px;
	font-size: 1.08333em;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */
	background-image: url(https://unpkg.com/leaflet@1.7.1/dist/images/marker-icon.png);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.8);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	line-height: 1.4;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
	text-decoration: underline;
	}
.leaflet-attribution-flag {
	display: inline !important;
	vertical-align: baseline !important;
	width: 1em;
	height: 0.6669em;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	white-space: nowrap;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	background: rgba(255, 255, 255, 0.8);
	text-shadow: 1px 1px #fff;
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 24px 13px 20px;
	line-height: 1.3;
	font-size: 13px;
	font-size: 1.08333em;
	min-height: 1px;
	}
.leaflet-popup-content p {
	margin: 17px 0;
	margin: 1.3em 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-top: -1px;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;
	pointer-events: auto;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	text-align: center;
	width: 24px;
	height: 24px;
	font: 16px/24px Tahoma, Verdana, sans-serif;
	color: #757575;
	text-decoration: none;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
	color: #585858;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	-ms-zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-interactive {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}

/* Printing */

@media print {
	/* Prevent printers from removing background-images of controls. */
	.leaflet-control {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
		}
	}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */