import QtQuick
import Quickshell
import qs.Commons
import qs.Services.UI

/**
* SmartPanel for use within MainScreen
*/
Item {
  id: root

  // Screen property provided by MainScreen
  property ShellScreen screen: null

  // Panel content: Text, icons, etc...
  property Component panelContent: null

  // PanelID for binding panels to widgets of the same type
  property var panelID: null

  // Panel size properties
  property real preferredWidth: 700
  property real preferredHeight: 900
  property real preferredWidthRatio
  property real preferredHeightRatio
  property color panelBackgroundColor: Color.mSurface
  property color panelBorderColor: Color.mOutline
  property var buttonItem: null
  property bool forceAttachToBar: false

  // Anchoring properties
  property bool panelAnchorHorizontalCenter: false
  property bool panelAnchorVerticalCenter: false
  property bool panelAnchorTop: false
  property bool panelAnchorBottom: false
  property bool panelAnchorLeft: false
  property bool panelAnchorRight: false

  // Button position properties
  property bool useButtonPosition: false
  property point buttonPosition: Qt.point(0, 0)
  property int buttonWidth: 0
  property int buttonHeight: 0

  // Edge snapping: if panel is within this distance (in pixels) from a screen edge, snap
  property real edgeSnapDistance: 50

  // Track whether panel is open
  property bool isPanelOpen: false

  // Track actual visibility (delayed until content is loaded and sized)
  property bool isPanelVisible: false

  // Track size animation completion for sequential opacity animation
  property bool sizeAnimationComplete: false

  // Derived state: track opening transition
  readonly property bool isOpening: isPanelVisible && !isClosing && !sizeAnimationComplete

  // Track close animation state: fade opacity first, then shrink size
  property bool isClosing: false
  property bool opacityFadeComplete: false
  property bool closeFinalized: false // Prevent double-finalization

  // Safety: Watchdog timers to prevent stuck states
  property bool closeWatchdogActive: false
  property bool openWatchdogActive: false

  // Cached animation direction - set when panel opens, doesn't change during animation
  // These are computed once when opening and used for the entire open/close cycle
  property bool cachedAnimateFromTop: false
  property bool cachedAnimateFromBottom: false
  property bool cachedAnimateFromLeft: false
  property bool cachedAnimateFromRight: false

  readonly property bool animationsDisabled: Settings.data.general.animationDisabled
  property bool cachedShouldAnimateWidth: false
  property bool cachedShouldAnimateHeight: false

  // Whether blur should be applied behind this panel
  property bool blurEnabled: true

  // Close with escape key
  property bool closeWithEscape: true

  property bool exclusiveKeyboard: true

  // Keyboard event handler
  // These are called from MainScreen's centralized shortcuts
  // override these in specific panels to handle shortcuts
  function onEscapePressed() {
    if (closeWithEscape)
      close();
  }

  // Expose panel region for background rendering
  readonly property var panelRegion: panelContent.geometryPlaceholder

  readonly property string barPosition: Settings.getBarPositionForScreen(screen?.name)
  readonly property bool barIsVertical: barPosition === "left" || barPosition === "right"
  readonly property real barHeight: barShouldShow ? Style.getBarHeightForScreen(screen?.name) : 0
  readonly property bool hasBar: modelData && modelData.name ? (Settings.data.bar.monitors.includes(modelData.name) || (Settings.data.bar.monitors.length === 0)) : false
  readonly property bool isFramed: Settings.data.bar.barType === "framed" && hasBar
  readonly property real frameThickness: Settings.data.bar.frameThickness ?? 12
  readonly property bool barFloating: Settings.data.bar.barType === "floating"
  readonly property real barMarginH: (barFloating && barShouldShow) ? Math.ceil(Settings.data.bar.marginHorizontal) : 0
  readonly property real barMarginV: (barFloating && barShouldShow) ? Math.ceil(Settings.data.bar.marginVertical) : 0
  readonly property real attachmentOverlap: 1 // Panel extends into bar area to fix hairline gap with fractional scaling

  // Check if bar should be visible on this screen
  readonly property bool barShouldShow: {
    if (!BarService.effectivelyVisible)
      return false;
    var monitors = Settings.data.bar.monitors || [];
    var screenName = screen?.name || "";
    return monitors.length === 0 || monitors.includes(screenName);
  }

  // Helper to detect if any anchor is explicitly set
  readonly property bool hasExplicitHorizontalAnchor: panelAnchorHorizontalCenter || panelAnchorLeft || panelAnchorRight
  readonly property bool hasExplicitVerticalAnchor: panelAnchorVerticalCenter || panelAnchorTop || panelAnchorBottom

  // Effective anchor properties (depend on allowAttach)
  // These are true when allowAttach is enabled AND:
  // 1. Explicitly anchored to that edge, OR
  // 2. Using button position and bar is on that edge, OR
  // 3. No explicit anchors and bar is on that edge (default centering behavior)
  readonly property bool effectivePanelAnchorTop: panelContent.allowAttach && (panelAnchorTop || (useButtonPosition && barPosition === "top") || (!hasExplicitVerticalAnchor && barPosition === "top" && !barIsVertical))
  readonly property bool effectivePanelAnchorBottom: panelContent.allowAttach && (panelAnchorBottom || (useButtonPosition && barPosition === "bottom") || (!hasExplicitVerticalAnchor && barPosition === "bottom" && !barIsVertical))
  readonly property bool effectivePanelAnchorLeft: panelContent.allowAttach && (panelAnchorLeft || (useButtonPosition && barPosition === "left") || (!hasExplicitHorizontalAnchor && barPosition === "left" && barIsVertical))
  readonly property bool effectivePanelAnchorRight: panelContent.allowAttach && (panelAnchorRight || (useButtonPosition && barPosition === "right") || (!hasExplicitHorizontalAnchor && barPosition === "right" && barIsVertical))

  signal opened
  signal closed

  Connections {
    target: Style

    function onUiScaleRatioChanged() {
      if (root.isPanelOpen && root.isPanelVisible) {
        root.setPosition();
      }
    }
  }

  // Panel visibility and sizing
  visible: isPanelVisible
  width: parent ? parent.width : 0
  height: parent ? parent.height : 0

  // Panel control functions
  function toggle(buttonItem, buttonName) {
    if (!isPanelOpen) {
      open(buttonItem, buttonName);
    } else {
      close();
    }
  }

  function open(buttonItem, buttonName) {
    // Reset immediate close flag to ensure animations work properly
    PanelService.closedImmediately = false;
    // Reset to default - fixes panel being stuck in one position
    root.useButtonPosition = false;

    // Calculate the bar window's position on screen based on bar settings
    // The BarContentWindow uses anchors + margins, so we need to compute its origin
    var barWindowX = 0;
    var barWindowY = 0;
    var screenWidth = root.screen?.width || 0;
    var screenHeight = root.screen?.height || 0;

    if (root.barPosition === "right") {
      barWindowX = screenWidth - root.barMarginH - root.barHeight;
    } else if (root.barPosition === "left") {
      barWindowX = root.barMarginH;
    } else if (root.isFramed) {
      barWindowX = root.frameThickness;
    } else {
      // Horizontal floating bars: BarContentWindow has margins.left = barMarginH
      barWindowX = root.barMarginH;
    }

    if (root.barPosition === "bottom") {
      barWindowY = screenHeight - root.barMarginV - root.barHeight;
    } else if (root.barPosition === "top") {
      barWindowY = root.barMarginV;
    } else if (root.isFramed) {
      barWindowY = root.frameThickness;
    } else {
      // Vertical floating bars: BarContentWindow has margins.top = barMarginV
      barWindowY = root.barMarginV;
    }

    if (!buttonItem && buttonName) {
      // Check if buttonName is actually a point object (click coordinates)
      if (typeof buttonName === "object" && buttonName.x !== undefined && buttonName.y !== undefined) {
        root.buttonItem = null;
        // Click coordinates are in BarContentWindow-local space, offset to screen space
        root.buttonPosition = Qt.point(barWindowX + buttonName.x, barWindowY + buttonName.y);
        root.buttonWidth = 0;
        root.buttonHeight = 0;
        root.useButtonPosition = true;
      } else {
        // buttonName is a widget name, look it up
        buttonItem = BarService.lookupWidget(buttonName, screen.name);
      }
    }

    // Validate buttonItem is a valid QML Item with mapToItem function
    if (buttonItem && typeof buttonItem.mapToItem === "function") {
      try {
        root.buttonItem = buttonItem;
        // Map button position within its window (BarContentWindow-local coordinates)
        var buttonLocal = buttonItem.mapToItem(null, 0, 0);

        root.buttonPosition = Qt.point(barWindowX + buttonLocal.x, barWindowY + buttonLocal.y);
        root.buttonWidth = buttonItem.width;
        root.buttonHeight = buttonItem.height;
        root.useButtonPosition = true;
      } catch (e) {
        Logger.w("SmartPanel", "Failed to get button position, using default positioning:", e);
        root.buttonItem = null;
        root.useButtonPosition = false;
      }
    } else if (!root.useButtonPosition) {
      // No valid button provided and no click position: reset button position mode
      root.buttonItem = null;
    }

    // Set isPanelOpen to trigger content loading, but don't show yet
    isPanelOpen = true;

    // Notify PanelService
    PanelService.willOpenPanel(root);

    // Position and visibility will be set by Loader.onLoaded
    // This ensures no flicker from default size to content size
  }

  function close() {
    // Reset immediate close flag to ensure animations work properly
    PanelService.closedImmediately = false;

    // Start close sequence: fade opacity first
    isClosing = true;
    sizeAnimationComplete = false;
    closeFinalized = false;

    // Stop the open animation timer if it's still running
    opacityTrigger.stop();
    openWatchdogActive = false;
    openWatchdogTimer.stop();

    // Start close watchdog timer
    closeWatchdogActive = true;
    closeWatchdogTimer.restart();

    // If opacity is already 0 (closed during open animation before fade-in),
    // skip directly to size animation
    if (root.opacity === 0.0) {
      opacityFadeComplete = true;
    } else {
      opacityFadeComplete = false;
    }

    // Opacity will fade out, then size will shrink, then finalizeClose() will complete
    Logger.d("SmartPanel", "Closing panel", objectName);
  }

  function closeImmediately() {
    // Close without any animation, useful for app launches to avoid focus issues
    opacityTrigger.stop();
    openWatchdogActive = false;
    openWatchdogTimer.stop();
    closeWatchdogActive = false;
    closeWatchdogTimer.stop();

    // Don't set opacity directly as it breaks the binding
    root.isPanelVisible = false;
    root.sizeAnimationComplete = false;
    root.isClosing = false;
    root.opacityFadeComplete = false;
    root.closeFinalized = true;
    root.isPanelOpen = false;
    panelBackground.dimensionsInitialized = false;

    // Signal immediate close so MainScreen can skip dimmer animation
    PanelService.closedImmediately = true;
    PanelService.closedPanel(root);
    closed();

    // Flush pending double-buffered Wayland state (blur regions) that won't
    // be committed otherwise — after an app launch the compositor may stop
    // sending frame callbacks, leaving the render loop idle.
    Window.window?.flushWaylandState();

    Logger.d("SmartPanel", "Panel closed immediately", objectName);
  }

  function finalizeClose() {
    // Prevent double-finalization
    if (root.closeFinalized) {
      Logger.w("SmartPanel", "finalizeClose called but already finalized - ignoring", objectName);
      return;
    }

    // Complete the close sequence after animations finish
    root.closeFinalized = true;
    root.closeWatchdogActive = false;
    closeWatchdogTimer.stop();

    root.isPanelVisible = false;
    root.isPanelOpen = false;
    root.isClosing = false;
    root.opacityFadeComplete = false;

    // Reset dimensionsInitialized for next opening
    panelBackground.dimensionsInitialized = false;

    PanelService.closedPanel(root);
    closed();

    // Flush pending double-buffered Wayland state (blur regions).
    Window.window?.flushWaylandState();

    Logger.d("SmartPanel", "Panel close finalized", objectName);
  }

  function setPosition() {
    // Don't calculate position if parent dimensions aren't available yet
    // This prevents centering around (0,0) when width/height are still 0
    if (!root.width || !root.height) {
      Logger.d("SmartPanel", "Skipping setPosition - dimensions not ready:", root.width, "x", root.height);
      // Retry on next frame when dimensions should be available
      Qt.callLater(setPosition);
      return;
    }

    // Effective screen margins (account for frame thickness)
    var effMarginL = Style.marginL + (root.isFramed ? root.frameThickness : 0);
    var effMarginR = Style.marginL + (root.isFramed ? root.frameThickness : 0);
    var effMarginT = Style.marginL + (root.isFramed ? root.frameThickness : 0);
    var effMarginB = Style.marginL + (root.isFramed ? root.frameThickness : 0);

    // Calculate panel dimensions first (needed for positioning)
    var w;
    // Priority 1: Content-driven size (dynamic)
    if (contentLoader.item && contentLoader.item.contentPreferredWidth !== undefined) {
      w = contentLoader.item.contentPreferredWidth;
    } // Priority 2: Ratio-based size
    else if (root.preferredWidthRatio !== undefined) {
      w = Math.round(Math.max(root.width * root.preferredWidthRatio, root.preferredWidth));
    } // Priority 3: Static preferred width
    else {
      w = root.preferredWidth;
    }
    var panelWidth = Math.min(w, root.width - effMarginL - effMarginR);
    // For floating bars, additionally clamp to available space accounting for corner insets
    if (root.barFloating && !root.barIsVertical) {
      var floatCornerInset = Style.radiusL * 2;
      panelWidth = Math.min(panelWidth, root.width - 2 * (root.barMarginH + floatCornerInset));
    }

    var h;
    // Priority 1: Content-driven size (dynamic)
    if (contentLoader.item && contentLoader.item.contentPreferredHeight !== undefined) {
      h = contentLoader.item.contentPreferredHeight;
    } // Priority 2: Ratio-based size
    else if (root.preferredHeightRatio !== undefined) {
      h = Math.round(Math.max(root.height * root.preferredHeightRatio, root.preferredHeight));
    } // Priority 3: Static preferred height
    else {
      h = root.preferredHeight;
    }
    var panelHeight = Math.min(h, root.height - root.barHeight - effMarginT - effMarginB);
    // For vertical floating bars, clamp panelHeight to available space accounting for corner insets
    if (root.barFloating && root.barIsVertical) {
      var floatCornerInset = Style.radiusL * 2;
      panelHeight = Math.min(panelHeight, root.height - 2 * (root.barMarginV + floatCornerInset));
    }

    // Update panelBackground target size (will be animated)
    panelBackground.targetWidth = panelWidth;
    panelBackground.targetHeight = panelHeight;

    // Pre-compute bar edge positions with overlap (used multiple times below)
    // For attached panels, we extend slightly into the bar area to prevent hairline gaps
    var leftBarEdgeWithOverlap = root.barMarginH + root.barHeight - root.attachmentOverlap;
    var rightBarEdgeWithOverlap = root.width - root.barMarginH - root.barHeight + root.attachmentOverlap;
    var topBarEdgeWithOverlap = root.barMarginV + root.barHeight - root.attachmentOverlap;
    var bottomBarEdgeWithOverlap = root.height - root.barMarginV - root.barHeight + root.attachmentOverlap;

    if (root.isFramed) {
      if (root.barPosition === "left")
        leftBarEdgeWithOverlap = root.barHeight - root.attachmentOverlap;
      if (root.barPosition === "right")
        rightBarEdgeWithOverlap = root.width - root.barHeight + root.attachmentOverlap;
      if (root.barPosition === "top")
        topBarEdgeWithOverlap = root.barHeight - root.attachmentOverlap;
      if (root.barPosition === "bottom")
        bottomBarEdgeWithOverlap = root.height - root.barHeight + root.attachmentOverlap;
    }

    // Calculate position
    var calculatedX;
    var calculatedY;

    // ===== X POSITIONING =====
    if (root.useButtonPosition && root.width > 0 && panelWidth > 0) {
      if (root.barIsVertical) {
        // For vertical bars
        if (panelContent.allowAttach) {
          // Attached panels: align with bar edge (left or right side)
          if (root.barPosition === "left") {
            calculatedX = leftBarEdgeWithOverlap;
          } else {
            calculatedX = rightBarEdgeWithOverlap - panelWidth;
          }
        } else {
          // Detached panels: center on button X position
          var panelX = root.buttonPosition.x + root.buttonWidth / 2 - panelWidth / 2;
          var minX = effMarginL;
          var maxX = root.width - panelWidth - effMarginR;

          // Account for vertical bar taking up space
          if (root.barPosition === "left") {
            minX = (root.isFramed ? 0 : root.barMarginH) + root.barHeight + Style.marginL;
          } else if (root.barPosition === "right") {
            maxX = root.width - (root.isFramed ? 0 : root.barMarginH) - root.barHeight - panelWidth - Style.marginL;
          }

          panelX = Math.max(minX, Math.min(panelX, maxX));
          calculatedX = panelX;
        }
      } else {
        // For horizontal bars, center panel on button X position
        var panelX = root.buttonPosition.x + root.buttonWidth / 2 - panelWidth / 2;
        if (panelContent.allowAttach) {
          var cornerInset = root.barFloating ? Style.radiusL * 2 : 0;
          var barLeftEdge = (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginH) + cornerInset;
          var barRightEdge = root.width - (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginH) - cornerInset;
          panelX = Math.max(barLeftEdge, Math.min(panelX, barRightEdge - panelWidth));
        } else {
          panelX = Math.max(effMarginL, Math.min(panelX, root.width - panelWidth - effMarginR));
        }
        calculatedX = panelX;
      }
    } else {
      // Standard anchor positioning
      if (root.panelAnchorHorizontalCenter) {
        if (root.barIsVertical) {
          if (root.barPosition === "left") {
            var availableStart = (root.isFramed ? 0 : root.barMarginH) + root.barHeight;
            var availableWidth = root.width - availableStart - (root.isFramed ? root.frameThickness : 0);
            calculatedX = availableStart + (availableWidth - panelWidth) / 2;
          } else if (root.barPosition === "right") {
            var availableWidth = root.width - (root.isFramed ? 0 : root.barMarginH) - root.barHeight - (root.isFramed ? root.frameThickness : 0);
            calculatedX = (root.isFramed ? root.frameThickness : 0) + (availableWidth - panelWidth) / 2;
          } else {
            calculatedX = (root.width - panelWidth) / 2;
          }
        } else {
          calculatedX = (root.width - panelWidth) / 2;
        }
      } else if (root.panelAnchorRight) {
        // Use raw panelAnchorRight for positioning decision
        if (root.effectivePanelAnchorRight) {
          // Attached: snap to edge/bar
          if (root.barIsVertical && root.barPosition === "right") {
            calculatedX = rightBarEdgeWithOverlap - panelWidth;
          } else {
            var panelOnSameEdgeAsBar = (root.barPosition === "top" && root.effectivePanelAnchorTop) || (root.barPosition === "bottom" && root.effectivePanelAnchorBottom);
            if (!root.barIsVertical && root.barFloating && panelOnSameEdgeAsBar) {
              var rightCornerInset = Style.radiusL * 2;
              calculatedX = root.width - root.barMarginH - rightCornerInset - panelWidth;
            } else {
              calculatedX = root.width - panelWidth - (root.isFramed ? root.frameThickness - root.attachmentOverlap : 0);
            }
          }
        } else {
          // Not attached: position at right with margin
          calculatedX = root.width - panelWidth - effMarginR;
        }
      } else if (root.panelAnchorLeft) {
        // Use raw panelAnchorLeft for positioning decision
        if (root.effectivePanelAnchorLeft) {
          // Attached: snap to edge/bar
          if (root.barIsVertical && root.barPosition === "left") {
            calculatedX = leftBarEdgeWithOverlap;
          } else {
            var panelOnSameEdgeAsBar = (root.barPosition === "top" && root.effectivePanelAnchorTop) || (root.barPosition === "bottom" && root.effectivePanelAnchorBottom);
            if (!root.barIsVertical && root.barFloating && panelOnSameEdgeAsBar) {
              var leftCornerInset = Style.radiusL * 2;
              calculatedX = root.barMarginH + leftCornerInset;
            } else {
              calculatedX = (root.isFramed ? root.frameThickness - root.attachmentOverlap : 0);
            }
          }
        } else {
          // Not attached: position at left with margin
          calculatedX = effMarginL;
        }
      } else {
        // No explicit anchor: attach to bar if allowAttach, otherwise center
        if (root.barIsVertical) {
          if (panelContent.allowAttach) {
            // Attach to the bar edge (with overlap into bar area)
            if (root.barPosition === "left") {
              calculatedX = leftBarEdgeWithOverlap;
            } else {
              calculatedX = rightBarEdgeWithOverlap - panelWidth;
            }
          } else {
            // Not attached: center in available space
            if (root.barPosition === "left") {
              var availableStart = (root.isFramed ? 0 : root.barMarginH) + root.barHeight;
              var availableWidth = root.width - availableStart - effMarginR;
              calculatedX = availableStart + (availableWidth - panelWidth) / 2;
            } else {
              var availableWidth = root.width - (root.isFramed ? 0 : root.barMarginH) - root.barHeight - effMarginL;
              calculatedX = effMarginL + (availableWidth - panelWidth) / 2;
            }
          }
        } else {
          if (panelContent.allowAttach) {
            var cornerInset = Style.radiusL + (root.barFloating ? Style.radiusL : 0);
            var barLeftEdge = (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginH) + cornerInset;
            var barRightEdge = root.width - (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginH) - cornerInset;
            var centeredX = (root.width - panelWidth) / 2;
            calculatedX = Math.max(barLeftEdge, Math.min(centeredX, barRightEdge - panelWidth));
          } else {
            calculatedX = (root.width - panelWidth) / 2;
          }
        }
      }
    }

    // Edge snapping for X
    if (panelContent.allowAttach && !root.barFloating && root.width > 0 && panelWidth > 0) {
      var leftEdgePos = root.barPosition === "left" ? leftBarEdgeWithOverlap : (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginH);
      var rightEdgePos = root.barPosition === "right" ? rightBarEdgeWithOverlap - panelWidth : root.width - (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginH) - panelWidth;

      // Only snap to left edge if panel is actually meant to be at left (or no explicit anchor)
      var shouldSnapToLeft = root.effectivePanelAnchorLeft || (!root.hasExplicitHorizontalAnchor && root.barPosition === "left");
      // Only snap to right edge if panel is actually meant to be at right (or no explicit anchor)
      var shouldSnapToRight = root.effectivePanelAnchorRight || (!root.hasExplicitHorizontalAnchor && root.barPosition === "right");

      if (shouldSnapToLeft && Math.abs(calculatedX - leftEdgePos) <= root.edgeSnapDistance) {
        calculatedX = leftEdgePos;
      } else if (shouldSnapToRight && Math.abs(calculatedX - rightEdgePos) <= root.edgeSnapDistance) {
        calculatedX = rightEdgePos;
      }
    }

    // ===== Y POSITIONING =====
    if (root.useButtonPosition && root.height > 0 && panelHeight > 0) {
      if (root.barPosition === "top") {
        if (panelContent.allowAttach) {
          calculatedY = topBarEdgeWithOverlap;
        } else {
          calculatedY = (root.isFramed ? 0 : root.barMarginV) + root.barHeight + Style.marginM;
        }
      } else if (root.barPosition === "bottom") {
        if (panelContent.allowAttach) {
          calculatedY = bottomBarEdgeWithOverlap - panelHeight;
        } else {
          calculatedY = root.height - (root.isFramed ? 0 : root.barMarginV) - root.barHeight - panelHeight - Style.marginM;
        }
      } else if (root.barIsVertical) {
        var panelY = root.buttonPosition.y + root.buttonHeight / 2 - panelHeight / 2;
        var extraPadding = (panelContent.allowAttach && root.barFloating) ? Style.radiusL : 0;
        if (panelContent.allowAttach) {
          var cornerInset = extraPadding + (root.barFloating ? Style.radiusL : 0);
          var barTopEdge = (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginV) + cornerInset;
          var barBottomEdge = root.height - (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginV) - cornerInset;
          panelY = Math.max(barTopEdge, Math.min(panelY, barBottomEdge - panelHeight));
        } else {
          panelY = Math.max(effMarginT + extraPadding, Math.min(panelY, root.height - panelHeight - effMarginB - extraPadding));
        }
        calculatedY = panelY;
      }
    } else {
      // Standard anchor positioning
      var barOffset = !panelContent.allowAttach && (root.barPosition === "top" || root.barPosition === "bottom") ? (root.isFramed ? 0 : root.barMarginV) + root.barHeight + Style.marginM : 0;

      if (panelContent.allowAttach && !root.barIsVertical) {
        // Attached to horizontal bar: position with overlap
        if ((root.effectivePanelAnchorTop && root.barPosition === "top") || (!root.hasExplicitVerticalAnchor && root.barPosition === "top")) {
          calculatedY = topBarEdgeWithOverlap;
        } else if ((root.effectivePanelAnchorBottom && root.barPosition === "bottom") || (!root.hasExplicitVerticalAnchor && root.barPosition === "bottom")) {
          calculatedY = bottomBarEdgeWithOverlap - panelHeight;
        }
      }

      if (calculatedY === undefined) {
        if (root.panelAnchorVerticalCenter) {
          if (!root.barIsVertical) {
            if (root.barPosition === "top") {
              var availableStart = (root.isFramed ? 0 : root.barMarginV) + root.barHeight;
              var availableHeight = root.height - availableStart - (root.isFramed ? root.frameThickness : 0);
              calculatedY = availableStart + (availableHeight - panelHeight) / 2;
            } else if (root.barPosition === "bottom") {
              var availableHeight = root.height - (root.isFramed ? 0 : root.barMarginV) - root.barHeight - (root.isFramed ? root.frameThickness : 0);
              calculatedY = (root.isFramed ? root.frameThickness : 0) + (availableHeight - panelHeight) / 2;
            } else {
              calculatedY = (root.height - panelHeight) / 2;
            }
          } else {
            calculatedY = (root.height - panelHeight) / 2;
          }
        } else if (root.panelAnchorTop) {
          if (root.effectivePanelAnchorTop) {
            calculatedY = root.barPosition === "top" ? topBarEdgeWithOverlap : (root.isFramed ? root.frameThickness - root.attachmentOverlap : 0);
          } else {
            var topBarOffset = (root.barPosition === "top") ? barOffset : 0;
            calculatedY = topBarOffset + effMarginT;
          }
        } else if (root.panelAnchorBottom) {
          if (root.effectivePanelAnchorBottom) {
            calculatedY = root.barPosition === "bottom" ? bottomBarEdgeWithOverlap - panelHeight : root.height - panelHeight - (root.isFramed ? root.frameThickness - root.attachmentOverlap : 0);
          } else {
            var bottomBarOffset = (root.barPosition === "bottom") ? barOffset : 0;
            calculatedY = root.height - panelHeight - bottomBarOffset - effMarginB;
          }
        } else {
          // No explicit vertical anchor
          if (root.barIsVertical) {
            if (panelContent.allowAttach) {
              var cornerInset = root.barFloating ? Style.radiusL * 2 : 0;
              var barTopEdge = (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginV) + cornerInset;
              var barBottomEdge = root.height - (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginV) - cornerInset;
              var centeredY = (root.height - panelHeight) / 2;
              calculatedY = Math.max(barTopEdge, Math.min(centeredY, barBottomEdge - panelHeight));
            } else {
              calculatedY = (root.height - panelHeight) / 2;
            }
          } else {
            // Horizontal bar, not attached
            if (root.barPosition === "top") {
              calculatedY = barOffset + effMarginT;
            } else if (root.barPosition === "bottom") {
              calculatedY = effMarginT;
            } else {
              calculatedY = effMarginT;
            }
          }
        }
      }
    }

    // Edge snapping for Y
    if (panelContent.allowAttach && !root.barFloating && root.height > 0 && panelHeight > 0) {
      var topEdgePos = root.barPosition === "top" ? topBarEdgeWithOverlap : (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginV);
      var bottomEdgePos = root.barPosition === "bottom" ? bottomBarEdgeWithOverlap - panelHeight : root.height - (root.isFramed ? root.frameThickness - root.attachmentOverlap : root.barMarginV) - panelHeight;

      // Only snap to top edge if panel is actually meant to be at top (or no explicit anchor)
      var shouldSnapToTop = root.effectivePanelAnchorTop || (!root.hasExplicitVerticalAnchor && root.barPosition === "top");
      // Only snap to bottom edge if panel is actually meant to be at bottom (or no explicit anchor)
      var shouldSnapToBottom = root.effectivePanelAnchorBottom || (!root.hasExplicitVerticalAnchor && root.barPosition === "bottom");

      if (shouldSnapToTop && Math.abs(calculatedY - topEdgePos) <= root.edgeSnapDistance) {
        calculatedY = topEdgePos;
      } else if (shouldSnapToBottom && Math.abs(calculatedY - bottomEdgePos) <= root.edgeSnapDistance) {
        calculatedY = bottomEdgePos;
      }
    }

    // Apply calculated positions (set targets for animation)
    panelBackground.targetX = calculatedX;
    panelBackground.targetY = calculatedY;

    // Logger.d("SmartPanel", "Position calculated:", calculatedX, calculatedY);
    // Logger.d("SmartPanel", "  Panel size:", panelWidth, "x", panelHeight);
    // Logger.d("SmartPanel", "  Parent size:", root.width, "x", root.height);
  }

  // Watch for changes in content-driven sizes and update position
  Connections {
    target: contentLoader.item
    ignoreUnknownSignals: true

    function onContentPreferredWidthChanged() {
      if (root.isPanelOpen && root.isPanelVisible) {
        root.setPosition();
      }
    }

    function onContentPreferredHeightChanged() {
      if (root.isPanelOpen && root.isPanelVisible) {
        root.setPosition();
      }
    }
  }

  // Opacity animation
  // Opening: fade in after size animation reaches 75%
  // Closing: fade out immediately
  opacity: {
    if (isClosing)
      return 0.0; // Fade out when closing
    if (isPanelVisible && sizeAnimationComplete)
      return 1.0; // Fade in when opening
    return 0.0;
  }

  Behavior on opacity {
    enabled: !PanelService.closedImmediately
    NumberAnimation {
      id: opacityAnimation
      duration: root.isClosing ? Style.animationFaster : Style.animationFast
      easing.type: Easing.OutQuad

      onRunningChanged: {
        // Safety: If animation didn't run (zero duration), handle immediately
        if (!running && duration === 0) {
          if (root.isClosing && root.opacity === 0.0) {
            root.opacityFadeComplete = true;
            var shouldFinalizeNow = panelContent.geometryPlaceholder && !panelContent.geometryPlaceholder.shouldAnimateWidth && !panelContent.geometryPlaceholder.shouldAnimateHeight;
            if (shouldFinalizeNow) {
              // Logger.d("SmartPanel", "Zero-duration opacity + no size animation - finalizing", root.objectName);
              Qt.callLater(root.finalizeClose);
            }
          } else if (root.isPanelVisible && root.opacity === 1.0) {
            // Open completed with zero duration
            root.openWatchdogActive = false;
            openWatchdogTimer.stop();
          }
          return;
        }

        // When opacity fade completes during close, trigger size animation
        if (!running && root.isClosing && root.opacity === 0.0) {
          root.opacityFadeComplete = true;
          // If no size animation will run (centered attached panels only), finalize immediately
          // Detached panels (allowAttach === false) should always animate from top
          var shouldFinalizeNow = panelContent.geometryPlaceholder && !panelContent.geometryPlaceholder.shouldAnimateWidth && !panelContent.geometryPlaceholder.shouldAnimateHeight;
          if (shouldFinalizeNow) {
            //Logger.d("SmartPanel", "No animation - finalizing immediately", root.objectName);
            Qt.callLater(root.finalizeClose);
          } else {
            //Logger.d("SmartPanel", "Animation will run - waiting for size animation", root.objectName, "shouldAnimateHeight:", panelContent.geometryPlaceholder.shouldAnimateHeight, "shouldAnimateWidth:", panelContent.geometryPlaceholder.shouldAnimateWidth);
          }
        } // When opacity fade completes during open, stop watchdog
        else if (!running && root.isPanelVisible && root.opacity === 1.0) {
          root.openWatchdogActive = false;
          openWatchdogTimer.stop();
        }
      }
    }
  }

  // Timer to trigger opacity fade at 50% of size animation
  Timer {
    id: opacityTrigger
    interval: Style.animationNormal * 0.5
    repeat: false
    onTriggered: {
      if (root.isPanelVisible) {
        root.sizeAnimationComplete = true;
      }
    }
  }

  // Watchdog timer for open sequence (safety mechanism)
  Timer {
    id: openWatchdogTimer
    interval: Style.animationNormal * 3 // 3x normal animation time
    repeat: false
    onTriggered: {
      if (root.openWatchdogActive) {
        Logger.w("SmartPanel", "Open watchdog timeout - forcing panel visible state", root.objectName);
        root.openWatchdogActive = false;
        // Force completion of open sequence
        if (root.isPanelOpen && !root.isPanelVisible) {
          root.isPanelVisible = true;
          root.sizeAnimationComplete = true;
        }
      }
    }
  }

  // Watchdog timer for close sequence (safety mechanism)
  Timer {
    id: closeWatchdogTimer
    interval: Style.animationFast * 3 // 3x fast animation time
    repeat: false
    onTriggered: {
      if (root.closeWatchdogActive && !root.closeFinalized) {
        Logger.w("SmartPanel", "Close watchdog timeout - forcing panel close", root.objectName);
        // Force finalization
        Qt.callLater(root.finalizeClose);
      }
    }
  }

  // ------------------------------------------------
  // Panel Content
  Item {
    id: panelContent
    anchors.fill: parent

    // Screen-dependent attachment properties
    // Allow panel content to override allowAttach (e.g., plugin panels)
    readonly property bool allowAttach: {
      if (contentLoader.item && contentLoader.item.allowAttach !== undefined) {
        return contentLoader.item.allowAttach;
      }
      return Settings.data.ui.panelsAttachedToBar || root.forceAttachToBar;
    }
    readonly property bool allowAttachToBar: {
      if (!(Settings.data.ui.panelsAttachedToBar || root.forceAttachToBar)) {
        return false;
      }

      // A panel can only be attached to a bar if there is a bar on that screen
      var monitors = Settings.data.bar.monitors || [];
      var result = monitors.length === 0 || monitors.includes(root.screen?.name || "");
      return result;
    }

    // Edge detection - detect if panel is touching screen edges
    readonly property bool touchingLeftEdge: allowAttach && panelBackground.x <= (isFramed ? frameThickness + 1 : 1)
    readonly property bool touchingRightEdge: allowAttach && (panelBackground.x + panelBackground.width) >= (root.width - (isFramed ? frameThickness + 1 : 1))
    readonly property bool touchingTopEdge: allowAttach && panelBackground.y <= (isFramed ? frameThickness + 1 : 1)
    readonly property bool touchingBottomEdge: allowAttach && (panelBackground.y + panelBackground.height) >= (root.height - (isFramed ? frameThickness + 1 : 1))

    // Bar edge detection - detect if panel is touching bar edges (for cases where centered panels snap to bar due to height constraints)
    readonly property bool touchingTopBar: allowAttachToBar && root.barPosition === "top" && !root.barIsVertical && Math.abs(panelBackground.y - ((isFramed ? 0 : root.barMarginV) + root.barHeight)) <= 1
    readonly property bool touchingBottomBar: allowAttachToBar && root.barPosition === "bottom" && !root.barIsVertical && Math.abs((panelBackground.y + panelBackground.height) - (root.height - (isFramed ? 0 : root.barMarginV) - root.barHeight)) <= 1
    readonly property bool touchingLeftBar: allowAttachToBar && root.barPosition === "left" && root.barIsVertical && Math.abs(panelBackground.x - ((isFramed ? 0 : root.barMarginH) + root.barHeight)) <= 1
    readonly property bool touchingRightBar: allowAttachToBar && root.barPosition === "right" && root.barIsVertical && Math.abs((panelBackground.x + panelBackground.width) - (root.width - (isFramed ? 0 : root.barMarginH) - root.barHeight)) <= 1

    // Expose panelBackground for geometry placeholder
    property alias geometryPlaceholder: panelBackground

    // The actual panel background - provides geometry for PanelBackground rendering
    Item {
      id: panelBackground

      // Expose self as panelItem for PanelBackground compatibility
      readonly property var panelItem: panelBackground

      // Store target dimensions (Initialize to 0, set by setPosition())
      property real targetWidth: 0
      property real targetHeight: 0
      property real targetX: root.x
      property real targetY: root.y

      // Track whether dimensions have been initialized (to prevent initial changes from animating)
      property bool dimensionsInitialized: false

      property var bezierCurve: [0.05, 0, 0.133, 0.06, 0.166, 0.4, 0.208, 0.82, 0.25, 1, 1, 1]

      // Determine which edges the panel is closest to for animation direction
      // Use target position (not animated position) to avoid binding loops
      readonly property bool willTouchTopBar: {
        if (!panelContent.allowAttachToBar || root.barPosition !== "top" || root.barIsVertical)
          return false;
        var targetTopBarY = (isFramed ? 0 : root.barMarginV) + root.barHeight;
        return Math.abs(panelBackground.targetY - targetTopBarY) <= 1;
      }
      readonly property bool willTouchBottomBar: {
        if (!panelContent.allowAttachToBar || root.barPosition !== "bottom" || root.barIsVertical)
          return false;
        var targetBottomBarY = root.height - (isFramed ? 0 : root.barMarginV) - root.barHeight - panelBackground.targetHeight;
        return Math.abs(panelBackground.targetY - targetBottomBarY) <= 1;
      }
      readonly property bool willTouchLeftBar: {
        if (!panelContent.allowAttachToBar || root.barPosition !== "left" || !root.barIsVertical)
          return false;
        var targetLeftBarX = (isFramed ? 0 : root.barMarginH) + root.barHeight;
        return Math.abs(panelBackground.targetX - targetLeftBarX) <= 1;
      }
      readonly property bool willTouchRightBar: {
        if (!panelContent.allowAttachToBar || root.barPosition !== "right" || !root.barIsVertical)
          return false;
        var targetRightBarX = root.width - (isFramed ? 0 : root.barMarginH) - root.barHeight - panelBackground.targetWidth;
        return Math.abs(panelBackground.targetX - targetRightBarX) <= 1;
      }
      readonly property bool willTouchTopEdge: panelContent.allowAttach && panelBackground.targetY <= (isFramed ? frameThickness + 1 : 1)
      readonly property bool willTouchBottomEdge: panelContent.allowAttach && (panelBackground.targetY + panelBackground.targetHeight) >= (root.height - (isFramed ? frameThickness + 1 : 1))
      readonly property bool willTouchLeftEdge: panelContent.allowAttach && panelBackground.targetX <= (isFramed ? frameThickness + 1 : 1)
      readonly property bool willTouchRightEdge: panelContent.allowAttach && (panelBackground.targetX + panelBackground.targetWidth) >= (root.width - (isFramed ? frameThickness + 1 : 1))

      readonly property bool isActuallyAttachedToAnyEdge: {
        return willTouchTopBar || willTouchBottomBar || willTouchLeftBar || willTouchRightBar || willTouchTopEdge || willTouchBottomEdge || willTouchLeftEdge || willTouchRightEdge;
      }

      readonly property bool animateFromTop: {
        // Non-attached panels always roll down from top
        // Check both the setting and whether panel actually touches any edge
        if (!panelContent.allowAttach || !isActuallyAttachedToAnyEdge) {
          return true;
        }
        // When panel is opening, use effective anchors and calculated positions
        if (!root.isPanelVisible) {
          // Attached to horizontal bar at top
          if (panelContent.allowAttachToBar && root.effectivePanelAnchorTop && !root.barIsVertical) {
            return true;
          }
          // Attached to vertical bar (left/right) - don't animate from top
          // Panels attach to bar if they have allowAttach (with or without explicit anchor)
          var attachedToVerticalBar = panelContent.allowAttachToBar && root.barIsVertical && ((root.effectivePanelAnchorLeft && root.barPosition === "left") || (root.effectivePanelAnchorRight && root.barPosition === "right"));
          if (attachedToVerticalBar) {
            return false;
          }
          // Panel touching left/right/bottom screen edge - animate from that edge instead
          var touchingNonTopEdge = (willTouchLeftEdge || willTouchRightEdge || willTouchBottomEdge) && !willTouchTopBar && !willTouchBottomBar && !willTouchLeftBar && !willTouchRightBar;
          if (touchingNonTopEdge) {
            return false;
          }
          // Panel touching top screen edge (not bar)
          if (willTouchTopEdge && !willTouchTopBar && !willTouchBottomBar && !willTouchLeftBar && !willTouchRightBar) {
            return true;
          }
          // Panel anchored to left/right/bottom edge - animate from that edge instead
          if (root.panelAnchorLeft || root.panelAnchorRight || root.panelAnchorBottom) {
            return false;
          }
          // Attached to top edge
          if (panelContent.allowAttach && root.panelAnchorTop) {
            return true;
          }
          // Default: animate from top (for floating panels with no explicit anchors)
          return true;
        }
        // Panel is visible - use calculated positions
        if (willTouchTopBar) {
          return true;
        }
        if (willTouchTopEdge && !willTouchTopBar && !willTouchBottomBar && !willTouchLeftBar && !willTouchRightBar) {
          return true;
        }
        if (!isActuallyAttachedToAnyEdge) {
          return true;
        }
        return false;
      }
      readonly property bool animateFromBottom: {
        // Non-attached panels always roll down from top, not bottom
        if (!panelContent.allowAttach || !isActuallyAttachedToAnyEdge) {
          return false;
        }
        if (!root.isPanelVisible) {
          // Attached to horizontal bar at bottom
          if (panelContent.allowAttachToBar && root.effectivePanelAnchorBottom && !root.barIsVertical) {
            return true;
          }
          // Attached to vertical bar (left/right) - don't animate from bottom
          var attachedToVerticalBar = panelContent.allowAttachToBar && root.barIsVertical && ((root.effectivePanelAnchorLeft && root.barPosition === "left") || (root.effectivePanelAnchorRight && root.barPosition === "right"));
          if (attachedToVerticalBar) {
            return false;
          }
          // Panel touching bottom screen edge (not bar)
          if (willTouchBottomEdge && !willTouchTopBar && !willTouchBottomBar && !willTouchLeftBar && !willTouchRightBar) {
            return true;
          }
          // Panel anchored to top/left/right edge - don't animate from bottom
          if (root.panelAnchorTop || root.panelAnchorLeft || root.panelAnchorRight) {
            return false;
          }
          // Attached to bottom edge (when bar is vertical, panel can still be anchored to bottom)
          if (panelContent.allowAttach && root.panelAnchorBottom) {
            return true;
          }
          return false;
        }
        if (willTouchBottomBar) {
          return true;
        }
        if (willTouchBottomEdge && !willTouchTopBar && !willTouchBottomBar && !willTouchLeftBar && !willTouchRightBar) {
          return true;
        }
        return false;
      }
      readonly property bool animateFromLeft: {
        // Non-attached panels always roll down from top, not left
        if (!panelContent.allowAttach || !isActuallyAttachedToAnyEdge) {
          return false;
        }
        if (!root.isPanelVisible) {
          // Attached to vertical bar on left - must verify bar is actually on left
          if (panelContent.allowAttachToBar && root.effectivePanelAnchorLeft && root.barIsVertical && root.barPosition === "left") {
            return true;
          }
          // Panel touching left screen edge (not bar)
          if (willTouchLeftEdge && !willTouchTopBar && !willTouchBottomBar && !willTouchLeftBar && !willTouchRightBar) {
            return true;
          }
          // Panel anchored to left edge - animate from left
          // Takes precedence over top/bottom when bar is vertical
          if (root.panelAnchorLeft) {
            return true;
          }
          return false;
        }
        if (willTouchTopBar || willTouchBottomBar) {
          return false;
        }
        if (willTouchLeftBar) {
          return true;
        }
        if (willTouchTopEdge || willTouchBottomEdge) {
          return false;
        }
        if (willTouchLeftEdge && !willTouchLeftBar && !willTouchTopBar && !willTouchBottomBar && !willTouchRightBar) {
          return true;
        }
        return false;
      }
      readonly property bool animateFromRight: {
        // Non-attached panels always roll down from top, not right
        if (!panelContent.allowAttach || !isActuallyAttachedToAnyEdge) {
          return false;
        }
        if (!root.isPanelVisible) {
          // Attached to vertical bar on right - must verify bar is actually on right
          if (panelContent.allowAttachToBar && root.effectivePanelAnchorRight && root.barIsVertical && root.barPosition === "right") {
            return true;
          }
          // Panel touching right screen edge (not bar)
          if (willTouchRightEdge && !willTouchTopBar && !willTouchBottomBar && !willTouchLeftBar && !willTouchRightBar) {
            return true;
          }
          // Panel anchored to right edge - animate from right
          // Takes precedence over top/bottom when bar is vertical
          if (root.panelAnchorRight) {
            return true;
          }
          return false;
        }
        if (willTouchTopBar || willTouchBottomBar) {
          return false;
        }
        if (willTouchRightBar) {
          return true;
        }
        if (willTouchTopEdge || willTouchBottomEdge) {
          return false;
        }
        if (willTouchRightEdge && !willTouchLeftBar && !willTouchTopBar && !willTouchBottomBar && !willTouchRightBar) {
          return true;
        }
        return false;
      }

      // Determine animation axis based on which edge is closest
      // Priority: horizontal edges (top/bottom) take precedence over vertical edges (left/right)
      // This prevents diagonal animations when panel is attached to a corner
      // Use reactive values here - they're evaluated BEFORE isPanelVisible becomes true
      readonly property bool shouldAnimateWidth: !shouldAnimateHeight && (animateFromLeft || animateFromRight)
      readonly property bool shouldAnimateHeight: animateFromTop || animateFromBottom

      // Current animated width/height (referenced by x/y for right/bottom positioning)
      readonly property real currentWidth: {
        if (isClosing && opacityFadeComplete && shouldAnimateWidth)
          return 0;
        if (isClosing || isPanelVisible)
          return targetWidth;
        // If not animating width, start at target (no visual change)
        // If animating width, start at 0 (will animate to target)
        return shouldAnimateWidth ? 0 : targetWidth;
      }
      readonly property real currentHeight: {
        if (isClosing && opacityFadeComplete && shouldAnimateHeight)
          return 0;
        if (isClosing || isPanelVisible)
          return targetHeight;
        // If not animating height, start at target (no visual change)
        // If animating height, start at 0 (will animate to target)
        return shouldAnimateHeight ? 0 : targetHeight;
      }

      width: currentWidth
      height: currentHeight

      x: {
        // Offset x to make panel grow/shrink from the appropriate edge
        // Use CACHED values to prevent recalculation during animation
        if (root.cachedAnimateFromRight && root.cachedShouldAnimateWidth) {
          // Keep the RIGHT edge fixed at its target position
          var targetRightEdge = targetX + targetWidth;
          return targetRightEdge - width;
        }
        return targetX;
      }
      y: {
        // Offset y to make panel grow/shrink from the appropriate edge
        // Use CACHED values to prevent recalculation during animation
        if (root.cachedAnimateFromBottom && root.cachedShouldAnimateHeight) {
          // Keep the BOTTOM edge fixed at its target position
          var targetBottomEdge = targetY + targetHeight;
          return targetBottomEdge - height;
        }
        return targetY;
      }

      Behavior on width {
        enabled: !PanelService.closedImmediately
        NumberAnimation {
          id: widthAnimation
          // Use 0ms if dimensions not initialized to prevent initial changes from animating
          // During opening: use 0ms if not animating width, otherwise use normal duration
          // During closing: use 0ms if not animating width, otherwise use fast duration
          // During normal content resizing: always use normal duration
          duration: !panelBackground.dimensionsInitialized ? 0 : (root.isOpening && !panelBackground.shouldAnimateWidth) ? 0 : root.isOpening ? Style.animationNormal : (root.isClosing && !panelBackground.shouldAnimateWidth) ? 0 : root.isClosing ? Style.animationFast : Style.animationNormal
          easing.type: Easing.BezierSpline
          easing.bezierCurve: panelBackground.bezierCurve

          onRunningChanged: {
            // Safety: Zero-duration animation handling
            if (!running && duration === 0) {
              if (root.isClosing && panelBackground.width === 0 && panelBackground.shouldAnimateWidth) {
                Logger.d("SmartPanel", "Zero-duration width animation - finalizing", root.objectName);
                Qt.callLater(root.finalizeClose);
              }
              return;
            }

            // When width shrink completes during close, finalize
            if (!running && root.isClosing && panelBackground.width === 0 && panelBackground.shouldAnimateWidth) {
              Qt.callLater(root.finalizeClose);
            }
          }
        }
      }

      Behavior on height {
        enabled: !PanelService.closedImmediately
        NumberAnimation {
          id: heightAnimation
          // Use 0ms if dimensions not initialized to prevent initial changes from animating
          // During opening: use 0ms if not animating height, otherwise use normal duration
          // During closing: use 0ms if not animating height, otherwise use fast duration
          // During normal content resizing: always use normal duration
          duration: !panelBackground.dimensionsInitialized ? 0 : (root.isOpening && !panelBackground.shouldAnimateHeight) ? 0 : root.isOpening ? Style.animationNormal : (root.isClosing && !panelBackground.shouldAnimateHeight) ? 0 : root.isClosing ? Style.animationFast : Style.animationNormal
          easing.type: Easing.BezierSpline
          easing.bezierCurve: panelBackground.bezierCurve

          onRunningChanged: {
            // Safety: Zero-duration animation handling
            if (!running && duration === 0) {
              if (root.isClosing && panelBackground.height === 0 && panelBackground.shouldAnimateHeight) {
                Logger.d("SmartPanel", "Zero-duration height animation - finalizing", root.objectName);
                Qt.callLater(root.finalizeClose);
              }
              return;
            }

            // When height shrink completes during close, finalize
            if (!running && root.isClosing && panelBackground.height === 0 && panelBackground.shouldAnimateHeight) {
              Qt.callLater(root.finalizeClose);
            }
          }
        }
      }

      // Corner states for PanelBackground to read
      // State -1: No radius (flat/square corner)
      // State 0: Normal (inner curve)
      // State 1: Horizontal inversion (outer curve on X-axis)
      // State 2: Vertical inversion (outer curve on Y-axis)

      // Smart corner state calculation based on bar attachment and edge touching
      property int topLeftCornerState: {
        // If bar is not visible, don't show outer corners based on bar attachment
        if (!root.barShouldShow) {
          // Only check edge touching, not bar touching
          var edgeInverted = panelContent.allowAttach && (panelContent.touchingLeftEdge || panelContent.touchingTopEdge);
          if (edgeInverted) {
            if (panelContent.touchingLeftEdge && panelContent.touchingTopEdge)
              return 0; // Both edges: no inversion (normal rounded corner)
            if (panelContent.touchingLeftEdge)
              return 2; // Left edge: vertical inversion
            if (panelContent.touchingTopEdge)
              return 1; // Top edge: horizontal inversion
          }
          return 0;
        }

        var barTouchInverted = panelContent.touchingTopBar || panelContent.touchingLeftBar;
        // Invert if touching either edge that forms this corner (left OR top), regardless of bar position
        var edgeInverted = panelContent.allowAttach && (panelContent.touchingLeftEdge || panelContent.touchingTopEdge);

        if (barTouchInverted || edgeInverted) {
          // Determine inversion direction based on which edge is touched
          if (panelContent.touchingLeftEdge && panelContent.touchingTopEdge)
            return 0; // Both edges: no inversion (normal rounded corner)
          if (panelContent.touchingLeftEdge)
            return 2; // Left edge: vertical inversion
          if (panelContent.touchingTopEdge)
            return 1; // Top edge: horizontal inversion
          return root.barIsVertical ? 2 : 1;
        }
        return 0;
      }

      property int topRightCornerState: {
        // If bar is not visible, don't show outer corners based on bar attachment
        if (!root.barShouldShow) {
          // Only check edge touching, not bar touching
          var edgeInverted = panelContent.allowAttach && (panelContent.touchingRightEdge || panelContent.touchingTopEdge);
          if (edgeInverted) {
            if (panelContent.touchingRightEdge && panelContent.touchingTopEdge)
              return 0; // Both edges: no inversion (normal rounded corner)
            if (panelContent.touchingRightEdge)
              return 2; // Right edge: vertical inversion
            if (panelContent.touchingTopEdge)
              return 1; // Top edge: horizontal inversion
          }
          return 0;
        }

        var barTouchInverted = panelContent.touchingTopBar || panelContent.touchingRightBar;
        // Invert if touching either edge that forms this corner (right OR top), regardless of bar position
        var edgeInverted = panelContent.allowAttach && (panelContent.touchingRightEdge || panelContent.touchingTopEdge);

        if (barTouchInverted || edgeInverted) {
          // Determine inversion direction based on which edge is touched
          if (panelContent.touchingRightEdge && panelContent.touchingTopEdge)
            return 0; // Both edges: no inversion (normal rounded corner)
          if (panelContent.touchingRightEdge)
            return 2; // Right edge: vertical inversion
          if (panelContent.touchingTopEdge)
            return 1; // Top edge: horizontal inversion
          return root.barIsVertical ? 2 : 1;
        }
        return 0;
      }

      property int bottomLeftCornerState: {
        // If bar is not visible, don't show outer corners based on bar attachment
        if (!root.barShouldShow) {
          // Only check edge touching, not bar touching
          var edgeInverted = panelContent.allowAttach && (panelContent.touchingLeftEdge || panelContent.touchingBottomEdge);
          if (edgeInverted) {
            if (panelContent.touchingLeftEdge && panelContent.touchingBottomEdge)
              return 0; // Both edges: no inversion (normal rounded corner)
            if (panelContent.touchingLeftEdge)
              return 2; // Left edge: vertical inversion
            if (panelContent.touchingBottomEdge)
              return 1; // Bottom edge: horizontal inversion
          }
          return 0;
        }

        var barTouchInverted = panelContent.touchingBottomBar || panelContent.touchingLeftBar;
        // Invert if touching either edge that forms this corner (left OR bottom), regardless of bar position
        var edgeInverted = panelContent.allowAttach && (panelContent.touchingLeftEdge || panelContent.touchingBottomEdge);

        if (barTouchInverted || edgeInverted) {
          // Determine inversion direction based on which edge is touched
          if (panelContent.touchingLeftEdge && panelContent.touchingBottomEdge)
            return 0; // Both edges: no inversion (normal rounded corner)
          if (panelContent.touchingLeftEdge)
            return 2; // Left edge: vertical inversion
          if (panelContent.touchingBottomEdge)
            return 1; // Bottom edge: horizontal inversion
          return root.barIsVertical ? 2 : 1;
        }
        return 0;
      }

      property int bottomRightCornerState: {
        // If bar is not visible, don't show outer corners based on bar attachment
        if (!root.barShouldShow) {
          // Only check edge touching, not bar touching
          var edgeInverted = panelContent.allowAttach && (panelContent.touchingRightEdge || panelContent.touchingBottomEdge);
          if (edgeInverted) {
            if (panelContent.touchingRightEdge && panelContent.touchingBottomEdge)
              return 0; // Both edges: no inversion (normal rounded corner)
            if (panelContent.touchingRightEdge)
              return 2; // Right edge: vertical inversion
            if (panelContent.touchingBottomEdge)
              return 1; // Bottom edge: horizontal inversion
          }
          return 0;
        }

        var barTouchInverted = panelContent.touchingBottomBar || panelContent.touchingRightBar;
        // Invert if touching either edge that forms this corner (right OR bottom), regardless of bar position
        var edgeInverted = panelContent.allowAttach && (panelContent.touchingRightEdge || panelContent.touchingBottomEdge);

        if (barTouchInverted || edgeInverted) {
          // Determine inversion direction based on which edge is touched
          if (panelContent.touchingRightEdge && panelContent.touchingBottomEdge)
            return 0; // Both edges: no inversion (normal rounded corner)
          if (panelContent.touchingRightEdge)
            return 2; // Right edge: vertical inversion
          if (panelContent.touchingBottomEdge)
            return 1; // Bottom edge: horizontal inversion
          return root.barIsVertical ? 2 : 1;
        }
        return 0;
      }

      // MouseArea to catch clicks on the panel and prevent them from reaching the background
      // This prevents closing the panel when clicking inside it
      MouseArea {
        anchors.fill: parent
        acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
        z: -1 // Behind content, but on the panel background
        onClicked: mouse => {
                     mouse.accepted = true; // Accept and ignore - prevents propagation to background
                   }
      }
    }

    // Panel top content: Text, icons, etc...
    Loader {
      id: contentLoader
      active: isPanelOpen
      x: panelBackground.x
      y: panelBackground.y
      width: panelBackground.width
      height: panelBackground.height
      sourceComponent: root.panelContent

      onLoaded: {
        // Wait for contentPreferredWidth/Height to be available before making visible
        Qt.callLater(function () {
          // Calculate position with stable contentPreferredWidth/Height values
          setPosition();

          // Mark dimensions as initialized to enable animations
          panelBackground.dimensionsInitialized = true;

          // Cache animation direction BEFORE isPanelVisible becomes true
          // This locks in the direction for the entire open/close cycle
          root.cachedAnimateFromTop = panelBackground.animateFromTop;
          root.cachedAnimateFromBottom = panelBackground.animateFromBottom;
          root.cachedAnimateFromLeft = panelBackground.animateFromLeft;
          root.cachedAnimateFromRight = panelBackground.animateFromRight;
          root.cachedShouldAnimateWidth = panelBackground.shouldAnimateWidth;
          root.cachedShouldAnimateHeight = panelBackground.shouldAnimateHeight;

          // Make panel visible, now only the intended dimension will animate
          root.isPanelVisible = true;

          if (root.animationsDisabled) {
            // Skip delay when animations are disabled
            root.sizeAnimationComplete = true;
          } else {
            opacityTrigger.start();
          }

          // Start open watchdog timer (skip when animations disabled - everything completes synchronously)
          if (!root.animationsDisabled) {
            root.openWatchdogActive = true;
            openWatchdogTimer.start();
          }

          opened();
        });
      }
    }
  }

  Component.onCompleted: {
    PanelService.registerPanel(root);
  }
}