/*
 * GESTOR CLEAN — Imersivo: cabeçalho estável em todas as etapas (mobile).
 * Mantém a referência visual aprovada da Tela 01: logo no mesmo x,
 * "Passo X de 5" sobre os 5 traços, sempre ancorados no lado direito.
 * O conteúdo do catálogo não precisa de uma segunda etiqueta de progresso.
 * Carregar depois dos estilos de identificação e catálogo.
 */
@media (max-width: 799px) {
  /* Android overlays its scrollbar. Match that behavior in embedded previews
   * too: the appearance of scrolling must not move the progress to the left. */
  html:has(body.gc-booking-v81[data-gc-public-template="immersive"]) {
    scrollbar-width: none!important;
  }
  html:has(body.gc-booking-v81[data-gc-public-template="immersive"])::-webkit-scrollbar {
    width: 0!important;
    height: 0!important;
    display: none!important;
  }
  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header {
    box-sizing: border-box!important;
    display: block!important;
    width: 100%!important;
    max-width: none!important;
    min-height: 66px!important;
    height: auto!important;
    margin: 0!important;
    padding: 9px 14px!important;
    border-bottom: 0!important;
    gap: 0!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-row {
    box-sizing: border-box!important;
    display: flex!important;
    align-items: center!important;
    justify-content: flex-start!important;
    width: 100%!important;
    max-width: none!important;
    min-width: 0!important;
    min-height: 48px!important;
    height: auto!important;
    gap: 0!important;
    margin: 0!important;
    padding: 0!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-row > .gc-brand {
    display: flex!important;
    flex: 0 1 auto!important;
    align-items: center!important;
    justify-content: flex-start!important;
    width: auto!important;
    max-width: calc(100% - 100px)!important;
    min-width: 0!important;
    margin: 0!important;
    padding: 0!important;
    gap: 8px!important;
    text-align: left!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-logo {
    box-sizing: border-box!important;
    display: grid!important;
    place-items: center!important;
    flex: 0 0 48px!important;
    width: 48px!important;
    height: 48px!important;
    padding: 2px!important;
    border: 2px solid #f3fff0e8!important;
    border-radius: 12px!important;
    background: #092c36!important;
    box-shadow: 0 0 0 3px #ffffff14!important;
    overflow: hidden!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-logo img {
    display: block!important;
    width: 100%!important;
    height: 100%!important;
    max-width: 100%!important;
    max-height: 100%!important;
    object-fit: contain!important;
    border-radius: inherit!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-copy {
    box-sizing: border-box!important;
    display: block!important;
    flex: 0 1 auto!important;
    width: auto!important;
    max-width: calc(100% - 56px)!important;
    min-width: 0!important;
    margin: 0!important;
    padding: 0 0 0 8px!important;
    border-left: 1px solid #e4fff677!important;
    text-align: left!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-copy strong {
    display: block!important;
    font-size: clamp(.77rem, 3.5vw, .92rem)!important;
    line-height: 1.16!important;
    font-weight: 830!important;
    letter-spacing: -.025em!important;
    overflow-wrap: anywhere!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-copy span {
    display: block!important;
    margin-top: 3px!important;
    font-size: clamp(.65rem, 2.8vw, .74rem)!important;
    line-height: 1.22!important;
    white-space: normal!important;
    overflow-wrap: anywhere!important;
  }

  /* Fixed anchor, independent from brand-name width and step content. */
  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress-meta {
    position: absolute!important;
    display: block!important;
    inset: 9px 14px auto auto!important;
    width: auto!important;
    max-width: 96px!important;
    height: auto!important;
    margin: 0!important;
    padding: 0!important;
    z-index: 3!important;
    text-align: right!important;
    white-space: nowrap!important;
    color: var(--gc82-catalog-on-bg, #effff9)!important;
    -webkit-text-fill-color: var(--gc82-catalog-on-bg, #effff9)!important;
    font-size: .66rem!important;
    font-weight: 730!important;
    line-height: 1.2!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress-meta strong {
    display: none!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress-meta #gc81-progress-count::before {
    content: "Passo "!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress {
    position: absolute!important;
    inset: 41px 14px auto auto!important;
    box-sizing: border-box!important;
    display: flex!important;
    align-items: center!important;
    justify-content: flex-end!important;
    flex: none!important;
    width: 90px!important;
    max-width: 90px!important;
    min-width: 0!important;
    height: 4px!important;
    min-height: 4px!important;
    margin: 0!important;
    padding: 0!important;
    gap: 4px!important;
    z-index: 2!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress i {
    display: block!important;
    flex: 1 1 0!important;
    min-width: 0!important;
    width: auto!important;
    height: 4px!important;
    margin: 0!important;
    border-radius: 999px!important;
    box-shadow: none!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress i.done,
  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress i.active {
    background: var(--gc91-highlight, #a2f2d1)!important;
  }

  /* The catalog title is now the first visual element, not a duplicate step label. */
  body.gc-booking-v81[data-gc-public-template="immersive"]:not(.gc85-identification) #step0 #gc81-catalog-view > .gc-catalog-overline {
    display: none!important;
  }
}

@media (max-width: 359px) {
  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-row > .gc-brand {
    max-width: calc(100% - 83px)!important;
  }
  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress {
    width: 75px!important;
    max-width: 75px!important;
  }
}

/* Desktop / tablet share the same header anchors across journey stages.
 * Preserves the approved identification desktop dimensions as the reference.
 */
@media (min-width: 800px) {
  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header {
    --gc-stable-head-top: clamp(19px,3.5vw,33px);
    --gc-stable-head-side: clamp(17px,4vw,42px);
    box-sizing: border-box!important;
    position: relative!important;
    display: block!important;
    width: 100%!important;
    max-width: none!important;
    min-height: 0!important;
    height: auto!important;
    margin: 0!important;
    padding: var(--gc-stable-head-top) var(--gc-stable-head-side) 16px!important;
    border: 0!important;
    gap: 0!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-row {
    box-sizing: border-box!important;
    display: flex!important;
    align-items: center!important;
    justify-content: flex-start!important;
    gap: 0!important;
    width: 100%!important;
    min-height: 48px!important;
    max-width: 1160px!important;
    height: auto!important;
    min-width: 0!important;
    margin: 0 auto!important;
    padding: 0!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-row > .gc-brand {
    display: flex!important;
    flex: 0 1 auto!important;
    align-items: center!important;
    justify-content: flex-start!important;
    width: auto!important;
    max-width: calc(100% - 160px)!important;
    margin: 0!important;
    padding: 0!important;
    gap: 12px!important;
    text-align: left!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-logo {
    box-sizing: border-box!important;
    display: grid!important;
    place-items: center!important;
    flex: 0 0 48px!important;
    width: 48px!important;
    height: 48px!important;
    padding: 2px!important;
    border: 2px solid #f3fff0e8!important;
    border-radius: 13px!important;
    background: #092c36!important;
    box-shadow: 0 0 0 3px #ffffff14!important;
    overflow: hidden!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-logo img {
    display: block!important;
    width: 100%!important;
    height: 100%!important;
    max-width: 100%!important;
    max-height: 100%!important;
    object-fit: contain!important;
    border-radius: inherit!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-copy {
    flex: 0 1 auto!important;
    width: auto!important;
    max-width: min(55vw,450px)!important;
    min-width: 0!important;
    margin: 0!important;
    padding: 0 0 0 12px!important;
    border-left: 1px solid #e4fff677!important;
    text-align: left!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-copy strong {
    font-size: clamp(.88rem,2.6vw,1.35rem)!important;
    font-weight: 830!important;
    line-height: 1.16!important;
    letter-spacing: -.025em!important;
    overflow-wrap: anywhere!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-brand-copy span {
    margin-top: 5px!important;
    font-size: clamp(.66rem,1.65vw,.91rem)!important;
    line-height: 1.3!important;
    overflow-wrap: anywhere!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress-meta {
    position: absolute!important;
    display: block!important;
    inset: var(--gc-stable-head-top) var(--gc-stable-head-side) auto auto!important;
    width: auto!important;
    max-width: 155px!important;
    margin: 0!important;
    padding: 0!important;
    z-index: 3!important;
    color: var(--gc82-catalog-on-bg,#effff9)!important;
    -webkit-text-fill-color: var(--gc82-catalog-on-bg,#effff9)!important;
    font-size: clamp(.65rem,1.7vw,.85rem)!important;
    font-weight: 730!important;
    line-height: 1.4!important;
    text-align: right!important;
    white-space: nowrap!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress-meta strong {
    display: none!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress-meta #gc81-progress-count::before {
    content: "Passo "!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress {
    position: absolute!important;
    inset: calc(var(--gc-stable-head-top) + 34px) var(--gc-stable-head-side) auto auto!important;
    display: flex!important;
    align-items: center!important;
    justify-content: flex-end!important;
    flex: none!important;
    width: 140px!important;
    min-width: 0!important;
    max-width: 140px!important;
    height: 5px!important;
    min-height: 5px!important;
    margin: 0!important;
    padding: 0!important;
    gap: 5px!important;
    z-index: 2!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress i {
    display: block!important;
    flex: 1 1 0!important;
    width: auto!important;
    min-width: 0!important;
    height: 5px!important;
    margin: 0!important;
    border-radius: 999px!important;
    box-shadow: none!important;
  }

  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress i.active,
  body.gc-booking-v81[data-gc-public-template="immersive"] #gc81-header.gc-header .gc-progress i.done {
    background: var(--gc91-highlight,#a2f2d1)!important;
  }
}
