/* Shared action-button palette: Pramuka 3.0.3. */
:root { --button-brown: #590018; }
button,
input[type="submit"], input[type="button"], input[type="reset"],
a.btn, a[role="button"], [role="button"],
a[class*="rounded"][class*="px-"][class*="py-"],
.status-btn-big {
  background: #590018 !important;
  background-image: none !important;
  color: #fff !important;
  border-color: #590018 !important;
}
button:hover, button:active, button:focus,
input[type="submit"]:hover, input[type="button"]:hover,
a.btn:hover, a[role="button"]:hover, [role="button"]:hover,
a[class*="rounded"][class*="px-"][class*="py-"]:hover {
  background: #590018 !important;
  color: #fff !important;
}
button > i, button > span, a.btn > i, a.btn > span,
[role="button"] > i, [role="button"] > span { color: inherit !important; }
button:disabled, input[type="submit"]:disabled, [aria-disabled="true"] {
  opacity: .5; cursor: not-allowed;
}
button:focus-visible, a.btn:focus-visible, [role="button"]:focus-visible {
  outline: 3px solid #a32949; outline-offset: 3px;
}
/* Keep selected navigation and permission decisions distinguishable. */
button.nav-item.active, button.sidebar-item.active, button.tab-btn.active,
button.status-btn-big.active {
  box-shadow: inset 0 0 0 2px #f2d8df, 0 2px 8px rgba(62,39,35,.24) !important;
}

button > i { background: transparent !important; }

/* White statistics text on the shared maroon background. */
.stat-card, .landing-stat-card, .statistics-card { background: #590018 !important; }
.stat-card, .stat-card *, .landing-stat-card, .landing-stat-card *,
.statistics-card, .statistics-card * { color: #FFFFFF !important; }

/* Bottom navigation: maroon belongs only to the selected menu. */
html .bottom-nav .nav-item.nav-item,
html .bottom-nav .nav-item.nav-item:hover,
html .bottom-nav .nav-item.nav-item:focus,
html .bottom-nav .nav-item.nav-item:active {
  background: transparent !important;
  background-image: none !important;
  color: #865767 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
html .bottom-nav .nav-item.nav-item.active,
html .bottom-nav .nav-item.nav-item.active:hover,
html .bottom-nav .nav-item.nav-item.active:focus,
html .bottom-nav .nav-item.nav-item.active:active,
html .bottom-nav .nav-item.nav-item[aria-current="page"] {
  background: #590018 !important;
  color: #FFFFFF !important;
  border-color: #590018 !important;
  box-shadow: 0 3px 10px rgba(62,39,35,.24) !important;
}
html .bottom-nav .nav-item.nav-item > i, html .bottom-nav .nav-item.nav-item > span { color: inherit !important; }

/* Attendance: only the selected H/I/S/A status is maroon. */
html body button.status-btn,
html body button.status-btn:hover,
html body button.status-btn:focus,
html body button.status-btn:active {
  background: #FFFFFF !important; color: #590018 !important;
  border-color: #f2d8df !important; box-shadow: none !important;
}
html body button.status-btn[class*="active-"],
html body button.status-btn[aria-pressed="true"] {
  background: #590018 !important; color: #FFFFFF !important;
  border-color: #590018 !important;
}

/* Active / currently running rundown keeps its green indicator. */
.rundown-ongoing, .rundown-ongoing > td { background: #E8F5E9 !important; color: #1B5E20 !important; }
.rundown-ongoing .rd-waktu, .rundown-ongoing .rd-kegiatan { color: #1B5E20 !important; }
html body button.btn-toggle-aktif.btn-success,
html body button.btn-toggle-aktif.btn-success:hover { background: #2E7D32 !important; color: #FFFFFF !important; border-color: #2E7D32 !important; }

/* Current activity: one green marquee immediately below the header. */
.kegiatan-marquee { background: #E8F5E9; color: #1B5E20; border-bottom: 1px solid #a5d6a7; width: 100%; min-width: 0; overflow: hidden; }
.kegiatan-marquee[hidden] { display: none !important; }
.kegiatan-marquee-track { overflow: hidden; white-space: nowrap; padding: 10px 0; }
.kegiatan-marquee-text { display: inline-block; padding-left: 100%; font-weight: 600; font-size: .875rem; animation: kegiatan-marquee-scroll 22s linear infinite; }
.kegiatan-marquee:hover .kegiatan-marquee-text { animation-play-state: paused; }
@keyframes kegiatan-marquee-scroll { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .kegiatan-marquee-text { animation: none; padding-left: 16px; white-space: normal; }
}

/* Module sidebar: grouped destinations with one clearly selected item. */
html body aside a.module-menu-link.module-menu-link.module-menu-link { background: transparent !important; color: #fbeef2 !important; border-color: transparent !important; }
html body aside a.module-menu-link.module-menu-link.module-menu-link.is-current { background: #5d4037 !important; color: #fff !important; box-shadow: inset 3px 0 0 #f2d8df !important; }

/* One bottom-navigation size for the main app, public pages and Kegiatan. */
html body .bottom-nav {
  box-sizing: border-box !important;
  position: fixed !important; left: 50% !important; right: auto !important;
  transform: translateX(-50%) !important;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  width: calc(100% - 24px) !important; max-width: 420px !important;
  height: 68px !important; padding: 7px !important; gap: 4px !important;
  border: 1px solid #f2d8df !important; border-radius: 24px !important;
  background: rgba(255,252,248,.97) !important;
  box-shadow: 0 10px 32px rgba(78,55,40,.18) !important;
  display: flex; align-items: center !important; justify-content: space-around !important;
  z-index: 200 !important;
}
html body .bottom-nav .nav-item {
  box-sizing: border-box !important; flex: 1 1 0 !important; min-width: 0 !important;
  height: 52px !important; padding: 6px 4px !important; margin: 0 !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important; gap: 4px !important;
  border-radius: 18px !important; font-size: 10px !important; line-height: 14px !important;
  font-weight: 600 !important; text-decoration: none !important;
}
html body .bottom-nav .nav-item i { font-size: 18px !important; line-height: 20px !important; }
html body .bottom-nav .nav-item span { font-size: 10px !important; line-height: 14px !important; white-space: nowrap; }
.public-nav-footer { padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)) !important; }
@media (min-width: 768px) {
  html body .bottom-nav.public-nav { display: flex !important; }
  html body .bottom-nav:not(.public-nav) { display: none !important; }
}
@media (max-width: 767px) { html body .bottom-nav { display: flex !important; } }