.sidebar-nav { width: 320px; max-width: 100%; background: #fff; border-right: 1px solid #E2E8F0; display: flex; flex-direction: column; flex-shrink: 0; }
@media (max-width: 1024px) { .sidebar-nav { width: 280px; } }
@media (max-width: 640px) { .sidebar-nav { width: 100%; max-width: 100%; border-right: none; border-bottom: 1px solid #E2E8F0; } }
body.sidebar-mobile .sidebar-nav { position: fixed; inset: 0; z-index: 100; transform: translateX(-100%); transition: transform 0.3s ease; }
body.sidebar-mobile .sidebar-nav.open { transform: translateX(0); }
.emp-item { padding: 1rem 1.5rem; border-bottom: 1px solid #F1F5F9; cursor: pointer; transition: all 0.2s; display: flex; align-items: center; gap: 12px; }
.emp-item:hover { background: #F8FAFC; }
.emp-item.active { background: #FFF1F2; border-left: 4px solid #D32F2F; }

.main-container { padding: 1.5rem 2rem 2rem; }
@media (max-width: 1024px) { .main-container { padding: 1rem 1.25rem 1.5rem; } }
@media (max-width: 640px) { .main-container { padding: 0.75rem 0.75rem 1rem; } }

.tab-btn { flex: 1; padding: 10px; font-size: 10px; font-weight: 900; text-transform: uppercase; text-align: center; cursor: pointer; border-radius: 12px; transition: all 0.2s; }
.tab-btn.active { background: white; color: #D32F2F; box-shadow: 0 4px 10px rgba(0,0,0,0.05); }
.tab-btn.inactive { color: #94a3b8; }

/* Timeline Design */
.career-item { position: relative; }
.timeline-dot {
    position: absolute; left: -53px; top: 5px; width: 24px; height: 24px;
    background: white; border: 4px solid #D32F2F; border-radius: 50%; z-index: 10;
    box-shadow: 0 0 15px rgba(211,47,47,0.2);
}
.career-card {
    background: white; padding: 1.5rem; border-radius: 1.5rem; border: 1px solid #e2e8f0;
    transition: all 0.3s ease; position: relative;
}
.career-card:hover { border-color: #D32F2F; box-shadow: 0 10px 30px rgba(0,0,0,0.05); }

.move-badge {
    padding: 3px 8px; border-radius: 6px; font-size: 8px; font-weight: 900; text-transform: uppercase;
}
.bg-promocao { background: #fef3c7; color: #92400e; }
.bg-reajuste { background: #dcfce7; color: #15803d; }
.bg-admissao { background: #dbeafe; color: #1e40af; }
.bg-desligamento { background: #fee2e2; color: #b91c1c; }

.custom-scroll::-webkit-scrollbar { width: 4px; }
.custom-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }

.pro-input { width: 100%; padding: 12px 15px; background: #f8fafc; border: 1.5px solid #e2e8f0; border-radius: 12px; font-size: 12px; font-weight: 700; outline: none; transition: border 0.2s; }
.pro-input:focus { border-color: #D32F2F; }
.pro-label { font-size: 9px; font-weight: 700; color: #000; text-transform: uppercase; margin-bottom: 6px; display: block; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.animate-fade { animation: fadeIn 0.4s ease-out; }

@media (max-width: 640px) {
    #pro-modal-content > .border-b.p-8,
    #pro-modal-content > div:first-child.bg-white.border-b { padding: 1.25rem !important; }
    #pro-modal-content form.p-10 { padding: 1.25rem !important; }
    #pro-modal-content .grid-cols-2 { grid-template-columns: 1fr !important; }
    #pro-modal-content table { font-size: 8px !important; }
    #pro-modal-content table th,
    #pro-modal-content table td { padding: 0.5rem !important; }
    #pro-modal-content .p-8 { padding: 1rem !important; }
}