.btn-primary { background-color: #0d6efd; border-radius: 5px; border-color: #0d6efd; } body { background-color: white; } select { border: 1px solid rgba(0, 0, 0, 0.468) !important; height: 45px !important; color: rgba(0, 0, 0, 0.468) !important; } .canvasjs-chart-credit { display: none !important; } #sidebarToggle { border-radius: 4px; margin-left: 250px; } .main-sidebar.toggled .menu-text { display: none; } #selectedCompany.toggled .menu-text { display: none; } .wrapper { flex: 1; padding: 10px; margin-left: 250px; /* Default sidebar width */ transition: margin-left 0.3s ease; flex-wrap: wrap; } .main-header { border-bottom: none; border-top: none; } .card { margin-bottom: 15px; border-radius: 8px; overflow: hidden; transition: background-color 0.3s ease; font-size: 20px !important; max-width: 350px !important; min-width: 300px; } .card-body { padding: 15px; } .feature-icon { display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; background: rgba(255, 255, 255, 0.1); border-radius: 50%; } .sidebarPanel { display: none; } .media-body { text-align: right; } .fs-30 { font-size: 20px !important; margin-right: 25px !important; } .fs-48 { font-size: 40px !important; margin-right: 25px !important; } .card { padding: 15px 0px; } body { height: 100dvh; } .row { display: flex !important; flex-wrap: wrap !important; row-gap: 20px; column-gap: 20px; align-items: center; justify-content: center; } .graph { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; /* Adds space between the charts */ padding: 20px; margin-top: 10px !important; } .graph1 { flex: 1 1 45%; min-width: 300px; height: auto; display: flex; flex-direction: column; align-items: center; } canvas { min-width: 350px !important; } #chartContainer, #chartContainer1 { max-width: 100%; min-width: 100%; height: 350px; } /* Responsive Styles */ @media (max-width: 991px) { #sidebarToggle { display: block !important; margin-left: 210px !important; border: 2px solid rgba(0, 0, 0, 0.384); color: rgba(0, 0, 0, 0.404) !important; } .wrapper { margin-left: 200px; } .graph { margin-left: -220px; } .graph1 h1 { font-size: 20px; margin-top: 20px; } .main-header { padding: 15px; } } @media (max-width: 768px) { .feature-icon { width: 40px; height: 40px; } .fs-30 { font-size: 1.5rem; } .fs-48 { font-size: 2.5rem; } #company{ width: 200px !important; } }