Tabs don't work well on small screens. Therefore, when the screen is smaller, it is best to turn the tabs into an accordion view with collapsible blocks.
When something is hidden, it's not there. So basically any pattern that hides something and requires some action to open/expand it is potentially a bad solution.
Accordion on large screens looks questionable more often than not. Users are much more comfortable scrolling through the page looking for information than clicking on the small controllers of the Accordion blocks, looking through each panel in sequence. Terrible pattern.
So on large screens, it's better to expand the accordion panels and show their content immediately without hiding them. Better yet, add a search or table of contents. Or both together. This is a good solution. It makes no sense to save space in height on big screens.
On small screens, both solutions make sense. Content that is immediately shown is always a good thing.
Accordion, on the other hand, is suitable as a solution when you want to show the main thing and it's immediately expanded, but also to show on demand the secondary things that may be of little importance to the user. For example, on a product page: its description is important and should be shown immediately in the Accordion expanded panel. Technical specifications and other less relevant information can be hidden in other panels.
The display of active state in tabs and segments, often raises questions. It can be difficult to understand which segment is currently active.
There are three ways to highlight the active state:
Color is always a good indication of the active state. There is only one trick, if the inactive is not muted, confusion appears. So inactive must be muted. Then highlighting with color the active state always works.
The difference in style with the border, shadow, etc., also helps to make the active one stand out. The difference needs to be really significant.
Sometimes the style has enough difference, but something goes wrong. The logic is simple: the active state should be highlighted, the inactive muted.
And finally, the third way: shape difference. If the shape of the active state is clearly different, it is always a good and unambiguous indicator.