/* assets/css/style.css */
body { font-family: 'Inter', sans-serif; padding-bottom: 40px; }
.font-mono { font-family: 'Roboto Mono', monospace; }
.card { background-color: white; border-radius: 0.75rem; box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); transition: all 0.3s ease; }
.btn { padding: 0.75rem 1.5rem; border-radius: 0.5rem; font-weight: 600; transition: all 0.2s ease; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; }
.btn-primary { background-color: #4f46e5; color: white; }
.btn-primary:hover { background-color: #4338ca; }
.btn-danger { background-color: #dc2626; color: white; }
.btn-danger:hover { background-color: #b91c1c; }
.btn-secondary { background-color: #6b7280; color: white; }
.btn-secondary:hover { background-color: #4b5563; }
.btn-success { background-color: #16a34a; color: white; }
.btn-success:hover { background-color: #15803d; }
.btn-pink { background-color: #ec4899; color: white; }
.btn-pink:hover { background-color: #db2777; }
.btn:disabled { background-color: #d1d5db; cursor: not-allowed; }
.modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.5); display: flex; justify-content: center; align-items: center; z-index: 50; }
.tab-button { border-color: transparent; color: #6b7280; }
.tab-button:hover { border-color: #d1d5db; color: #4b5563; }
.tab-button.active { border-color: #4f46e5; color: #4f46e5; font-weight: 600; }
#report-detail-modal .modal-content { max-width: 800px; width: 90%; }
#detail-modal-content .font-mono { font-size: 0.95rem; line-height: 1.5; }

@media (max-width: 767px) {
    .responsive-table thead { display: none; }
    .responsive-table tbody, .responsive-table tr, .responsive-table td { display: block; width: 100%; }
    .responsive-table tr { margin-bottom: 1.5rem; border-bottom: 2px solid #e5e7eb; padding-bottom: 1rem; }
    .responsive-table td { display: flex; justify-content: space-between; align-items: center; text-align: right; padding: 0.5rem 0.25rem; border-bottom: 1px dotted #d1d5db; }
    .responsive-table td:last-child { border-bottom: none; }
    .responsive-table td::before { content: attr(data-label); font-weight: 600; text-align: left; padding-right: 1rem; }
}

.app-footer {
    position: fixed; left: 0; bottom: 0; width: 100%;
    background-color: #1f2937; color: white; text-align: center;
    padding: 10px 0; font-size: 0.875rem; z-index: 100;
}

/* Fullscreen Dashboard */
.fullscreen-mode #admin-sidebar,
.fullscreen-mode #leader-sidebar,
.fullscreen-mode #admin-wrapper header,
.fullscreen-mode #leader-wrapper header,
.fullscreen-mode #admin-hamburger-btn,
.fullscreen-mode #leader-hamburger-btn {
    display: none;
}