diff --git a/assets/tooltip/tooltip.css b/assets/tooltip/tooltip.css
index e4772a0..29c1582 100644
--- a/assets/tooltip/tooltip.css
+++ b/assets/tooltip/tooltip.css
@@ -81,19 +81,23 @@
     border-width: var(--kit-tooltip-border-width) 0 0 var(--kit-tooltip-border-width);
 }
 /*right*/
-.kit-tooltip-right, .kit-tooltip-auto[x-placement^="right"] {
+.kit-tooltip-right, .kit-tooltip-auto[x-placement^="right"], .kit-tooltip-end {
     padding: 0 calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * (var(--math-sqrt-2) - 1));
 }
 
-.kit-tooltip-right .tooltip-arrow, .kit-tooltip-auto[x-placement^="right"] .tooltip-arrow {
+.kit-tooltip-right .arrow,
+.kit-tooltip-auto[x-placement^="right"] .arrow,
+.kit-tooltip-end .tooltip-arrow {
     left: 0;
     width: calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
     height: calc(var(--kit-tooltip-arrow-width) * var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
     top: 50% !important;
-    transform: translate(0px, -50%);
+    transform: translate(0px, -50%) !important;
 }
 
-.kit-tooltip-right .tooltip-arrow::before, .kit-tooltip-auto[x-placement^="right"] .tooltip-arrow::before {
+.kit-tooltip-right .arrow::before,
+.kit-tooltip-auto[x-placement^="right"] .arrow::before,
+.kit-tooltip-end .tooltip-arrow::before {
     left: 0px;
     top: 50%;
     transform: rotate(
@@ -110,7 +114,7 @@
     padding: calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * (var(--math-sqrt-2) - 1)) 0;
 }
 
-.kit-tooltip-bottom .tooltip-arrow, .kit-tooltip-auto[x-placement^="bottom"] .tooltip-arrow {
+.kit-tooltip-bottom .tooltip-arrow, .kit-tooltip-auto[x-placement^="bottom"] .arrow {
     top: 0;
     width: calc(var(--kit-tooltip-arrow-width) * var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
     height: calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
@@ -118,7 +122,7 @@
     /*transform: translate(-50%, 0);*/
 }
 
-.kit-tooltip-bottom .tooltip-arrow::before, .kit-tooltip-auto[x-placement^="bottom"] .tooltip-arrow::before {
+.kit-tooltip-bottom .tooltip-arrow::before, .kit-tooltip-auto[x-placement^="bottom"] .arrow::before {
     top: 0;
     left: 50%;
     transform: rotate(
@@ -135,12 +139,12 @@
 /*left*/
 .kit-tooltip-left,
 .kit-tooltip-auto[x-placement^="left"],
-.kit-tooltip-start[data-popper-placement^="left"] {
+.kit-tooltip-start {
     padding: 0 calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * (var(--math-sqrt-2) - 1));
 }
 
-.kit-tooltip-left .tooltip-arrow, .kit-tooltip-auto[x-placement^="left"] .tooltip-arrow,
-.kit-tooltip-start[data-popper-placement^="left"] .tooltip-arrow {
+.kit-tooltip-left .arrow, .kit-tooltip-auto[x-placement^="left"] .arrow,
+.kit-tooltip-start .tooltip-arrow {
     right: 0;
     width: calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
     height: calc(var(--kit-tooltip-arrow-width) * var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
@@ -148,9 +152,9 @@
     transform: translate(0px, -50%) !important;
 }
 
-.kit-tooltip-left .tooltip-arrow::before,
-.kit-tooltip-auto[x-placement^="left"] .tooltip-arrow::before,
-.kit-tooltip-start[data-popper-placement^="left"] .tooltip-arrow::before {
+.kit-tooltip-left .arrow::before,
+.kit-tooltip-auto[x-placement^="left"] .arrow::before,
+.kit-tooltip-start .tooltip-arrow::before {
     right: 0;
     top: 50%;
     transform: rotate(