.portal-ai-token-estimator{
  background: rgba(15,23,42,0.85);
  border: 1px solid rgba(148,163,184,0.25);
  border-radius: 16px;
  padding: 16px;
  color: #e5e7eb;
  max-width: 100%;
}

/* Fields row (responsive) */
.portal-ai-token-estimator .pa-te-fields{
  display:flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: flex-start;
}

.portal-ai-token-estimator .pa-te-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin: 10px 0;
}

/* Inside the fields wrapper, keep label ABOVE input so rows can sit next to each other */
.portal-ai-token-estimator .pa-te-fields .pa-te-row{
  flex: 1 1 180px;
  min-width: 160px;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  margin: 0;
}
.portal-ai-token-estimator .pa-te-fields .pa-te-row.pa-te-model{
  flex: 2 1 320px;
  min-width: 240px;
}

.portal-ai-token-estimator .pa-te-label{
  width: 110px;
  flex: 0 0 110px;
  font-size: 13px;
  color:#cbd5e1;
}

.portal-ai-token-estimator .pa-te-fields .pa-te-label{
  width: auto;
  flex: 0 0 auto;
}

.portal-ai-token-estimator .pa-te-input,
.portal-ai-token-estimator .pa-te-select{
  flex: 1 1 auto;
  width: 100%;
  border-radius: 12px;
  border: 1px solid rgba(148,163,184,0.35);
  background: rgba(2,6,23,0.5);
  color: #e5e7eb;
  padding: 10px 12px;
  outline: none;
  font-size: 14px;
}

.portal-ai-token-estimator .pa-te-input:focus,
.portal-ai-token-estimator .pa-te-select:focus{
  border-color: rgba(99,102,241,0.9);
  box-shadow: 0 0 0 3px rgba(99,102,241,0.18);
}

.portal-ai-token-estimator .pa-te-modelbox{
  position: relative;
  width: 100%;
}

.portal-ai-token-estimator .pa-te-model-dropdown{
  position:absolute;
  left:0; right:0;
  top: calc(100% + 8px);
  z-index: 999;
  border-radius: 14px;
  border: 1px solid rgba(148,163,184,0.25);
  background: rgba(2,6,23,0.98);
  overflow:hidden;
}

.portal-ai-token-estimator .pa-te-model-results{
  list-style:none;
  margin:0;
  padding: 6px;
  max-height: 280px;
  overflow:auto;
}

.portal-ai-token-estimator .pa-te-model-results li{
  padding: 10px 10px;
  border-radius: 10px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 8px;
}

.portal-ai-token-estimator .pa-te-model-results li:hover{
  background: rgba(99,102,241,0.20);
}

.portal-ai-token-estimator .pa-te-model-name{
  font-size: 13px;
  color: #e5e7eb;
}

.portal-ai-token-estimator .pa-te-model-meta{
  font-size: 12px;
  color: #94a3b8;
  white-space: nowrap;
}

.portal-ai-token-estimator .pa-te-selected{
  margin-top: 8px;
  display:flex;
  flex-direction: column;
  gap: 6px;
}

.portal-ai-token-estimator .pa-te-selected-price{
  font-size: 12px;
  color:#94a3b8;
}

.portal-ai-token-estimator .pa-te-results{
  margin-top: 12px;
  background: rgba(2,6,23,0.55);
  border: 1px solid rgba(148,163,184,0.18);
  border-radius: 14px;
  padding: 12px;
}

.portal-ai-token-estimator .pa-te-result-line{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  font-size: 13px;
  margin: 6px 0;
}

.portal-ai-token-estimator .pa-te-note{
  margin-top: 10px;
  font-size: 12px;
  color: #93c5fd;
}

@media (max-width: 600px){
  .portal-ai-token-estimator{ max-width: 100%; }
  .portal-ai-token-estimator .pa-te-fields{ gap: 12px; }
  .portal-ai-token-estimator .pa-te-fields .pa-te-row{ min-width: 100%; }
}