Payphone

Keypad
• 12-key dial pad layout (1–9, *, 0, #)
• Custom image per key via upload or external URL
• Default payphone-style key images included
• Adjustable key size for desktop and mobile
• Independent horizontal and vertical key gap controls
• Per-key drop shadow with color, blur, and Y offset

Key Press Animation
• Physical press effect with scale, depth, and brightness
• Adjustable press scale (shrink amount on tap)
• Press translate Y for downward movement depth
• Press brightness control (darken or lighten on press)
• Adjustable press animation duration

Keypress Sound
• Single sound mode: same tone for every key
• Individual sound mode: unique tone per key
• Default DTMF dial tone included
• Custom sound URL per key (MP3)
• Independent volume control for desktop and mobile

Passcode System
• Configurable passcode length from 1 to 100 digits
• Passcode supports digits, *, and # characters
• Shake animation on incorrect entry with auto-clear
• Delete button to backspace entered digits
• Option to hide the delete button entirely

Digit Display
• Underline mode with placeholder slots for each digit
• Invisible mode: digits appear centered as entered
• Adjustable max digits per row with wrapping
• Digit color, font size, and font weight controls
• Independent desktop and mobile sizing
• Underline color, thickness, and width controls
• Toggle underlines on or off independently

Password Page Mode
• Shopify password page unlock via keypad entry
• Submits entered code directly to Shopify's password form
• Works on any Shopify password-protected storefront

Success States
• Four success modes: reveal text, keep digits, redirect, or do nothing
• Rich text success message with full formatting
• Custom success text color
• Hide prompt text on success toggle
• Product reveal: auto-pull featured image, title, and price from any Shopify product
• Product title and price position (above or below image) with independent font, size, weight, and color
• Custom image reveal with upload or external URL
• Image link with same-tab or new-tab control
• Image max width independent for desktop and mobile
• Gap controls above and below success image
• Restart button with custom text and color
• Gap between success content and restart button

Decorative Image
• Optional decorative image placement: above, between digits and keypad, or below keypad
• Upload or external URL support
• Full width toggle
• Max width independent for desktop and mobile
• Gap from adjacent element for desktop and mobile

Background
• Background image via upload or external URL
• Background video via Shopify hosted or external URL
• Cover or contain fit mode
• Dark overlay with adjustable opacity (0–90%)
• Fallback background color

Prompt Text
• Custom prompt text (e.g. "Enter Code")
• Hide prompt text toggle
• Prompt color, font size, and font weight
• Independent desktop and mobile font sizing

Text Shadow
• Global text shadow applied to all text elements
• Shadow color, blur, and Y offset controls

Font
• Shopify font picker integration
• Applied globally across prompt, digits, success, product info, and delete button

Layout
• Section min height independent for desktop and mobile
• Section padding top, bottom, and left/right for desktop and mobile
• Gap: prompt to digits (desktop and mobile)
• Gap: digits to keypad (desktop and mobile)
• Gap: keypad to bottom row (desktop and mobile)

Colors
• Section background color
• Prompt, digit, underline, success text, restart text, and delete button colors
• Product title and price colors
• Key shadow color
• Text shadow color