/* ==========================================================================
   Protein Isoelectric Point — Tool-specific styles
   Shared Benchling-style framework: tools/common/tbb-sequence-tools.css
   ========================================================================== */

/* ── Input textarea ──────────────────────────────────────────────────────── */
.tbb-protein-iep .tbb-seq-textarea {
	min-height:  160px;
	font-family: var(--tbb-seq-font-mono);
	font-size:   12px;
}

/* ── Options grid ────────────────────────────────────────────────────────── */
.tbb-pi-options {
	display:        flex;
	flex-direction: column;
	gap:            10px;
}

.tbb-pi-option-row {
	display:     flex;
	align-items: center;
	flex-wrap:   wrap;
	gap:         6px;
	font-size:   12px;
	color:       var(--tbb-seq-text);
}

.tbb-pi-option-row label {
	font-weight: 500;
	white-space: nowrap;
}

.tbb-pi-option-row select {
	height:        30px;
	padding:       0 6px;
	border:        1px solid var(--tbb-seq-border);
	border-radius: var(--tbb-seq-radius);
	background:    var(--tbb-seq-bg);
	color:         var(--tbb-seq-text);
	font-size:     12px;
	cursor:        pointer;
	max-width:     240px;
}

.tbb-pi-select--copies { width: 60px; }
.tbb-pi-select--tag    { flex: 1 1 180px; }
.tbb-pi-select--pkset  { width: 140px; }

/* ── Results table ───────────────────────────────────────────────────────── */
.tbb-pi-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.tbb-pi-table {
	width:           100%;
	border-collapse: collapse;
	font-size:       12px;
}

.tbb-pi-table th {
	padding:        6px 12px;
	text-align:     left;
	font-size:      11px;
	font-weight:    600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color:          var(--tbb-seq-text-muted);
	border-bottom:  2px solid var(--tbb-seq-border);
	white-space:    nowrap;
}

.tbb-pi-table th.tbb-pi-th--num { text-align: right; }

.tbb-pi-td {
	padding:        6px 12px;
	border-bottom:  1px solid var(--tbb-seq-surface);
	color:          var(--tbb-seq-text);
	vertical-align: middle;
}

.tbb-pi-td--name { word-break: break-all; }

.tbb-pi-td--num {
	font-family: var(--tbb-seq-font-mono);
	text-align:  right;
	white-space: nowrap;
}

.tbb-pi-td--pi { font-weight: 600; }

/* Acidic pI (< 6) → warm red-orange */
.tbb-pi-pi--acid { color: #c05621; }

/* Basic pI (> 8) → cool blue */
.tbb-pi-pi--base { color: #2b6cb0; }

.tbb-pi-table tbody tr:last-child .tbb-pi-td {
	border-bottom: none;
}

.tbb-pi-table tbody tr:hover .tbb-pi-td {
	background: var(--tbb-seq-surface);
}

/* ── Output pre (copy block) ─────────────────────────────────────────────── */
@media ( min-width: 900px ) {
	.tbb-protein-iep .tbb-seq-output-pre {
		max-height: 400px;
	}
}