/**
 * Tooltip Styles for Frontend
 */

.tinymce-tooltip {
  position: relative;
  cursor: help;
  border-bottom: 1px dashed #333;
  text-decoration: none;
}

.tinymce-tooltip:hover::after {
  content: attr(data-tooltip);
  position: absolute;
  padding: 8px 12px;
  background: #333;
  color: #fff;
  border-radius: 4px;
  white-space: nowrap;
  z-index: 1000;
  font-size: 14px;
  line-height: 1.4;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.tinymce-tooltip:hover::before {
  content: "";
  position: absolute;
  border: 6px solid transparent;
  z-index: 1001;
}

/* Position: Top (default) */
.tinymce-tooltip.tooltip-pos-top:hover::after {
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 8px;
}

.tinymce-tooltip.tooltip-pos-top:hover::before {
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-top-color: #333;
  margin-bottom: 2px;
}

/* Position: Bottom */
.tinymce-tooltip.tooltip-pos-bottom:hover::after {
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 8px;
}

.tinymce-tooltip.tooltip-pos-bottom:hover::before {
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-bottom-color: #333;
  margin-top: 2px;
}

/* Position: Left */
.tinymce-tooltip.tooltip-pos-left:hover::after {
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-right: 8px;
}

.tinymce-tooltip.tooltip-pos-left:hover::before {
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
  border-left-color: #333;
  margin-right: 2px;
}

/* Position: Right */
.tinymce-tooltip.tooltip-pos-right:hover::after {
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 8px;
}

.tinymce-tooltip.tooltip-pos-right:hover::before {
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  border-right-color: #333;
  margin-left: 2px;
}

/* Light Style */
.tinymce-tooltip.tooltip-style-light {
  border-bottom-color: #999;
}

.tinymce-tooltip.tooltip-style-light:hover::after {
  background: #fff;
  color: #333;
  border: 1px solid #ddd;
}

.tinymce-tooltip.tooltip-style-light.tooltip-pos-top:hover::before,
.tinymce-tooltip.tooltip-style-light.tooltip-pos-bottom:hover::before,
.tinymce-tooltip.tooltip-style-light.tooltip-pos-left:hover::before,
.tinymce-tooltip.tooltip-style-light.tooltip-pos-right:hover::before {
  border-color: transparent;
}

.tinymce-tooltip.tooltip-style-light.tooltip-pos-top:hover::before {
  border-top-color: #ddd;
}

.tinymce-tooltip.tooltip-style-light.tooltip-pos-bottom:hover::before {
  border-bottom-color: #ddd;
}

.tinymce-tooltip.tooltip-style-light.tooltip-pos-left:hover::before {
  border-left-color: #ddd;
}

.tinymce-tooltip.tooltip-style-light.tooltip-pos-right:hover::before {
  border-right-color: #ddd;
}

/* Info Style (Blue) */
.tinymce-tooltip.tooltip-style-info {
  border-bottom-color: #2196F3;
}

.tinymce-tooltip.tooltip-style-info:hover::after {
  background: #2196F3;
}

.tinymce-tooltip.tooltip-style-info.tooltip-pos-top:hover::before {
  border-top-color: #2196F3;
}

.tinymce-tooltip.tooltip-style-info.tooltip-pos-bottom:hover::before {
  border-bottom-color: #2196F3;
}

.tinymce-tooltip.tooltip-style-info.tooltip-pos-left:hover::before {
  border-left-color: #2196F3;
}

.tinymce-tooltip.tooltip-style-info.tooltip-pos-right:hover::before {
  border-right-color: #2196F3;
}

/* Success Style (Green) */
.tinymce-tooltip.tooltip-style-success {
  border-bottom-color: #4CAF50;
}

.tinymce-tooltip.tooltip-style-success:hover::after {
  background: #4CAF50;
}

.tinymce-tooltip.tooltip-style-success.tooltip-pos-top:hover::before {
  border-top-color: #4CAF50;
}

.tinymce-tooltip.tooltip-style-success.tooltip-pos-bottom:hover::before {
  border-bottom-color: #4CAF50;
}

.tinymce-tooltip.tooltip-style-success.tooltip-pos-left:hover::before {
  border-left-color: #4CAF50;
}

.tinymce-tooltip.tooltip-style-success.tooltip-pos-right:hover::before {
  border-right-color: #4CAF50;
}

/* Warning Style (Orange) */
.tinymce-tooltip.tooltip-style-warning {
  border-bottom-color: #FF9800;
}

.tinymce-tooltip.tooltip-style-warning:hover::after {
  background: #FF9800;
}

.tinymce-tooltip.tooltip-style-warning.tooltip-pos-top:hover::before {
  border-top-color: #FF9800;
}

.tinymce-tooltip.tooltip-style-warning.tooltip-pos-bottom:hover::before {
  border-bottom-color: #FF9800;
}

.tinymce-tooltip.tooltip-style-warning.tooltip-pos-left:hover::before {
  border-left-color: #FF9800;
}

.tinymce-tooltip.tooltip-style-warning.tooltip-pos-right:hover::before {
  border-right-color: #FF9800;
}

/* Error Style (Red) */
.tinymce-tooltip.tooltip-style-error {
  border-bottom-color: #F44336;
}

.tinymce-tooltip.tooltip-style-error:hover::after {
  background: #F44336;
}

.tinymce-tooltip.tooltip-style-error.tooltip-pos-top:hover::before {
  border-top-color: #F44336;
}

.tinymce-tooltip.tooltip-style-error.tooltip-pos-bottom:hover::before {
  border-bottom-color: #F44336;
}

.tinymce-tooltip.tooltip-style-error.tooltip-pos-left:hover::before {
  border-left-color: #F44336;
}

.tinymce-tooltip.tooltip-style-error.tooltip-pos-right:hover::before {
  border-right-color: #F44336;
}