/*
  IMPORTANT:
  - Never override global typography.
  - Avoid `font:` shorthand here because it can unintentionally override theme styles.
  - Keep font rules scoped to the widget only.
*/
.sfbv3{--sfb-accent:#8a1f62;--sfb-icon-color:var(--sfb-accent);font-family:inherit;font-size:inherit;line-height:inherit}
.sfbv3 button,.sfbv3 input,.sfbv3 select,.sfbv3 textarea{font-family:inherit;font-size:inherit;line-height:inherit}
.sfbv3 *{box-sizing:border-box}

/* Link color: keep visited same (avoid purple after click) */
.sfbv3 a{color:inherit;text-decoration:none}
.sfbv3 a:visited{color:inherit}
.sfbv3__header{padding:14px 16px;border-radius:14px;border:1px solid rgba(0,0,0,.06);display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:8px;align-items:center}
.sfbv3__title{font-size:22px;font-weight:700;color:var(--sfb-accent);line-height:1.2}
.sfbv3__path{grid-column:1/-1;font-size:13px;opacity:.8;word-break:break-word}
.sfbv3__toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.sfbv3__toolbarLeft{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.sfbv3__toolbarRight{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.sfbv3__tool{display:inline-flex;flex-direction:row !important;align-items:center;justify-content:center;gap:10px;border:1px solid var(--sfb-accent, #8a1f62);background:transparent;color:var(--sfb-icon-color, var(--sfb-accent, #8a1f62))!important;padding:8px 12px;border-radius:12px;font-size:14px;cursor:pointer;line-height:1;white-space:nowrap}

/* Toolbar buttons */
.sfbv3__toolIconOnly{width:46px;height:46px;padding:0 !important;gap:0}
.sfbv3__toolIconOnly svg,.sfbv3__toolIconOnly img{margin:0;display:block}
.sfbv3__toolWithText{padding:10px 14px !important;gap:10px;white-space:nowrap}
.sfbv3__toolWithText svg,.sfbv3__toolWithText img{width:22px;height:22px;display:block}
.sfbv3__toolText{display:inline-block;margin-left:0;font-weight:600}

/* Make all SVG icons follow the generic icon color */
.sfbv3 svg{color:inherit}
.sfbv3 svg [fill]:not([fill="none"]){fill:currentColor}
.sfbv3 svg [stroke]:not([stroke="none"]){stroke:currentColor}

.sfbv3__tool svg,.sfbv3__tool i{width:20px;height:20px}
.sfbv3__toolText{display:inline-flex;align-items:center;font-weight:600}
.sfbv3__svgIcon{width:20px;height:20px;display:block}
.sfbv3__tool:hover{filter:brightness(.95)}
.sfbv3__select{border:1px solid rgba(0,0,0,.2);border-radius:10px;padding:7px 10px;background:#fff;width:auto;min-width:180px;max-width:280px}
.sfbv3__spacer{flex:1 1 auto}

@media (max-width: 680px){
  .sfbv3__toolbar{flex-wrap:wrap}
  .sfbv3__select{min-width:140px;max-width:100%}
}

.sfbv3__body{display:flex;gap:14px;margin-top:14px}
.sfbv3__left{flex: 0 0 35%;min-width:180px;border:1px solid rgba(0,0,0,.06);border-radius:14px;padding:12px}
.sfbv3__right{flex:1 1 85%;border:1px solid rgba(0,0,0,.06);border-radius:14px;padding:12px;min-width:0}
.sfbv3__leftTitle,.sfbv3__rightTitle{font-weight:700;margin-bottom:10px}

.sfbv3__tree{display:flex;flex-direction:column;gap:6px}
.sfbv3__treeItem{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;cursor:pointer;border:1px solid transparent}
.sfbv3__treeItem:hover{background:rgba(0,0,0,.03)}
.sfbv3__treeItem.is-active{border-color:var(--sfb-accent);background:rgba(138,31,98,.06)}
.sfbv3__treeIcon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;color:var(--sfb-icon-color, var(--sfb-accent, #8a1f62))}
.sfbv3__treeIcon svg,.sfbv3__treeIcon i{width:18px;height:18px}

.sfbv3__files{display:block;min-height:120px;overflow:auto}
.sfbv3__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.sfbv3__list{display:flex;flex-direction:column;gap:8px}

.sfbv3__fileCard{border:1px solid rgba(0,0,0,.06);border-radius:14px;padding:12px;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start}
.sfbv3__fileIcon{line-height:1;color:var(--sfb-icon-color);width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:rgba(0,0,0,.03)}
.sfbv3__fileIcon svg,.sfbv3__fileIcon img,.sfbv3__fileIcon i{width:28px;height:28px}
.sfbv3__fileName{font-weight:700;word-break:break-word}
.sfbv3__fileMeta{font-size:12px;opacity:.75;margin-top:2px}
.sfbv3__fileActions{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap;justify-content:center}
.sfbv3__link{border:none;background:none;color:var(--sfb-accent);padding:0;cursor:pointer;text-decoration:underline;font-size:14px}
.sfbv3__iconBtn{border:1px solid rgba(0,0,0,.12);background:#fff;border-radius:12px;padding:0;cursor:pointer;line-height:1;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--sfb-icon-color)!important}
.sfbv3__iconBtn,
.sfbv3__tool,
.sfbv3__treeIconBtn,
.sfbv3__treeLink,
.sfbv3__kebab{user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.sfbv3__iconBtn:focus,
.sfbv3__tool:focus,
.sfbv3__treeIconBtn:focus,
.sfbv3__treeLink:focus,
.sfbv3__kebab:focus{outline:none;box-shadow:none}
.sfbv3__iconBtn:focus-visible,
.sfbv3__tool:focus-visible,
.sfbv3__treeIconBtn:focus-visible,
.sfbv3__treeLink:focus-visible,
.sfbv3__kebab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(122, 31, 92, .15)}
.sfbv3__iconBtn svg,.sfbv3__iconBtn i{width:20px;height:20px}
.sfbv3__iconBtn:hover{filter:brightness(.97)}
.sfbv3__iconDanger{border-color:rgba(180,35,24,.35)}
.sfbv3__treeName{color:var(--sfb-accent, #8a1f62)}

.sfbv3__empty{opacity:.75;padding:12px}

/* modal */
.sfbv3__modal{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;z-index:99999}
/* Ensure [hidden] always wins (our display:flex would otherwise override it). */
.sfbv3__modal[hidden]{display:none!important}
.sfbv3__modalCard{width:min(720px,92vw);background:#fff;border-radius:16px;padding:14px;border:1px solid rgba(0,0,0,.08)}
.sfbv3__modalHead{display:flex;align-items:center;justify-content:space-between;font-weight:700;margin-bottom:10px}
.sfbv3__input{width:100%;padding:10px 12px;border-radius:12px;border:1px solid rgba(0,0,0,.2)}
.sfbv3__searchResults{margin-top:10px;max-height:50vh;overflow:auto}

/* v3.0.1 debug flag */
.sfbv3__jsflag{font-size:12px;opacity:.7;margin-top:4px;}
.sfbv3.is-js .sfbv3__jsflag{display:none;}


/* === Tree (Notion-like, structural) === */
.sfbv3__treeList{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.sfbv3__treeList--nested{margin-left:26px;position:relative}

.sfbv3__treeNode{position:relative}

/* connector lines: generated only for nested lists */
.sfbv3__treeList--nested > .sfbv3__treeNode::before{
  content:"";
  position:absolute;
  left:-14px;
  top:-10px;
  bottom:-10px;
  border-left:1px solid rgba(0,0,0,.12);
}
.sfbv3__treeList--nested > .sfbv3__treeNode::after{
  content:"";
  position:absolute;
  left:-14px;
  top:18px;
  width:14px;
  border-top:1px solid rgba(0,0,0,.12);
}
.sfbv3__treeList--nested > .sfbv3__treeNode:last-child::before{
  bottom:18px;
}

.sfbv3__treeItem{position:relative}

/* Folder typography: -2pt, weight 400, light tracking */
.sfbv3__treeLink{
  display:inline-flex;
  align-items:center;
  font-size:14px;
  font-weight:400;
  letter-spacing:.2px;
  color:rgba(0,0,0,.82);
  background:transparent;
  border:none;
  padding:6px 6px;
  border-radius:10px;
  cursor:pointer;
}
.sfbv3__treeLink:hover{background:rgba(0,0,0,.03)}

/* --- Icon normalization (Elementor Icons Manager outputs) --- */
.sfbv3 .elementor-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1;vertical-align:middle;color:inherit}
.sfbv3 .elementor-icon i{font-size:18px;line-height:1}
/* SVG icons sometimes ship with inline width/height (or 1em). Force our size. */
.sfbv3 .elementor-icon svg{width:18px!important;height:18px!important;max-width:18px!important;max-height:18px!important;display:block}

/* Toolbar buttons: keep everything aligned and prevent huge icons */
.sfbv3__tool{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.sfbv3__tool > span{line-height:1}
.sfbv3__tool .elementor-icon,
.sfbv3__tool > span[aria-hidden="true"]{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center}

/* Elementor global styles may inflate icon size inside buttons; hard reset for toolbar */
.sfbv3__toolbar .sfbv3__tool .elementor-icon{
  width:18px!important;
  height:18px!important;
  font-size:18px!important;
  line-height:1!important;
  flex:0 0 18px!important;
}
.sfbv3__toolbar .sfbv3__tool .elementor-icon i{
  font-size:18px!important;
  line-height:1!important;
}


/* Icon-only tools (root/up/search) tighter */
.sfbv3__tool[aria-label]{padding:8px 9px;min-width:40px}

/* File/folder action icon buttons */
.sfbv3__iconBtn .elementor-icon,
.sfbv3__iconBtn > span[aria-hidden="true"]{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center}

/* Tree icons */
.sfbv3__treeIcon .elementor-icon,
.sfbv3__treeIcon > span[aria-hidden="true"]{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center}


/* Login form inline (preview/frontend) */
.sfbv3__login{display:flex;gap:10px;align-items:center;margin-top:12px;flex-wrap:nowrap}
.sfbv3__login .sfbv3__input{flex:1 1 auto;min-width:0}
.sfbv3__loginbtn{white-space:nowrap;flex:0 0 auto;min-width:120px}
@media (max-width:480px){
  .sfbv3__login{flex-wrap:wrap}
  .sfbv3__loginbtn{width:100%}
}


/* === FIX27: strict sizing + alignment for all icons/buttons === */
.sfbv3__tool{height:44px; padding:10px 12px; border-radius:12px}
.sfbv3__tool[aria-label]{width:44px; padding:0}
.sfbv3__tool span{display:inline-flex; align-items:center}

.sfbv3__toolbar{gap:10px}
.sfbv3__select{height:44px; padding:0 12px; display:inline-flex; align-items:center}

.sfbv3__tool .elementor-icon,
.sfbv3__tool i,
.sfbv3__tool svg,
.sfbv3__iconBtn .elementor-icon,
.sfbv3__iconBtn i,
.sfbv3__iconBtn svg,
.sfbv3__treeIcon .elementor-icon,
.sfbv3__treeIcon i,
.sfbv3__treeIcon svg{
  width:20px!important;
  height:20px!important;
  font-size:20px!important;
  line-height:1!important;
  max-width:20px!important;
  max-height:20px!important;
}

.sfbv3__tool svg,
.sfbv3__iconBtn svg,
.sfbv3__treeIcon svg{display:block!important}

/* Avoid theme overrides for our controls */
.sfbv3__tool, .sfbv3__iconBtn, .sfbv3__treeCaret, .sfbv3__treeLink{font:inherit}
.sfbv3__tool, .sfbv3__iconBtn{font-size:16px}

.sfbv3__iconBtn{
  width:40px;
  height:40px;
  padding:0;
  border-radius:12px;
  color:var(--sfb-icon-color);
}
.sfbv3__iconDanger{color:#b42318}

/* Reduce visual noise: show destructive controls only on hover in editor */
.sfbv3__onlyHover{opacity:0;pointer-events:none;transition:opacity .12s ease}
.sfbv3__treeItem:hover .sfbv3__onlyHover,
.sfbv3__fileCard:hover .sfbv3__onlyHover{opacity:1;pointer-events:auto}

/* Tree layout polish */
.sfbv3__treeItem{border:1px solid rgba(0,0,0,.06)}
.sfbv3__treeCaret{width:32px;height:32px;border-radius:12px}
.sfbv3__treeIcon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;color:var(--sfb-icon-color, var(--sfb-accent, #8a1f62))}

/* Context menu (folders) */
.sfbv3__ctxWrap{margin-left:auto;position:relative}
.sfbv3__kebab{
  width:32px;height:32px;
  border:1px solid transparent;
  background:transparent;
  border-radius:10px;
  cursor:pointer;
  line-height:1;
  font-size:18px;
  color:rgba(0,0,0,.55);
}
.sfbv3__treeItem:hover .sfbv3__kebab{border-color:rgba(0,0,0,.10);background:rgba(0,0,0,.02)}
.sfbv3__ctxMenu{
  position:absolute;
  right:0;
  top:36px;
  min-width:170px;
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.10);
  padding:6px;
  z-index:10;
}
/* Hidden must win (Elementor/theme sometimes forces display) */
.sfbv3__ctxMenu[hidden]{display:none!important}
.sfbv3__ctxItem{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  border:none;
  background:transparent;
  padding:10px 10px;
  border-radius:10px;
  cursor:pointer;
  font-size:14px;
  color:rgba(0,0,0,.84);
}
.sfbv3__ctxItem:hover{background:rgba(0,0,0,.04)}
.sfbv3__ctxItem.is-danger{color:#b42318}
.sfbv3__ctxIco{display:inline-flex;align-items:center;justify-content:center}
.sfbv3__ctxIco svg,.sfbv3__ctxIco i{width:18px!important;height:18px!important;max-width:18px!important;max-height:18px!important;flex:0 0 18px}

/* Kebab alignment + no weird focus box */
.sfbv3__kebab{display:inline-flex;align-items:center;justify-content:center}
.sfbv3__kebab:focus{outline:none!important;box-shadow:none!important}

/* Ensure the right side actions are always aligned and never wrap weirdly */
.sfbv3__treeItem{width:100%;min-width:0}
.sfbv3__ctxWrap{flex:0 0 auto}

.sfbv3__fileIcon{
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
}

.sfbv3__login .sfbv3__input{height:44px}
.sfbv3__loginbtn{height:44px}

/* Compact list mode */
.sfbv3__fileRow{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid rgba(0,0,0,.06);border-radius:14px;background:#fff}
.sfbv3__fileRowIcon{width:26px;height:26px;display:flex;align-items:center;justify-content:center;color:var(--sfb-icon-color);flex:0 0 auto}
.sfbv3__fileRowIcon .sfbv3__svgIcon{width:22px;height:22px}
.sfbv3__fileRowLink{flex:1 1 auto;min-width:0;font-size:10pt;font-weight:400;text-decoration:underline;color:var(--sfb-accent);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sfbv3__fileRow .sfbv3__iconBtn{width:32px;height:32px;border-radius:10px}


/* Tree: compact + visible hierarchy */
.sfbv3__treeList{position:relative;padding-left:18px}
.sfbv3__treeNode{position:relative;padding-left:20px;margin:2px 0}
.sfbv3__treeNode::before{content:"";position:absolute;left:9px;top:-12px;bottom:-12px;width:2px;background:rgba(0,0,0,.18)}
.sfbv3__treeNode:last-child::before{bottom:14px}
.sfbv3__treeItem{position:relative;display:flex;align-items:center;gap:8px}
.sfbv3__treeItem::before{content:"";position:absolute;left:9px;top:50%;width:14px;height:2px;background:rgba(0,0,0,.18)}
.sfbv3__treeCaret{border:0;background:transparent;width:22px;height:22px;border-radius:6px}
.sfbv3__treeCaret:hover{background:rgba(0,0,0,.04);filter:none}
.sfbv3__treeIcon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;color:var(--sfb-icon-color, var(--sfb-accent, #8a1f62))}
.sfbv3__treeLink{display:inline-flex;align-items:center;gap:8px;font-weight:400;color:inherit;text-decoration:none}


/* Icon buttons (download/delete) */
.sfbv3__iconBtn{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0 !important}
.sfbv3__iconBtn svg,.sfbv3__iconBtn img{width:20px;height:20px;display:block;margin:0}

/* ===== FIX34: UX normalization (tree, toolbar, buttons, fonts) ===== */

/* Never alter global page typography; keep everything scoped and inherited */
.sfbv3, .sfbv3 *{
  font-family: inherit !important;
}

/* Toolbar icon buttons: true centering */
.sfbv3__tools{
  align-items: center;
}
.sfbv3__tool{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  padding: 0;
}
.sfbv3__tool svg,
.sfbv3__tool img{
  display: block;
  margin: 0;
}

/* Create folder / upload buttons: icon left, text right; compact */
.sfbv3__cta{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.sfbv3__btnPrimary,
.sfbv3__btnSecondary{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  white-space: nowrap;
}
.sfbv3__btnPrimary .sfbv3__btnIcon,
.sfbv3__btnSecondary .sfbv3__btnIcon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
}

/* Tree: remove the “button/chip” frames inside the folders list */
.sfbv3__tree,
.sfbv3__treeList{
  background: transparent;
}
.sfbv3__treeNode{position:relative;padding-left:20px;margin:2px 0}
.sfbv3__treeRow{display:flex;align-items:center;gap:8px;padding:6px 6px;border:none;background:transparent;border-radius:10px;position:relative}
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 6px;
}
.sfbv3__treeCaret{
  width: 18px;
  height: 18px;
  border: 0 !important;
  background: transparent !important;
  padding: 0;
  border-radius: 0;
  color: inherit;
}
.sfbv3__treeSpacer{
  display: inline-block;
  width: 18px;
  height: 18px;
}
.sfbv3__treeLink{display:inline-flex;align-items:center;gap:8px;font-weight:400;color:inherit;text-decoration:none}
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0;
  text-align: left;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.sfbv3__treeLink:focus{outline: 2px solid rgba(0,0,0,.15); outline-offset: 2px;}
.sfbv3__treeName{color:var(--sfb-accent, #8a1f62)}

/* Tree connectors (simple vertical spine + indent) */
.sfbv3__treeNode{position:relative;padding-left:20px;margin:2px 0}
.sfbv3__treeNode::before{content:"";position:absolute;left:9px;top:-12px;bottom:-12px;width:2px;background:rgba(0,0,0,.18)}
  content: "";
  position: absolute;
  left: calc(10px + (var(--depth, 0) * 14px));
  top: 0;
  bottom: 0;
  width: 1px;
  background: rgba(0,0,0,.08);
}
.sfbv3__treeRow{display:flex;align-items:center;gap:8px;padding:6px 6px;border:none;background:transparent;border-radius:10px;position:relative}
  padding-left: calc(6px + (var(--depth, 0) * 14px));
}

/* List view: only a compact 10pt link on the filename */
.sfbv3__fileRow{
  padding: 6px 10px;
}
.sfbv3__fileRowLink{
  font-size: 10pt;
  font-weight: 400;
  text-decoration: underline;
}

/* Generic icon color: use currentColor for all icons */
.sfbv3 [data-sfbv3-icon]{
  color: var(--sfb-icon-color);
}
.sfbv3 [data-sfbv3-icon] svg{width: 100%; height: 100%;}

/* === FIX36: icon color, alignment, tree compact === */
/* Force SVG icons to inherit currentColor (Elementor SVG uploads often have hardcoded fills). */
.sfbv3 .sfbv3__tool svg *,
.sfbv3 .sfbv3__iconBtn svg *,
.sfbv3 .sfbv3__treeIcon svg *,
.sfbv3 .sfbv3__fileIcon svg *,
.sfbv3 .sfbv3__fileRowIcon svg *{
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* Center toolbar icons inside their squares */
.sfbv3 .sfbv3__tool{display:inline-flex;align-items:center;justify-content:center}
.sfbv3 .sfbv3__tool svg{display:block;margin:auto}

/* File icon + text vertical alignment */
.sfbv3 .sfbv3__fileCard{align-items:center}
.sfbv3 .sfbv3__fileName{line-height:1.2}
.sfbv3 .sfbv3__fileMeta{margin-top:0}

/* Delete icon same size as download */
.sfbv3 .sfbv3__iconBtn{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center}
.sfbv3 .sfbv3__iconBtn svg{width:20px;height:20px}

/* Tree: remove outer vertical line and make it more compact */
.sfbv3 .sfbv3__treeRow{padding:3px 6px;border-radius:10px}
.sfbv3 .sfbv3__treeChildren{padding-left:18px}



/* ===== POLISHED TREE & UI ===== */

.sfbv3__tree {
    padding: 12px 10px;
}

.sfbv3__tree * {
    border: none !important;
    box-shadow: none !important;
}

.sfbv3__tree li {
    margin: 2px 0;
    padding: 2px 0;
}

.sfbv3__tree a,
.sfbv3__tree span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    color: inherit;
    transition: color .2s ease;
}

.sfbv3__tree a:hover,
.sfbv3__tree span:hover {
    color: #333333 !important;
}

.sfbv3__tree .is-active {
    font-weight: 600;
}

.sfbv3__toolbar button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.sfbv3__toolbar .sfbv3__btnText {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.sfbv3__fileRow {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
}

.sfbv3__fileRow svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.sfbv3__files {
    padding: 10px 16px;
}

/* ------------------------------------------------------------------
   UX polish (tree + toolbar + icons) — keep at end for maximum priority
-------------------------------------------------------------------*/

/* Ensure global icon color is applied everywhere (SVG uses currentColor) */
.sfbv3{--sfb-icon-color: var(--sfb-icon-color, var(--sfb-accent));}
.sfbv3 .sfbv3__ico,
.sfbv3 .sfbv3__toolIconOnly,
.sfbv3 .sfbv3__iconBtn,
.sfbv3 .sfbv3__treeToggle,
.sfbv3 .sfbv3__btn{color: var(--sfb-icon-color);}
.sfbv3 .sfbv3__ico svg{width:100%;height:100%;display:block;fill:currentColor;stroke:currentColor;}

/* Toolbar: always show icons, centered in their boxes */
.sfbv3 .sfbv3__toolIconOnly{display:flex;align-items:center;justify-content:center;}
.sfbv3 .sfbv3__toolIconOnly > *{display:block;line-height:1;}
.sfbv3 .sfbv3__toolIconOnly svg{width:22px;height:22px;}

/* Tree: remove “button” hover box — hover only affects text color */
.sfbv3 .sfbv3__treeLink{background:none;border:none;padding:2px 4px;border-radius:0;text-align:left;cursor:pointer;font-weight:500;}
.sfbv3 .sfbv3__treeItem:hover{background:transparent;}
.sfbv3 .sfbv3__treeItem{border:0;box-shadow:none;}
.sfbv3 .sfbv3__treeItem:hover .sfbv3__treeLink{color:#444;}
.sfbv3 .sfbv3__treeItem.is-active .sfbv3__treeLink{color:#111;font-weight:600;}

/* Tree: improve readability + compact spacing */
.sfbv3 .sfbv3__treeList{gap:2px;}
.sfbv3 .sfbv3__treeItem{min-height:32px;}
.sfbv3 .sfbv3__treeRow{padding:2px 4px;}
.sfbv3 .sfbv3__treeNode--root > .sfbv3__treeItem .sfbv3__treeLink{font-weight:600;}

/* Tree connectors: thicker and darker “L” */
.sfbv3 .sfbv3__treeNode{padding-left:26px;}
.sfbv3 .sfbv3__treeNode::before{left:14px;border-left:2px solid #c4c4c4;}
.sfbv3 .sfbv3__treeNode::after{left:14px;top:16px;width:16px;border-top:2px solid #c4c4c4;}
.sfbv3 .sfbv3__treeNode:last-child::before{bottom:16px;}
.sfbv3 .sfbv3__treeNode--root::before,
.sfbv3 .sfbv3__treeNode--root::after{display:none;}

/* Folder action icons: fixed size matching file icons */
.sfbv3 .sfbv3__treeActions .sfbv3__iconBtn{width:38px;height:38px;padding:0;display:flex;align-items:center;justify-content:center;}
.sfbv3 .sfbv3__treeActions .sfbv3__iconBtn svg{width:18px;height:18px;}

/* File cards: download/delete same size */
.sfbv3 .sfbv3__fileActions .sfbv3__iconBtn{width:38px;height:38px;padding:0;display:flex;align-items:center;justify-content:center;}
.sfbv3 .sfbv3__fileActions .sfbv3__iconBtn svg{width:18px;height:18px;}

/* List mode: keep rows compact & link-like */
.sfbv3.sfbv3--view-list .sfbv3__fileRow a{font-size:10pt;font-weight:400;}
/* === Notion-style tree + toolbar polish (overrides) === */
.sfbv3{font-family:inherit!important;}

/* Toolbar: always show icons, centered */
.sfbv3__toolBtn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:44px!important;
  height:44px!important;
  padding:0!important;
  line-height:1!important;
  color:var(--sfb-accent)!important;
}
.sfbv3__toolBtn svg{
  width:20px!important;
  height:20px!important;
  display:block!important;
  fill:currentColor!important;
}
.sfbv3__toolBarLeft{display:flex!important;align-items:center!important;gap:12px!important;}

/* Tree: compact, no hover background; text hover in elegant dark gray */
.sfbv3__tree{--sfb-tree-hover-text:#333333;}
.sfbv3__treeList{margin:0!important;padding-left:0!important;list-style:none!important;}
.sfbv3__treeList .sfbv3__treeList{
  margin:0!important;
  padding-left:18px!important;
  position:relative!important;
  border-left:0!important;
}
.sfbv3__treeList .sfbv3__treeList::before{
  content:"";
  position:absolute;
  left:8px;
  top:18px;
  bottom:18px;
  width:2px;
  background:rgba(0,0,0,.10);
  border-radius:2px;
}
.sfbv3__treeItem{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:6px 8px!important;
  margin:0!important;
  border-radius:8px!important;
  overflow:visible!important;
}
.sfbv3__treeItem:hover{background:transparent!important;}

.sfbv3__treeLink{
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  background:transparent!important;
  border:0!important;
  padding:0!important;
  cursor:pointer!important;
  color:inherit!important;
  text-align:left!important;
  flex:1 1 auto!important;
  min-width:0!important;
  overflow:visible!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.sfbv3__treeItem:hover .sfbv3__treeLink,
.sfbv3__treeLink:focus{
  color:var(--sfb-tree-hover-text)!important;
  outline:none!important;
}

/* Folder row: keep actions visible even with long names */
.sfbv3__treeActions{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex:0 0 auto!important;
}
.sfbv3__treeActionBtn{
  width:34px!important;
  height:34px!important;
}
.sfbv3__treeActionBtn svg{width:16px!important;height:16px!important;}

/* Connector “L” hint (subtle but visible) */
/* Root level should NOT draw connector stub */
.sfbv3__treeNode[data-sfbv3-depth="0"] > .sfbv3__treeItem::before{display:none!important;}

.sfbv3__treeItem::before{
  content:"";
  width:18px;
  height:2px;
  background:rgba(0,0,0,.12);
  flex:0 0 18px;
}
.sfbv3__treeNode--root > .sfbv3__treeItem::before{background:transparent;}

/* File cards: align icon + text */
.sfbv3__fileMeta{display:flex!important;align-items:center!important;gap:12px!important;}
.sfbv3__fileIcon{flex:0 0 auto!important;}

/* Ensure no global typography override leaks */
.sfbv3, .sfbv3 *{font-family:inherit!important;}

/* ===== v3.33 Final: Tree connectors (single system, no stray left line) =====
   We normalize ALL legacy connector rules and then define the final system:
   - Only nested ULs draw the vertical spine.
   - Only nested LI nodes draw the "L" connector.
   - The root level never draws a spine.
*/

/* 1) Kill legacy connector system (the one that drew a full-height line on every node) */
.sfbv3__treeList{padding-left:0;margin:0;}
.sfbv3__treeNode{padding-left:0;margin:0;}
.sfbv3__treeNode::before,
.sfbv3__treeNode::after,
.sfbv3__treeItem::before{content:none;}

/* 2) Final connector system */
.sfbv3__treeList{list-style:none;display:flex;flex-direction:column;gap:4px;}
.sfbv3__treeList--nested{
  margin-left:26px;
  position:relative;
}

/* Vertical spine for nested lists only */
.sfbv3__treeList--nested{
  border-left:1px solid rgba(0,0,0,.12);
  padding-left:0;
}

/* Each nested child draws its own "L" and trims the spine on last child */
.sfbv3__treeList--nested > .sfbv3__treeNode{position:relative;}
.sfbv3__treeList--nested > .sfbv3__treeNode::after{
  content:"";
  position:absolute;
  left:-1px;
  top:18px;
  width:18px;
  border-top:1px solid rgba(0,0,0,.12);
}
.sfbv3__treeList--nested > .sfbv3__treeNode:last-child::before{
  content:"";
  position:absolute;
  left:-1px;
  top:18px;
  bottom:-2px;
  width:0;
  border-left:1px solid #fff; /* visually cuts the spine below last child */
}


/* v3.35 – Tree controls + Move modal */
.sfbv3__leftTitle{display:flex;align-items:center;justify-content:flex-start;gap:10px;cursor:pointer;user-select:none}
.sfbv3__leftTitleText{font-weight:700}
.sfbv3__rootPill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid rgba(0,0,0,.10);background:#fff;font-weight:600;font-size:12px;line-height:1;color:var(--sfb-accent)}
.sfbv3__rootPill:hover{filter:brightness(.98)}
.sfbv3__rootPill.is-drop{box-shadow:0 0 0 3px rgba(122,13,74,.15)}
.sfbv3__leftTools{display:flex;align-items:center;gap:6px}
.sfbv3__miniTool{border:1px solid rgba(0,0,0,.08);background:#fff;border-radius:8px;width:28px;height:28px;line-height:26px;text-align:center;cursor:pointer;color:var(--sfb-accent);font-weight:600}
.sfbv3__miniTool:hover{background:rgba(0,0,0,.04)}
.sfbv3__miniTool:focus{outline:none;box-shadow:0 0 0 2px rgba(138,31,98,.18)}

/* Move modal layout */
.sfbv3__modalFoot{display:flex;justify-content:flex-end;gap:10px;margin-top:12px}
.sfbv3__toolPrimary{background:var(--sfb-accent);color:#fff;border-color:transparent}
.sfbv3__toolPrimary:hover{filter:brightness(0.96)}

/* Tree connectors: single consistent system (no orphan line) */
.sfbv3__treeList{margin:0;padding:0;list-style:none}
.sfbv3__treeList--nested{margin-left:16px;padding-left:14px;position:relative}
.sfbv3__treeList--nested::before{content:"";position:absolute;left:6px;top:4px;bottom:10px;border-left:2px solid rgba(0,0,0,.12)}
.sfbv3__treeList--nested > .sfbv3__treeNode{position:relative}
.sfbv3__treeList--nested > .sfbv3__treeNode::before{content:"";position:absolute;left:6px;top:18px;width:12px;border-top:2px solid rgba(0,0,0,.12)}
.sfbv3__treeNode--root::before{display:none}

/* v3.37 – Tree overhaul (file-explorer usability)
   - No arrows (expand/collapse via folder icon click)
   - No connector "ASCII art" lines (indent only)
   - Drop highlight for Drag & Drop
*/

/* Kill any older connector systems (several iterations existed) */
.sfbv3 .sfbv3__treeNode::before,
.sfbv3 .sfbv3__treeNode::after,
.sfbv3 .sfbv3__treeList--nested::before{display:none !important;content:none !important;}

.sfbv3 .sfbv3__treeList{margin:0 !important;padding:0 !important;list-style:none !important;}
.sfbv3 .sfbv3__treeList--nested{margin:0 !important;padding:0 0 0 18px !important;}

.sfbv3 .sfbv3__treeItem{
  display:flex;
  align-items:center;
  gap:8px;
  padding:4px 6px;
  border-radius:10px;
  justify-content:flex-start;
}

.sfbv3 .sfbv3__ctxWrap{margin-left:auto;}

/* Active folder highlight (explorer-style) */
.sfbv3 .sfbv3__treeItem.is-active{background:rgba(138,31,98,.08);}
.sfbv3 .sfbv3__treeItem.is-active .sfbv3__treeLink{font-weight:600;}

.sfbv3 .sfbv3__treeIconBtn{
  width:26px;
  height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  color:var(--sfb-accent);
  border-radius:8px;
}
.sfbv3 .sfbv3__treeIconBtn:hover{background:rgba(0,0,0,.04)}
.sfbv3 .sfbv3__treeIconBtn:focus{outline:none;box-shadow:0 0 0 2px rgba(138,31,98,.18)}

/* Folder icon is slightly muted when collapsed (visual hint) */
.sfbv3 .sfbv3__treeItem:not(.is-open) .sfbv3__treeIconBtn{opacity:.92}

/* Folder name behaves like link button */
.sfbv3 .sfbv3__treeLink{font-weight:500;padding:2px 4px;}

/* Drop target highlight */
.sfbv3 .sfbv3__treeItem.is-drop{background:rgba(138,31,98,.08) !important;}

/* File cards/rows: show move/rename/delete on all devices (no hover dependency) */
.sfbv3 .sfbv3__onlyHover{opacity:1 !important;pointer-events:auto !important;}

/* Compact and aligned file action buttons */
.sfbv3 .sfbv3__fileActions{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:10px}
.sfbv3 .sfbv3__iconBtn{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px}
.sfbv3 .sfbv3__iconBtn svg{width:18px;height:18px}

/* Keep link colors stable (avoid visited purple inside widget) */
.sfbv3 a, .sfbv3 a:visited{color:inherit}

