Come up with a style guide, and actual styles, for all builtin widgets, relating to unfocused and disabled states

[davep]

In part prompted by the start of work on #1748: it's time to think about a style guide, and an actual implementation of styles, for interactive Textual widgets in relation to being enabled/disabled and focused/unfocused. The main aims should be that a user of a Textual application can:

• See at a glance which widgets are enabled
• See at a glance which widgets are disabled
• See at a glance which widgets that have their own "cursor" are focused and where the cursor is
• See at a glance which widgets that have their own "cursor" are unfocused and where the cursor is

There should probably be an overlap here too. It would make sense, I think, for a Tree or a DataTable to have no focus, be disabled, but also have content and have a cursor highlighting something; done in a way that it's obvious that it's disabled and not just lacking focus.

Things to consider:

• The styling should be as universal as possible
• It should be possible to theme it (when themes become a thing)
• It should work for both dark and light mode
• It should always be easy for a developer to override it

[davep]

As part of the work on #1748 (see #1785) I've added this to App.DEFAULT_CSS:

    *:disabled {
        opacity: 0.6;
        text-opacity: 0.8;
    }

This actually seems to go a long way to solving the issue for a default :disabled style.

[davep]

See also #1704 which is very much related to this.