/* Mobile quick-actions FAB.
   On phones the AI Analysis / Support / Complete Print floating buttons take up a
   lot of the screen. This collapses them behind one small circular FAB that pops
   them out on tap and auto-hides again after a few seconds. Desktop is untouched:
   the FAB only appears when body.mobileFabActive is set (mobile + the docks exist),
   and the collapse rules are all scoped to that class. */

.mobileActionFab{ display:none; }

@media (max-width:620px){
  body.mobileFabActive .mobileActionFab{
    position:fixed;
    z-index:907; /* above the docks (900-906), below panels/modals */
    right:max(12px, env(safe-area-inset-right));
    bottom:calc(14px + env(safe-area-inset-bottom));
    display:grid;
    place-items:center;
    width:48px; height:48px;
    padding:0;
    border:1px solid color-mix(in srgb, var(--accent) 70%, var(--line));
    border-radius:50%;
    background:linear-gradient(135deg, var(--accent), var(--accent2));
    color:var(--button-text,#07101c);
    box-shadow:0 12px 30px rgba(0,0,0,.32), 0 0 18px color-mix(in srgb, var(--accent) 26%, transparent);
    cursor:pointer;
    transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
  }
  .mobileActionFab:active{ transform:scale(.94); }
  .mobileActionFab:focus-visible{ outline:3px solid color-mix(in srgb, var(--accent2) 45%, #fff); outline-offset:3px; }
  .mobileActionFab svg{
    width:22px; height:22px;
    fill:none; stroke:currentColor; stroke-width:2.4;
    stroke-linecap:round; stroke-linejoin:round;
    transition:transform .25s ease;
  }
  /* plus -> x on open */
  body.mobileDockOpen .mobileActionFab svg{ transform:rotate(45deg); }
  body.mobileDockOpen .mobileActionFab{ filter:brightness(1.06); }

  /* Collapsed: the three buttons tuck behind the FAB. */
  body.mobileFabActive #floatingActionDock,
  body.mobileFabActive .completePrintDock{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(14px) scale(.82) !important;
    transform-origin:bottom right;
    transition:opacity .2s ease, transform .22s ease, visibility .22s;
  }
  /* Expanded: reveal them, stacked above the FAB. */
  body.mobileFabActive.mobileDockOpen #floatingActionDock,
  body.mobileFabActive.mobileDockOpen .completePrintDock{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
  }
  /* Lift the stack clear of the FAB while active (both collapsed and expanded). */
  body.mobileFabActive .completePrintDock{ bottom:calc(76px + env(safe-area-inset-bottom)) !important; }
  body.mobileFabActive #floatingActionDock{ bottom:calc(132px + env(safe-area-inset-bottom)) !important; }
}

@media (prefers-reduced-motion:reduce){
  .mobileActionFab, .mobileActionFab svg,
  body.mobileFabActive #floatingActionDock,
  body.mobileFabActive .completePrintDock{ transition:none !important; }
}