/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/
body {
  padding-bottom: 0;
}
.text-white{
  color: #fff;
}
.header-help{
  padding-left: 2rem;
  padding-right: 2rem;
  margin-left: 2rem;
  position:relative;
}
.header-help:after {
  border-left: 1px solid #fff;
  display: block;
  position: absolute;
  width: 1px;
  content: "";
  height: 100%;
  top: 0;
  left: 0;
}

.header-help:before {
  border-left: 1px solid #fff;
  display: block;
  position: absolute;
  width: 1px;
  content: "";
  height: 100%;
  top: 0;
  right: 0;
}
.navbar-default {
  background-color: #087021;
}


.navbar-default .navbar-nav>li>a {
  color: #fff
}

.navbar-default .navbar-nav>li>a:focus,.navbar-default .navbar-nav>li>a:hover {
  color: #fff;
  background-color: transparent;
  text-decoration: underline;
}

.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:focus,.navbar-default .navbar-nav>.active>a:hover {
  color: #fff;
  background-color: transparent
}

.navbar-default .navbar-nav>.disabled>a,.navbar-default .navbar-nav>.disabled>a:focus,.navbar-default .navbar-nav>.disabled>a:hover {
  color: #fff;
  background-color: transparent
}

.logo-container>img {
  max-height: 70px;
  padding: 1rem;
  width: auto;
}

.btn {
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 600;
}
.btn-default {
  color: #087021;
  background-color: #fff;
  border-color: #087021;
  border: 2px solid #087021;
}
.btn-default:hover, .btn-default:active, .btn-default:focus {
  color: #fff !important;
  background-color: #0b4c1a !important;
  border-color: #0b4c1a !important;
  border: 2px solid #0b4c1a !important;
}

.btn-primary {
  color: #fff;
  background-color: #087021;
  border-color: #087021;
}


.btn-primary.focus,.btn-primary:focus {
  color: #fff;
  background-color: #0b4c1a;
  border-color: #0b4c1a
}

.btn-primary:hover {
  color: #fff;
  background-color: #0b4c1a;
  border-color: #0b4c1a
}

.btn-primary.active,.btn-primary:active,.open>.dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #0b4c1a;
  background-image: none;
  border-color: #0b4c1a
}

.btn-primary.active.focus,.btn-primary.active:focus,.btn-primary.active:hover,.btn-primary:active.focus,.btn-primary:active:focus,.btn-primary:active:hover,.open>.dropdown-toggle.btn-primary.focus,.open>.dropdown-toggle.btn-primary:focus,.open>.dropdown-toggle.btn-primary:hover {
  color: #fff;
  background-color: #0b4c1a;
  border-color: #0b4c1a
}

.btn-primary.disabled.focus,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled].focus,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary.focus,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover {
  background-color: #0b4c1a;
  border-color: #0b4c1a
}



/* ============================
 Bootstrap Flex Utilities
 ============================ */

/* Display flex */
.d-flex {
display: flex !important;
}

.d-inline-flex {
display: inline-flex !important;
}

/* Responsive display */
@media (min-width: 576px) {
.d-sm-flex { display: flex !important; }
.d-sm-inline-flex { display: inline-flex !important; }
}
@media (min-width: 768px) {
.d-md-flex { display: flex !important; }
.d-md-inline-flex { display: inline-flex !important; }
}
@media (min-width: 992px) {
.d-lg-flex { display: flex !important; }
.d-lg-inline-flex { display: inline-flex !important; }
}
@media (min-width: 1200px) {
.d-xl-flex { display: flex !important; }
.d-xl-inline-flex { display: inline-flex !important; }
}
@media (min-width: 1400px) {
.d-xxl-flex { display: flex !important; }
.d-xxl-inline-flex { display: inline-flex !important; }
}

/* Flex direction */
.flex-row { flex-direction: row !important; }
.flex-row-reverse { flex-direction: row-reverse !important; }
.flex-column { flex-direction: column !important; }
.flex-column-reverse { flex-direction: column-reverse !important; }

/* Responsive flex direction */
@media (min-width: 576px) {
.flex-sm-row { flex-direction: row !important; }
.flex-sm-row-reverse { flex-direction: row-reverse !important; }
.flex-sm-column { flex-direction: column !important; }
.flex-sm-column-reverse { flex-direction: column-reverse !important; }
}
@media (min-width: 768px) {
.flex-md-row { flex-direction: row !important; }
.flex-md-row-reverse { flex-direction: row-reverse !important; }
.flex-md-column { flex-direction: column !important; }
.flex-md-column-reverse { flex-direction: column-reverse !important; }
}
@media (min-width: 992px) {
.flex-lg-row { flex-direction: row !important; }
.flex-lg-row-reverse { flex-direction: row-reverse !important; }
.flex-lg-column { flex-direction: column !important; }
.flex-lg-column-reverse { flex-direction: column-reverse !important; }
}
@media (min-width: 1200px) {
.flex-xl-row { flex-direction: row !important; }
.flex-xl-row-reverse { flex-direction: row-reverse !important; }
.flex-xl-column { flex-direction: column !important; }
.flex-xl-column-reverse { flex-direction: column-reverse !important; }
}
@media (min-width: 1400px) {
.flex-xxl-row { flex-direction: row !important; }
.flex-xxl-row-reverse { flex-direction: row-reverse !important; }
.flex-xxl-column { flex-direction: column !important; }
.flex-xxl-column-reverse { flex-direction: column-reverse !important; }
}

/* Flex wrap */
.flex-wrap { flex-wrap: wrap !important; }
.flex-nowrap { flex-wrap: nowrap !important; }
.flex-wrap-reverse { flex-wrap: wrap-reverse !important; }

/* Justify content */
.justify-content-start { justify-content: flex-start !important; }
.justify-content-end { justify-content: flex-end !important; }
.justify-content-center { justify-content: center !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-around { justify-content: space-around !important; }
.justify-content-evenly { justify-content: space-evenly !important; }

/* Align items */
.align-items-start { align-items: flex-start !important; }
.align-items-end { align-items: flex-end !important; }
.align-items-center { align-items: center !important; }
.align-items-baseline { align-items: baseline !important; }
.align-items-stretch { align-items: stretch !important; }

/* Align content */
.align-content-start { align-content: flex-start !important; }
.align-content-end { align-content: flex-end !important; }
.align-content-center { align-content: center !important; }
.align-content-between { align-content: space-between !important; }
.align-content-around { align-content: space-around !important; }
.align-content-stretch { align-content: stretch !important; }

/* Align self */
.align-self-auto { align-self: auto !important; }
.align-self-start { align-self: flex-start !important; }
.align-self-end { align-self: flex-end !important; }
.align-self-center { align-self: center !important; }
.align-self-baseline { align-self: baseline !important; }
.align-self-stretch { align-self: stretch !important; }

/* Flex grow / shrink / fill */
.flex-fill { flex: 1 1 auto !important; }
.flex-grow-0 { flex-grow: 0 !important; }
.flex-grow-1 { flex-grow: 1 !important; }
.flex-shrink-0 { flex-shrink: 0 !important; }
.flex-shrink-1 { flex-shrink: 1 !important; }

/*List inline*/


.list-inline {
padding-left: 0;
list-style: none;
margin-bottom: 0;
}

.list-inline-item {
display: inline-block;
}

.list-inline-item:not(:last-child) {
margin-right: 0.5rem;
}

/*footer */
.footer{
  background-color: #f6f6f6;
  padding-top: .5rem;
  padding-bottom: .5rem;
}
.footer a{
  color: #000;
  text-decoration: underline;
}
.footer a:hover{
  color: #0b4c1a;
}
.help-jda-text{
  display: none;
}
.help-jda-btn {
  margin-bottom: 1rem;
}
.help-jda-btn span{
  cursor: pointer;
}
.help-jda-btn span:hover{
  text-decoration: underline;
}

.question-container {
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border:0;
  border-bottom: 1px solid #e7e7e7;
  background-color: #fff; 
}


.ls-questionhelp button.help-toggle {
  all: unset; /* eliminamos estilos nativos */
  cursor: pointer;
  font-weight: normal;
  display: block;
  margin-bottom: .5rem;
}

.ls-questionhelp button.help-toggle:focus-visible {
  outline: 2px solid #0d6efd; /* estilo de foco */
  outline-offset: 2px;
}

/* ============================
 Fix color primario BS3 → BS5
 ============================ */
:root {
  --bs-primary: #087021;
  --bs-primary-rgb: 8, 112, 33;
  --bs-primary-bg-subtle: #d4edda;
  --bs-link-color: #087021;
  --bs-link-hover-color: #0b4c1a;
}

/* Navbar verde (reemplaza .navbar-default de BS3) */
.navbar.bg-primary {
  background-color: #087021 !important;
}

/* Fix botón primary BS3 → BS5 */
.btn.btn-primary,
.btn-primary {
  --bs-btn-bg: #087021 !important;
  --bs-btn-border-color: #087021 !important;
  --bs-btn-hover-bg: #0b4c1a !important;
  --bs-btn-hover-border-color: #0b4c1a !important;
  --bs-btn-active-bg: #0b4c1a !important;
  --bs-btn-active-border-color: #0b4c1a !important;
  --bs-btn-disabled-bg: #087021 !important;
  --bs-btn-disabled-border-color: #087021 !important;
  --bs-btn-color: #fff !important;
  --bs-btn-hover-color: #fff !important;
  --bs-btn-active-color: #fff !important;
  background-color: #087021 !important;
  border-color: #087021 !important;
  color: #fff !important;
}

.btn.btn-primary:hover,
.btn-primary:hover {
  background-color: #0b4c1a !important;
  border-color: #0b4c1a !important;
}