/* ==========================================================================
   components.css — Menu, social links, mobile menu, carousel, footer
   ========================================================================== */

/* --- Main menu (#access) ------------------------------------------------- */
#access ul li a,
#access ul ul,
#access::after { background-color: #000000; }

#access ul li a {
  font-family: var(--ff-main);
  font-size: 80%;
  font-weight: 400;
}

#access > div > ul > li,
#access > div > ul > li > a { color: #ffffff; }

#access ul.sub-menu li a,
#access ul.children li a { color: #ffffff; }

#access ul.sub-menu li:hover > a,
#access ul.children li:hover > a { background-color: rgba(255, 255, 255, 0.1); }

/* Hover state: white background, black text */
#access > div > ul > li:hover > a {
  color: #000000;
  background-color: #ffffff;
}

/* Borders for submenus and active items */
#access ul > li.current_page_item > a,
#access ul > li.current-menu-item > a,
#access ul > li.current_page_ancestor > a,
#access ul > li.current-menu-ancestor > a,
#access .sub-menu,
#access .children { border-top-color: #ffffff; }

#access ul ul ul { border-left-color: rgba(255, 255, 255, 0.5); }

#access ul.children > li.current_page_item > a,
#access ul.sub-menu > li.current-menu-item > a,
#access ul.children > li.current_page_ancestor > a,
#access ul.sub-menu > li.current-menu-ancestor > a { border-color: #ffffff; }

/* Custom override: hover maintains black/white without underline */
body #access > div > ul > li:hover a {
  background-color: #000000;
  color: #ffffff;
  text-decoration: none;
}

/* --- Header social links (#sheader.socials) -------------------------------- */
.socials a:before { color: #ffffff; }
.socials a:hover:before { color: #ffffff; }

/* --- Mobile menu ------------------------------------------------------- */
nav#mobile-menu {
  background-color: #000000;
  color: #ffffff;
}
#mobile-menu .menu-main-search input[type="search"] { color: #ffffff; }

nav#mobile-menu #nav-cancel { margin-top: 0; }
nav#mobile-menu > div { margin-top: 4em; }
nav#mobile-menu .sub-menu { margin-left: 0.5em; }

/* --- Back-to-top button (#toTop) ----------------------------------------- */
#toTop { background-color: rgba(5, 5, 5, 0.8); }
#toTop .icon-back2top:before,
#toTop:hover .icon-back2top:before { color: #ffffff; }

/* ==========================================================================
   Slider instance configuration
   ========================================================================== */
.serious-slider-9-rnd9125 { max-width: 1000px; }

.serious-slider-9-rnd9125.seriousslider-sizing1,
.serious-slider-9-rnd9125.seriousslider-sizing1 img { max-height: 667px; }

.serious-slider-9-rnd9125.seriousslider-sizing2,
.serious-slider-9-rnd9125.seriousslider-sizing2 img.item-image { height: 667px; }

.serious-slider-9-rnd9125 .seriousslider-caption-inside {
  max-width: 1030px;
  font-size: 1em;
}

/* ==========================================================================
   FRONTERAS stats table — stack into per-item cards below 700px
   ========================================================================== */
@media (max-width: 700px) {
  .stats-table,
  .stats-table tbody,
  .stats-table tr,
  .stats-table th,
  .stats-table td {
    display: block;
  }

  .stats-table {
    display: grid;
    grid-template-columns: 1fr;
    width: 100% !important;
  }

  .stats-table tbody,
  .stats-table tr {
    display: contents;
  }

  .stats-table th,
  .stats-table td {
    width: 100% !important;
    text-align: center;
    padding: 6px 10px;
  }

  .stats-table th:nth-child(1),
  .stats-table td:nth-child(1) { order: 1; }
  .stats-table th:nth-child(2),
  .stats-table td:nth-child(2) { order: 2; }
  .stats-table th:nth-child(3),
  .stats-table td:nth-child(3) { order: 3; }

  .stats-table th img {
    float: none;
    margin: 0 auto 10px;
  }

  .stats-table th:not(:first-of-type) {
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin-top: 20px;
    padding-top: 24px;
  }

  .stats-table td.fuentes {
    margin-bottom: 4px;
  }
}

/* ==========================================================================
   Reports grid (informes.html)
   ========================================================================== */
.reports-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5em 1.5em;
  margin: 2em 0;
}

.report-item {
  text-align: center;
}

.report-item img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 900px) {
  .reports-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
  .reports-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Footer — logo grids
   ========================================================================== */
.flex-container-w {
  display: flex;
  flex-wrap: wrap;
  background-color: #ffffff;
  justify-content: space-around;
  margin: 10px;
  padding: 20px;
}

.flex-container-b {
  display: flex;
  flex-wrap: wrap;
  background-color: #000000;
  color: #ffffff;
  justify-content: space-around;
  margin: 10px;
  padding: 20px;
}

.flex-container-b > div {
  padding: 40px;
  align-items: center;
}