/* Scoped to new citizen pages and complaint components; legacy assets are unchanged. */
.portal-masyarakat { --bs-body-color: #118b50; --bs-heading-color: #118b50; --bs-gray-900: #118b50; --bs-dark: #118b50; --bs-dark-rgb: 17, 139, 80; --bs-primary-rgb: 17, 139, 80; --bs-primary-active: #0c673b; --bs-link-color: #118b50; --bs-link-hover-color: #0c673b; }
.portal-masyarakat .text-dark, .portal-masyarakat .text-primary { color: #118b50 !important; }
.portal-masyarakat a:not(.btn) { color: #118b50; }
.portal-masyarakat .form-label, .portal-masyarakat .form-control, .portal-masyarakat .form-select { color: #118b50; }
.portal-masyarakat .btn.btn-light-primary { color: #118b50; background-color: #e8f5ed; }
.portal-masyarakat .btn.btn-light-primary i { color: #118b50; }
.portal-masyarakat .btn.btn-light-primary:hover, .portal-masyarakat .btn.btn-light-primary:focus { color: #0c673b; background-color: #d4ebdd !important; }
.portal-masyarakat .portal-public-topbar .marquee { height: 24px; line-height: 24px; }
.portal-masyarakat .portal-public-topbar .marquee span { min-width: 100%; padding-left: 0; animation-name: portal-running-text; animation-duration: 30s; }
@keyframes portal-running-text { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media(prefers-reduced-motion: reduce) { .portal-masyarakat .portal-public-topbar .marquee { height: auto; white-space: normal; } .portal-masyarakat .portal-public-topbar .marquee span { animation: none; } }
.portal-masyarakat .portal-auth { max-width: 490px; }
.portal-masyarakat .portal-register { max-width: 860px; }
.portal-masyarakat .card { border: 1px solid #e4e6e8; }
.portal-masyarakat .portal-public-topbar { background-color: #2c3930; }
.portal-masyarakat .portal-brand { min-width: 0; }
.portal-masyarakat .portal-brand-name { line-height: 1; overflow-wrap: anywhere; }
.portal-avatar { width: 100px; height: 100px; object-fit: cover; border-radius: 10px; }
.portal-prewrap { white-space: pre-wrap; overflow-wrap: anywhere; }
.portal-summary { min-width: 200px; max-width: 420px; overflow-wrap: anywhere; }
.portal-status { white-space: normal; line-height: 1.5; text-align: left; }
.laporan-steps { display: grid; grid-template-columns: repeat(5, 1fr); list-style: none; gap: 12px; padding: 0; margin: 28px 0; counter-reset: aduan; }
.laporan-steps li { counter-increment: aduan; border-top: 4px solid #dfe3e6; padding: 14px 10px; background: #fff; border-radius: 4px; font-weight: 600; }
.laporan-steps li::before { content: counter(aduan); display: inline-grid; place-items: center; width: 25px; height: 25px; margin-right: 8px; border-radius: 50%; background: #eff2f5; }
.laporan-steps small { display: block; color: #667579; font-weight: 400; padding-top: 8px; }
.laporan-steps .is-done { border-color: #237847; }
.laporan-steps .is-done::before { background: #237847; color: white; }
.laporan-steps .is-current { background: #edf6ee; }
.laporan-history li { border-left: 3px solid #dce9de; padding: 0 0 18px 18px; margin: 0 0 12px; }
@media(max-width:767px) { .laporan-steps { grid-template-columns: 1fr; gap: 6px; } .laporan-steps li { border-top: 0; border-left: 4px solid #dfe3e6; padding: 10px 12px; } .laporan-steps .is-done { border-left-color: #237847; } }
.laporan-steps .is-rejected { border-color: #b42318; background: #fef3f2; color: #b42318; }
.laporan-steps .is-rejected::before { background: #b42318; color: #fff; }
.laporan-steps .is-rejected small { color: #b42318; }