// import { Component } from '@angular/core';
// import { CommonModule } from '@angular/common';  // ✅ Import this

// @Component({
//   selector: 'app-middle-section',
//   standalone: true,
//   imports: [CommonModule],  // ✅ Add CommonModule here
//   templateUrl: './middle-section.component.html',
//   styleUrls: ['./middle-section.component.css']
// })
// export class MiddleSectionComponent {
//   rows = Array.from({ length: 5 });
//   summaryRows = Array.from({ length: 4 }); // 4 empty rows for now

// }

import { Component, Input } from '@angular/core';
import { CommonModule } from '@angular/common';

@Component({
  selector: 'app-middle-section',
  standalone: true,
  imports: [CommonModule],
  templateUrl: './middle-section.component.html',
  styleUrls: ['./middle-section.component.css']
})
export class MiddleSectionComponent {
  @Input() containerHeight: string = '50vh'; // default for home screen

  rows = Array.from({ length: 5 });
  summaryRows = Array.from({ length: 4 }); // 4 empty rows for now
}