/* HPI — campos base (input/select) e tela Registros.
   ATENÇÃO: a ordem de carregamento (index.php) é a ordem da cascata. Não reordene. */

/* Formulário fixo no topo */
.entry{
  flex-shrink:0;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);
  border-radius:20px;padding:16px;margin-bottom:16px;
}
.fields{display:flex;flex-direction:column;gap:14px}
.input-group{min-width:0;text-align:left}
.input-group label{display:block;color:rgba(255,255,255,.7);font-size:11px;font-weight:600;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}

.glass-input,.glass-select{
  width:100%;height:50px;padding:0 16px;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);border-radius:14px;color:#fff;font-size:16px;
  outline:none;backdrop-filter:blur(10px);transition:all .3s ease;appearance:none;-webkit-appearance:none;
}
.glass-select{
  background-image:url("data:image/svg+xml;utf8,<svg fill='white' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:40px;
}
.glass-select option{background:#14141d;color:#fff}
.glass-input::placeholder{color:rgba(255,255,255,.35)}
.glass-input:focus,.glass-select:focus{border-color:rgba(255,255,255,.4);background-color:rgba(255,255,255,.12);box-shadow:0 0 15px rgba(255,255,255,.1)}
.glass-input.invalid,.glass-select.invalid{border-color:rgba(255,107,107,.7)}

.row-dynamic{display:flex;gap:10px;align-items:flex-end}
.col-facc{flex:1.5}
.col-qtd{flex:1}

.add-btn{
  width:50px;height:50px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);
  border-radius:14px;color:#fff;font-size:24px;display:flex;justify-content:center;align-items:center;
  cursor:pointer;backdrop-filter:blur(10px);transition:all .2s ease;flex-shrink:0;
}
.add-btn:hover{background:rgba(255,255,255,.22)}
.add-btn:active{transform:scale(.92);background:rgba(255,255,255,.25)}

.campo-outros{display:none}
.form-error{display:none;margin-top:12px;color:#ff8a8a;font-size:13px}

/* Registros editáveis: mais recente em cima */
.records-head{flex-shrink:0;color:rgba(255,255,255,.7);font-size:13px;margin:0 4px 10px}
.records{flex:1;min-height:0;overflow-y:auto;list-style:none;padding-bottom:8px}
.records::-webkit-scrollbar{width:4px}
.records::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:4px}
.record{
  padding:14px;margin-bottom:10px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);border-radius:16px;animation:fadeIn .3s ease-in-out;
}
@keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
.rec-fields{display:grid;grid-template-columns:1.5fr 1fr 44px;gap:10px;align-items:center}
.rec-fields .r-tipo,.rec-fields .r-outros{grid-column:1 / -1}
.rec-fields .r-outros{display:none}
.record .glass-select,.record .glass-input{height:44px;min-width:0}
.rec-remove{
  width:44px;height:44px;background:rgba(255,60,60,.15);border:1px solid rgba(255,60,60,.3);
  border-radius:12px;color:#ff6b6b;font-size:20px;line-height:1;cursor:pointer;transition:background .2s;
}
.rec-remove:hover{background:rgba(255,60,60,.28)}
.empty{flex-shrink:0;color:rgba(255,255,255,.4);font-size:14px;text-align:center;padding:24px 0}

/* Salvar todos */
.save-bar{flex-shrink:0;padding:10px 0 16px}
.save-status{color:rgba(255,255,255,.6);font-size:13px;text-align:center;min-height:18px;margin-bottom:8px}
.save-status.error{color:#ff8a8a}
.save-btn{
  width:100%;height:50px;border-radius:14px;border:1px solid rgba(120,200,255,.5);
  background:rgba(0,150,255,.25);color:#fff;font-size:16px;font-weight:600;cursor:pointer;
  backdrop-filter:blur(10px);transition:all .2s ease;
}
.save-btn:hover{background:rgba(0,150,255,.35)}
.save-btn:active{transform:scale(.98)}
.save-btn:disabled{opacity:.4;cursor:default;transform:none}

[hidden]{display:none!important}