/* ==========================================================================




 * beecore-global-footer.css  —  BEECORE GLOBAL PUBLIC FOOTER  v3




 * Matches confirmed design image: Brand (logo + tagline + desc) +




 * Product + Developers columns + bottom bar (copyright + platform text + Status)




 * ========================================================================== */









/* ---------- 1. HIDE OLD REACT FOOTER ---------- */




footer.site-footer,




.site-footer,




.footer-cta-wrap,




.footer-nav-wrap {




  display: none !important;




}









/* ---------- 2. NEW GLOBAL FOOTER ROOT ---------- */




#bc-global-footer.bc-global-footer {




  position: relative;




  background: #fafaf8;




  border-top: 1px solid #eaeaea;




  color: #181818;




  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;




  margin-top: auto;




}









/* --- Main container (wider than header for breathing room) --- */




#bc-global-footer .bc-footer-main {




  max-width: 1800px;




  margin: 0 auto;




  padding: 64px clamp(32px, 5vw, 96px) 48px;




  box-sizing: border-box;




}









/* --- Top section (brand + columns flex) --- */




#bc-global-footer .bc-footer-top {




  display: flex;




  gap: 80px;




  align-items: flex-start;




}









/* ==========================================================================




 * BRAND COLUMN




 * ========================================================================== */




#bc-global-footer .bc-footer-brand {




  flex: 0 0 260px;




  min-width: 0;




  display: flex;




  flex-direction: column;




  gap: 0;




}









#bc-global-footer .bc-footer-brand-link {




  display: inline-flex;




  align-items: center;




  gap: 10px;




  text-decoration: none;




  color: #181818;




  font-weight: 600;




  font-size: 15px;




  line-height: 1;




  margin-bottom: 18px;




}









#bc-global-footer .bc-footer-logo {




  height: 28px;




  width: auto;




  object-fit: contain;




}









#bc-global-footer .bc-footer-tagline {




  color: #181818;




  font-size: 16px;




  font-weight: 500;




  line-height: 1.4;




  letter-spacing: -0.01em;




  margin-bottom: 20px;




}









#bc-global-footer .bc-footer-description {




  color: #737373;




  font-size: 13.5px;




  font-weight: 400;




  line-height: 1.6;




  letter-spacing: -0.005em;




}









/* ==========================================================================




 * LINK COLUMNS




 * ========================================================================== */




#bc-global-footer .bc-footer-cols {




  flex: 1;




  display: grid;




  grid-template-columns: repeat(3, 1fr);




  gap: 14px 40px;




}









#bc-global-footer .bc-footer-col {




  display: flex;




  flex-direction: column;




  gap: 14px;




}









#bc-global-footer .bc-footer-col-title {




  color: #111827;




  font-size: 12.5px;




  font-weight: 600;




  text-transform: uppercase;




  letter-spacing: 0.04em;




  margin-bottom: 6px;




}









#bc-global-footer .bc-footer-link {




  color: #5F6877;




  font-size: 14.5px;




  font-weight: 400;




  text-decoration: none;




  line-height: 1.4;




  transition: color 0.15s ease;




}









#bc-global-footer .bc-footer-link:hover {




  color: #181818;




}












/* Non-clickable label (planned items / not-yet-online) */


#bc-global-footer .bc-footer-label {


  color: #5F6878;


  font-size: 14.5px;


  font-weight: 400;


  line-height: 1.8;


  cursor: default;


  display: block;


}


#bc-global-footer .bc-footer-label--disabled {


  opacity: 0.88;


}


/* ==========================================================================




 * DIVIDER




 * ========================================================================== */




#bc-global-footer .bc-footer-divider {




  height: 1px;




  background: #EAEAEA;




  max-width: 1600px;




  margin: 0 auto;




}









/* ==========================================================================




 * BOTTOM BAR




 * ========================================================================== */




#bc-global-footer .bc-footer-bottom {




  max-width: 1600px;




  margin: 0 auto;




  padding: 24px 48px 32px;




  display: flex;




  justify-content: space-between;




  align-items: center;




  box-sizing: border-box;




  gap: 24px;




}









#bc-global-footer .bc-footer-copyright {




  color: #8a8a8a;




  font-size: 13px;




  font-weight: 400;




  letter-spacing: -0.01em;




  flex-shrink: 0;




}









#bc-global-footer .bc-footer-platform-text {




  color: #8a8a8a;




  font-size: 13px;




  font-weight: 400;




  letter-spacing: -0.01em;




  text-align: center;




  flex: 1;




  min-width: 0;




  overflow: hidden;




  text-overflow: ellipsis;




  white-space: nowrap;




}









#bc-global-footer .bc-footer-bottom-links {




  display: flex;




  gap: 24px;




  align-items: center;




  flex-shrink: 0;




}









#bc-global-footer .bc-footer-bottom-link {




  color: #8a8a8a;




  font-size: 13px;




  font-weight: 400;




  text-decoration: none;




  transition: color 0.15s ease;




  display: inline-flex;




  align-items: center;




  gap: 6px;




}









#bc-global-footer .bc-footer-bottom-link:hover {




  color: #181818;




}









#bc-global-footer .bc-footer-bottom-link .bc-footer-arrow {




  font-size: 14px;




}









/* ==========================================================================




 * TABLET — max-width 1024px




 * ========================================================================== */




@media (max-width: 1024px) {




  #bc-global-footer .bc-footer-main {




    padding: 56px 32px 40px;




  }




  




  #bc-global-footer .bc-footer-top {




    flex-direction: column;




    gap: 48px;




  }









  #bc-global-footer .bc-footer-brand {




    flex: none;




    max-width: 360px;




  }









  #bc-global-footer .bc-footer-cols {




    grid-template-columns: repeat(2, 1fr);




    gap: 28px 48px;




  }




  




  #bc-global-footer .bc-footer-bottom {




    padding: 20px 32px 28px;




  }




}









/* ==========================================================================




 * MOBILE — max-width 640px




 * ========================================================================== */




@media (max-width: 640px) {




  #bc-global-footer .bc-footer-main {




    padding: 48px 20px 32px;




  }









  #bc-global-footer .bc-footer-top {




    flex-direction: column;




    gap: 40px;




  }









  #bc-global-footer .bc-footer-brand {




    flex: none;




    max-width: none;




  }









  #bc-global-footer .bc-footer-cols {




    grid-template-columns: 1fr;




    gap: 32px;




  }









  #bc-global-footer .bc-footer-col {




    gap: 12px;




  }









  #bc-global-footer .bc-footer-bottom {




    padding: 20px;




    flex-direction: column;




    align-items: flex-start;




    gap: 14px;




  }




  




  #bc-global-footer .bc-footer-platform-text {




    text-align: left;




    white-space: normal;




  }









  #bc-global-footer .bc-footer-bottom-links {




    flex-wrap: wrap;




    gap: 16px;




  }




}









/* ==========================================================================




 * CONSOLE/ADMIN — hide footer on app routes




 * ========================================================================== */




html.app-route #bc-global-footer,




html.admin-route #bc-global-footer {




  display: none !important;




}






/* [v5-detail] Tagline → secondary gray */

#bc-global-footer .bc-footer-tagline {

  color: #737373 !important;

}



/* [v5-detail] Social icons row (below description) */

#bc-global-footer .bc-footer-social {

  display: flex;

  gap: 30px;

  margin-top: 26px;

  align-items: center;

}

#bc-global-footer .bc-footer-social a,

#bc-global-footer .bc-footer-social span {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 22px;

  height: 22px;

  color: #9CA3AF;

  transition: color 0.15s;

  text-decoration: none;

}

#bc-global-footer .bc-footer-social a:hover {

  color: #181818;

}

#bc-global-footer .bc-footer-social svg {

  width: 20px;

  height: 20px;

  display: block;

}



/* [v5-detail] Bottom bar alignment */

#bc-global-footer .bc-footer-bottom {

  max-width: 1800px;

  justify-content: flex-start;

  gap: 0;

  padding-inline: clamp(32px, 5vw, 96px);

}

#bc-global-footer .bc-footer-copyright {

  margin-right: 0;

}

#bc-global-footer .bc-footer-platform-text {

  text-align: left;

  white-space: nowrap;

  flex: none;

  margin-right: auto;

  overflow: visible;

}

#bc-global-footer .bc-footer-bottom-links {

  margin-left: auto;

}

/* Tablet + Mobile: reset to natural flow */

@media (max-width: 1024px) {

  #bc-global-footer .bc-footer-bottom {

    justify-content: space-between;

    gap: 24px;

    padding-inline: 32px;

  }

  #bc-global-footer .bc-footer-platform-text {

    margin-right: 0;

    text-align: center;

    flex: 1;

  }

}

@media (max-width: 640px) {

  #bc-global-footer .bc-footer-bottom {

    justify-content: flex-start;

    flex-direction: column;

    align-items: flex-start;

    gap: 14px;

    padding-inline: 20px;

  }

  #bc-global-footer .bc-footer-platform-text {

    margin-left: 0 !important;

    text-align: left;

    flex: none;

    white-space: normal;

  }

  #bc-global-footer .bc-footer-bottom-links {

    margin-left: 0;

  }

}


/* [v5-detail3] Bottom bar: position:absolute children for pixel alignment */
#bc-global-footer .bc-footer-bottom {
  position: relative;
  display: block;
  height: 40px;
  padding-inline: 0;
  justify-content: initial;
  gap: 0;
  max-width: 1800px;
  margin-inline: auto;
}
#bc-global-footer .bc-footer-copyright,
#bc-global-footer .bc-footer-platform-text,
#bc-global-footer .bc-footer-bottom-links {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 0 !important;
  margin-right: 0 !important;
  flex: none !important;
}
#bc-global-footer .bc-footer-copyright { left: 0; }
#bc-global-footer .bc-footer-platform-text {
  left: 0;
  text-align: left;
  white-space: nowrap;
}
#bc-global-footer .bc-footer-bottom-links {
  right: 0;
  margin-left: 0 !important;
}
@media (max-width: 1024px) {
  #bc-global-footer .bc-footer-bottom {
    position: static;
    display: flex;
    height: auto;
    padding-inline: 32px;
    gap: 24px;
    justify-content: space-between;
  }
  #bc-global-footer .bc-footer-copyright,
  #bc-global-footer .bc-footer-platform-text,
  #bc-global-footer .bc-footer-bottom-links {
    position: static !important;
    transform: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex: 1;
  }
}
@media (max-width: 640px) {
  #bc-global-footer .bc-footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    padding-inline: 20px;
  }
  #bc-global-footer .bc-footer-platform-text {
    flex: none;
    white-space: normal;
  }
}
