/* Tab menus and the phone sheet are separate from strip geometry so width logic
   can remain small and the 500-line source cap stays enforced. */

.tabrow-menu {
	position: fixed;
	z-index: var(--z-dock);
	box-sizing: border-box;
	width: min(240px, calc(100vw - 16px));
	max-height: calc(70dvh / var(--ui-scale, 1));
	overflow-y: auto;
	overscroll-behavior: contain;
	display: flex;
	flex-direction: column;
	padding: 5px;
	background: var(--float);
	border: 1px solid var(--line-2);
	border-radius: var(--r-tile);
	box-shadow: var(--depth-float);
}

.tabrow-menu-filter {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	padding: 2px 0 6px;
}

.tabrow-menu-filter-input {
	flex: 1;
	min-width: 0;
	min-height: var(--touch-target);
	padding: 0 9px;
	border: 1px solid var(--line-control);
	border-radius: var(--r-field);
	background: var(--well);
	box-shadow: var(--depth-sunken);
	color: var(--text);
	font-family: var(--font-sans);
	font-size: 16px;
}

.tabrow-menu-filter-input::placeholder {
	color: var(--text-4);
}

.tabrow-menu-rows {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.tabrow-menu-empty {
	padding: 10px;
	color: var(--text-3);
	font-size: 12.5px;
}

.tabrow-menu-head,
.tabrow-menu-label {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 7px 10px 4px;
	color: var(--text-3);
	font-size: 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.tabrow-menu-count {
	margin-left: auto;
	padding: 1px 7px;
	border-radius: var(--r-pill);
	background: var(--well);
	box-shadow: var(--depth-sunken);
	font-family: var(--font-mono);
	font-size: 11px;
	color: var(--text-3);
}

.tabrow-menu-item {
	display: block;
	width: 100%;
	padding: 7px 10px;
	border: 0;
	border-radius: var(--r-sm);
	background: transparent;
	color: var(--text-2);
	font: inherit;
	font-size: 12.5px;
	text-align: left;
	text-decoration: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	cursor: pointer;
}

.tabrow-menu-item:hover,
.tabrow-menu-item:focus-visible {
	background: linear-gradient(180deg, var(--raised-top), var(--raised));
	box-shadow: inset 0 0 0 1px var(--line-2);
	color: var(--text);
}

.tabrow-menu-item[disabled],
.tabrow-menu-item[disabled]:hover {
	background: none;
	box-shadow: none;
	color: var(--text-4);
	cursor: default;
}

.tabrow-menu-sep {
	height: 1px;
	margin: 4px 6px;
	background: var(--line);
}

.tabrow-menu-foot {
	flex-shrink: 0;
	margin-top: 4px;
	padding-top: 4px;
	border-top: 1px solid var(--line);
}

.tabrow-sheet-item {
	min-height: var(--touch-target);
}

.tabrow-sheet-list > .tcg-sheet-colrow:first-child > .tcg-sheet-row {
	border-top: 0;
}

.tabrow-sheet-link {
	flex: 1;
	min-width: 0;
}

.tabrow-sheet-empty {
	padding: 16px 12px;
	color: var(--text-3);
	font-size: 13px;
}

.tabrow-sheet-foot {
	margin-top: 8px;
	border-top: 1px solid var(--line);
	padding-top: 8px;
}

@media (pointer: coarse) {
	.tabrow-menu-item {
		display: flex;
		align-items: center;
		min-height: var(--touch-target);
	}
}

@media (min-width: 1024px) and (pointer: fine) and (not (any-pointer: coarse)) {
	.tabrow-menu-filter-input {
		min-height: 28px;
		font-size: 12.5px;
	}
}