/*
 * Description:
 * Inner page-area-breaking overrides. Keep these to a minimum. E.g. to
 * re-color things set by the legacy CSS. Avoid structural changes.
 *
 * Background and rationale:
 * Legacy CSS is linked in _after_ layout and module CSS, so it overrides
 * these. This is done to decrease the risk that the layout and theme
 * styling unintentionally break internals in the inner page area.
 *
 * Additionally, new styling for layout and modules should wrap their content
 * in a class and use the appropriate selectors. That will decrease the risk of
 * the legacy CSS breaking the layout or any module.
 *
 * But, when there are some page body internals that we want to "break", we
 * have this file.
 *
 * 1. If you don't understand potential consequences - don't use it
 * 2. If your styling belongs to a module, put the styling with the module,
 *    nested under a module-specific selector
 * 3. If your styling belongs to the layout theme, put it `style.css`, and
 *    then, if your styling doesn't take effect, keep it in `style.css` but
 *    with a more specific selector (e.g. a layout-related one)
 */
hr      { background-color: var(--primary) !important; }
.red_border { border-color: #999 !important; }  /* neutralise to gray */
.hib               { color: var(--primary); }
.red               { color: var(--primary); }
a.red:link         { color: var(--primary); }
a.red:visited      { color: var(--primary); }
a.red:active       { color: var(--primary); }
a.red:hover        { color: var(--primary); }