// Full, shippable page — real size at normal type scale. The registry
// preview above is a scaled-down miniature of this same composition, not
// a different component.
"use client";

import { useState } from "react";
import { Lock } from "lucide-react";

function BrandPanel({ brandName, accent }: { brandName: string; accent: string }) {
  return (
    <div className="relative isolate hidden flex-col justify-between overflow-hidden bg-neutral-100 px-10 py-10 md:flex">
      <div
        aria-hidden
        className="pointer-events-none absolute -bottom-24 -right-24 -z-10 h-72 w-72 rounded-full opacity-30 blur-3xl"
        style={{ background: accent }}
      />
      <div className="flex items-center gap-2">
        <span className="h-6 w-6 rounded-md" style={{ background: accent }} />

  // ---------------------------------------------------------------
  // Full source available with a viberdy Pro subscription.
  // https://viberdy.dev/pricing
  // ---------------------------------------------------------------
}