
.toolbar {
  display: flex;
  align-items: center;
  gap: 15px; /* Adicionei um espaçamento, ajuste se necessário */
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.toolbar .upload {
  margin-left: auto; /* Esta é a linha mágica que empurra o upload para a direita */
}
.search-wrap{
  position: relative;
  margin-right: auto; 
  display: inline-flex;
  align-items: center;
}

.toolbar select#lpp.lpp-select{
      padding: 8px 36px 8px 10px !important; /* espaço pra setinha */
      border: 1px solid var(--glass-border) !important;
      border-radius: var(--radius) !important;
      background: var(--glass) no-repeat right 10px center !important;
      color: var(--text) !important;
      font-size: var(--font) !important;
      backdrop-filter: blur(20px);
      outline: none;
      cursor: pointer;
      }
    .toolbar select#lpp.lpp-select:hover{ background-color: var(--glass) !important; }

.search-input{
  width: 300px;
  padding: 10px 34px 10px 10px; /* padding à direita para o ícone */
  background: var(--glass-border);
  color: var(--text);
  border: 1px solid #8e8f9170;
  border-radius: var(--glass-border);
  outline: none;
  font-size: 12px;
}
.search-input::placeholder{ color:var(--text); }

.search-icon,
.clear-btn{
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  color: var(--text);
}

.search-icon{ pointer-events: none; }

.clear-btn{
  display: none;
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--text);
  font-size: var(--font);
}
.clear-btn:hover{ color:var(--text); opacity: 0.9;}
    
    table{ width:auto; border-collapse:separate; border-spacing:0 5px; }
    thead th{ text-align:left; padding:10px; font-size:var(--font); letter-spacing:1px; }

    tbody tr{
      background: var(--dashboard-bg); border:10px solid var(--glass-border); backdrop-filter:var(--glass-blur);
      font-size:var(--font); letter-spacing:1px; transition:background .25s; cursor:pointer; color: var(--text)!important; 
    }
    tbody tr:hover, tbody tr:hover td a,
    tbody tr:hover td i,
    tbody tr:hover td .prog-text{ background:var(--glass-bg2); box-shadow: var(--shadow2); }
    tbody td{ padding:12px 18px; color: var(--text);  } 
    tbody td:first-child{ border-top-left-radius:var(--radius); border-bottom-left-radius:var(--radius);}
    tbody td:last-child{ border-top-right-radius:var(--radius); border-bottom-right-radius:var(--radius); }  

    td.actions{ text-align:left; white-space:nowrap; }

    .usage{ display:flex; align-items:center; gap:10px; width: 5px;}
    .prog{position:relative; flex:1 1 auto; height:30px; min-width:40px;background:rgba(255,255,255,0.08); border:1px solid var(--glass-border);
      border-radius:var(--radius); overflow:hidden;
    }
    .prog:hover{color: var(--text);}
    .prog-bar{ position:absolute; left:0; top:0; bottom:0; width:0; transition:width .4s ease; }    
    .prog-text{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
      font-size:var(--font); letter-spacing:.5px; color:var(--text); pointer-events:none; }   

    .ok .prog-bar{   background:linear-gradient(90deg, rgba(146, 216, 176, 0.9), rgba(139, 211, 170, 0.6)); }
    .warn .prog-bar{ background:linear-gradient(90deg, rgba(255,159,46,.95), rgba(255,159,46,.6)); }
    .bad .prog-bar{  background:linear-gradient(90deg, rgba(201, 103, 103, 0.95),  rgba(172, 59, 59, 0.6)); }

    .pagination{ display:flex; gap:10px; align-items:center; justify-content:center; margin: 18px 10px 15px;}
    .page-btn{
      font-size: var(--font); padding:6px 16px; background: var(--glass);
      border:1px solid var(--glass-border); border-radius: var(--radius); color: var(--text);
      cursor:pointer; transition: background .2s; text-decoration:none; user-select:none;
    }
    .page-btn:hover{ background-color: var(--botao-azul); opacity: 0.9; color: var(--text2);}
    .page-btn.selected{ background-color: var(--botao-azul); opacity: 0.9; color: var(--text2);}
    .page-btn.disabled{ background: var(--botao-azul); pointer-events:none; cursor:default; opacity:0.5; color: var(--text2);}

    

    .lpp-select{padding:8px; border:1px solid var(--glass); border-radius:var(--radius); width: 120px;background-color:var(--glass-hover); color:var(--text); 
      font-size:var(--font); backdrop-filter:blur(20px); outline:none;
    }
    
    .lpp-label{ font-size:var(--font); opacity:.9;}

    /* Alguns browsers pintam <option> com cor própria */
    #lpp.lpp-select option{ color: var(--text3); }
    
    tr.is-editing input[type="text"] {
      width: 100%;                 /* Ocupa todo o espaço da célula */
      box-sizing: border-box;      /* Faz com que a borda e o padding não aumentem o tamanho total */
      border: 1px solid #007bff;   /* Borda azul sutil para indicar que está editando */
      padding: 4px;                /* Um pequeno preenchimento interno */
      font-size: inherit;          /* Usa o mesmo tamanho de fonte da tabela */
      font-family: inherit;      /* Usa a mesma família de fonte da tabela */
      background-color: #f0f8ff; /* Fundo levemente azulado para destacar */
      border-radius: 4px;
    }

    .filter-wrap{
      display: flex;
      align-items:center;
      align-items: center; gap: 15px      
    }

    .lpp-select2{padding:8px; border:1px solid var(--glass); border-radius:var(--radius); width: 120px;background-color:var(--glass-hover); color:var(--text); 
      font-size:var(--font); backdrop-filter:blur(20px); outline:none;
    }
    .lpp-select2 option{
      background-color: var(--dashboard-bg); color: var(--text3);
    }

