/* Targeted visual adjustments after the upgrade to PrimeFaces 15.
   The compiled theme.css (primefaces-thab) is left untouched -- its Sass
   sources are not in the repo. */

/* p:selectManyCheckbox: PF 13 rendered layout="grid" as a table (label
   below the box). PF 15 renders layout="responsive" as a ui-grid, whose
   ui-g-12 cells layout-thab.css turns into flex containers, which moves box
   and label next to each other. Put the cell back to block and the label
   below the box -- that gives the old appearance. */
.ui-selectmanycheckbox.ui-grid .ui-g-12 {
    display: block;
}
.ui-selectmanycheckbox.ui-grid label {
    display: block;
    margin-top: 2px;
}

/* The SSO link on the login page is an <a> styled as a button (see
   user-login.xhtml). inline-block so the margin below it takes effect at all,
   and room between it and the separator that starts the external-accounts
   block -- the two sat directly on top of each other.

   Qualified with "body .ui-button" on purpose: the theme sets
   "body .ui-button { margin: 0 }", which outranks a bare class selector, so
   a plain .btn-login-oidc rule would be ignored. */
body .ui-button.btn-login-oidc {
    display: inline-block;
    margin-bottom: 1.5em;
}

/* ... and the same link needs its hover and pressed state spelled out. The
   theme hangs both off a CLASS, not a pseudo-class: "body .ui-button
   .ui-state-hover" / ".ui-state-active". PrimeFaces' button widget adds and
   removes those classes from JavaScript on mouseenter/mousedown - the SSO
   link has no widget behind it, so nothing ever sets them and the link stayed
   completely inert while the Anmelden button next to it changed colour.

   The colours are copied from theme.css (lines 1895 and 1907), because the
   compiled theme is off limits - its Sass sources are not in the repo. If the
   theme colours ever change, these two have to follow. The transition comes
   from the base .ui-button rule, so the fade is identical. */
body .ui-button.btn-login-oidc:hover {
    background-color: #808181;
    border-color: #808181;
    color: #ffffff;
}

body .ui-button.btn-login-oidc:active {
    background-color: #0772b3;
    border-color: #0772b3;
    color: #ffffff;
}

/* Label and input on one line on the login page. .ui-g is display:flex with no
   align-items, so the default "stretch" applies: each cell grows to the row
   height and the label ends up at the top of its cell while the taller input
   sits beside it. Centring the row puts the two on the same line. */
.login-field-row {
    align-items: center;
}

/* PrimeFaces 15 turns every DataTable into a grid widget: the cells carry a
   tabindex and components.css gives the focused one an outline

       .ui-datatable-data td[role="gridcell"]:focus { outline: 2px solid ... }

   A plain click therefore leaves a blue frame around the clicked cell, which
   reads like a selection. Nothing here is selectable - no table in the project
   uses selectionMode, and there is no cell editor.

   Only the mouse case is taken away. :focus-visible still matches when the
   cell is reached with Tab or the arrow keys, so the keyboard navigation PF
   installs keeps its focus indicator - removing that outright would leave
   keyboard users without any idea where they are. "body" is needed because
   the rule in components.css counts three classes and would otherwise win. */
body .ui-datatable-data td[role="gridcell"]:focus:not(:focus-visible),
body .ui-datatable-data td[role="grid"] [tabindex="0"]:focus:not(:focus-visible) {
    outline: none;
}