/*
==============================================================
 StockSkill Global UI V3
 Exact Existing Header / Mobile Menu Safe Layer
==============================================================
*/

html,
body{
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

/* ============================================================
   ACTUAL STOCKSKILL HEADER
   ============================================================ */

header.stockskill-sticky-header{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  position:sticky;
  top:0;
  z-index:10000;
}

/* Actual header inner container */
header.stockskill-sticky-header .container.nav-inner{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}

/* ============================================================
   DESKTOP NAV
   ============================================================ */

@media (min-width:769px){

  header.stockskill-sticky-header{
    min-height:60px;
  }

  header.stockskill-sticky-header .nav-inner{
    min-height:60px;
  }

}

/* ============================================================
   MOBILE HEADER
   ============================================================ */

@media (max-width:768px){

  header.stockskill-sticky-header{
    width:100% !important;
    max-width:100% !important;
    min-height:56px;
  }

  header.stockskill-sticky-header .container.nav-inner{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding-left:12px !important;
    padding-right:12px !important;
  }

  header.stockskill-sticky-header .logo{
    max-width:calc(100% - 70px);
    min-width:0;
  }

  header.stockskill-sticky-header .logo img{
    max-width:100%;
    height:auto;
  }

  /* Existing mobile menu trigger/container */
  .mobile-menu{
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  #mobileMenu,
  #mobileDrawer,
  .mobile-drawer,
  .mobile-drawer-panel,
  .mobile-drawer-backdrop{
    box-sizing:border-box !important;
  }

  #mobileDrawer,
  .mobile-drawer,
  .mobile-drawer-panel{
    max-width:100vw !important;
  }

  .mobile-drawer-panel{
    width:min(92vw,420px);
  }

  .mobile-drawer-links{
    max-width:100%;
    overflow-x:hidden;
  }

  .mobile-drawer-links a,
  .mobile-drawer-links button{
    max-width:100%;
    min-height:44px;
    box-sizing:border-box;
  }

}

/* ============================================================
   MARKET TICKER
   ============================================================ */

.market-strip{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow:hidden;
}

.market-strip .container.ticker,
.market-strip #marketTicker{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}

#marketTicker{
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
  -webkit-overflow-scrolling:touch;
}

#marketTicker .tick{
  flex:0 0 auto;
  white-space:nowrap;
}

/* ============================================================
   FLOATING CONTACT
   ============================================================ */

.floating-contact{
  max-width:100vw;
  box-sizing:border-box;
}

.floating-contact-btn{
  box-sizing:border-box;
  max-width:100%;
}

@media (max-width:768px){

  .floating-contact{
    max-width:100vw !important;
    right:10px !important;
    bottom:10px !important;
  }

  .floating-contact-btn{
    min-width:44px;
    min-height:44px;
  }

}

/* ============================================================
   GLOBAL MEDIA SAFETY
   ============================================================ */

img,
video,
iframe,
svg{
  max-width:100%;
}

input,
select,
textarea,
button{
  max-width:100%;
  box-sizing:border-box;
}