body { background-color: #f8f9fa; }
.main-container { display: flex; height: calc(100vh - 56px); position: relative; }
.sidebar { width: 35%; min-width: 350px; border-right: 1px solid #dee2e6; padding: 0; display: flex; flex-direction: column; transition: margin-left 0.3s ease-in-out; }
.content-area { width: 65%; padding: 20px; overflow-y: auto; transition: width 0.3s ease-in-out; }
.case-list { flex-grow: 1; overflow-y: auto; }
.list-group-item-action { cursor: pointer; }
.timeline { list-style: none; padding: 0; position: relative; }
.timeline:before { content: ''; position: absolute; top: 0; bottom: 0; width: 2px; background: #e9ecef; left: 20px; margin: 0; }
.timeline-item { position: relative; margin-bottom: 20px; }
.timeline-icon { position: absolute; left: 0; top: 0; width: 40px; height: 40px; border-radius: 50%; color: white; display: flex; align-items: center; justify-content: center; z-index: 1; }
.timeline-content { margin-left: 60px; background: #fff; padding: 15px; border-radius: 6px; border: 1px solid #dee2e6; }
.toast-container { z-index: 1100; }
.task-item.concluida { text-decoration: line-through; color: #6c757d; }
.timeline-image-preview { max-width: 200px; max-height: 200px; border-radius: 5px; margin-top: 10px; }
#organizador-list-tbody tr, #user-list-tbody tr { cursor: pointer; }
.navbar-dark.bg-dark { background-color: #000000 !important; }
.btn-primary { background-color: #DC2626; border-color: #DC2626; }
.btn-primary:hover { background-color: #b82020; border-color: #b82020; }
.page-item.active .page-link { background-color: #DC2626; border-color: #DC2626; }
.list-group-item.active { background-color: #DC2626; border-color: #DC2626; }
.fpa-logo { max-height: 40px; margin-right: 10px; }
.kpi-card { text-align: center; }
.kpi-card .kpi-value { font-size: 2.5rem; font-weight: bold; color: #DC2626; }
.kpi-card .kpi-label { font-size: 1rem; color: #6c757d; }

#sidebar-toggle-btn { position: absolute; left: 35%; top: 10px; z-index: 1000; border-radius: 0 0.25rem 0.25rem 0; transform: translateX(-100%); transition: left 0.3s ease-in-out; }
#cases-view.toggled .sidebar { margin-left: -35%; }
#cases-view.toggled .content-area { width: 100%; }
#cases-view.toggled #sidebar-toggle-btn { left: 0; transform: translateX(0); }
#sidebar-toggle-btn i { transition: transform 0.3s; }
#cases-view.toggled #sidebar-toggle-btn i { transform: rotate(180deg); }