:root {
    --primary-blue: #005ea2;
    --hover-blue:   #1a4480;
}
body { background: #f8f9fa; font-family: 'Segoe UI', sans-serif; }
.main-container { max-width: 1200px; margin: 2rem auto; }
.header-section { background: var(--primary-blue); color: white; padding: 2rem; border-radius: .5rem; margin-bottom: 2rem; }
.filter-bar   { background: white; padding: 1rem; border-radius: .5rem; box-shadow: 0 2px 4px rgba(0,0,0,0.1); margin-bottom: 1.5rem; }
.document-card { background: white; border-radius: .5rem; margin-bottom: 1rem; padding: 1.5rem; position: relative; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.document-card:hover { transform: translateY(-2px); box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
.document-checkbox { position: absolute; top: 1rem; right: 1rem; transform: scale(1.3); }
.status-badge { padding: .25rem .75rem; border-radius: 1rem; font-size: .875rem; font-weight: 500; }
.status-badge.upcoming { background: #e6f4ea; color: #137333; }
.status-badge.past     { background: #fce8e6; color: #a50e0e; }
.meta-item { display: flex; gap:.5rem; align-items:center; margin-bottom:.5rem; }
.meta-label{ font-weight:500; color:#666; }
.date-status-row { display: flex; gap: 1rem; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; }
.date-info { color: var(--primary-blue); font-weight: bold; }
.calendar-dropdown { margin-left: auto; }
.document-actions { display: flex; flex-direction: column; gap: .75rem; margin-top: 1rem; justify-content: flex-start; }
.btn-calendar { background: var(--primary-blue); color: white; padding: .4rem 1rem; border: none; border-radius: .25rem; transition: background .3s; font-size: .875rem; }
.btn-calendar:hover { background: var(--hover-blue); color: white; }
.dropdown-item i { margin-right: 0.5rem; }

@media (max-width: 768px) {
    .calendar-dropdown {
        margin-left: 0;
        margin-top: 0.5rem;
    }
}