/** * PipexERP Brand Bar * 统一品牌条样式 - 用于在各子系统顶部显示 */ .pipex-brand-bar { display: flex; align-items: center; justify-content: space-between; height: 48px; padding: 0 24px; background: linear-gradient(135deg, #52c41a 0%, #389e0d 100%); color: white; font-family: var(--pipex-font-family, 'Segoe UI', -apple-system, sans-serif); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); position: relative; z-index: 1000; } .pipex-brand-bar--dark { background: linear-gradient(135deg, #135200 0%, #237804 100%); } .pipex-brand-bar__logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: white; } .pipex-brand-bar__icon { width: 28px; height: 28px; } .pipex-brand-bar__title { font-size: 16px; font-weight: 600; letter-spacing: 0.5px; } .pipex-brand-bar__divider { width: 1px; height: 20px; background: rgba(255, 255, 255, 0.4); margin: 0 12px; } .pipex-brand-bar__subtitle { font-size: 14px; font-weight: 500; opacity: 0.9; } .pipex-brand-bar__nav { display: flex; align-items: center; gap: 24px; } .pipex-brand-bar__link { color: white; text-decoration: none; font-size: 14px; opacity: 0.85; transition: opacity 0.2s ease; } .pipex-brand-bar__link:hover { opacity: 1; } .pipex-brand-bar__badge { display: inline-flex; align-items: center; padding: 4px 10px; background: rgba(255, 255, 255, 0.2); border-radius: 12px; font-size: 12px; font-weight: 500; } /* Footer Brand */ .pipex-brand-footer { display: flex; align-items: center; justify-content: center; padding: 16px; gap: 8px; font-size: 13px; color: var(--pipex-text-tertiary, #999); border-top: 1px solid var(--pipex-border, #e8e8e8); } .pipex-brand-footer__logo { width: 20px; height: 20px; } .pipex-brand-footer a { color: var(--pipex-primary, #52c41a); text-decoration: none; } .pipex-brand-footer a:hover { text-decoration: underline; } /* Compact Brand Tag */ .pipex-brand-tag { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; background: var(--pipex-primary-bg, rgba(82, 196, 26, 0.1)); border: 1px solid var(--pipex-primary, #52c41a); border-radius: 16px; font-size: 12px; font-weight: 500; color: var(--pipex-primary, #52c41a); } .pipex-brand-tag__icon { width: 14px; height: 14px; } /* Responsive */ @media (max-width: 768px) { .pipex-brand-bar { padding: 0 16px; height: 44px; } .pipex-brand-bar__title { font-size: 14px; } .pipex-brand-bar__subtitle { font-size: 12px; } .pipex-brand-bar__nav { display: none; } }