/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jan 05 2026 | 12:42:57 */
/* BrightLeaf Giving palette tabs for the [tabbed_content]/[tab] snippet.
   Scope: only affects .bl-tabs blocks.
*/

/* Palette tokens (tweak freely) */
:root{
  --blg-navy: #0b2a4a;
  --blg-navy-2: #123a63;
  --blg-green: #6fc24a;
  --blg-green-2: #4aa73a;
  --blg-ink: #0f172a;
  --blg-muted: rgba(11,42,74,.55);
  --blg-border: rgba(11,42,74,.14);
  --blg-surface: #ffffff;
  --blg-surface-2: rgba(11,42,74,.03);
  --blg-shadow: 0 10px 24px rgba(11,42,74,.12);
}

/* Wrapper */
.bl-tabs{
  background: var(--blg-surface);
  border: 1px solid var(--blg-border);
  border-radius: 18px;
  box-shadow: var(--blg-shadow);
  overflow: hidden;
	margin-top:10px;
}

/* NAV */
.bl-tabs__nav{
  display: flex;
  gap: 10px;
  align-items: stretch;
  padding: 12px 12px 10px;
  background: linear-gradient(180deg, #fff 0%, var(--blg-surface-2) 100%);
  border-bottom: 1px solid var(--blg-border);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.bl-tabs__nav::-webkit-scrollbar{ height: 8px; }
.bl-tabs__nav::-webkit-scrollbar-thumb{
  background: rgba(11,42,74,.22);
  border-radius: 20px;
}

/* TAB BUTTONS */
.bl-tabs__tab{
  appearance: none;
  border: 1px solid var(--blg-border);
  background: #fff;
  color: var(--blg-muted);
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 800;
  font-size: 14px;
  line-height: 1;
  letter-spacing: .2px;
  cursor: pointer;
  flex: 0 0 auto;
  position: relative;
  transition: transform .08s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
  user-select: none;
  white-space: nowrap;
}

.bl-tabs__tab:hover{
  color: var(--blg-navy);
  border-color: rgba(11,42,74,.24);
  box-shadow: 0 8px 18px rgba(11,42,74,.10);
  transform: translateY(-1px);
}

.bl-tabs__tab.is-active{
  color: #fff;
  border-color: rgba(0,0,0,0);
  background: linear-gradient(135deg, var(--blg-navy) 0%, var(--blg-navy-2) 55%, var(--blg-green-2) 140%);
  box-shadow: 0 10px 24px rgba(11,42,74,.18);
}

/* Optional green accent ring on active tab */
.bl-tabs__tab.is-active::after{
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 999px;
  border: 2px solid rgba(111,194,74,.55);
  pointer-events: none;
}

/* Inner span in title, if you pass HTML */
.bl-tabs__tab-inner{
  display: inline-flex;
  gap: 8px;
  align-items: center;
}

/* PANELS */
.bl-tabs__panels{
  padding: 14px;
  background: #fff;
}
.bl-tabs__panel{
  border-radius: 14px;
}
.bl-tabs__panel.is-active{
  animation: blgTabFade .18s ease-out;
}
@keyframes blgTabFade{
  from{ opacity: .55; transform: translateY(3px); }
  to{ opacity: 1; transform: translateY(0); }
}

/* Panel inner wrapper for spacing and readable typography */
.bl-tabs__panel-inner{
  background: #fff;
  border: 0px solid var(--blg-border);
  border-radius: 14px;
  padding: 14px;
}

/* Make embedded tables/views/forms behave on mobile */
.bl-tabs__panel-inner img,
.bl-tabs__panel-inner video,
.bl-tabs__panel-inner iframe{
  max-width: 100%;
  height: auto;
}

/* If a tab panel contains wide tables (GravityView table layouts, etc.) */
.bl-tabs__panel-inner table{
  width: 100%;
  max-width: 100%;
}
.bl-tabs__panel-inner .gv-container,
.bl-tabs__panel-inner .gv-list-container,
.bl-tabs__panel-inner .gv-table-container{
  max-width: 100%;
}

/* Mobile tuning */
@media (max-width: 767px){
  .bl-tabs{ border-radius: 16px; }
  .bl-tabs__nav{ padding: 10px; gap: 8px; }
  .bl-tabs__tab{ padding: 9px 12px; font-size: 13px; }
  .bl-tabs__panels{ padding: 12px; }
  .bl-tabs__panel-inner{ padding: 12px; border-radius: 12px; }
}

/* Optional: sticky tab bar (add class "bl-tabs--sticky" to wrapper via shortcode class="bl-tabs--sticky") */
.bl-tabs.bl-tabs--sticky .bl-tabs__nav{
  position: sticky;
  top: 0;
  z-index: 50;
}

/* Focus visibility */
.bl-tabs__tab:focus{
  outline: none;
}
.bl-tabs__tab:focus-visible{
  box-shadow: 0 0 0 3px rgba(111,194,74,.35), 0 10px 24px rgba(11,42,74,.16);
  border-color: rgba(111,194,74,.55);
}