/* === MOBILE BOTTOM NAV === */
.kp-bottomnav{
  display:flex;position:fixed;bottom:0;left:0;right:0;
  height:var(--h-bottomnav);background:var(--c-card);
  border-top:1px solid var(--c-border);z-index:var(--z-sticky);
  box-shadow:0 -2px 10px rgba(0,0,0,.06);
}
@media(min-width:992px){.kp-bottomnav{display:none}}

.kp-bottomnav__item{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;font-size:.625rem;font-weight:600;color:var(--c-text-muted);
  text-decoration:none;position:relative;transition:color var(--dur);
  letter-spacing:.02em;
}
.kp-bottomnav__item:hover,.kp-bottomnav__item.active{color:var(--c-primary)}
.kp-bottomnav__item .material-symbols-outlined{font-size:22px}
.kp-bottomnav__badge{
  position:absolute;top:4px;right:calc(50% - 18px);
  background:var(--c-primary);color:#fff;
  font-size:9px;font-weight:700;
  min-width:16px;height:16px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
}

/* Breadcrumb */
.kp-breadcrumb{background:var(--c-bg);border-top:1px solid var(--c-border-light);border-bottom:1px solid var(--c-border-light);padding:13px 0}
.kp-breadcrumb .breadcrumb{background:none;padding:0;margin:0;font-size:.8125rem;font-weight:500}
.kp-breadcrumb .breadcrumb-item a{color:var(--c-text-muted)}
.kp-breadcrumb .breadcrumb-item a:hover{color:var(--c-primary)}
.kp-breadcrumb .breadcrumb-item.active{color:var(--c-text-secondary)}
.kp-breadcrumb .breadcrumb-item+.breadcrumb-item::before{color:var(--c-text-muted);content:"›"}

/* Add bottom padding to body for mobile bottom nav */
@media(max-width:991px){
  body{padding-bottom:var(--h-bottomnav)}
}