/* Heat Trends location styles: map, geocode, overlays, location layout */

/* Map shell */

#plot-map-card {
    position: relative;
}
#plot-map {
    height: clamp(532px, 68.4vh, 931px);
    width: 100%;
    border-radius: var(--plot-radius-sm);
    border: 1px solid var(--bs-border-color);
    overflow: hidden;
    background: var(--plot-card-bg-subtle);
}
.plot-map-mask {
    position: absolute;
    inset: 0;
    z-index: 60;

    display: none;
    align-items: center;
    justify-content: center;

    background: rgba(255, 255, 255, 0.9);
}
.plot-map-mask .inner {
    text-align: center;
    padding: 0.75rem 1rem;
    background: var(--plot-card-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--plot-radius-md);
    box-shadow: var(--plot-panel-shadow-md);
}
.plot-map-legend,
.heat-trends-temp-legend {
    position: absolute;
    bottom: 0.75rem;
    z-index: 10;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--plot-radius-sm);
    box-shadow: var(--plot-panel-shadow-sm);
    padding: 0.5rem 0.75rem;
}
.plot-map-legend {
    left: 0.75rem;
    min-width: 200px;
}
.plot-map-legend .swatch {
    width: 14px;
    height: 14px;
    border-radius: 3px;
    border: 1px solid var(--bs-border-color);
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.5rem;
}
.plot-map-legend .legend-title {
    font-weight: 600;
}
.heat-trends-temp-legend {
    right: 0.75rem;
    min-width: 220px;
}
.plot-map-panel {
    position: absolute;
    z-index: 40;
    max-width: min(320px, 22vw);
    min-width: 290px;
}
.plot-map-panel .section-card {
    border-radius: var(--plot-radius-md);
    box-shadow: var(--plot-panel-shadow-lg);
}
#plot-geocode-panel {
    position: absolute;
    left: 3.25rem;
    top: 0.75rem;
    z-index: 45;
    max-width: min(380px, 42vw);
}
.plot-map-panel-right {
    right: 0.25rem;
    top: 0.25rem;
    max-width: min(300px, 18vw);
    overflow: visible;
}
#plot-geocode-panel .plot-results {
    max-height: clamp(200px, 35vh, 520px);
    overflow: auto;
}
#plot-pane-overlays .overlay-group {
    padding: 0.1rem 0 0 0;
    font-size: 0.95rem;
    border: 0;
    border-radius: 0;
    background: transparent;
}
#plot-pane-overlays .dock-section-title,
#plot-pane-overlays .overlay-group .fw-semibold {
    font-weight: 600;
    font-size: 0.90rem;
    line-height: 1.25;
    margin-bottom: 0.35rem;
    margin-top: 0.35rem;
    text-decoration: none;
}
#plot-identify-cursor, .heat-trends-identify-cursor {
    position: absolute;
    z-index: 70;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.35);
    background: rgba(255, 255, 255, 0.95);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.10);
    pointer-events: none;
}
#plot-identify-panel, .heat-trends-identify-panel {
    position: absolute;
    z-index: 75;
    min-width: 260px;
    max-width: 360px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--plot-radius-md);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.18);
    padding: 0.75rem 0.75rem;
}

/* Search controls */

.plot-geocode-bar .form-control {
    border-radius: 0.75rem;
}
.plot-geocode-bar .input-group-text {
    border-radius: 0.75rem 0 0 0.75rem;
}
.plot-geocode-bar .btn {
    border-radius: 0 0.75rem 0.75rem 0;
}
.plot-geocode-results {
    margin-top: 0.25rem;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--plot-radius-md);
    overflow: hidden;
    box-shadow: var(--plot-panel-shadow-lg);
    max-height: 260px;
    overflow-y: auto;
}
.heat-trends-topbar.heat-trends-emphasis {
    box-shadow: 0 0 0 4px rgba(31, 166, 103, 0.46);
    border-color: rgba(25, 135, 84, 0.35);
}
.section-card.heat-trends-emphasis, #plot-area-type-select.heat-trends-emphasis {
    box-shadow: 0 0 0 4px rgba(31, 166, 103, 0.46);
    border-color: rgba(25, 135, 84, 0.35);
    border-radius: 0.75rem;
}
.heat-trends-geocode-group .input-group-text i,
.heat-trends-clear-btn i {
    color: #6c757d;
}
.heat-trends-clear-btn {
    background: var(--bs-light);
    border: 1px solid var(--bs-border-color);
    border-left: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.75rem;
}
.heat-trends-clear-btn:hover, .heat-trends-clear-btn:focus {
    background: #e9ecef;
}
.heat-trends-clear-btn:focus {
    box-shadow: none;
}

/* Overlays */

#plot-location-pane .area-type-label {
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 0.12em;
    text-decoration-thickness: 1.5px;
}
.plot-legend-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
#plot-pane-overlays .plot-legend-row {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0.375rem 0;
    border-bottom: 1px dashed var(--bs-border-color);
    font-size: inherit;
}
#plot-pane-overlays .plot-legend-row:last-child {
    border-bottom: 0;
}
#plot-pane-overlays .plot-legend-row.keep-right-inline {
    flex-wrap: nowrap !important;
    gap: 0.5rem;
}
#plot-pane-overlays .plot-legend-left {
    display: flex;
    align-items: center;
    gap: 0;
    flex: 1 1 auto;
    min-width: 0;
}
#plot-pane-overlays .plot-legend-row.keep-right-inline > .plot-legend-left {
    flex: 1 1 0%;
    min-width: 0;
}
#plot-pane-overlays .plot-legend-left .form-check-input {
    margin-right: 0.5rem;
}
#plot-pane-overlays .plot-legend-row.keep-right-inline .form-check-label {
    display: inline;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
}
#plot-pane-overlays .plot-legend-right {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    flex: 0 0 auto;
}
#plot-pane-overlays .plot-legend-row.keep-right-inline > .plot-legend-right {
    flex: 0 0 auto;
    align-self: flex-start;
}
.plot-layer-info {
    color: rgba(0, 0, 0, 0.55);
    text-decoration: none;
}
#plot-pane-overlays .plot-layer-info .bi-info-circle {
    font-size: 0.95rem;
    line-height: 1;
}
#plot-pane-overlays .layer-swatch {
    width: 38px;
    height: 14px;
    border-radius: 0;
    border: 0;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.18);
    display: inline-block;
    box-sizing: border-box;
    overflow: hidden;
    margin-top: 0.25rem;
}
.swatch-tree {
    background: linear-gradient(90deg, rgba(232, 245, 233, 0.45), rgba(27, 94, 32, 1));
}
.swatch-plantable {
    background: linear-gradient(90deg, rgba(227, 242, 253, 0.65), rgba(13, 71, 161, 1));
}
.swatch-imperv {
    background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 1),
    rgba(45, 0, 75, 1),
    rgba(190, 70, 50, 1),
    rgba(245, 140, 30, 1),
    rgba(252, 255, 100, 1)
    );
}
.swatch-nlcd {
    background: linear-gradient(
    90deg,
    #466b9f 0% 5%,
    #d1def8 5% 10%,
    #dec5c5 10% 15%,
    #d99282 15% 20%,
    #eb0000 20% 25%,
    #ab0000 25% 30%,
    #b3ac9f 30% 35%,
    #68ab5f 35% 40%,
    #1c5f2c 40% 45%,
    #b5c58f 45% 50%,
    #af963c 50% 55%,
    #ccb879 55% 60%,
    #dfdfc2 60% 65%,
    #d1d182 65% 70%,
    #a3cc51 70% 75%,
    #82ba9e 75% 80%,
    #dcd939 80% 85%,
    #ab6c28 85% 90%,
    #b8d9eb 90% 95%,
    #6c9fb8 95% 100%
    );
}

.swatch-temp-tair {
    background: linear-gradient(
    90deg,
    #f8fe69 0% 20%,
    #dcae19 20% 40%,
    #bc6404 40% 60%,
    #901a07 60% 80%,
    #400505 80% 100%
    );
}
.swatch-temp-hi {
    background: linear-gradient(
    90deg,
    #fff1aa 0% 20%,
    #ffd200 20% 40%,
    #ff6400 40% 60%,
    #990000 60% 80%,
    #000000 80% 100%
    );
}
.swatch-temp-wbgt {
    background: linear-gradient(
        90deg,
        #000083 0% 20%,
        #0288cc 20% 40%,
        #83ff7f 40% 60%,
        #fd7d00 60% 80%,
        #800000 80% 100%
    );
}
.swatch-nonwht {
    background: linear-gradient(
    90deg,
    #f3e5f5 0% 20%,
    #e1bee7 20% 40%,
    #ce93d8 40% 60%,
    #ab47bc 60% 80%,
    #6a1b9a 80% 100%
    );
}
.swatch-lowinc {
    background: linear-gradient(
    90deg,
    #fff3e0 0% 20%,
    #ffe0b2 20% 40%,
    #ffb74d 40% 60%,
    #fb8c00 60% 80%,
    #e65100 80% 100%
    );
}
.swatch-elderly {
    background: linear-gradient(
    90deg,
    #e3f2fd 0% 20%,
    #bbdefb 20% 40%,
    #64b5f6 40% 60%,
    #1e88e5 60% 80%,
    #0d47a1 80% 100%
    );
}
.swatch-disability {
    background: linear-gradient(
    90deg,
    #efebe9 0% 20%,
    #d7ccc8 20% 40%,
    #a1887f 40% 60%,
    #6d4c41 60% 80%,
    #3e2723 80% 100%
    );
}
.swatch-hvi {
    background: linear-gradient(
    90deg,
    #ffebeb 0% 20%,
    #ffb7b7 20% 40%,
    #ff7171 40% 60%,
    #f83a3a 60% 80%,
    #da0000 80% 100%
    );
}
.swatch-hvi-nyc {
    background: linear-gradient(
    90deg,
    #ffffff 0% 20%,
    #bfbfbf 20% 40%,
    #858585 40% 60%,
    #4e4e4e 60% 80%,
    #1b1b1b 80% 100%
    );
}
.swatch-hvi-plantability-frequency {
    background: linear-gradient(90deg,#2e7d32 0.00% 20.00%,#a5d6a7 20.00% 40.00%,#fff176 40.00% 60.00%,#ff9800 60.00% 80.00%,#7f0000 80.00% 100.00%);
}
.mapper-layer-info-modal {
    position: absolute;
    z-index: 1100;
    width: min(360px, calc(100vw - 1rem));
    max-height: min(70vh, 520px);
    overflow: auto;
    padding: .6rem .7rem .7rem .7rem;
    border-radius: .5rem;
    border: 1px solid rgba(0, 0, 0, 0.16);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 .4rem 1rem rgba(0, 0, 0, 0.20);
}
.mapper-layer-info-modal[hidden] {
    display: none !important;
}
.mapper-layer-info-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .45rem;
}
.mapper-layer-info-title {
    font-weight: 600;
    font-size: .92rem;
    line-height: 1.2;
}
.mapper-layer-info-close {
    margin-top: -.1rem;
    flex: 0 0 auto;
}
.mapper-layer-info-scale {
    margin-bottom: .55rem;
}
.mapper-layer-info-scale-bar {
    width: 100%;
    height: 14px;
    border: 1px solid #9ea7b1;
    border-radius: .22rem;
    background-color: #ffffff;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
}
.mapper-layer-info-scale-bar::before {
    content: "";
    position: absolute;
    inset: 1px;
    border-radius: 1px;
    background: var(--mapper-layer-info-fill, linear-gradient(90deg, rgba(0, 0, 0, 0.14), rgba(0, 0, 0, 0.65)));
}
.mapper-layer-info-scale-ticks {
    position: relative;
    height: 8px;
    margin-top: 1px;
}
.mapper-layer-info-scale-tick {
    position: absolute;
    top: 0;
    width: 1px;
    height: 8px;
    background: rgba(0, 0, 0, 0.66);
}
.mapper-layer-info-scale-tick.is-0 {
    left: 0;
}
.mapper-layer-info-scale-tick.is-50 {
    left: 50%;
    transform: translateX(-0.5px);
}
.mapper-layer-info-scale-tick.is-100 {
    right: 0;
}
.mapper-layer-info-scale-labels {
    display: flex;
    justify-content: space-between;
    font-size: .72rem;
    color: rgba(0, 0, 0, 0.66);
    line-height: 1;
}
.mapper-layer-info-scale-ticks.is-dynamic {
    position: relative;
    height: 8px;
}
.mapper-layer-info-scale-tick-dyn {
    position: absolute;
    top: 0;
    width: 1px;
    height: 8px;
    background: rgba(0, 0, 0, 0.66);
    transform: translateX(-0.5px);
}
.mapper-layer-info-scale-labels.is-dynamic {
    position: relative;
    display: block;
    height: 16px;
}
.mapper-layer-info-scale-label-dyn {
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    font-size: .7rem;
    color: rgba(0, 0, 0, 0.72);
    line-height: 1.1;
    white-space: nowrap;
}
.mapper-layer-info-scale-label-dyn.is-start {
    transform: translateX(0);
}
.mapper-layer-info-scale-label-dyn.is-end {
    transform: translateX(-100%);
}
.mapper-layer-info-source {
    font-size: .78rem;
    line-height: 1.25;
    color: rgba(0, 0, 0, 0.82);
}
.mapper-layer-info-note {
    font-size: .76rem;
    color: rgba(0, 0, 0, 0.62);
    margin-bottom: .5rem;
}
.mapper-layer-info-source a {
    color: #0d6efd;
    text-decoration: underline;
}
.mapper-layer-info-nlcd-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: .24rem;
    margin: .2rem 0 .55rem 0;
}
.mapper-layer-info-nlcd-item {
    display: flex;
    align-items: center;
    gap: .4rem;
    min-width: 0;
}
.mapper-layer-info-nlcd-chip {
    width: 14px;
    height: 14px;
    border-radius: 2px;
    border: 1px solid rgba(0, 0, 0, 0.24);
    flex: 0 0 auto;
}
.mapper-layer-info-nlcd-label {
    font-size: .76rem;
    line-height: 1.2;
}
.plot-nlcd-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 12px;
    margin-top: 12px;
}
.plot-nlcd-item {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.plot-nlcd-chip {
    width: 14px;
    height: 14px;
    border: 1px solid rgba(0, 0, 0, 0.18);
    flex: 0 0 auto;
}
.plot-nlcd-label {
    font-size: 13px;
    color: rgba(0, 0, 0, 0.85);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#plot-card-selection {
    max-height: min(630px, 36vw);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
#plot-card-selection .card-header {
    padding-bottom: 0;
}
#plot-card-selection .card-body {
    padding-top: 0.5rem;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
}
@media (max-width: 991.98px) {
    #plot-geocode-panel {
        position: absolute;
        left: 2.85rem;
        right: auto;
        top: 0.1rem;
        width: min(320px, calc(100% - 3.6rem));
        max-width: min(320px, calc(100% - 3.6rem));
        margin-bottom: 0;
    }
    #plot-legend-left {
        position: absolute;
        left: 0.75rem;
        top: 24.75rem;
        bottom: auto;
        margin-top: 0;
        width: auto;
        max-width: 100%;
    }
    .plot-map-panel {
        position: static;
        max-width: 100%;
        min-width: 0;
        margin-top: 0.75rem;
    }
    #plot-map {
        height: clamp(361px, 52.25vh, 684px);
    }
    #plot-card-selection {
        max-height: none !important;
    }
}
#heat-trends-location-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}
#heat-trends-location-layout > .heat-trends-location-main, #heat-trends-location-layout > .heat-trends-location-side {
    min-width: 0;
}
#heat-trends-location-layout > .heat-trends-info-card {
    grid-column: 1 / -1;
    margin-bottom: 0;
}
#heat-trends-location-layout .heat-trends-location-main {
    min-width: 0;
}
#heat-trends-location-layout .heat-trends-location-side {
    --plot-location-table-max-height-default: 40vh;
    --plot-location-table-max-height-expanded: 62vh;
    --plot-location-table-max-height-census: 50vh;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive {
    width: 100%;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    position: relative;
    background: #fff;
}
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table,
#heat-trends-location-layout .heat-trends-location-side .plot-heat-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table th,
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table td,
#heat-trends-location-layout .heat-trends-location-side .plot-heat-table th,
#heat-trends-location-layout .heat-trends-location-side .plot-heat-table td {
    box-sizing: border-box;
    border: 0;
    border-right: 1px solid #d0d0d0;
    border-bottom: 1px solid #d0d0d0;
}
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table thead tr:first-child th,
#heat-trends-location-layout .heat-trends-location-side .plot-heat-table thead tr:first-child th,
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table tr > :first-child,
#heat-trends-location-layout .heat-trends-location-side .plot-heat-table tr > :first-child {
    border-left: 1px solid #d0d0d0;
}
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table thead tr:first-child th,
#heat-trends-location-layout .heat-trends-location-side .plot-heat-table thead tr:first-child th {
    border-top: 1px solid #d0d0d0;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > table, .heat-trends-page #plot-results-overview-pane .table-responsive > table {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
    background: #fff;
}
.heat-trends-page #plot-results-overview-pane .table-responsive {
    width: 100%;
    overflow-x: auto;
}
#heat-trends-location-layout .heat-trends-location-side .plot-selected-card > .card-header {
    font-family: "Oswald", Arial, Helvetica, sans-serif;
    font-size: 1.05rem;
    line-height: 1.2;
}
#plot-selection-tabs .nav-link {
    font-family: "Oswald", Arial, Helvetica, sans-serif;
}
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table thead th, #heat-trends-location-layout .heat-trends-location-side th.plot-sortable, .heat-trends-page #plot-results-overview-pane .plot-grid-table thead th, .heat-trends-page #plot-results-overview-pane th.plot-sortable {
    white-space: normal;
    word-break: normal;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-grid-table thead th,
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-heat-table thead tr.plot-head-groups th {
    position: sticky;
    top: 0;
    z-index: 4;
    background: var(--plot-card-bg-subtle);
    vertical-align: middle;
    box-shadow: inset 0 -1px 0 #d0d0d0;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-heat-table thead tr.plot-head-years th {
    position: sticky;
    top: var(--plot-location-heat-head-offset, 0px);
    z-index: 3;
    background: var(--plot-card-bg-subtle);
    vertical-align: middle;
    box-shadow: inset 0 -1px 0 #d0d0d0;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-grid-table thead th.map-col-id,
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-heat-table thead tr.plot-head-groups th.map-col-id {
    position: sticky;
    left: 0;
    z-index: 6;
    background: var(--plot-card-bg-subtle);
    box-shadow: inset 0 -1px 0 #d0d0d0;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-grid-table tbody td.map-col-id,
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-heat-table tbody td.map-col-id {
    position: sticky;
    left: 0;
    z-index: 3;
    background: #fff;
    box-sizing: border-box;
    box-shadow: none;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > table td.map-col-id,
#heat-trends-location-layout .heat-trends-location-side .table-responsive > table th.map-col-id {
    width: 1%;
    min-width: 11rem;
    max-width: 14.4rem;
    white-space: nowrap;
}
#plot-location-pane td.map-col-id {
    text-align: right !important;
}
#plot-selected-wrap .map-idwrap {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    max-width: 14.4rem;
    white-space: normal;
}
#plot-selected-wrap .map-idwrap .map-idlabels {
    flex: 1 1 auto;
    min-width: 0;
}
#plot-selected-wrap .map-idwrap .fw-semibold,
#plot-selected-wrap .map-idwrap .small {
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: manual;
}
#plot-location-pane .map-sel-zoom,
#plot-location-pane .plot-zoom-btn {
    color: rgb(27, 94, 32);
}
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table th:not(.map-col-id):not(.map-col-x),
#heat-trends-location-layout .heat-trends-location-side .plot-grid-table td:not(.map-col-id):not(.map-col-x),
#heat-trends-location-layout .heat-trends-location-side .plot-heat-table thead tr.plot-head-years th,
#heat-trends-location-layout .heat-trends-location-side .plot-heat-table tbody td:not(.map-col-id):not(.map-col-x) {
    min-width: 7rem;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > table th.map-col-x,
#heat-trends-location-layout .heat-trends-location-side .table-responsive > table td.map-col-x {
    width: 1%;
    min-width: 2.75rem;
    max-width: 2.75rem;
    padding-left: 0.35rem;
    padding-right: 0.35rem;
    white-space: nowrap;
    text-align: center;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > table td.map-col-x .btn.btn-link {
    width: 1rem;
    min-width: 1rem;
    justify-content: center;
}
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-grid-table[data-sort-table="summary"] th.map-col-x,
#heat-trends-location-layout .heat-trends-location-side .table-responsive > .plot-grid-table[data-sort-table="summary"] td.map-col-x {
    min-width: 3.5rem;
    max-width: 3.5rem;
}
#heat-trends-location-layout .heat-trends-location-side .plot-table-control-wrap {
    display: inline-flex;
    align-items: center;
    column-gap: 0.75rem;
    row-gap: 0.5rem;
    flex-wrap: wrap;
    max-width: 100%;
    padding: 0.45rem 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.18);
    border-radius: 0.5rem;
    background: #f8f9fa;
}
#heat-trends-location-layout .heat-trends-location-side .plot-table-control-label {
    font-weight: 400;
}
#heat-trends-location-layout .heat-trends-location-side .plot-selected-wrap > .tab-content,
#heat-trends-location-layout .heat-trends-location-side .plot-selected-wrap > .tab-content > .tab-pane {
    position: relative !important;
    min-height: 0 !important;
    height: auto !important;
}
#heat-trends-location-layout .heat-trends-location-side .plot-heat-change-cell {
    text-align: center;
    white-space: nowrap;
}
#heat-trends-location-layout .heat-trends-location-side .plot-heat-change-cell .plot-delta {
    margin-left: 0;
}
#plot-location-pane .plot-wide-break {
    display: none;
}
#heat-trends-location-layout .heat-trends-location-side table[data-sort-table="land"] th .plot-state-pctile-note,
#heat-trends-location-layout .heat-trends-location-side table[data-sort-table="census"] th .plot-state-pctile-note {
    margin-right: 0.1rem;
}
#heat-trends-location-layout .heat-trends-location-side table[data-sort-table="land"] th .plot-state-pctile-note + .plot-sort-icon,
#heat-trends-location-layout .heat-trends-location-side table[data-sort-table="census"] th .plot-state-pctile-note + .plot-sort-icon {
    margin-left: 0.1rem;
}

#plot-identify-panel .plot-grid-table {
    font-size: 0.9rem;
}
#plot-identify-panel .plot-grid-table tbody th,
#plot-identify-panel .plot-grid-table tbody td {
    background: var(--plot-card-bg);
}
#plot-identify-panel .plot-grid-table tbody tr:nth-child(even) > th,
#plot-identify-panel .plot-grid-table tbody tr:nth-child(even) > td {
    background: #f5f5f5;
}

/* Responsive layout */

@media (min-width: 1600px) {
    #heat-trends-location-layout {
        grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
        align-items: start;
        width: calc(100vw - 8rem);
        max-width: calc(100vw - 8rem);
        margin-left: calc(50% - 50vw + 4rem);
        margin-right: calc(50% - 50vw + 4rem);
    }
    #heat-trends-location-layout > .heat-trends-location-main {
        grid-column: 1;
        align-self: start;
    }
    #heat-trends-location-layout > .heat-trends-location-side {
        grid-column: 2;
        align-self: start;
    }
    #heat-trends-location-layout .heat-trends-location-main #plot-map-card {
        height: 750px;
        min-height: 700px;
    }
    #heat-trends-location-layout .heat-trends-location-side .plot-selected-card {
        height: 750px;
        min-height: 700px;
        max-height: 750px;
    }
    #heat-trends-location-layout .heat-trends-location-main #plot-map-card > .card-body,
    #heat-trends-location-layout .heat-trends-location-main #plot-map {
        height: 100%;
    }
    #heat-trends-location-layout .heat-trends-location-side .plot-selected-card {
        display: flex;
        flex-direction: column;
        overflow: visible;
    }
    #heat-trends-location-layout .heat-trends-location-side .plot-selected-card > .card-body {
        flex: 0 0 auto;
        min-height: 0;
        overflow: visible;
    }
    #heat-trends-location-layout .heat-trends-location-side .plot-selected-wrap {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
        padding-right: 1.5rem !important;
    }
    #heat-trends-location-layout .heat-trends-location-side .plot-selected-wrap > .tab-content {
        min-height: 0;
        overflow: visible;
    }
    #heat-trends-location-layout .heat-trends-location-side .table-responsive {
        max-height: var(--plot-location-table-max-height-default);
    }
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-summary > .table-responsive,
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-land > .table-responsive {
        max-height: var(--plot-location-table-max-height-expanded);
    }
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-census > .table-responsive {
        max-height: var(--plot-location-table-max-height-census);
    }
    #heat-trends-location-layout .heat-trends-location-side .plot-grid-table thead th,
    #heat-trends-location-layout .heat-trends-location-side .plot-heat-table thead tr.plot-head-groups th,
    #heat-trends-location-layout .heat-trends-location-side th.plot-sortable {
        white-space: normal;
        word-break: normal;
        overflow-wrap: anywhere;
    }
    #plot-location-pane .plot-wide-break {
        display: block;
        width: 100%;
        height: 0;
    }
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-summary th[data-sort-key="total_pop"],
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-summary th[data-sort-key="dac_pct"] {
        text-align: center;
    }
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-summary th[data-sort-key="total_pop"] .plot-th-label,
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-summary th[data-sort-key="dac_pct"] .plot-th-label {
        display: block;
        line-height: 1.15;
        margin-bottom: 0.1rem;
        text-align: center;
    }
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-summary th[data-sort-key="total_pop"] .plot-sort-icon,
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-summary th[data-sort-key="dac_pct"] .plot-sort-icon {
        margin-left: 0;
    }
    #heat-trends-location-layout .heat-trends-location-side #plot-sel-summary .plot-grid-table tr > :nth-child(3) {
        width: 1%;
        min-width: 5.25rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        white-space: nowrap;
    }
}
.plot-selected-wrap.is-empty .tab-content {
    pointer-events: none;
    opacity: 0.55;
}
.plot-selected-wrap {
    position: relative;
}
.plot-selected-empty {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 1);
    color: var(--bs-secondary-color);
    text-align: center;
    padding: 1rem;
}
.plot-selected-wrap.is-empty .plot-selected-empty {
    display: flex;
}
#plot-selected-wrap .btn.btn-link {
    text-decoration: none;
    color: #6c757d;
}
#plot-selected-wrap .btn.btn-link:hover {
    color: #495057;
}
#plot-btn-clear-all {
    background-color: #fff;
    border-color: #373737;
    color: #1f1f1f;
    opacity: 0.88;
    outline: 1px solid rgba(31, 31, 31, 0.35);
}
.plot-map-panel-right #plot-pane-select .row.g-2.row-cols-2 .btn:not(#plot-btn-continue) {
    background-color: #fff;
    border-color: rgba(55, 55, 55, 0.46);
    color: rgba(31, 31, 31, 0.68);
    outline: 1px solid rgba(31, 31, 31, 0.18);
}
.plot-map-panel-right #plot-pane-select .row.g-2.row-cols-2 .btn:not(#plot-btn-continue):hover, .plot-map-panel-right #plot-pane-select .row.g-2.row-cols-2 .btn:not(#plot-btn-continue):focus-visible {
    background-color: #1b5e20;
    border-color: #1b5e20;
    color: #fff;
    opacity: 0.95;
}
.plot-map-panel-right #plot-pane-select .row.g-2.row-cols-2 .btn:not(#plot-btn-continue):active, .plot-map-panel-right #plot-pane-select .row.g-2.row-cols-2 .btn:not(#plot-btn-continue).active, .plot-map-panel-right #plot-pane-select .row.g-2.row-cols-2 .btn-check:checked + .btn:not(#plot-btn-continue) {
    background-color: #1b5e20;
    border-color: #1b5e20;
    color: #ffea00;
    opacity: 0.95;
    outline-color: rgba(255, 234, 0, 0.85);
}
.heat-trends-page .plot-hvi-controls-row {
    flex-wrap: wrap;
}
.heat-trends-page .plot-hvi-mode-row {
    width: 100%;
}
.heat-trends-page .plot-hvi-table-view {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
    padding: 0.35rem 0.65rem;
    border: 1px solid rgba(0, 0, 0, 0.18);
    border-radius: 0.5rem;
    background: #f8f9fa;
}
.heat-trends-page .plot-hvi-table-view-label {
    font-weight: 400;
}
.heat-trends-page .plot-hvi-table-view .form-check-inline {
    margin-right: 0;
    padding-top: 0.1rem;
}
.heat-trends-page .plot-hvi-table-view .form-check {
    margin-bottom: 0;
}
.heat-trends-page .plot-hvi-table-view .form-check-input {
    margin-top: 0.125rem;
}