/* BE SideCats (Fixed) — offcanvas menu */

/* Root container lives in wp_footer */
#be-sidecats-root.be-sidecats-root{
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2147483000; /* acima de qualquer header */
}

/* Button container (shortcode) */
.be-sidecats{ display:inline-flex; align-items:center; }
.be-sidecats__btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  cursor: pointer;
  font-weight: 800;
  line-height: 1;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.be-sidecats__icon{ font-size:20px; }
.be-sidecats__label{ font-size:15px; }

/* Overlay */
.be-sidecats__overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  opacity: 0;
  transition: opacity .18s ease;
}

/* Panel */
.be-sidecats__panel{
  position: fixed;
  top: 0;
  left: 0;
  width: 380px;
  max-width: 92vw;
  height: 100vh;
  background: #fff;
  border-top-right-radius: 18px;
  border-bottom-right-radius: 18px;
  box-shadow: 18px 0 50px rgba(0,0,0,.35);
  transform: translateX(-105%);
  transition: transform .22s ease;
  overflow: hidden;
}

/* Open state controlled by body class */
body.be-sidecats-open #be-sidecats-root{ pointer-events: auto; }
body.be-sidecats-open .be-sidecats__overlay{ opacity: 1; }
body.be-sidecats-open .be-sidecats__panel{ transform: translateX(0); }

/* Top bar */
.be-sidecats__top{
  position: sticky;
  top: 0;
  z-index: 2;
  background: #fff;
  padding: 14px 14px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.be-sidecats__top:before{
  content:"";
  position:absolute;
  left:0; top:0;
  width:100%; height:4px;
  background:#e30613;
}
.be-sidecats__title{ font-size:18px; font-weight:900; color:#111; }
.be-sidecats__close{
  position:absolute;
  right:10px;
  top:10px;
  border:0;
  background: rgba(0,0,0,.06);
  border-radius: 12px;
  padding: 6px 10px;
  cursor:pointer;
}
.be-sidecats__close:hover{ background: rgba(0,0,0,.10); }

/* Nav scroll */
.be-sidecats__nav{
  height: calc(100vh - 60px);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 16px;
}
.be-sidecats__nav::-webkit-scrollbar{ width:10px; }
.be-sidecats__nav::-webkit-scrollbar-thumb{
  background: rgba(0,0,0,.18);
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.9);
}
.be-sidecats__nav::-webkit-scrollbar-track{ background: rgba(0,0,0,.04); }

/* List */
.be-sidecats__list{ list-style:none; margin:0; padding:0; }
.be-sidecats__item{
  display: grid;
  grid-template-columns: 1fr 46px;
  align-items: center;
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.be-sidecats__a{
  display:flex;
  align-items:center;
  gap:12px;
  padding: 14px 14px;
  text-decoration:none;
  color:#111;
  font-weight:900;
}
.be-sidecats__a:hover{
  background: linear-gradient(90deg, rgba(227,6,19,.08), rgba(0,0,0,0));
}

.be-sidecats__thumb{
  width:34px;
  height:34px;
  border-radius:999px;
  object-fit:cover;
  background: rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.10);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 34px;
}
.be-sidecats__thumb--fallback{ font-size:18px; color: rgba(0,0,0,.35); }

.be-sidecats__toggle{
  height: 100%;
  border: 0;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.be-sidecats__arrow{ font-size: 22px; color: rgba(0,0,0,.50); }

/* Subcategories */
.be-sidecats__sub{
  grid-column: 1 / -1;
  list-style:none;
  margin:0;
  padding: 10px 12px 14px 12px;
  background: #f7f7f8;
  border-top: 1px solid rgba(0,0,0,.05);
}
.be-sidecats__sub a{
  display:block;
  background:#fff;
  border: 1px solid rgba(0,0,0,.07);
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
  padding: 10px 12px;
  border-radius: 12px;
  text-decoration:none;
  color:#111;
  font-weight:800;
  margin: 6px 0;
}
.be-sidecats__sub a:hover{ border-color: rgba(227,6,19,.35); }

/* Lock scroll when open */
body.be-sidecats-open{ overflow: hidden !important; }

@media (max-width: 768px){
  .be-sidecats__panel{ width: 92vw; }
  .be-sidecats__label{ font-size:14px; }
}