/* ==========================================================================
   LVREP rebrand (formerly LVGEA) - School Tracker
   Loaded after sn-stylesheet.css and the page's inline styles, so rules
   here override the old LVGEA look. All rebrand styling lives in this file.
   Map/chart data colors also changed in custom.js, assets/geo/script.php
   and app/Models/HomeModel.php (see sections 3b and 3c).
   ========================================================================== */

/* LVREP font: Neue Haas Grotesk Text (Adobe Fonts kit, same as the dev map).
   @import has to stay above every other rule in this file. */
@import url("https://use.typekit.net/oim3koq.css");

:root {
    --lvrep-font: "neue-haas-grotesk-text", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --lvrep-deep-slate: #283743;   /* text, dark backgrounds */
    --lvrep-stone: #B7A99A;        /* accent */
    --lvrep-mineral-blue: #527A8C; /* accent (low contrast on Deep Slate) */
    --lvrep-light-grey: #EAECED;   /* backgrounds */
}

/* --------------------------------------------------------------------------
   0. Font
      The page mixes Montserrat, PT Sans and Helvetica Neue; all text
      switches to the LVREP font, including pop-ups and chart labels.
      Icon fonts (Font Awesome, Glyphicons) are left alone.
   -------------------------------------------------------------------------- */

body,
body *:not(.fa):not(.glyphicon) {
    font-family: var(--lvrep-font) !important;
}

/* --------------------------------------------------------------------------
   1. Header, welcome note, footer
   -------------------------------------------------------------------------- */

header {
    background-color: var(--lvrep-deep-slate);
    border-bottom: 4px solid var(--lvrep-stone);
}

.welcome-note {
    background-color: var(--lvrep-deep-slate);
    border-top: 1px solid rgba(183, 169, 154, 0.35);
}

a ,button{
    outline: unset !important;
}

/* LVREP logo (logo-lvrep-reversed.svg, about 2:1). Sized by height;
   the old logo was a wider 3:1 shape sized by width. */
header a.logo {
    width: auto !important;
    padding: 10px 16px !important;
}

header a.logo img {
    display: block;
    height: 60px;
    width: auto;
}

@media screen and (max-width: 750px) {
    header a.logo img {
        height: 44px;
    }
}

header .welcome-note h3 {
    color: var(--lvrep-stone);
}

footer.front {
    background-color: var(--lvrep-deep-slate);
}

/* Menu button open state */
.toggle.dialog-open a:first-child:after {
    background: var(--lvrep-stone);
    color: var(--lvrep-deep-slate);
}

/* --------------------------------------------------------------------------
   2. Map controls bar (Filter Results / Census Tract Data / Export)
   -------------------------------------------------------------------------- */

.left-side button,
button#download-page-as-image {
    background: var(--lvrep-stone);
    color: var(--lvrep-deep-slate);
}

.left-side button:hover,
button#download-page-as-image:hover {
    background: var(--lvrep-deep-slate);
    color: #FFFFFF;
}

/* --------------------------------------------------------------------------
   3. Text on Stone backgrounds: Deep Slate instead of white (contrast)
   -------------------------------------------------------------------------- */

.sidebar .side_tablepopup,
.mycarousel .modal-body .modal-header .filter .filter-open {
    color: var(--lvrep-deep-slate);
}

::selection {
    background: var(--lvrep-mineral-blue);
    color: #FFFFFF;
}

::-moz-selection {
    background: var(--lvrep-mineral-blue);
    color: #FFFFFF;
}

/* --------------------------------------------------------------------------
   3b. School-type colors. High School is red-orange #D24000 everywhere
       (map pins use orange-pin.png again; the tabs keep their darker
       #AA3400). The school pop-up border was a different orange (#CC6700).
   -------------------------------------------------------------------------- */

.nav-tabs #elementary-tab.active,
.nav-tabs #elementary-tab:hover,
.nav-tabs #middle-tab.active,
.nav-tabs #middle-tab:hover,
.nav-tabs #school-tab.active,
.nav-tabs #school-tab:hover,
#modal_slider_home li.table-nav-item.active a {
    color: #FFFFFF;
}

/* Hover on an inactive tab in the chart slider: Stone, so Deep Slate text */
#modal_slider_home .table-nav-link:hover,
#modal_slider_home .table-nav-link:focus {
    color: var(--lvrep-deep-slate);
}

.pop-yellow {
    border-top-color: #D24000;
    border-bottom-color: #D24000;
}

/* --------------------------------------------------------------------------
   3c. Map data colors
       - Summerlin/Henderson outlines (were LVGEA purple) -> Deep Slate,
         drawn in custom.js; the region checkbox matches. A tract you
         click is outlined in Mineral Blue.
       - Income shading: light grey-blue to Deep Slate (was LVGEA blue).
       - Education shading: stronger yellow steps.
         The map colors come from assets/geo/script.php; these are the
         matching legend boxes and the Income menu swatch.
   -------------------------------------------------------------------------- */

.checkboxes input#henderson,
.checkboxes input#henderson-popup,
.checkboxes-popup input#hendersondata_popup {
    border-color: var(--lvrep-deep-slate);
}

.checkboxes-popup input#henderson-popup {
    border-color: var(--lvrep-deep-slate);
}

/* Filled square in the first region checkbox when it's on */
.legend-list ul li.checkbox_active:nth-child(1)::before {
    background-color: var(--lvrep-deep-slate);
}

.fisrt_clr  { background: #A6BAC3; }
.secnd_clr  { background: #7C9AA8; }
.third_clr  { background: #527A8C; }
.fourth_clr { background: #3D5868; }
.fifth_clr  { background: #283743; }

/* Education shading: same yellow, more contrast between steps
   (map colors in assets/geo/script.php) */
.fisrt_clr2  { background: #F8D68A; }
.secnd_clr2  { background: #EDBD50; }
.third_clr2  { background: #E0A321; }
.fourth_clr2 { background: #CF8B00; }
.fifth_clr2  { background: #BF7600; }

.sidebar_right .nav_left .map-list .map-list-dropdown ul.listg_left li .boulder-color {
    background-color: var(--lvrep-deep-slate);
}

.sidebar_right .nav_left .map-list .map-list-dropdown ul.listg_left li .boulder-yellowcolor {
    background-color: #BF7600;
}

h4.barlegend {
    color: var(--lvrep-deep-slate);
}

/* --------------------------------------------------------------------------
   4. Old LVGEA colors, rule by rule (same selectors as sn-stylesheet.css
      and the page's inline styles)
      gold #E7941A -> Stone (backgrounds, borders) or Mineral Blue (text on light)
      navy #002653 / blue #004876 / #343340 -> Deep Slate
      purple #943D78 -> Mineral Blue
      grey panels #CFCFCF -> white, #AEAEAE bar -> Light Grey
   -------------------------------------------------------------------------- */

.mycarousel .modal-body .modal-header h3 {
    color: var(--lvrep-stone);
}

.mycarousel .modal-body .modal-header .filter .filter-open {
    background: var(--lvrep-stone);
}

.table_carosl .modal-dialog .modal-content .modal-header {
    background-color: var(--lvrep-deep-slate);
}

.table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link {
    color: var(--lvrep-mineral-blue);
}

.table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link.active,
.table_carosl .modal-dialog .modal-content .modal-body .table_nav li .sidebar .comparison .nav-tabs .nav-item a.nav-link:hover,
.sidebar .comparison .nav-tabs .nav-item .table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link:hover {
    background: var(--lvrep-mineral-blue);
}

.table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link.active:active,
.table_carosl .modal-dialog .modal-content .modal-body .table_nav li .sidebar .comparison .nav-tabs .nav-item a.nav-link:active:hover,
.sidebar .comparison .nav-tabs .nav-item .table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link:active:hover {
    background: var(--lvrep-mineral-blue);
}

.table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link.active:hover,
.table_carosl .modal-dialog .modal-content .modal-body .table_nav li .sidebar .comparison .nav-tabs .nav-item a.nav-link:hover,
.sidebar .comparison .nav-tabs .nav-item .table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link:hover {
    background: var(--lvrep-mineral-blue);
}

.table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link.active:focus,
.table_carosl .modal-dialog .modal-content .modal-body .table_nav li .sidebar .comparison .nav-tabs .nav-item a.nav-link:focus:hover,
.sidebar .comparison .nav-tabs .nav-item .table_carosl .modal-dialog .modal-content .modal-body .table_nav li a.nav-link:focus:hover {
    background: var(--lvrep-mineral-blue);
}

.table_carosl .modal-dialog .modal-content .modal-body table th {
    color: var(--lvrep-mineral-blue) !important;
}

#comparison .modal-header {
    background-color: var(--lvrep-deep-slate);
}

#comparison .modal-body .frm_updte .updte-cmp {
    background-color: var(--lvrep-mineral-blue);
}

#modal_slider_home li.table-nav-item a {
    color: var(--lvrep-mineral-blue);
}

#modal_slider_home .table-nav-link:hover,
#modal_slider_home .table-nav-link:focus,
#modal_slider_home li.table-nav-item.active a {
    background: var(--lvrep-stone);
}

.top-btn a {
    background-color: var(--lvrep-mineral-blue);
}

.comparsn_table_page h2.form-text {
    color: var(--lvrep-mineral-blue);
}

.comparsn_table_page ul.nav.nav-tabs.table_nav .table-nav-link:hover,
.comparsn_table_page ul.nav.nav-tabs.table_nav .table-nav-link:focus,
.comparsn_table_page ul.nav.nav-tabs.table_nav li.table-nav-item.active a {
    background: var(--lvrep-mineral-blue);
}

.comparsn_table_page ul.nav.nav-tabs.table_nav a.table-nav-link {
    color: var(--lvrep-mineral-blue);
}

.table_census .mCSB_dragger_bar {
    background: var(--lvrep-stone) !important;
}

.left-side .legend-panel {
    background-color: #FFFFFF;
}

.left-side .legend-panel .legend-list .filter-srch label {
    color: var(--lvrep-mineral-blue);
}

.filter-srch label {
    color: var(--lvrep-mineral-blue);
}

.sidebar .side_tablepopup {
    background: var(--lvrep-stone);
}

.sidebar .filters .filter-srch label {
    color: var(--lvrep-deep-slate);
}

.sidebar .filters .filter-srch label span {
    color: var(--lvrep-deep-slate);
}

.sidebar .filters .filter-srch label span a {
    color: var(--lvrep-deep-slate);
}

.sidebar .filters .filter-srch .btn {
    background-color: var(--lvrep-mineral-blue);
}

.sidebar .comparison {
    background-color: var(--lvrep-deep-slate);
}

.sidebar .comparison .nav-tabs .nav-item a.nav-link {
    color: var(--lvrep-mineral-blue);
}

.sidebar .comparison .nav-tabs .nav-item a.nav-link.active,
.sidebar .comparison .nav-tabs .nav-item a.nav-link:hover {
    background-color: var(--lvrep-stone);
}

.sidebar_right {
    background: #FFFFFF;
}

.sidebar_right .side_tablepopup {
    background: var(--lvrep-mineral-blue);
}

.sidebar_right .nav_left .map-list .maptop_heading li {
    background-color: var(--lvrep-mineral-blue);
}

.sidebar_right .nav_left .map-list .map-list-dropdown ul.listg_left li a:hover,
.sidebar_right .nav_left .map-list .map-list-dropdown ul.listg_left li a:focus {
    color: var(--lvrep-deep-slate) !important;
}

.buttns_fd_suprt .feedbck_butn {
    background: var(--lvrep-mineral-blue);
}

.popup-area .ccsd-table {
    background-color: var(--lvrep-deep-slate);
}

.popup-area .ccsd-table table td:last-child {
    background-color: var(--lvrep-deep-slate);
}

header {
    background-color: var(--lvrep-deep-slate);
    border-bottom: 4px solid var(--lvrep-stone);
}

footer.front {
    background-color: var(--lvrep-deep-slate);
}

.left-side {
    background: var(--lvrep-light-grey);
}

.full_width {
    background: var(--lvrep-light-grey);
}

div#income_legend,
div#poverty_legend,
div#education_legend {
    background: rgba(40, 55, 67, 0.25);
}

.toggle.dialog-open a:first-child:after {
    background: var(--lvrep-stone);
}

.drop_down_hover .hover_items ul li:first-child ,.drop_down_hover .hover_items ul li {
    border-color: rgba(183, 169, 154, 0.36) !important;
}

.modal_star .filter_school_popup_clear {
    background-color: var(--lvrep-stone) !important;
}

.item.chardiv table thead th {
    color: var(--lvrep-mineral-blue) !important;
}

.result_modal .modal-header {
    background: var(--lvrep-deep-slate);
}

.chardiv::-webkit-scrollbar-thumb {
    background: var(--lvrep-stone);
}

.hover_items ul li label input:checked {
    background-color: var(--lvrep-deep-slate);
}

.hover_items ul li label input {
    border: 1px solid var(--lvrep-deep-slate);
}

#modal_census_table table.responsive-table thead tr th {
    color: var(--lvrep-mineral-blue);
}

.modal_star .filter_school_popup_clear {
    color: var(--lvrep-deep-slate);
}

.checkboxes input#balance:checked,
.checkboxes input#not_henderson,
.checkboxes-popup input#hendersondata_popup:checked {
    border-color: var(--lvrep-deep-slate);
}

.left-side .legend-panel .legend-list ul li label input {
    border: 1px solid var(--lvrep-deep-slate);
}

.drop_down_hover .hover_items ul li {
    border-bottom: 0.1px solid var(--lvrep-stone);
}

.left-side .legend-panel .legend-list ul li label input:checked {
    background-color: var(--lvrep-deep-slate);
}

.drop_down_hover .hover_items ul li:nth-child(even) {
    background: rgba(183, 169, 154, 0.08);
}

.drop_down_hover .hover_items ul li:first-child {
    border-top: 0.1px solid var(--lvrep-stone);
}