/* Weather FAB polish + unified right FAB rail (#uo-fab-rail) */

/* Desktop: respiro do menu no topo. Mobile: 0 (padding cortava o hambúrguer). */
html body #header {
  padding-top: 28px !important;
  box-sizing: border-box !important;
}

@media only screen and (max-width: 699px) {
  html body #header {
    padding-top: 0 !important;
  }
}

html body #header #block-block-15 .block-inner,
html body #header #block-block-15 .block-content,
html body #uo-fab-rail #block-block-15 .block-inner,
html body #uo-fab-rail #block-block-15 .block-content {
  margin: 0 !important;
  padding: 0 !important;
}

/*
 * tempo.com iframe is 68×95 with:
 *   nomDay (~24px) → simBDay (~30px) → temps (~20px) → branding
 * Crop: hide day name + branding; show icon + temperatures.
 */
html body #header #block-block-15 .previsao-do-tempo,
html body #header .previsao-do-tempo,
html body.logged-in #header .previsao-do-tempo,
html body #uo-fab-rail .previsao-do-tempo,
html body .previsao-do-tempo {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  float: none !important;
  display: block !important;
  width: 68px !important;
  height: 56px !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  transform: translateY(0) !important;
  -webkit-transform: translateY(0) !important;
  border-radius: 14px !important;
  background: #fff !important;
  border: 1px solid rgba(0, 170, 200, 0.28) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18) !important;
  overflow: hidden !important;
  cursor: pointer !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

html body #header #block-block-15 .previsao-do-tempo:hover,
html body #header .previsao-do-tempo:hover,
html body #uo-fab-rail .previsao-do-tempo:hover,
html body .previsao-do-tempo:hover,
html body #header #block-block-15 .previsao-do-tempo:focus-within,
html body #header .previsao-do-tempo:focus-within,
html body #uo-fab-rail .previsao-do-tempo:focus-within,
html body .previsao-do-tempo:focus-within {
  transform: translateY(-3px) !important;
  -webkit-transform: translateY(-3px) !important;
  border-color: rgba(0, 170, 200, 0.55) !important;
  box-shadow: 0 10px 24px rgba(0, 170, 200, 0.28) !important;
}

html body .previsao-do-tempo #cont_9b813a7f1e38912570d2ef18e8b372e1,
html body #header .previsao-do-tempo #cont_9b813a7f1e38912570d2ef18e8b372e1,
html body #uo-fab-rail .previsao-do-tempo #cont_9b813a7f1e38912570d2ef18e8b372e1 {
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 68px !important;
  height: 95px !important;
  top: -24px !important;
  left: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  transform: none !important;
}

html body .previsao-do-tempo #cont_9b813a7f1e38912570d2ef18e8b372e1 iframe,
html body #header .previsao-do-tempo iframe,
html body #uo-fab-rail .previsao-do-tempo iframe {
  display: block !important;
  width: 68px !important;
  height: 95px !important;
  border: 0 !important;
  margin: 0 !important;
  max-width: none !important;
}

html body #header .before-weather-header,
html body .previsao-do-tempo .before-weather-header {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  display: block !important;
  border-radius: 14px;
}

html body.page-admin #header #block-block-15,
html body.page-admin .previsao-do-tempo,
html body.page-admin #uo-fab-rail {
  display: none !important;
}

/* ------------------------------------------------------------------ */
/* Unified FAB rail — one column, gap handles spacing (no bottom math) */
/* ------------------------------------------------------------------ */
html body #uo-fab-rail.uo-fab-rail {
  position: fixed !important;
  right: 16px !important;
  left: auto !important;
  top: auto !important;
  bottom: 20px !important;
  z-index: 910 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Above mobile bottom nav (56px) */
@media only screen and (max-width: 699px) {
  html body #uo-fab-rail.uo-fab-rail {
    right: 12px !important;
    bottom: calc(56px + env(safe-area-inset-bottom, 0px) + 12px) !important;
    gap: 12px !important;
  }

  html body #uo-fab-rail .previsao-do-tempo,
  html body #uo-fab-rail #block-block-15 .previsao-do-tempo {
    width: 56px !important;
    height: 52px !important;
    border-radius: 12px !important;
  }

  html body #uo-fab-rail .uo-itinerary-badge,
  html body #uo-fab-rail a.uo-itinerary-badge {
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    gap: 0 !important;
    justify-content: center !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
  }

  html body #uo-fab-rail .uo-itinerary-badge__label {
    display: none !important;
  }

  html body #uo-fab-rail .uo-itinerary-badge__count {
    position: absolute !important;
    top: -2px !important;
    right: -2px !important;
    min-width: 18px !important;
    height: 18px !important;
    padding: 0 4px !important;
    border-radius: 999px !important;
    background: #08414d !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 18px !important;
  }

  html body #uo-fab-rail .uo-itinerary-badge.is-empty .uo-itinerary-badge__count {
    display: none !important;
  }

  html body #uo-fab-rail .uo-account-badge__toggle {
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    justify-content: center !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
  }

  html body #uo-fab-rail .uo-account-badge__label {
    display: none !important;
  }

  html body #uo-fab-rail .uo-chat-btn {
    width: 48px !important;
    height: 48px !important;
    margin: 0 !important;
  }
}

/* Kill every legacy fixed bottom/right on items inside the rail */
html body #uo-fab-rail > #block-block-15,
html body #uo-fab-rail > #block-block-15.block,
html body #uo-fab-rail > .uo-account-badge,
html body #uo-fab-rail > .uo-itinerary-badge,
html body #uo-fab-rail > a.uo-itinerary-badge,
html body #uo-fab-rail > .uo-chat-btn {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  float: none !important;
  transform: none !important;
  -webkit-transform: none !important;
  margin: 0 !important;
  pointer-events: auto !important;
  z-index: auto !important;
  align-self: flex-end !important;
}

html body #uo-fab-rail > #block-block-15 {
  width: auto !important;
  height: auto !important;
  max-width: none !important;
}

/* FAB brand color — force #00aac8 (beats stale CSS aggregates) */
html body .uo-itinerary-badge,
html body a.uo-itinerary-badge {
  background: #00aac8 !important;
  background-color: #00aac8 !important;
  color: #fff !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
}

html body .uo-itinerary-badge:hover,
html body a.uo-itinerary-badge:hover,
html body .uo-itinerary-badge:focus,
html body a.uo-itinerary-badge:focus {
  background: #0096b0 !important;
  background-color: #0096b0 !important;
  color: #fff !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 24px rgba(0, 170, 200, 0.38) !important;
}

html body .uo-account-badge .uo-account-badge__toggle,
html body .uo-account-badge__toggle {
  background: #00aac8 !important;
  background-color: #00aac8 !important;
  color: #fff !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
}

html body .uo-account-badge .uo-account-badge__toggle:hover,
html body .uo-account-badge__toggle:hover,
html body .uo-account-badge .uo-account-badge__toggle:focus,
html body .uo-account-badge__toggle:focus,
html body .uo-account-badge.is-open .uo-account-badge__toggle {
  background: #0096b0 !important;
  background-color: #0096b0 !important;
  color: #fff !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 24px rgba(0, 170, 200, 0.38) !important;
}

html body .uo-account-badge .uo-account-badge__icon {
  background: #0096b0 !important;
  transition: background-color 0.18s ease !important;
}

html body .uo-account-badge__toggle:hover .uo-account-badge__icon,
html body .uo-account-badge__toggle:focus .uo-account-badge__icon,
html body .uo-account-badge.is-open .uo-account-badge__icon {
  background: #007f96 !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .previsao-do-tempo,
  html body .uo-itinerary-badge,
  html body a.uo-itinerary-badge,
  html body .uo-account-badge__toggle {
    transition: none !important;
  }

  html body .previsao-do-tempo:hover,
  html body .uo-itinerary-badge:hover,
  html body a.uo-itinerary-badge:hover,
  html body .uo-account-badge__toggle:hover {
    transform: none !important;
  }
}