/* styles.css */

/* Base Styles */
body {
  font-family: 'Roboto', sans-serif;
  background-color: #f8f9fa;
}

/* Dark Mode Styles */
body.dark-mode {
  background-color: #121212;
  color: #e0e0e0;
}

body.dark-mode .navbar {
  background-color: #1f1f1f;
}

body.dark-mode .offcanvas {
  background-color: #1f1f1f;
  color: #e0e0e0;
}

body.dark-mode .card {
  background-color: #1e1e1e;
  color: #e0e0e0;
}

body.dark-mode .table thead {
  background-color: #1f1f1f;
}

body.dark-mode .table tbody tr {
  background-color: #2c2c2c;
}

body.dark-mode .modal-content {
  background-color: #1e1e1e;
  color: #e0e0e0;
}

/* Badge Colors Override for Dark Mode */
body.dark-mode .badge.bg-success {
  background-color: #28a745 !important;
}

body.dark-mode .badge.bg-warning {
  background-color: #ffc107 !important;
}

body.dark-mode .badge.bg-danger {
  background-color: #dc3545 !important;
}

/* Navbar Links Styling */
.navbar-nav .nav-link {
  display: flex;
  align-items: center;
}

.navbar-nav .nav-link i {
  margin-right: 5px;
}

/* Offcanvas Sidebar Styling */
.offcanvas .nav-link {
  padding: 10px 20px;
}

.offcanvas .nav-link:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

.offcanvas .nav-link i {
  margin-right: 10px;
}

/* Ensure Modal Backdrop is Properly Styled */
.modal-backdrop {
  z-index: 1040; /* Bootstrap's default for modal backdrop */
}

/* Optional: Prevent Body Scroll When Modal is Open */
body.modal-open {
  overflow: hidden;
}
/* NEW – sticky footer that participates in the flex layout */
.footer{
    /* keep the footer inside normal document flow */
    position: static;          /* or “relative” – either is fine            */
    bottom: auto;              /* reset the old absolute positioning values */
    left: auto;
    right: auto;
    width: 100%;

    /* visual spacing – mimics your old 20 px gap without breaking layout */
    margin-bottom: 50px;

    /* existing typography */
    text-align: center;
    font-size: 10px;
    color: #6c757d;
}

/* Responsive Chart Canvas */
canvas {
  width: 100%;
  height: auto;
}
/* Explanation: Removed !important to prevent unintended overrides. */

/* Additional Custom Styles (Optional) */
/* Adjust the spacing and alignment as needed */

/* Remove Custom Transition for Offcanvas */
/* 
.offcanvas {
  transition: transform 0.3s ease-in-out;
}
*/
/* Explanation: Bootstrap manages transitions. Removing custom transitions avoids conflicts. */
