/* 1.1.58: viewport-safe mobile tools. Appended to <html>, not to transformed
   WooCommerce <body> or product wrappers; preserve the fixed placement while
   allowing the stage visibility logic to hide the dock outside the editor. */
@media (max-width:850px) {
  html > .kskd-mobile-appbar.kskd-viewport-portal:not([hidden]) {
    position:fixed!important;
    top:auto!important;
    right:auto!important;
    bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;
    /* 1.1.59: a viewport-based offset, never 50% of an oversized html */
    left:max(8px, calc((100vw - 520px)/2))!important;
    width:calc(100vw - 16px)!important;
    max-width:520px!important;
    margin:0!important;
    transform:none!important;
    font-family:var(--kskd-portal-font,Arial,sans-serif)!important;
    z-index:2147483003!important;
    box-sizing:border-box!important;
  }
  html > .kskd-mobile-appbar.kskd-viewport-portal.kskd-studio-mobile-ui:not([hidden]) {
    bottom:calc(6px + env(safe-area-inset-bottom,0px))!important;
    width:calc(100vw - 14px)!important;
    max-width:560px!important;
    left:max(7px, calc((100vw - 560px)/2))!important;
  }
  html > .kskd-mobile-sheet.kskd-viewport-portal:not([hidden]) {
    position:fixed!important;
    top:auto!important;
    left:max(8px, calc((100vw - 520px)/2))!important;
    right:auto!important;
    bottom:calc(81px + env(safe-area-inset-bottom,0px) + var(--kskd-sheet-keyboard,0px))!important;
    width:calc(100vw - 16px)!important;
    max-width:520px!important;
    margin:0!important;
    transform:none!important;
    font-family:var(--kskd-portal-font,Arial,sans-serif)!important;
    z-index:2147483004!important;
  }
  html > .kskd-mobile-sheet.kskd-viewport-portal.kskd-studio-mobile-ui:not([hidden]) {
    width:calc(100vw - 14px)!important;
    max-width:560px!important;
    left:max(7px, calc((100vw - 560px)/2))!important;
    bottom:calc(69px + env(safe-area-inset-bottom,0px) + var(--kskd-sheet-keyboard,0px))!important;
  }
  html > .kskd-mobile-sheet.kskd-viewport-portal.kskd-keyboard-open:not([hidden]) {
    bottom:calc(8px + env(safe-area-inset-bottom,0px) + var(--kskd-sheet-keyboard,0px))!important;
  }
  html > .kskd-dock-swipe-hint.kskd-viewport-portal:not([hidden]) {
    position:fixed!important;
    top:auto!important;
    bottom:calc(85px + env(safe-area-inset-bottom,0px))!important;
    z-index:2147483003!important;
  }
  /* The selected-element quick editor shares the same portal; its dimensions
     and visibility are still controlled by the existing mobile CSS and JS. */
  html > .kskd-mobile-dock.kskd-viewport-portal:not([hidden]) {
    position:fixed!important;
    font-family:var(--kskd-portal-font,Arial,sans-serif)!important;
  }
  /* Preserve the glass theme when the controls no longer descend from body. */
  html > .kskd-mobile-appbar.kskd-viewport-liquid-matte:not([hidden]) {
    border-radius:26px!important;
    background:var(--kskd-glass-panel,rgba(250,252,255,.96))!important;
    border:1px solid var(--kskd-glass-stroke,#d3e2f0)!important;
    box-shadow:0 10px 30px rgba(31,68,121,.18),inset 0 1px 0 rgba(255,255,255,.8)!important;
  }
  html > .kskd-mobile-appbar.kskd-viewport-liquid-matte button {
    background:var(--kskd-glass-surface,#fff)!important;
    color:var(--kskd-glass-ink,#20324c)!important;
    border:1px solid rgba(216,228,242,.96)!important;
    border-radius:19px!important;
  }
  html > .kskd-mobile-appbar.kskd-viewport-liquid-matte button.is-active {
    background:var(--kskd-glass-active,#e1efff)!important;
    color:var(--kskd-glass-accent,#347bd0)!important;
  }
  html > .kskd-mobile-sheet.kskd-viewport-liquid-matte:not([hidden]),
  html > .kskd-mobile-dock.kskd-viewport-liquid-matte:not([hidden]) {
    background:var(--kskd-glass-panel,#fff)!important;
    border-color:var(--kskd-glass-stroke,#d3e2f0)!important;
  }
  /* Product-switch modal must conceal every control portaled outside <body>. */
  html:has(> body.kskd-switch-active) > .kskd-viewport-portal {
    visibility:hidden!important;
    pointer-events:none!important;
  }
}
@media(max-width:370px) {
  html > .kskd-mobile-appbar.kskd-viewport-portal:not([hidden]),
  html > .kskd-mobile-sheet.kskd-viewport-portal:not([hidden]) {
    width:calc(100vw - 10px)!important;
  }
}
