/* MARKER: mcp-access-css */
/* Scoped to the MCP Access tool tabs only. Every rule starts with .mcp-access-tab. */

.mcp-access-tab #mcp-access-create-form label {
	display: block;
	margin: 1rem 0 0.35rem;
	font-weight: 600;
}

.mcp-access-tab #mcp-access-create-form label span {
	font-weight: 400;
	opacity: 0.75;
}

.mcp-access-tab #mcp-access-create-form input[type="text"],
.mcp-access-tab #mcp-access-create-form textarea,
.mcp-access-tab #mcp-access-create-form select {
	display: block;
	width: 100%;
	max-width: 32rem;
	box-sizing: border-box;
}

.mcp-access-tab #mcp-access-create-form button {
	margin-top: 1rem;
}

.mcp-access-tab .mcp-access-token-table {
	width: 100%;
	border-collapse: collapse;
	margin: 1rem 0;
}

.mcp-access-tab .mcp-access-token-table th,
.mcp-access-tab .mcp-access-token-table td {
	padding: 0.5rem 0.75rem;
	text-align: left;
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
	vertical-align: top;
}

.mcp-access-tab .mcp-access-token-table th {
	font-weight: 600;
	white-space: nowrap;
}

/* The tool page is a 3-column grid with a 1fr middle track; wide content (code blocks, the 7-column
   table) otherwise stretches that track and clips the right-hand rail. contain: inline-size removes
   this tab's content from the track's intrinsic width. */
.mcp-access-tab {
	min-width: 0;
	max-width: 100%;
	contain: inline-size;
}

.mcp-access-tab pre {
	max-width: 100%;
	overflow-x: auto;
	box-sizing: border-box;
	white-space: pre-wrap;
}

.mcp-access-tab .mcp-access-snippet,
.mcp-access-tab .mcp-access-token-value {
	white-space: pre;
}

/* Both classes sit on the same tab div, so this is a compound selector (no space). As a
   descendant selector it never matched, and the 7-column table ran under the right-hand rail,
   hiding the Revoke buttons. The table now scrolls sideways inside the tab instead. */
.mcp-access-tab.mcp-access-manage {
	overflow-x: auto;
}

.mcp-access-tab code {
	overflow-wrap: anywhere;
}