/* Custom Theme CSS for Bootstrap 5 */

/* Root variables for colors and fonts */
:root {
  --bs-primary: #ff6600;  /* Orange */
  --bs-secondary: #008000;  /* Green */
  --bs-success: #28a745;
  --bs-info: #17a2b8;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #343a40;

  --bs-font-family-sans-serif: "Helvetica, Arial, sans-serif";
  --bs-font-family-monospace: "Courier New, monospace";
}

/* General styles */
body {
  font-family: var(--bs-font-family-sans-serif);
  background-color: var(--bs-light);
  color: var(--bs-dark);
}

/* Custom button styles */
.btn-primary {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
}

.btn-primary:hover {
  background-color: darkorange;
  border-color: darkorange;
}

.btn-secondary {
  background-color: var(--bs-secondary);
  border-color: var(--bs-secondary);
  color: #fff;
}

.btn-secondary:hover {
  background-color: #006600;
  border-color: #006600;
}

/* Navbar styles */
.navbar {
  background-color: var(--bs-dark);
  border-bottom: 1px solid var(--bs-light);
}

.navbar .navbar-brand,
.navbar .navbar-nav .nav-link {
  color: var(--bs-light);
}

.navbar .navbar-nav .nav-link:hover {
  color: var(--bs-primary);
}

/* Custom footer styles */
footer {
  background-color: var(--bs-dark);
  color: var(--bs-light);
  padding: 20px 0;
}

footer a {
  color: var(--bs-light);
}

footer a:hover {
  color: var(--bs-primary);
}

footer .footer-links {
  margin-bottom: 10px;
}

/* Custom card styles */
.card {
  border: 1px solid var(--bs-light);
  background-color: var(--bs-light);
}

.card-header {
  background-color: var(--bs-primary);
  color: #fff;
}

.card-body {
  color: var(--bs-dark);
}

/* Custom form styles */
.form-control {
  border: 1px solid var(--bs-dark);
}

.form-control:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.2rem rgba(255, 102, 0, 0.25);
}

/* Custom table styles */
.table {
  border-collapse: collapse;
  width: 100%;
  background-color: var(--bs-light);
}

.table th,
.table td {
  border: 1px solid var(--bs-dark);
  padding: 8px;
  text-align: left;
}

.table th {
  background-color: var(--bs-primary);
  color: #fff;
}

.table tr:nth-child(even) {
  background-color: #f2f2f2;
}