.text-divider { display: flex; align-items: center; gap: 0.75rem; /* 12px */ margin-top: 0.375rem; /* 6px */ margin-bottom: 0.5rem; /* 8px */ } .text-divider .text-divider__rule { height: 0.0625rem; /* 1px */ flex: 1 1 0%; background-color: rgb(var(--text-divider-rule-rgb, var(--gray-200)) / var(--text-divider-opacity, 1)); } .text-divider .text-divider__label { color: rgb(var(--text-divider-label-rgb, var(--gray-400)) / var(--text-divider-opacity, 1)); font-size: 0.75rem; /* 12px */ white-space: nowrap; } .text-divider.subcategory { margin-top: 0; margin-bottom: 0; } .text-divider.subcategory .text-divider__rule { background-color: var(--tool-subcategory-rule-color); } .text-divider.subcategory .text-divider__label { color: var(--tool-subcategory-text-color); text-transform: uppercase; font-weight: 600; } /* Force light theme colors regardless of dark mode */ .text-divider.force-light .text-divider__rule { background-color: rgb(var(--text-divider-rule-rgb-light, var(--gray-200)) / var(--text-divider-opacity, 1)); } .text-divider.force-light .text-divider__label { color: rgb(var(--text-divider-label-rgb-light, var(--gray-400)) / var(--text-divider-opacity, 1)); } .text-divider.subcategory.force-light .text-divider__rule { background-color: var(--tool-subcategory-rule-color-light); } .text-divider.subcategory.force-light .text-divider__label { color: var(--tool-subcategory-text-color-light); }