@font-face{font-family:"Sahel";src:url("/static/fonts/SAHEL.TTF") format("truetype");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Sahel";src:url("/static/fonts/SAHEL-BOLD.TTF") format("truetype");font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:"Sahel";src:url("/static/fonts/SAHEL-BLACK.TTF") format("truetype");font-weight:900;font-style:normal;font-display:swap;}
:root{
  /* Light theme palette (per request) */
  --bg:#F9F9F9;
  --bar:#ECECEC;
  --card:#F3F3F3;
  --text:#111827;
  --muted:#6b7280;
  --border:#5D5D5D;
  --menu:#E3E3E3;
  --shadow:0 10px 25px rgba(0,0,0,.06);
  --accent:#10a37f;
  --danger:#ef4444;
  --chip:#f3f4f6;
  --footer-h:44px;
  --bb-header-h:60px;
  --bb-footer-h:var(--footer-h);
}
html[data-theme="dark"]{
  --bg:#0b0b12;
  --bar:#0f0f18;
  --card:#111124;
  --text:#f3f4f6;
  --muted:#a1a1aa;
  --border:#404052;
  --menu:#181824;
  --shadow:0 12px 30px rgba(0,0,0,.35);
  --accent:#A626A4;
  --danger:#fb7185;
  --chip:#1a1a2f;
}
*{box-sizing:border-box}
body{margin:0;overflow:hidden;background:var(--bg);color:var(--text);}
.bb-voice-timer{font-variant-numeric:tabular-nums;font-weight:900;font-size:12px;color:var(--muted);padding:0 6px;user-select:none;}
.bb-app{min-height:100vh;padding-bottom:var(--footer-h);display:flex;flex-direction:column;}
/* Topbar layout must be consistent in RTL/LTR. Lock container to LTR so left/right are physical. */
.bb-topbar{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid rgba(0,0,0,.08);background:var(--bar);position:sticky;top:0;z-index:10;direction:ltr;}

.bb-top-left,.bb-top-right{display:flex;align-items:center;gap:10px}
.bb-top-mid{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.bb-greeting{font-size:13px;color:var(--muted);text-align:center;max-width:70vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bb-me{font-weight:900;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42vw}
html[dir="rtl"] .bb-top-right{direction:rtl;}
html[dir="rtl"] .bb-top-left{direction:ltr;}

@media (max-width:520px){.bb-me{max-width:60vw;font-size:14px}}

.bb-brand{display:flex;align-items:center;gap:12px}.bb-app-logo{width:38px;height:38px;object-fit:contain;border-radius:10px;border:1px solid var(--border);background:var(--card);}
.bb-title{font-weight:900}.bb-subtitle{color:var(--muted);font-size:12px}
.bb-top-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.bb-user{color:var(--muted);font-size:12px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bb-main{
  display:grid;
  /* lock grid column order; content direction is restored on cards */
  direction:ltr;
  /*
    FIXED layout for BOTH languages:
      Left  : Chat (30%)
      Middle: Media manager (50%)
      Right : Projects (top) + Tasks (bottom) (20%)

    NOTE: We DO NOT rely on rtl/ltr direction for ordering.
  */
  grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(0,2.2fr);
  grid-template-areas:
    "chat files projects";
  gap:8px;
  height:calc(100dvh - var(--bb-header-h) - var(--bb-footer-h));
  padding:8px;
  overflow:hidden;
}

/* Restore text direction inside cards */
html[dir="rtl"] .bb-card{direction:rtl;}
html[dir="ltr"] .bb-card{direction:ltr;}

/* Fixed areas (same in FA/EN) */
.bb-right{grid-area:projects;min-width:0;display:flex;flex-direction:column;gap:12px;overflow:hidden;}
.bb-center{grid-area:files;min-width:0;display:flex;flex-direction:column;overflow:hidden;}
.bb-left{grid-area:chat;min-width:0;display:flex;flex-direction:column;overflow:hidden;}


@media (max-width:1100px){
  /* Mobile / tablet: make stacks full-screen sections with scroll-snap.
     Order: Chat -> Projects(+Tasks button) -> File manager
  */
  .bb-main{
    display:flex;
    flex-direction:column;
    /* Use dynamic viewport height on mobile browsers (Chrome Android)
       so the bottom chatbar remains visible.
    */
    height:calc(100dvh - var(--bb-header-h) - var(--bb-footer-h));
    overflow-y:auto;
    overflow-x:hidden;
    padding:0;
    gap:0;
    scroll-snap-type:y mandatory;
    -webkit-overflow-scrolling:touch;
  }
  .bb-left{order:1;}
  .bb-right{order:2;}
  .bb-center{order:3;}

  .bb-card{
    flex:0 0 auto;
    height:100%;
    min-height:100%;
    scroll-snap-align:start;
    scroll-snap-stop:always;
    border-radius:0;
    border-left:none;
    border-right:none;
  }
  body{overflow:hidden;}
}

/* Stronger active tab styling (used in chat tabs + settings tabs) */
.bb-tab.bb-tab-active,
.bb-btn.bb-tab-active,
.bb-btn-ghost.bb-tab-active{
  background:var(--accent) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 10px 22px rgba(0,0,0,.10);
}

/* File manager toolbar hover/active: subtle gray hover + glow; orange flash on click */
.bb-fm-toolbar .bb-iconbtn:hover{
  background:color-mix(in oklab, var(--chip) 70%, transparent);
  box-shadow:0 10px 18px rgba(0,0,0,.10);
  filter:brightness(1.03);
}
.bb-fm-toolbar .bb-iconbtn:active{
  background:color-mix(in oklab, var(--warn) 60%, var(--chip)) !important;
  color:#111;
}

.bb-card{background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:10px;display:flex;flex-direction:column;min-height:0;overflow:hidden;}
.bb-card-title{font-weight:800;margin-bottom:10px}.bb-row{display:flex;gap:8px;margin:8px 0}
.bb-list{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto;padding:4px}
.bb-item{padding:10px;border:1px solid var(--border);border-radius:12px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;background:transparent;}
.bb-item:hover{background:var(--chip)}.bb-item.active{outline:2px solid color-mix(in oklab, var(--accent) 40%, transparent);}
.bb-input,.bb-select{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:transparent;color:var(--text);}
.bb-btn{border:none;border-radius:12px;padding:10px 12px;cursor:pointer;background:var(--accent);color:#fff;font-weight:800;}
.bb-btn-wide{width:100%}.bb-btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border);font-weight:800;}
.bb-btn-danger{background:transparent;color:var(--danger);border:1px solid color-mix(in oklab,var(--danger) 50%, var(--border));font-weight:900;}
.bb-iconbtn{width:40px;height:40px;border-radius:12px;border:1px solid var(--border);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;display:inline-flex;align-items:center;justify-content:center;}
.bb-iconbtn:hover{background:var(--chip)}.bb-iconbtn.bb-danger{color:var(--danger);border-color:color-mix(in oklab,var(--danger) 50%, var(--border));}
.bb-filecard{display:flex;flex-direction:column;height:100%}.bb-filebar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.bb-filenav{display:flex;gap:8px}.bb-breadcrumb{color:var(--muted);font-size:12px;flex:1;min-width:120px}
.bb-file-actions{display:flex;gap:8px;flex-wrap:wrap}.bb-filetools{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}

/* File manager: one-line toolbar (actions + filter + sort) */
.bb-fm-toolbarline{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:nowrap;}
.bb-fm-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;overflow-x:auto;min-width:0;flex:1;}
.bb-fm-toolbar::-webkit-scrollbar{height:6px}
.bb-fm-sorts{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;flex:0 0 auto;}

/* Breadcrumb + search row */
.bb-fm-breadline{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;
  padding:8px 10px;border:1px solid var(--border);border-radius:14px;background:color-mix(in oklab,var(--card) 90%, transparent);
}
.bb-fm-nav{display:flex;align-items:center;gap:8px;flex:1;min-width:0;}
.bb-crumb{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* Collapsible search: half space, opens on icon click */
#fileSearchWrap.bb-fm-search{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:1;min-width:0;}
#fileSearchWrap.bb-fm-search input{
  width:0;
  max-width:0;
  padding:0;
  border:0;
  opacity:0;
  pointer-events:none;
  transition:width .18s ease, max-width .18s ease, opacity .18s ease, padding .18s ease;
}
#fileSearchWrap.bb-fm-search.expanded input,
#fileSearchWrap.bb-fm-search input:not(:placeholder-shown){
  width:100%;
  max-width:320px;
  padding:10px 12px;
  border:1px solid var(--border);
  opacity:1;
  pointer-events:auto;
}

@media (max-width:700px){
  .bb-fm-toolbarline{flex-wrap:wrap;}
  .bb-fm-sorts{width:100%;justify-content:flex-start;}
  .bb-fm-breadline{flex-wrap:wrap;}
  #fileSearchWrap.bb-fm-search{width:100%;justify-content:flex-start;}
  #fileSearchWrap.bb-fm-search.expanded input,
  #fileSearchWrap.bb-fm-search input:not(:placeholder-shown){max-width:100%;}
}

@media (max-width:520px){
  .bb-iconbtn{width:36px;height:36px;border-radius:12px;}
  .bb-fm-toolbar{flex-wrap:wrap;overflow-x:visible;}
  .bb-fm-sorts{flex-wrap:wrap;}
}

/* Tasks toggle button (orange, animated) */
.bb-task-toggle{
  background:#f97316;
  color:#fff;
  border:none;
  border-radius:14px;
  padding:12px 14px;
  font-weight:900;
  cursor:pointer;
  position:relative;
  overflow:hidden;
}
.bb-task-toggle:before{
  content:"";
  position:absolute;
  top:-40%;
  left:-60%;
  width:60%;
  height:180%;
  background:rgba(255,255,255,.22);
  transform:rotate(18deg);
  animation:bbshine 2.3s ease-in-out infinite;
}
@keyframes bbshine{0%{left:-60%}60%{left:140%}100%{left:140%}}
.bb-dropzone{border:1px dashed var(--border);border-radius:14px;
  padding:18px 12px 12px; /* more top space so border isn't glued to toolbar */
  flex:1;min-height:0;overflow:auto;
}
.bb-dropzone.dragover{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 10%, transparent);}
.bb-empty{display:none;min-height:100%;height:100%;width:100%;align-items:center;justify-content:center;flex-direction:column;gap:10px;text-align:center;color:var(--muted);
  /* center in the EMPTY content zone only */
  pointer-events:auto;
}
.bb-empty-icon{font-size:42px;line-height:1;color:var(--accent);opacity:.65}
.bb-empty-text{font-size:14px}
.bb-dropzone.is-empty .bb-empty{display:flex;}
.bb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;}
@media (max-width:520px){.bb-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
.bb-file{position:relative;border:1px solid var(--border);border-radius:14px;padding:10px;cursor:pointer;display:flex;flex-direction:column;gap:8px;background:transparent;}
.bb-file:hover{background:var(--chip)}.bb-file.selected{outline:2px solid color-mix(in oklab,var(--accent) 45%, transparent);}
.bb-file-ico{font-size:22px}.bb-file-name{font-weight:800;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bb-file-meta{color:var(--muted);font-size:11px}
.bb-table{width:100%}.bb-table .row{display:grid;grid-template-columns:32px 1fr 90px 140px;gap:10px;padding:10px;border-bottom:1px solid var(--border);align-items:center;}
.bb-table .row.header{color:var(--muted);font-size:12px;font-weight:900}
.bb-table .row:hover{background:var(--chip)}.bb-table .row.selected{outline:2px solid color-mix(in oklab,var(--accent) 45%, transparent);}
.bb-chatcard{display:flex;flex-direction:column;height:100%}.bb-chathead{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.bb-tabs{display:flex;gap:8px}.bb-tab{padding:8px 10px;border-radius:12px;border:1px solid var(--border);background:transparent;cursor:pointer;color:var(--text);font-weight:900;}
.bb-tab-active{background:color-mix(in oklab,var(--accent) 22%, var(--chip));border-color:color-mix(in oklab,var(--accent) 35%, var(--border));}
.bb-chatbox{flex:1;min-height:0;overflow:auto;border:1px solid var(--border);border-radius:14px;padding:10px;background:var(--card2);}
.bb-msg{margin:10px 0;display:flex;flex-direction:column;gap:6px}.bb-bubble{max-width:90%;padding:10px 12px;border-radius:14px;border:1px solid var(--border);background:var(--chip);white-space:pre-wrap;word-break:break-word;}
.bb-msg.me{
  align-items:flex-end;
  margin-inline-start:auto;
  margin-inline-end:0;
  margin-left:0;
  margin-right:0;
}
.bb-msg.other{
  align-items:flex-start;
  margin-inline-end:auto;
  margin-inline-start:0;
  margin-left:0;
  margin-right:0;
}
.bb-msg.me .bb-bubble{background:color-mix(in oklab,var(--accent) 18%, var(--chip));border-color:color-mix(in oklab,var(--accent) 25%, var(--border));}
.bb-msg-meta{color:var(--muted);font-size:11px;display:flex;gap:8px}
.bb-msg-meta-bottom{margin-top:-2px;opacity:.95;align-items:center}
.bb-meta-sep{opacity:.5}
.bb-ticks{font-weight:900}
.bb-ticks-read{color:var(--accent)}
.bb-chat-toolbar{display:flex;gap:8px;margin-top:10px}.bb-chat-actions{display:flex;gap:10px;align-items:center;justify-content:flex-start;flex-wrap:nowrap;}
.bb-cachebar{display:flex;gap:8px;margin-top:10px;flex-wrap:nowrap;align-items:center;overflow-x:auto;padding-bottom:2px}
.bb-cachebar::-webkit-scrollbar{height:6px}
.bb-dragbtn.active{outline:2px solid color-mix(in oklab,var(--danger) 40%, transparent);}
.bb-modal{position:fixed;inset:0;z-index:50}.bb-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.4);}
.bb-modal-card{position:relative;margin:8vh auto;max-width:980px;width:calc(100% - 24px);background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);padding:14px;max-height:72vh;overflow:auto;}
.bb-modal-title{font-weight:900;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.bb-close{cursor:pointer;border:1px solid var(--border);background:transparent;border-radius:12px;width:40px;height:40px;}
.bb-close:hover{background:var(--chip)}
.bb-context{position:fixed;z-index:60;min-width:220px;background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);padding:6px;display:none;}
.bb-citem{padding:10px;border-radius:12px;cursor:pointer;font-weight:800}.bb-citem:hover{background:var(--chip)}
.bb-csep{height:1px;background:var(--border);margin:6px 4px;}
.bb-footer{height:34px;display:flex;align-items:center;justify-content:center;gap:10px;color:var(--muted);border-top:1px solid var(--border);background:var(--bg);position:sticky;bottom:0;}
.bb-footer-fixed{position:fixed;left:0;right:0;bottom:0;z-index:20;}
.bb-footer-inner{height:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:0 12px;}
.bb-footer-logo{width:22px;height:22px;object-fit:contain;opacity:.9}
.bb-auth{min-height:100vh;padding-bottom:var(--footer-h);}
.bb-auth-wrap{min-height:calc(100vh - 34px);display:flex;align-items:center;justify-content:center;padding:24px;}

.bb-auth-card{width:min(440px,100%);background:var(--card);border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);padding:18px;}
.bb-auth-brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:10px}
.bb-auth-logo{width:74px;height:74px;object-fit:contain;border-radius:18px;border:1px solid var(--border);background:var(--chip);}
.bb-auth-title{font-weight:900;font-size:22px}.bb-auth-sub{color:var(--muted);font-size:12px}
.bb-auth-actions{display:flex;gap:8px;justify-content:center;margin-top:10px}
.bb-auth-meta{color:var(--danger);font-size:12px;text-align:center;margin-top:8px}

.bb-brand img,.bb-app-logo{flex:0 0 auto;}

@media (max-width:520px){.bb-topbar{flex-wrap:wrap;gap:10px}.bb-top-left{width:100%;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start}.bb-brand{margin-inline-start:auto}}

.bb-footer{position:fixed;bottom:0;left:0;right:0;height:var(--footer-h);background:var(--bg);border-top:1px solid var(--border);z-index:20}
.bb-footer-inner{height:100%;display:flex;align-items:center;justify-content:center;gap:10px;color:var(--muted);font-size:12px}
.bb-footer-logo{width:18px;height:18px;object-fit:contain}
.bb-page{min-height:100vh;display:flex;flex-direction:column;padding-bottom:var(--footer-h)}

.bb-auth-card{max-width:520px;width:100%;}
.bb-auth-head{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:10px;}
.bb-auth-logo{width:72px;height:72px;object-fit:contain;flex:0 0 auto;border-radius:18px;border:1px solid var(--border);background:var(--card);}
.bb-auth-titles{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;}
.bb-auth-title{font-size:26px;font-weight:950;letter-spacing:.2px;}
.bb-auth-sub{font-size:12px;color:var(--muted);font-weight:700;}
.bb-auth-tag{font-size:12px;color:var(--muted);font-weight:800;}
.bb-form label{display:block;margin-top:10px;margin-bottom:6px;font-weight:800;color:var(--text);}
.bb-auth-actions{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:14px;}

/* Login animations */
@keyframes bbFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes bbPop{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}

/* ---------- Login page layout + animations ---------- */
.bb-auth-wrap{padding:28px}
.bb-auth-card{padding:24px;border-radius:24px}
.bb-auth-head-col{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:14px}
.bb-auth-logo{width:86px;height:86px;border-radius:22px}
.bb-auth-title{margin-top:2px}
.bb-auth-form{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.bb-auth-form .bb-input{min-height:44px}
.bb-auth-form .bb-btn{min-height:44px}

/* Enter animations: logo fades in, fields slide from L/R */
body.bb-enter .bb-auth-logo{animation:bbPop .55s ease both}
body.bb-enter .bb-auth-title,body.bb-enter .bb-auth-sub,body.bb-enter .bb-auth-sub2{animation:bbFadeUp .45s ease both}
body.bb-enter .bb-auth-form .bb-label:nth-of-type(1),
body.bb-enter .bb-auth-form .bb-input:nth-of-type(1){animation:bbSlideInL .5s ease both}
body.bb-enter .bb-auth-form .bb-label:nth-of-type(2),
body.bb-enter .bb-auth-form .bb-input:nth-of-type(2){animation:bbSlideInR .5s ease both;animation-delay:.06s}
body.bb-enter .bb-auth-form #loginBtn{animation:bbFadeUp .45s ease both;animation-delay:.12s}

@keyframes bbSlideInL{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:translateX(0)}}
@keyframes bbSlideInR{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:translateX(0)}}
.bb-auth-card{animation:bbFadeUp .35s ease both}
.bb-auth-logo{animation:bbPop .45s ease both}
.bb-form label,.bb-form input,.bb-form .bb-auth-actions{animation:bbFadeUp .4s ease both}
.bb-form label{animation-delay:.05s}
.bb-form input{animation-delay:.12s}
.bb-auth-actions{animation-delay:.18s}

/* (removed legacy order-based responsive rules; we use grid areas instead) */

/* (legacy duplicate blocks removed) */

/* Switch (left/right) */
.bb-switch{position:relative;display:inline-block;width:74px;height:38px}
.bb-switch input{opacity:0;width:0;height:0}
.bb-slider{position:absolute;cursor:pointer;inset:0;background:var(--chip);border:1px solid var(--border);border-radius:999px;transition:.2s}
.bb-slider:before{position:absolute;content:"";height:30px;width:30px;left:4px;top:3px;background:var(--card);border:1px solid var(--border);border-radius:999px;transition:.2s;box-shadow:var(--shadow)}
.bb-slider:after{content:attr(data-left);position:absolute;left:12px;top:50%;transform:translateY(-50%);font-weight:900;font-size:12px;color:var(--muted);transition:.2s}
.bb-switch input:checked + .bb-slider:before{transform:translateX(36px)}
.bb-switch input:checked + .bb-slider:after{content:attr(data-right);left:42px}
.bb-switch input:checked + .bb-slider{
  background:color-mix(in oklab, var(--accent) 20%, var(--chip));
  border-color:color-mix(in oklab, var(--accent) 40%, var(--border));
}
.bb-switch input:checked + .bb-slider:before{
  border-color:color-mix(in oklab, var(--accent) 45%, var(--border));
}

/* Chat input row */
.bb-chatbar{display:flex;align-items:center;gap:10px;padding:8px 10px;border-top:1px solid var(--border)}
.bb-chatbar .bb-input{flex:1;min-width:0}
.bb-send{width:44px;height:44px;border-radius:16px}

/* Voice button states (orange=recording, blue=paused) */
#voiceBtn.recording{border-color:#ff8a00;background:color-mix(in oklab,#ff8a00 18%, var(--chip));}
#voiceBtn.paused{border-color:#2b7bff;background:color-mix(in oklab,#2b7bff 14%, var(--chip));}

/* Context menu (projects) */
.bb-ctx{position:fixed;z-index:9999;min-width:220px;background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.18);padding:8px;backdrop-filter:blur(6px)}
.bb-ctx-item{width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid transparent;background:transparent;color:var(--text);cursor:pointer;font-weight:800;}
.bb-ctx-item:hover{background:color-mix(in oklab,var(--accent) 10%, var(--chip));border-color:color-mix(in oklab,var(--accent) 30%, var(--border));}
.bb-ctx-item:active{transform:scale(.99)}
.bb-ctx-item i{width:18px;text-align:center;color:var(--muted)}

/* Hover/highlight for buttons */
.bb-iconbtn:hover,.bb-btn:hover,.bb-tab:hover{filter:brightness(0.98)}
.bb-iconbtn:active,.bb-btn:active,.bb-tab:active{transform:scale(.99)}

/* Tabs selected */
.bb-tab-active{background:color-mix(in oklab,var(--accent) 25%, var(--chip));border-color:color-mix(in oklab,var(--accent) 35%, var(--border));}

/* Settings tabs hover */
.bb-tabs .bb-tab:hover{background:color-mix(in oklab,var(--accent) 10%, var(--chip));}


/* ===== BB_FIX7 1770713425 ===== */
.bb-main{gap:12px;}
.bb-card{border-radius:22px;}
.bb-card{padding:12px;}
.bb-card .bb-card-body{padding:12px;}
.bb-btn, .bb-iconbtn, .bb-tab{transition:transform .12s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;}
.bb-btn:hover, .bb-iconbtn:hover, .bb-tab:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.08);}
.bb-btn:active, .bb-iconbtn:active, .bb-tab:active{transform:translateY(0);box-shadow:0 3px 10px rgba(0,0,0,.08);}
.bb-tab.bb-tab-active{background:var(--primary);color:#fff;border-color:transparent;}
.bb-iconbtn.bb-searchbtn{width:40px;height:40px;border-radius:14px;}
.bb-chat-toprow{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.bb-chat-tabs{display:flex;gap:8px;align-items:center;}
.bb-checkrow{display:flex;align-items:center;gap:10px;font-size:14px;}
.bb-checkrow input{accent-color:var(--primary);}
.bb-btn-ghost{background:transparent;}
.bb-btn-ghost:hover{background:rgba(0,0,0,.04);}
[data-theme="dark"] .bb-btn-ghost:hover{background:rgba(255,255,255,.06);}

/* voice colors */
#voiceBtn.recording{background:#ff8a00;border-color:#ff8a00;color:#fff;}
#voiceBtn.paused{background:#2b6fff;border-color:#2b6fff;color:#fff;}
#attachBtn.cancel{background:#ff3b30;border-color:#ff3b30;color:#fff;}

/* chat alignment - always based on sender, not language */
.bb-msg{display:flex;}
.bb-msg.me{justify-content:flex-end;}
.bb-msg.other{justify-content:flex-start;}
.bb-bubble{max-width:min(560px, 82%);}

/* Keep bubble alignment stable in RTL languages */
.bb-chatbox{direction:ltr;}
.bb-bubble{direction:auto;}

/* file manager header layout: toolbar row + crumb/search row */
.bb-file-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.bb-file-toolbar .bb-spacer{flex:1 1 auto;}
.bb-crumbrow{display:flex;gap:10px;align-items:center;margin-top:10px;}
.bb-crumb{flex:1 1 50%;min-width:0;border:1px solid var(--border);border-radius:16px;padding:10px;background:var(--card);}
.bb-file-search{flex:1 1 50%;min-width:0;}
.bb-file-search input{width:100%;}
.bb-drop{margin-top:14px;padding-top:18px;} /* extra padding from toolbar */

/* tasks button full width under projects */
#openTasksBtn{width:100%;}

/* mobile: sectioned full-screen stacks with internal scroll */
@media (max-width: 900px){
  .bb-main{scroll-snap-type:y mandatory;}
  .bb-main{display:flex;flex-direction:column;gap:14px;}
  .bb-left{order:1}
  .bb-right{order:2}
  .bb-center{order:3}
  .bb-left{order:1;}
  .bb-right{order:2;}
  .bb-mid{order:3;}
  .bb-taskwrap{order:4;}
  .bb-card{height:calc(100dvh - 110px);scroll-snap-align:start;}
  .bb-card-body{height:100%;display:flex;flex-direction:column;}
  .bb-card-body .bb-scroll{flex:1 1 auto;overflow:auto;}
}

/* fm breadline split */
.bb-fm-breadline{display:flex;gap:10px;align-items:center;}
.bb-fm-nav{flex:1 1 50%;min-width:0;}
.bb-fm-search{flex:1 1 50%;min-width:0;}
.bb-fm-search input{width:100%;}
.bb-dropzone{margin-top:14px;padding-top:18px;}


.bb-btn.bb-btn-active{background:var(--accent);color:#fff;border-color:transparent;}
.bb-btn.bb-btn-ghost:hover{background:rgba(0,0,0,.06);}

#voiceBtn.recording, .bb-iconbtn.recording{background:rgba(255,140,0,.25);border-color:rgba(255,140,0,.45);}
#voiceBtn.paused, .bb-iconbtn.paused{background:rgba(0,120,255,.18);border-color:rgba(0,120,255,.45);}

/* icon button hover/click */
.bb-iconbtn:hover{background:rgba(0,0,0,.06);box-shadow:0 6px 14px rgba(0,0,0,.08);filter:brightness(0.98);}
.bb-iconbtn:active{background:rgba(255,140,0,.35);}
[data-theme="dark"] .bb-iconbtn:hover{background:rgba(255,255,255,.08);box-shadow:0 6px 14px rgba(0,0,0,.35);filter:brightness(1.06);} 
[data-theme="dark"] .bb-iconbtn:active{background:rgba(255,140,0,.25);} 

/* =============================
   INLINE TOASTS (PER-STACK)
============================= */
.bb-inline-toast{
  margin: 8px 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(6px);
  font-size: 13px;
}
