/*
 * ProCert Registry site styles (LWR). Theme lane, 2 Oct 2026. Decisions and reasoning: docs/procert-site-theme.md.
 * Values here are the ProCert layer; component colours come from brandTokens + procertTokens.
 */

/* ── Fonts. The bundle loaded none, so Sansation and Roboto fell back to whatever each visitor had installed.
   The files are the portal's existing static resources, which guests can reach on this domain. ── */
@font-face { font-family: 'Roboto'; src: url('/sfsites/c/resource/robotoFonts/fonts/Roboto-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('/sfsites/c/resource/robotoFonts/fonts/Roboto-Italic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('/sfsites/c/resource/robotoFonts/fonts/Roboto-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Roboto'; src: url('/sfsites/c/resource/robotoFonts/fonts/Roboto-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Sansation'; src: url('/sfsites/c/resource/portalFonts/fonts/Sansation-Regular.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Sansation'; src: url('/sfsites/c/resource/portalFonts/fonts/Sansation-Bold.woff') format('woff'); font-weight: 700; font-style: normal; font-display: swap; }

/* Salesforce's own components read this variable. html:root outranks the generated :root block. */
html:root {
    --dxp-g-root-font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif;
}

/* ── Page ── */
html,
body {
    height: 100%;
    background: #F0F1F2;   /* --mp-page-bg on ProCert (procertTokens) */
}
body {
    margin: 0;
    font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif;
    color: #000136;        /* --mp-text */
}

/* ── Header: Navy Dark, the ProCert marker (procert-site-theme.md; reconfirmed by Tom 3 Oct 2026).
   procertTopbar paints the bar itself once placed in Builder; this rule colours the stock header region behind
   it, and the stock header until then. ── */
/* The theme paints this #EFF0F2 with `.…__header-content.lwc-<hash>` (two classes). Adding the custom
   element and .sticky-header outranks it without depending on the build hash, which can change. */
community_byo-scoped-header-and-footer .sticky-header .community_byo-scoped-header-and-footer__header-content {
    background: #000136;   /* --mp-topbar-bg on ProCert (Navy Dark) */
}

/* ── The header section holding procertTopbar (3 Oct 2026). Builder keeps the theme layout's header as a
   section with one column; by default it adds 16px padding and caps the column at the 1200px content width,
   which would make the topbar 100px tall and stop its colour short of the window edges. procertTopbar does its
   own sizing and its own alignment to the content column, so the section must add nothing. !important because
   the layout component's own padding and width rules outrank a stylesheet rule here (measured 2 Oct on the
   same elements). These replace the 2 Oct phone rules that reflowed the stock logo-and-Login section. ── */
community_byo-scoped-header-and-footer .sticky-header community_layout-section {
    padding: 0 !important;
}
community_byo-scoped-header-and-footer .sticky-header .columns-content {
    max-width: none !important;
    padding: 0 !important;
}
community_byo-scoped-header-and-footer .sticky-header .columns-content > community_layout-column {
    flex: 1 1 100% !important;
    width: 100% !important;
    margin: 0 !important;
}

/* ── The signed-in user menu's dropdown is at least as wide as its button (Tom, 3 Oct 2026). lightning-button-menu
   sizes its dropdown to max-content, so with a long name the 206px button opened a 116px menu tucked under its
   right end. 100% of the trigger makes the two the same width, both right-aligned. A page-level rule is what
   reaches it (measured live: a rule here applied, at 206px). ── */
c-site-user-menu lightning-button-menu .slds-dropdown {
    min-width: 100% !important;
}

/* ── Printing: the site's header bar and footer stay off paper (3 Oct 2026), so a printed certificate
   (procertCertificateArt, whose own print rules hide the rest of its page) is just the certificate. Applies to
   every ProCert page, which is also what you want from a printed registry or quiz. ── */
@media print {
    community_byo-scoped-header-and-footer .community_byo-scoped-header-and-footer__header-content,
    community_byo-scoped-header-and-footer .community_byo-scoped-header-and-footer__footer-content {
        display: none !important;
    }
}
