/* SSA Open Data Portal — Shared Stylesheet  */
/* GLOBAL RESET  */
* { box-sizing: border-box; }
.content { background-color:#f7f6f2; }

/* ACCESSIBILITY FEATURES  */
.skip-nav { background-color: #000; border-radius: 0 0 4px 0; color: #fff; font-weight: 600; left: 0; padding: 0.75rem 1.5rem; position: absolute; text-decoration: none;  top: -100px; z-index: 10000; }
.skip-nav:focus { outline: 3px solid #fdb81e; outline-offset: 2px; top: 0; }

/* Visually Hidden - Screen Reader Only */
.visually-hidden { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute;  white-space: nowrap;  width: 1px; }

/* GOV BANNER */
.gov-banner{font-family:"Public Sans Web", sans-serif}
.gov-banner-inner{position:relative;margin:0 auto;padding:.375rem 1.25rem}
.gov-banner-header{align-items:flex-start;display:flex;min-height:0}
.gov-banner-flag{display:flex;margin-right:.5rem;margin-top:.0625rem}
.gov-banner-title-content{width: 100%}
.gov-banner-title{font-size:.75rem;line-height:1.2;margin:0;text-indent:0 !important}
.gov-banner-button{background-color:transparent;border:0;box-shadow:none;color:#0b4778;font-size:.75rem;padding:0;text-decoration:none;cursor:pointer}
.gov-banner-button:focus, .gov-banner-button:hover{background-color:transparent;color:#0b4778}
.gov-banner-button:not([disabled]):focus, .gov-banner-button:not([disabled]):hover{outline: .25rem solid #2491ff;outline-offset: 0}
.gov-banner-button.expanded>SVG{transform:rotate(180deg)}
.gov-banner-button-text{align-items:center;color:#005ea2;display:inline-flex;text-decoration: underline}
.gov-banner-details{max-height:0;overflow:hidden;opacity:0;transition:max-height .25s ease-out, opacity .25s ease-out}
.gov-banner-details-open{max-height:250px;opacity:1}
.gov-banner-details-wrapper{display:flex;flex-direction:column;font-size:.75rem;gap:1.25em;padding:1rem 0}
.gov-banner-details-item{display:flex}
.gov-banner-details-text{line-height:1.4;margin:0;padding:0 .75rem;text-indent:0 !important}
.gov-banner-details-text SVG{transform:translateY(0.125rem)}
@media (min-width: 40em) {
  .gov-banner-flag{margin-top:0}
  .gov-banner-title-content{align-items:center;display:flex}
  .gov-banner-button{margin-left:.5rem;position: relative}
  .gov-banner-details-wrapper{flex-direction:row;font-size:.94rem;gap:.5em;padding:1.25rem 0 1rem}
  .gov-banner-details-item{max-width:50%}
}

/* NAVIGATION BAR */
#top-menu {  align-items: center; background-color: #0071bc; border: 1px solid #005a94; box-shadow: 0 2px 6px rgba(0, 113, 188, 0.3); display: flex; padding: 0.35rem 1.25rem; position: relative; left: 50%; transform: translateX(-50%); width: 100vw; }
.nav-logo-container { align-items: center; display: flex; flex: 0 0 auto; gap: 1rem; margin-right:2rem; }
.nav-logo-link { transition: transform 0.3s, opacity 0.3s; }
.nav-logo-link:hover { opacity: 0.85; transform: scale(1.05); }
.nav-logo-link:focus { border-radius: 4px; outline: 3px solid #fdb81e; outline-offset: 3px; }
.nav-logo-link IMG { display: block; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2)); height: 4rem; width: auto; }
.nav-title { display: flex; flex-direction: column; }
.nav-title-main { color: #fff; font-size: clamp(0.95rem, 0.9rem + 0.3vw, 1.15rem); font-weight: 700; letter-spacing: -0.02em; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }
.nav-title-sub { color: #fff; font-size: clamp(0.7rem, 0.65rem + 0.2vw, 0.8rem); font-weight: 500; letter-spacing: 0.03em; text-transform: uppercase; }
#top-menu UL { list-style: none; margin: 0 0 0 auto; padding: 0; }
#top-menu UL LI { margin: 0 0 0 auto; position: relative; }
#top-menu UL LI UL { background-color: #0071bc; box-shadow: 0 8px 16px rgba(0,0,0,0.15); display: none; left: 0; min-width: 180px; position: absolute; top: 100%; z-index: 1000; }
#top-menu UL LI:active > UL, #top-menu UL LI:focus > UL, #top-menu UL LI:hover > UL, #top-menu UL LI:target > UL, #top-menu UL LI.open > UL { display: block; }
#top-menu UL LI UL LI { margin: .3rem 0; }
#top-menu UL#top-menu-list { display: flex; flex-direction: row; }
#top-menu #top-menu-list A { border-radius: 4px; border-right: 1px solid rgba(255, 255, 255, 0.2); color: #fff; display: block; font-size: clamp(0.8rem, 0.775rem + 0.125vw, 0.9rem); font-weight: 500; line-height:1.2; margin: 0 0.1rem; padding: 0.4rem 1rem; text-decoration: none; transition: all 0.3s ease; }
#top-menu #top-menu-list [href*=\.pdf] { background-image:none; }
#top-menu #top-menu-list LI:last-child A { border-right: none; }
#top-menu #top-menu-list A:hover { background-color: #338dc9; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); color: white; transform: translateY(-2px); }
#top-menu #top-menu-list A.active { background-color: #338dc9; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); color: white; font-weight: 600; }
#top-menu #top-menu-list A:focus { background-color: #338dc9; outline: 3px solid #fdb81e; outline-offset: 2px; }
#menuBtn { display:none; font-size:.85rem; }
#menuBtn::before { content:"\2630"; display: block; font-size:1.2rem; font-weight:bold; transform: scaleX(1.5); }

/* CONTENT SECTIONS */
.section-container { column-gap: 4rem; display: grid; grid-template-columns: 3fr 1fr; }
H1 { font-size: 1.7rem; }
P, UL { font-size: clamp(0.95rem, 0.9rem + 0.15vw, 1.05rem); line-height: 1.6; }
P + UL { margin-top: -1em; }
PRE { font-size:.8rem; margin:1rem 0; }
[href$=\.csv]::after, [href$=\.json]::after, [href$=\.sas]::after, [href$=\.zip]::after, A[download]::after { content: "\2B07\FE0F"; font-size: 1em; margin-left: 0.3em; }
.landing { background-image:url("../images/od-landing-1920-drkr.webp"); background-position:center; flex-basis:100%; margin-top:-24px; max-width:100%; padding:10% 0 10% 8%; width:100%; }
.landing H1 { color:#fff; font-size:3.5em; line-height:1.2; }
.landing button { background-color:#0071bc; font-size:1.5em; }
.landing button::before { background-image:url("../images/search--white.svg"); background-size: contain; content: ""; display: inline-block; height: 1em; margin-right:.25em; margin-top:-.1em; position:relative; top:.15em; transform: scaleX(-1); width: 1em; }
.landing button A { color:#fff; }
.content-section, #resources { background-color: white; border: 1px solid #e0e0e0; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); margin-bottom: 1.5rem; }
.content-section { padding: 2rem 2rem 0; }
#resources { padding: 1rem 1rem 0; }
.content-section H2, #resources H2 { align-items: center; background-color: #f7f9fc; border-bottom: 2px solid #e0e0e0; border-left: 4px solid #0071bc; border-radius: 8px 8px 0 0; display: flex; font-size: clamp(1.05rem, 1rem + 0.3vw, 1.2rem); justify-content: space-between; padding: .25rem .75rem; }
.content-section H2 { margin: -2rem -2rem 0; }
#resources H2 { margin: -1rem -1rem 1rem; }
.content-section.always-open H2 { font-size:1.25rem; }
.content-section H2 BUTTON { border: none; cursor: pointer; font-size: 1.2rem; margin-left: 10px; outline: none; width:1.8rem; }
.content-section H2 BUTTON::before { content="+"; }
.content-section H3, #resources H3 { font-size: clamp(1rem, 1rem + 0.2vw, 1.1rem); margin:1em 0 0; }
.content-section P, .content-section UL { margin: 1rem 0 0; }
.content-section P:last-child, .content-section UL:last-child { margin-bottom:2rem; }
.content-section A { color: #005ea2; font-weight: 500; transition: color 0.3s, text-decoration-color 0.3s; }
.content-section A:hover { color: #1a4480; text-decoration-thickness: 2px; }
.content-section A:focus { border-radius: 2px; outline: 3px solid #fdb81e; outline-offset: 2px; }
.content-section UL.divider { list-style: none; margin: 0; padding: 0; }
.content-section UL.divider LI { border-bottom: 1px solid #e0e0e0; color: #1a1a1a; font-size: clamp(0.95rem, 0.9rem + 0.15vw, 1.05rem); padding: 0.75rem 0; }
.content-section UL.divider LI:last-child { border-bottom: none; }
.content-section UL.divider LI::before { color: #046b99; content: "\2192"; font-size: 1.1em; font-weight: bold; margin-right: 0.75rem; }
.content-section HR { display: none; }
.open-data-logo-home { float:right; margin:1.25rem 0 2% 5%; width:20%; }

/* RESPONSIVE — Tablet */
@media (min-width:1023px) and (max-width: 1400px) {
  .landing { background-image:url("../images/od-landing-1600-drkr.webp"); font-size:.8em; padding-left:6%; }
}

@media (min-width: 769px) and (max-width: 1024px) {
  #top-menu { padding: 0.3rem 1rem; }
  .nav-logo { height: 58px; }
  .landing { background-image:url("../images/od-landing-1280-drkr.webp"); font-size:.8em; padding-left:4%; }
}

/* RESPONSIVE — Mobile */
@media (max-width: 768px) {
  html { font-size: 1rem; }
  #top-menu { padding:0.35rem .5rem; }
  .nav-logo-container { gap:.5rem; }
  .nav-logo-link IMG { height: 3.5rem; }
  #top-menu UL#top-menu-list { display:none; }
  .menuOn #top-menu UL#top-menu-list { box-shadow: 0 2px 8px rgba(0,0,0,0.1); display: block; position: absolute; right:0; top:4.2rem; width:50%; z-index: 1000; }
  #top-menu UL#top-menu-list A { background-color: #0071bc; border: 1px solid #fff; padding: .75rem .5rem; text-align: center; }
  #top-menu UL#top-menu-list A:active, UL#top-menu #top-menu-list A:focus, #top-menu UL#top-menu-list A:hover { background-color: #0071bc; transform:none; }
  #top-menu UL#top-menu-list LI.hasFly > UL { display: none; }
  #top-menu UL#top-menu-list LI.hasFly.open > UL { background:none; display:block; position:relative; width:100%; }
  #top-menu UL#top-menu-list LI UL LI { margin:0; }
  #top-menu UL#top-menu-list LI UL LI A { background-color:#093c8f; }
  #top-menu UL#top-menu-list LI.hasFly > A::after { content: "▼"; font-size: 0.8em; margin-left: 8px; transition: transform 0.2s; }
  #top-menu UL#top-menu-list LI.hasFly.open > A::after { content: "▲"; }
  #menuBtn { background-color:#2196F3; display: block; margin-left: auto; }
  .menuOn #menuBtn::before { content:"\2716"; transform:scaleX(1); }
  .landing { background-image:none; font-size:.8em; padding:4% 0; text-align:center; }  
  .landing H1 { color:#000; margin-top:.5em; }
  .section-container { display: block; }
  .content-section { padding: 2rem 1rem 0; }
  .content-section H2 { margin: -2rem -1rem 0; }
  .open-data-logo-home { width:35%; }
}

/* RESPONSIVE — Desktop Range */
@media (min-width: 769px) and (max-width: 1280px) { html { font-size: 0.875rem; } }
@media (min-width: 1281px) and (max-width: 1600px) { html { font-size: 0.9375rem; } }
@media (min-width: 1601px) { html { font-size: 1rem; } }

/* PRINT STYLES */
@media print {
  #top-menu, .skip-nav { display: none; }
  .content-section { border: 1px solid #e0e0e0; box-shadow: none; page-break-inside: avoid; }
  .content-section H2 { background: #f7f9fc !important;  border-bottom: 2px solid #e0e0e0 !important; border-left: 4px solid #0071bc !important; color: #112e51 !important; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}