/* ============================================================
   Clone runtime overrides — reveal JS-gated content, wire the
   popup/menu/carousel that originally depended on the WP JS stack.
   ============================================================ */

/* Entrance-animation elements must never stay hidden if the reveal
   JS is slow/absent. clone.js still replays the animation on scroll. */
.elementor-invisible { visibility: visible !important; }

/* Elementor popup markup renders inline in the DOM; keep it out of the
   flow until our modal opens it. */
.elementor-location-popup { display: none; }

/* -------- appointment modal (popup 921) --------
   Mirrors the reference #elementor-popup-modal-921: anchored to the
   bottom-right corner (footer side) and sliding up from below on open.
   Overlay is transparent + click-through so the page behind stays
   interactive, matching Elementor's "prevent close on background click". */
.clone-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
  align-items: flex-end;      /* bottom  */
  justify-content: flex-end;  /* right   */
  padding: 0;
  background: transparent;
  pointer-events: none;
}
.clone-modal-overlay.active,
.clone-modal-overlay.closing { display: flex; }

.clone-modal-overlay .elementor-location-popup {
  display: block;
  position: relative;
  width: 400px;
  max-width: calc(100vw - 40px);
  max-height: 90vh;
  overflow: auto;
  margin: 0 20px 20px 0;       /* offset from bottom-right corner */
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, 0.2);
  pointer-events: auto;
}

/* smooth slide-up entrance (fadeInUp) — plays on display:none -> flex */
@keyframes cloneSlideUp {
  from { transform: translateY(120%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
@keyframes cloneSlideDown {
  from { transform: translateY(0);    opacity: 1; }
  to   { transform: translateY(120%); opacity: 0; }
}
.clone-modal-overlay.active .elementor-location-popup {
  animation: cloneSlideUp 0.5s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}
.clone-modal-overlay.closing .elementor-location-popup {
  animation: cloneSlideDown 0.35s ease-in both;
}
@media (prefers-reduced-motion: reduce) {
  .clone-modal-overlay.active .elementor-location-popup,
  .clone-modal-overlay.closing .elementor-location-popup { animation: none; }
}

/* defeat the global `button{background:#32373c;border-radius:230px;padding:…}`
   rules (WP core + post-921.css) that turned the close control into a dark
   circle — leave only a large white "X" */
.clone-modal-overlay .clone-modal-close {
  position: absolute;
  top: 12px;
  right: 16px;
  z-index: 5;
  width: auto;
  height: auto;
  padding: 0 !important;
  margin: 0;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  font-size: 44px !important;
  line-height: 1;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}

/* "Iniciar Atendimento" — reference sets line-height:1px which knocks the
   icon + label off-center; recentre them vertically inside the button */
.clone-modal-overlay .elementor-921 .elementor-button[type="submit"] {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  min-height: 44px;
}
.clone-modal-overlay .elementor-921 .elementor-button[type="submit"] .elementor-button-content-wrapper {
  align-items: center;
  justify-content: center;
}
.clone-modal-overlay .elementor-921 .elementor-button[type="submit"] .elementor-button-text {
  line-height: 1.2;
}

/* mobile: reference centers the card horizontally, keeps it at the bottom */
@media (max-width: 767px) {
  .clone-modal-overlay { justify-content: center; }
  .clone-modal-overlay .elementor-location-popup {
    width: 335px;
    max-width: calc(100vw - 20px);
    margin: 0 10px 10px 10px;
  }
  .clone-modal-overlay .clone-modal-close { top: 12px; right: 12px; }
}

/* -------- elementskit mobile offcanvas menu -------- */
.elementskit-menu-container.elementskit-menu-offcanvas-elements.active,
.elementskit-menu-overlay.active { display: block; }

/* desktop dropdown reveal on hover (elementskit) */
@media (min-width: 1025px) {
  .elementskit-navbar-nav .menu-item-has-children:hover > .elementskit-submenu-panel {
    display: block;
    opacity: 1;
    visibility: visible;
  }
}
/* mobile: open submenu when parent toggled */
.elementskit-navbar-nav .menu-item-has-children.clone-submenu-open > .elementskit-submenu-panel {
  display: block;
}

/* -------- blog posts thumbnail (Elementor classic skin) --------
   Elementor sizes the absolutely-positioned thumbnail to COVER its ratio box
   via frontend JS (measures image vs container ratio, sets the larger side to
   100%). Without that JS the image keeps its base size and sits centered,
   leaving a gap above/below. Force it to fill the box with object-fit:cover so
   the image reaches the top edge of the card, matching the original. */
.elementor-posts-container .elementor-post__thumbnail img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: none !important;
}

/* -------- swiper fallback layout (testimonials) -------- */
.ekit-main-swiper.swiper { overflow: hidden; }
.ekit-main-swiper .swiper-wrapper {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  transition: transform 0.45s ease;
  will-change: transform;
}
.ekit-main-swiper .swiper-slide { flex: 0 0 100%; max-width: 100%; }
.ekit-main-swiper .swiper-navigation-button { cursor: pointer; user-select: none; }

/* -------- inline self-hosted video (quem-somos) --------
   Base ElementSKit CSS forces the box to 16:9 and cover-crops the <video>.
   Once playing, show the video at its real height (no crop), width capped at
   the container's current width. Class .is-playing added by clone.js on play. */
.ekit-inline-video-content.is-playing { aspect-ratio: auto !important; }
.ekit-inline-video-content.is-playing::before { display: none !important; }
.ekit-wid-con .ekit-video-frame .ekit-inline-video-content.is-playing video.inline_video_class {
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

/* SEO: título H1 acessível para leitores de tela (páginas sem H1 visível) */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* SEO: links inline dentro do texto de um icon-list.
   `.elementor-widget .elementor-icon-list-item a{display:flex}` (widget-icon-list.min.css)
   transforma qualquer link do item em bloco e quebra a linha. Aqui os links de
   navegação continuam sendo filhos diretos do <li>; só os que estão dentro do
   texto voltam a ser inline. */
.elementor-widget .elementor-icon-list-item .elementor-icon-list-text a {
  display: inline;
  align-items: baseline;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Mapa do site: lista numerada com a numeração própria (1.1, 1.2, ...),
   já que <ol> aninhado não produz essa forma sem contadores CSS. */
.inab-sitemap .inab-sitemap-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.inab-sitemap .inab-sitemap-list li {
  display: flex;
  gap: 10px;
  align-items: baseline;
  padding: 5px 0;
}
.inab-sitemap .inab-sitemap-num {
  flex: 0 0 auto;
  min-width: 2.6em;
  font-variant-numeric: tabular-nums;
  color: var(--e-global-color-accent, #ca974e);
  font-weight: 600;
}
.inab-sitemap .inab-sitemap-list a {
  text-decoration: underline;
  text-underline-offset: 2px;
}