.ab-bar {
  width: 100%;
  box-sizing: border-box;
  z-index: 9999;
}

.ab-pos-fixed_top {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

.ab-pos-fixed_bottom {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}

.ab-content {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: space-between;
}


.ab-text {
  font-size: var(--ab-text-size, 16px);
  line-height: 1.4;
  text-align: var(--ab-text-align, left);
  flex: 1 1 200px;
  min-width: 0;
}

.ab-close {
  margin-left: 8px;
  border: 0;
  background: transparent;
  color: currentColor;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 4px 6px;
  opacity: 0.8;
}

.ab-close:hover {
  opacity: 1;
}

.ab-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  border-radius: var(--ab-btn-radius, 6px);
  background: var(--ab-btn-bg, #ffffff);
  color: var(--ab-btn-color, #222222);
  border-width: var(--ab-btn-border-width, 0px);
  border-style: var(--ab-btn-border-style, solid);
  border-color: var(--ab-btn-border-color, #222222);
  box-shadow: var(--ab-btn-shadow, none);
  text-decoration: none;
  transition: background 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.ab-btn:hover {
  background: var(--ab-btn-hover-bg, var(--ab-btn-bg, #ffffff));
  color: var(--ab-btn-hover-color, var(--ab-btn-color, #222222));
  text-decoration: none;
  transform: translateY(-1px);
}

.ab-effect-flash {
  animation: abFlash var(--ab-effect-speed, 1000ms) infinite;
}

.ab-effect-wobble {
  animation: abWobble var(--ab-effect-speed, 1200ms) ease-in-out infinite;
  display: inline-block;
}

.ab-effect-pulse {
  animation: abPulse var(--ab-effect-speed, 1200ms) ease-in-out infinite;
}

.ab-effect-bounce {
  animation: abBounce var(--ab-effect-speed, 1200ms) ease-in-out infinite;
  display: inline-block;
}

.ab-effect-shake {
  animation: abShake var(--ab-effect-speed, 900ms) ease-in-out infinite;
  display: inline-block;
}

.ab-effect-slide {
  animation: abSlide var(--ab-effect-speed, 1400ms) ease-in-out infinite;
  display: inline-block;
}

@keyframes abFlash {
  0%, 50%, 100% { opacity: 1; }
  25%, 75% { opacity: 0.3; }
}

@keyframes abWobble {
  0% { transform: rotate(0deg); }
  25% { transform: rotate(-2deg); }
  50% { transform: rotate(2deg); }
  75% { transform: rotate(-1deg); }
  100% { transform: rotate(0deg); }
}

@keyframes abPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.03); }
}

@keyframes abBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

@keyframes abShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-3px); }
  40% { transform: translateX(3px); }
  60% { transform: translateX(-2px); }
  80% { transform: translateX(2px); }
}

@keyframes abSlide {
  0% { transform: translateX(0); opacity: 1; }
  50% { transform: translateX(6px); opacity: 0.7; }
  100% { transform: translateX(0); opacity: 1; }
}

@media (max-width: 720px) {
  .ab-text {
    font-size: var(--ab-text-size-mobile, 15px);
  }
  .ab-content {
    justify-content: center;
  }
}