/* BOEInfo Index Page Styles */
/* Enhanced to visually match legacy MVC page (excluding header) */

#boeinfo-index { max-width:970px; margin:0 auto; position:relative; }

/* Use Bootstrap-like grid approach instead of flex for better legacy match */
.layout-flex { display:block; }
#leftPanel { width:33.33%; float:left; padding-right:15px; }
.map-panel { width:100%; float:left; min-height:400px; }
.map-panel.reduced-map { width:66.67%; display:flex; align-items:center; justify-content:center; }
.map-wrapper { width:100%; border:0; padding:0; margin:0; min-inline-size:auto; }

/* Clear floats */
.layout-flex::after { content:""; display:table; clear:both; }

/* Map sizing — JS enforces the 2.5:1 aspect ratio; CSS keeps the SVG fluid */
#divMap svg { width:100%; display:block; }

.layout-row-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:5px; }
.layout-row-header .county-label { margin-bottom:0; }
.layout-row-header #printableVersionHeader { margin-left:auto; }

/* Dropdown + detail */
.county-label { margin:0; font-weight:600; margin-bottom:5px; }
.select-wrapper { position:relative; margin-bottom:15px; }
.styled-select { appearance:none; -webkit-appearance:none; -moz-appearance:none; background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path fill="%23666" d="M1.41 0L6 4.58 10.59 0 12 1.41 6 7.41 0 1.41z"/></svg>') no-repeat right 10px center/12px 8px; padding-right:32px; }
.styled-select:focus { outline:2px solid #1ab394; outline-offset:2px; }

#boeinfo-index #divCounty { margin-bottom:10px; }
#boeinfo-index #County { width:100%; }
#boeinfo-index #divCountyDetail { padding:8px 10px; background:#fff; min-height:240px; margin-top:10px; }
#boeinfo-index #divCountyDetail h3 { margin-top:0; font-size:18px; font-weight:600; }
#boeinfo-index .svgpath { cursor:pointer; transition: fill 0.2s ease; }
/* Remove default focus outline - use stroke highlight instead to follow path shape */
#boeinfo-index .svgpath:focus { outline: none; }
#boeinfo-index .hidden { display:none !important; }
#boeinfo-index label.control-label { font-weight:600; }
#boeinfo-index .m-b-none { margin-bottom:0; font-weight:700; }
#boeinfo-index .m-b-xs { margin-bottom:5px; }
#boeinfo-index #CountyDetailResult label { font-weight:600; }
#boeinfo-index #CountyDetailResult span { display:inline-block; }

/* Header layout for printable link */
.page-header-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:15px; }

.desktop-instructions {
    display: block;
}
.mobile-instructions {
    display: none;
}

/* Mobile behavior: hide map entirely below legacy breakpoint (767px) regardless of selection */
@media (max-width: 767px){
    #leftPanel { width:100%; float:none; padding-right:0; }
    .map-panel, .map-panel.reduced-map { display:none !important; }
    #divCountyDetail { width:100%; }
    /* Hide printable version link on mobile */
    #printableVersionHeader {
        display: none !important;
    }
    .layout-row-header .county-label {
        display: none !important;
    }
    .desktop-instructions {
        display: none !important;
    }
    .mobile-instructions {
        display: block !important;
    }
}