@font-face {
  font-family: 'Kaushan Script';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/kaushanscript/v16/vm8vdRfvXFLG3OLnsO15WYS5DG74wNc.ttf) format('truetype');
}
.overlay,
.overlay {
  background-color: #000000;
}
.carousel-caption {
  top: 10%;
  text-shadow: none;
}
@media (min-width: 576px) {
  .carousel-caption {
    top: 15%;
  }
}
@media (min-width: 768px) {
  .carousel-caption {
    top: 20%;
  }
}
@media (min-width: 992px) {
  .carousel-caption {
    top: 30%;
  }
}
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fade-in {
  opacity: 0;
  /* make things invisible upon start */
  -webkit-animation: fadeIn ease-in 1;
  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation: fadeIn ease-in 1;
  animation: fadeIn ease-in 1;
  -webkit-animation-fill-mode: forwards;
  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  animation-duration: 2s;
}
.fade-in.one {
  -webkit-animation-delay: 0.7s;
  -moz-animation-delay: 0.7s;
  animation-delay: 0.7s;
}
.carousel-caption h1 {
  font-size: 50px;
  text-shadow: none;
  margin-top: 10px;
  margin-bottom: 10px;
  letter-spacing: 3px;
  font-family: "Kaushan Script";
  margin-left: -15px;
}
.btn_county {
  margin-left: -8px;
}
@media (min-width: 576px) {
  .carousel-caption h1 {
    font-size: 70px;
    margin-left: -15px;
  }
  .btn_county {
    margin-left: 0px;
  }
}
@media (min-width: 768px) {
  .carousel-caption h1 {
    font-size: 90px;
    margin-left: -15px;
  }
}
@media (min-width: 992px) {
  .carousel-caption h1 {
    font-size: 90px;
    margin-left: -15px;
  }
}
@media (min-width: 1200px) {
  .carousel-caption h1 {
    font-size: 90px;
    margin-left: -15px;
  }
}
.btn-ghost:hover {
  background: #fff;
}
.carousel-caption .btn {
  text-shadow: none;
}
/* .btn {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    border-radius: 3px;
    font-weight: 500;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
*/
.intro .item:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.carousel-caption .btn {
  margin-top: 10px;
  font-size: 11px;
  margin-left: 5px;
  margin-right: 5px;
  text-align: center;
  width: 164px;
}
@media (min-width: 576px) {
  .carousel-caption .btn {
    margin-top: 10px;
    font-size: 11px;
    margin-left: 5px;
    margin-right: 5px;
    text-align: center;
  }
}
/*
.btn {
	font-size:11px;
	text-transform:uppercase;
	letter-spacing:2px;
	border-radius:3px;
	font-weight:600;
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	transition:all .3s ease-in-out;
}*/
.btn-ghost {
  border: 1px solid #ed431f !important;
  color: #fff;
  background: #f05f40 !important;
}
.btn-ghost:hover {
  background: #fff !important;
}
.btn-white {
  background-color: #fff;
  border: 1px solid #fff;
  color: #222;
}
.btn-round {
  border-radius: 300px;
  border: 0;
  font-weight: 700;
}
.btn-round:hover {
  border-radius: 300px;
}
.equal-heights .col-md-4 {
  padding-left: 0;
  padding-right: 0;
}
.equal-heights .box {
  /*padding:60px;*/
}
.navbar {
  margin-bottom: 0px !important;
}
.subnavBar {
  background-color: #fff !important;
  /*padding-left:40px;
	padding-right:40px;*/
  margin-top: 5px;
  margin-bottom: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.subnavHeader {
  background-color: #fff !important;
  /*padding-left:40px;
	padding-right:40px;*/
  padding-bottom: 5px;
}
.summaryRow {
  /*margin-left:20px;
	margin-right:20px;*/
}
.schoolHeaderBar {
  padding-top: 10px;
  /*padding-left:20px;
	padding-right:20px;
*/
}
.summary {
  background-color: #fff !important;
}
.summary {
  border-left: 0px solid !important;
}
.subnavBtn {
  padding-top: 10px;
}
.vcenter {
  display: inline-block;
  vertical-align: middle;
  float: none;
}
.landingButtons {
  padding-left: 20px;
  padding-right: 20px;
}
.landingButtonsContainer {
  margin-left: 25px;
  margin-right: 25px;
}
/*
 * Row with equal height columns
 * --------------------------------------------------
 */
/* bs3 modal kick fix */
.modal {
  overflow-y: auto;
}
.modal-open {
  overflow: auto;
}
.modal-open[style] {
  padding-right: 0px !important;
}
/* Other stuff from subnav */
#schoolFinder {
  margin: 0px;
}
.myCardRating {
  margin: 0;
}
.subnavbar {
  margin-top: 9px;
  margin-bottom: 9px;
}
.subnav .btn,
.subnav2 .btn,
.subnav .btn:active,
.subnav2 .btn:active {
  background-color: transparent;
  background: transparent;
  border-color: transparent;
  border-left: 1px #333 solid;
}
.subnav .btn,
.subnav2 .btn {
  color: #333;
}
.subnav .btn:active,
.subnav2 .btn:active {
  color: #000;
}
.subnav a:first-of-type,
.subnav2 a:first-of-type,
.subnav a.btn:active:first-of-type,
.subnav2 a.btn:active:first-of-type {
  border-left: 0px #333 solid;
}
.rcorners {
  background-color: white;
}
.mainbox {
  margin-left: 0px;
  margin-right: 12px;
}
.progress-bar-custom1 {
  background-color: green;
}
.progress-bar-custom2 {
  background-color: orange;
}
.noDataMessage {
  font-weight: bolder;
}
.legendBox {
  background-color: #D3D3D3;
  padding: 8px;
}
.navbar-toggle {
  background-color: white !important;
}
.box > .card-footer {
  bottom: 0px;
}
.thwhite {
  background-color: #ffffff;
}
footer {
  background-color: #162600 !important;
}
.myprint {
  color: #fff !important;
  font-size: larger;
}
.school-text {
  color: #155569;
}
.pull-right {
  color: #125E6C;
}
.weblink {
  color: #125E6C;
}
.summaryTitle {
  font-size: larger;
}
.test {
  background-color: #fff;
}
#thaNavBar {
  background-color: #fff;
  font-size: 12pt;
  border-bottom: 1px #333 solid;
}
#thaNavBar ul > li > ul {
  background-color: #fff;
  color: #333;
  font-size: 12pt;
}
.dropdown-menuAlt {
  color: #555 !important;
  font-size: 10pt !important;
}
.mainbox {
  margin-left: 12px;
  margin-right: 12px;
}
.corners {
  background-color: #162600;
}
.box {
  background-color: #fff;
}
#topBar {
  background-color: #fff;
}
#subBar {
  background-color: #fff;
  margin-top: 0px;
}
.dropdown-menuAlt {
  list-style-type: none !important;
}
.divider {
  color: black !important;
  background-color: black !important;
}
.testnavbar > li {
  border-top: #666 !important;
}
/*.box-footer {bottom:0px;}*/
.navbar-ex1-collapse {
  background-color: #fff;
}
.mybrand {
  font-size: 0.7em !important;
}
a.navbar-brand {
  overflow: visible !important;
}
.navbar-pf .navbar-brand img {
  height: 40px !important;
}
#thaHeader {
  border-bottom: 0px solid black;
}
@media (max-width: 360px) {
  a.navbar-brand {
    overflow: visible !important;
  }
  .navbar-pf .navbar-brand img {
    height: 40px !important;
  }
  .mybrand {
    font-size: 0.7em !important;
  }
  h1 {
    font-size: 16px !important;
  }
  h2 {
    font-size: 15px !important;
  }
  h3 {
    font-size: 14px !important;
  }
  p,
  table {
    font-size: 12px !important;
  }
  #thaHeader {
    border-bottom: 0px solid black;
  }
}
@media only screen and (min-width: 320px) {
  .navbar-pf .navbar-brand img {
    height: 40px !important;
    overflow: visible !important;
  }
  .mybrand {
    font-size: 0.7em !important;
    overflow: visible !important;
  }
  #thaHeader {
    border-bottom: 0px solid black;
  }
}
/* Extra Small Devices, Phones */
@media only screen and (min-width: 480px) {
  .navbar-pf .navbar-brand img {
    height: 50px !important;
  }
  .mybrand {
    font-size: 0.95em !important;
  }
  #thaHeader {
    border-bottom: 1px solid black;
  }
}
/* Small Devices, Tablets */
@media only screen and (min-width: 768px) {
  .navbar-pf .navbar-brand img {
    height: 50px !important;
  }
  .mybrand {
    font-size: 0.98em !important;
  }
  .thaNavBar {
    display: none !important;
  }
  #thaNavBar {
    border-bottom: 0px #333 solid;
  }
  #thaHeader {
    border-bottom: 1px solid black;
  }
}
/* Medium Devices, Desktops */
@media only screen and (min-width: 992px) {
  .navbar-pf .navbar-brand img {
    height: 60px !important;
  }
  .mybrand {
    font-size: 1.3em !important;
  }
  .thaNavBar {
    display: none !important;
  }
  #thaNavBar {
    border-bottom: 0px #333 solid;
  }
  #thaHeader {
    border-bottom: 1px solid black;
  }
}
/* Large Devices, Wide Screens */
@media only screen and (min-width: 1200px) {
  .navbar-pf .navbar-brand img {
    height: 60px !important;
  }
  .mybrand {
    font-size: 1.3em !important;
  }
  .thaNavBar {
    display: none !important;
  }
  #thaNavBar {
    border-bottom: 0px #333 solid;
  }
  #thaHeader {
    border-bottom: 1px solid black;
  }
}


/* =============================================================
   BS5 Migration Fixes — overview/report card pages
   ============================================================= */

/* Info boxes — replace panel/panel-default/panel-body styling */
#bxInfo,
#bxInfo2,
.box.card {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #fff;
    overflow: hidden;
}

#bxInfo > .card-body,
#bxInfo2 > .card-body {
    padding: 16px;
}

#bxInfo > .card-footer,
#bxInfo2 > .card-footer,
.box > .card-footer {
    background: transparent;
    border-top: 1px solid #e8e8e8;
    padding: 10px 16px;
}

/* carouselbutton — large square white cards matching target */
.carouselbutton {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 4px !important;
    padding: 28px 12px !important;
    width: 100% !important;
    min-height: 160px;
    color: #125E6C !important;
    font-size: 0.95rem !important;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    letter-spacing: 0.5px;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.carouselbutton:hover,
.carouselbutton:focus {
    background: #f5f9ff !important;
    border-color: #125E6C !important;
    color: #125E6C !important;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.carouselbutton img,
.carouselbutton .icon {
    margin-bottom: 12px;
}

/* Column layout for the carouselbutton grid rows */
.ratingBox .carouselbutton {
    min-height: unset;
    padding: 14px 10px !important;
}

/* Subnav navigation bar */
.subnavBar {
    border-bottom: 1px solid #e0e0e0;
}

.subnavbar a.btn {
    font-size: 0.9rem;
}

/* Dropdown toggles in subnav — ensure caret shows */
.subnavbar .dropdown-toggle::after {
    display: inline-block;
}

/* navbar-toggle -> navbar-toggler in BS5 */
.navbar-toggler {
    background-color: white !important;
    border-color: #ddd;
}

/* float-end color fix — was .pull-right with color override */
.float-end {
    color: #125E6C;
}

/* Responsive carouselbutton sizes */
@media (max-width: 575px) {
    .carouselbutton {
        min-height: 120px;
        padding: 16px 8px !important;
        font-size: 0.8rem !important;
    }
}

@media (min-width: 768px) {
    .carouselbutton {
        min-height: 170px;
    }
}

@media (min-width: 992px) {
    .carouselbutton {
        min-height: 180px;
        font-size: 1rem !important;
    }
}

/* PatternFly card grid classes — neutralize in case they appear */
.container-cards-pf { width: 100%; }
.row-cards-pf {
    display: flex;
    flex-wrap: wrap;
    margin-left: -8px;
    margin-right: -8px;
}


/* =============================================================
   Explore Districts page fixes
   ============================================================= */

/* Fix panel/panel-default/panel-body still appearing from Mura content */
.home-welcome .panel.panel-default.box,
.home-welcome .panel-default.box {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #fff;
    overflow: hidden;
}

.home-welcome .panel-body {
    padding: 16px;
}

/* col-xs-* fallback from Mura-managed content */
.home-welcome [class*="col-xs-9"] { width: 75%; }
.home-welcome [class*="col-xs-3"] { width: 25%; }

/* pull-right from Mura content -> float right */
.home-welcome .pull-right { float: right; }

/* School listing cards grid area */
#card-container {
    width: 100%;
}

#dl_d_list {
    display: flex;
    flex-wrap: wrap;
}

/* View District button — match prod (filled blue) */
#dl_b {
    background-color: #2d6fbd;
    border-color: #2d6fbd;
    color: #fff;
    border-radius: 4px;
    margin-top: 10px;
}

#dl_b:not([disabled]):hover {
    background-color: #1a55a0;
    border-color: #1a55a0;
}



/* =============================================================
   School Rating Cards — Explore Districts listing
   fixCards() in rcFormDistrictListing.js strips inline styles
   so these CSS rules can take full effect
   ============================================================= */

/* Outer card wrapper */
.panel.cardbox.schoolRatingCardbox {
    border: none;
    border-radius: 10px;
    overflow: hidden;
    height: auto;
    box-shadow: none;
    margin-bottom: 16px;
}

/* Colored body — flex column so content fills card */
.panel-body.schoolCardBody {
    display: flex;
    flex-direction: column;
    padding: 18px 18px 14px 18px;
    min-height: 130px;
    height: 100%;
    position: relative;
    border-radius: 10px;
    box-sizing: border-box;
}

.panel-body.schoolCardBody h4 {
    margin: 0 0 12px 0;
    font-size: 0.9rem;
    font-weight: 700;
    flex: 1;
    line-height: 1.3;
}

/* Rating row — label left, score right, aligned to bottom */
.card-pf-body {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    width: 100%;
    margin-top: auto;
}

/* col-8/col-4 inside card-pf-body — disable BS5 grid widths */
.card-pf-body > div,
.card-pf-body > h2 {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    flex-basis: auto !important;
}

.card-pf-body > div {
    flex: 1;
}

.card-pf-body > h2 {
    flex-shrink: 0;
    margin-left: 8px;
}

/* Rating label */
.bottom-align-text-left {
    font-size: 0.85rem;
    line-height: 1.4;
}

.bottom-align-text-left big {
    font-size: 0.88rem;
    font-weight: 600;
    display: block;
}

.bottom-align-text-left small {
    font-size: 0.72rem;
    opacity: 0.8;
}

/* Score number — large, right side */
.schoolCardRatingNbr.bottom-align-text {
    font-size: 2.4rem !important;
    font-weight: 800;
    line-height: 1;
    text-align: right;
    margin: 0;
    padding: 0;
    position: static !important;
    bottom: auto !important;
    right: auto !important;
    float: none !important;
}

/* Equal height cards within each row */
.schoolBox.col-sm-6 {
    display: flex;
    flex-direction: column;
    margin-bottom: 16px;
}

.panel.cardbox.schoolRatingCardbox {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.panel-body.schoolCardBody {
    flex: 1;
}

/* Card hover */
.panel.cardbox.schoolRatingCardbox:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transform: translateY(-2px);
    transition: all 0.2s ease;
}

/* Grade filter dropdown */
.btn.btn-default.dropdown-toggle,
#sfDD1.btn-default {
    background-color: #2d6fbd !important;
    border-color: #2d6fbd !important;
    color: #fff !important;
    border-radius: 4px;
    padding: 6px 14px;
    font-size: 0.8rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.btn.btn-default.dropdown-toggle:hover {
    background-color: #1a55a0 !important;
    border-color: #1a55a0 !important;
}

.caret { display: none; }

.dropdown-menu li a {
    display: block;
    padding: 6px 16px;
    color: #333;
    text-decoration: none;
}

.dropdown-menu li a:hover {
    background: #f0f5ff;
    color: #0d6efd;
}

.dropdown-menu li.divider {
    height: 1px;
    background: #e0e0e0;
    margin: 4px 0;
}

/* District select — restore native dropdown arrow */
#dl_d.form-control,
.home-welcome select.form-control {
    appearance: auto;
    -webkit-appearance: auto;
}

/* View District button */
#dl_b {
    background-color: #2d6fbd;
    border-color: #2d6fbd;
    color: #fff;
    border-radius: 4px;
    margin-top: 10px;
}

#dl_b:not([disabled]):hover {
    background-color: #1a55a0;
    border-color: #1a55a0;
}

.overlay,
.overlay {
  background-color: #000000;
}
.carousel-caption {
  top: 10%;
  text-shadow: none;
}
@media (min-width: 576px) {
  .carousel-caption {
    top: 15%;
  }
}
@media (min-width: 768px) {
  .carousel-caption {
    top: 20%;
  }
}
@media (min-width: 992px) {
  .carousel-caption {
    top: 30%;
  }
}
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fade-in {
  opacity: 0;
  /* make things invisible upon start */
  -webkit-animation: fadeIn ease-in 1;
  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation: fadeIn ease-in 1;
  animation: fadeIn ease-in 1;
  -webkit-animation-fill-mode: forwards;
  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  animation-duration: 2s;
}
.fade-in.one {
  -webkit-animation-delay: 0.7s;
  -moz-animation-delay: 0.7s;
  animation-delay: 0.7s;
}
.carousel-caption h1 {
  font-size: 50px;
  text-shadow: none;
  margin-top: 10px;
  margin-bottom: 10px;
  letter-spacing: 3px;
  font-family: "Kaushan Script";
  margin-left: -15px;
}
.btn_county {
  margin-left: -8px;
}
@media (min-width: 576px) {
  .carousel-caption h1 {
    font-size: 70px;
    margin-left: -15px;
  }
  .btn_county {
    margin-left: 0px;
  }
}
@media (min-width: 768px) {
  .carousel-caption h1 {
    font-size: 90px;
    margin-left: -15px;
  }
}
@media (min-width: 992px) {
  .carousel-caption h1 {
    font-size: 90px;
    margin-left: -15px;
  }
}
@media (min-width: 1200px) {
  .carousel-caption h1 {
    font-size: 90px;
    margin-left: -15px;
  }
}
.btn-ghost:hover {
  background: #fff;
}
.carousel-caption .btn {
  text-shadow: none;
}
/* .btn {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    border-radius: 3px;
    font-weight: 500;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
*/
.intro .item:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.carousel-caption .btn {
  margin-top: 10px;
  font-size: 11px;
  margin-left: 5px;
  margin-right: 5px;
  text-align: center;
  width: 164px;
}
@media (min-width: 576px) {
  .carousel-caption .btn {
    margin-top: 10px;
    font-size: 11px;
    margin-left: 5px;
    margin-right: 5px;
    text-align: center;
  }
}
/*
.btn {
	font-size:11px;
	text-transform:uppercase;
	letter-spacing:2px;
	border-radius:3px;
	font-weight:600;
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	transition:all .3s ease-in-out;
}*/
.btn-ghost {
  border: 1px solid #ed431f !important;
  color: #fff;
  background: #f05f40 !important;
}
.btn-ghost:hover {
  background: #fff !important;
}
.btn-white {
  background-color: #fff;
  border: 1px solid #fff;
  color: #222;
}
.btn-round {
  border-radius: 300px;
  border: 0;
  font-weight: 700;
}
.btn-round:hover {
  border-radius: 300px;
}
.equal-heights .col-md-4 {
  padding-left: 0;
  padding-right: 0;
}
.equal-heights .box {
  /*padding:60px;*/
}
.navbar {
  margin-bottom: 0px !important;
}
.subnavBar {
  background-color: #fff !important;
  /*padding-left:40px;
	padding-right:40px;*/
  margin-top: 5px;
  margin-bottom: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.subnavHeader {
  background-color: #fff !important;
  /*padding-left:40px;
	padding-right:40px;*/
  padding-bottom: 5px;
}
.summaryRow {
  /*margin-left:20px;
	margin-right:20px;*/
}
.schoolHeaderBar {
  padding-top: 10px;
  /*padding-left:20px;
	padding-right:20px;
*/
}
.summary {
  background-color: #fff !important;
}
.summary {
  border-left: 0px solid !important;
}
.subnavBtn {
  padding-top: 10px;
}
.vcenter {
  display: inline-block;
  vertical-align: middle;
  float: none;
}
.landingButtons {
  padding-left: 20px;
  padding-right: 20px;
}
.landingButtonsContainer {
  margin-left: 25px;
  margin-right: 25px;
}
/*
 * Row with equal height columns
 * --------------------------------------------------
 */
/* bs3 modal kick fix */
.modal {
  overflow-y: auto;
}
.modal-open {
  overflow: auto;
}
.modal-open[style] {
  padding-right: 0px !important;
}
/* Other stuff from subnav */
#schoolFinder {
  margin: 0px;
}
.myCardRating {
  margin: 0;
}
.subnavbar {
  margin-top: 9px;
  margin-bottom: 9px;
}
.subnav .btn,
.subnav2 .btn,
.subnav .btn:active,
.subnav2 .btn:active {
  background-color: transparent;
  background: transparent;
  border-color: transparent;
  border-left: 1px #333 solid;
}
.subnav .btn,
.subnav2 .btn {
  color: #333;
}
.subnav .btn:active,
.subnav2 .btn:active {
  color: #000;
}
.subnav a:first-of-type,
.subnav2 a:first-of-type,
.subnav a.btn:active:first-of-type,
.subnav2 a.btn:active:first-of-type {
  border-left: 0px #333 solid;
}
.rcorners {
  background-color: white;
}
.mainbox {
  margin-left: 0px;
  margin-right: 12px;
}
.progress-bar-custom1 {
  background-color: green;
}
.progress-bar-custom2 {
  background-color: orange;
}
.noDataMessage {
  font-weight: bolder;
}
.legendBox {
  background-color: #D3D3D3;
  padding: 8px;
}
.navbar-toggle {
  background-color: white !important;
}
.box > .card-footer {
  bottom: 0px;
}
.thwhite {
  background-color: #ffffff;
}
footer {
  background-color: #162600 !important;
}
.myprint {
  color: #fff !important;
  font-size: larger;
}
.school-text {
  color: #155569;
}
.pull-right {
  color: #125E6C;
}
.weblink {
  color: #125E6C;
}
.summaryTitle {
  font-size: larger;
}
.test {
  background-color: #fff;
}
#thaNavBar {
  background-color: #fff;
  font-size: 12pt;
  border-bottom: 1px #333 solid;
}
#thaNavBar ul > li > ul {
  background-color: #fff;
  color: #333;
  font-size: 12pt;
}
.dropdown-menuAlt {
  color: #555 !important;
  font-size: 10pt !important;
}
.mainbox {
  margin-left: 12px;
  margin-right: 12px;
}
.corners {
  background-color: #162600;
}
.box {
  background-color: #fff;
}
#topBar {
  background-color: #fff;
}
#subBar {
  background-color: #fff;
  margin-top: 0px;
}
.dropdown-menuAlt {
  list-style-type: none !important;
}
.divider {
  color: black !important;
  background-color: black !important;
}
.testnavbar > li {
  border-top: #666 !important;
}
/*.box-footer {bottom:0px;}*/
.navbar-ex1-collapse {
  background-color: #fff;
}
.mybrand {
  font-size: 0.7em !important;
}
a.navbar-brand {
  overflow: visible !important;
}
.navbar-pf .navbar-brand img {
  height: 40px !important;
}
#thaHeader {
  border-bottom: 0px solid black;
}
@media (max-width: 360px) {
  a.navbar-brand {
    overflow: visible !important;
  }
  .navbar-pf .navbar-brand img {
    height: 40px !important;
  }
  .mybrand {
    font-size: 0.7em !important;
  }
  h1 {
    font-size: 16px !important;
  }
  h2 {
    font-size: 15px !important;
  }
  h3 {
    font-size: 14px !important;
  }
  p,
  table {
    font-size: 12px !important;
  }
  #thaHeader {
    border-bottom: 0px solid black;
  }
}
@media only screen and (min-width: 320px) {
  .navbar-pf .navbar-brand img {
    height: 40px !important;
    overflow: visible !important;
  }
  .mybrand {
    font-size: 0.7em !important;
    overflow: visible !important;
  }
  #thaHeader {
    border-bottom: 0px solid black;
  }
}
/* Extra Small Devices, Phones */
@media only screen and (min-width: 480px) {
  .navbar-pf .navbar-brand img {
    height: 50px !important;
  }
  .mybrand {
    font-size: 0.95em !important;
  }
  #thaHeader {
    border-bottom: 1px solid black;
  }
}
/* Small Devices, Tablets */
@media only screen and (min-width: 768px) {
  .navbar-pf .navbar-brand img {
    height: 50px !important;
  }
  .mybrand {
    font-size: 0.98em !important;
  }
  .thaNavBar {
    display: none !important;
  }
  #thaNavBar {
    border-bottom: 0px #333 solid;
  }
  #thaHeader {
    border-bottom: 1px solid black;
  }
}
/* Medium Devices, Desktops */
@media only screen and (min-width: 992px) {
  .navbar-pf .navbar-brand img {
    height: 60px !important;
  }
  .mybrand {
    font-size: 1.3em !important;
  }
  .thaNavBar {
    display: none !important;
  }
  #thaNavBar {
    border-bottom: 0px #333 solid;
  }
  #thaHeader {
    border-bottom: 1px solid black;
  }
}
/* Large Devices, Wide Screens */
@media only screen and (min-width: 1200px) {
  .navbar-pf .navbar-brand img {
    height: 60px !important;
  }
  .mybrand {
    font-size: 1.3em !important;
  }
  .thaNavBar {
    display: none !important;
  }
  #thaNavBar {
    border-bottom: 0px #333 solid;
  }
  #thaHeader {
    border-bottom: 1px solid black;
  }
}


/* =============================================================
   BS5 Migration Fixes — overview/report card pages
   ============================================================= */

/* Info boxes — replace panel/panel-default/panel-body styling */
#bxInfo,
#bxInfo2,
.box.card {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #fff;
    overflow: hidden;
}

#bxInfo > .card-body,
#bxInfo2 > .card-body {
    padding: 16px;
}

#bxInfo > .card-footer,
#bxInfo2 > .card-footer,
.box > .card-footer {
    background: transparent;
    border-top: 1px solid #e8e8e8;
    padding: 10px 16px;
}

/* carouselbutton — large square white cards matching target */
.carouselbutton {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 4px !important;
    padding: 28px 12px !important;
    width: 100% !important;
    min-height: 160px;
    color: #125E6C !important;
    font-size: 0.95rem !important;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    letter-spacing: 0.5px;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.carouselbutton:hover,
.carouselbutton:focus {
    background: #f5f9ff !important;
    border-color: #125E6C !important;
    color: #125E6C !important;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.carouselbutton img,
.carouselbutton .icon {
    margin-bottom: 12px;
}

/* Column layout for the carouselbutton grid rows */
.ratingBox .carouselbutton {
    min-height: unset;
    padding: 14px 10px !important;
}

/* Subnav navigation bar */
.subnavBar {
    border-bottom: 1px solid #e0e0e0;
}

.subnavbar a.btn {
    font-size: 0.9rem;
}

/* Dropdown toggles in subnav — ensure caret shows */
.subnavbar .dropdown-toggle::after {
    display: inline-block;
}

/* navbar-toggle -> navbar-toggler in BS5 */
.navbar-toggler {
    background-color: white !important;
    border-color: #ddd;
}

/* float-end color fix — was .pull-right with color override */
.float-end {
    color: #125E6C;
}

/* Responsive carouselbutton sizes */
@media (max-width: 575px) {
    .carouselbutton {
        min-height: 120px;
        padding: 16px 8px !important;
        font-size: 0.8rem !important;
    }
}

@media (min-width: 768px) {
    .carouselbutton {
        min-height: 170px;
    }
}

@media (min-width: 992px) {
    .carouselbutton {
        min-height: 180px;
        font-size: 1rem !important;
    }
}

/* PatternFly card grid classes — neutralize in case they appear */
.container-cards-pf { width: 100%; }
.row-cards-pf {
    display: flex;
    flex-wrap: wrap;
    margin-left: -8px;
    margin-right: -8px;
}


/* =============================================================
   Explore Districts page fixes
   ============================================================= */

/* Fix panel/panel-default/panel-body still appearing from Mura content */
.home-welcome .panel.panel-default.box,
.home-welcome .panel-default.box {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #fff;
    overflow: hidden;
}

.home-welcome .panel-body {
    padding: 16px;
}

/* col-xs-* fallback from Mura-managed content */
.home-welcome [class*="col-xs-9"] { width: 75%; }
.home-welcome [class*="col-xs-3"] { width: 25%; }

/* pull-right from Mura content -> float right */
.home-welcome .pull-right { float: right; }

/* School listing cards grid area */
#card-container {
    width: 100%;
}

#dl_d_list {
    display: flex;
    flex-wrap: wrap;
}

/* View District button — match prod (filled blue) */
#dl_b {
    background-color: #2d6fbd;
    border-color: #2d6fbd;
    color: #fff;
    border-radius: 4px;
    margin-top: 10px;
}

#dl_b:not([disabled]):hover {
    background-color: #1a55a0;
    border-color: #1a55a0;
}



/* =============================================================
   School Rating Cards — Explore Districts listing
   Server-generated HTML uses panel/panel-body/card-pf-body
   We override everything needed via CSS
   ============================================================= */

/* Outer card container */
.panel.cardbox.schoolRatingCardbox {
    border: none !important;
    border-radius: 10px !important;
    overflow: hidden;
    height: auto !important;
    box-shadow: none;
}

/* Colored card body — override inline height, add flex layout */
.panel-body.schoolCardBody {
    display: flex !important;
    flex-direction: column !important;
    padding: 14px 16px !important;
    height: auto !important;
    min-height: 130px !important;
    position: relative !important;
    border-radius: 10px !important;
}

.panel-body.schoolCardBody h4 {
    margin: 0 0 auto 0;
    font-size: 0.95rem;
    font-weight: 700;
    flex: 1;
}

/* card-pf-body — the row containing rating label + score */
.card-pf-body {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    width: 100% !important;
    position: static !important;
    margin-top: 12px;
}

/* Rating label (Average, Good etc) + type */
.bottom-align-text-left {
    position: static !important;
    flex: 1;
    font-size: 0.85rem;
    line-height: 1.3;
}

.bottom-align-text-left big {
    font-size: 0.9rem;
    font-weight: 600;
    display: block;
}

.bottom-align-text-left small {
    font-size: 0.72rem;
    opacity: 0.8;
}

/* Score number — the big number on the right */
.schoolCardRatingNbr.bottom-align-text {
    position: static !important;
    font-size: 2.2rem !important;
    font-weight: 800;
    line-height: 1;
    text-align: right;
    flex-shrink: 0;
    width: auto !important;
    float: none !important;
    bottom: auto !important;
    right: auto !important;
    margin: 0;
    padding: 0;
}

/* col-8/col-4 inside card-pf-body — override BS5 grid widths */
.card-pf-body .col-8 {
    width: auto !important;
    flex: 1 !important;
    padding: 0 !important;
}

.card-pf-body .col-4 {
    width: auto !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
}

/* Card hover effect */
.panel.cardbox.schoolRatingCardbox:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
    transform: translateY(-2px);
    transition: all 0.2s ease;
}

/* Grade filter dropdown */
.btn.btn-default.dropdown-toggle,
#sfDD1.btn-default {
    background-color: #2d6fbd !important;
    border-color: #2d6fbd !important;
    color: #fff !important;
    border-radius: 4px;
    padding: 6px 14px;
    font-size: 0.8rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.btn.btn-default.dropdown-toggle:hover {
    background-color: #1a55a0 !important;
    border-color: #1a55a0 !important;
}

.caret { display: none; }

.dropdown-menu li a {
    display: block;
    padding: 6px 16px;
    color: #333;
    text-decoration: none;
}

.dropdown-menu li a:hover {
    background: #f0f5ff;
    color: #0d6efd;
}

.dropdown-menu li.divider {
    height: 1px;
    background: #e0e0e0;
    margin: 4px 0;
}

/* District select — restore native arrow */
#dl_d.form-control,
.home-welcome select.form-control {
    appearance: auto;
    -webkit-appearance: auto;
}

/* View District button */
#dl_b {
    background-color: #2d6fbd;
    border-color: #2d6fbd;
    color: #fff;
    border-radius: 4px;
    margin-top: 10px;
}

#dl_b:not([disabled]):hover {
    background-color: #1a55a0;
    border-color: #1a55a0;
}


/* Remove underline from all anchors sitewide */
a,
a:hover,
a:visited {
    text-decoration: none;
}


/* =============================================================
   Typography — PatternFly heading sizes and styles
   ============================================================= */

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
}

.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,
.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,
h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small,
h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small {
    font-weight: 400;
    line-height: 1;
    color: #9c9c9c;
}

.h1,.h2,.h3,h1,h2,h3 {
    margin-top: 20px;
    margin-bottom: 10px;
}

.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,
h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small {
    font-size: 65%;
}

.h4,.h5,.h6,h4,h5,h6 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,
h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small {
    font-size: 75%;
}

.h1,h1 { font-size: 24px; }
.h2,h2 { font-size: 22px; }
.h3,h3 { font-size: 16px; }
.h4,h4 { font-size: 15px; }
.h5,h5 { font-size: 13px; }
.h6,h6 { font-size: 11px; }

/* Prevent typography rules from breaking school card layout */
.panel-body.schoolCardBody h4 {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    font-size: 0.9rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

.card-pf-body big {
    font-size: 0.9rem !important;
    font-weight: 600;
    display: block;
    line-height: 1.3;
}

.card-pf-body small {
    font-size: 0.72rem !important;
    opacity: 0.8;
    line-height: 1.3;
}


/* =============================================================
   School Rating Cards — updated ui_helper.cfc output
   Now uses card/card-body/cardMain instead of panel/panel-body/card-pf-body
   ============================================================= */

/* Outer card */
.card.cardbox.schoolRatingCardbox {
    border-radius: 10px;
    overflow: hidden;
    border: none;
}

/* Colored body */
.card-body.schoolCardBody {
    display: flex;
    flex-direction: column;
    padding: 18px 18px 14px 18px;
    min-height: 130px;
    position: relative;
    border-radius: 10px;
}

.card-body.schoolCardBody h4 {
    margin: 0 0 auto 0 !important;
    font-size: 0.9rem !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    flex: 1;
}

/* cardMain — rating label + score row */
.cardMain {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    width: 100%;
    margin-top: auto;
}

/* col-8/col-4 inside cardMain — disable BS5 grid widths */
.cardMain .col-8 {
    width: auto !important;
    flex: 1 !important;
    padding: 0 !important;
}

.cardMain .col-4 {
    width: auto !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
}

/* Rating label */
.cardMain .bottom-align-text-left {
    font-size: 0.85rem;
    line-height: 1.3;
}

.cardMain .bottom-align-text-left big {
    font-size: 0.9rem !important;
    font-weight: 600;
    display: block;
    line-height: 1.3;
}

.cardMain .bottom-align-text-left small {
    font-size: 0.72rem !important;
    opacity: 0.8;
}

/* Score number */
.cardMain .schoolCardRatingNbr {
    font-size: 2.4rem !important;
    font-weight: 800;
    line-height: 1;
    text-align: right;
    position: static !important;
    bottom: auto !important;
    right: auto !important;
    float: none !important;
    margin: 0;
    padding: 0;
    flex-shrink: 0;
    margin-left: 8px;
}

/* Equal height cards */
.schoolBox.col-sm-6 {
    display: flex;
    flex-direction: column;
    margin-bottom: 16px;
}

.card.cardbox.schoolRatingCardbox {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.card-body.schoolCardBody {
    flex: 1;
}

/* Card hover */
.card.cardbox.schoolRatingCardbox:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transform: translateY(-2px);
    transition: all 0.2s ease;
}


/* =============================================================
   Overview page — match prod appearance
   ============================================================= */

/* Page title — smaller, lighter weight like prod */
.mura-page-title,
.pageTitle,
#topBar h1,
.subnavHeader h1 {
    font-size: 1.4rem !important;
    font-weight: 400 !important;
    color: #333;
    margin-top: 10px;
    margin-bottom: 10px;
}

/* Info boxes — more compact like prod */
#bxInfo > .card-body,
#bxInfo2 > .card-body {
    padding: 12px 16px !important;
}

#bxInfo,
#bxInfo2 {
    min-height: unset !important;
}

/* Subnav links — remove underline, lighter weight */
.subnavBar a,
.subnavbar a {
    text-decoration: none !important;
    color: #333;
    font-weight: 400;
}

.subnavBar a:hover,
.subnavbar a:hover {
    color: #0d6efd;
}

/* Section headings (ACADEMICS, SCHOOL ENVIRONMENT etc) */
.landingButtonsContainer h3.text-uppercase,
.landingButtonsContainer .text-uppercase {
    margin-top: 12px;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em;
    color: #555;
    margin-bottom: 12px;
}

/* Carouselbutton — more compact like prod */
.carouselbutton {
    min-height: 140px !important;
    padding: 20px 10px !important;
}

.carouselbutton img.myIcon {
    width: 60px;
    height: 60px;
}

@media (min-width: 768px) {
    .carouselbutton {
        min-height: 150px !important;
    }
}

@media (min-width: 992px) {
    .carouselbutton {
        min-height: 160px !important;
        font-size: 0.9rem !important;
    }
}

/* Remove container padding — override BS5 default */
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
    padding-right: 0;
    padding-left: 0;
}

.summaryRow {
    padding-bottom: 20px;
}

.subnavBar {
    margin-top: 0 !important;
}

#thaHeader {
    background-color: white;
}

/* =============================================================
   Progress Bars — PatternFly styles restored for data pages
   BS5 removed progress-bar-success/info/warning/danger color variants
   ============================================================= */

.progress {
    overflow: hidden;
    height: 20px;
    margin-bottom: 20px;
    background-color: #ededed;
    border-radius: 1px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}
.progress-bar {
    float: left;
    width: 0%;
    height: 100%;
    font-size: 11px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #39a5dc;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    transition: width .6s ease;
}
.progress-bar-striped,.progress-striped .progress-bar {
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: linear-gradient(-45deg,rgba(3,3,3,.15) 25%,rgba(3,3,3,.15) 26%,transparent 27%,transparent 49%,rgba(3,3,3,.15) 50%,rgba(3,3,3,.15) 51%,transparent 52%,transparent 74%,rgba(3,3,3,.15) 75%,rgba(3,3,3,.15) 76%,transparent 77%);
    background-size: 40px 40px;
}
.progress-bar.active,.progress.active .progress-bar {
    animation: progress-bar-stripes 2s linear infinite;
}
.progress-bar-success { background-color: #3f9c35; }
.progress-striped .progress-bar-success {
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: linear-gradient(-45deg,rgba(3,3,3,.15) 25%,rgba(3,3,3,.15) 26%,transparent 27%,transparent 49%,rgba(3,3,3,.15) 50%,rgba(3,3,3,.15) 51%,transparent 52%,transparent 74%,rgba(3,3,3,.15) 75%,rgba(3,3,3,.15) 76%,transparent 77%);
}
.progress-bar-info { background-color: #00659c; }
.progress-striped .progress-bar-info {
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: linear-gradient(-45deg,rgba(3,3,3,.15) 25%,rgba(3,3,3,.15) 26%,transparent 27%,transparent 49%,rgba(3,3,3,.15) 50%,rgba(3,3,3,.15) 51%,transparent 52%,transparent 74%,rgba(3,3,3,.15) 75%,rgba(3,3,3,.15) 76%,transparent 77%);
}
.progress-bar-warning { background-color: #ec7a08; }
.progress-striped .progress-bar-warning {
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: linear-gradient(-45deg,rgba(3,3,3,.15) 25%,rgba(3,3,3,.15) 26%,transparent 27%,transparent 49%,rgba(3,3,3,.15) 50%,rgba(3,3,3,.15) 51%,transparent 52%,transparent 74%,rgba(3,3,3,.15) 75%,rgba(3,3,3,.15) 76%,transparent 77%);
}
.progress-bar-danger { background-color: #c00; }
.progress-striped .progress-bar-danger {
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-image: linear-gradient(-45deg,rgba(3,3,3,.15) 25%,rgba(3,3,3,.15) 26%,transparent 27%,transparent 49%,rgba(3,3,3,.15) 50%,rgba(3,3,3,.15) 51%,transparent 52%,transparent 74%,rgba(3,3,3,.15) 75%,rgba(3,3,3,.15) 76%,transparent 77%);
}

/* Base font size — match prod */
body {
    font-size: 14px;
}

/* =============================================================
   Table Styles — PatternFly restored for data pages
   ============================================================= */

.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th {
    padding: 2px 10px 3px;
}
.table>tbody>tr>td>a:hover,.table>tbody>tr>th>a:hover,.table>tfoot>tr>td>a:hover,.table>tfoot>tr>th>a:hover,.table>thead>tr>td>a:hover,.table>thead>tr>th>a:hover {
    text-decoration: none;
}
.table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>th {
    font-family: "Open Sans";
    font-style: normal;
    font-weight: 600;
}
.table>thead {
    background-clip: padding-box;
    background-color: #f5f5f5;
    background-image: linear-gradient(to bottom,#fafafa 0,#ededed 100%);
    background-repeat: repeat-x;
}
.table-bordered {
    border: 1px solid #d1d1d1;
}
.table-bordered>tbody>tr>td,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>td,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>thead>tr>th {
    border: 1px solid #d1d1d1;
}
.table-bordered>thead>tr>td,.table-bordered>thead>tr>th {
    border-bottom-width: 1px;
}
.table-striped>tbody>tr:nth-of-type(even) {
    background-color: #f5f5f5;
}
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: transparent;
}
.table-hover>tbody>tr:hover>td,.table-hover>tbody>tr:hover>th {
    background-color: #def3ff;
    border-bottom-color: #7dc3e8;
}
.table-treegrid span.indent {
    margin-left: 10px;
    margin-right: 10px;
}
.table-treegrid span.icon {
    display: inline-block;
    font-size: 13px;
    margin-right: 5px;
    min-width: 10px;
    text-align: center;
}
.table-treegrid span.collapse-icon,.table-treegrid span.expand-icon {
    cursor: pointer;
}
.table-treegrid>tbody>tr.odd {
    background-color: #f5f5f5;
}

/* Details button — vertically align with progress bar */
.graphDetails {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.graphDetails .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
}

/* Progress bar row alignment */
.progress {
    margin-bottom: 8px;
}

table th {
    --bs-table-bg: #eee;
    padding: 10px;
    vertical-align: top;
}

/* Table containment and borders */
.contentArea table,
.mura-region table,
.mura-body table,
.content table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    margin-bottom: 16px;
}

/* Restore container padding for content areas only */
.mura-body .container,
.mura-body .container-fluid,
.content .container,
.content .container-fluid,
#ddown .container,
#ddown .container-fluid {
    padding-right: 15px;
    padding-left: 15px;
}

/* Table borders — ensure all cells have borders */
.table-bordered,
.table-bordered td,
.table-bordered th {
    border: 1px solid #d1d1d1 !important;
}

/* Table cell padding consistency */
.table td,
.table th {
    padding: 6px 10px;
    vertical-align: top;
    border-top: 1px solid #d1d1d1;
}

table th {
    --bs-table-bg: #eee;
}

/* th background — but not thwhite which is intentionally white */
table th:not(.thwhite) {
    background: #eee !important;
}

table th.thwhite {
    background: #fff !important;
}

/* =============================================================
   Subnav dropdown — match prod appearance
   ============================================================= */

/* Restore BS3 caret appearance since <b class="caret"> is still in HTML */
.subnavbar b.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 4px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

/* Suppress BS5 ::after chevron since we have the BS3 caret */
.subnavbar .dropdown-toggle::after {
    display: none;
}

/* Dropdown menu — tighter sizing to match prod */
.subnavbar .dropdown-menu {
    font-size: 13px;
    min-width: 180px;
    max-width: 220px;
    padding: 4px 0;
    border-radius: 2px;
    border: 1px solid rgba(0,0,0,.15);
    box-shadow: 0 3px 6px rgba(0,0,0,.1);
}

.subnavbar .dropdown-menu li a,
.subnavbar .dropdown-menu a {
    display: block;
    padding: 4px 14px;
    font-size: 13px;
    line-height: 1.4;
    color: #333;
    white-space: normal;
    word-wrap: break-word;
}

.subnavbar .dropdown-menu li a:hover {
    background-color: #f5f5f5;
    color: #333;
}

/* visually-hidden for sr-only spans */
.subnavbar .visually-hidden,
.subnavbar .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}

/* Submenu */
.dropdown-submenu {
    position: absolute;
    left: 100%;
    top: 0;
    min-width: 180px;
    background: #fff;
    border: 1px solid rgba(0,0,0,.15);
    box-shadow: 0 3px 6px rgba(0,0,0,.1);
    padding: 4px 0;
    z-index: 1000;
}

tbody, td, tfoot, th, thead, tr {
    border-color: inherit;
    border-style: solid;
    border-width: 1px;
}

.popover-header {
    margin-top: 0px;
}

/* Sidebar nav pills — vertical stacking list */
.hidemeMobile .nav.nav-pills.flex-column,
.hidemeMobile .nav.nav-pills {
    flex-direction: column !important;
}

.hidemeMobile .nav.nav-pills li {
    width: 100%;
}

.hidemeMobile .nav.nav-pills li a {
    display: block;
    padding: 4px 0;
    font-size: 13px;
    color: #0d6efd;
    text-decoration: none;
}

.hidemeMobile .nav.nav-pills li a:hover {
    text-decoration: underline;
}

/* Card footer background — school overview info boxes */
.card-footer,
.panel-footer,
.box-footer {
    background-color: #f5f5f5;
}

/* Carousel button rating footer — gray background like prod */
.carouselbutton .myCardRating,
.carouselbutton .text-center.mt-2 {
    background-color: #f5f5f5;
    margin: 8px -10px -10px -10px;
    padding: 8px 10px;
    border-top: 1px solid #e0e0e0;
    border-radius: 0 0 4px 4px;
}

.carouselbutton .myCardRating h5,
.carouselbutton .myCardRating big {
    margin: 0;
    font-size: 0.9rem;
    color: #333;
}

/* Overall Ratings Scale sidebar box — white background */
.card.hidemeMobile,
.hidemeMobile .card {
    background-color: #fff;
    border: 1px solid #e0e0e0;
}

/* Info box card footers — gray background */
.box-footer,
.card-footer.box-footer,
.card-footer.text-center.box-footer {
    background-color: #f5f5f5 !important;
    border-top: 1px solid #e0e0e0;
}

/* Carousel button rating footer — full width fix */
.carouselbutton {
    padding-bottom: 0 !important;
    overflow: hidden;
}

.carouselbutton .text-center.mt-2 {
    margin: 8px -20px -20px -20px !important;
    padding: 8px 10px !important;
    background-color: #f5f5f5 !important;
    border-top: 1px solid #e0e0e0 !important;
}

/* =============================================================
   Overview Icon Cards — BS5 card with card-footer
   Generated by createButtonLink() in ui_helper.cfc
   Replaces old .carouselbutton.cardbox anchor pattern
   ============================================================= */

a.card.cardbox {
    color: #333;
    background-color: #fff;
    transition: box-shadow 0.2s ease-out, transform 0.2s ease-out;
}

a.card.cardbox:hover,
a.card.cardbox:focus {
    color: #125E6C;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    transform: translateY(-2px);
    outline: none;
}

a.card.cardbox .card-body {
    padding: 1.25rem 1rem 0.75rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

a.card.cardbox .card-body .myIcon {
    width: 60px;
    height: auto;
}

a.card.cardbox .card-body .fw-semibold {
    color: #125E6C;
    font-size: 0.9rem;
    margin-top: 0.5rem;
    text-align: center;
}

a.card.cardbox .card-footer {
    background-color: #f5f5f5;
    border-top: 1px solid #e0e0e0;
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 0.75rem;
}

a.card.cardbox .card-footer .myCardRating {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
}

a.card.cardbox .card-footer .myCardRating big {
    font-size: 1em;
}

/* school-text color already defined above — applies to .myCardRating in footer */


/* card-footer-empty — placeholder footer for height alignment on school view.
   Visible as a gray bar only when siblings in the same row have a real rating footer.
   On district/state views no footer renders at all (showFooter=false). */
a.card.cardbox .card-footer-empty {
    background-color: #f5f5f5;
    border-top: 1px solid #e0e0e0;
    min-height: 2.75rem;
}

/* =============================================================
   Navbar translation alignment
   ============================================================= */
.navtranslate {
    padding-left: 0px;
    margin-left: 0px;
    float: left;
    /* margin-left: 20px; */
}

/* =============================================================
   School group headers — District listing page
   (Elementary Schools / Middle Schools / High Schools)
   ============================================================= */
.school-group-header {
    border-bottom: 2px solid #155569;
    margin-bottom: 0.75rem;
    padding-bottom: 0.25rem;
}

.school-group-label {
    font-size: 1rem;
    font-weight: 700;
    color: #155569;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0;
}

/* =============================================================
   Modal title
   ============================================================= */
.modal-title {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
    margin-top: 0px;
}

/* =============================================================
   Button group
   ============================================================= */
.btn-group {
    padding-right: 10px;
}

/* =============================================================
   Subnav dropdown menu
   ============================================================= */
.subnavbar .dropdown-menu {
    font-size: 13px;
    min-width: 200px;
    max-width: 220px;
    padding: 4px 0;
    border-radius: 2px;
    border: 1px solid rgba(0, 0, 0, .15);
    box-shadow: 0 3px 6px rgba(0, 0, 0, .1);
}

/* =============================================================
   Grade filter dropdown — restore BS5 caret on form-control button
   form-control sets display:block which hides the ::after caret
   ============================================================= */
#sfDD1.dropdown-toggle::after,
#sfDD1.form-control.dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.5em;
    vertical-align: middle;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
}

/* Sort dropdown caret — same fix as grade filter */
#sfSortDD.dropdown-toggle::after,
#sfSortDD.form-control.dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.5em;
    vertical-align: middle;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
}
