/* Centralized Bottom Navigation Styles */
.bottom-nav{
  position: fixed; left:0; right:0; bottom:0;
  height: 68px; background: #fff; border-top: 1px solid #e5e5e5;
  box-shadow: 0 -6px 18px rgba(0,0,0,0.06);
  display: grid; grid-template-columns: repeat(5, 1fr); align-items: center;
  z-index: 1000;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
.bottom-nav__item{ position:relative; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:#6b7280; text-decoration:none; transition: color .15s ease; }
.bottom-nav__icon{ display:flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; transition: color .15s ease; position:relative; }
.bottom-nav__icon i{ font-size:24px; line-height:1; }
.bottom-nav__label{ font-size:12px; font-weight:600; letter-spacing:0; transition: color .15s ease; font-family: inherit; line-height: 1.2; }
/* Message badge indicator */
.bottom-nav .message-badge{ 
  position:absolute !important; 
  top:-2px !important; 
  right:-2px !important; 
  width:14px !important; 
  height:14px !important; 
  background:#92041d !important; 
  border-radius:50% !important; 
  border:2px solid #fff !important;
  flex-shrink:0 !important;
  /* display controlled by JavaScript - don't use !important here */
}
/* Active state: only brand color and a thin indicator line */
.bottom-nav__item.active{ color:#92041d; }
.bottom-nav__item.active::after{ content:""; position:absolute; top:0; left:10px; right:10px; height:3px; background:#92041d; border-radius:2px; }
.bottom-nav__add{ position:relative; transform: translateY(-18px); }
.bottom-nav__fab{ width:44px; height:44px; border-radius:80%; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg,#92041d,#92041d); color:#fff; box-shadow:0 6px 16px rgba(157,44,111,0.35); }
.bottom-nav__fab i{ font-size:22px; }
.bottom-nav__add .bottom-nav__label{ margin-top:0; color:#6b7280; }

/* Dark mode handled in dark.css via .bottom-nav classes */