/* Classic Footer (Site Parts) - taken from assets/css/global/footer.css
 * (everything but the newsletter-sign-up section, which is its own block/CSS).
 * footer.css itself is left untouched - the legacy nb_footer_top()/
 * nb_footer_bottom() hook path still needs it when Theme Builder is off.
 *
 * The one edit against that source: footer.css's `#footer` prefix, which there
 * matches footer.php's wrapper, is `.classic-footer` here - the block's own
 * element, present in the editor canvas as well as the front end. Never
 * reintroduce `#footer`: the canvas has no such ancestor, so it only ever
 * matched by faking the id onto this element, where an id selector then
 * outranked the .footer-version-2 rules and rendered the block differently
 * than the front end. */

.classic-footer {
  color: #fff;
  background: #444;
  font-size: 0.875em;
  line-height: 1.5;
}

.classic-footer .wpt-container.footer-top {
  max-width: 1230px;
  margin: auto;
  padding: 80px 15px 60px;
}

.classic-footer .footer-top .wpt-row {
  display: grid;
  grid-template-columns: 250px auto auto;
  grid-gap: 30px;
}

@media (max-width: 899px) {
  .classic-footer .footer-top .wpt-row {
    grid-template-columns: auto auto;
  }

  #footer-1 {
    grid-column: span 2;
    text-align: center;
  }
}

@media (max-width: 599px) {
  .classic-footer .footer-top .wpt-row {
    grid-template-columns: auto;
  }

  #footer-1 {
    grid-column: span 1;
  }
}

.classic-footer h2 {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 1px;
  padding-bottom: 0.4em;
  margin-bottom: 1.1em;
  border-bottom: 1px solid currentColor;
  text-align: left;
  /* !important: footer.css's `#footer h2` (#fff) outranks this under Theme Builder. */
  color: inherit !important;
  border-bottom-color: currentColor !important;
  font-family: var(--wpt-headings-secondary-font);
}

.classic-footer h2::after {
  content: unset;
}

.classic-footer ul.wpt-menu > li {
  display: block;
  position: relative;
  list-style: none;
  margin: 0 0 10px;
  padding: 0;
}

.classic-footer ul.wpt-menu > li::before,
.classic-footer ul.wpt-menu .sub-menu > li::before {
  content: "\f105";
  position: absolute;
  left: 0;
  font-family: "Font Awesome 6 Pro";
  font-weight: 800;
  color: inherit;
}

.classic-footer ul.wpt-menu > li a {
  text-decoration: none;
  display: block;
  padding-left: 15px;
  transition-duration: 0.3s;
}

.classic-footer ul.wpt-menu > li a:hover {
  transform: translateX(10px);
}

.classic-footer ul.wpt-menu {
  border: none;
  list-style: none;
  text-align: left;
  padding: 0;
  margin: 0;
  column-count: 2;
}

.classic-footer ul.wpt-menu > li {
  list-style: none;
}

/* Keeps a parent and its sub-menu together in the same column-count break,
 * so the sub-menu can't get split away from .menu-item-has-children. */
.classic-footer ul.wpt-menu > li.menu-item-has-children {
  break-inside: avoid;
}

.classic-footer ul.wpt-menu .sub-menu {
  display: block;
  list-style: none;
  margin: 10px 0 0 15px;
  padding: 0;
}

.classic-footer ul.wpt-menu .sub-menu > li {
  position: relative;
  margin: 0 0 10px;
}

.classic-footer .footer-bottom a {
  color: inherit !important;
}

.classic-footer #footer-branding img {
  width: 100%;
  height: auto;
  max-width: 250px;
}

.classic-footer #copyright {
  background: rgba(0, 0, 0, 0.2);
}

.classic-footer #copyright p {
  margin: 0;
  font-size: 0.75em;
  padding: 10px;
  text-align: center;
  vertical-align: center;
}

.classic-footer #copyright .newbook-logo img {
  max-width: 150px;
  margin-left: 6px;
  filter: brightness(0) invert(1);
}

.classic-footer .block {
  margin-bottom: 10px;
}

.classic-footer #social_media_links > li {
  margin-right: 12px;
}

.classic-footer #social_media_links > li a i {
  font-size: 1.125em;
}

.classic-footer #social_media_links > li a:hover i {
  transform: scale(1.25);
}

.classic-footer,
.classic-footer a {
  color: var(--wpt-footer-text-colour);
  font-family: var(--wpt-primary-font);
  text-decoration: none;
}

.classic-footer td a {
  display: inline-block;
  transition: 0.3s ease;
}

.classic-footer td a:hover {
  transform: translateX(10px);
}

.classic-footer table > tbody {
  border: none;
}

.classic-footer table.contact-table {
  width: 100%;
}

.classic-footer table.contact-table td {
  vertical-align: top;
  padding: 0 16px 8px 0;
}

.classic-footer table.contact-table td:first-child {
  width: 1px;
}

.classic-footer.footer-version-2 {
  background-size: cover !important;
  background-position: 50% 50% !important;
  padding: 65px 20px 100px;
  text-transform: uppercase;
  position: relative;
  font-size: 12px;
  letter-spacing: 0.1em;
  word-break: break-word;
}

.classic-footer.footer-version-2 .contact-table td {
  font-size: 12px;
}

/* The :before tint covers the whole footer at z-index 0, so anything that has
 * to stay readable needs lifting above it. */
.classic-footer.footer-version-2 :is(.footer-bottom, .footer-top) {
  position: relative;
}

.classic-footer.footer-version-2 .footer-bottom {
  max-width: 1230px;
  margin: auto;
}

/* !important per the #footer collision note below - its ungated padding rule would otherwise outrank this one under Theme Builder. */
.classic-footer.footer-version-2 .wpt-container.footer-top {
  padding: 44px 53px 40px !important;
}

.classic-footer.footer-version-2 #footer-2 {
  order: 1;
}

/* !important per the note below - footer.css's ungated .wpt-row grid also reaches in here. */
.classic-footer.footer-version-2 .footer-top .wpt-row {
  grid-template-columns: 25% 1fr 1fr !important;
}

.classic-footer.footer-version-2 #footer-1 {
  align-self: center;
  margin-right: 22px;
}

/* !important per the note below - footer.css's ungated #footer-branding img max-width also reaches in here. */
.classic-footer.footer-version-2 #footer-1 img {
  width: 100% !important;
  max-width: 280px !important;
}

.classic-footer.footer-version-2 h2 {
  margin-top: 0;
  padding-top: 0;
  line-height: 1;
}

.classic-footer.footer-version-2:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  z-index: 0;
  backdrop-filter: blur(3px);
}

.classic-footer.footer-version-2.footer-version-2-no-bg-image:before {
  content: unset;
}

.classic-footer.footer-version-2 #copyright {
  padding: 15px 18px 18px;
}

.classic-footer.footer-version-2 #copyright > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 10px;
  line-height: 1;
  flex-wrap: wrap;
  gap: 11px;
  color: white;
}

.classic-footer.footer-version-2 #copyright .newbook-logo {
  max-width: unset;
  display: flex;
  align-items: center;
}

.classic-footer.footer-version-2 #copyright .newbook-logo svg {
  width: 90px;
  margin-left: 7px;
  margin-top: -2px;
}

.classic-footer.footer-version-2 #copyright > div span span {
  padding: 0 8px;
}

/* Scoped to the direct .wpt-menu children (not a bare `li`/`ul`) so it
 * can't also grab the nested .sub-menu and force it into the same
 * 2-col layout / flex reset as the top-level items.
 *
 * !important stays here (unlike the #footer twins in footer.css, which win
 * on specificity alone): footer.php always wraps Theme Builder footers in
 * <footer id="footer">, and footer.css is enqueued unconditionally, so its
 * #footer-scoped rules reach in here too and, being id-scoped, would
 * outrank this class-only selector no matter how many classes it has. A
 * `#footer` prefix here would win on the front end but never match in the
 * block editor canvas, which has no such ancestor - see the file banner. */
.classic-footer.footer-version-2 .wpt-menu > li:before,
.classic-footer.footer-version-2 .wpt-menu .sub-menu > li:before {
  font-weight: 100 !important;
  font-size: 15px;
  line-height: 19px;
}

.classic-footer.footer-version-2 .wpt-menu > li {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  margin: 0 0 7px !important;
}

/* No trailing margin under the final item - column-count has no gap-like
 * property to add it back, unlike the grid it replaced. Only trims the last
 * column (:last-child is list-wide, not per-column - CSS has no "last in
 * column" selector), so the first column can still end 7px heavier.
 * !important per the note above - competing with the id-scoped base in
 * footer.css. */
.classic-footer.footer-version-2 .wpt-menu > li:last-child {
  margin-bottom: 0 !important;
}

/* Tightened to match the version-2 7px rhythm above (base sub-menu values
 * are the looser version-1 10px). !important per the note above. */
.classic-footer.footer-version-2 .wpt-menu .sub-menu {
  margin: 7px 0 0 15px !important;
}

.classic-footer.footer-version-2 .wpt-menu .sub-menu > li {
  margin: 0 0 7px !important;
}

/* column-count (not grid) so a top-level item with a sub-menu only grows its
 * own column, instead of a grid row pairing it with an unrelated sibling and
 * stretching that sibling's cell to match. column-count already matches the
 * base .classic-footer ul.wpt-menu value below - only the gap needs
 * overriding. */
.classic-footer.footer-version-2 .wpt-menu {
  column-gap: 7px;
}

.rounded-corners-true .classic-footer.footer-version-2 .footer-top {
  border-radius: 20px 20px 0 0;
}

.rounded-corners-standard .classic-footer.footer-version-2 .footer-top {
  border-radius: 6px 6px 0 0;
}

.rounded-corners-true .classic-footer.footer-version-2 .footer-bottom {
  border-radius: 0 0 20px 20px !important;
  overflow: hidden;
}

.rounded-corners-standard .classic-footer.footer-version-2 .footer-bottom {
  border-radius: 0 0 6px 6px !important;
  overflow: hidden;
}

/* Preview only: the block's own div carries footer-version-2 and
 * rounded-corners-* on the same element, not as an <html> ancestor, so the
 * rules above never match there. */
.classic-footer.footer-version-2.rounded-corners-true .footer-top {
  border-radius: 20px 20px 0 0;
}

.classic-footer.footer-version-2.rounded-corners-standard .footer-top {
  border-radius: 6px 6px 0 0;
}

.classic-footer.footer-version-2.rounded-corners-true .footer-bottom {
  border-radius: 0 0 20px 20px !important;
  overflow: hidden;
}

.classic-footer.footer-version-2.rounded-corners-standard .footer-bottom {
  border-radius: 0 0 6px 6px !important;
  overflow: hidden;
}

.classic-footer #social_media_links_footer {
  list-style: none;
  padding: 0;
  margin: 0.2em 0 0 0;
  columns: 0;
  display: inline-flex !important;
  font-size: 23px;
  gap: 15px !important;
}

.classic-footer #social_media_links_footer .fa-tripadvisor:before {
  width: 30px;
}

.footer-version-2 #social_media_links_footer .fa-tripadvisor:before {
  background-color: var(--wpt-footer-text-colour);
}

.classic-footer.footer-version-2 .contact-table i {
  font-size: 16px;
  color: var(--wpt-footer-text-colour);
}

.classic-footer.footer-version-2 .fas.fa-phone:before {
  content: "\f879";
}

@media (max-width: 1000px) {
  .classic-footer.footer-version-2 #footer-1 {
    grid-column: span 2;
    justify-content: center;
    display: flex;
  }

  /* !important per the note above - the colliding rule's own 899px breakpoint doesn't line up with this one. */
  .classic-footer.footer-version-2 .footer-top .wpt-row {
    grid-template-columns: 1fr 1fr !important;
  }

  .classic-footer.footer-version-2 #footer-1 {
    margin: 0;
  }
}

@media (max-width: 790px) {
  .classic-footer.footer-version-2 #footer-3 .wpt-menu {
    column-count: 1;
  }

  /* !important per the note above - the colliding rule has no media guard, so it still competes at this breakpoint. */
  .classic-footer.footer-version-2 .wpt-container.footer-top {
    padding: 30px !important;
    word-break: break-word;
  }
}

@media (max-width: 590px) {
  /* !important per the note above - the colliding rule's own 599px breakpoint doesn't line up with this one. */
  .classic-footer.footer-version-2 .footer-top .wpt-row {
    grid-template-columns: 1fr !important;
  }

  .classic-footer.footer-version-2 #footer-1 {
    grid-column: span 1;
  }
}