/* /Components/Layout/MainLayout.razor.rz.scp.css */ .skip-link[b-zce8qtwlzb] { position: absolute; top: -48px; left: 8px; z-index: 2000; background: var(--blue, #0385FF); color: #fff; padding: 10px 18px; border-radius: 8px; font-weight: 700; font-size: 14px; text-decoration: none; transition: top 140ms ease; } .skip-link:focus[b-zce8qtwlzb] { top: 8px; } .sidebar-toggle-check[b-zce8qtwlzb] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); border: 0; padding: 0; margin: -1px; } .app-shell[b-zce8qtwlzb] { display: flex; min-height: 100vh; background: transparent; /* the /welcome page gradient on shows through */ } .sidebar[b-zce8qtwlzb] { width: 240px; flex-shrink: 0; background: color-mix(in oklab, var(--card) 72%, transparent); -webkit-backdrop-filter: saturate(180%) blur(16px); backdrop-filter: saturate(180%) blur(16px); border-right: 1px solid var(--hairline); position: sticky; top: 0; height: 100vh; overflow-y: auto; z-index: 30; } .main-column[b-zce8qtwlzb] { flex: 1; display: flex; flex-direction: column; min-width: 0; } .topbar[b-zce8qtwlzb] { position: sticky; top: 0; z-index: 20; height: 56px; background: var(--topbar-bg); -webkit-backdrop-filter: var(--topbar-blur); backdrop-filter: var(--topbar-blur); border-bottom: 1px solid var(--hairline); display: flex; align-items: center; justify-content: flex-end; padding: 0 24px; gap: 6px; } .sidebar-toggle[b-zce8qtwlzb] { background: none; border: none; cursor: pointer; color: var(--text); padding: 8px; border-radius: 8px; display: none; align-items: center; justify-content: center; margin-right: auto; transition: background-color 140ms; } .sidebar-toggle:hover[b-zce8qtwlzb] { background: var(--bg-muted); } .sidebar-toggle svg[b-zce8qtwlzb] { display: block; } .sidebar-toggle .sidebar-toggle-close[b-zce8qtwlzb] { display: none; } .sidebar-overlay[b-zce8qtwlzb] { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.45); z-index: 25; opacity: 0; pointer-events: none; transition: opacity 200ms ease; cursor: pointer; } .app-main[b-zce8qtwlzb] { flex: 1; background: transparent; } .app-content[b-zce8qtwlzb] { max-width: 1240px; margin: 0 auto; padding: 30px 32px 60px; } @media (max-width: 880px) { .sidebar[b-zce8qtwlzb] { position: fixed; top: 0; left: 0; bottom: 0; transform: translateX(-100%); transition: transform 200ms ease; box-shadow: 0 20px 40px -10px rgba(0, 0, 0, .25); z-index: 30; } .sidebar-toggle[b-zce8qtwlzb] { display: inline-flex; } .topbar[b-zce8qtwlzb] { padding: 0 18px; } .app-content[b-zce8qtwlzb] { padding: 22px 18px 40px; } } /* /Components/Layout/NavMenu.razor.rz.scp.css */ .sidebar-inner[b-8oe199qvjh] { display: flex; flex-direction: column; height: 100%; padding: 16px 0; } .sidebar-brand[b-8oe199qvjh] { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 14px 18px 18px; text-decoration: none; margin: 0 8px 8px; border-bottom: 1px solid var(--hairline); } .sidebar-brand:hover[b-8oe199qvjh] { text-decoration: none; } .sidebar-brand-img[b-8oe199qvjh] { height: 46px; width: auto; max-width: 100%; display: block; background: transparent; } .sidebar-brand-img.brand-dark[b-8oe199qvjh] { display: none; } :root[data-theme="dark"] .sidebar-brand-img.brand-light[b-8oe199qvjh] { display: none; } :root[data-theme="dark"] .sidebar-brand-img.brand-dark[b-8oe199qvjh] { display: block; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .sidebar-brand-img.brand-light[b-8oe199qvjh] { display: none; } :root:not([data-theme="light"]) .sidebar-brand-img.brand-dark[b-8oe199qvjh] { display: block; } } .sidebar-brand-mark[b-8oe199qvjh] { width: 30px; height: 30px; display: grid; place-items: center; color: var(--blue); } .sidebar-brand-mark svg[b-8oe199qvjh] { width: 100%; height: 100%; display: block; } .sidebar-brand-text[b-8oe199qvjh] { font-family: var(--font-display); font-weight: 800; font-size: 18px; letter-spacing: -.04em; color: var(--heading); } .sidebar-nav[b-8oe199qvjh] { padding: 8px 12px; display: flex; flex-direction: column; gap: 2px; flex: 1; } .sidebar-cta[b-8oe199qvjh] { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 0 10px; padding: 10px 12px; border-radius: 10px; background: var(--blue); color: #fff; text-decoration: none; font-family: var(--font-body); font-size: 14px; font-weight: 700; box-shadow: 0 1px 2px rgba(16, 24, 40, .08); transition: background 140ms ease, transform 80ms ease; } .sidebar-cta:hover[b-8oe199qvjh] { background: var(--blue-dk); color: #fff; text-decoration: none; } .sidebar-cta:active[b-8oe199qvjh] { transform: translateY(1px); } .sidebar-cta svg[b-8oe199qvjh] { width: 16px; height: 16px; flex-shrink: 0; } .sidebar-search[b-8oe199qvjh] { position: relative; display: flex; align-items: center; margin: 0 0 14px; } .sidebar-search-icon[b-8oe199qvjh] { position: absolute; left: 10px; width: 14px; height: 14px; color: var(--text-3); pointer-events: none; } .sidebar-search-input[b-8oe199qvjh] { width: 100%; padding: 8px 10px 8px 30px; border-radius: 8px; border: 1px solid var(--hairline-2); background: var(--bg-2); color: var(--text); font-family: var(--font-body); font-size: 13px; } .sidebar-search-input:focus[b-8oe199qvjh] { outline: none; border-color: var(--blue); background: var(--card); } .sidebar-recent[b-8oe199qvjh] { display: flex; flex-direction: column; gap: 2px; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--hairline); } .sidebar-recent-label[b-8oe199qvjh] { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); padding: 0 12px 4px; } .sidebar-recent-link[b-8oe199qvjh] { padding: 5px 12px; border-radius: 8px; color: var(--text-2); text-decoration: none; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sidebar-recent-link:hover[b-8oe199qvjh] { background: var(--bg-2); color: var(--text); } .sidebar-nav[b-8oe199qvjh] .sidebar-link, .sidebar-link[b-8oe199qvjh] { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 10px; color: var(--text-2); text-decoration: none; font-family: var(--font-body); font-size: 14px; font-weight: 600; transition: background 140ms ease, color 140ms ease; } .sidebar-nav[b-8oe199qvjh] .sidebar-link svg, .sidebar-link svg[b-8oe199qvjh] { width: 18px; height: 18px; flex-shrink: 0; } .sidebar-nav[b-8oe199qvjh] .sidebar-link:hover, .sidebar-link:hover[b-8oe199qvjh] { background: var(--bg-muted); color: var(--heading); text-decoration: underline; } .sidebar-nav[b-8oe199qvjh] .sidebar-link.active, .sidebar-link.active[b-8oe199qvjh] { background: var(--blue-soft); color: var(--blue); } .sidebar-group[b-8oe199qvjh] { display: flex; flex-direction: column; margin: 0; padding: 0; } .sidebar-group > summary[b-8oe199qvjh] { cursor: pointer; list-style: none; user-select: none; } .sidebar-group > summary[b-8oe199qvjh]::-webkit-details-marker { display: none; } .sidebar-group > summary[b-8oe199qvjh]::marker { display: none; content: ""; } .sidebar-group-summary span[b-8oe199qvjh] { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; } .sidebar-group-summary .chev[b-8oe199qvjh] { width: 14px; height: 14px; flex-shrink: 0; transition: transform 200ms ease; color: var(--text-3); } .sidebar-group[open] > .sidebar-group-summary .chev[b-8oe199qvjh] { transform: rotate(90deg); color: var(--blue); } .sidebar-sub[b-8oe199qvjh] { display: flex; flex-direction: column; gap: 1px; padding: 4px 0 8px 30px; margin-left: 8px; border-left: 1px solid var(--hairline); } .sidebar-sub-empty[b-8oe199qvjh] { padding: 6px 12px; color: var(--text-4); font-size: 12.5px; font-style: italic; } .sidebar-subgroup > summary[b-8oe199qvjh] { list-style: none; cursor: pointer; } .sidebar-subgroup > summary[b-8oe199qvjh]::-webkit-details-marker { display: none; } .sidebar-subgroup > summary[b-8oe199qvjh]::marker { display: none; content: ""; } .sidebar-subgroup-summary .chev[b-8oe199qvjh] { width: 13px; height: 13px; flex: none; color: var(--text-4); transition: transform 180ms ease; } .sidebar-subgroup[open] > .sidebar-subgroup-summary .chev[b-8oe199qvjh] { transform: rotate(90deg); } .sidebar-subsub[b-8oe199qvjh] { display: flex; flex-direction: column; gap: 1px; padding: 2px 0 2px 14px; margin: 1px 0 1px 6px; border-left: 1px solid var(--hairline); } .sidebar-nav[b-8oe199qvjh] .sidebar-sub-link, .sidebar-sub-link[b-8oe199qvjh] { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 12px; border-radius: 8px; color: var(--text-3); text-decoration: none; font-family: var(--font-body); font-size: 13px; font-weight: 500; transition: all 140ms ease; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sidebar-nav[b-8oe199qvjh] .sidebar-sub-link:hover, .sidebar-sub-link:hover[b-8oe199qvjh] { color: var(--heading); background: var(--bg-muted); text-decoration: underline; } .sidebar-nav[b-8oe199qvjh] .sidebar-sub-link.active, .sidebar-sub-link.active[b-8oe199qvjh] { color: var(--blue); background: var(--blue-soft); font-weight: 600; } .sidebar-nav[b-8oe199qvjh] .sidebar-sub-link.sub-add, .sidebar-sub-link.sub-add[b-8oe199qvjh] { color: var(--blue); font-weight: 600; } .sidebar-subhead[b-8oe199qvjh] { padding: 10px 12px 2px; color: var(--text-4); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; } .sidebar-subhead:first-child[b-8oe199qvjh] { padding-top: 2px; } .sub-count[b-8oe199qvjh] { background: var(--warning); color: #fff; min-width: 18px; height: 18px; border-radius: 9px; padding: 0 6px; font-family: var(--font-body); font-size: 10.5px; font-weight: 700; line-height: 18px; text-align: center; flex-shrink: 0; } /* /Components/Layout/NotificationBell.razor.rz.scp.css */ .cart-btn[b-7wjdszmw4e] { position: relative; width: 38px; height: 38px; border-radius: 10px; background: transparent; border: 1px solid transparent; color: var(--text-2); display: grid; place-items: center; transition: all 140ms ease; text-decoration: none; } .cart-btn:hover[b-7wjdszmw4e] { background: var(--icon-btn-hover-bg); color: var(--heading); border-color: var(--hairline); text-decoration: none; } .cart-btn svg[b-7wjdszmw4e] { width: 18px; height: 18px; display: block; } .cart-badge[b-7wjdszmw4e] { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--warning); color: #fff; font-family: var(--font-body); font-size: 10.5px; font-weight: 700; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--topbar-bg); } .nf-badge-action[b-7wjdszmw4e] { background: #dc2626; } /* /Components/Layout/ReconnectModal.razor.rz.scp.css */ .components-reconnect-first-attempt-visible[b-8lpmvyl7ct], .components-reconnect-repeated-attempt-visible[b-8lpmvyl7ct], .components-reconnect-failed-visible[b-8lpmvyl7ct], .components-pause-visible[b-8lpmvyl7ct], .components-resume-failed-visible[b-8lpmvyl7ct], .components-rejoining-animation[b-8lpmvyl7ct] { display: none; } #components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-8lpmvyl7ct], #components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-8lpmvyl7ct], #components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-8lpmvyl7ct], #components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-8lpmvyl7ct], #components-reconnect-modal.components-reconnect-retrying[b-8lpmvyl7ct], #components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-8lpmvyl7ct], #components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-8lpmvyl7ct], #components-reconnect-modal.components-reconnect-failed[b-8lpmvyl7ct], #components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-8lpmvyl7ct] { display: block; } #components-reconnect-modal[b-8lpmvyl7ct] { background-color: var(--bg, white); width: 20rem; margin: 20vh auto; padding: 2rem; border: 0; border-radius: 0.5rem; box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3); opacity: 0; transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete; animation: components-reconnect-modal-fadeOutOpacity-b-8lpmvyl7ct 0.5s both; &[open] { animation: components-reconnect-modal-slideUp-b-8lpmvyl7ct 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-8lpmvyl7ct 0.5s ease-in-out 0.3s; animation-fill-mode: both; } } #components-reconnect-modal[b-8lpmvyl7ct]::backdrop { background-color: rgba(0, 0, 0, 0.4); animation: components-reconnect-modal-fadeInOpacity-b-8lpmvyl7ct 0.5s ease-in-out; opacity: 1; } @keyframes components-reconnect-modal-slideUp-b-8lpmvyl7ct { 0% { transform: translateY(30px) scale(0.95); } 100% { transform: translateY(0); } } @keyframes components-reconnect-modal-fadeInOpacity-b-8lpmvyl7ct { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes components-reconnect-modal-fadeOutOpacity-b-8lpmvyl7ct { 0% { opacity: 1; } 100% { opacity: 0; } } .components-reconnect-container[b-8lpmvyl7ct] { display: flex; flex-direction: column; align-items: center; gap: 1rem; } #components-reconnect-modal p[b-8lpmvyl7ct] { margin: 0; text-align: center; } #components-reconnect-modal button[b-8lpmvyl7ct] { border: 0; background-color: var(--blue); color: white; padding: 4px 24px; border-radius: 4px; } #components-reconnect-modal button:hover[b-8lpmvyl7ct] { background-color: var(--blue-dk); } #components-reconnect-modal button:active[b-8lpmvyl7ct] { background-color: var(--blue-press); } .components-rejoining-animation[b-8lpmvyl7ct] { position: relative; width: 80px; height: 80px; } .components-rejoining-animation div[b-8lpmvyl7ct] { position: absolute; border: 3px solid var(--blue); opacity: 1; border-radius: 50%; animation: components-rejoining-animation-b-8lpmvyl7ct 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite; } .components-rejoining-animation div:nth-child(2)[b-8lpmvyl7ct] { animation-delay: -0.5s; } @keyframes components-rejoining-animation-b-8lpmvyl7ct { 0% { top: 40px; left: 40px; width: 0; height: 0; opacity: 0; } 4.9% { top: 40px; left: 40px; width: 0; height: 0; opacity: 0; } 5% { top: 40px; left: 40px; width: 0; height: 0; opacity: 1; } 100% { top: 0px; left: 0px; width: 80px; height: 80px; opacity: 0; } } /* /Components/Layout/TopbarActions.razor.rz.scp.css */ .topbar-actions[b-r4dj39b6l7] { display: flex; align-items: center; justify-content: flex-end; flex: 1; gap: 6px; } /* Payer scope selector + return-to-firm, relocated from the sidebar into the topbar. order:-1 + margin-right:auto floats the group to the far LEFT of the flex-end topbar. */ .topbar-scope-group[b-r4dj39b6l7] { order: -1; margin-right: auto; display: flex; align-items: center; gap: 8px; min-width: 0; } .topbar-drop[b-r4dj39b6l7] { position: relative; margin: 0; } .topbar-drop > summary[b-r4dj39b6l7] { display: flex; align-items: center; gap: 9px; padding: 5px 10px; } .topbar-drop .scope-ico[b-r4dj39b6l7] { width: 16px; height: 16px; color: var(--text-3); flex: 0 0 auto; } .topbar-drop .scope-co[b-r4dj39b6l7] { display: flex; flex-direction: column; line-height: 1.1; min-width: 0; } .topbar-drop .scope-eyebrow[b-r4dj39b6l7] { font-size: 9px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--text-3); } .topbar-drop .scope-name[b-r4dj39b6l7] { font-weight: 700; font-size: 12.5px; color: var(--heading); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .topbar-payer .scope-name[b-r4dj39b6l7] { max-width: 150px; } /* In the 56px topbar the dropdowns must overlay, not push the bar taller. */ .topbar-drop .scope-menu[b-r4dj39b6l7] { position: absolute; top: calc(100% + 6px); left: 0; z-index: 70; min-width: 232px; margin-top: 0; } .topbar-year .scope-menu[b-r4dj39b6l7] { min-width: 168px; } .topbar-scope-exit[b-r4dj39b6l7] { margin: 0; padding: 6px 11px; white-space: nowrap; font-size: 12px; } @media (max-width: 880px) { .topbar-payer .scope-name[b-r4dj39b6l7] { max-width: 96px; } .topbar-drop .scope-ico[b-r4dj39b6l7] { display: none; } .topbar-scope-exit[b-r4dj39b6l7] { display: none; } } .icon-btn[b-r4dj39b6l7] { position: relative; width: 38px; height: 38px; border-radius: 10px; background: transparent; border: 1px solid transparent; color: var(--text-2); display: grid; place-items: center; cursor: pointer; transition: all 140ms ease; text-decoration: none; padding: 0; } .icon-btn:hover[b-r4dj39b6l7] { background: var(--icon-btn-hover-bg); color: var(--heading); border-color: var(--hairline); } .icon-btn svg[b-r4dj39b6l7] { width: 18px; height: 18px; display: block; } .theme-toggle .icon-sun[b-r4dj39b6l7] { display: none; } .theme-toggle .icon-moon[b-r4dj39b6l7] { display: block; } .theme-toggle svg[b-r4dj39b6l7] { transition: transform 220ms ease; } .theme-toggle:hover svg[b-r4dj39b6l7] { transform: rotate(18deg); } .cart-btn[b-r4dj39b6l7] { position: relative; width: 38px; height: 38px; border-radius: 10px; background: transparent; border: 1px solid transparent; color: var(--text-2); display: grid; place-items: center; transition: all 140ms ease; text-decoration: none; } .cart-btn:hover[b-r4dj39b6l7] { background: var(--icon-btn-hover-bg); color: var(--heading); border-color: var(--hairline); text-decoration: none; } .cart-btn svg[b-r4dj39b6l7] { width: 18px; height: 18px; } .cart-badge[b-r4dj39b6l7] { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--warning); color: #fff; font-family: var(--font-body); font-size: 10.5px; font-weight: 700; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--topbar-bg); } .account-menu[b-r4dj39b6l7] { position: relative; margin-left: 6px; padding-left: 10px; border-left: 1px solid var(--hairline); } .account-menu > summary[b-r4dj39b6l7] { list-style: none; cursor: pointer; user-select: none; } .account-menu > summary[b-r4dj39b6l7]::-webkit-details-marker { display: none; } .account-menu > summary[b-r4dj39b6l7]::marker { display: none; content: ""; } .account-link[b-r4dj39b6l7] { display: inline-flex; align-items: center; gap: 9px; padding: 5px 12px 5px 5px; border-radius: 999px; background: var(--bg-muted); color: var(--heading); text-decoration: none; font-family: var(--font-body); font-weight: 600; font-size: 13.5px; transition: background 140ms ease, color 140ms ease; } .account-menu summary.account-link:hover[b-r4dj39b6l7], .account-link:hover[b-r4dj39b6l7] { background: var(--blue-soft); color: var(--blue-dk); text-decoration: underline; } .account-avatar[b-r4dj39b6l7] { width: 26px; height: 26px; border-radius: 50%; background: var(--blue); color: #fff; display: grid; place-items: center; font-family: var(--font-display); font-weight: 700; font-size: 11.5px; text-transform: uppercase; flex-shrink: 0; } .account-name[b-r4dj39b6l7] { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .account-chev[b-r4dj39b6l7] { width: 12px; height: 12px; color: var(--text-3); transition: transform 200ms ease; flex-shrink: 0; } .account-menu[open] .account-chev[b-r4dj39b6l7] { transform: rotate(180deg); color: var(--blue); } .account-menu-dropdown[b-r4dj39b6l7] { position: absolute; top: calc(100% + 8px); right: 0; min-width: 220px; background: var(--bg); border: 1px solid var(--hairline); border-radius: 12px; box-shadow: 0 4px 12px -4px rgba(15, 23, 42, .12), 0 12px 32px -8px rgba(15, 23, 42, .18); padding: 6px; z-index: 50; display: flex; flex-direction: column; gap: 1px; animation: account-menu-pop-b-r4dj39b6l7 160ms ease; } @keyframes account-menu-pop-b-r4dj39b6l7 { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } } .account-menu-item[b-r4dj39b6l7] { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 8px; color: var(--text); background: transparent; border: none; width: 100%; text-decoration: none; font-family: var(--font-body); font-weight: 500; font-size: 13.5px; cursor: pointer; text-align: left; transition: background 140ms ease, color 140ms ease; } .account-menu-item svg[b-r4dj39b6l7] { width: 16px; height: 16px; flex-shrink: 0; color: var(--text-3); } .account-menu-item:hover[b-r4dj39b6l7] { background: var(--bg-muted); color: var(--heading); text-decoration: underline; } .account-menu-item:hover svg[b-r4dj39b6l7] { color: var(--heading); } .account-menu-item.account-menu-signout[b-r4dj39b6l7] { color: var(--danger-text); } .account-menu-item.account-menu-signout:hover[b-r4dj39b6l7] { background: var(--danger-bg); color: var(--danger-text); } .account-menu-item.account-menu-signout svg[b-r4dj39b6l7] { color: var(--danger); } .account-menu-sep[b-r4dj39b6l7] { height: 1px; background: var(--hairline); margin: 4px 4px; } .account-menu-form[b-r4dj39b6l7] { margin: 0; } .btn-pill[b-r4dj39b6l7] { display: inline-flex; align-items: center; padding: 8px 16px; border-radius: 999px; font-family: var(--font-body); font-weight: 600; font-size: 13px; text-decoration: none; transition: all 160ms ease; border: 1.5px solid transparent; } .btn-pill.primary[b-r4dj39b6l7] { background: var(--blue); color: #fff; border-color: var(--blue); box-shadow: var(--shadow-button); } .btn-pill.primary:hover[b-r4dj39b6l7] { background: var(--blue-dk); border-color: var(--blue-dk); color: #fff; text-decoration: none; } .topnav-link.signin[b-r4dj39b6l7] { color: var(--heading); font-weight: 600; font-size: 13.5px; padding: 8px 12px; text-decoration: none; } .topnav-link.signin:hover[b-r4dj39b6l7] { color: var(--blue); text-decoration: underline; } @media (max-width: 880px) { .account-name[b-r4dj39b6l7] { display: none; } } /* /Components/Pages/CopyB/FirmPayerList.razor.rz.scp.css */ .printctr[b-2fzp82ngk6] { max-width: 1080px; margin: 0 auto; padding: 8px 4px 64px; } .printctr-top[b-2fzp82ngk6] { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; } .printctr-top .eyebrow[b-2fzp82ngk6] { font-size: 11.5px; letter-spacing: .08em; font-weight: 700; color: #2563eb; } .printctr-top h1[b-2fzp82ngk6] { margin: 4px 0 4px; font-size: 26px; } .printctr-top p[b-2fzp82ngk6] { margin: 0; color: #6b7280; font-size: 14px; max-width: 600px; } .printctr-head-right[b-2fzp82ngk6] { display: flex; align-items: center; gap: 10px; } .printctr-year[b-2fzp82ngk6] { font-size: 13px; font-weight: 600; color: #6b7280; padding: 7px 12px; border: 1px solid #e5e7eb; border-radius: 999px; } .printctr-load[b-2fzp82ngk6] { display: flex; align-items: center; gap: 12px; color: #6b7280; padding: 48px 0; justify-content: center; } .printctr-note[b-2fzp82ngk6] { padding: 28px; border: 1px solid #e5e7eb; border-radius: 12px; color: #6b7280; text-align: center; } .printctr-note-err[b-2fzp82ngk6] { border-color: #fecaca; background: #fef2f2; color: #b91c1c; } .cbp-spin[b-2fzp82ngk6] { width: 26px; height: 26px; border-radius: 50%; border: 3px solid rgba(127,127,127,.35); border-top-color: #2563eb; display: inline-block; animation: printctr-rot-b-2fzp82ngk6 .7s linear infinite; } @keyframes printctr-rot-b-2fzp82ngk6 { to { transform: rotate(360deg); } } .cbp-btn[b-2fzp82ngk6] { display: inline-flex; align-items: center; gap: 6px; background: #fff; color: #111827; border: 1px solid #e5e7eb; border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 600; text-decoration: none; } .cbp-btn-primary[b-2fzp82ngk6] { background: #2563eb; color: #fff; border-color: #2563eb; } .pyr-grid[b-2fzp82ngk6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; } .pyr-card[b-2fzp82ngk6] { border: 1px solid #e5e7eb; border-radius: 14px; padding: 16px 18px; background: #fff; display: flex; flex-direction: column; gap: 12px; transition: .12s; } .pyr-card:hover[b-2fzp82ngk6] { border-color: #2563eb; box-shadow: 0 6px 20px rgba(37,99,235,.08); } .pyr-card-top[b-2fzp82ngk6] { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; } .pyr-name[b-2fzp82ngk6] { font-weight: 700; font-size: 15.5px; } .pyr-tin[b-2fzp82ngk6] { font-size: 12.5px; color: #6b7280; margin-top: 2px; } .pyr-count[b-2fzp82ngk6] { font-size: 22px; font-weight: 700; color: #2563eb; line-height: 1; text-align: right; } .pyr-count span[b-2fzp82ngk6] { display: block; font-size: 10.5px; font-weight: 600; color: #6b7280; letter-spacing: .04em; text-transform: uppercase; margin-top: 2px; } .pyr-stats[b-2fzp82ngk6] { display: flex; gap: 8px; font-size: 12px; } .pyr-stat[b-2fzp82ngk6] { padding: 3px 9px; border-radius: 999px; background: rgba(127,127,127,.1); color: #6b7280; font-weight: 600; } .pyr-stat.on[b-2fzp82ngk6] { background: rgba(37,99,235,.12); color: #2563eb; } .pyr-stat-dl.on[b-2fzp82ngk6] { background: rgba(16,185,129,.14); color: #059669; } .pyr-bar[b-2fzp82ngk6] { height: 5px; border-radius: 999px; background: rgba(127,127,127,.16); overflow: hidden; } .pyr-bar-fill[b-2fzp82ngk6] { height: 100%; background: #2563eb; border-radius: 999px; } .pyr-open[b-2fzp82ngk6] { font-size: 13px; font-weight: 600; color: #2563eb; text-decoration: none; margin-top: 2px; } .pyr-open:hover[b-2fzp82ngk6] { text-decoration: underline; } @media (prefers-color-scheme: dark) { .printctr-top p[b-2fzp82ngk6], .printctr-year[b-2fzp82ngk6], .printctr-load[b-2fzp82ngk6], .printctr-note[b-2fzp82ngk6], .pyr-tin[b-2fzp82ngk6] { color: #9aa2b1; } .printctr-year[b-2fzp82ngk6], .printctr-note[b-2fzp82ngk6], .cbp-btn[b-2fzp82ngk6], .pyr-card[b-2fzp82ngk6] { border-color: #2a2f3a; } .cbp-btn[b-2fzp82ngk6], .pyr-card[b-2fzp82ngk6] { background: #171a21; color: #e8eaf0; } .printctr-note-err[b-2fzp82ngk6] { border-color: #7f1d1d; background: rgba(127,29,29,.2); color: #fca5a5; } } /* /Components/Pages/CopyB/FirmPrint.razor.rz.scp.css */ .printctr[b-mjbanslpgz] { max-width: 1080px; margin: 0 auto; padding: 8px 4px 64px; } .printctr-top[b-mjbanslpgz] { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; } .printctr-top .eyebrow[b-mjbanslpgz] { font-size: 11.5px; letter-spacing: .08em; font-weight: 700; color: #2563eb; } .printctr-top h1[b-mjbanslpgz] { margin: 4px 0 4px; font-size: 26px; } .printctr-top p[b-mjbanslpgz] { margin: 0; color: #6b7280; font-size: 14px; max-width: 600px; } .printctr-head-right[b-mjbanslpgz] { display: flex; align-items: center; gap: 10px; } .printctr-year[b-mjbanslpgz] { font-size: 13px; font-weight: 600; color: #6b7280; padding: 7px 12px; border: 1px solid #e5e7eb; border-radius: 999px; } .printctr-load[b-mjbanslpgz] { display: flex; align-items: center; gap: 12px; color: #6b7280; padding: 48px 0; justify-content: center; } .printctr-note[b-mjbanslpgz] { padding: 28px; border: 1px solid #e5e7eb; border-radius: 12px; color: #6b7280; text-align: center; } .printctr-note-err[b-mjbanslpgz] { border-color: #fecaca; background: #fef2f2; color: #b91c1c; } .cbp-spin[b-mjbanslpgz] { width: 13px; height: 13px; border-radius: 50%; border: 2px solid rgba(127,127,127,.35); border-top-color: #2563eb; display: inline-block; animation: printctr-rot-b-mjbanslpgz .7s linear infinite; } .cbp-spin-lg[b-mjbanslpgz] { width: 26px; height: 26px; border-width: 3px; } @keyframes printctr-rot-b-mjbanslpgz { to { transform: rotate(360deg); } } .cbp-btn[b-mjbanslpgz] { display: inline-flex; align-items: center; gap: 6px; background: #fff; color: #111827; border: 1px solid #e5e7eb; border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none; } @media (prefers-color-scheme: dark) { .printctr-top p[b-mjbanslpgz], .printctr-year[b-mjbanslpgz], .printctr-load[b-mjbanslpgz], .printctr-note[b-mjbanslpgz] { color: #9aa2b1; } .printctr-year[b-mjbanslpgz], .printctr-note[b-mjbanslpgz], .cbp-btn[b-mjbanslpgz] { border-color: #2a2f3a; } .cbp-btn[b-mjbanslpgz] { background: #171a21; color: #e8eaf0; } .printctr-note-err[b-mjbanslpgz] { border-color: #7f1d1d; background: rgba(127,29,29,.2); color: #fca5a5; } } /* /Components/Pages/CopyB/SinglePayerPrint.razor.rz.scp.css */ .printctr[b-v1alt9csma] { max-width: 1080px; margin: 0 auto; padding: 8px 4px 64px; } .printctr-top[b-v1alt9csma] { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; } .printctr-top .eyebrow[b-v1alt9csma] { font-size: 11.5px; letter-spacing: .08em; font-weight: 700; color: #2563eb; } .printctr-top h1[b-v1alt9csma] { margin: 4px 0 4px; font-size: 26px; } .printctr-top .sub[b-v1alt9csma], .printctr-top p[b-v1alt9csma] { margin: 0; color: #6b7280; font-size: 14px; max-width: 560px; } .printctr-year[b-v1alt9csma] { font-size: 13px; font-weight: 600; color: #6b7280; padding: 7px 12px; border: 1px solid #e5e7eb; border-radius: 999px; } .printctr-load[b-v1alt9csma] { display: flex; align-items: center; gap: 12px; color: #6b7280; padding: 48px 0; justify-content: center; } .cbp-spin[b-v1alt9csma] { width: 13px; height: 13px; border-radius: 50%; border: 2px solid rgba(127,127,127,.35); border-top-color: #2563eb; display: inline-block; animation: printctr-rot-b-v1alt9csma .7s linear infinite; } .cbp-spin-lg[b-v1alt9csma] { width: 26px; height: 26px; border-width: 3px; } @keyframes printctr-rot-b-v1alt9csma { to { transform: rotate(360deg); } } .cbp-btn[b-v1alt9csma] { display: inline-flex; align-items: center; gap: 6px; background: #fff; color: #111827; border: 1px solid #e5e7eb; border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none; } .cbp-btn-primary[b-v1alt9csma] { background: #2563eb; color: #fff; border-color: #2563eb; } .printctr-note[b-v1alt9csma] { padding: 28px; border: 1px solid #e5e7eb; border-radius: 12px; color: #6b7280; text-align: center; } .printctr-note p[b-v1alt9csma] { margin: 0 0 14px; } .printctr-note-err[b-v1alt9csma] { border-color: #fecaca; background: #fef2f2; color: #b91c1c; } @media (prefers-color-scheme: dark) { .printctr-top p[b-v1alt9csma], .printctr-year[b-v1alt9csma], .printctr-load[b-v1alt9csma], .printctr-note[b-v1alt9csma] { color: #9aa2b1; } .printctr-year[b-v1alt9csma], .printctr-note[b-v1alt9csma] { border-color: #2a2f3a; } .printctr-note-err[b-v1alt9csma] { border-color: #7f1d1d; background: rgba(127,29,29,.2); color: #fca5a5; } } /* /Components/Shared/CopyB/CopyBPrintWorkspace.razor.rz.scp.css */ /* Palette pinned to the app's welcome.css token values (light + dark) so the print workspace reads as the same product as the rest of the app. */ /* The preview modal and progress player render as fixed-position overlays OUTSIDE the .cbp wrapper, so they must declare the palette themselves — otherwise every var(--cbp-*) resolves to nothing and the modal is transparent/see-through (only the pane's hardcoded gray shows). */ .cbp[b-1vx8a3ixp7], .cbp-modal-scrim[b-1vx8a3ixp7], .cbp-prog[b-1vx8a3ixp7] { --cbp-line: #E5EBF3; --cbp-ink: #0B1220; --cbp-muted: #6B7688; --cbp-surface: #ffffff; --cbp-soft: #F5F8FC; --cbp-accent: #0385FF; --cbp-accent-dk: #0270D9; color: var(--cbp-ink); } @media (prefers-color-scheme: dark) { .cbp[b-1vx8a3ixp7], .cbp-modal-scrim[b-1vx8a3ixp7], .cbp-prog[b-1vx8a3ixp7] { --cbp-line: rgba(148,163,184,.16); --cbp-ink: #F1F6FC; --cbp-muted: #8C99AC; --cbp-surface: #111B2F; --cbp-soft: #0E1728; --cbp-accent: #3D9EFF; --cbp-accent-dk: #5AB0FF; } } /* ── toolbar ─────────────────────────────────────────── */ .cbp-toolbar[b-1vx8a3ixp7] { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 16px; margin-bottom: 16px; flex-wrap: wrap; background: var(--cbp-soft); border: 1px solid var(--cbp-line); border-radius: 12px; position: sticky; top: 8px; z-index: 5; } .cbp-sel[b-1vx8a3ixp7] { display: flex; align-items: baseline; gap: 10px; } .cbp-of[b-1vx8a3ixp7] { color: var(--cbp-muted); font-size: 13px; } .cbp-actions[b-1vx8a3ixp7] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .cbp-order[b-1vx8a3ixp7] { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--cbp-muted); } .cbp-order select[b-1vx8a3ixp7], .cbp-field select[b-1vx8a3ixp7], .cbp-field input[b-1vx8a3ixp7] { background: var(--cbp-surface); color: var(--cbp-ink); border: 1px solid var(--cbp-line); border-radius: 8px; padding: 6px 8px; font-size: 13px; } .cbp-sep-toggle[b-1vx8a3ixp7] { font-size: 13px; color: var(--cbp-muted); } .cbp-check[b-1vx8a3ixp7] { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; } .cbp-check input[b-1vx8a3ixp7] { width: 16px; height: 16px; accent-color: var(--cbp-accent); } .cbp-btn[b-1vx8a3ixp7] { display: inline-flex; align-items: center; gap: 6px; background: var(--cbp-surface); color: var(--cbp-ink); border: 1px solid var(--cbp-line); border-radius: 8px; padding: 7px 12px; font-size: 13px; font-weight: 600; cursor: pointer; transition: .12s; } .cbp-btn:hover:not(:disabled)[b-1vx8a3ixp7] { border-color: var(--cbp-accent); color: var(--cbp-accent); } .cbp-btn:disabled[b-1vx8a3ixp7] { opacity: .45; cursor: not-allowed; } .cbp-btn-primary[b-1vx8a3ixp7] { background: var(--cbp-accent); color: #fff; border-color: var(--cbp-accent); } .cbp-btn-primary:hover:not(:disabled)[b-1vx8a3ixp7] { filter: brightness(1.08); color: #fff; } .cbp-ico[b-1vx8a3ixp7] { width: 15px; height: 15px; } /* ── payer sections ──────────────────────────────────── */ .cbp-payer[b-1vx8a3ixp7] { margin-bottom: 22px; border: 1px solid var(--cbp-line); border-radius: 12px; overflow: hidden; } .cbp-payer-head[b-1vx8a3ixp7] { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; background: var(--cbp-soft); border-bottom: 1px solid var(--cbp-line); flex-wrap: wrap; } .cbp-payer-name[b-1vx8a3ixp7] { font-weight: 700; font-size: 15px; } .cbp-payer-meta[b-1vx8a3ixp7] { font-size: 12.5px; color: var(--cbp-muted); display: flex; align-items: center; gap: 8px; } .cbp-tag[b-1vx8a3ixp7] { padding: 2px 8px; border-radius: 999px; font-weight: 600; font-size: 11px; } .cbp-tag-print[b-1vx8a3ixp7] { background: rgba(37,99,235,.12); color: var(--cbp-accent); } .cbp-tag-dl[b-1vx8a3ixp7] { background: rgba(16,185,129,.14); color: #059669; } .cbp-table[b-1vx8a3ixp7] { width: 100%; border-collapse: collapse; font-size: 13.5px; } .cbp-table th[b-1vx8a3ixp7] { text-align: left; font-weight: 600; font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--cbp-muted); padding: 8px 12px; border-bottom: 1px solid var(--cbp-line); } .cbp-table td[b-1vx8a3ixp7] { padding: 10px 12px; border-bottom: 1px solid var(--cbp-line); vertical-align: middle; } .cbp-table tr:last-child td[b-1vx8a3ixp7] { border-bottom: 0; } .cbp-row-sel[b-1vx8a3ixp7] { background: rgba(37,99,235,.05); } .cbp-c-check[b-1vx8a3ixp7] { width: 40px; } .cbp-c-amt[b-1vx8a3ixp7] { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; } .cbp-c-status[b-1vx8a3ixp7], .cbp-c-state[b-1vx8a3ixp7] { white-space: nowrap; } .cbp-rname[b-1vx8a3ixp7] { font-weight: 600; } .cbp-rtin[b-1vx8a3ixp7] { font-size: 12px; color: var(--cbp-muted); } .cbp-badge[b-1vx8a3ixp7] { padding: 3px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 600; } .cbp-badge-ok[b-1vx8a3ixp7] { background: rgba(16,185,129,.14); color: #059669; } .cbp-badge-warn[b-1vx8a3ixp7] { background: rgba(245,158,11,.16); color: #b45309; } .cbp-state[b-1vx8a3ixp7] { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; } .cbp-state .cbp-ico[b-1vx8a3ixp7] { width: 14px; height: 14px; } .cbp-state-print[b-1vx8a3ixp7] { color: var(--cbp-accent); } .cbp-state-dl[b-1vx8a3ixp7] { color: #059669; margin-left: 8px; } .cbp-state-ready[b-1vx8a3ixp7] { color: var(--cbp-muted); font-weight: 500; } .cbp-state-none[b-1vx8a3ixp7] { color: var(--cbp-muted); } .cbp-state-work[b-1vx8a3ixp7] { color: var(--cbp-muted); } /* ── empty ───────────────────────────────────────────── */ .cbp-empty[b-1vx8a3ixp7] { text-align: center; padding: 64px 24px; color: var(--cbp-muted); } .cbp-empty-mark[b-1vx8a3ixp7] { font-size: 40px; opacity: .5; } .cbp-empty h3[b-1vx8a3ixp7] { margin: 12px 0 6px; color: var(--cbp-ink); } .cbp-empty p[b-1vx8a3ixp7] { max-width: 440px; margin: 0 auto; font-size: 13.5px; line-height: 1.5; } /* ── spinner ─────────────────────────────────────────── */ .cbp-spin[b-1vx8a3ixp7] { width: 13px; height: 13px; border-radius: 50%; border: 2px solid rgba(127,127,127,.35); border-top-color: var(--cbp-accent); display: inline-block; animation: cbp-rot-b-1vx8a3ixp7 .7s linear infinite; } .cbp-spin-lg[b-1vx8a3ixp7] { width: 26px; height: 26px; border-width: 3px; } @keyframes cbp-rot-b-1vx8a3ixp7 { to { transform: rotate(360deg); } } /* ── preview modal ───────────────────────────────────── */ .cbp-modal-scrim[b-1vx8a3ixp7] { position: fixed; inset: 0; background: rgba(15,18,25,.55); backdrop-filter: blur(2px); display: flex; align-items: center; justify-content: center; z-index: 1000; padding: 24px; } .cbp-modal[b-1vx8a3ixp7] { background: var(--cbp-surface); color: var(--cbp-ink); width: min(1100px, 96vw); height: min(84vh, 860px); border-radius: 16px; border: 1px solid var(--cbp-line); box-shadow: 0 24px 60px rgba(0,0,0,.35); display: flex; flex-direction: column; overflow: hidden; } .cbp-modal-head[b-1vx8a3ixp7] { display: flex; align-items: flex-start; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--cbp-line); } .cbp-modal-head h2[b-1vx8a3ixp7] { margin: 0; font-size: 18px; } .cbp-modal-head p[b-1vx8a3ixp7] { margin: 3px 0 0; font-size: 12.5px; color: var(--cbp-muted); } .cbp-x[b-1vx8a3ixp7] { background: none; border: 0; font-size: 18px; color: var(--cbp-muted); cursor: pointer; line-height: 1; } .cbp-modal-body[b-1vx8a3ixp7] { flex: 1; display: grid; grid-template-columns: 280px 1fr; min-height: 0; } .cbp-settings[b-1vx8a3ixp7] { border-right: 1px solid var(--cbp-line); padding: 18px; overflow-y: auto; background: var(--cbp-soft); } .cbp-settings h4[b-1vx8a3ixp7] { margin: 4px 0 10px; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--cbp-muted); } .cbp-field[b-1vx8a3ixp7] { display: flex; flex-direction: column; gap: 5px; margin-bottom: 14px; font-size: 13px; } .cbp-field span[b-1vx8a3ixp7] { color: var(--cbp-muted); } .cbp-hint[b-1vx8a3ixp7] { font-size: 11.5px; color: var(--cbp-muted); line-height: 1.45; margin: 6px 0 16px; } .cbp-settings-foot[b-1vx8a3ixp7] { display: flex; gap: 8px; margin-top: 12px; } .cbp-settings-foot .cbp-btn[b-1vx8a3ixp7] { flex: 1; justify-content: center; } .cbp-preview-pane[b-1vx8a3ixp7] { position: relative; background: #52565c; min-height: 0; } .cbp-preview-pane iframe[b-1vx8a3ixp7] { width: 100%; height: 100%; border: 0; } .cbp-preview-loading[b-1vx8a3ixp7] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 12px; background: rgba(20,22,26,.55); color: #fff; font-size: 13.5px; z-index: 2; } /* ── progress mini-player ────────────────────────────── */ .cbp-prog[b-1vx8a3ixp7] { position: fixed; right: 22px; bottom: 22px; width: 340px; z-index: 1100; background: var(--cbp-surface); color: var(--cbp-ink); border: 1px solid var(--cbp-line); border-radius: 14px; box-shadow: 0 18px 44px rgba(0,0,0,.32); overflow: hidden; animation: cbp-pop-b-1vx8a3ixp7 .18s ease; } .cbp-prog-min[b-1vx8a3ixp7] { width: 240px; } @keyframes cbp-pop-b-1vx8a3ixp7 { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } } .cbp-prog-head[b-1vx8a3ixp7] { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; background: var(--cbp-soft); } .cbp-prog-title[b-1vx8a3ixp7] { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; } .cbp-prog-dot[b-1vx8a3ixp7] { width: 10px; height: 10px; border-radius: 50%; display: inline-block; } .cbp-prog-dot-ok[b-1vx8a3ixp7] { background: #10b981; } .cbp-prog-btns[b-1vx8a3ixp7] { display: flex; gap: 4px; } .cbp-prog-btn[b-1vx8a3ixp7] { background: none; border: 0; color: var(--cbp-muted); cursor: pointer; font-size: 13px; width: 24px; height: 24px; border-radius: 6px; } .cbp-prog-btn:hover[b-1vx8a3ixp7] { background: rgba(127,127,127,.15); color: var(--cbp-ink); } .cbp-prog-body[b-1vx8a3ixp7] { padding: 12px 14px 14px; } .cbp-prog-bar[b-1vx8a3ixp7] { height: 6px; border-radius: 999px; background: rgba(127,127,127,.2); overflow: hidden; } .cbp-prog-fill[b-1vx8a3ixp7] { height: 100%; background: var(--cbp-accent); border-radius: 999px; transition: width .25s ease; } .cbp-prog-label[b-1vx8a3ixp7] { margin-top: 8px; font-size: 12px; color: var(--cbp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } @media (max-width: 720px) { .cbp-modal-body[b-1vx8a3ixp7] { grid-template-columns: 1fr; } .cbp-settings[b-1vx8a3ixp7] { border-right: 0; border-bottom: 1px solid var(--cbp-line); max-height: 40%; } } /* /Components/Shared/ResultBlock.razor.rz.scp.css */ .code-wrap[b-ridk2xi5uf] { position: relative; } /* Copy button — floats top-right over the code block */ .copy-btn[b-ridk2xi5uf] { position: absolute; top: 8px; right: 8px; z-index: 2; display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; font-size: .72rem; font-weight: 600; line-height: 1; letter-spacing: .02em; color: var(--text-2, #cbd5e1); background: rgba(15, 23, 42, .78); border: 1px solid rgba(148, 163, 184, .32); border-radius: 6px; cursor: pointer; opacity: .55; transition: opacity .12s ease, background .12s ease, color .12s ease, border-color .12s ease, transform .06s ease; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); } .code-wrap:hover .copy-btn[b-ridk2xi5uf], .copy-btn:focus-visible[b-ridk2xi5uf] { opacity: 1; } .copy-btn:hover[b-ridk2xi5uf] { background: rgba(51, 65, 85, .95); color: #fff; border-color: rgba(148, 163, 184, .6); } .copy-btn:active[b-ridk2xi5uf] { transform: translateY(1px); } .copy-btn.copied[b-ridk2xi5uf] { opacity: 1; color: #052e16; background: #4ade80; border-color: #22c55e; cursor: default; } .copy-btn:focus-visible[b-ridk2xi5uf] { outline: 2px solid #60a5fa; outline-offset: 2px; } /* A touch of polish on the code block itself */ .result-body[b-ridk2xi5uf] { max-height: 460px; overflow: auto; border-radius: 8px; scrollbar-width: thin; scroll-padding-top: 40px; } .result-body[b-ridk2xi5uf]::-webkit-scrollbar { width: 10px; height: 10px; } .result-body[b-ridk2xi5uf]::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, .35); border-radius: 6px; } .result-body[b-ridk2xi5uf]::-webkit-scrollbar-thumb:hover { background: rgba(148, 163, 184, .55); } /* /Components/Shared/YearReadinessBanner.razor.rz.scp.css */ .yr-banner[b-hdr3z0rp3i] { display: flex; gap: .75rem; align-items: flex-start; padding: .75rem 1rem; border-radius: 10px; margin: 0 0 1rem 0; font-size: .9rem; line-height: 1.35; border: 1px solid transparent; } .yr-blocked[b-hdr3z0rp3i] { background: #fef2f2; border-color: #fecaca; color: #991b1b; } .yr-sandbox[b-hdr3z0rp3i] { background: #fffbeb; border-color: #fde68a; color: #92400e; } .yr-ic[b-hdr3z0rp3i] { font-size: 1.15rem; line-height: 1; } .yr-body[b-hdr3z0rp3i] { display: flex; flex-direction: column; gap: .15rem; } .yr-body strong[b-hdr3z0rp3i] { font-weight: 600; } @media (prefers-color-scheme: dark) { .yr-blocked[b-hdr3z0rp3i] { background: #2a1414; border-color: #7f1d1d; color: #fca5a5; } .yr-sandbox[b-hdr3z0rp3i] { background: #2a2410; border-color: #78560f; color: #fcd34d; } }