/* /includes/controls/moderntabs.css */
.modern-tabs,
.meet-subtabs-wrap > .meet-tabs{
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0;
  margin: 0;
  gap: 0;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  position: relative;
}
.modern-tabs::-webkit-scrollbar,
.meet-subtabs-wrap > .meet-tabs::-webkit-scrollbar{ display:none; }

.modern-tabs .meet-tabitem,
.modern-tabs .modern-tabitem,
.meet-subtabs-wrap > .meet-tabs .meet-tabitem{
  margin: 0;
  flex: 0 0 auto;
}

.modern-tabs-wrap,
.meet-subtabs-wrap{
  position: relative;
  overflow: hidden;
}

.modern-tabs-wrap.is-overflowing:not(.is-at-end)::after,
.meet-subtabs-wrap.is-overflowing:not(.is-at-end)::after{
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:65px;
  height:100%;
  pointer-events:none;
  z-index:3;
  background:linear-gradient(to left, var(--bs-body-bg, #fff), rgba(255,255,255,0));
}
.modern-tabs-wrap.is-overflowing:not(.is-at-start)::before,
.meet-subtabs-wrap.is-overflowing:not(.is-at-start)::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:65px;
  height:100%;
  pointer-events:none;
  z-index:3;
  background:linear-gradient(to right, var(--bs-body-bg, #fff), rgba(255,255,255,0));
}
html.dark .modern-tabs-wrap.is-overflowing:not(.is-at-end)::after,
html.dark .meet-subtabs-wrap.is-overflowing:not(.is-at-end)::after{
  background:linear-gradient(to left, var(--bs-body-bg, #181818), rgba(0,0,0,0));
}
html.dark .modern-tabs-wrap.is-overflowing:not(.is-at-start)::before,
html.dark .meet-subtabs-wrap.is-overflowing:not(.is-at-start)::before{
  background:linear-gradient(to right, var(--bs-body-bg, #181818), rgba(0,0,0,0));
}

.modern-tabs .meet-tabbtn,
.modern-tabs .modern-tabbtn,
.meet-subtabs-wrap > .meet-tabs .meet-tabbtn{
  background: rgba(0,0,0,.10) !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: none !important;
  padding: .58rem .85rem !important;
  font-weight: 800;
  color: rgba(0,0,0,.72) !important;
  border-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  cursor: pointer;
}
.modern-tabs .meet-tabitem + .meet-tabitem .meet-tabbtn,
.modern-tabs .modern-tabitem + .modern-tabitem .modern-tabbtn,
.meet-subtabs-wrap > .meet-tabs .meet-tabitem + .meet-tabitem .meet-tabbtn{ border-left: 0 !important; }
.modern-tabs .meet-tabitem:first-child .meet-tabbtn,
.modern-tabs .modern-tabitem:first-child .modern-tabbtn,
.meet-subtabs-wrap > .meet-tabs .meet-tabitem:first-child .meet-tabbtn{ border-top-left-radius: 12px !important; }
.modern-tabs .meet-tabitem:last-child .meet-tabbtn,
.modern-tabs .modern-tabitem:last-child .modern-tabbtn,
.meet-subtabs-wrap > .meet-tabs .meet-tabitem:last-child .meet-tabbtn{ border-top-right-radius: 12px !important; }
.modern-tabs .meet-tabbtn:hover,
.modern-tabs .modern-tabbtn:hover,
.meet-subtabs-wrap > .meet-tabs .meet-tabbtn:hover{
  background: rgba(0,0,0,.15) !important;
  border-color: rgba(0,0,0,.16) !important;
  color: rgba(0,0,0,.86) !important;
}
.modern-tabs .meet-tabbtn.is-active,
.modern-tabs .meet-tabbtn.active,
.modern-tabs .modern-tabbtn.is-active,
.modern-tabs .modern-tabbtn.active,
.meet-subtabs-wrap > .meet-tabs .meet-tabbtn.is-active,
.meet-subtabs-wrap > .meet-tabs .meet-tabbtn.active{
  background: rgba(13,110,253,.10) !important;
  border-color: rgba(13,110,253,.35) !important;
  color: rgba(0,0,0,.92) !important;
  box-shadow: inset 0 0 0 1px var(--bs-primary, #0d6efd) !important;
}
.modern-tabs .meet-tabbtn:focus-visible,
.modern-tabs .modern-tabbtn:focus-visible,
.meet-subtabs-wrap > .meet-tabs .meet-tabbtn:focus-visible{
  outline: none;
  box-shadow: inset 0 0 0 1px var(--bs-primary, #0d6efd) !important, 0 0 0 3px rgba(13,110,253,.25) !important;
}
.modern-tabpanes,
.meet-tabpanes{ padding-top: .25rem; }

html.dark .modern-tabs .meet-tabbtn,
html.dark .modern-tabs .modern-tabbtn,
html.dark .meet-subtabs-wrap > .meet-tabs .meet-tabbtn{
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.78) !important;
}
html.dark .modern-tabs .meet-tabbtn:hover,
html.dark .modern-tabs .modern-tabbtn:hover,
html.dark .meet-subtabs-wrap > .meet-tabs .meet-tabbtn:hover{
  background: rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.90) !important;
}
html.dark .modern-tabs .meet-tabbtn.is-active,
html.dark .modern-tabs .meet-tabbtn.active,
html.dark .modern-tabs .modern-tabbtn.is-active,
html.dark .modern-tabs .modern-tabbtn.active,
html.dark .meet-subtabs-wrap > .meet-tabs .meet-tabbtn.is-active,
html.dark .meet-subtabs-wrap > .meet-tabs .meet-tabbtn.active{
  background: rgba(13,110,253,.20) !important;
  border-color: rgba(13,110,253,.40) !important;
  color: rgba(255,255,255,.92) !important;
  box-shadow: inset 0 0 0 1px var(--bs-primary, #0d6efd) !important;
}