/* ============================================================ PRIME ACADEMY GROUP — v6 · REGISTER pag-v6-register-elementor.css — Register's own bridge. Loads after pag-v6-elementor.css and only on Register. Everything here re-points a v6 rule that Elementor's markup stopped matching. Nothing changes the design and nothing restates a v6 value. Every rule was written from a measurement, and the numbers it closes are recorded against it. NOT HERE, DELIBERATELY: the form vocabulary. `.form`, `.field`, `.field--wide`, `.field-hint`, `.consent`, `.form-actions`, `.form-error`, `.select` and `.ilink` moved out of page-contact.css into shared.css on 26 August precisely so this page could use them, and page-register.css says so in its own header — "a second private copy of a form vocabulary is the exact drift the parallel-session rules exist to prevent". What CF7's markup needs to MEET that vocabulary is in §3 below; the vocabulary itself is not repeated. ALSO NOT HERE ANY MORE: the parent theme's `button:hover`/`:focus` fill. That was found on this page — `.pick` turned magenta on hover, #CC3366 with white text, from Hello Elementor's reset — and lived here as §8 until it was answered site-wide as §32 of the shared bridge. §32 now writes the undo across BOTH states, because the theme fires on both, and the restatement across `:hover` and `:focus:not(:hover)` separately, because v6 draws a colour on hover and only an outline on focus. Removed after disabling this file's rules in the browser and re-reading `.pick` and `.back` at rest, on focus and on hover against the design: identical in all three, so the local copy was doing nothing. ============================================================ */ /* ------------------------------------------------------------ 1. THE COURSE BUTTONS `.pick` is a two-column grid — `minmax(0,1fr) 24px` — and v6 places the name and the note in the first column with the arrow spanning both rows of the second: `.pick-go{grid-column:2;grid-row:1/3}`. Each of the three is a widget, so the WRAPPERS were the grid items and auto-placement put them wherever they fell. The note's wrapper landed in the 24px arrow column and wrapped the sentence to 270px tall, against v6's 45, and the arrow sat in the text column because the rule that moves it was matching the span inside a wrapper that had already been placed. .pick 336px -> 120 · step one 1176px -> 482 The wrappers step out of the box tree so the three elements v6 wrote the grid for are the grid items again. ------------------------------------------------------------ */ body.pag-v6 .pick > .elementor-widget, body.pag-v6 .pick > .elementor-widget > .elementor-widget-container{ display:contents; } /* ------------------------------------------------------------ 2. THE PROGRESS RAIL `.rail-item` is a flex row of exactly two spans — the number chip and the label — with `align-items:center` and a gap between them. Both spans are in one Text Editor, which is what keeps them siblings, but that editor's wrapper was the flex child: the two spans became block-level inside it and stacked. .rail-item 52px -> 28 One widget, one rule. The alternative — a widget per span — would have put two boxes between the row and the things it is spacing, and `.rail-item + .rail-item::before`, which draws the hairline between the steps, is written against the ITEMS and would have been unaffected either way. ------------------------------------------------------------ */ body.pag-v6 .rail-item > .elementor-widget-text-editor, body.pag-v6 .rail-item > .elementor-widget-text-editor > .elementor-widget-container{ display:contents; } /* ------------------------------------------------------------ 3. THE RAIL RUNS ACROSS, AND SO DOES EACH STEP IN IT Two of them, one inside the other. v6 writes `
    ` and `
  1. ` and gives both `display:flex` with no direction, so both take the initial `row`. An Elementor container is a flex COLUMN, so the two steps stacked and inside each the number chip stacked above its label. .rail-item 28px -> 62 · .rail 28px -> 136 This is the general rule, and it is the third page it has appeared on — the homepage's `.foot-end`, Contact's `.open-cta`, About's `.rel-links`. Any v6 element that is a flex ROW and becomes a container needs it. Worth checking for by grepping the page's stylesheet for `display:flex` with no `flex-direction` beside it, rather than waiting for a measurement. ------------------------------------------------------------ */ body.pag-v6 .rail, body.pag-v6 .rail-item{ flex-direction:row; } /* AND THE ROW MUST NOT WRAP, AND ITS ITEMS MUST NOT BE FULL WIDTH. Two more defaults of the same kind, and they only showed below 1180 where the panel goes one column. An Elementor container is `flex-wrap:wrap` and gives its children `width:var(--width)` with `--width:100%` — the same shape as §12's `.foot-col` — so each step took the whole row and the second wrapped under the first. v6's `
      ` declares neither: it takes the initial `nowrap`, and its `
    1. `s size to their content. .rail at 600 28px -> 68 · at 390 28px -> 72 Every height above it still matched, because the rail is one row in a block and a taller row just moves what follows. The ladder saw it — +56 and +60 against an expected +16 — and nothing else did. */ body.pag-v6 .rail{ flex-wrap:nowrap; } body.pag-v6 .rail-item{ width:auto; } /* ------------------------------------------------------------ 4. A COURSE NAME HAS TO BE ALLOWED TO WRAP `.pick` is a real `