/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* 2026-02 Redprick:
   Text Editor widget – dynamic single-line text scaling.
   Uses textFit.js library to automatically resize text to fit container width
   without wrapping. As viewport/container shrinks or expands, text scales
   proportionally to always stay on one line. Handles dynamic shortcode content
   (usernames, roles) that vary in length. Requires custom class 
   'fit-text-single-line' on the Text Editor widget. */

<!-- Load textFit library from CDN -->
<script src="https://cdn.jsdelivr.net/npm/textfit@2.4.0/textFit.min.js"></script>

<script>
/* 2026-02 Redprick:
   Initialize textFit on page load and resize events.
   - Targets element with class 'fit-text-single-line'
   - multiLine: false = forces single line, no wrapping
   - widthOnly: true = scales based on width, ignores height
   - minFontSize: 8 = prevents text from becoming unreadable
   - maxFontSize: 60 = prevents text from becoming too large
   - reProcess: true on resize = recalculates font size when window resizes */
document.addEventListener('DOMContentLoaded', function() {
  const el = document.querySelector('.fit-text-single-line');
  if(el) {
    textFit(el, {multiLine: false, widthOnly: true, minFontSize: 8, maxFontSize: 60});
    window.addEventListener('resize', function() { textFit(el, {reProcess: true}); });
  }
});
</script>