/* Mirrors src/index.ts chrome constants — keep in sync; single-sourcing is a fast-follow. */ /* LOGIN_WIDGET_CSS */ #login-widget { position: relative; display: inline-flex; align-items: center; font-size: 0.85rem; visibility: hidden; } #login-widget.ready { visibility: visible; } #login-widget .signin-btn { color: white; text-decoration: none; background: #c8102e; padding: 4px 12px; border-radius: 4px; font-weight: 500; font-size: 0.8rem; } #login-widget .signin-btn:hover { background: #a30f26; } #login-widget .avatar { width: 30px; height: 30px; border-radius: 50%; background: #6366f1; color: white; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 0.75rem; cursor: pointer; border: none; } #login-widget .avatar:hover { background: #4f46e5; } #login-widget .menu { position: absolute; top: 36px; right: 0; background: white; border: 1px solid #e2e8f0; border-radius: 6px; box-shadow: 0 4px 12px rgba(0,0,0,0.08); min-width: 260px; z-index: 1000; display: none; overflow: hidden; } #login-widget.menu-open .menu { display: block; } #login-widget .menu-email { padding: 10px 12px 4px 12px; font-size: 0.75rem; color: #64748b; word-break: break-word; } #login-widget .menu-via { padding: 0 12px 10px 12px; font-size: 0.7rem; color: #94a3b8; border-bottom: 1px solid #e2e8f0; display: flex; gap: 5px; align-items: center; flex-wrap: wrap; } #login-widget .menu-via-label { font-style: italic; } #login-widget .provider-chip { display: inline-block; font-size: 0.65rem; padding: 1px 6px; border-radius: 8px; background: #fdf2f4; color: #3730a3; border: 1px solid #f3c3ca; font-weight: 500; white-space: nowrap; } #login-widget .menu-item { padding: 8px 12px; display: flex; align-items: center; gap: 8px; color: #334155; text-decoration: none; font-size: 0.85rem; cursor: pointer; } #login-widget .menu-item:hover { background: #f1f5f9; } #login-widget .menu-item-muted { color: #94a3b8; cursor: default; font-style: italic; } #login-widget .menu-item-muted:hover { background: transparent; } /* TOP_NAV_CSS */ .top-nav { background: white; border-bottom: 1px solid #e2e8f0; padding: 12px 0; position: sticky; top: 0; z-index: 200; } .top-nav-inner { max-width: 1100px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; gap: 8px; } .top-nav-brand { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; color: #1e293b; text-decoration: none; font-size: 1rem; padding: 4px 0; } .top-nav-brand svg { flex: none; } .top-nav-brand:hover { color: #c8102e; } .top-nav-links { display: flex; gap: 4px; margin-left: 16px; flex: 1; } .top-nav-links a { color: #475569; text-decoration: none; font-size: 0.9rem; padding: 6px 10px; border-radius: 4px; } .top-nav-links a:hover { color: #c8102e; background: #f1f5f9; } .top-nav-right { display: flex; align-items: center; gap: 8px; } .tenant-chip-wrap { position: relative; display: none; } .tenant-chip-wrap.ready { display: inline-flex; } .tenant-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; background: #f1f5f9; border: 1px solid #cbd5e1; border-radius: 6px; cursor: pointer; font: inherit; font-size: 0.85rem; color: #1e293b; } .tenant-chip:hover, .tenant-chip[aria-expanded="true"] { background: #fbe7ea; border-color: #eeb0b8; } .tenant-chip-kind { font-size: 0.75rem; color: #64748b; } .tenant-chip-name { font-weight: 500; } .tenant-menu { display: none; position: absolute; right: 0; top: calc(100% + 4px); z-index: 250; background: white; border: 1px solid #cbd5e1; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.08); min-width: 240px; padding: 6px 0; } .tenant-menu.open { display: block; } .tenant-menu-item { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; cursor: pointer; text-decoration: none; color: #1e293b; font-size: 0.85rem; } .tenant-menu-item:hover { background: #f1f5f9; } .tenant-menu-item.active { background: #fbe7ea; color: #c8102e; } .tenant-menu-item-name { flex: 1; } .tenant-menu-item-role { font-size: 0.7rem; color: #64748b; text-transform: uppercase; letter-spacing: 0.04em; } .tenant-menu-divider { height: 1px; background: #e2e8f0; margin: 4px 0; } .tenant-menu-link { display: block; padding: 8px 12px; color: #475569; text-decoration: none; font-size: 0.85rem; } .tenant-menu-link:hover { background: #f1f5f9; color: #c8102e; } @media (max-width: 600px) { .top-nav-links { gap: 0; margin-left: 8px; } .top-nav-links a { padding: 6px 6px; font-size: 0.85rem; } .top-nav-brand { font-size: 0.9rem; } .tenant-chip-kind { display: none; } } /* FOOTER_CSS */ .site-footer { margin-top: 64px; padding: 32px 0 24px 0; border-top: 1px solid #e2e8f0; color: #64748b; font-size: 0.85rem; } .site-footer-inner { max-width: 1100px; margin: 0 auto; padding: 0 20px; display: flex; flex-wrap: wrap; gap: 32px 48px; align-items: flex-start; } .site-footer-col h4 { margin: 0 0 8px 0; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: #94a3b8; font-weight: 600; } .site-footer-col a { display: block; color: #475569; text-decoration: none; padding: 4px 0; } .site-footer-col a:hover { color: #c8102e; text-decoration: underline; } .site-footer-bottom { max-width: 1100px; margin: 24px auto 0 auto; padding: 16px 20px 0 20px; border-top: 1px solid #f1f5f9; color: #94a3b8; font-size: 0.75rem; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; } .site-footer-version { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.7rem; color: #cbd5e1; cursor: help; } /* Base page styles (from renderStaticPage inline