/* ------------------------------------
  LCI Core Customizations
------------------------------------ */
/* details/accordian styles */
/* Add a custom transition when opening/closing. */
.lcicore-details .wp-block-details {
	transition: all 0.5s ease-in-out;
}
/* Add padding to open summary bottom. */
.lcicore-details[open] wp-block-details[open] {
  padding-bottom: .5rem;
}
.lcicore-details .wp-block-details > * {
  margin: 1em 1.25em;
  margin-block-start: 1rem;
}
/* summary element styling. */
.lcicore-details .wp-block-details summary {
	/*transition: all 0.5s ease-in-out;*/
  color: var(--link-color, #046b99);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: from-font;
	font-weight: 700;
  appearance: none;
  background: none;
  border: none;
  border-radius: none;
  box-shadow: none;
  font-size: inherit;
  margin: .5rem;
  padding: 0 0 0 0;
}
.lcicore-details .wp-block-details summary::marker {
  color: #214a68;
  font-size: .75em;
}
.lcicore-details .wp-block-details summary:hover {
  color: var(--color-p2-darker, #214a68);
}
/* Change the background of the summary element based on state. */
.lcicore-details[open] .wp-block-details[open] summary,
.lcicore-details[open] .wp-block-details[open] summary:focus {
  color: var(--link-color, #046b99);
}

.lcicore-details[open] .wp-block-details[open] summary:hover {
  color: var(--color-p2-darker, #214a68);
}

/* Bugfix: LSPD-102 */
.featured-search {
  .container {
    #Search {
      .gsc-search-button {
        width: auto;
        min-width: 1%;
      }
    }
  }
}

/* Bugfix: LSPD-103 */
@media (width >= 992px) {
  .branding .header-organization-banner a {
    max-width: 55%;
  }

  /* Override for icon menu */
  .branding .header-organization-banner.icon-menu a {
    max-width: 40%;
  }

  .branding .header-organization-banner a .logo-assets {
    max-width: 100%; 
  }

  .branding .header-organization-banner a .logo-assets .logo-text {
    max-width: 100%; 
  }

  .branding .header-organization-banner a .logo-assets .logo-text .logo-dept {
    max-width: 100%; 
  }

  .branding .header-organization-banner .navigation {
    max-width: 60%;
    display: flex;
    justify-content: space-around;
  }
}

@media (width < 992px) {
  .branding {
    & .header-organization-banner {
      max-width: 100%;
    }
  }
}

.branding {
  & .header-organization-banner {
    & a {
      & .logo-assets {
        flex-flow: inherit;
        & .logo-text {
          .logo-dept {
            height: auto;
          }
        }
      }
    }
  }
}

/* Bugfix: LSPD-167 */
.fullspan {
    position: relative; /* Keeps the div in the document flow */
    width: 100vw; /* Full viewport width */
    max-width: none; /* Override any max-width constraints from container divs */
    margin-left: calc(50% - 50vw); /* Align to the viewport's left edge */
    margin-right: calc(50% - 50vw); /* Align to the viewport's right edge */
}

/* ------------------------------------
  Pagination Styles
------------------------------------ */
/* WordPress Block Query Pagination Styles */
.wp-block-query-pagination {
  white-space: nowrap;
  font-size: .9rem;
}
.wp-block-query-pagination .page-numbers {
	padding: 6px 14px;
	display: inline-block;
	color: #4a4958;
  margin: var(--s-sm, 0.25rem);
  text-decoration: none !important;
}
.wp-block-query-pagination .page-numbers.current {
  font-weight:700;
  box-shadow: inset 0 0 0 1px #d4d4d7;
}
.wp-block-query-pagination-previous {
	padding: 6px 14px;
  margin: var(--s-sm, 0.25rem);
  text-decoration: none !important;
	color: #4a4958;
}
.wp-block-query-pagination-next {
	padding: 6px 14px;
  margin: var(--s-sm, 0.25rem);
  text-decoration: none !important;
	color: #4a4958;
}
.wp-block-query-pagination .page-numbers:hover {
	box-shadow: inset 0 0 0 3px #d4d4d7;
}
.wp-block-query-pagination-previous:hover {
	box-shadow: inset 0 0 0 3px #d4d4d7;
	color: #4a4958;
}
.wp-block-query-pagination-next:hover {
	box-shadow: inset 0 0 0 3px #d4d4d7;
	color: #4a4958;
}

/* Custom LCI Core Template Pagination Styles */
.nav-links {
  white-space: nowrap;
  font-size: .9rem;
  text-decoration: none !important;
}
.page-numbers {
  padding: 6px 14px;
  display: inline-block;
  color: #4a4958;
  margin: var(--s-sm, 0.25rem);
  text-decoration: none !important;
}
.page-numbers.current {
  font-weight:700;
  box-shadow: inset 0 0 0 1px #d4d4d7;
}
.prev {
	padding: 6px 14px;
  margin: var(--s-sm, 0.25rem);
  text-decoration: none !important;
}
.next {
	padding: 6px 14px;
  margin: var(--s-sm, 0.25rem);
  text-decoration: none !important;
}
.page-numbers:hover {
	box-shadow: inset 0 0 0 3px #d4d4d7;
}
.prev:hover {
	box-shadow: inset 0 0 0 3px #d4d4d7;
}
.next:hover {
	box-shadow: inset 0 0 0 3px #d4d4d7;
}

/* HR Block Style for WP Seperator: Understated */
.wp-block-separator.is-style-default {
  /* margin: 1rem 0; */
  color: inherit;
  border: 0;
  border-top: var(--bs-border-width) solid;
  opacity: 0.25;
}

.wp-block-separator.is-style-understated {
  border: none;
  border-bottom: 2px dotted;
}

.wp-block-separator.is-style-light {
  border: none;
  border-bottom: 1px solid #eee;
}

/* Link styles for links in a paragraph in a WP cover block need to inherit colors */
.wp-block-cover__inner-container p a,
.wp-block-cover__inner-container p a:hover,
.wp-block-cover__inner-container p a:focus {
    color: inherit;
}

.wp-block-cover p a,
.wp-block-cover p a:hover,
.wp-block-cover p a:focus {
    color: inherit;
}

/* -----------------------------------------
   TABLES - /src/css/cagov/tables.css
----------------------------------------- */
/* Base styles for all WordPress tables */
.wp-block-table {
  width: 100%;
  margin-bottom: 1rem;
  border-collapse: collapse !important;
  --bs-table-color: var(--gray-900, #3b3a48);
  --bs-table-bg: var(--bs-body-bg, #fff);
  --bs-table-border-color: #ddd; /* Default border color for striped and default */
  --bs-table-striped-color: #3b3a48;
  --bs-table-striped-bg: #f0f0f0;
  --bs-table-shaded-bg-body: #f3f3f4; /* Body background for shaded */
  --bs-table-shaded-bg-header: #d9d9d9; /* Header background for shaded */
}

/* Remove borders and padding from the figure wrapping the table */
figure.wp-block-table {
  border: none !important;
  background-color: transparent !important;
  margin: 0; /* Remove any default margin */
  padding: 0; /* Remove any default padding */
}

/* General styles for th and td */
.wp-block-table th, 
.wp-block-table td {
  padding: 8px;
  color: var(--bs-table-color);
  background-color: var(--bs-table-bg);
  border-bottom: 1px solid var(--bs-table-border-color) !important; /* Bottom border */
  border-left: 0 !important; /* No left border */
  border-right: 0 !important; /* No right border */
  border-top: 0 !important; /* No top border */
  text-align: left;
  vertical-align: top;
  font-family: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "sans-serif";
  font-size: 18px;
  line-height: 27px;
}

/* Styles for all header cells across all styles */
.wp-block-table thead th,
figure.wp-block-table thead th {
  text-size-adjust: 100%;
  font-family: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "sans-serif";
  font-feature-settings: normal;
  font-kerning: auto;
  font-optical-sizing: auto;
  font-size: 19.032px;
  font-size-adjust: none;
  font-stretch: 100%;
  font-style: normal;
  font-variant-alternates: normal;
  font-variant-caps: normal;
  font-variant-east-asian: normal;
  font-variant-emoji: normal;
  font-variant-ligatures: normal;
  font-variant-numeric: normal;
  font-variant-position: normal;
  font-variation-settings: normal;
  font-weight: 700;
  line-height: 28.548px;
  text-align: left;
  text-indent: 0px;
  vertical-align: bottom;
}

/* Shaded style for both editor and front-end */
.wp-block-table.is-style-shaded tbody tr td,
figure.wp-block-table.is-style-shaded table tbody tr td {
  background-color: var(--bs-table-shaded-bg-body) !important; /* Body shading */
  border: 2px solid #fff !important; /* White border around each cell */
}

.wp-block-table.is-style-shaded thead tr th,
figure.wp-block-table.is-style-shaded table thead tr th,
.wp-block-table.is-style-shaded tfoot tr th,
figure.wp-block-table.is-style-shaded table tfoot tr th {
  background-color: var(--bs-table-shaded-bg-header) !important; /* Header and footer shading */
  border: 2px solid #fff !important; /* White border around each header and footer cell */
}

/* Remove unwanted border from shaded table headers and footers */
.wp-block-table.is-style-shaded thead,
figure.wp-block-table.is-style-shaded table thead,
.wp-block-table.is-style-shaded tfoot,
figure.wp-block-table.is-style-shaded table tfoot {
  border-bottom: none !important;
}

/* Striped style for editor and front-end */
.wp-block-table.is-style-striped tbody tr:nth-of-type(odd) td,
figure.wp-block-table.is-style-striped table tbody tr:nth-of-type(odd) td,
.wp-block-table.is-style-stripes tbody tr:nth-of-type(odd) td,
figure.wp-block-table.is-style-stripes table tbody tr:nth-of-type(odd) td {
  background-color: var(--bs-table-striped-bg) !important;
  color: var(--bs-table-striped-color) !important;
  border-bottom: 1px solid var(--bs-table-border-color) !important;
}

/* Override unwanted border-bottom for header cells */
.wp-block-table thead {
  border-bottom: none !important; /* Remove unwanted bottom border */
}

/* Ensure consistent bottom border for header cells in default and striped styles */
.wp-block-table.is-style-default thead th,
figure.wp-block-table.is-style-default table thead th,
.wp-block-table.is-style-striped thead th,
figure.wp-block-table.is-style-striped table thead th {
  border-bottom: 1px solid #ddd !important; /* Light border for headers */
}

/* Footer styling for default, striped, and shaded styles */
.wp-block-table tfoot td, 
figure.wp-block-table tfoot td,
.wp-block-table tfoot,
figure.wp-block-table tfoot {
  border-top: none !important; /* Remove top border from footer */
  border-bottom: none !important; /* Remove bottom border from footer */
}

.wp-block-table.is-style-default tfoot td,
figure.wp-block-table.is-style-default table tfoot td {
  background-color: #ffffff; /* Simple background for default footer */
}

.wp-block-table.is-style-striped tfoot td,
figure.wp-block-table.is-style-striped table tfoot td {
  background-color: #eaeaea; /* Darker stripe for striped footer */
}

.wp-block-table.is-style-shaded tfoot td,
figure.wp-block-table.is-style-shaded table tfoot td {
  background-color: var(--bs-table-shaded-bg-body) !important; /* Same shading as body */
  border-left: 2px solid #fff !important; /* White left border */
  border-right: 2px solid #fff !important; /* White right border */
  border-top: none !important; /* Ensure no top border */
  border-bottom: none !important; /* Ensure no bottom border */
}

/* Responsive styles */
.wp-block-table.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Reset box model for all elements */
*, *::before, *::after {
  box-sizing: border-box;
}

/* Parallax Center Box Sizing */

/* Base width styles for the smallest screens */
.parallax-bg .width-30pct {
  width: 70% !important; /* Default to 70% for the smallest screens */
}

.parallax-bg .width-50pct {
  width: 70% !important; /* Default to 70% for the smallest screens */
}

.parallax-bg .width-70pct {
  width: 70% !important; /* Remain at 70% for all screen sizes */
}

/* Adjust widths for larger screens */
@media (min-width: 768px) {
  .parallax-bg .width-30pct {
    width: 50% !important; /* Convert to 50% above 758px */
  }
}

@media (min-width: 993px) {
  .parallax-bg .width-30pct {
    width: 30% !important; /* Convert to 30% above 992px */
  }

  .parallax-bg .width-50pct {
    width: 50% !important; /* Convert to 50% above 992px */
  }
}

.main-content a.link-before.no-underline {
  text-decoration: none; /* Remove underline if desired */
  color: var(--color-p2); /* Default text color */
  transition: color 0.3s ease; /* Smooth transition for color change */
}

.main-content a.link-before.no-underline:hover,
.main-content a.link-before.no-underline:focus {
  color: var(--color-p2-darker); /* Hover and focus text color */
  text-decoration: underline; /* Add underline on hover if desired */
}

/* -----------------------------------------
   FONT AWESOME ICONS - Mega Menu
----------------------------------------- */

.top-level-nav .nav-item .sub-nav .second-level-link [class^="fa-"] {
  line-height: var(--bs-body-line-height);
}

@media (width >= 992px) {
  .top-level-nav .nav-item .sub-nav .second-level-link [class^="fa-"] {
    color: var(--gray-700, #5e5e6a);
  }
}

.first-level-link > span[class^="fa-"]:not(.carrot), 
.first-level-btn > span[class^="fa-"]:not(.carrot) {
  line-height: var(--bs-body-line-height);
}

@media (width >= 992px) {
  .first-level-link > span[class^="fa-"]:not(.carrot), 
  .first-level-btn > span[class^="fa-"]:not(.carrot) {
      display: block;
      font-size: 32px;
      color: var(--gray-700, #5e5e6a);
  }
}
 
@media (width <= 991px) {
.top-level-nav .nav-item .first-level-link .first-level-btn {
    color: var(--white, #fff);
    display: block;
    padding: 1rem 0 1rem 1rem;
    margin: 0 2px;
    text-decoration: none;
  }
}

/* This fixes a bug on chrome that shows a scroll bar when it isn't needed */
cagov-pagination .cagov-pagination__list {
  overflow-x: auto !important;
}

/* -----------------------------------------
   LINK GRID
   /src/css/cagov/link-grid.css
----------------------------------------- */

.link-grid {
  display: block;
  border: 1px solid var(--gray-200, #d4d4d7);
  border-radius: 5px;
  font-size: 1.4rem;
  font-weight: 700;
  padding: 1rem 2.25rem 1rem 1rem;
  position: relative;
  text-decoration: none !important;
  height: 100%;
  color: var(--color-p2, #046b99);
  border-bottom: 4px solid var(--color-p2, #046b99);
}

.link-grid:hover,
.link-grid:focus {
  background: var(--gray-100, #f3f3f4);
  color: var(--color-p2-darker, #214a68);
}

.link-grid:focus {
  outline: 2px solid var(--outline-default-color);
}

.link-grid.internal-icon::after {
  font-family: CaGov;
  content: "5";
  position: absolute;
  top: 0.8rem;
  right: 0.7rem;
  font-size: 1.6rem;
}

.link-grid.external-icon::after {
  font-family: CaGov;
  content: "\e9ed";
  position: absolute;
  top: 1.4rem;
  right: 0.7rem;
  font-size: 1rem;
}

.link-before::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.link-grid .external-link-icon {
  display: none; /* Hides the external link icon within link-grid elements */
}

.article-image {
  width: 100%;
  height: auto;
  display: inline-block;
}

.header-organization-banner {
  display: flex;
  align-items: center;
  justify-content: flex-start; /* Ensure alignment doesn't affect wrapping */
}

/* -----------------------------------------
   MODAL Modifications
----------------------------------------- */
.modal-body-video {
    padding-bottom: 56.25%; /* 16:9 aspect ratio for video */
    position: relative;
    height: 0;
    overflow: hidden;
    max-width: 100%; /* Ensures the modal-body itself is full width */
}

.modal-body-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0; /* Removes any default border around the iframe */
}