.do-dashboard { font-family: 'Inter', sans-serif; background-color: var(--section-bg, #f8fafc); padding-bottom: 50px; }
.do-header { text-align: center; margin-bottom: 2rem; }
.do-header__title { font-weight: 800; color: var(--text-primary, #1e293b); font-size: 2.5rem; text-transform: uppercase; margin-bottom: 0.5rem; }
.do-header__subtitle { color: var(--text-primary, #1e293b); font-size: 1.1rem; }

.do-action-btns { display: flex; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.do-btn-primary { 
    flex: 1; min-width: 200px; background-color: var(--portal-primary-hex, #1351B4); color: var(--portal-text-on-primary, #ffffff) !important; 
    border: none; padding: 1rem; font-weight: 700; text-transform: uppercase; 
    border-radius: 8px; text-align: center; transition: all 0.2s; text-decoration: none;
}
.do-btn-primary:hover { background-color: color-mix(in srgb, var(--portal-primary-hex, #1351B4) 70%, #000); color: var(--portal-text-on-primary, #ffffff) !important; }

.do-metrics { display: flex; justify-content: space-between; margin-bottom: 2rem; font-weight: 700; color: var(--text-primary, #1e293b); flex-wrap: wrap; }

.do-chart-container { background: #fff; border: 1px solid var(--border-color, #e2e8f0); border-radius: 8px; padding: 1.5rem; margin-bottom: 2rem; }

.do-tabs { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: -1px; }
.do-tab { 
    padding: 1rem 2rem; font-weight: 700; background-color: var(--border-color, #e2e8f0); color: var(--text-primary, #1e293b); 
    border-radius: 8px 8px 0 0; cursor: pointer; text-transform: uppercase; transition: 0.2s;
}
.do-tab--active { background-color: var(--portal-primary-hex, #1e3a8a); color: var(--portal-text-on-primary, #fff); }
.do-tab-content { background: #fff; padding: 2rem; border: 1px solid var(--border-color, #e2e8f0); border-radius: 0 8px 8px 8px; margin-bottom: 3rem; }

.do-filters { background: #fff; padding: 2rem; border-radius: 8px; border: 1px solid var(--border-color, #e2e8f0); margin-bottom: 2rem; }
.do-filters__title { font-weight: 800; font-size: 1.5rem; text-align: center; margin-bottom: 1.5rem; color: var(--text-primary, #1e293b); }
.do-filters__label { font-weight: 700; font-size: 0.9rem; color: var(--text-primary, #1e293b); margin-bottom: 0.5rem; display: block; }
.do-filters__input { width: 100%; padding: 0.75rem; border: 1px solid var(--border-color, #e2e8f0); border-radius: 6px; }

.do-list { display: flex; flex-direction: column; gap: 1rem; }
.do-card { 
    background: var(--card-bg, #fff); border: 1px solid var(--border-color, #e2e8f0); border-left: 4px solid var(--portal-accent-hex, #ef4444); 
    border-radius: 8px; padding: 1rem 1.5rem; display: flex; align-items: center; justify-content: space-between;
    transition: transform 0.2s, box-shadow 0.2s;
}
.do-card:hover { transform: translateY(-2px); box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1); }
.do-card__title { font-size: 1rem; color: var(--text-primary, #1e293b); font-weight: 600; margin: 0; display: flex; align-items: center; gap: 0.5rem; }
.do-card__meta { display: flex; align-items: center; gap: 1.5rem; }
.do-card__date { color: var(--text-secondary, #64748b); font-size: 0.9rem; font-weight: 500; display: flex; align-items: center; gap: 0.5rem; }
.do-card__btn { 
    background-color: var(--portal-accent-hex, #ef4444); color: var(--portal-text-on-accent, #fff) !important; padding: 0.5rem 1rem; 
    border-radius: 6px; font-weight: 700; text-decoration: none; font-size: 0.9rem;
}
.do-card__btn:hover { background-color: var(--portal-accent-hex, #dc2626); filter: brightness(0.9); }

.do-pagination { display: flex; justify-content: center; gap: 0.5rem; margin-top: 2rem; }
.do-pagination .page-numbers { padding: 0.5rem 1rem; border: 1px solid var(--border-color, #e2e8f0); border-radius: 6px; color: var(--portal-primary-hex, #1e3a8a); text-decoration: none; font-weight: 600; background: #fff; }
.do-pagination .current { background-color: var(--portal-primary-hex, #1e3a8a); color: var(--portal-text-on-primary, #fff); border-color: var(--portal-primary-hex, #1e3a8a); }

/* Celular (320 px): cartões e filtros quebram linha em vez de gerar rolagem horizontal (WCAG 1.4.10, quesito 02). */
.do-card { flex-wrap: wrap; gap: 0.75rem; }
.do-card__title { min-width: 0; overflow-wrap: anywhere; }
.do-card__meta { flex-wrap: wrap; gap: 0.75rem 1.5rem; min-width: 0; }
.do-filters .d-flex { flex-wrap: wrap; }
.do-filters .d-flex .btn { min-width: 0 !important; }
