/* Dock inferior estilo app: Vídeo | Gerar | Imagem */
.home-bottom-dock {
  --dock-bar-height: 4.15rem;
  --dock-fab-size: 5.65rem;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 45;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: calc(var(--dock-bar-height) + env(safe-area-inset-bottom, 0px));
  padding: 0;
  pointer-events: none;
  background: transparent;
}

/* Expõe a altura do dock para o footer colar certo */
:root {
  --dock-bar-height: 4.15rem;
}

.home-bottom-dock[hidden] {
  display: none !important;
}

.home-bottom-dock > * {
  pointer-events: auto;
}

.home-bottom-dock .home-primary-tab-row {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: block !important;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  background: #0c0c0e !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
}

.home-bottom-dock .home-primary-tab-scroll {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: 0 !important;
  width: 100%;
  min-height: var(--dock-bar-height);
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.home-bottom-dock .home-primary-tab-scroll .home-tab-button {
  position: relative;
  display: flex !important;
  flex: 1 1 50% !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.2rem !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: var(--dock-bar-height) !important;
  margin: 0 !important;
  padding: 0.4rem 0.55rem 0.45rem !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.48) !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Separação bem definida entre Vídeo e Imagem */
.home-bottom-dock .home-primary-tab-scroll .home-tab-button + .home-tab-button::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18%;
  bottom: 18%;
  width: 1px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(255, 255, 255, 0.22) 20%,
    rgba(255, 255, 255, 0.22) 80%,
    transparent 100%
  );
  pointer-events: none;
}

.home-bottom-dock .home-tab-button .home-tab-module-icon {
  order: 0 !important;
  font-size: 1.4rem !important;
  line-height: 1 !important;
  opacity: 1 !important;
}

.home-bottom-dock .home-tab-button .home-tab-module-label {
  order: 1 !important;
  font-size: 0.64rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
}

.home-bottom-dock .home-tab-button--active {
  color: #ff7a1a !important;
  background: rgba(255, 122, 26, 0.12) !important;
  border: 0 !important;
  box-shadow: inset 0 2px 0 #ff7a1a !important;
}

.home-bottom-dock .home-tab-button--active .home-tab-module-icon,
.home-bottom-dock .home-tab-button--active .home-tab-module-label {
  color: #ff7a1a !important;
  opacity: 1 !important;
}

.home-bottom-dock .home-primary-tab-arrow {
  display: none !important;
}

.feed-float-generate {
  position: relative;
  left: auto;
  right: auto;
  /* Mais baixo, encaixado na barra */
  bottom: calc(env(safe-area-inset-bottom, 0px) + 0.35rem);
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.14rem;
  flex-direction: column;
  width: var(--dock-fab-size);
  height: var(--dock-fab-size);
  min-width: var(--dock-fab-size);
  min-height: var(--dock-fab-size);
  margin: 0 0 0.15rem;
  padding: 0.35rem;
  border: 4px solid #0c0c0e;
  border-radius: 999px;
  background: linear-gradient(145deg, #ff9a3c 0%, #ff7a1a 48%, #ea580c 100%);
  color: #fff;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.05;
  box-shadow:
    0 0.55rem 1.35rem rgba(0, 0, 0, 0.5),
    0 0 1.15rem rgba(255, 122, 26, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
  cursor: pointer;
  transform: none;
  transition:
    transform 0.18s ease,
    background 0.16s ease,
    box-shadow 0.16s ease;
}

.feed-float-generate .material-symbols-outlined {
  font-size: 1.65rem;
  line-height: 1;
  font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24;
}

.feed-float-generate:hover {
  background: linear-gradient(145deg, #ffb86c 0%, #ff8c2a 50%, #ff7a1a 100%);
  box-shadow:
    0 0.65rem 1.5rem rgba(255, 122, 26, 0.48),
    0 0 1.35rem rgba(255, 122, 26, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.32);
}

.feed-float-generate:active {
  transform: scale(0.95);
}

.feed-float-generate[hidden] {
  display: none !important;
}

/* Remove CTA antiga sob cada card */
.home-feed-single-panel,
.home-image-card__panel {
  display: none !important;
}

.home-feed-scroll--grid {
  padding-bottom: 0;
}

@media (max-width: 480px) {
  :root {
    --dock-bar-height: 3.95rem;
  }

  .home-bottom-dock {
    --dock-bar-height: 3.95rem;
    --dock-fab-size: 5.25rem;
  }

  .home-bottom-dock .home-tab-button .home-tab-module-label {
    font-size: 0.6rem !important;
  }

  .home-bottom-dock .home-tab-button .home-tab-module-icon {
    font-size: 1.28rem !important;
  }

  .feed-float-generate {
    font-size: 0.68rem;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 0.28rem);
  }

  .feed-float-generate .material-symbols-outlined {
    font-size: 1.5rem;
  }
}
