/* BayiFlow Lite RC17 — accessible premium navigation, no clipped mobile tabs.
   Seven account sections are visible together, with a 4+3 layout on phones.
   Desktop markup, routing and WooCommerce/WalletCove data flow are untouched. */

/* Tablet: seven balanced cells, no sideways scrolling or truncated links. */
@media (min-width:741px) and (max-width:1180px) {
  .bf-premium-shell .bf-premium-tabs {
    display:grid; grid-template-columns:repeat(7,minmax(0,1fr));
    gap:5px; overflow:visible; min-width:0; max-width:100%;
  }
  .bf-premium-shell .bf-premium-tab {
    display:flex; flex-direction:column; gap:5px; min-width:0;
    max-width:100%; min-height:60px; padding:8px 3px;
    white-space:normal; overflow-wrap:anywhere; line-height:1.18;
    font-size:clamp(9.5px,1.15vw,12px);
  }
  .bf-premium-shell .bf-premium-tab-icon svg { width:18px; height:18px; }
}
/* Phone: four tabs followed by three equal-width tabs, with every section visible. */
@media (max-width:740px) {
  .bf-premium-shell .bf-premium-tabs {
    display:grid; grid-template-columns:repeat(12,minmax(0,1fr));
    grid-auto-flow:row; width:100%; min-width:0; max-width:100%;
    gap:6px; padding:7px; margin-bottom:21px;
    overflow:visible; overscroll-behavior:auto; scrollbar-width:auto;
    border-radius:15px;
  }
  .bf-premium-shell .bf-premium-tab {
    grid-column:span 3; display:flex; flex-direction:column; align-items:center;
    justify-content:center; gap:5px; flex:none; min-width:0; max-width:100%;
    min-height:61px; padding:8px 3px; box-sizing:border-box;
    text-align:center; white-space:normal; overflow-wrap:anywhere;
    font-size:11px; font-weight:770; line-height:1.2;
    border-radius:10px;
  }
  .bf-premium-shell .bf-premium-tab:nth-child(n+5) { grid-column:span 4; }
  .bf-premium-shell .bf-premium-tab>span:last-child {
    display:block; min-width:0; max-width:100%; line-height:1.22;
    hyphens:auto; overflow-wrap:anywhere;
  }
  .bf-premium-shell .bf-premium-tab-icon {
    width:20px; height:20px; display:grid; place-items:center; flex:none;
  }
  .bf-premium-shell .bf-premium-tab-icon svg { width:19px; height:19px; }
}
@media (max-width:360px) {
  .bf-premium-shell .bf-premium-tabs { gap:4px; padding:5px; }
  .bf-premium-shell .bf-premium-tab { font-size:10px; gap:4px; padding:6px 2px; min-height:59px; }
  .bf-premium-shell .bf-premium-tab-icon svg { width:18px; height:18px; }
}
@media (prefers-reduced-motion: reduce) {
  .bf-premium-shell .bf-premium-tab { transition:none; }
}