import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { NavbarComponent } from '../navbar/navbar.component';
import { SidebarComponent } from '../sidebar/sidebar.component';


@Component({
  selector: 'app-layout',
  imports: [
    CommonModule,
    RouterModule,
    NavbarComponent,
    SidebarComponent
  ],
  templateUrl: './layout.component.html',
  styleUrl: './layout.component.scss',
  standalone: true,
})
export class LayoutComponent {
  isSidebarVisible: boolean = true;
  toggleSidebar() {
    console.log('Toggling sidebar, current state:', this.isSidebarVisible);
    this.isSidebarVisible = !this.isSidebarVisible;
    console.log('New sidebar state:', this.isSidebarVisible);
    
    // Aplicar clase al body solo para móviles
    if (window.innerWidth <= 992) {
      document.body.classList.toggle('sidebar-visible', this.isSidebarVisible);
    }
  }
}
