/* Default Dark Orange Theme */
:root {
  --primary-color: #ff5722;
  --primary-hover: #e64a19;
  --secondary-color: #ff9a76;
  --accent-color: #ffccbc;
  --danger-color: #f44336;
  --success-color: #4caf50;
  --info-color: #2196f3;
  --warning-color: #ff9800;

  --text-color: #ffffff;
  --bg-color: #1c1c1c;
  --container-bg: #121212;
  --input-bg: #1e1e1e;
  --border-color: #333;
  --hover-bg: #2a2a2a;
}

/* 🔵 Blue Theme */
.theme-blue {
  --primary-color: #1976d2;
  --primary-hover: #1565c0;
  --secondary-color: #90caf9;
  --accent-color: #bbdefb;
  --danger-color: #d32f2f;
  --success-color: #388e3c;
  --info-color: #0288d1;
  --warning-color: #fbc02d;

  --text-color: #ffffff;
  --bg-color: #0d1b2a;
  --container-bg: #1b263b;
  --input-bg: #243447;
  --border-color: #394867;
  --hover-bg: #2e3b55;
}

/* 🟢 Green Theme */
.theme-green {
  --primary-color: #4caf50;
  --primary-hover: #388e3c;
  --secondary-color: #a5d6a7;
  --accent-color: #c8e6c9;
  --danger-color: #e53935;
  --success-color: #2e7d32;
  --info-color: #039be5;
  --warning-color: #fdd835;

  --text-color: #ffffff;
  --bg-color: #102a13;
  --container-bg: #1b3d1e;
  --input-bg: #264d28;
  --border-color: #2e7d32;
  --hover-bg: #335c39;
}

/* ☀️ Light Theme */
.theme-light {
  --primary-color: #ff9800;
  --primary-hover: #fb8c00;
  --secondary-color: #757575;
  --accent-color: #ffcc80;
  --danger-color: #f44336;
  --success-color: #4caf50;
  --info-color: #2196f3;
  --warning-color: #ffeb3b;

  --text-color: #212121;
  --bg-color: #fafafa;
  --container-bg: #ffffff;
  --input-bg: #f5f5f5;
  --border-color: #ddd;
  --hover-bg: #eeeeee;
}

/* Apply theme */
body {
    background-color: var(--bg-color);
}

.bill-container {
    background-color: var(--bg-color);
    border: 1px solid var(--secondary-color);
}

.bill-header {
    border-bottom: 2px solid var(--primary-color);
}

.bill-table th {
    background-color: var(--primary-color);
    color: #fff;
}

h1, h2, h3, h4, h5 {
    color: var(--secondary-color);
}
