fix the issues : 
issue 1: 3 * 5% = 0.15000000000000002
issue 2: paranthesis doesn't worked, example (5+3)* shows NaN

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Simple Calculator</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <div class="calculator">
    <input type="text" class="calculator-screen" value="" disabled />

    <div class="calculator-keys">
      <!-- First row: AC, %, /, backspace -->
      <button type="button" class="all-clear" value="all-clear">AC</button>
      <button type="button" value="%">%</button>
      <button type="button" class="operator" value="/">÷</button>
      <button type="button" class="backspace" value="backspace">⌫</button>

      <!-- Second row: 7, 8, 9, * -->
      <button type="button" value="7">7</button>
      <button type="button" value="8">8</button>
      <button type="button" value="9">9</button>
      <button type="button" class="operator" value="*">×</button>

      <!-- Third row: 4, 5, 6, - -->
      <button type="button" value="4">4</button>
      <button type="button" value="5">5</button>
      <button type="button" value="6">6</button>
      <button type="button" class="operator" value="-">−</button>

      <!-- Fourth row: 1, 2, 3, + -->
      <button type="button" value="1">1</button>
      <button type="button" value="2">2</button>
      <button type="button" value="3">3</button>
      <button type="button" class="operator" value="+">+</button>

      <!-- Fifth row: 0, decimal point, (), = -->
      <button type="button" value="0">0</button>
      <button type="button" class="decimal" value=".">.</button>
      <button type="button" class="parentheses" value="()">( )</button>
      <button type="button" class="equal-sign operator" value="=">=</button>
    </div>
  </div>

  <script src="script.js"></script>
</body>
</html>
```

```css
/* General Styles */
body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background-color: #f3f3f3;
}

.calculator {
  width: 400px;
  margin: 100px auto;
  border: 1px solid #ccc;
  border-radius: 10px;
  overflow: hidden;
}

/* Screen Styles */
.calculator-screen {
  width: 100%;
  height: 80px;
  border: none;
  background-color: #252525;
  color: #fff;
  text-align: right;
  font-size: 4rem;
  padding-right: 20px;
  padding-left: 10px;
}

/* Button Styles */
.calculator-keys {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

button {
  height: 80px;
  font-size: 2rem;
  border: 1px solid #ddd;
  background-color: #e0e0e0;
  color: #333;
  cursor: pointer;
}

button:hover {
  background-color: #d0d0d0;
}

.operator {
  background-color: #ff9500;
  color: #fff;
}

.all-clear, .backspace {
  background-color: #ff3b30;
  color: #fff;
}

.equal-sign {
  background-color: #007aff;
  color: #fff;
}

.parentheses {
  background-color: #a9a9a9;
  color: #fff;
}
```

```js
// Get all the keys from the document
const keys = document.querySelector('.calculator-keys');
const screen = document.querySelector('.calculator-screen');

let currentInput = '0';
let previousInput = '';
let operator = null;
let waitingForSecondOperand = false;

// Add event listener to the keys
keys.addEventListener('click', event => {
  const { target } = event;
  const { value } = target;

  // If the clicked element is not a button, exit function
  if (!target.matches('button')) {
    return;
  }

  switch (value) {
    case '+':
    case '-':
    case '*':
    case '/':
      handleOperator(value);
      break;
    case '=':
      calculate();
      break;
    case 'all-clear':
      resetCalculator();
      break;
    case '.':
      inputDecimal(value);
      break;
    case 'backspace':
      backspace();
      break;
    case '%':
      inputPercent();
      break;
    case '()':
      inputParentheses();
      break;
    default:
      if (Number.isInteger(parseFloat(value))) {
        inputNumber(value);
      }
  }

  updateScreen();
});

// Functions to handle inputs and calculations
function updateScreen() {
  screen.value = currentInput;
}

function inputNumber(number) {
  if (waitingForSecondOperand) {
    currentInput = number;
    waitingForSecondOperand = false;
  } else {
    currentInput = currentInput === '0' ? number : currentInput + number;
  }
}

function inputDecimal(dot) {
  if (waitingForSecondOperand) {
    currentInput = '0.';
    waitingForSecondOperand = false;
    return;
  }

  if (!currentInput.includes(dot)) {
    currentInput += dot;
  }
}

function handleOperator(nextOperator) {
  const inputValue = parseFloat(currentInput);

  if (operator && waitingForSecondOperand) {
    operator = nextOperator;
    return;
  }

  if (previousInput === '') {
    previousInput = inputValue;
  } else if (operator) {
    const result = performCalculation[operator](previousInput, inputValue);

    currentInput = String(result);
    previousInput = result;
  }

  operator = nextOperator;
  waitingForSecondOperand = true;
}

const performCalculation = {
  '+': (firstOperand, secondOperand) => firstOperand + secondOperand,
  '-': (firstOperand, secondOperand) => firstOperand - secondOperand,
  '*': (firstOperand, secondOperand) => firstOperand * secondOperand,
  '/': (firstOperand, secondOperand) => firstOperand / secondOperand,
};

function calculate() {
  const inputValue = parseFloat(currentInput);

  if (operator && !waitingForSecondOperand) {
    const result = performCalculation[operator](previousInput, inputValue);
    currentInput = String(result);
    previousInput = '';
    operator = null;
    waitingForSecondOperand = false;
  }
}

function resetCalculator() {
  currentInput = '0';
  previousInput = '';
  operator = null;
  waitingForSecondOperand = false;
}

function backspace() {
  if (currentInput.length > 1) {
    currentInput = currentInput.slice(0, -1);
  } else {
    currentInput = '0';
  }
}

function inputPercent() {
  const value = parseFloat(currentInput);
  currentInput = String(value / 100);
}

function inputParentheses() {
  // Implementing parentheses requires an expression parser.
  // This functionality is complex and beyond simple calculator logic.
  // Here, we'll simulate a simple toggle between adding '(' or ')'.
  if (currentInput === '0') {
    currentInput = '(';
  } else {
    currentInput += ')';
  }
}

```