/* CapaFácil App — abas de projetos (máximo de 20 por usuário) */
#cf-project-tabs-bar{
  position:relative;
  z-index:90;
  display:flex;
  align-items:flex-end;
  gap:10px;
  flex:0 0 42px;
  min-height:42px;
  padding:5px 12px 0;
  background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%);
  border-bottom:1px solid #d9e0ea;
  box-shadow:0 2px 7px rgba(15,23,42,.05);
  overflow:hidden;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
#cf-project-tabs-bar *{box-sizing:border-box}
.cf-project-tabs-scroll{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  align-items:flex-end;
  gap:4px;
  height:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:thin;
  scrollbar-color:#cbd5e1 transparent;
  overscroll-behavior-x:contain;
}
.cf-project-tabs-scroll::-webkit-scrollbar{height:4px}
.cf-project-tabs-scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}
.cf-project-tab{
  position:relative;
  flex:0 0 auto;
  min-width:148px;
  max-width:230px;
  height:34px;
  display:flex;
  align-items:center;
  border:1px solid #cfd7e3;
  border-bottom-color:#c6cfdb;
  border-radius:10px 10px 0 0;
  background:#e8edf4;
  color:#475569;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
  overflow:hidden;
}
.cf-project-tab:hover{background:#f3f6fa;color:#1f2937;border-color:#bfc9d7}
.cf-project-tab-active{
  height:37px;
  background:#fff;
  color:#111827;
  border-color:#bdc9da;
  border-top:3px solid #2563eb;
  border-bottom-color:#fff;
  box-shadow:0 -2px 9px rgba(37,99,235,.08);
}
.cf-project-tab-open{
  min-width:0;
  flex:1 1 auto;
  height:100%;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 7px 0 10px;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  text-align:left;
  outline:none;
}
.cf-project-tab-open:focus-visible,.cf-project-tab-close:focus-visible,.cf-project-tabs-add:focus-visible{
  outline:2px solid #2563eb;
  outline-offset:-2px;
}
.cf-project-tab-dot{
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:999px;
  background:#94a3b8;
  box-shadow:0 0 0 2px rgba(148,163,184,.15);
}
.cf-project-tab-active .cf-project-tab-dot{background:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,.14)}
.cf-project-tab-name{
  display:block;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:11px;
  font-weight:750;
  letter-spacing:-.01em;
}
.cf-project-tab-close{
  flex:0 0 25px;
  width:25px;
  height:25px;
  margin-right:4px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#94a3b8;
  font-size:17px;
  line-height:1;
  cursor:pointer;
  transition:background .14s ease,color .14s ease;
}
.cf-project-tab-close:hover{background:#fee2e2;color:#dc2626}
.cf-project-tab-unsaved{padding:0 8px 0 10px;gap:7px}
.cf-project-tab-new-badge{
  flex:0 0 auto;
  padding:2px 5px;
  border-radius:999px;
  background:#dbeafe;
  color:#1d4ed8;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.cf-project-tabs-empty{
  align-self:center;
  color:#94a3b8;
  font-size:11px;
  font-weight:650;
  padding:0 8px 7px;
}
.cf-project-tabs-actions{
  flex:0 0 auto;
  height:100%;
  display:flex;
  align-items:center;
  gap:6px;
  padding-bottom:5px;
}
.cf-project-tabs-count{
  min-width:42px;
  padding:5px 7px;
  border:1px solid #d7deea;
  border-radius:8px;
  background:#fff;
  color:#64748b;
  font-size:10px;
  font-weight:850;
  text-align:center;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.cf-project-tabs-add{
  width:29px;
  height:29px;
  border:1px solid #bfd0f7;
  border-radius:8px;
  background:#eaf1ff;
  color:#2563eb;
  font-size:19px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
  transition:background .14s ease,color .14s ease,transform .14s ease;
}
.cf-project-tabs-add:hover:not(:disabled){background:#2563eb;color:#fff;transform:translateY(-1px)}
.cf-project-tabs-add:disabled{opacity:.42;cursor:not-allowed}

/* Os painéis fixos começam abaixo do cabeçalho e da nova barra de abas. */
body:not(.cf-login-screen) #cf-floating-right-panel.cf-right-panel-managed,
body:not(.cf-login-screen) #cf-image-upload-panel{top:98px!important}
@media (max-width:900px){
  body:not(.cf-login-screen) #cf-floating-right-panel.cf-right-panel-managed,
  body:not(.cf-login-screen) #cf-image-upload-panel{top:95px!important}
  #cf-project-tabs-bar{flex-basis:39px;min-height:39px;padding:4px 6px 0;gap:6px}
  .cf-project-tab{min-width:120px;max-width:175px;height:31px}
  .cf-project-tab-active{height:34px}
  .cf-project-tabs-count{display:none}
  .cf-project-tabs-actions{padding-bottom:4px}
}
@media print{#cf-project-tabs-bar{display:none!important}}