{
  "$schema": "https://schemas.wp.org/trunk/block.json",
  "apiVersion": 3,
  "name": "bpsc/app-showcase-section",
  "version": "1.0.0",
  "title": "App Showcase Section",
  "category": "bPlugins",
  "description": "Display product screenshots in realistic device frames with feature lists and multiple layouts.",
  "keywords": [
    "app",
    "showcase",
    "screenshot",
    "device",
    "mockup",
    "phone",
    "tablet",
    "browser",
    "product",
    "saas",
    "section"
  ],
  "textdomain": "section-collection",
  "attributes": {
    "themeStyle": {
      "type": "object",
      "default": {
        "theme": "style-1"
      }
    },
    "content": {
      "type": "object",
      "default": {
        "badgeText": "See It In Action",
        "title": "A Product That Speaks for Itself",
        "subtitle": "Take a look inside and see why thousands of teams love using our app every day.",
        "screenshots": [
          {
            "id": "ss-1",
            "url": "",
            "alt": "App screenshot 1",
            "caption": "Dashboard overview"
          },
          {
            "id": "ss-2",
            "url": "",
            "alt": "App screenshot 2",
            "caption": "Analytics view"
          },
          {
            "id": "ss-3",
            "url": "",
            "alt": "App screenshot 3",
            "caption": "Settings panel"
          }
        ],
        "featureList": [
          {
            "id": "fl-1",
            "icon": "check",
            "title": "Real-Time Analytics",
            "description": "Monitor performance metrics live with beautiful charts and actionable insights."
          },
          {
            "id": "fl-2",
            "icon": "shield",
            "title": "Enterprise Security",
            "description": "Bank-grade encryption keeps your data safe and your team compliant."
          },
          {
            "id": "fl-3",
            "icon": "bolt",
            "title": "Blazing Fast",
            "description": "Optimised from the ground up so every interaction feels instant."
          }
        ],
        "primaryBtnText": "Get Started Free",
        "primaryBtnUrl": "#",
        "primaryBtnTarget": "_self",
        "secondaryBtnText": "Watch Demo",
        "secondaryBtnUrl": "#",
        "secondaryBtnTarget": "_self"
      }
    },
    "elements": {
      "type": "object",
      "default": {
        "isBadge": true,
        "isTitle": true,
        "isSubtitle": true,
        "isFeatureList": true,
        "isPrimaryBtn": true,
        "isSecondaryBtn": true
      }
    },
    "deviceFrame": {
      "type": "object",
      "default": {
        "type": "phone",
        "colorScheme": "dark",
        "customColor": "#1a1a2e",
        "showShadow": true,
        "shadowColor": "rgba(0,0,0,0.25)"
      }
    },
    "carousel": {
      "type": "object",
      "default": {
        "autoPlay": false,
        "autoPlayInterval": 3000,
        "showDots": true,
        "showArrows": true
      }
    },
    "layout": {
      "type": "object",
      "default": {
        "imagePosition": "right",
        "contentAlign": "left",
        "maxWidth": "1200px",
        "featureColumns": 1
      }
    },
    "titleStyle": {
      "type": "object",
      "default": {
        "color": "#111827",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 700,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 40,
            "tablet": 34,
            "mobile": 28
          },
          "lineHeight": "1.2"
        }
      }
    },
    "subtitleStyle": {
      "type": "object",
      "default": {
        "color": "#6b7280",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 400,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 17,
            "tablet": 16,
            "mobile": 15
          },
          "lineHeight": "1.65"
        }
      }
    },
    "badgeStyle": {
      "type": "object",
      "default": {
        "backgroundColor": "#ede9fe",
        "textColor": "#6366f1",
        "borderRadius": {
          "top": "20px",
          "right": "20px",
          "bottom": "20px",
          "left": "20px"
        },
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 600,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 13,
            "tablet": 13,
            "mobile": 13
          }
        }
      }
    },
    "featureTitleStyle": {
      "type": "object",
      "default": {
        "color": "#111827",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 600,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 16,
            "tablet": 15,
            "mobile": 15
          },
          "lineHeight": "1.4"
        }
      }
    },
    "featureDescStyle": {
      "type": "object",
      "default": {
        "color": "#6b7280",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 400,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 14,
            "tablet": 14,
            "mobile": 14
          },
          "lineHeight": "1.6"
        }
      }
    },
    "captionStyle": {
      "type": "object",
      "default": {
        "color": "#6b7280",
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 400,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 14,
            "tablet": 13,
            "mobile": 13
          },
          "lineHeight": "1.4"
        }
      }
    },
    "primaryBtnStyle": {
      "type": "object",
      "default": {
        "backgroundColor": "#6366f1",
        "textColor": "#ffffff",
        "hoverBackgroundColor": "#4f46e5",
        "hoverTextColor": "#ffffff",
        "borderRadius": {
          "top": "8px",
          "right": "8px",
          "bottom": "8px",
          "left": "8px"
        },
        "padding": {
          "desktop": {
            "top": "14px",
            "right": "28px",
            "bottom": "14px",
            "left": "28px"
          },
          "tablet": {
            "top": "12px",
            "right": "24px",
            "bottom": "12px",
            "left": "24px"
          },
          "mobile": {
            "top": "12px",
            "right": "20px",
            "bottom": "12px",
            "left": "20px"
          }
        },
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 600,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 15,
            "tablet": 15,
            "mobile": 14
          }
        }
      }
    },
    "secondaryBtnStyle": {
      "type": "object",
      "default": {
        "backgroundColor": "transparent",
        "textColor": "#6366f1",
        "hoverBackgroundColor": "#ede9fe",
        "hoverTextColor": "#4f46e5",
        "borderColor": "#6366f1",
        "borderWidth": "2px",
        "borderRadius": {
          "top": "8px",
          "right": "8px",
          "bottom": "8px",
          "left": "8px"
        },
        "padding": {
          "desktop": {
            "top": "14px",
            "right": "28px",
            "bottom": "14px",
            "left": "28px"
          },
          "tablet": {
            "top": "12px",
            "right": "24px",
            "bottom": "12px",
            "left": "24px"
          },
          "mobile": {
            "top": "12px",
            "right": "20px",
            "bottom": "12px",
            "left": "20px"
          }
        },
        "typo": {
          "fontCategory": "sans-serif",
          "fontFamily": "Default",
          "fontWeight": 600,
          "isUploadFont": true,
          "fontSize": {
            "desktop": 15,
            "tablet": 15,
            "mobile": 14
          }
        }
      }
    },
    "featureIconStyle": {
      "type": "object",
      "default": {
        "color": "#6366f1",
        "backgroundColor": "#ede9fe",
        "size": "20px"
      }
    },
    "wrapper": {
      "type": "object",
      "default": {
        "bg": {
          "type": "solid",
          "color": "#ffffff",
          "gradient": "linear-gradient(135deg, #f0f4ff 0%, #faf5ff 100%)",
          "overlayColor": "rgba(0,0,0,0)",
          "image": {
            "url": ""
          },
          "position": "center center",
          "repeat": "no-repeat",
          "size": "cover"
        },
        "padding": {
          "desktop": {
            "top": "80px",
            "right": "24px",
            "bottom": "80px",
            "left": "24px"
          },
          "tablet": {
            "top": "60px",
            "right": "20px",
            "bottom": "60px",
            "left": "20px"
          },
          "mobile": {
            "top": "48px",
            "right": "16px",
            "bottom": "48px",
            "left": "16px"
          }
        }
      }
    },
    "alignment": {
      "type": "string",
      "default": "left"
    },
    "align": {
      "type": "string",
      "default": "full"
    }
  },
  "supports": {
    "align": [
      "wide",
      "full"
    ],
    "html": false
  },
  "example": {
    "attributes": {}
  },
  "editorScript": "file:../index.js",
  "style": "file:./view.css",
  "render": "file:./render.php",
  "viewScript": "file:./view.js"
}