1/* =Tooltips 2----------------------------------------------- */ 3 4.tooltip { 5 position: absolute; 6 display: none; /* Initially hidden, shown on hover */ 7 z-index: 1000000; /* Ensure it appears above other content */ 8} 9 10.tooltip-text { 11 background-color: @ini_tooltips_background_color; /* Replace with actual color value */ 12 color: @ini_tooltips_text_color; /* Replace with actual color value */ 13 text-align: center; 14 border-radius: 20px; 15 padding: 8px 16px; 16 /* Adjustments for the tooltip text itself */ 17 white-space: nowrap; 18 font-size: 12px; 19 font-weight: normal; 20 border: 2px solid @ini_tooltips_border_color; /* Replace with actual color value */ 21 /* Positioning now mainly handled by JS, so no need for left/transform here */ 22} 23.tooltip-text::after { 24 content: ""; 25 position: absolute; 26 bottom: 100%; /* Position the caret at the top of the tooltip box */ 27 left: 50%; 28 border-width: 5px; 29 border-style: solid; 30 border-color: transparent transparent @ini_tooltips_border_color transparent; /* The tip points upwards */ 31 transform: translateX(-50%); 32} 33