/* ==========================================================================
   FORRE.NU — Floating Dock coordinator
   FORRE_DARK: 0px radius, endast CSS-variabler.

   Samordnar de tre fasta hörn-launchers nere till höger så de ligger snyggt
   sida vid sida (Messenger-FAB · Crew · Staff) i stället för att stapla på
   varandra. Den faktiska x-positioneringen sköts av floating-dock.js — denna
   fil ger bara gemensam baslinje, jämn höjd och en mjuk shift-animation när
   chattfönster öppnas och verktygen flyttar åt vänster.
   ========================================================================== */

/* Gemensam baslinje + jämn höjd → tidy rad */
.messenger-fab-btn {
  bottom: 18px !important;
}

.tw-cc-launcher {
  height: 40px;
  z-index: 1002; /* över chatt-fönster (999) och minimerade (1001) under shift */
  /* Behåll launcherns egna hover-transitions och lägg till mjuk right-shift */
  transition:
    right 0.24s cubic-bezier(0.34, 1.05, 0.64, 1),
    bottom 0.24s ease,
    border-color var(--transition-speed, 0.12s),
    color var(--transition-speed, 0.12s),
    transform var(--transition-speed, 0.12s);
}

.tw-staff-pill {
  min-height: 40px;
}

#forreStaffBar {
  transition:
    right 0.24s cubic-bezier(0.34, 1.05, 0.64, 1),
    bottom 0.24s ease;
}

/* Mjuk shift även på FAB-baslinjen vid behov (FAB flyttas inte i sidled) */
.messenger-fab-btn {
  transition:
    background var(--transition-speed, 0.12s),
    border-color var(--transition-speed, 0.12s),
    color var(--transition-speed, 0.12s),
    transform 0.2s ease;
}

/* På mobil tar den befintliga fullscreen-chatten över — då nollställer JS:en
   inline-positionerna och dessa transitions ska inte ge hopp vid rotation. */
@media (max-width: 767px) {
  .tw-cc-launcher,
  #forreStaffBar {
    transition: none;
  }
}