/* Banner Manager Styles */

.aiod-banner-wrapper {
  margin: 0;
  padding: 0;
}

.aiod-discount-banner {
  font-family: inherit;
  line-height: 1.3;
  word-wrap: break-word;
}

.aiod-discount-banner svg {
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
}

/* Widget container styles */
.aiod-widget-container {
  width: 100% !important;
}

.aiod-widget-container-page,
.aiod-widget-container-cart-page,
.aiod-widget-container-side-cart,
.aiod-progress-bar-container-side-cart,
.aiod-progress-bar-container-product-page {
  width: 100% !important;
  padding: 0 !important;
  margin: 0;
}

/* Goal-based widget styles */
.aiod-progress-bar-widget {
  font-family: inherit !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 5px !important;
  padding-bottom: 48px !important;
}

.aiod-progress-bar-container-side-cart {
  padding-right: 5px !important;
}

.aiod-goal-banner-wrapper {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.aiod-goal-remaining-message {
  word-wrap: break-word !important;
  text-align: center !important;
  font-size: 14px !important;
  margin-bottom: 8px !important;
  font-weight: 500 !important;
}

.aiod-goal-success-message {
  display: inline-block !important;
  background-color: var(--success-bg-color, #C3FFC3) !important;
  border-radius: 5px !important;
  padding: 0px 7px !important;
  text-align: center !important;
  width: fit-content !important;
}

.aiod-goal-progress-container {
  box-sizing: border-box !important;
  position: relative !important;
  width: 100% !important;
}

.aiod-goal-markers-wrapper {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: var(--markers-columns, repeat(auto-fit, minmax(0, 1fr))) !important;
  justify-items: var(--markers-justify-items, center) !important;
  position: relative !important;
  z-index: 2 !important;
}

.aiod-goal-marker {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: var(--goal-marker-align, center) !important;
}

.aiod-goal-icon-wrapper {
  box-sizing: border-box !important;
  width: fit-content !important;
  height: fit-content !important;
  padding: 5px !important;
  border-radius: 50% !important;
  background-color: var(--icon-bg-color) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 8px !important;
}

.aiod-goal-icon {
  box-sizing: border-box !important;
  width: var(--icon-size, 24px) !important;
  max-width: var(--icon-size, 24px) !important;
  height: var(--icon-size, 24px) !important;
  color: var(--icon-color) !important;
}

.aiod-goal-icon svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

.aiod-goal-title {
  word-wrap: break-word !important;
  box-sizing: border-box !important;
  font-size: var(--goal-title-font-size, 11px) !important;
  font-weight: 600 !important;
  line-height: 16px !important;
  color: var(--goal-title-color, #303030) !important;
  text-align: var(--goal-title-align, center) !important;
  width: var(--goal-title-width, 150px) !important;
  max-width: var(--goal-title-width, 150px) !important;
  position: absolute !important;
  top: var(--goal-title-top, 48px) !important;
}

.aiod-progress-bar-bg {
  box-sizing: border-box !important;
  height: 9px !important;
  background-color: var(--progress-bg-color, #E0E3F0) !important;
  border-radius: 40px !important;
  position: absolute !important;
  top: var(--progress-bar-top, 12px) !important;
  left: 0 !important;
  right: 0 !important;
  overflow: hidden !important;
  z-index: 1 !important;
}

.aiod-progress-bar-fill {
  display: block !important;
  box-sizing: border-box !important;
  height: 100% !important;
  width: var(--progress-fill-width, 0%) !important;
  background-color: var(--progress-fill-color, #00BE00) !important;
  border-radius: 4px !important;
  transition: width 0.3s ease !important;
}