/* ========================================================================== PRC PORTAL — portal-specific additions on top of prc.css (prc.css stays a verbatim copy of the Server's; everything Verify-only lives here so the two files can be diffed/re-synced independently.) ========================================================================== */ /* ---------- Section sub-navigation ---------- The top bar stays flat like the Server's — sections with children get an in-page rail directly under the page title, reusing the top bar's exact active vocabulary (uppercase micro-caps + amber gradient underline). The top-bar item stays lit for the whole section (NavLink prefix matching). Used by Download (PRC | KUKA|prc) and Admin (Licenses | Statistics | Activations). */ .prc-subnav { display: flex; align-items: stretch; gap: 2px; margin: -10px 0 24px; border-bottom: 1px solid var(--edge); } .prc-subnav a { position: relative; display: flex; align-items: center; gap: 7px; height: 40px; padding: 0 13px; color: var(--text-dim); font-size: 11px; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase; text-decoration: none; white-space: nowrap; transition: color 0.18s var(--ease); } .prc-subnav a:hover { color: var(--text); text-decoration: none; } .prc-subnav a.active { color: var(--acc); } .prc-subnav a.active::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px; border-radius: 2px; background: var(--grad-acc); box-shadow: 0 0 10px var(--acc-glow); } .prc-subnav svg { width: 14px; height: 14px; flex: 0 0 auto; } /* ---------- Account pill (topbar) ---------- Reuses .robot-pill for the shell geometry; the signed-in name reads as primary text, the signed-out label stays dim like "NO ROBOT". */ .robot-pill .pill-label.signed-in { color: var(--text); } /* ---------- Theme toggle & logo swap (no circuit round-trip) ---------- window.prcTheme toggles data-theme on ; these classes swap the sun/moon glyph and the light/dark logo variants purely in CSS. */ html[data-theme="light"] .only-dark, html:not([data-theme="light"]) .only-light { display: none !important; } /* ---------- Page bits ---------- */ /* Wizard hero cards (sign-in / activation) — hero-card is text-center on the Server; the portal also uses a left-aligned variant for data-bearing steps. The page title inside a hero card is the h1 (FocusOnNavigate target) and matches the Server's .hero-card h2 scale. */ .hero-card.left { text-align: left; max-width: 600px; } .hero-card h1 { font-size: 24px; margin: 8px 0 10px; } /* Statistics tiles reuse .an-tile; the label tracks the overline style. */ .stat-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 16px; } .stat-tiles .an-tile { cursor: default; } .stat-tiles .an-tile-label { font-size: 10.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-faint); } .stat-tiles .an-tile-value { font-variant-numeric: tabular-nums; } .stat-tiles .an-tile.plain .an-tile-value { color: var(--text); } /* Two-column content split (Statistics tables, Activation Explorer master-detail, Download manual/notes). Collapses on narrow screens like .an-grid. */ .portal-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; } .portal-grid.split-7-5 { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } @media (max-width: 1000px) { .portal-grid, .portal-grid.split-7-5 { grid-template-columns: 1fr; } } /* Glass wrapper for a Radzen grid: overline heading row + clipped corners. */ .grid-card { overflow: hidden; } .grid-card .grid-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 18px 22px 6px; } /* Activation-history badges (Activation Explorer detail pane). */ .prc-badge { display: inline-flex; align-items: center; padding: 1px 9px; border-radius: 999px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; } .prc-badge.ok { background: rgba(61, 220, 132, 0.12); border: 1px solid var(--ok); color: var(--ok); } .prc-badge.err { background: rgba(255, 82, 82, 0.12); border: 1px solid var(--err); color: var(--err); } /* Release-notes body (pre-line prose inside a glass panel). */ .release-notes { white-space: pre-line; font-size: 13px; line-height: 1.65; color: var(--text-dim); max-width: 72ch; } /* Inline busy state on primary buttons (Login flow) — a small track-colored ring that matches .prc-spinner but fits inside the 38px button. */ .prc-btn .btn-spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(20, 16, 10, 0.35); border-top-color: #14100a; animation: robot-spin 0.9s linear infinite; } /* Field-level validation text under portal forms. */ .field-error { font-size: 12.5px; color: var(--err); margin-top: 6px; }