/* BantuSocial v2.36.4 — desktop listing/launchpad precision, story cleanup, mobile reaction certainty */

/* =========================================================
   STORIES — true circles only. Remove the old loading/seen reflection layer.
   ========================================================= */
html body.bantusphere .bs-stories-card{isolation:isolate!important}
html body.bantusphere .bs-stories-card.bs-stories-ready .empty_stories,
html body.bantusphere .bs-stories-card:has(#stories>.story) .empty_stories{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}
html body.bantusphere .bs-stories-card #stories>.story::before,
html body.bantusphere .bs-stories-card #stories>.story::after,
html body.bantusphere .bs-stories-card #stories>.story.seen::before,
html body.bantusphere .bs-stories-card #stories>.story.seen::after{display:none!important;content:none!important;background:none!important;box-shadow:none!important}
html body.bantusphere .bs-stories-card #stories>.story,
html body.bantusphere .bs-stories-card #stories>.story>a{background:transparent!important;box-shadow:none!important;filter:none!important}
html body.bantusphere .bs-stories-card #stories>.story>a>.img{
  width:72px!important;height:72px!important;min-width:72px!important;min-height:72px!important;max-width:72px!important;max-height:72px!important;
  aspect-ratio:1/1!important;border-radius:50%!important;padding:2px!important;border:1.25px solid transparent!important;
  background:linear-gradient(#091324,#091324) padding-box,linear-gradient(135deg,#ffb020,#ff3a91 42%,#8959f7 72%,#35d8ff) border-box!important;
  box-shadow:none!important;overflow:hidden!important;
}
html body.bantusphere .bs-stories-card #stories>.story.seen>a>.img{border:1px solid rgba(132,151,188,.34)!important;padding:2px!important;background:#091324!important}
html body.bantusphere .bs-stories-card #stories>.story>a>.img>u,
html body.bantusphere .bs-stories-card #stories>.story>a>.img>*{
  width:100%!important;height:100%!important;min-width:100%!important;min-height:100%!important;max-width:100%!important;max-height:100%!important;
  border-radius:50%!important;clip-path:circle(50%)!important;object-fit:cover!important;background-size:cover!important;background-position:center!important;
  border:1px solid #091324!important;box-shadow:none!important;transform:none!important;
}
@media(max-width:575.98px){
  html body.bantusphere .bs-stories-card #stories>.story>a>.img{width:68px!important;height:68px!important;min-width:68px!important;min-height:68px!important;max-width:68px!important;max-height:68px!important}
}

/* =========================================================
   REACTION COUNTS — the actual reaction type is the surface, never a grey puck.
   ========================================================= */
html body.bantusphere .reactions-stats>.reactions-stats-item{
  display:inline-grid!important;place-items:center!important;position:relative!important;width:22px!important;height:22px!important;min-width:22px!important;max-width:22px!important;
  padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;color:transparent!important;
}
html body.bantusphere .reactions-stats>.reactions-stats-item .inline-emoji{display:none!important}
html body.bantusphere .reactions-stats>.reactions-stats-item::after{
  display:grid!important;place-items:center!important;position:static!important;width:22px!important;height:22px!important;margin:0!important;padding:0!important;
  font:normal 16px/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;color:#fff!important;background:transparent!important;
  border:0!important;border-radius:50%!important;box-shadow:none!important;opacity:1!important;visibility:visible!important;transform:none!important;
}
html body.bantusphere .reactions-stats>.reactions-stats-item[data-reaction="like"]::after{content:"👍"!important}
html body.bantusphere .reactions-stats>.reactions-stats-item[data-reaction="love"]::after{content:"❤️"!important}
html body.bantusphere .reactions-stats>.reactions-stats-item[data-reaction="haha"]::after{content:"😂"!important}
html body.bantusphere .reactions-stats>.reactions-stats-item[data-reaction="yay"]::after{content:"🎉"!important}
html body.bantusphere .reactions-stats>.reactions-stats-item[data-reaction="wow"]::after{content:"😮"!important}
html body.bantusphere .reactions-stats>.reactions-stats-item[data-reaction="sad"]::after{content:"😢"!important}
html body.bantusphere .reactions-stats>.reactions-stats-item[data-reaction="angry"]::after{content:"😡"!important}
/* Safe fallback for older cached markup until JS assigns data-reaction. */
html body.bantusphere .reactions-stats>.reactions-stats-item:not([data-reaction])::after{content:"👍"!important}

/* Mobile reaction palette: fixed/portal geometry, guaranteed above every action. */
@media(max-width:969.98px){
  html body.bantusphere .reactions-wrapper.bs-reaction-open>.reactions-container,
  html body.bantusphere .post.bs-tech-post .reactions-wrapper.bs-reaction-open>.reactions-container{
    display:flex!important;align-items:center!important;justify-content:center!important;gap:2px!important;
    position:fixed!important;right:auto!important;bottom:auto!important;width:max-content!important;max-width:calc(100vw - 16px)!important;min-width:0!important;height:auto!important;min-height:58px!important;
    padding:7px 8px!important;border-radius:999px!important;background:rgba(9,16,29,.985)!important;border:1px solid rgba(255,255,255,.12)!important;
    box-shadow:0 18px 52px rgba(0,0,0,.55)!important;backdrop-filter:blur(18px)!important;overflow:visible!important;visibility:visible!important;opacity:1!important;
    pointer-events:auto!important;touch-action:manipulation!important;z-index:2147483647!important;transform:none!important;
  }
  html body.bantusphere .reactions-wrapper.bs-reaction-open>.reactions-container .reactions_item,
  html body.bantusphere .reactions-wrapper.bs-reaction-open>.reactions-container .reaction{
    display:grid!important;place-items:center!important;position:relative!important;float:none!important;flex:0 0 42px!important;width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;
    margin:0!important;padding:0!important;pointer-events:auto!important;touch-action:manipulation!important;overflow:visible!important;opacity:1!important;visibility:visible!important;z-index:2!important;
  }
  html body.bantusphere .reactions-wrapper.bs-reaction-open>.reactions-container .emoji,
  html body.bantusphere .reactions-wrapper.bs-reaction-open>.reactions-container .inline-emoji{
    display:grid!important;place-items:center!important;position:static!important;inset:auto!important;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;
    margin:0!important;padding:0!important;transform:none!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;
  }
  html body.bantusphere .reactions-wrapper.bs-reaction-open>.reactions-container .emoji img{
    display:block!important;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;max-width:38px!important;max-height:38px!important;
    object-fit:contain!important;transform:none!important;opacity:1!important;visibility:visible!important;pointer-events:none!important;
  }
  html body.bantusphere .post-actions,html body.bantusphere .reactions-wrapper{overflow:visible!important}
  html body.bantusphere .post-actions .bs-post-share-action{position:relative!important;z-index:0!important}
}

/* =========================================================
   BANTUEXPLORE RENTAL CARDS — desktop gets the same complete information
   hierarchy as mobile. Explicit minimums prevent title/rating row collapse.
   ========================================================= */
@media(min-width:576px){
  html body.bantusphere .bx-listing-card-v216.bx-listing-card-rental{
    display:grid!important;grid-template-rows:190px auto!important;height:auto!important;min-height:440px!important;overflow:hidden!important;border-radius:18px!important;
  }
  html body.bantusphere .bx-listing-card-rental .bx-listing-media{height:190px!important;min-height:190px!important}
  html body.bantusphere .bx-listing-card-rental .bx-listing-body{
    display:flex!important;flex-direction:column!important;gap:9px!important;height:auto!important;min-height:250px!important;padding:12px!important;overflow:visible!important;
  }
  html body.bantusphere .bx-listing-card-rental .bx-listing-title-row{
    display:grid!important;visibility:visible!important;opacity:1!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:start!important;gap:9px!important;
    width:100%!important;min-width:0!important;min-height:40px!important;height:auto!important;margin:0!important;padding:0!important;overflow:visible!important;
  }
  html body.bantusphere .bx-listing-card-rental .bx-listing-title-row>strong{
    display:-webkit-box!important;visibility:visible!important;opacity:1!important;position:static!important;width:100%!important;min-width:0!important;max-width:none!important;min-height:34px!important;
    color:#f8fbff!important;font-size:13.5px!important;line-height:1.28!important;font-weight:900!important;white-space:normal!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;
  }
  html body.bantusphere .bx-listing-card-rental .bx-listing-title-row>strong:empty::before{content:attr(data-title)!important;display:block!important;color:#f8fbff!important}
  html body.bantusphere .bx-listing-card-rental .bx-card-rating{display:inline-flex!important;visibility:visible!important;opacity:1!important;position:static!important;align-items:center!important;gap:4px!important;min-height:27px!important;padding:5px 8px!important}
  html body.bantusphere .bx-listing-card-rental .bx-card-location{min-height:20px!important;font-size:9px!important}
  html body.bantusphere .bx-listing-card-rental .bx-listing-signals{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;min-height:34px!important}
  html body.bantusphere .bx-listing-card-rental .bx-listing-signals>span{justify-content:center!important;padding:6px 5px!important}
  html body.bantusphere .bx-listing-card-rental .bx-rental-public-stats{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;width:100%!important}
  html body.bantusphere .bx-listing-card-rental .bx-rental-public-stats>span,
  html body.bantusphere .bx-listing-card-rental .bx-rental-public-stats>em{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:2px!important;min-width:0!important;min-height:48px!important;padding:5px 3px!important;border:1px solid rgba(122,145,198,.12)!important;border-radius:10px!important;background:rgba(104,124,174,.05)!important;font-style:normal!important;text-align:center!important}
  html body.bantusphere .bx-listing-card-rental .bx-rental-public-stats i{display:inline-block!important;color:#66ddff!important}
  html body.bantusphere .bx-listing-card-rental .bx-listing-foot-v216{margin-top:auto!important;min-height:48px!important}
}

/* =========================================================
   SIGNED-IN LAUNCHPAD — balanced desktop collapsed grid.
   Six modules occupy 4+2; View all fills the remaining two cells as one tile.
   ========================================================= */
@media(min-width:992px){
  html body.bantusphere #bs-superapp-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:stretch!important}
  html body.bantusphere #bs-superapp-grid>.bs-module-grid-footer{
    grid-column:3/5!important;display:flex!important;width:auto!important;min-width:0!important;min-height:112px!important;height:100%!important;margin:0!important;align-self:stretch!important;justify-content:stretch!important;
  }
  html body.bantusphere #bs-superapp-grid>.bs-module-grid-footer .bs-grid-toggle{width:100%!important;height:100%!important;min-height:112px!important;margin:0!important}
  html body.bantusphere #bs-superapp-grid[data-collapsed="false"]>.bs-module-grid-footer{grid-column:1/-1!important;min-height:64px!important}
  html body.bantusphere #bs-superapp-grid[data-collapsed="false"]>.bs-module-grid-footer .bs-grid-toggle{min-height:64px!important}
}

/* Body-level mobile reaction portal: escapes every post/card clipping context. */
.bs-mobile-reaction-portal{display:none}
@media(max-width:969.98px), (hover:none) and (pointer:coarse){
  html body.bantusphere .bs-mobile-reaction-portal.is-open:not([hidden]){
    display:flex!important;align-items:center!important;justify-content:center!important;gap:3px!important;position:fixed!important;
    left:8px;top:8px;width:max-content!important;max-width:calc(100vw - 16px)!important;min-height:60px!important;margin:0!important;padding:7px 8px!important;
    border:1px solid rgba(255,255,255,.14)!important;border-radius:999px!important;background:rgba(7,14,27,.985)!important;
    box-shadow:0 18px 54px rgba(0,0,0,.62),inset 0 1px rgba(255,255,255,.06)!important;backdrop-filter:blur(18px)!important;
    overflow:visible!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;touch-action:manipulation!important;z-index:2147483647!important;
  }
  html body.bantusphere .bs-mobile-reaction-choice{
    appearance:none!important;-webkit-appearance:none!important;display:grid!important;place-items:center!important;flex:0 0 44px!important;width:44px!important;height:44px!important;
    min-width:44px!important;min-height:44px!important;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;
    box-shadow:none!important;overflow:visible!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important;
  }
  html body.bantusphere .bs-mobile-reaction-choice:active{transform:scale(1.18)!important}
  html body.bantusphere .bs-mobile-reaction-choice .emoji,
  html body.bantusphere .bs-mobile-reaction-choice .inline-emoji,
  html body.bantusphere .bs-mobile-reaction-choice .bs-reaction-emoji{
    display:grid!important;place-items:center!important;position:relative!important;inset:auto!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;
    margin:0!important;padding:0!important;border:0!important;background:transparent!important;transform:none!important;opacity:1!important;visibility:visible!important;overflow:visible!important;pointer-events:none!important;
  }
  html body.bantusphere .bs-mobile-reaction-choice .bs-reaction-fallback{display:grid!important;place-items:center!important;position:absolute!important;inset:0!important;font-size:31px!important;line-height:1!important;z-index:0!important}
  html body.bantusphere .bs-mobile-reaction-choice img{display:block!important;position:relative!important;z-index:1!important;width:40px!important;height:40px!important;max-width:40px!important;max-height:40px!important;object-fit:contain!important;transform:none!important;opacity:1!important;visibility:visible!important;pointer-events:none!important}
  /* Hide the nested source tray while the portal is active, preventing a
     second invisible layer from intercepting Share/Comment or proxy taps. */
  html body.bantusphere .reactions-wrapper.bs-mobile-portal-source>.reactions-container{display:none!important;pointer-events:none!important}
}
