/* SUPATIPS – sidebar styles (moved out of sidebar.php so every page is lighter and the browser caches it). Upload to: public_html/assets/css/sidebar.css */
/* ── Sidebar – premium compact ── */
.sidebar.sbx{display:flex;flex-direction:column;gap:12px;align-self:start}
.sidebar.sbx>*{flex-shrink:0}
.sbx-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius,3px);overflow:hidden}
.sbx-h{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 8px;font:700 10.5px var(--font-body);letter-spacing:.7px;text-transform:uppercase;color:var(--muted)}
.sbx-h a{font-size:10.5px;letter-spacing:.2px;text-transform:none;color:var(--accent);text-decoration:none;font-weight:700}
.sbx svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.sbx svg.st-flag{stroke:none}
.sbx .st-flag{width:18px;height:13px;border-radius:2px;object-fit:cover;box-shadow:0 0 0 1px var(--border);flex-shrink:0}
.sbx img.st-logo{width:18px;height:18px;object-fit:contain;flex-shrink:0}
/* day tiles */
.sbx-days{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:0 10px 10px}
.sbx-day{display:flex;flex-direction:column;align-items:center;gap:5px;padding:9px 2px 8px;border:1px solid var(--border);border-radius:var(--radius,3px);
  text-decoration:none;color:var(--text);font:700 11px var(--font-body);transition:border-color .15s,background .15s;position:relative}
.sbx-day svg{width:17px;height:17px;color:var(--accent)}
.sbx-day:hover,.sbx-day.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.sbx-day .dot{position:absolute;top:6px;right:7px;width:6px;height:6px;border-radius:50%;background:#c94a4a;animation:sbxp 1.4s infinite}
@keyframes sbxp{50%{opacity:.25}}
/* market chips */
.sbx-chips{display:flex;flex-wrap:wrap;gap:5px;padding:0 10px 10px}
.sbx-chip{padding:5px 9px;border:1px solid var(--border);border-radius:999px;font:600 11.5px var(--font-body);color:var(--text);text-decoration:none;white-space:nowrap;transition:border-color .15s,color .15s}
.sbx-lg{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 6px}
.sbx-lg img.st-logo{width:16px;height:16px}.sbx-lg .st-flag{width:16px;height:12px}
.sbx-chip:hover,.sbx-chip.on{border-color:var(--accent);color:var(--accent)}
/* link rows */
.sbx-list{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--border)}
.sbx-list.one{grid-template-columns:1fr}
.sbx-a{display:flex;align-items:center;gap:8px;min-width:0;padding:9px 12px;border-bottom:1px solid var(--border);font:600 12px/1.25 var(--font-body);
  color:var(--text);text-decoration:none;transition:background .15s,color .15s}
.sbx-list:not(.one) .sbx-a:nth-child(odd){border-right:1px solid var(--border)}
.sbx-a span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sbx-a svg{color:var(--accent)}
.sbx-a:hover,.sbx-a.on{background:var(--bg-row,rgba(0,0,0,.03));color:var(--accent)}
.sbx-a b{margin-left:auto;font:800 9px var(--font-body);letter-spacing:.3px;padding:2px 6px;border-radius:999px;background:#008751;color:#fff}
.sbx-a b.hot{background:#c94a4a}
.sbx-more{border-top:1px solid var(--border)}
.sbx-more>summary{list-style:none;cursor:pointer;padding:9px 12px;font:700 11.5px var(--font-body);color:var(--accent);text-align:center}
.sbx-more>summary::-webkit-details-marker{display:none}
.sbx-more>summary:after{content:" ▾"}.sbx-more[open]>summary:after{content:" ▴"}
.sbx-more[open]>summary{border-bottom:1px solid var(--border)}
.sbx-more .sbx-list{border-top:0}
.sbx-all{display:block;padding:9px 12px;text-align:center;font:700 11.5px var(--font-body);color:var(--accent);text-decoration:none}
/* app card */
.sbx-app{display:flex;gap:12px;align-items:center;padding:14px;border-radius:var(--radius,3px);text-decoration:none;color:#fff;
  background:linear-gradient(135deg,var(--accent,#2f6f4e),color-mix(in srgb,var(--accent,#2f6f4e) 55%,#0b1f16));box-shadow:0 6px 18px rgba(0,0,0,.12)}
.sbx-app .ic{flex:0 0 40px;height:40px;border-radius:10px;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center}
.sbx-app .ic svg{width:20px;height:20px;color:#fff}
.sbx-app strong{display:block;font:700 13.5px/1.25 var(--font-head)}
.sbx-app small{display:block;margin-top:2px;font:500 11.5px/1.4 var(--font-body);opacity:.85}
.sbx-app em{display:inline-block;margin-top:7px;padding:4px 10px;border-radius:999px;background:#fff;color:var(--accent,#2f6f4e);font:700 11px var(--font-body);font-style:normal}
/* desktop: stays in view while you scroll long pages */
@media(min-width:1024px){.sidebar.sbx{position:sticky;top:84px;max-height:calc(100vh - 100px);overflow-y:auto;scrollbar-width:thin;padding-bottom:4px}}

/* ── PHONES: sidebar becomes a slide-in "Categories" drawer ── */
.sb-fab,.sb-backdrop,.sb-drawer-head{display:none}
@media (max-width:1023px){
  aside.sidebar.sidebar{display:flex!important;position:fixed!important;top:0;right:0;bottom:0;left:auto;width:88vw;max-width:370px;height:100%;
    margin:0!important;z-index:10001;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    background:var(--bg,#0d0d12);border-left:1px solid var(--border);box-shadow:-12px 0 32px rgba(0,0,0,.35);
    transform:translateX(105%);transition:transform .25s ease;visibility:hidden;padding:0 12px 24px;max-height:none}
  aside.sidebar.sidebar.sb-open{transform:none;visibility:visible}
  .sb-drawer-head{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:2;margin:0 -12px;
    padding:14px 16px;background:var(--accent,#2f6f4e);color:#fff;font:800 15px var(--font-body);letter-spacing:.3px}
  .sb-drawer-head button{background:rgba(255,255,255,.18);border:0;color:#fff;width:34px;height:34px;border-radius:8px;font-size:20px;line-height:1;cursor:pointer}
  .sb-backdrop{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.55)}
  .sb-backdrop.sb-open{display:block}
  .sb-fab{display:inline-flex;align-items:center;gap:7px;position:fixed;left:14px;bottom:calc(16px + var(--promo-h,0px));z-index:9999;
    padding:11px 16px;border:0;border-radius:999px;cursor:pointer;background:var(--accent,#2f6f4e);color:#fff;font:700 13.5px/1 var(--font-body);box-shadow:0 6px 18px rgba(0,0,0,.3)}
  .sb-fab svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2.4;stroke-linecap:round}
  body.sb-lock{overflow:hidden}
}
[data-theme="light"] aside.sidebar.sidebar{background:#fff}
@media (max-width:1023px){[data-theme="light"] aside.sidebar.sidebar{background:var(--bg,#f6f5f0)}}
