export class MainMenuScene extends Phaser.Scene {
  constructor() { super('MainMenuScene'); }

  create() {
    const save = this.registry.get('save');
    const { width, height } = this.scale;

    // Background
    this.add.rectangle(width / 2, height / 2, width, height, 0x0d1b2a);

    // Decorative elements
    this.add.rectangle(width / 2, height / 2, width, 2, 0x1a3a5c).setAlpha(0.5);

    // Title
    this.add.text(width / 2, 100, "TYRANT'S EDGE", {
      fontSize: '48px',
      color: '#d4af37',
      stroke: '#000000',
      strokeThickness: 4
    }).setOrigin(0.5);

    this.add.text(width / 2, 155, 'A Collectible Card Game', {
      fontSize: '18px', color: '#888888'
    }).setOrigin(0.5);

    // Gold display
    this.goldText = this.add.text(width - 20, 20, `Gold: ${save.gold}`, {
      fontSize: '18px', color: '#ffd700'
    }).setOrigin(1, 0);

    // Version
    this.add.text(20, height - 20, 'v1.0', {
      fontSize: '12px', color: '#444444'
    }).setOrigin(0, 1);

    const buttons = [
      { label: 'Campaign', scene: 'CampaignScene' },
      { label: 'Skirmish', scene: 'BattleScene', data: { skirmish: true } },
      { label: 'Deck Builder', scene: 'DeckBuilderScene' },
      { label: 'Collection', scene: 'CollectionScene' },
      { label: 'Store', scene: 'StoreScene' },
      { label: 'Fusion Lab', scene: 'FusionScene' }
    ];

    buttons.forEach((btn, i) => {
      this._makeButton(width / 2, 250 + i * 70, btn.label, () => {
        this.scene.start(btn.scene, btn.data || {});
      });
    });
  }

  _makeButton(x, y, label, callback) {
    const bg = this.add.rectangle(x, y, 280, 50, 0x1a3a5c)
      .setInteractive({ useHandCursor: true })
      .setStrokeStyle(2, 0x4488ff);

    const text = this.add.text(x, y, label, {
      fontSize: '20px', color: '#ffffff'
    }).setOrigin(0.5);

    bg.on('pointerover', () => bg.setFillStyle(0x2a5a8c));
    bg.on('pointerout', () => bg.setFillStyle(0x1a3a5c));
    bg.on('pointerdown', callback);

    return { bg, text };
  }
}