{
  "$schema": "https://schemas.wp.org/trunk/theme.json",
  "version": 3,
  "title": "Email Input with Submit",
  "slug": "email-input-submit",
  "blockTypes": [
    "core/button"
  ],
  "styles": {
    "css": "position: relative; width: 100%; max-width: 400px; display: inline-flex; align-items: center; gap: 12px; background: var(--wp--preset--color--base); border-radius: 50px; padding: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); &::before { content: attr(data-placeholder); position: absolute; left: 24px; color: var(--wp--preset--color--accent-3); font-size: 16px; pointer-events: none; z-index: 1; } &::after { content: '→'; display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: var(--wp--preset--color--accent-5); color: var(--wp--preset--color--base); border-radius: 50%; font-size: 18px; font-weight: bold; margin-left: auto; cursor: pointer; transition: all 0.3s ease; } &:hover::after { background: var(--wp--preset--color--accent-4); transform: scale(1.05); } &:active::after { background: var(--wp--preset--color--accent-5); transform: scale(0.95); }",
    "typography": {
      "fontSize": "16px",
      "fontWeight": "400",
      "textAlign": "left",
      "textTransform": "none"
    },
    "border": {
      "radius": "50px",
      "width": "1px",
      "color": "var:preset|color|accent-2",
      "style": "solid"
    },
    "color": {
      "background": "var:preset|color|base",
      "text": "var:preset|color|accent-5"
    },
    "spacing": {
      "padding": {
        "top": "8px",
        "right": "8px",
        "bottom": "8px",
        "left": "24px"
      }
    }
  }
}