.content {
      padding: 5px;
    }
    
    .code-container {
      position: relative;
      background: #f5f5f5;
      border-radius: 8px;
      overflow: hidden;
      margin-bottom: 5px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    }
    
    pre {
      color: #333;
      padding: 25px;
      overflow-x: auto;
      font-size: 16px;
      line-height: 1.5;
      margin: 0;
    }
    
    code {
      font-family: 'Fira Code', monospace;
    }
    
    .keyword {
      color: #f92672;
    }
    
    .string {
      color: #a6e22e;
    }
    
    .comment {
      color: #75715e;
    }
    
    .copy-btn {
      position: absolute;
      top: 15px;
      right: 15px;
      background: #f39c12;
      color: white;
      border: none;
      border-radius: 5px;
      padding: 10px 20px;
      font-size: 16px;
      font-weight: 600;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 8px;
      transition: all 0.3s ease;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }
    
    .copy-btn:hover {
      background: #976008;
      transform: translateY(-2px);
    }
    
    .copy-btn:active {
      transform: translateY(0);
    }
    
    .copy-btn.copied {
      background: #976008;
    }
    
    .copy-btn.copied::after {
      content:;
    }