/* Basic styling for the body and HTML to fill the page, center content, and set a black background */
body, html {
  height: 100%;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #000000; /* Black background for the terminal effect */
}

/* Styling for the 
 tag inside the terminal to mimic the green text on black background typical of old terminals */
#terminal pre {
  color: #00ff00; /* Green text */
  font-family: 'VT323', monospace; /* Retro monospace font */
  margin: 0; /* Remove default margin */
  padding: 0; /* Align with terminal content padding */
  white-space: pre-wrap; /* Wrap long lines and preserve spaces/line breaks */
  word-break: keep-all; /* Prevent breaking ASCII art */
}

/* Styling for the heading inside the terminal */
#terminal h1 {
  color: #00ff00; /* Green text */
  font-family: 'VT323', monospace; /* Retro monospace font */
  font-size: 1.2em; /* Slightly larger text for the heading */
  margin-bottom: 0.5em; /* Space below the heading */
}

/* Styling for any additional headers if needed */
#terminal h2 {
  color: #00ff00; /* Green text */
  font-family: 'VT323', monospace; /* Retro monospace font */
  font-size: 0.5em; /* Smaller text for subheadings */
  margin-bottom: 0.5em; /* Space below the heading */
}

/* Positioning and sizing of the terminal */
#terminal {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50%; /* Adjust as needed */
  height: 90%; /* Adjust as needed */
  transform: translate(-50%, -50%);
  background-color: #000000; /* Black background */
}

/* Font face import for VT323 font */
@font-face {
  font-family: 'VT323';
  font-style: normal;
  font-weight: 400;
  src: url(https://cdn.jsdelivr.net/fontsource/fonts/vt323@latest/latin-400-normal.woff2) format('woff2'),
       url(https://cdn.jsdelivr.net/fontsource/fonts/vt323@latest/latin-400-normal.woff) format('woff');
}

/* Applying VT323 font to terminal text */
#terminal {
  font-family: 'VT323', monospace;
  font-size: 1em; /* Adjust size as necessary */
}

/* Responsive design for mobile devices */
@media screen and (max-width: 480px) {
  #terminal {
    width: 100%; /* Full width on small screens */
    height: auto; /* Flexible height */
    transform: translate(-50%, -50%);
  }

  #terminal pre {
    font-size: 0.5em; /* Smaller font size for ASCII art on mobile */
    line-height: 1; /* Adjust line height for structure */
    /* Additional adjustments as needed */
  }
}

   class CVTerminal {
     // Define properties and methods here
   }

   class CVTerminal {
     terminal;
     isAnimating;
     command;
     // Other properties
   }

   constructor(config) {
     this.config = config;
     this.initializeProperties();
     // Additional initialization
   }

   initializeProperties() {
     this.terminal = new Terminal(this.config.terminal);
     // Further initialization
   }

   handleKeyEvent({ key, domEvent }) {
     // Logic for key event processing
   }

   handleCommand() {
     // Logic for executing commands
   }

   handleInput(key) {
     // Manage character inputs in the terminal
   }

   writePrompt() {
     // Display command prompt
   }

   startFullCV() {
     // Start full CV display
   }

   resetFullCV() {
     // Reset CV display to initial state
   }

   animateTyping(text, pos, callback) {
     // Typing effect for text
   }

   interruptAnimation() {
     // Stop ongoing animations
   }

   const terminalSettings = {
     fontSize: 9,
     fontFamily: "'VT323', monospace",
     // Additional settings
   };

   const cvInteraction = {
     commands: ["about", "experience", "projects"],
     // Other interactions
   };

   window.onload = () => {
     const terminalConfigurations = {
       terminal: terminalSettings,
       cv: cvInteraction,
       // More configurations
     };
     new CVTerminal(terminalConfigurations);
   };

// Part of the CVTerminal class
class CVTerminal {
  // ... other properties and methods ...

  // Method to handle the 'experience' command
  writeSection(sectionName) {
    if (sectionName === "experience") {
      const experienceData = this.cv[sectionName];
      this.displayExperience(experienceData);
    }
    // ... handle other sections ...
  }

  // Method to display experience data
  displayExperience(experienceData) {
    experienceData.forEach(item => {
      this.terminal.writeln(item);
    });
  }

  // ... rest of the class ...
}

// Example usage
const terminalConfigurations = {
  // ... other configurations ...
  cv: {
    // ... other sections ...
    experience: [
      "DevOps Engineer | Accenture (Apr 2023 - Present)",
      "Key Responsibilities: Deployment Delivery, Pipeline Maintenance, Tool Assessment",
      "Technologies: AWS, Azure, Docker, CI/CD with GitHub Actions",
      // Add more experience items here
    ],
    // ... other sections ...
  }
};

window.onload = () => {
  new CVTerminal(terminalConfigurations);
};